@charset "utf-8";
:root {
	--gray: rgb(244,245,247,1);
	--gray-dark-10: rgb(219,220,222);
	--gray-dark-20: rgb(193,194,196);
	--gray-dark-30: rgb(168,169,171);
	--gray-dark-40: rgb(142,143,145);
	--gray-dark-50: rgb(117,118,120);
	--orange: rgb(242,159,103);
	--orange-light-10: rgb(255,185,129);
	--orange-light-20: rgb(255,210,154);
	--orange-light-30: rgb(255,236,180);
	--orange-dark-10: rgb(217,134,78);
	--orange-dark-20: rgb(191,108,52);
	--orange-dark-30: rgb(166,83,27);
	--black: rgb(30,30,44);
	--black-light-10: rgb(56,56,70);
	--black-light-20: rgb(81,81,95);
	--black-light-30: rgb(107,107,121);
	--black-dark-10: rgb(5,5,19);
	--blue: rgb(59,143,243);
	--blue-light-10: rgb(85,169,255);
	--blue-light-20: rgb(110,194,255);
	--blue-light-30: rgb(136,220,255);
	--blue-light-40: rgb(161,245,255);
	--blue-dark-10: rgb(34,118,218);
	--blue-dark-20: rgb(8,92,192);
	--blue-dark-30: rgb(0,67,167);
	--green: rgb(52,177,170);
	--green-light-10: rgb(78,203,196);
	--green-light-20: rgb(103,228,221);
	--green-light-30: rgb(129,254,247);
	--green-dark-10: rgb(27,152,145);
	--green-dark-20: rgb(1,126,119);
	--green-dark-30: rgb(0,101,94);
	--gold: rgb(224,190,15);
	--gold-light-10: rgb(250,216,41);
	--gold-light-20: rgb(255,241,66);
	--gold-light-30: rgb(255,255,92);
	--gold-dark-10: rgb(199,165,0);
	--gold-dark-20: rgb(173,139,0);
	--gold-dark-30: rgb(148,114,0);
	--primary: rgb(31,59,179);
	--primary-light-10: rgb(57,85,205);
	--primary-light-20: rgb(82,110,230);
	--primary-light-30: rgb(108,136,255);
	--primary-light-40: rgb(133,161,255);
	--primary-light-50: rgb(158,186,255);
	--primary-dark-10: rgb(0,34,154);
	--primary-dark-20: rgb(0,8,128);
	--primary-dark-30: rgb(0,0,103);
	--secondary: rgb(5,206,248);
	--secondary-light-10: rgb(31,232,255);
	--secondary-light-20: rgb(56,255,255);
	--secondary-light-30: rgb(82,255,255);
	--secondary-dark-10: rgb(0,181,223);
	--secondary-dark-20: rgb(0,155,197);
	--secondary-dark-30: rgb(0,130,172);
	--danger: rgb(249,95,94);
	--danger-light-10: rgb(255,121,120);
	--danger-light-20: rgb(255,146,145);
	--danger-light-30: rgb(255,172,171);
	--danger-light-40: rgb(255,197,196);
	--danger-light-50: rgb(255,222,221);
	--danger-dark-10: rgb(224,70,69);
	--danger-dark-20: rgb(198,44,43);
	--danger-dark-30: rgb(173,19,18);
	--text-color: var(--black);
	--font-family: "Manrope", sans-serif;
	--font-light: 200;
	--font-regular: 400;
	--font-bold: 600;
	--font-heavy: 800;
	--sidebar-width: 260px;
	--body-bg: var(--gray);	
}

button.nav-link {
	color: #000;
	background-color: #ececec;
}

.btn-primary, button.nav-link.active {
	color: #fff !important;
	background-color: var(--primary) !important;
}
.btn-primary:focus, .btn-primary:active, .btn-primary:hover, button.nav-link.active:focus, button.nav-link.active:active, button.nav-link.active:hover {
	background-color: var(--primary-dark-10) !important;
}
.btn-warning {
	color: var(--black);
	background-color: var(--gold);
}
.btn-warning:focus, .btn-warning:active, .btn-warning:hover {
	background-color: var(--gold-light-10);
}
.alert-danger {
	background-color: var(--danger-light-50);
	border-color: var(--danger);
	color: var(--danger-dark-20);
}

