:root {
	--font-primary: "Inter", sans-serif;
	--thin-weight: 100;
	--extra-light-weight: 200;
	--light-weight: 300;
	--regular-weight: 400;
	--medium-weight: 500;
	--semi-bold-weight: 600;
	--bold-weight: 700;
	--extra-bold-weight: 800;
	--black-weight: 900;

	--color--black: #000000;
	--color--white: #ffffff;
	--color--primary--500-main: #ac5336;
	--color--primary--50-main: #f8ece8;
	--color--neutral-50: #f9fafb;
	--color-neutral-200: #e5e7eb;
	--color--neutral-400: #9ca3af;
	--color-neutral-500: #6b7280;
	--color-neutral-600: #4b5563;
	--transition-03: all 0.3s ease-in-out;
}

*,
*::before,
*::after {
	box-sizing: border-box;
	padding: 0;
	margin: 0;
	outline: none;
}

/* Works on Firefox */
* {
	scrollbar-width: thin;
	scrollbar-color: red;
}

/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {
	width: 8px;
	padding: 10px;
}

*::-webkit-scrollbar-track {
	background: red;
}

*::-webkit-scrollbar-thumb {
	background-color: #000;
}

::-moz-selection {
	color: #fff;
	background: #000;
	text-shadow: none;
}

::selection {
	color: #fff;
	background: #000;
	text-shadow: none;
}

html {
	font-size: 62.5%;
	line-height: 1.15;
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}

body {
	line-height: 1;
	font-family: var(--font-primary);
	font-weight: 400;
	background: var(--color--neutral-50);
}

h1,
h2,
h3,
h4,
h5,
h6 {
	font-weight: normal;
	font-size: inherit;
	margin: 0;
}

ol,
ul,
li {
	list-style: none;
}

a {
	outline: none;
	color: inherit;
	background-color: transparent;
	text-decoration: none;
	transition: var(--transition-03);
	-webkit-transition: var(--transition-03);
	-moz-transition: var(--transition-03);
	-ms-transition: var(--transition-03);
	-o-transition: var(--transition-03);
}

sub,
sup {
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}

sub {
	bottom: -0.25em;
}

sup {
	top: -0.5em;
}

button,
input,
optgroup,
select,
textarea {
	font-family: inherit; /* 1 */
	font-size: 100%; /* 1 */
	line-height: 1.15; /* 1 */
	margin: 0; /* 2 */
}

main {
	display: block;
	padding-top: 10rem;
}

main.core_log {
	padding-top: 0rem;
}

section {
	display: flex;
	flex-direction: column;
	width: 100%;
}

img {
	border-style: none;
}

.img_res {
	width: 100%;
	max-width: 100%;
	height: auto;
	border: 0;
	-ms-interpolation-mode: bicubic;
	vertical-align: bottom;
}

::-ms-input-placeholder {
	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--neutral-400);
}

::placeholder {
	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--neutral-400);
}

/* ! Global css */
.cnt {
	width: 100%;
	margin: 0 auto;
}

/* ! Header */

.header {
	height: 10rem;
	position: fixed;
	width: 100%;
	background: var(--color--primary--500-main);
	padding: 0 5.72%;
	display: flex;
	align-items: center;
	top: 0;
	left: 0;
	z-index: 999;
}

.header__logo {
	width: 120px;
}

.header__logo a {
	display: block;
}

.header__btn {
	margin-left: auto;
	display: flex;
	gap: 20px;
}

.header__btn.header__btn_more {
	margin-left: 30px;
}

.user_logged_in{
	font-size: 1.3rem;
    line-height: 1.6rem;
    letter-spacing: -1px;
    color: var(--color-neutral-600);
    padding: 2rem 5.72%;
}

.user_logged_in span{
	color: var(--color--primary--500-main);
}

.btn_login {
	width: 140px;
	height: 44px;
	background: var(--color--white);
	color: var(--color--primary--500-main);
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 99px;
	font-weight: var(--medium-weight);
	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	gap: 8px;
	border: 1px solid transparent;
}

.btn_login_icn {
	width: 20px;
	height: 20px;
}

.btn_login_icn svg {
	width: 100%;
	height: 100%;
	display: block;
}

.svg_login {
	fill: var(--color--primary--500-main);
	transition: var(--transition-03);
}

.btn_login:hover {
	border: 1px solid var(--color--white);
	color: var(--color--white);
	background: transparent;
}

.btn_login:hover .svg_login {
	fill: var(--color--white);
}

.btn_logout a {
	width: 124px;
	height: 44px;
	background: var(--color--white);
	color: var(--color--primary--500-main);
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 99px;
	font-weight: var(--medium-weight);
	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	gap: 8px;
	border: 1px solid transparent;
}

.btn_logout a:hover {
	border: 1px solid var(--color--white);
	color: var(--color--white);
	background: transparent;
}

.header__links {
	margin-left: auto;
	display: flex;
	gap: 25px;
}

.header__links a {
	color: var(--color--white);
	font-size: 1.6rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
}

.btn_logout_admin {
	position: fixed;
	right: 110px;
	top: 28px;
	z-index: 9999;
}

.btn_logout_admin input {
	width: 124px;
	height: 44px;
	background: var(--color--white);
	color: var(--color--primary--500-main);
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 99px;
	font-weight: var(--medium-weight);
	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	gap: 8px;
	border: 1px solid transparent;
	transition: var(--transition-03);
	cursor: pointer;
}

.btn_logout_admin input:hover {
	border: 1px solid var(--color--white);
	color: var(--color--white);
	background: transparent;
}

.header.header_admin .header__links {
	margin-right: 170px;
}

/* ! Footer */
.sticky_footer {
	min-height: calc(100vh - 4rem);
}
.footer {
	width: 100%;
	display: flex;
	align-items: center;
	height: 4rem;
	padding: 0 5.72%;
	background: var(--color--white);
	position: relative;
}

.footer_q_l {
}

.footer_q_l ul {
	display: flex;
	gap: 3.2rem;
}

.footer_q_l ul li {
}

.footer_q_l ul li a {
	color: var(--color--neutral-400);
	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
}

.footer_q_l ul li a:hover {
	color: var(--color--primary--500-main);
}

.footer__copyright {
	color: var(--color--neutral-400);
	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	margin-left: auto;
}

