:root {
	--bg-color: #fff;
	--bg-form-color: #F9F9F9;
	--bg-content-color: rgba(255,255,255,.8);
	--bg-dropdown-color: rgba(2,1,61,.9);
	--color-text: #000;
	--color-breadcrumbs: #fff;
	--color-siebert: #7D72E8;
	--color-secondary-decline: #131118;
	--color-neutral-disabled: #C4C4C4;
	--color-neutral: #E8E8E8;
	--color-required-negative: #dd1010;
	--color-positive: #53db9a;
}



/*  BODY  **********/

@media (prefers-color-scheme: light) {

	body {
		background: linear-gradient(to right, #E9E8F0, #99B9D0);

		#login_container {

			#login_header {
				background-image: url(../images/logo-siebert-light.svg);
			}
		}

		header {

			#logo_header {
				background-image: url(../images/logo-siebert-light.svg);
			}

			#header_nav {

				a {

					color: var(--color-text);

					img {
						filter: brightness(0);
					}
				}

				span {

					color: var(--color-text);

					img {
						filter: brightness(0);
					}

					em {
						border-color: var(--color-text) transparent transparent transparent;
					}
				}
			}

		}

		#breadcrumbs_container {

			.steps_nav {

				li {

					.nav_message {
						color: var(--color-text);
					}

					.nav_square {
						background-color: var(--color-breadcrumbs);
					}

					.nav_line {
						background-color: var(--color-breadcrumbs);
					}

					&.nav_active {

						.nav_square {

							background-color: var(--color-siebert);
							box-shadow: 0px 0px 0px 3px rgba(255,255,255,1);
						}
					}

					&.nav_done {

						.nav_square {

							background-color: var(--color-siebert);
							box-shadow: 0px 0px 0px 3px rgba(255,255,255,1);
						}

						.nav_line {

							background-color: var(--color-siebert);
						}
					}
				}
			}
		}

		#copyright_container {

			p {
				color: var(--color-text);
			}
		}
	}
}

@media (prefers-color-scheme: dark) {

	:root {
		--bg-color: #010101;
	}

	body {

		background-color: var(--bg-color);
		background-image: radial-gradient(circle 800px at center -20%, rgba(255, 255, 255, 0.3), transparent);

		#login_container {

			#login_header {
				background-image: url(../images/logo-siebert-dark.svg);
			}
		}

		header {

			#logo_header {
				background-image: url(../images/logo-siebert-dark.svg);
			}

			#header_nav {

				a {

					img {
						filter: invert(100%) brightness(1000%);
					}
				}
			}
		}

		#breadcrumbs_container {

			.steps_nav {

				li {

					.nav_message {
						color: var(--color-breadcrumbs);
					}

					.nav_square {
						background-color: var(--color-breadcrumbs);
					}

					.nav_line {
						background-color: var(--color-breadcrumbs);
					}

					&.nav_active {

						.nav_square {

							background-color: var(--color-siebert);
							box-shadow: 0px 0px 0px 3px rgba(255,255,255,1);
						}
					}

					&.nav_done {

						.nav_square {

							background-color: var(--color-siebert);
							box-shadow: 0px 0px 0px 3px rgba(255,255,255,1);
						}

						.nav_line {

							background-color: var(--color-siebert);
						}
					}
				}
			}
		}

		#copyright_container {

			p {
				color: var(--color-breadcrumbs);
			}
		}
	}
}