a, button, .btn {
	-webkit-transition: .4s all ease;
	-o-transition: .4s all ease;
	transition: .4s all ease;
	font-weight: var(--font-bold);
}
strong {
	font-weight: var(--font-heavy);
}

html,body {
	height: 100%;
}
body {
	background-color: var(--body-bg);
	font-family: var(--font-family);
	font-weight: var(--font-regular);
	color: var(--text-color);
}

#account___main {
	display: flex;
	flex-flow: column;
	height: 100%;
}

#account___header {
	background-color: var(--black);
	padding: .5rem 0;
	display: flex;
	flex: 0 1 auto;
}
#account___header h1 {
	color: #fff;
	text-align: center;
	font-weight: var(--font-heavy);
}

#account___login {
	display: flex;
	align-items: center;
	flex: 1 1 auto;
}

.login__left, .login__right {
	background-color: #fff;
	border-radius: 1.25rem;
	padding: 1rem;
	margin: 2rem 0;
}
.login__right {
	background-color: var(--black);
}
.login__body {
	padding: 2rem 0;
}
.login__body h2 {
	text-align: center;
	font-weight: var(--font-bold);
	margin-bottom: 1rem;
}
.login__body p {
	color: #fff;
	text-align: center;
	margin: 1.5rem;
	font-size: 1.25rem;
}
.login__right .login__body h2 {
	color: #fff;
}
#account___login-form .form-control {
	font-size: 1.25rem;
	background-color: var(--body-bg);
	color: var(--black);
	border-radius: 1rem;
	padding-left: 1rem;
	padding-right: 1rem;
}
#account___login-form .input-group .form-control {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
#account___login-form .input-group .btn {
	border-radius: 0;
	background-color: var(--body-bg);
	border: var(--bs-border-width) solid var(--bs-border-color);
	border-left: none;
	border-top-right-radius: 1rem;
	border-bottom-right-radius: 1rem;
}
.login__body .btn:not(#login___pwv) {
	border-radius: 1.25rem;
	padding: .5rem 4rem;
}
.login__body hr {
	border-top-color: var(--body-bg);
}
.login__section {
	margin: 2rem 0;
}
.login__section:last-child {
	margin-bottom: 0;
}
h3.login__or {
	color: #fff;
	position: relative;
	text-align: center;
	font-style: italic;
	font-size: 1.5rem;
}
h3.login__or:before {
	content: '';
	display: block;
	width: 12rem;
	height: .0625rem;
	background-color: var(--body-bg);
	left: 0;
	top: 50%;
	position: absolute;
}
h3.login__or:after {
	content: '';
	display: block;
	width: 12rem;
	height: .0625rem;
	background-color: var(--body-bg);
	right: 0;
	top: 50%;
	position: absolute;
}

#main___nav {
	max-height: 100%;
	height: 100%;
	width: 290px;
	display: none;
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	z-index: 15;
	overflow: auto;
}
#main___nav .nav__container {
	width: var(--sidebar-width);
	background-color: var(--black);
	height: 100%;
	padding-top: 40px;
	position: relative;
	z-index: 4;
}
#main___content {
	position: relative;
	z-index: 2;
	float: right;
	width: 100%;
	min-height: 100%;
	overflow-x: hidden;
	padding: 2rem;
}
#main___nav .nav__collapse-container {
	position: absolute;
	top: 0;
	left: 0;
	width: var(--sidebar-width);
	text-align: right;
	z-index: 5;
}
#main___nav-collapse {
	color: #fff;
	background-color: transparent;
	border: none;
}
.nav__container .logo__container, #mobile___menu .logo__container {
	padding: 0 6rem 1rem 0;
}
.nav__container .nav-item .nav-link, #mobile___menu .nav-item .nav-link {
	color: #fff;
	text-transform: uppercase;
	padding-top: 1rem;
	padding-bottom: 1rem;
	position: relative;
}
.nav__container .nav-item .nav-link i, #mobile___menu .nav-item .nav-link i {
	margin-right: var(--bs-nav-link-padding-x);
}
.nav__container .nav-item .nav-link.active, .nav__container .nav-item .nav-link:hover, #mobile__menu .nav-item .nav-link.active {
	color: var(--gold);
}
.nav__container .nav-item .nav-link.active:after {
	content: '';
	position: absolute;
	top: 12px;
	right: -15px;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 14px 0 14px 15px;
	border-color: transparent transparent transparent var(--black);
}
#mobile___menu {
	background-color: var(--black);
}
#mobile___menu .offcanvas-header {
	align-items: flex-start;
	position: relative;
}
.btn-logout {
	padding: 1rem;
	color: var(--black);
	float: right;
}