/* ! Content for study */
.f_c_r {
	width: 50%;
	height: calc(100vh - 10rem);
	position: fixed;
	right: 0;
	top: 10rem;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.f_c_l {
	width: 50%;
	min-height: calc(100vh - 14rem);
	background: var(--color--neutral-50);
	display: flex;
	padding: 7rem 4% 4rem 6%;
	position: relative;
}

.f_c_l-info {
	position: absolute;
	min-height: 40px;
	top: 5px;
	left: 50%;
	transform: translateX(-50%);
	width: 90%;
	display: flex;
	flex-direction: column;
	background: #e4b8aa;
	border-radius: 89px;
	justify-content: center;
	padding: 1rem 2.5rem 1rem 5rem;
	color: #fff;
	font-size: 1.4rem;
}

.f_c_l-info-img {
	width: 25px;
	height: 25px;
	position: absolute;
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
}

.f_c_l__content {
	width: 100%;
}

.f_c_l_content_title {
	color: var(--color--primary--500-main);
	font-size: 6rem;
	line-height: 7rem;
	font-weight: var(--light-weight);
	letter-spacing: -2px;
	margin-bottom: 5rem;
}

.f_c_l_content_course {
	display: flex;
	flex-direction: column;
	width: 100%;
	margin-bottom: 3rem;
}

.f_c_l_content_course:last-child {
	margin-bottom: 0;
}

.f_c_l_content_course_title {
	color: var(--color--black);
	font-size: 2.4rem;
	line-height: 3rem;
	letter-spacing: -1px;
	margin-bottom: 1rem;
}

.f_cl_tabhead {
	display: flex;
	flex-direction: column;
}

.f_cl_tabhead > li {
	border-bottom: 1px solid #d9d9d9;
	display: flex;
	flex-direction: column;
}

.f_cl_tabhead > li:last-child {
	border-bottom: none;
}

.tabhead_icn {
	width: 20px;
	height: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 8px;
}

.svg_tabhead {
	stroke: var(--color-neutral-600);
	transition: var(--transition-03);
}

.tabhead {
	display: flex;
	align-items: center;

	color: var(--color--neutral-600);
	font-size: 1.6rem;
	line-height: 2.2rem;
	letter-spacing: -0.5px;
	padding: 12px 10px;

	cursor: pointer;
	transition: var(--transition-03);
}

.f-cl-tabhead > li:hover .tabhead,
.f-cl-tabhead > li.active .tabhead {
	border-radius: 4px;
	background: var(--color--primary--50-main);
	color: var(--color--primary--500-main);
}

.f-cl-tabhead li:hover .svg-tabhead,
.f-cl-tabhead li.active .svg-tabhead {
	stroke: var(--color--primary--500-main);
}

.tabbody {
	display: none;
	padding: 10px 10px;
}

.f_c_l_content_box {
	height: 100%;
	width: 100%;
	background: rgba(255, 255, 255, 0.9);
	display: flex;
	align-items: center;
	transition: var(--transition-03);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.f_c_l_content_box.active {
	opacity: 1;
	visibility: visible;
	pointer-events: all;
}

.f_c_l_content_box_inner {
	max-width: 600px;
	width: 100%;
	margin: 0 auto;
}

.f_c_l_content_box_title {
	color: var(--color--primary--500-main);
	font-size: 3rem;
	line-height: 4rem;
	letter-spacing: -1px;
}

.f_c_l_content_box_info {
	display: flex;
	flex-direction: column;
	padding: 20px 0;
	overflow-y: scroll; /* Enables vertical scroll */
	overflow-x: hidden; /* Disables horizontal scroll */
	height: 500px;
}

.f_c_l_content_box_info ul {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.f_c_l_content_box_info li {
	display: flex;
	width: 593px;
}

.f_c_l_content_box_info li a {
	width: 100%;
	padding: 16px 24px;
	display: flex;
	align-items: center;
	background: var(--color--white);
	border: 1px solid var(--color-neutral-200);
	border-radius: 8px;
	cursor: pointer;
	font-size: 1.4rem;
	line-height: 2.2rem;
	color: var(--color-neutral-500);
}

.f_c_l_content_box_info li a .tabbody_c_ta {
	margin-left: auto;
	display: flex;
	align-items: center;
}

.f_c_l_content_box_info li a .tabbody_c_ta span {
	width: 20px;
	height: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: 8px;
}

.f_c_l_content_box_info li a:hover {
	background: var(--color--primary--50-main);
	color: var(--color--primary--500-main);
}

.f_c_l_content_box_info li a:hover .svg_tabhead {
	stroke: var(--color--primary--500-main);
}

/* ! Accordion */
.tabbody ul {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.tabbody li {
	display: flex;
	width: 100%;
}

.tabbody li a {
	width: 100%;
	padding: 10px 30px;
	display: flex;
	align-items: flex-start;
	background: var(--color--white);
	border: 1px solid var(--color-neutral-200);
	border-radius: 8px;
	cursor: pointer;
	font-size: 1.6rem;
	line-height: 2.2rem;
	color: var(--color-neutral-500);
	flex-direction: column;
}

.tabbody li a .tabbody_c_ta {
	display: flex;
	align-items: center;
}

.tabbody li a .tabbody_c_ta span {
	width: 20px;
	height: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-left: 8px;
}

.tabbody li a:hover {
	background: var(--color--primary--50-main);
	color: var(--color--primary--500-main);
}

.tabbody li a:hover .svg_tabhead {
	stroke: var(--color--primary--500-main);
}

/* ! Registration form */
.form__registration_left {
	width: 70.56%;
	min-height: calc(100vh - 14rem);
	background: var(--color--neutral-50);
	display: flex;
	padding: 7rem 4% 4rem 6%;
	flex-direction: column;
}

.form__registration_right {
	width: 29.44%;
	height: calc(100vh - 10rem);
	position: fixed;
	right: 0;
	top: 10rem;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
}

.form__registration_top {
	display: flex;
	flex-direction: column;
	text-align: center;
	width: 100%;
}

.top__title {
	color: var(--color--primary--500-main);
	font-size: 3rem;
	line-height: 4rem;
	font-weight: var(--semi-bold-weight);
	letter-spacing: -1px;
	margin-bottom: 0.5rem;
}

.top__subtitle {
	color: var(--color-neutral-600);
	font-size: 2rem;
	line-height: 2.5rem;
	letter-spacing: -0.5px;
}

.form__step_progressbar {
	width: 100%;
	margin-top: 4rem;
	margin-bottom: 6rem;
}

.step_progressbar {
	display: flex;
	width: 70%;
	justify-content: space-between;
	margin: 0 auto;
	position: relative;
}

.step_progressbar_line {
	width: 88%;
	height: 2px;
	background: var(--color-neutral-200);
	position: absolute;
	top: 13px;
	left: 50%;
	transform: translateX(-50%);
	display: flex;
}

.progressbar_line {
	height: 100%;
	background: var(--color--primary--500-main);
	transition: all linear 0.3s;
}

.step_progressbar_item {
	display: flex;
	flex-direction: column;
	align-items: center;
	z-index: 1;
}

.step_progressbar_item_cirlce {
	width: 28px;
	height: 28px;
	border-radius: 100%;
	position: relative;
}

.step_progressbar_item_cirlce::before {
	content: "";
	position: absolute;
	width: 35px;
	height: 35px;
	border-radius: 100%;
	background: none;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%) scale(1);
	pointer-events: none;
}

.step_progressbar_item_cirlce svg {
	width: 100%;
	height: 100%;
	display: block;
	position: relative;
}

.step_fill {
	fill: var(--color--neutral-50);
	transition: var(--transition-03);
}

.step_stroke {
	stroke: var(--color-neutral-200);
	transition: var(--transition-03);
}

.step_cirle_fill {
	fill: var(--color-neutral-200);
	transition: var(--transition-03);
}

/* ! active */
.step_progressbar_item.active .step_fill {
	fill: var(--color--white);
}

.step_progressbar_item.active .step_stroke {
	stroke: var(--color--primary--500-main);
}

.step_progressbar_item.active .step_cirle_fill {
	fill: var(--color--primary--500-main);
}

.step_progressbar_item.active .step_progressbar_item_cirlce::before {
	background: var(--color--primary--50-main);
}

/* ! complete */
.step_progressbar_item.complete .step_fill {
	fill: var(--color--primary--500-main);
}

.step_progressbar_item.complete .step_stroke {
	stroke: var(--color--primary--500-main);
}

.step_progressbar_item.complete .step_cirle_fill {
	fill: var(--color--primary--500-main);
}

.step_progressbar_item .step_progressbar_item_cirlce::after {
	content: "";
	background: url("../assets/images/svg/tick.png") center center no-repeat;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 15px;
	height: 10px;
	background-size: cover;
	opacity: 0;
	visibility: hidden;
}

.step_progressbar_item.complete .step_progressbar_item_cirlce::after {
	opacity: 1;
	visibility: visible;
}

.step_progressbar_item_txt {
	color: var(--color-neutral-600);
	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	margin-top: 1rem;
}

/* ! form section */
.forms__section {
	width: 100%;
	display: flex;
	flex-direction: column;
}

.step__form {
	display: flex;
	flex-direction: column;
}

.step__form_title {
	color: var(--color-neutral-600);
	font-size: 2rem;
	line-height: 4rem;
	font-weight: var(--semi-bold-weight);
	letter-spacing: -0.5px;
	padding-bottom: 1rem;
	margin-bottom: 2rem;
	border-bottom: 1px solid #dae1e8;
}

.step__form_wrapper {
	display: flex;
	width: 100%;
	flex-direction: column;
}

.step__form_wrapper form {
	width: 100%;
	display: flex;
	flex-direction: column;
}

.form_field {
	width: 100%;
	display: flex;
	margin: 16px 0;
	flex-direction: column;
}

.g_label {
	color: var(--color-neutral-600);
	font-size: 1.5rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
}

.form_field_input {
	position: relative;
}

.form_field_input.browsefileinput span {
	display: block;
	width: 100%;
	border-radius: 8px;
	border: 1px solid #e5e7eb;
	background-color: #ffffff;
	box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.04),
		0px 1px 2px 0px rgba(16, 24, 40, 0.04);
	padding: 12px;
	height: 40px;
	width: 100%;

	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--neutral-400);
}

.form_field_wrapper input[type="text"],
.form_field_wrapper input[type="email"],
.form_field_wrapper input[type="tel"],
.form_field_wrapper textarea,
.form_field_wrapper input.date_picker,
.form_field_wrapper select,
.form__field__level_box_subjects select,
.form__field__level_box_Grade select,
.table_dropdown_left select,
.f_filter_input select,
.bo_box_select select {
	border-radius: 8px;
	border: 1px solid #e5e7eb;
	background-color: #ffffff;
	box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.04),
		0px 1px 2px 0px rgba(16, 24, 40, 0.04);
	padding: 12px;
	height: 40px;
	width: 100%;

	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color-neutral-600);
	overflow: hidden;
}

.form_field_wrapper select,
.form__field__level_box_subjects select,
.form__field__level_box_Grade select,
.table_dropdown_left select,
.f_filter_input select,
.bo_box_select select {
	appearance: none;
	-webkit-appearance: none;
	-moz-appearance: none;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEAAAABACAYAAACqaXHeAAAACXBIWXMAAAHYAAAB2AH6XKZyAAAE9GlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgOS4xLWMwMDIgNzkuYTZhNjM5NjhhLCAyMDI0LzAzLzA2LTExOjUyOjA1ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgMjUuOSAoTWFjaW50b3NoKSIgeG1wOkNyZWF0ZURhdGU9IjIwMjQtMDctMTJUMTA6Mzg6MzkrMDQ6MDAiIHhtcDpNb2RpZnlEYXRlPSIyMDI0LTA3LTEyVDEwOjM5OjI4KzA0OjAwIiB4bXA6TWV0YWRhdGFEYXRlPSIyMDI0LTA3LTEyVDEwOjM5OjI4KzA0OjAwIiBkYzpmb3JtYXQ9ImltYWdlL3BuZyIgcGhvdG9zaG9wOkNvbG9yTW9kZT0iMyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo0OGM1MWUwZi04OWQ2LTQ4MGUtYjI4Mi0yY2FhNmU0ZGIwYzciIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6NDhjNTFlMGYtODlkNi00ODBlLWIyODItMmNhYTZlNGRiMGM3IiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6NDhjNTFlMGYtODlkNi00ODBlLWIyODItMmNhYTZlNGRiMGM3Ij4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDo0OGM1MWUwZi04OWQ2LTQ4MGUtYjI4Mi0yY2FhNmU0ZGIwYzciIHN0RXZ0OndoZW49IjIwMjQtMDctMTJUMTA6Mzg6MzkrMDQ6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCAyNS45IChNYWNpbnRvc2gpIi8+IDwvcmRmOlNlcT4gPC94bXBNTTpIaXN0b3J5PiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PgTwYbQAAAHYSURBVHic7ZrBSsNAFEVPtZ/hD7nLQhEhoBBw1/6Mu0LAxVSRusjObxMqcZPSSJoyk87MLfQd6CKlCfeeZobMtLO2bblkrtQB1JgAdQA1JkAdQI0JUAdQYwLUAdSYAHUANSZAHUCNCVAHUGMC1AHUmAB1ADVz3w/WrrkFVt3hoiqLJkmiidSuKYDX7vClKotvn/NC7oAVcNO9NrVrHoISJqTLsmGfb3X8jD1Th8AccOcgocvg+H83e291hwhYANvesVzCSPktsPS9hreAbsw/MpSwrl1T+l4nFrVr7hmW/wWeQ+anoCFQlcUXQwnXwFtOCV35d4bln6qyWIdcK3gOUEuIWR4mToIqCbHLwwkPQrklpCgPJz4J5pKQqjxEeBROLSFleYi0FkglIXV5iLgYii0hR3mIvBqMJSFXeUiwHD5VQs7ykGg/YKqE3OUh4YZIqARFeUi8I+QrQVUeYJbjX2K1a+6ADw6s3IAfROUhkwA4unbnwHtlVRafOXJlEwCjd0KfbN/8jqy7wiNzwo7s5UGwLT4iQVIeMg+BPr1t7BZYqrbZZQLOhYv/ZcgEqAOoMQHqAGpMgDqAGhOgDqDGBKgDqDEB6gBqTIA6gBoToA6gxgSoA6j5AzmvA+r8mD5eAAAAAElFTkSuQmCC);
	background-position: center right 10px;
	background-repeat: no-repeat;
	background-size: 20px;
}