body {

	position: relative;
	padding-inline: 1rem;

	#login_container {

		#login_header {

			width: 100%;
			max-width: 580px;
			height: 50px;
			margin: 0 auto 10px auto;
			background-position: top center;
			background-repeat: no-repeat;
			background-size: auto 100%;

			img {
				display: none;
			}
		}

		#login_content_container {

			background-color: rgba(243, 239, 235, 0.4);

			#login_content {

				h1 {
					color: var(--color-text);
				}

				.login_line {

					border-left: 47px solid var(--color-siebert);
					background-color: var(--bg-form-color);

					input[type="text"] {

						color: var(--color-text);
						transition: all 0.3s ease-in-out;

						&::placeholder {
							color: var(--color-text);
							opacity: 1;
						}

						&:focus {
							outline: none;
							box-shadow: inset 0 0 0 1px var(--color-siebert);
						}
					}

					input[type="password"] {

						color: var(--color-text);
						transition: all 0.3s ease-in-out;

						&::placeholder {
							color: var(--color-text);
							opacity: 1;
						}

						&:focus {
							outline: none;
							box-shadow: inset 0 0 0 1px var(--color-siebert);
						}
					}
				}

				.login_submit_line {

					&.clearfix {

						&::before,
						&::after {
							display: none;
						}
					}

					display: flex;
					justify-content: space-between;

					p {

						float: none;

						a {
							color: var(--color-text);
						}
					}

					input[type=submit] {

						float: none;
						background-color: var(--color-siebert);
						transition: opacity 0.3s;

						&:hover {
							opacity: .8;
						}
					}
				}
			}
		}
	}

	header {

		#logo_header {

			position: relative;
			margin-right: auto;
			order: 1;
			width: 300px;
			height: 50px;
			background-position: top left;
			background-repeat: no-repeat;
			background-size: auto 100%;
			transition: opacity 0.3s;

			img {
				display: none;
			}
		}

		#header_nav {

			.nav_dropdown
			{
				background-color: var(--bg-dropdown-color);
				min-width: 75px;
			}
		}
	}

	#content_container {

		#manager_top_header {

			background-color: unset;

			#manager_nav {

				.page-active {

					a {
						background-color: var(--bg-content-color);
						border-bottom: 2px solid #D8D8D7;
					}
				}
			}
		}

		#content {

			min-height: unset;
			background-color: var(--bg-content-color);
			opacity: 1;

			h1 {

				color: var(--color-text);
				border-bottom: 1px solid var(--color-text);
			}

			h2 {

				color: var(--color-text);
				border-bottom: 1px solid var(--color-text);
			}

			p {
				color: var(--color-text);
			}

			#review_settings_container {

				#review_settings_content {

					.review_settings_line {

						p {
							color: var(--color-text);
						}

						span {
							color: var(--color-text);
						}

						&:last-of-type {

							input[type=button] {

								background-color: var(--color-secondary-decline);
								transition: opacity 0.3s ease-in-out;

								&:hover {
									opacity: 0.8;
								}
							}

							input[type=submit] {

								&:nth-of-type(1) {

									background-color: var(--color-secondary-decline);
									transition: opacity 0.3s ease-in-out;

									&:hover {
										opacity: 0.8;
									}
								}

								&:nth-of-type(2) {

									background-color: var(--color-siebert);
									transition: opacity 0.3s ease-in-out;

									&:hover {
										opacity: 0.8;
									}
								}
							}
						}
					}
				}
			}

			#email_verify_container {

				.email_verify_line {

					border-left: 47px solid var(--color-siebert);
					background-color: var(--bg-form-color);

					input[type=text] {

						color: var(--color-text);
						transition: all 0.3s ease-in-out;

						&::placeholder {

							color: var(--color-text);
							opacity: 1;
						}

						&:focus {

							outline: none;
							box-shadow: inset 0 0 0 1px var(--color-siebert);
						}
					}

					input[type=email] {

						color: var(--color-text);
						transition: all 0.3s ease-in-out;

						&::placeholder {

							color: var(--color-text);
							opacity: 1;
						}

						&:focus {

							outline: none;
							box-shadow: inset 0 0 0 1px var(--color-siebert);
						}
					}
				}

				.email_verify_submit_line {

					input[type=submit] {

						background-color: var(--color-siebert);
						transition: opacity 0.3s ease-in-out;

						&:hover {
							opacity: 0.8;
						}
					}

					input[type=button] {

						background-color: var(--color-secondary-decline);
						transition: opacity 0.3s ease-in-out;

						&:hover {
							opacity: 0.8;
						}
					}
				}
			}

			#personal_information {

				color: var(--color-text);

				h3 {
					color: var(--color-text);
				}
				.personal_line {

					label {
						color: var(--color-text);
					}

					input[type=text] {

						background-color: var(--bg-form-color);
						color: var(--color-text);
						transition: all 0.3s ease-in-out;

						&::placeholder {
							color: var(--color-text);
							opacity: 1;
						}

						&:focus {
							outline: none;
							box-shadow: inset 0 0 0 1px var(--color-siebert);
						}

						&:disabled {
							background-color: var(--color-neutral-disabled);
							opacity: 1;
						}

						&:read-only {
							background-color: var(--color-neutral-disabled) !important;
							opacity: 1;
						}

						&.hilite {
							border: none;
							box-shadow: inset 0 0 0 1px var(--color-siebert);
						}
					}

					input[type=email] {

						background-color: var(--bg-form-color);
						color: var(--color-text);
						transition: all 0.3s ease-in-out;

						&::placeholder {
							color: var(--color-text);
							opacity: 1;
						}

						&:focus {
							outline: none;
							box-shadow: inset 0 0 0 1px var(--color-siebert);
						}

						&:disabled {
							background-color: var(--color-neutral-disabled);
							opacity: 1;
						}

						&:read-only {
							background-color: var(--color-neutral-disabled) !important;
							opacity: 1;
						}
					}

					select {

						background-color: var(--bg-form-color);
						color: var(--color-text);
						transition: all 0.3s ease-in-out;

						&::placeholder {
							color: var(--color-text);
							opacity: 1;
						}

						&:disabled {
							background-color: var(--color-neutral-disabled) !important;
							opacity: 1;
						}

					}
				}

				#occupation-search-container {

					&::after {
						border-right: 2px solid var(--color-text);
						border-bottom: 2px solid var(--color-text);
					}
				}
			}

			#employment_information {

				color: var(--color-text);

				h3 {
					color: var(--color-text);
				}
				.personal_line {

					label {
						color: var(--color-text);
					}

					input[type=text] {

						background-color: var(--bg-form-color);
						color: var(--color-text);
						transition: all 0.3s ease-in-out;

						&::placeholder {
							color: var(--color-text);
							opacity: 1;
						}

						&:focus {
							outline: none;
							box-shadow: inset 0 0 0 1px var(--color-siebert);
						}

						&:disabled {
							background-color: var(--color-neutral-disabled);
							opacity: 1;
						}

						&:read-only {
							background-color: var(--color-neutral-disabled) !important;
							opacity: 1;
						}

						&.hilite {
							border: none;
							box-shadow: inset 0 0 0 1px var(--color-siebert);
						}
					}

					input[type=email] {

						background-color: var(--bg-form-color);
						color: var(--color-text);
						transition: all 0.3s ease-in-out;

						&::placeholder {
							color: var(--color-text);
							opacity: 1;
						}

						&:focus {
							outline: none;
							box-shadow: inset 0 0 0 1px var(--color-siebert);
						}

						&:disabled {
							background-color: var(--color-neutral-disabled);
							opacity: 1;
						}

						&:read-only {
							background-color: var(--color-neutral-disabled) !important;
							opacity: 1;
						}
					}

					select {

						background-color: var(--bg-form-color);
						color: var(--color-text);
						transition: all 0.3s ease-in-out;

						&::placeholder {
							color: var(--color-text);
							opacity: 1;
						}

						&:disabled {
							background-color: var(--color-neutral-disabled) !important;
							opacity: 1;
						}

					}
				}
			}

			#billing_information {

				color: var(--color-text);

				h3 {
					color: var(--color-text);
				}
				.personal_line {

					label {
						color: var(--color-text);
					}

					input[type=text] {

						background-color: var(--bg-form-color);
						color: var(--color-text);
						transition: all 0.3s ease-in-out;

						&::placeholder {
							color: var(--color-text);
							opacity: 1;
						}

						&:focus {
							outline: none;
							box-shadow: inset 0 0 0 1px var(--color-siebert);
						}

						&:disabled {
							background-color: var(--color-neutral-disabled);
							opacity: 1;
						}

						&:read-only {
							background-color: var(--color-neutral-disabled) !important;
							opacity: 1;
						}

						&.hilite {
							border: none;
							box-shadow: inset 0 0 0 1px var(--color-siebert);
						}
					}

					input[type=email] {

						background-color: var(--bg-form-color);
						color: var(--color-text);
						transition: all 0.3s ease-in-out;

						&::placeholder {
							color: var(--color-text);
							opacity: 1;
						}

						&:focus {
							outline: none;
							box-shadow: inset 0 0 0 1px var(--color-siebert);
						}

						&:disabled {
							background-color: var(--color-neutral-disabled);
							opacity: 1;
						}

						&:read-only {
							background-color: var(--color-neutral-disabled) !important;
							opacity: 1;
						}
					}

					select {

						background-color: var(--bg-form-color);
						color: var(--color-text);
						transition: all 0.3s ease-in-out;

						&::placeholder {
							color: var(--color-text);
							opacity: 1;
						}

						&:disabled {
							background-color: var(--color-neutral-disabled) !important;
							opacity: 1;
						}

					}
				}
			}

			.form_submit_container {
				span {
					color: var(--color-text);

					em {
						color: var(--color-required-negative);
					}
				}

				input[type=submit] {

					background-color: var(--color-siebert);
					transition: opacity 0.3s ease-in-out;

					&:hover {
						opacity: 0.8;
					}
				}
			}

			#continue_exit_container {

				a {

					background-color: var(--color-secondary-decline);
					transition: opacity 0.3s ease-in-out;

					&:hover {
						opacity: 0.8;
					}
				}

				button {

					background-color: var(--color-siebert);
					transition: opacity 0.3s ease-in-out;

					&:hover {
						opacity: 0.8;
					}
				}

				input[type=submit] {

					background-color: var(--color-siebert);
					transition: opacity 0.3s ease-in-out;

					&:hover {
						opacity: 0.8;
					}
				}
			}

			#firm_info_container {

				h2, h3, h4 {
					color: var(--color-text);
				}

				a {
					color: var(--color-text);
				}
			}

			#review_settings_btn_container {

				button {

					background-color: var(--color-siebert);
					transition: opacity 0.3s ease-in-out;

					&:hover {
						opacity: 0.8;
					}
				}
			}

			#agreements_list_container {

				.agreements_to_sign_container {

					border-right: 1px solid var(--color-text);

					@media only screen and (max-width : 1199px) {

						border-right: none;
					}

					h2 {

						padding-inline: 10px;
						background-color: var(--color-siebert);
						box-sizing: border-box;
					}

					&>h3 {
						color: var(--color-text);
						border-bottom: 1px solid var(--color-text);
					}

					#agreements_to_sign {

						display: grid;
						grid-template-columns: repeat(3, 1fr);
						gap: 1rem;

						@media only screen and (max-width : 1199px) {

							grid-template-columns: repeat(4, 1fr);
						}

						@media only screen and (max-width : 1024px) {

							grid-template-columns: repeat(3, 1fr);
						}

						@media only screen and (max-width : 860px) {

							grid-template-columns: repeat(2, 1fr) !important;
						}

						.one_agreement {

							position: relative;
							width: 100%;
							background-color: var(--color-siebert) ;
							clip-path: polygon(10px 0%, 100% 0%, 100% 100%, 0% 100%, 0% 10px);
							margin: 0;
							padding-block-start: 10px;
							padding-block-end: 15px;
							transition: opacity 0.3s ease-in-out;

							&:hover {
								opacity: 0.8;
							}

							&::before {
								display: none;
							}
						}
					}
				}

				.agreements_unsigned_container {

					#agreements_unsigned {

						.one_agreement_signed {

							display: flex;
							justify-content: flex-start;
							align-items: center;
							color: var(--color-text);

							a {

								display: inline-block;
								top: 0;
								padding-block-start: 5px;
								padding-block-end: 3px;
								padding-inline: 6px;
								background-color: var(--color-siebert);
								transition: opacity .3s ease-in-out;

								&:hover {
									opacity: 0.8;
								}

								img {

									padding: 0;
									border: none;
									filter: brightness(0) invert(1);
								}
							}
						}
					}
				}
			}

			&.single_agreement {

				h2, h3, h4 {
					color: var(--color-text);
				}

				ol,ul {
					color: var(--color-text);
				}

				.one_agreement_line {

					label {
						color: var(--color-text);
						text-transform: unset;
					}

					.agreement_column_half {

						display: flex;
						align-items: center;
					}
				}

				.one_agreement_line_top {

					label {
						color: var(--color-text);

						&+label {
							line-height: 2;
						}
					}
				}

				.text-info {

					position: relative;
					left: 50%;
					transform: translateX(-50%);
					display: inline-block;
					background-color: var(--color-siebert);
					color: var(--color-breadcrumbs);
					padding: 1rem;
				}

				input[type=text] {

					background-color: var(--bg-form-color);
					color: var(--color-text);
					transition: all 0.3s ease-in-out;

					&::placeholder {
						color: var(--color-text);
						opacity: 1;
					}

					&:focus {

						outline: none;
						box-shadow: inset 0 0 0 1px var(--color-siebert);
					}

					&:disabled {

						background-color: var(--color-neutral-disabled) !important;
						border: 1px solid var(--color-secondary-decline);
						opacity: 1;
						pointer-events: none;

						&:focus {

							box-shadow: none;
							outline: none;
						}
					}

					&:read-only {

						background-color: var(--color-neutral-disabled) !important;
						border: 1px solid var(--color-secondary-decline);
						opacity: 1;
						cursor: not-allowed;

						&:focus {

							box-shadow: none;
							outline: none;
						}
					}
				}

				input[type=email] {

					background-color: var(--bg-form-color);
					color: var(--color-text);
					transition: all 0.3s ease-in-out;

					&::placeholder {
						color: var(--color-text);
						opacity: 1;
					}

					&:focus {

						outline: none;
						box-shadow: inset 0 0 0 1px var(--color-siebert);
					}

					&:disabled {

						background-color: var(--color-neutral-disabled) !important;
						border: 1px solid var(--color-secondary-decline);
						opacity: 1;
						pointer-events: none;

						&:focus {

							box-shadow: none;
							outline: none;
						}
					}

					&:read-only {

						background-color: var(--color-neutral-disabled) !important;
						border: 1px solid var(--color-secondary-decline);
						opacity: 1;
						cursor: not-allowed;

						&:focus {

							box-shadow: none;
							outline: none;
						}
					}
				}

				select {

					background-color: var(--bg-form-color);
					color: var(--color-text);
					transition: all 0.3s ease-in-out;

					&::placeholder {
						color: var(--color-text);
						opacity: 1;
					}

					&:focus {

						outline: none;
						box-shadow: inset 0 0 0 1px var(--color-siebert);
					}

					&:disabled {

						background-color: var(--color-neutral-disabled) !important;
						border: 1px solid var(--color-secondary-decline);
						opacity: 1;
						pointer-events: none;

						&:focus {

							box-shadow: none;
							outline: none;
						}
					}
				}

				table {

					tr {

						td {

							border: 1px solid var(--color-text);
							color: var(--color-text);

							&[colspan] {
								background-color: var(--color-siebert);
								color: var(--color-breadcrumbs);
							}
						}
					}
				}

				.one_agreement_submit_container {

					label {
						color: var(--color-text);
					}

					input[type=submit] {

						background-color: var(--color-siebert);
						transition: opacity 0.3s ease-in-out;

						&:hover {
							opacity: 0.8;
						}
					}
				}
			}

			#view_profile_container {


				.view_profile_section {

					color: var(--color-text);

					&:nth-of-type(1) {
						border-right: 1px solid var(--color-text);
					}

					&>h2 {
						border-bottom: 1px solid var(--color-text);
					}

					a {
						color: var(--color-text);
					}

					.one_contact_address {

						background-color: var(--color-neutral);

						a {
							color: var(--color-siebert);
						}
					}

					#personal_data_btn_container {

						margin-top: 2rem;

						a {

							transition: opacity .3s ease-in-out;

							&:nth-of-type(1) {
								background-color: var(--color-secondary-decline);
								color: var(--color-breadcrumbs);
							}

							&:nth-of-type(2) {
								background-color: var(--color-siebert);
								color: var(--color-breadcrumbs);
							}

							&:hover {
								opacity: 0.8;
							}
						}
					}
				}


			}

			#change_form_container {

				#change_password_wrapper {

					.change_pass_line {

						label {
							color: var(--color-text);
						}

						input[type=text] {

							background-color: var(--bg-form-color);
							color: var(--color-text);
							transition: all 0.3s ease-in-out;

							&::placeholder {
								color: var(--color-text);
								opacity: 1;
							}

							&:focus {
								outline: none;
								box-shadow: inset 0 0 0 1px var(--color-siebert);
							}
						}

						input[type=password] {

							background-color: var(--bg-form-color);
							color: var(--color-text);
							transition: all 0.3s ease-in-out;

							&::placeholder {
								color: var(--color-text);
								opacity: 1;
							}

							&:focus {
								outline: none;
								box-shadow: inset 0 0 0 1px var(--color-siebert);
							}
						}

						img {
							filter: brightness(0);
						}
					}

					input[type=submit] {

						background-color: var(--color-siebert);
						transition: opacity 0.3s ease-in-out;

						&:hover {
							opacity: 0.8;
						}
					}
				}

				#pass_requirements {

					color: var(--color-text);

					small {
						color: var(--color-text);
					}
				}
			}

			#manager_top_header {

				display: flex;
				justify-content: space-between;
				align-items: center;

				#manager_top_header_firm {

					display: flex;
					justify-content: flex-start;
					align-items: center;
				}

				#manager_top_header_user {

					span {
						color: var(--color-text);
					}
				}
			}

			#manager_box_update_password {

				display: grid;
				grid-template-columns: 1fr 1fr;
				grid-template-rows: auto auto;
				gap: 1rem;
				align-items: start;

				.title {
					grid-column: span 2;
				}

				.line {

					&:not(:last-of-type) {
						margin-bottom: .5rem;
					}
				}

				.linespacer {
					display: none;
				}

				.password_rules {

					position: relative;
					top: 0;
					right: unset;
					width: auto;
					align-self: start;

					ul {

						list-style-type: square;
						line-height: 1.5;
						color: var(--color-text);
						margin: 0;
					}
				}
			}
		}
	}

	.occupations_search_results {

		background-color: var(--color-neutral);
		border-left: 1px solid var(--color-siebert);
		border-right: 1px solid var(--color-siebert);
		border-bottom: 1px solid var(--color-siebert);

		.occupations_search_results_final {

			color: var(--color-text);

			.occupations_search_results_final_inner {

				.sdrow {
					border-bottom: 1px dashed var(--color-breadcrumbs);

					a {
						color: var(--color-text);

						&:visited {
							color: var(--color-text);
						}

						&:hover {
							color: var(--color-siebert);
						}
					}
				}

			}
		}
	}
}

.proceed_container_text
{
	position: relative;
	flex-basis: 100%;
	padding-bottom: 15px;
	text-align: left;
	margin-bottom: 15px;
}

.proceed_container_text p
{
	color: #00305c;
	margin-top: 0;
	margin-bottom: 15px;
	font-weight: 500;
	line-height: 1.5;
}

.proceed_container_text p:last-of-type
{
	margin-bottom: 0;
}

.proceed_container_text p a
{
	background-color: #EAE834;
	padding-left: 3px;
	padding-right: 3px;
}

.proceed_container_text a
{
	font-size: 18px;
	color: #00305c;
	text-transform: uppercase;
	text-decoration: underline;
}

.proceed_container_text a:hover
{
	text-decoration: none;
}

#agreements_list_container h2
{
	margin-bottom: 13px;
}