#main___content h1 {
	font-size: 2rem;
	font-weight: var(--font-bold);
}
.document__card, .video__card, .support__card {
	background-color: var(--gray-dark-10);
	border-color: var(--gray-dark-30);
	height: 100%;
}
.document__card-icon {
	padding: 0 2rem 2rem 2rem;
}
.document__card a, .video__card a, .support__card a {
	text-decoration: none;
	color: var(--black);
}
.document__card h2, .video__card h3, .support__card h3 {
	text-align: center;
	font-weight: var(--font-bold);
	font-size: 1.1rem;
}
.support__card .card-body {
	background-color: #fff;
}

.video__section {
	padding: 2rem 0;
}
.video__section h2 {
	font-size: 1.35rem;
	font-weight: var(--font-heavy);
}
.video__divider {
	margin: 1rem 0;
	border-bottom: 1px dashed var(--black);
}
.video__card h2 {
	font-weight: var(--font-heavy);
}
.video__card h3 {
	text-align: left;
}
.video__card-link {
	position: relative;
}
.video__link-container {
	position: relative;
	width: 100%;
	aspect-ratio: 16/9;
	margin-bottom: 1rem;
}
.video__card-thumbnail {
	position: absolute;
	top: 0;
	left: 0;
	margin-bottom: 1rem;
	width: 100%;
	aspect-ratio: 16/9;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
.video__card-video {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	aspect-ratio: 16/9;
}
.video__card-video video {
	height: 100%;
}

.video__related-link {
	text-decoration: none;
	color: var(--black);
}
.video__related-link h3 {
	font-weight: var(--heavy);
	font-size: 1.1rem;
}
.video__related-container {
	position: relative;
	aspect-ratio: 16/9;
}
.video__related-thumbnail {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	aspect-ratio: 16/9;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
}
.video__related-video {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	aspect-ratio: 16/9;
}
.video__related-video video {
	width: 100%;
}
.video-category__card h2 {
	font-size: 1.5rem;
	font-weight: var(--font-heavy);
	margin-bottom: 0;
}
.video-category__link {
	text-decoration: none;
}
.video-category__card .progress {
	background-color: var(--gray-dark-10);
}
p.video-category__return-link a {
	text-decoration: none;
	color: var(--orange);
	font-weight: var(--font-heavy);
}
.category-card__program {
	background-color: var(--orange-light-30);
}
.category-card__business {
	background-color: var(--primary-light-50);
}
ul.color__legend {
	margin: 0;
	padding: 0;
	list-style: none;
}
ul.color__legend li {
	display: inline-flex;
	margin-right: 1rem;
	align-items: center;
}
ul.color__legend li span {
	display: inline-block;
	height: 1.5rem;
	width: 1.5rem;
	border: 1px solid #000;
	margin-right: .5rem;
}

.search__form .form-control {
	border-color: var(--black);
	background-color: var(--gray-dark-50);
	border-top-left-radius: 1rem;
	border-bottom-left-radius: 1rem;
	padding-left: 1rem;
}
.search__form .form-control::placeholder {
	color: var(--gray);
}
.search__form .form-control:focus, .search__form .form-control:active {
	background-color: #fff;
	color: var(--black);
	box-shadow: 0 0 0 .25rem rgb(117,118,120,.25);
}
.search__form .form-control:focus::placeholder, .search__form .form-control:active::placeholder {
	color: var(--gray-dark-20);
}
.search__form .btn-dark {
	background-color: var(--gray-dark-50);
	border-color: var(--black);
	border-left: none;
	border-top-right-radius: 1rem;
	border-bottom-right-radius: 1rem;
	padding-left: 2rem;
	padding-right: 2rem;
}

.error__icon {
	font-size: 15rem;
}
h1.error__title {
	text-align: center;
	font-size: 6rem !important;
}
p.error__text {
	text-align: center;
	font-size: 2rem;
}

h2.card-title {
	font-weight: var(--font-heavy);
	font-size: 1.375rem;
	margin-bottom: 0;
}

.reply__card .card-header {
	background-color: var(--blue-light-30);
}

.upload-container {
	display: inline-block;
	width: 100%;
	min-height: 15vh;
	background-color: #f3f2ee;
	margin-bottom: 1rem;
	position: relative;
	height: max-content;
}
.upload-container-inner {
	color: var(--brown);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%,-50%);
	cursor: pointer;
	text-align: center;
}
.upload-container-inner i {
	margin-right: 1.5rem;
}
#upload-previews, .upload-previews {
	position: absolute;
	top: 0;
	left: 0;
	visibility: hidden;
	border: none !important;
	background: none !important;
	padding: 1rem !important;
}
#upload-previews .dz-image-preview, .upload-previews .dz-image-previews {
	background: none !important;
	text-align: center;
}
#upload-previews .dz-image, .upload-previews .dz-image {
	width: auto !important;
	height: auto !important;
	text-align: center;
	border-radius: 0;
}
.form-control-plaintext, .hourly-amount {
	font-weight: var(--font-heavy);
}