/* ! checkbox Toggle */
.form_field.form_field_toggle {
	color: var(--color-neutral-600);
	font-size: 1.5rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
}

.toggle_container {
	display: flex;
	align-items: center;
	gap: 20px;
}

.toggle_switch {
	position: relative;
	display: inline-block;
	width: 50px;
	height: 25px;
}

.toggle_switch input {
	opacity: 0;
	width: 0;
	height: 0;
	position: absolute;
}

.toggle_switch input:focus + .toggle_slider {
	box-shadow: none;
}

.toggle_slider {
	position: absolute;
	cursor: pointer;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: #d1d5db;
	transition: 0.4s;
	border-radius: 34px;
}

.toggle_slider:before {
	position: absolute;
	content: "";
	height: 18px;
	width: 18px;
	left: 4px;
	bottom: 4px;
	background-color: var(--color--white);
	transition: 0.4s;
	border-radius: 50%;
}

.toggle_container input:checked + .toggle_slider {
	background-color: var(--color--primary--500-main);
}

.toggle_container input:focus + .toggle_slider {
	box-shadow: 0 0 1px var(--color--primary--500-main);
}

.toggle_container input:checked + .toggle_slider:before {
	transform: translateX(24px);
}

.toggle_slider.toggle_round {
	border-radius: 34px;
}

.toggle_slider.toggle_round:before {
	border-radius: 50%;
}

/* ! form field select */
.form_field_wrapper {
	width: 100%;
	display: flex;
	gap: 24px;
}

.formfield {
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 100%;
}

.formfield.formfield_30 {
	width: 30%;
}

.formfield_33 {
	width: 33%;
}

.formfield.formfield_50 {
	width: 50%;
}

.formfield.formfield_70 {
	width: 70%;
}

.select2.select2-container {
	width: 100% !important;
}

.select2-container--default .select2-selection--single {
	border-radius: 8px;
	border: 1px solid #e5e7eb;
	background: #ffffff;
	box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.04),
		0px 1px 2px 0px rgba(16, 24, 40, 0.04);
	padding: 12px;
	height: 40px;
}

.select2-container--default
	.select2-selection--single
	.select2-selection__rendered {
	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--neutral-400);
	padding-left: 0;
}

.select2-container--default
	.select2-selection--single
	.select2-selection__arrow {
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAARCAYAAADUryzEAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAADESURBVHgB5ZFNDoJADIU7eAJvwCn8W3ETWRowUcC95QAqC12rR/AE4opET+ERPEHtjJCQYUCWJLykTdP0fdNMATotP8Kzv8FD08ygyQwELsdkNHPsV5beWgMKswCIOR7cWtdBKgA/VCsvpPm4R3xmaTqeOqIOYlWeJxhyDqS5aMk638aGHogvcPfCeKv3vSheqetosgyMtwDCMkTWgijhT/zowwLMW1z4GnMCgb8hQk7X0w7dVoAyJJ8ymv9qGWCiQJ3WF3mvTPHPFHmbAAAAAElFTkSuQmCC);
	background-position: center center;
	background-repeat: no-repeat;
	height: 20px;
	width: 20px;
	right: 10px;
	top: 10px;
}

.select2-container--default
	.select2-selection--single
	.select2-selection__arrow
	b {
	display: none;
}

.select2-container--open .select2-dropdown {
	top: 0px;
	left: 0;
	width: 100%;
	border-radius: 8px;
	overflow: hidden;
	border: none;
	border-top-left-radius: 0;
	border-top-right-radius: 0;
}

.select2-results__option {
	font-size: 1.4rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color-neutral-600);
	padding: 6px 12px;
}

.select2-container--default
	.select2-results__option--highlighted.select2-results__option--selectable {
	background-color: var(--color--primary--500-main);
	color: var(--color--neutral-50);
}

.select2-container--default
	.select2-selection--single
	.select2-selection__clear {
	display: none;
}

.select2-search__field {
	position: relative;
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACsAAAAgCAYAAACLmoEDAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAFCSURBVHgB7Zb9jUZAEIfH5QqgAjpAB3SgA0rQAS2oABUogRKogA5QwZ7f5vaS+3jvcvvxJpJ9krGR8cezk9mxDrugm/BCN8LKmsLKmsLKmkJZdpomStOUPM8jx3EojmNqmoaMwBSo6xo/FB5BELAkSZjruh/v67oynUjLQkRIjeP4KVdVFc9BXifSslmWcaFH1YMo8l83ooJ0z6JXoyiiq7I/5vM85+uyLKQLadnjOH7Ni0389d1/kJaFzLZtD2VERcMwJG0wScQkKMvyWw59jIOH2Ped6UJaFhKQgXBRFGwYBh7YhBhfOIQ6UZqzqCBE6X3WioCsmAbI68LBgxSZ55lPh/M8yfd9uipKlzBdotT3PV/btiVlmGGuEaatwsZlgS7hV3oCXdfxFa2igpaefRb28m0KK2sKK2sKK2uKW8m+AdZQIvnQp8kYAAAAAElFTkSuQmCC);
	background-position: -3px center;
	background-repeat: no-repeat;
	height: 30px;
	padding: 0 35px !important;
	font-size: 1.4rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color-neutral-600);
}

/* ! on focus */
.form_field_wrapper input[type="text"]:focus,
.form_field_wrapper input[type="email"]:focus,
.form_field_wrapper input[type="tel"]:focus,
.form_field_wrapper textarea:focus {
	outline: none;
	border: 1px solid var(--color--primary--500-main);
	box-shadow: 0 0 3px var(--color--primary--500-main);
	transition: var(--transition-03);
}

.select2-container--default.select2-container--focus .select2-selection,
.select2-container--default.select2-container--open .select2-selection {
	border: 1px solid var(--color--primary--500-main);
	box-shadow: 0 0 3px var(--color--primary--500-main);
}

.select2-selection {
	transition: var(--transition-03);
}

/* ! input file */
.form_field_browse {
	display: flex;
	gap: 24px;
	align-items: center;
}

.input__file {
	width: 100%;
	height: 100%;
	position: absolute;
	opacity: 0;
	cursor: pointer;
}

.input__filebox {
	width: 125px;
	height: 40px;
	border-radius: 8px;
	background: #d1d5db;
	box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.04),
		0px 1px 2px 0px rgba(16, 24, 40, 0.04);
	display: flex;
	padding: 8px 12px;
	justify-content: center;
	align-items: center;
	gap: 6px;
	font-size: 1.3rem;
	font-weight: var(--medium-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--white);
	position: relative;
	cursor: pointer;
	transition: var(--transition-03);
}

.input__filebox:hover {
	background: var(--color--primary--500-main);
}

.input_file_icn {
	width: 16px;
	height: 16px;
	background: url("../assets/images/svg/upload.svg") center center no-repeat;
	background-size: cover;
}

.input__filebox_text {
	display: flex;
	flex-direction: column;
	color: var(--color-neutral-600);
	font-size: 1.4rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
}

.input__filebox_format {
	font-size: 1.2rem;
	line-height: 1.2rem;
}

/* ! Input calendar */
.form_field_datepicker input {
	cursor: pointer;
}
.form_field_datepicker::before {
	content: "";
	width: 20px;
	height: 20px;
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);

	background: url("../assets/images/svg/calendar.svg") center center no-repeat;
	pointer-events: none;
}

.flatpickr-day.selected {
	background: var(--color--primary--500-main);
	border-color: var(--color--primary--500-main);
}

.flatpickr-day.selected:hover {
	background: var(--color--primary--500-main);
	border-color: var(--color--primary--500-main);
}

/* ! phone number */
.iti {
	width: 100%;
}

.iti--separate-dial-code .iti__selected-flag {
	border-top-left-radius: 8px;
	border-bottom-left-radius: 8px;
	background-color: #d1d5db;
	transition: var(--transition-03);
}

.iti--allow-dropdown .iti__flag-container:hover .iti__selected-flag {
	background-color: var(--color--primary--500-main);
}

.iti--separate-dial-code .iti__selected-dial-code {
	margin-left: 6px;
	color: #fff;
	font-size: 1.3rem;
	font-weight: var(--medium-weight);
	line-height: 1.6rem;
	font-family: var(--font-primary);
}

.iti__arrow {
	margin-left: 6px;
	width: 0;
	height: 0;
	border-left: 3px solid transparent;
	border-right: 3px solid transparent;
	border-top: 4px solid #ffffff;
}

.iti__flag {
	box-shadow: none;
}

/* ! button */
.form__btn {
	display: flex;
	margin-top: 4rem;
	margin-bottom: 4rem;
	gap: 30px;
}

.btn__submit {
	height: 44px;
	flex: 1;
	border-radius: 4px;
	box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06);
	background: var(--color--primary--500-main);
	display: flex;
	padding: 14px 20px;
	justify-content: center;
	align-items: center;
	border: none;
	color: var(--color--white);

	font-size: 1.3rem;
	font-weight: var(--bold-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	transition: var(--transition-03);
	cursor: pointer;
}

.btn__submit:hover {
	background: #88422b;
}

.btn__back {
	width: 175px;
	height: 44px;
	border-radius: 4px;
	background: #e4b8aa;
	box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06);
	display: flex;
	padding: 14px 20px;
	justify-content: center;
	align-items: center;
	border: none;
	color: var(--color--white);

	font-size: 1.3rem;
	font-weight: var(--bold-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	transition: var(--transition-03);
	cursor: pointer;
}

.btn__back:hover {
	background: #88422b;
}

/* ! form 2 */
.form__field__title {
	color: var(--color-neutral-600);
	font-size: 1.5rem;
	font-weight: var(--bold-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	margin-bottom: 2rem;
}

.form__field__level {
	display: flex;
	flex-direction: column;
	margin-bottom: 2rem;
}

.form__field__level_title {
	padding-bottom: 1rem;
	border-bottom: 1px solid #dae1e8;
	margin-bottom: 1rem;
}

.form__field__level_wrapper {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}

.form__field__level_box {
	width: 48.5%;
	display: flex;
	gap: 24px;
	margin: 1.2rem 0;
}

.form__field__level_box_subjects {
	width: 50%;
}

.form__field__level_box_Grade {
	width: 50%;
}

.form__field__level_box input {
	border-radius: 8px;
	border: 1px solid #e5e7eb;
	background-color: #ffffff;
	box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.04),
		0px 1px 2px 0px rgba(16, 24, 40, 0.04);
	padding: 12px;
	height: 40px;
	width: 100%;

	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--neutral-400);
}

.form__field__level_box input[type="text"]:focus {
	outline: none;
	border: 1px solid var(--color--primary--500-main);
	box-shadow: 0 0 3px var(--color--primary--500-main);
	transition: var(--transition-03);
}

/* ! btn attempt */
.btn_attempt {
	display: flex;
	margin-top: 0rem;
}
.btn_attempt button {
	display: flex;
	padding: 10px 20px;
	justify-content: center;
	align-items: center;
	border-radius: 8px;
	background: #d1d5db;
	box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06);

	font-size: 1.3rem;
	font-weight: var(--medium-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--white);
	border: none;
	cursor: pointer;
	transition: var(--transition-03);
}

.btn_attempt button:hover {
	background: var(--color--primary--500-main);
}

.sepfield {
	display: flex;
	flex-direction: column;
	padding: 32px 0;
	border-top: 1px solid #dae1e8;
	border-bottom: 1px solid #dae1e8;
	margin-top: 1rem;
}

.sepfield .form__field__title {
	margin-bottom: 0.8rem;
}
.sepfieldtextarea textarea {
	border-radius: 8px;
	border: 1px solid #e5e7eb;
	background-color: #ffffff;
	box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.04),
		0px 1px 2px 0px rgba(16, 24, 40, 0.04);
	padding: 12px;
	height: 40px;
	width: 100%;
	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--neutral-400);
	overflow: hidden;
}

.sepfieldtextarea textarea:focus {
	outline: none;
	border: 1px solid var(--color--primary--500-main);
	box-shadow: 0 0 3px var(--color--primary--500-main);
	transition: var(--transition-03);
}

.form__field__oi_box {
	display: flex;
	flex-direction: column;
}

.form_field_yearpicker input {
	border-radius: 8px;
	border: 1px solid #e5e7eb;
	background-color: #ffffff;
	box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.04),
		0px 1px 2px 0px rgba(16, 24, 40, 0.04);
	padding: 12px;
	height: 40px;
	width: 100%;

	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--neutral-400);
	appearance: none;
}

.form_field_yearpicker input[type="number"]::-webkit-inner-spin-button,
.form_field_yearpicker input[type="number"]::-webkit-outer-spin-button {
	-webkit-appearance: none;
	margin: 0;
}

/* For Firefox */
.form-field_yearpicker input[type="number"] {
	-moz-appearance: textfield;
}

.form__fiel_m {
	margin-top: 5rem;
}

.formfield_50_btn {
	justify-content: flex-end;
	align-items: flex-end;
	margin-left: auto;
}

#secondAttemptHsc_review {
	margin-top: 2rem;
}

/* ! Breadcrum */

.breadcrum {
	display: flex;
	width: 100%;
}

.breadcrum__inner {
	display: flex;
	padding: 8px 16px;
	align-items: center;
	gap: 4px;
	border-radius: 8px;
	border: 1px solid var(--color-neutral-200);
	gap: 10px;
}

.breadcrum__inner a {
	color: var(--color--neutral-400);
	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	cursor: pointer;
}

.breadcrum__inner a:hover {
	color: var(--color--primary--500-main);
}

.breadcrum__inner a:last-child {
	color: var(--color-neutral-600);
	font-weight: var(--medium-weight);
	pointer-events: none;
}

/* ! Course details */
.details__wrapper {
	display: flex;
	flex-direction: column;
	width: 100%;
	margin-top: 6rem;
	padding-bottom: 10rem;
}

.details__wrapper_top {
	display: flex;
	flex-direction: column;
	width: 100%;
	margin-bottom: 4rem;
}

.details__wrapper_title {
	color: var(--color--primary--500-main);
	font-size: 4rem;
	line-height: 5rem;
	letter-spacing: -1px;
}

.details__wrapper_subtitle {
	color: var(--color--neutral-400);
	font-size: 1.6rem;
	line-height: 2.2rem;
	letter-spacing: -0.5px;
}

.details__wrapper_txt {
	color: var(--color-neutral-600);
	font-size: 1.6rem;
	line-height: 2.2rem;
	letter-spacing: -0.5px;
	margin-top: 1.2rem;
}

.details__wrapper_btn {
	display: flex;
	margin-top: 1.5rem;
}

.details__wrapper_btn a {
	border-radius: 4px;
	background: var(--color--primary--500-main);
	box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06);
	min-width: 176px;
	width: auto;
	padding: 14px 20px;
	justify-content: center;
	align-items: center;
	gap: 8px;
	color: var(--color--white);
	font-size: 1.3rem;
	font-weight: var(--bold-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	text-align: center;
}

.details__wrapper_btn a:hover {
	background: #88422b;
}

.details__wrapper_bot {
	display: flex;
	width: 100%;
	border-top: 1px solid var(--color-neutral-200);
	padding-top: 4rem;
	justify-content: space-between;
	align-items: flex-start;
}

.d_bot_tab {
	width: 25%;
	padding: 10px 0;
	border-left: 1px solid var(--color-neutral-200);
	position: sticky;
	top: 15rem;
}
.d_bot_tab ul {
	display: flex;
	flex-direction: column;
	gap: 1rem;
	cursor: pointer;
}

.d_bot_tab > ul > li {
	padding: 1rem 0 1rem 2rem;
	position: relative;
	overflow: hidden;
	transition: var(--transition-03);
}

.d_bot_tab > ul > li::before {
	content: "";
	width: 4px;
	height: 100%;
	background: var(--color--primary--500-main);
	position: absolute;
	left: 0px;
	top: 0;
	transition: all linear 0.3s;
	opacity: 0;
	visibility: hidden;
}
.d_bot_tab > ul > li.active::before {
	opacity: 1;
	visibility: visible;
}

.d_bot_tab .d_bot_head,
.d_bot_tab > ul > li > a {
	color: var(--color--neutral-400);
	font-size: 1.5rem;
	line-height: 2rem;
	letter-spacing: -0.5px;
}

.d_bot_tab li.d_bot_tab_link.active .d_bot_head,
.d_bot_tab > ul > li.d_bot_tab_link.active > a {
	font-weight: var(--bold-weight);
	color: var(--color--primary--500-main);
}

.d_bot_tab .d_bot_head:hover,
.d_bot_tab > ul > li > a:hover {
	color: var(--color--primary--500-main);
}

.d_bot_body {
	display: none;
	padding: 3rem;
	border-radius: 4px;
	border: 1px solid var(--color-neutral-200);
	background: var(--color--white);
	color: var(--color-neutral-600);
	font-size: 1.5rem;
	line-height: 2rem;
	letter-spacing: -0.5px;
}

.d_bot_tabbody {
	width: 70%;
	display: flex;
	padding: 3rem;
	border-radius: 4px;
	border: 1px solid var(--color-neutral-200);
	background: var(--color--white);
	flex-direction: column;
	color: var(--color-neutral-600);
	font-size: 1.5rem;
	line-height: 2rem;
	letter-spacing: -0.5px;
}

.d_bot_tabbody ul,
.d_bot_body ul {
	display: flex;
	flex-direction: column;
	gap: 1.5rem;
	padding: 0.5rem 0 0 2rem;
	list-style: disc outside;
	padding-left: 2rem;
}

.d_bot_tabbody ul li,
.d_bot_body ul li {
	padding-left: 0px;
	list-style: disc;
}

 /* The overlay style */
 #overlay {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background-color: rgba(0, 0, 0, 0.5);  /* Semi-transparent background */
     display: none;  /* Initially hidden */
     justify-content: center;
     align-items: center;
     z-index: 9999;  /* Make sure it's on top of all other content */
 }

 /* Center content inside the overlay */
 .overlay-content {
     color: white;
     font-size: 24px;
     text-align: center;
 }

 /* Styling for the spinner (optional) */
 .spinner {
     margin-top: 20px;
     border: 4px solid #f3f3f3;
     border-top: 4px solid #3498db;
     border-radius: 50%;
     width: 40px;
     height: 40px;
     animation: spin 2s linear infinite;
 }

 /* Spinner animation */
 @keyframes spin {
     0% { transform: rotate(0deg); }
     100% { transform: rotate(360deg); }
 }

@media screen and (max-width: 767px) {
	.d_bot_tabbody {
		display: none;
	}
	.d_bot_tab {
		width: 100%;
		position: relative;
		top: inherit;
	}
}

/* ! logins */
.log_w {
	display: flex;
	height: 100vh;
}

.log_r {
	width: 50%;
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
}