.active .bs-stepper-circle {
	background-color: var(--orange);
}
.step .step-trigger {
	opacity: .6;
	color: var(--text-color);
}
.step.active .step-trigger {
	opacity: 1;
}
.advanced__table p {
	margin-bottom: 0;
}
.advanced__table .row {
	align-items: center;
	border-bottom: 1px solid var(--gray-dark-20);
}
.advanced__table .row.table__header {
	margin-top: 2rem;
}
.advanced__table .row.table__footer {
	border-bottom: none;
	margin-top: 2rem;
}
.advanced__table .row:not(.table__footer):not(.table__header):nth-child(even) {
	background-color: #f9f9f9;
}
.advanced__table .row:not(.table__header) > div {
	padding-top: .5rem;
	padding-bottom: .5rem;
}
.advanced__table label {
	display: block;
	text-align: right;
	font-weight: var(--font-heavy);
}
.advanced__table label span {
	font-size: 125%;
}

/* At Least SM */
@media (min-width: 576px) {
	
}

/* At least MD */
@media (min-width: 768px) {
	#main___nav {
		display: block;
	}
	#main___content {
		width: calc(100% - var(--sidebar-width));
	}
}

/* MD Only */
@media (min-width: 768px) and (max-width: 991px) {

}

/* At Least LG */
@media (min-width: 992px) {
	#account___login-form {
		padding: 0 2rem;
	}
}

/* LG Only */
@media (min-width: 992px) and (max-width: 1199px) {
	
}

/* At least XL */
@media (min-width: 1200px) {
	.login__row {
		margin-left: 0;
		margin-right: 0;
	}
	.login__row > * {
		padding-left: 0;
		padding-right: 0;
	}
	.login__left, .login__right {
		margin: 0;
	}
	.login__left {
		border-top-right-radius: 0;
		border-bottom-right-radius: 0;
		height: 100%;
		display: flex;
		align-items: center;
	}
	.login__right {
		border-top-left-radius: 0;
		border-bottom-left-radius: 0;
		height: 100%;
		display: flex;
		align-items: center;
	}
	.login__body {
		width: 100%;
	}
	#account___login-form {
		padding: 0 4rem;
	}
	#login___alert {
		margin: 0 4rem;
	}
}

/* At least XXL */
@media (min-width: 1400px) {
	.row-cols-xxl-7 > * {
		width: calc(100% / 7);
	}
	.row-cols-xxl-8 > * {
		width: calc(100% / 8);
	}
	.row-cols-xxl-9 > * {
		width: calc(100% / 9);
	}
	
}