.log_l {
	width: 50%;
	padding: 0 10%;
	display: flex;
	align-items: center;
}

.log_l_w {
	width: 100%;
	display: flex;
	flex-direction: column;
}

.log_l_logo {
	width: 121px;
	margin-bottom: 3.5rem;
}

.log_l_title {
	color: var(--color-neutral-600);
	font-size: 3rem;
	line-height: 4rem;
	font-weight: var(--semi-bold-weight);
	letter-spacing: -1px;
}

.log_l_subtitle {
	color: var(--color--neutral-400);
	font-size: 1.6rem;
	line-height: 2.2rem;
	letter-spacing: -0.5px;
}

.log_l_form {
	display: flex;
	width: 100%;
	margin-top: 3rem;
}

.form_log {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 3rem;
}

.form_group {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.form_group input {
	border-radius: 8px;
	border: 1px solid #e5e7eb;
	background-color: #ffffff;
	box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.04),
		0px 1px 2px 0px rgba(16, 24, 40, 0.04);
	padding: 12px;
	height: 40px;
	width: 100%;

	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--neutral-400);
}

.form_group input:focus {
	outline: none;
	border: 1px solid var(--color--primary--500-main);
	box-shadow: 0 0 3px var(--color--primary--500-main);
	transition: var(--transition-03);
}

.form_group_input {
	position: relative;
}

.form_group_input .toggle_password {
	width: 40px;
	height: 40px;
	position: absolute;
	right: 0;
	top: 50%;
	transform: translateY(-50%);
}

.toggle_password svg {
	cursor: pointer;
	display: block;
	width: 100%;
	height: 100%;
}

.toggle_password svg .eye_line {
	fill: #9ca3af;
}
.toggle_password svg .eye_line2 {
	fill: none;
	stroke: #9ca3af;
	stroke-linecap: round;
	stroke-miterlimit: 10;
	stroke-dasharray: 20px 29px;
	stroke-dashoffset: 0px;
	transition: 0.3s ease-in-out;
}
.toggle_password.clicked svg .eye_line2 {
	stroke-dashoffset: 20px;
}

.form_group_submit {
	display: flex;
	width: 100%;
	flex-direction: column;
}

.form_group_submit button,
.form_group_submit input {
	height: 44px;
	flex: 1;
	border-radius: 4px;
	box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06);
	background: var(--color--primary--500-main);
	display: flex;
	padding: 14px 20px;
	justify-content: center;
	align-items: center;
	border: none;
	color: var(--color--white);

	font-size: 1.3rem;
	font-weight: var(--bold-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	transition: var(--transition-03);
	cursor: pointer;
}

.form_group_submit button:hover,
.form_group_submit input:hover {
	background: #88422b;
}

.log_l_footer {
	display: flex;
	flex-direction: column;
	text-align: center;
	margin-top: 4rem;
}

.log_l_footer_register {
	color: var(--color-neutral-600);
	font-size: 1.6rem;
	line-height: 2.2rem;
	letter-spacing: -0.5px;
	margin-bottom: 1rem;
}

.log_l_footer_register a {
	color: var(--color--neutral-400);
}

.log_l_footer_register a:hover {
	color: var(--color--primary--500-main);
}

.log_l_agree {
	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--neutral-400);
}

/* ! page confirmation */

.confirmation_p .log_l_logo {
	margin: 0 auto;
	margin-bottom: 2rem;
}

.confirmation_p .log_l_w {
	text-align: center;
}

.confirmation_p .log_l_subtitle {
	margin-top: 1rem;
	font-size: 2rem;
	line-height: 2.2rem;
}

.log_l_btn {
	display: flex;
	justify-content: center;
	width: 200px;
	margin: 0 auto;
	margin-top: 3rem;
}

.log_l_btn a {
	height: 44px;
	flex: 1;
	border-radius: 4px;
	box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06);
	background: var(--color--primary--500-main);
	display: flex;
	padding: 14px 20px;
	justify-content: center;
	align-items: center;
	border: none;
	color: var(--color--white);

	font-size: 1.6rem;
	font-weight: var(--bold-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	transition: var(--transition-03);
	cursor: pointer;
}

.log_l_btn a:hover {
	background: #88422b;
}

/* ! Dashboard */
.help_white {
	fill: var(--color--white);
}

.btn_help {
	font-size: 1.5rem;
	font-weight: var(--medium-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--white);
	padding: 0 20px;
	height: 44px;
	background: transparent;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 99px;
	font-weight: var(--medium-weight);
	gap: 8px;
	border: 1px solid transparent;
}

.btn_help:hover {
	border: 1px solid var(--color--white);
}

.dashboard {
	padding: 5rem 5.72%;
}

.dashboard_top {
	display: flex;
	padding: 1.2rem 0;
	border-bottom: 1px solid var(--color-neutral-200);
	align-items: flex-end;
}

.dashboard_top_right {
	margin-left: auto;
	font-size: 1.5rem;
	font-weight: var(--medium-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--primary--500-main);
}

.dashboard_top_left {
	display: flex;
	align-items: center;
	gap: 30px;
}

.dashboard_username {
	font-size: 3rem;
	line-height: 1.6rem;
	letter-spacing: -1px;
	color: var(--color--primary--500-main);
}

.dashboard_viewprofile {
	display: flex;
}

.dashboard_viewprofile a {
	display: flex;
	padding: 10px 30px;
	align-items: center;
	gap: 8px;
	border-radius: 8px;
	background: #f2dcd4;

	font-size: 1.3rem;
	font-weight: var(--bold-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--white);
}

.dashboard_viewprofile a:hover {
	background: var(--color--primary--500-main);
}

.dashboard_bot {
	width: 100%;
	display: flex;
	margin-top: 3rem;
	justify-content: space-between;
	align-items: flex-start;
}

.dashboard__box__title {
	font-size: 1.3rem;
	font-weight: var(--bold-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: #d1d5db;
	width: 100%;
	margin-bottom: 2rem;
}

.dashboard__bot_left {
	display: flex;
	width: 69%;
	flex-direction: column;
	gap: 30px;
}

.dashboard__schedule {
	width: 100%;
	padding: 36px 51px;
	border-radius: 8px;
	border: 1px solid var(--color-neutral-200);
	background: var(--color--white);
	min-height: 270px;
	display: flex;
	flex-direction: column;
}

.dashboard__schedule_wrapper {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 25px;
}

.dashboard__schedule_box {
	width: 100%;
	display: flex;
	flex-direction: column;
}

.dashboard__schedule_day {
	font-size: 1.6rem;
	line-height: 2rem;
	letter-spacing: -0.5px;
	color: var(--color-neutral-600);
	width: 100%;
	border-bottom: 1px solid var(--color-neutral-200);
	padding-bottom: 8px;
	margin-bottom: 8px;
}

.dashboard__schedule_dayhours {
	width: 100%;
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.dashboard__schedule_dayhours li {
	display: flex;
	gap: 10px;
	font-size: 1.5rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color-neutral-600);
}

.dashboard_schedule_time {
	font-weight: var(--bold-weight);
	width: 40%;
}

.dashboard_schedule_class {
	width: 40%;
}

.dashboard_schedule_location {
	display: flex;
	gap: 3px;
	width: 20%;
	margin-left: auto;
}

.dashboard_schedule_location_icon {
	width: 10px;
}
.dashboard_schedule_location_icon svg {
	display: block;
	width: 100%;
	height: 100%;
}

.dashboard__timetable {
	width: 100%;
	padding: 36px 51px;
	border-radius: 8px;
	border: 1px solid var(--color-neutral-200);
	background: #f2dcd4;
	min-height: 288px;
}

.dashboard__timetable .dashboard__box__title {
	color: #e4b8aa;
}

.dashboard__timetable_wrapper {
	display: flex;
	flex-direction: column;
	width: 100%;
	gap: 25px;
}

.dashboard__timetable_box {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.dashboard__timetable_ref {
	color: #88422b;
	font-size: 1.5rem;
	line-height: 2rem;
	letter-spacing: -0.5px;
	display: flex;
	gap: 10px;
}

.timetable {
	width: 100%;
	display: flex;
}

.timetable table {
	width: 100%;
	border-collapse: collapse;
}

.timetable th,
.timetable td {
	text-align: left;
}

.timetable th {
	color: #d7957f;
	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	border-bottom: 1px solid #f8ece8;
	padding: 8px 0px;
}

.timetable td {
	padding: 10px 0px 0;
	color: #88422b;
	font-size: 1.5rem;
	line-height: 2rem;
	letter-spacing: -0.5px;
}
@media screen and (max-width: 768px) {
	.timetable thead {
		display: none;
	}

	.timetable th,
	.timetable td {
		display: block;
		width: 100%;
	}

	.timetable td:before {
		content: attr(data_label);
		font-weight: bold;
		float: left;
		text-transform: uppercase;
	}

	.timetable tr {
		border-bottom: 1px solid #ddd;
		display: block;
		margin-bottom: 10px;
	}
}

.dashboard__bot_right {
	display: flex;
	flex-direction: column;
	width: 29%;
	gap: 30px;
	position: sticky;
	top: 15rem;
}

.dashboard__details {
	width: 100%;
	padding: 36px 51px;
	border-radius: 8px;
	border: 1px solid var(--color-neutral-200);
	background: var(--color--primary--500-main);
	height: 220px;
}

.dashboard__details .dashboard__box__title {
	color: #f2dcd4;
}

.dashboard__details_wrapper {
	display: flex;
	gap: 20px;
}

.dashboard__details_progress {
	width: 110px;
	height: 110px;
	position: relative;
}

.dashboard__details_icon {
	width: 44px;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

#circle_pg {
	width: 110px;
	height: 110px;
}
.dashboard__details_progress circle {
	stroke-width: 20;
}
#circle_bg {
	stroke: #f2dcd4;
}
#circle_bar {
	stroke: #88422b;
	stroke-width: 21;
	transition: stroke-dashoffset 0.6s ease;
	transform: rotate(-90deg) translate(-200px, 0);
}

.dashboard__details_program {
	display: flex;
	flex-direction: column;
	gap: 20px;
}

.dashboard__details_program > div {
	display: flex;
	flex-direction: column;
	gap: 2px;
}

.d_p_t {
	font-size: 1.5rem;
	font-weight: var(--bold-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--white);
}

.d_p_st {
	font-size: 1.5rem;
	line-height: 2rem;
	letter-spacing: -0.5px;
	color: #e4b8aa;
}

.dashboard__news {
	width: 100%;
	padding: 36px 51px;
	border-radius: 8px;
	border: 1px solid var(--color-neutral-200);
	background: var(--color--white);
	min-height: 340px;
}

.dashboard__news_wrapper {
	display: flex;
	flex-direction: column;
}

.dashboard__news_box {
	margin-bottom: 2rem;
	padding-bottom: 2rem;
	border-bottom: 1px solid var(--color-neutral-200);
}

.dashboard__news_box:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
	border-bottom: none;
}

.dashboard__news_box a {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.dashboard__news_date {
	font-size: 1.3rem;
	font-weight: var(--medium-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: #9ca3af;
}

.dashboard__news_title {
	color: #263c4b;
	font-size: 1.5rem;
	font-weight: var(--medium-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	transition: var(--transition-03);
}

.dashboard__news_txt {
	color: #263c4b;
	font-size: 1.5rem;
	line-height: 2rem;
	letter-spacing: -0.5px;
	transition: var(--transition-03);
}

.dashboard__news_box a:hover .dashboard__news_title,
.dashboard__news_box a:hover .dashboard__news_txt {
	color: var(--color--primary--500-main);
}

/* ! back office */
.bo_center,
.bo_updatepanel {
	padding: 5rem 5.72%;
}

.bo_boxes_wrapper {
	display: flex;
	flex-direction: column;
	width: 100%;
}

.bo_box {
	width: 100%;
	display: flex;
	margin: 16px 0;
	flex-direction: column;
}

.bo_form_wp {
	width: 100%;
	display: flex;
	gap: 24px;
}

.bo_form_field {
	display: flex;
	flex-direction: column;
	gap: 8px;
	width: 100%;
}

.bo_box_input input,
.bo_box_input textarea,
.bo_box_input select {
	border-radius: 8px;
	border: 1px solid #e5e7eb;
	background-color: #ffffff;
	box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.04),
		0px 1px 2px 0px rgba(16, 24, 40, 0.04);
	padding: 12px;
	height: 40px;
	width: 100%;

	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--neutral-400);
	overflow: hidden;
}

.bo_box_checkboxes input {
	border-radius: 8px;
	border: 1px solid #e5e7eb;
	background-color: #ffffff;
	box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.04),
		0px 1px 2px 0px rgba(16, 24, 40, 0.04);
	padding: 12px;

	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--neutral-400);
	overflow: hidden;
}

.bo_box_checkboxes label{

	font-size: 1.2rem;
    line-height: 3.5rem;
	padding: 0 10px;
}

/* ! on focus */
.bo_box_input input:focus,
.bo_box_input textarea:focus {
	outline: none;
	border: 1px solid var(--color--primary--500-main);
	box-shadow: 0 0 3px var(--color--primary--500-main);
	transition: var(--transition-03);
}

.bo_updatepanel_title {
	font-size: 3rem;
	line-height: 3.6rem;
	letter-spacing: -1px;
	color: var(--color--primary--500-main);
}

.bo_box_button {
	display: flex;
	gap: 20px;
}

.bo_box_button input[type="submit"] {
	height: 44px;
	border-radius: 4px;
	box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06);
	background: var(--color--primary--500-main);
	display: flex;
	padding: 14px 20px;
	justify-content: center;
	align-items: center;
	border: none;
	color: var(--color--white);

	font-size: 1.3rem;
	font-weight: var(--bold-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	transition: var(--transition-03);
	cursor: pointer;
}

.bo_box_button input[type="submit"]:hover {
	background: #88422b;
}

.bo_box_button_cancel {
	display: flex;
}

.bo_box_button_cancel a {
	display: flex;
	height: 44px;
	padding: 10px 20px;
	justify-content: center;
	align-items: center;
	border-radius: 4px;
	background: #d1d5db;
	box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06);

	font-size: 1.3rem;
	font-weight: var(--medium-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--white);
	border: none;
	cursor: pointer;
	transition: var(--transition-03);
}

.bo_box_button_cancel a:hover {
	background: #88422b;
}

.timed_question_container .is_verifying.is_ko {
	display: none !important;
	opacity: 0 !important;
	visibility: hidden;
}

/* ! table */
#ContentPlaceHolder1_UpdatePanel1 {
	display: flex;
	flex-wrap: wrap;
}

.bo_updatepanel__wp {
	width: 50%;
	display: flex;
	align-items: flex-end;
}

.bo_update_filter {
	width: 50%;
	display: flex;
	justify-content: flex-end;
	gap: 30px;
}

.f_filter_btn {
	display: flex;
	align-items: flex-end;
	gap: 20px;
}

.f_filter_btn_s input {
	display: flex;
	padding: 10px 20px 10px 45px;
	justify-content: center;
	align-items: center;
	border-radius: 8px;
	background-color: var(--color--primary--500-main);
	box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06);
	font-size: 1.3rem;
	font-weight: var(--medium-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--white);
	border: none;
	cursor: pointer;
	transition: var(--transition-03);
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAAADsAAAA7AF5KHG9AAAE9GlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgOS4xLWMwMDIgNzkuZGJhM2RhM2I1LCAyMDIzLzEyLzE1LTEwOjQyOjM3ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgMjUuNyAoTWFjaW50b3NoKSIgeG1wOkNyZWF0ZURhdGU9IjIwMjQtMDUtMDZUMDg6NDA6NTYrMDQ6MDAiIHhtcDpNb2RpZnlEYXRlPSIyMDI0LTA1LTA2VDA4OjQyOjM0KzA0OjAwIiB4bXA6TWV0YWRhdGFEYXRlPSIyMDI0LTA1LTA2VDA4OjQyOjM0KzA0OjAwIiBkYzpmb3JtYXQ9ImltYWdlL3BuZyIgcGhvdG9zaG9wOkNvbG9yTW9kZT0iMyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpiODQ1YmY0OC02MGJjLTRhMjctOWZkOC0wYmJlYmRhZjAzNGUiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6Yjg0NWJmNDgtNjBiYy00YTI3LTlmZDgtMGJiZWJkYWYwMzRlIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6Yjg0NWJmNDgtNjBiYy00YTI3LTlmZDgtMGJiZWJkYWYwMzRlIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDpiODQ1YmY0OC02MGJjLTRhMjctOWZkOC0wYmJlYmRhZjAzNGUiIHN0RXZ0OndoZW49IjIwMjQtMDUtMDZUMDg6NDA6NTYrMDQ6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCAyNS43IChNYWNpbnRvc2gpIi8+IDwvcmRmOlNlcT4gPC94bXBNTTpIaXN0b3J5PiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PtvU2bwAAAItSURBVFiF1ZfNbw1hFIefkSZNGxbUyoL6aCUsuhXfpI0VsSwLtjatJRvxL9B/QH1uJEIiNjYVacIaTUtCgl2rtMUG97GYd+Le3rl3bjvvFU7yJjNn5pfz9Zsz56AS4STqafW5+k19r95QtxRhYxhHHTNfFtSBdjtwIhhbVM+oa9Ud6r2gnwoZysUn6gDQz+plFNgPnAfGqvSdwBSwDbgAvMvBzqDON0jfSmV3ToTXCjCfOoBLwKESGdgHbAL6gFfLnmWZnQBmc7ATMTgwEqKZUXur9KNBP692NcLHcKBbfRaMfVcn1TfhvmJKzLZ/hj3quPqrqr4f1OEibKKWKH+dbAB2AZ+BGeBnESC2AyuWjhbfOwYcAdYDL4FbpFGWl4IadamPrJc5dSgGf4peuB0MzqqX1XPq46BbNG25bXNga2D1Uo6hzLErMRyYzElxtdzNAe4pwLQqT9cAlVVQJ4lCQGianl7TEnxV+6r0iXonRBClBM3OzWBoznoSLqjb2+1Al/owp3az6mBZ49p6Kx4CjpK22hekjehLDBL8N624Vemh9mf0oxARo47qRvW66f8/k4/qqbIkbOV0m+4D+mcgeR3uK+rZdjuQjWTT1i4imb7pSJaoI8CBEnXPhtKTwINlzyaBvTQeSp/gPzCWHwZ2lshAtpgMUjuWdwIHw/VF4G0OdjoGB46HaJZMCbdO7VfvB33T1SzWZ3i1QYr/ynJKiHDYdD/I1vNxdXMR9jdLwr1sQxl/oQAAAABJRU5ErkJggg==);
	background-repeat: no-repeat;
	background-position: 15px center;
	background-size: 20px;
}

.f_filter_btn_s input:hover {
	background-color: #88422b;
}

.f_filter_btn_c input {
	display: flex;
	padding: 10px 20px 10px 45px;
	justify-content: center;
	align-items: center;
	border-radius: 8px;
	background-color: #d1d5db;
	box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06);
	font-size: 1.3rem;
	font-weight: var(--medium-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--white);
	border: none;
	cursor: pointer;
	transition: var(--transition-03);
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAAADsAAAA7AF5KHG9AAAE9GlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgOS4xLWMwMDIgNzkuZGJhM2RhM2I1LCAyMDIzLzEyLzE1LTEwOjQyOjM3ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgMjUuNyAoTWFjaW50b3NoKSIgeG1wOkNyZWF0ZURhdGU9IjIwMjQtMDUtMDZUMDg6NDA6NDErMDQ6MDAiIHhtcDpNb2RpZnlEYXRlPSIyMDI0LTA1LTA2VDA4OjQyOjI0KzA0OjAwIiB4bXA6TWV0YWRhdGFEYXRlPSIyMDI0LTA1LTA2VDA4OjQyOjI0KzA0OjAwIiBkYzpmb3JtYXQ9ImltYWdlL3BuZyIgcGhvdG9zaG9wOkNvbG9yTW9kZT0iMyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDplOTZiMWMxNi0yOGJmLTRhNTAtOTJlNy1lNTY5MzZlZTRmNzAiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ZTk2YjFjMTYtMjhiZi00YTUwLTkyZTctZTU2OTM2ZWU0ZjcwIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6ZTk2YjFjMTYtMjhiZi00YTUwLTkyZTctZTU2OTM2ZWU0ZjcwIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDplOTZiMWMxNi0yOGJmLTRhNTAtOTJlNy1lNTY5MzZlZTRmNzAiIHN0RXZ0OndoZW49IjIwMjQtMDUtMDZUMDg6NDA6NDErMDQ6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCAyNS43IChNYWNpbnRvc2gpIi8+IDwvcmRmOlNlcT4gPC94bXBNTTpIaXN0b3J5PiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsNN+gwAAAMKSURBVFiFxZfbi1dVFMc/Z+YnOHlJkwH1Iaw0dVDTsCCoBCdUjBB9Eg0d9b8JQUH8D4JCCvWpqOyGF+zRbHRE8TYqJVYopIL68eGs02x+nduMxmzY7M1ea33X96y99tr7ZCqT2Xom1TvQGYduBrwNbAFWA0uB6cA04CZwCTgBfA0cB9qFVm3qverH6nnbt7PqkNrThN/kfJF6OgEeVferH6oL1FlqJ+Yb1L3qtUT/uLp4ogTWqfcC6Lq6W53SImIddVuQVf1LHRwvgY3qgwD4Qp3dwnF3n6F+FhgP1TVtCSxS/w7Dg2o2AedFz9R9gXXbfKtqCfSov4TB4Wd0nmIeCcxT3ZjdykOheEN98Tk4T7fjemBvqSKQqSOhNFQBNE99ocHRQIVsT2APp1FIFd4LhVvmmdwNMFe9r/6q9pfI+0OmurxE3qteCfmqYj0txRtj/Bx4VFKz7gIXgWXA90B/IuuPtWXABWC0xP4xcDTmH5VVwp+C3aaaEKdfWUQiXTunzq+xXx96x8q2oEiSV2oAykgU8+HYpjrbV0P3fBmBf0I4owGkIHHGsXbOPEGb7KaqT8wr7H9yoGhZ8xXW8qYrx86AJ8VCSuBOjHMaQOYA3wHLgbPRlwDHgLkNtvNivFVG4FKMK2oAZgPfAm8Aw8AHwNogsRT4AZhfY78wxhtlBE7GuKbCuA/4BlgFjACDwO/A7YTEkiDxUgVGcdR//HclSZB3I6FuWl6IBkI+UnHU0tPxTom8V70c8pVlpyBz7NWzsyKLV6rTarK8T32zQrYrsH+zohSj7gilUXVmi2PVtk937KW0OZV1K6bX8Zc+n+s4CyzVk92YZQYLzZ9RqgeekUSmfhJYf9jiQVL09eY3n+oh88fnRML+aWA8VN8v06sDGFTvBsBV88TsbeG4o251bM//VNdW6TeBvWb+jCraVfOn9wb1ZfMT0Yn5ugj3lUT/Z/X1Oh9tQtmjbnd8PyZnzE9UY/5k2vpeyYC3gM3kv2YDUR37oiJeJv8l+yqpqs2g4yDwv7RJ/zt+ClQJpFtBO9c2AAAAAElFTkSuQmCC);
	background-repeat: no-repeat;
	background-position: 15px center;
	background-size: 25px;
}

.f_filter_btn_c input:hover {
	background-color: var(--color--primary--500-main);
}

.f_filter_box {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.editable_table {
	display: flex;
	width: 100%;
	margin-top: 5rem;
	flex-direction: column;
	gap: 20px;
}

.editable_table_wp {
	display: flex;
	width: 100%;
}

.editable_table_wp > div {
	display: flex;
	width: 100%;
}

.table.table-striped {
	width: 100%;
	border: 1px solid #ac5336;
	border-width: 1px !important;
	border-style: solid !important;
}

.table.table-striped td {
	font-size: 1.5rem;
	line-height: 2rem;
	letter-spacing: -0.5px;
	color: var(--color-neutral-600);
	padding: 1rem 1rem;
	border: 1px solid #ac5336;
}

.table.table-striped tr:nth-child(odd) {
	background: #f2f2f2;
}

.table.table-striped th {
	font-size: 1.5rem;
	line-height: 2rem;
	letter-spacing: -0.5px;
	color: var(--color-neutral-600);
	padding: 1rem 2rem;
	text-align: left;
	border: 1px solid #ac5336;
}

.btn_addnew {
	display: flex;
	margin-top: 3rem;
}

.btn_addnew a {
	display: flex;
	padding: 10px 20px;
	justify-content: center;
	align-items: center;
	border-radius: 8px;
	background: #d1d5db;
	box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06);

	font-size: 1.3rem;
	font-weight: var(--medium-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--white);
	border: none;
	cursor: pointer;
	transition: var(--transition-03);
}

.btn_addnew a:hover {
	background: var(--color--primary--500-main);
}

.f_filter_input {
	width: 200px;
}

.f_filter_input select {
	border-radius: 8px;
	border: 1px solid #e5e7eb;
	background-color: #ffffff;
	box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.04),
		0px 1px 2px 0px rgba(16, 24, 40, 0.04);
	padding: 12px;
	height: 40px;
	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--neutral-400);
	width: 100%;
	padding: 10px;
}

.edit_btn_link_icon {
	width: 25px;
	display: inline-block;
	height: 25px;
}

.edit_btn_link {
	display: flex;
	align-items: center;
	gap: 5px;
}

.back_to_page a {
	display: flex;
	align-items: center;
	gap: 5px;
	font-size: 1.5rem;
	font-weight: var(--medium-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--primary--500-main);
}

.back_to_page a:hover {
	color: #88422b;
}

.back_to_page_icn {
	width: 25px;
	height: 25px;
}

.back_to_page {
	display: flex;
	margin-bottom: 3rem;
}

.delete_btn_link a {
	display: flex;
	padding: 10px 20px 10px 30px;
	justify-content: center;
	align-items: center;
	border-radius: 8px;
	background-color: #c70000;
	box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06);
	font-size: 1.3rem;
	font-weight: var(--medium-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--white);
	border: none;
	cursor: pointer;
	transition: var(--transition-03);
	background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAYAAABzenr0AAAACXBIWXMAAADsAAAA7AF5KHG9AAAE9GlUWHRYTUw6Y29tLmFkb2JlLnhtcAAAAAAAPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgOS4xLWMwMDIgNzkuZGJhM2RhM2I1LCAyMDIzLzEyLzE1LTEwOjQyOjM3ICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOmRjPSJodHRwOi8vcHVybC5vcmcvZGMvZWxlbWVudHMvMS4xLyIgeG1sbnM6cGhvdG9zaG9wPSJodHRwOi8vbnMuYWRvYmUuY29tL3Bob3Rvc2hvcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RFdnQ9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZUV2ZW50IyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgMjUuNyAoTWFjaW50b3NoKSIgeG1wOkNyZWF0ZURhdGU9IjIwMjQtMDUtMDZUMDg6NDA6NDErMDQ6MDAiIHhtcDpNb2RpZnlEYXRlPSIyMDI0LTA1LTA2VDA4OjQyOjI0KzA0OjAwIiB4bXA6TWV0YWRhdGFEYXRlPSIyMDI0LTA1LTA2VDA4OjQyOjI0KzA0OjAwIiBkYzpmb3JtYXQ9ImltYWdlL3BuZyIgcGhvdG9zaG9wOkNvbG9yTW9kZT0iMyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDplOTZiMWMxNi0yOGJmLTRhNTAtOTJlNy1lNTY5MzZlZTRmNzAiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6ZTk2YjFjMTYtMjhiZi00YTUwLTkyZTctZTU2OTM2ZWU0ZjcwIiB4bXBNTTpPcmlnaW5hbERvY3VtZW50SUQ9InhtcC5kaWQ6ZTk2YjFjMTYtMjhiZi00YTUwLTkyZTctZTU2OTM2ZWU0ZjcwIj4gPHhtcE1NOkhpc3Rvcnk+IDxyZGY6U2VxPiA8cmRmOmxpIHN0RXZ0OmFjdGlvbj0iY3JlYXRlZCIgc3RFdnQ6aW5zdGFuY2VJRD0ieG1wLmlpZDplOTZiMWMxNi0yOGJmLTRhNTAtOTJlNy1lNTY5MzZlZTRmNzAiIHN0RXZ0OndoZW49IjIwMjQtMDUtMDZUMDg6NDA6NDErMDQ6MDAiIHN0RXZ0OnNvZnR3YXJlQWdlbnQ9IkFkb2JlIFBob3Rvc2hvcCAyNS43IChNYWNpbnRvc2gpIi8+IDwvcmRmOlNlcT4gPC94bXBNTTpIaXN0b3J5PiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PsNN+gwAAAMKSURBVFiFxZfbi1dVFMc/Z+YnOHlJkwH1Iaw0dVDTsCCoBCdUjBB9Eg0d9b8JQUH8D4JCCvWpqOyGF+zRbHRE8TYqJVYopIL68eGs02x+nduMxmzY7M1ea33X96y99tr7ZCqT2Xom1TvQGYduBrwNbAFWA0uB6cA04CZwCTgBfA0cB9qFVm3qverH6nnbt7PqkNrThN/kfJF6OgEeVferH6oL1FlqJ+Yb1L3qtUT/uLp4ogTWqfcC6Lq6W53SImIddVuQVf1LHRwvgY3qgwD4Qp3dwnF3n6F+FhgP1TVtCSxS/w7Dg2o2AedFz9R9gXXbfKtqCfSov4TB4Wd0nmIeCcxT3ZjdykOheEN98Tk4T7fjemBvqSKQqSOhNFQBNE99ocHRQIVsT2APp1FIFd4LhVvmmdwNMFe9r/6q9pfI+0OmurxE3qteCfmqYj0txRtj/Bx4VFKz7gIXgWXA90B/IuuPtWXABWC0xP4xcDTmH5VVwp+C3aaaEKdfWUQiXTunzq+xXx96x8q2oEiSV2oAykgU8+HYpjrbV0P3fBmBf0I4owGkIHHGsXbOPEGb7KaqT8wr7H9yoGhZ8xXW8qYrx86AJ8VCSuBOjHMaQOYA3wHLgbPRlwDHgLkNtvNivFVG4FKMK2oAZgPfAm8Aw8AHwNogsRT4AZhfY78wxhtlBE7GuKbCuA/4BlgFjACDwO/A7YTEkiDxUgVGcdR//HclSZB3I6FuWl6IBkI+UnHU0tPxTom8V70c8pVlpyBz7NWzsyKLV6rTarK8T32zQrYrsH+zohSj7gilUXVmi2PVtk937KW0OZV1K6bX8Zc+n+s4CyzVk92YZQYLzZ9RqgeekUSmfhJYf9jiQVL09eY3n+oh88fnRML+aWA8VN8v06sDGFTvBsBV88TsbeG4o251bM//VNdW6TeBvWb+jCraVfOn9wb1ZfMT0Yn5ugj3lUT/Z/X1Oh9tQtmjbnd8PyZnzE9UY/5k2vpeyYC3gM3kv2YDUR37oiJeJv8l+yqpqs2g4yDwv7RJ/zt+ClQJpFtBO9c2AAAAAElFTkSuQmCC);
	background-repeat: no-repeat;
	background-position: 15px center;
	background-size: 20px;
}

.delete_btn_link a:hover {
	background-color: #88422b;
}

.hidden-box {
	display: none;
}

.table-block-btn {
	display: flex;
	gap: 10px;
}

.table-btn {
	background-color: #4caf50;
	border: none;
	color: #fff;
	padding: 10px 20px 10px 20px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 1.3rem;
	transition: var(--transition-03);
	cursor: pointer;
	border-radius: 8px;
	box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06);
}

.table-btn:hover {
	background-color: #45a049; /* Darker green background on hover */
}

/* Different colors for different buttons */
#ContentPlaceHolder1_btnReject {
	background-color: #f44336; /* Red background */
}

#ContentPlaceHolder1_btnReject:hover {
	background-color: #da190b; /* Darker red on hover */
}

#ContentPlaceHolder1_btnEnroll {
	background-color: #008cba; /* Blue background */
}

#ContentPlaceHolder1_btnEnroll:hover {
	background-color: #005f86; /* Darker blue on hover */
}

.f_c_l_intro {
	color: var(--color-neutral-600);
	font-size: 1.6rem;
	line-height: 2.2rem;
	letter-spacing: -0.5px;
	margin-top: 1.2rem;
	margin-bottom: 6rem;
}

.tabbody_c_t {
	width: 55%;
}

.read-more {
	width: 124px;
	height: 44px;
	background: var(--color--primary--500-main);
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 99px;
	font-weight: var(--medium-weight);
	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	border: 1px solid transparent;
	margin-top: 20px;
}

.table_dropdown {
	display: flex;
}

.table_dropdown_left {
	width: 400px;
}

.table_dropdown_right {
	margin-left: 20px;
}

.table_dropdown_right input {
	display: flex;
	padding: 12px 20px 12px 20px;
	justify-content: center;
	align-items: center;
	border-radius: 8px;
	background-color: var(--color--primary--500-main);
	box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06);
	font-size: 1.3rem;
	font-weight: var(--medium-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--white);
	border: none;
	cursor: pointer;
	transition: var(--transition-03);
}

.table_dropdown_right input:hover {
	background-color: #88422b;
}

.user_details_status,
.user_details_username,
.user_details_password {
	color: var(--color-neutral-600);
	font-size: 1.8rem;
	line-height: 2rem;
	letter-spacing: -0.5px;
	margin-top: 1rem;
	margin-bottom: 1rem;
}

.user_details_password {
	margin-bottom: 2rem;
}

.st_title {
	font-weight: var(--bold-weight);
}

.contact-form {
	width: 50%;
}

.contact-form h2 {
	color: var(--color--primary--500-main);
	font-size: 6rem;
	line-height: 7rem;
	font-weight: var(--light-weight);
	letter-spacing: -2px;
	margin-bottom: 5rem;
}

.contact_fields {
	display: flex;
	flex-direction: column;
	margin: 16px 0;
}

.contact_fields label {
	color: var(--color-neutral-600);
	font-size: 1.5rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	margin-bottom: 0.8rem;
}

.contact_fields input,
.contact_fields textarea {
	border-radius: 8px;
	border: 1px solid #e5e7eb;
	background-color: #ffffff;
	box-shadow: 0px 1px 2px 0px rgba(16, 24, 40, 0.04),
		0px 1px 2px 0px rgba(16, 24, 40, 0.04);
	padding: 12px;
	height: 40px;
	width: 100%;

	font-size: 1.3rem;
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	color: var(--color--neutral-400);
	overflow: hidden;
}

.contact_fields input:focus,
.contact_fields textarea:focus {
	outline: none;
	border: 1px solid var(--color--primary--500-main);
	box-shadow: 0 0 3px var(--color--primary--500-main);
	transition: var(--transition-03);
}

.contact_fields_btn {
	width: 50%;
}

.contact_fields_btn input {
	height: 44px;
	flex: 1;
	border-radius: 4px;
	box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06);
	background: var(--color--primary--500-main);
	display: flex;
	padding: 14px 20px;
	justify-content: center;
	align-items: center;
	border: none;
	color: var(--color--white);

	font-size: 1.3rem;
	font-weight: var(--bold-weight);
	line-height: 1.6rem;
	letter-spacing: -0.5px;
	transition: var(--transition-03);
	cursor: pointer;
}

.contact_fields_btn input:hover {
	background: #88422b;
}

/* ! profile section */
.forms__section.profile_section h1 {
	font-size: 3rem;
	line-height: 1.6rem;
	letter-spacing: -1px;
	color: var(--color--primary--500-main);
	padding: 1.2rem 0;
	border-bottom: 1px solid var(--color-neutral-200);
}

.forms__section.profile_section .profile-info {
	display: flex;
	flex-direction: column;
	margin-top: 2rem;

	font-size: 1.8rem;
	line-height: 2rem;
	letter-spacing: -0.5px;
	color: var(--color-neutral-600);
	gap: 10px;
}

.forms__section.profile_section .info {
	color: var(--color-neutral-600);
	font-size: 1.8rem;
	line-height: 2rem;
	letter-spacing: -0.5px;
	margin-top: 3rem;
}

.forms__section.profile_section .info a {
	text-decoration: underline;
}

.toggle_label {
	flex: 1;
}

.formfield_error {
	position: relative;
}

.empty_error {
}

.error_message {
	position: absolute;
	color: red;
	bottom: -15px;
	left: 5px;
	font-size: 1.2rem;
}

.form_field_label {
	position: relative;
}

.file-upd-review {
	position: absolute;
	right: 0;
	top: 0;
	width: 115px;
}

.file-upd-review a {
	display: flex;
	height: auto;
	padding: 5px;
	justify-content: center;
	align-items: center;
	border-radius: 4px;
	background: var(--color--primary--500-main);
	font-size: 1.2rem;
	font-weight: var(--medium-weight);
	line-height: 1.4rem;
	letter-spacing: -0.5px;
	color: var(--color--white);
	border: none;
	cursor: pointer;
	transition: var(--transition-03);
}

.file-upd-review a:hover {
	background: #88422b;
}

.numInputWrapper span {
	display: none;
}

.flatpickr-months .flatpickr-month {
	display: flex;
	justify-content: center;
}
.flatpickr-months .flatpickr-monthDropdown-months {
	flex-grow: 1;
	margin: 0 5px;
}
.flatpickr-months .flatpickr-yearDropdown {
	flex-grow: 1;
	margin: 0 5px;
}

.print_btn {
	display: flex;
}

.print_btn input {
	background-color: #008cba;
	border: none;
	color: #fff;
	padding: 10px 20px 10px 20px;
	text-align: center;
	text-decoration: none;
	display: inline-block;
	font-size: 1.3rem;
	transition: var(--transition-03);
	cursor: pointer;
	border-radius: 8px;
	box-shadow: 0px 2px 6px 0px rgba(16, 24, 40, 0.06);
}

.print_btn input:hover {
	background-color: #4caf50;
}

.table_dropdown_right.inner_control_btn {
	display: flex;
	gap: 3rem;
	margin: 0;
}

.bo_filter {
	display: flex;
	flex-direction: column;
	gap: 2rem;
	margin-top: 3rem;
}

.bo_filter .bo_update_filter {
	width: 100%;
	display: flex;
	justify-content: normal;
	gap: 30px;
}

/* Custom style to center the modal text */
.modal-body {
	font-size: 1.6rem; /* Larger text for readability */
	padding: 30px;     /* Extra padding for more space */
	/*text-align: center;  /*Center text */
}

.modal-header {
	background-color: #ac5336; /* Blue header */
	color: white;               /* White text */
	font-size: 1.3rem;         /* Slightly larger header font */
}

.modal-footer {
	border-top: none; /* Remove the border from the footer */
}

.modal-footer .btn-primary{
	background-color: #d1d5db;
    border-color: transparent;
    color: black;
	width: 90px;
}

/* Custom text color for success or error */
.modal-success {
	color: green;
	font-weight: bold;
}

.modal-error {
	color: red;
	font-weight: bold;
}