@import url('https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,100..1000;1,9..40,100..1000&family=Epilogue:ital,wght@0,100..900;1,100..900&family=Sora:wght@100..800&display=swap');

:root {
	--primary-color: #006CE4;
	--dark-color: #142949;
	--light-blue-color: #EBF3FF;
	--dark-blue-color: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), #003B95;
	--yellow-color: #FFB700;
	--red-color: #FE543D;
	--green-color: #2FC7A1;


	--default-section-padding-top: 40px;
	--default-section-padding-bottom: 40px;
	--default-section-padding: 40px 0;
	--minimized-section-padding-top: 25px;
	--minimized-section-padding-bottom: 25px;
	--minimal-section-padding-top: 20px;
	--minimal-section-padding-bottom: 20px;
	--main-label-height: 40px;
	--category-box-height: 70px;
	--mini-main-label-height: 35px;
	--padding-top-for-main-container: 120px;
	--margin-top-sticky-upper-header: -60px;
	--margin-top-sticky-lower-header: 10px;

	--container-max-width: 1260px;

	--body-background-color: #fff;
	--main-subheader-color: var(--dark-color);
	--main-para-text-color: var(--dark-color);
	--homepage--from-beginner-to-pro-list-labeltext-color: var(--dark-color);
	--homepage--from-beginner-to-pro-list-labeltext-bottom-color: var(--primary-color);
	--accent-word-color: var(--dark-color);
	--blue-text-color: var(--primary-color) !important;
	--header-menu-item-color: var(--dark-color);
	--mobile-menu-background-color: var(--light-blue-color);
	--mobile-menu-icon-color: var(--dark-color);
	--mobile-lang-switcher-text-color: var(--primary-color);
	--register-main-subheader-text-color: var(--primary-color);
	--category-box-hover-bg-color: #002f77;
	--category-box-hover-text-color: #fff;
}

.darkmode {
	--body-background-color: #002f77;
	--main-subheader-color: #fff;
	--main-para-text-color: #fff;
	--homepage--from-beginner-to-pro-list-labeltext-color: #fff;
	--homepage--from-beginner-to-pro-list-labeltext-bottom-color: #fff;
	--accent-word-color: var(--primary-color);
	--blue-text-color: #fff !important;
	--header-menu-item-color: #fff;
	--mobile-menu-background-color: #002f77;
	--mobile-menu-icon-color: #fff;
	--mobile-lang-switcher-text-color: #fff;
	--category-box-hover-bg-color: var(--yellow-color);
	--category-box-hover-text-color: var(--dark-color);
}

*, *::before, *::after {
	box-sizing: border-box !important;
	margin: 0;
	padding: 0;
}

html {
	scroll-behavior: smooth;
	overflow-x: hidden;
}

body {
	font-family: "DM Sans", sans-serif;
	overflow-x: hidden !important;
	background-color: var(--body-background-color);
	transition: background-color 0.3s ease;
}

h1, h2, h3, h4, h5, h6 {
	line-height: initial;
	margin: 0;
}

dl, ol, ul, p {
	margin-bottom: 0;
	margin-top: 0;
}

a {
	text-decoration: none;
}

img {
	max-width: 100%;
}

.btn:not(.dropdown-toggle) {
	border: none !important;
	outline: none !important;
	box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.15);
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	height: 40px;
	transition: background-color 0.3s ease, color 0.3s ease;
	text-align: center !important;
	background-image: none;
	font-weight: 700;
	font-size: 16px;
	padding-left: 20px;
	padding-right: 5px;
	border-radius: 100px;
	transition: transform 0.3s ease-in-out;
}

.btn:not(.dropdown-toggle):hover {
	transform: translateY(-8px) !important;
}

.btn img {
	height: 30px;
}

.btn i {
	font-size: 30px;
}

.btn.general {
	padding-left: 25px;
	padding-right: 25px;
}

.btn.small {
	height: 30px;
	border-radius: 15px;
	padding-left: 15px;
	padding-right: 15px;
}

.btn.small img {
	height: 20px;
}

.btn.small i {
	font-size: 20px;
}

.btn-primary {
	background-color: var(--primary-color) !important;
	color: #fff !important;
}

.btn-primary i {
	color: #fff;
}

.btn-danger {
	background-color: var(--red-color) !important;
	color: #fff !important;
}

.btn-dark {
	background-color: var(--dark-color) !important;
	color: #fff !important;
}

.btn-secondary {
	background-color: #fff !important;
	color: var(--dark-color) !important;
}

.btn-secondary.with-border {
	border: 1px solid var(--primary-color) !important;
}

.blank-link {
	color: inherit !important;
}

.yellow-link {
	color: var(--yellow-color) !important;
	font-weight: 600;
}

.main-subheader-text {
	font-weight: 700;
	font-size: 30px;
	line-height: 38px;
	color: var(--main-subheader-color);
	margin-bottom: 20px;
}

.main-para-text {
	font-weight: 500;
	font-size: 16px;
	line-height: 26px;
	color: var(--main-para-text-color);
}

.main-para-text.pre-line {
	white-space: pre-line;
}

.blue-text {
	color: var(--blue-text-color) !important; 
}

.expand-right {
	position: relative;
	left: 50%;
	width: 100vw;
	transform: translateX(-50%);
	padding-left: calc((100vw - var(--container-max-width)) / 2 + 15px);
}

.gradient-border {
	padding: 1px;
	border-radius: 20px;
	background: linear-gradient(180deg, #FFFFFF 0%, #006CE4 100%);
	display: block;
}

.category-box {
	box-shadow: 0px 5px 20px 0px #00000040;
	display: flex;
	align-items: center;
	min-height: var(--category-box-height);
	height: auto;
	border-radius: 5px;
}

.category-box > * {
	align-self: stretch;
}

.category-box .text-cont {
	background-color: var(--light-blue-color);
	padding-left: 15px;
	padding-right: 15px;
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	transition: background-color 0.3s ease;
	flex: 1;
}

.category-box .icon-cont {
	background-color: var(--primary-color);
	display: flex;
	align-items: center;
	width: var(--category-box-height);
	flex: 0 0 var(--category-box-height);
	box-shadow: 0px 5px 20px 0px #00000040;
	border-top-left-radius: 5px;
	border-bottom-left-radius: 5px;
	justify-content: center;
}

.category-box .icon-cont img {
	height: 30px;
}

.category-box-text {
	color: var(--dark-color);
	font-weight: 400;
	display: inline-flex;
	text-align: center;
	transition: color 0.3s ease;
	word-break: break-all;
}

.category-box-text.small {
	font-size: 12px;
}

.category-box-text.large {
	font-size: 16px;
}

.category-box:hover .text-cont {
	background-color: var(--category-box-hover-bg-color);
}

.category-box:hover .text-cont .category-box-text {
	color: var(--category-box-hover-text-color);
}

.main-label {
	background-color: var(--primary-color);
	box-shadow: 0px 5px 20px 0px #00000040;
	border-radius: 10px;
	position: relative;
	display: flex;
	align-items: center;
	min-height: var(--main-label-height);
	height: auto;
	padding-left: calc(var(--main-label-height) + 15px);
	padding-right: 15px;
	width: fit-content;
	margin-bottom: 20px;
	margin-left: 1px;
	padding-top: 7px;
	padding-bottom: 7px;
}

.main-label.course-details {
	margin-bottom: 40px;
}

.main-label.mini {
	background-color: #fff;
	min-height: unset;
	height: var(--mini-main-label-height);
	padding-left: calc(var(--mini-main-label-height) + 10px);
	margin-bottom: 0;
	border-radius: 5px;
	overflow: hidden;
	margin-left: 0;
	padding-top: 0;
	padding-bottom: 0;
}

.main-label-text {
	font-weight: 700;
	font-size: 18px;
	line-height: 24px;
	color: #fff;
	overflow: hidden;
}

.main-label.mini .main-label-text {
	font-weight: 400;
	font-size: 16px;
	line-height: 20px;
	color: var(--dark-color);
}

.main-label .icon-cont {
	position: absolute;
	background-color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	width: var(--main-label-height);
	height: 100%;
	top: 50%;
	transform: translateY(-50%);
	left: -1px;
	border-radius: 10px;
	box-shadow: 0px 5px 20px 0px #00000040;
}

.main-label.mini .icon-cont {
	width: var(--mini-main-label-height);
	height: var(--mini-main-label-height);
	border-radius: 0;
	background-color: var(--primary-color);
	left: 0;
	top: 0;
	bottom: 0;
	transform: none;
}

.main-label .icon-cont img {
	height: 30px;
} 

.main-label.mini .icon-cont img {
	height: 20px;
}

#why-join,
#teach-at-our-place,
#what-you-get,
#plans,
#opinions,
#introduction,
#degrees, 
#courses {
	scroll-margin-top: var(--padding-top-for-main-container);
}

.section-auth {
	padding: var(--default-section-padding);
}

.form-control,
.form-select {
	box-shadow: 0px 5px 20px 0px #00000040 !important;
	border-radius: 10px !important;
	height: 40px;
	padding-left: 20px;
	padding-right: 20px;
	font-size: 16px;
	border: none !important;
	outline: none !important;
	color: var(--dark-color);
}

textarea.form-control {
	height: auto !important;
	padding-top: 10px;
}

.form-control::placeholder {
	color: #8a94a4;
}

.form-control[type="file"] {
	padding: 0 !important;
}

.form-control::file-selector-button {
	height: 100%;
	margin: 0;
	margin-inline-end: 10px;
}

.form-check {
	display: flex;
	gap: 10px;
}

.form-check-input[type="checkbox"] {
	border: none !important;
	outline: none !important;
	box-shadow: 0px 5px 20px 0px #00000040;
	border-radius: 5px;
	width: 18px;
	height: 18px;
}

.form-check-input[type="checkbox"]:checked {
	background-color: var(--primary-color);
}

.form-check-label {
	font-size: 16px;
	line-height: 24px;
	color: var(--dark-color);
}

.stepper {
	display: flex;
	align-items: center;
	margin: 40px auto;
	max-width: 500px;
}

.stepper .stepper-item {
	width: 40px;
	height: 40px;
	border-radius: 50%;
	background-color: var(--dark-color);
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 1;
	font-size: 20px;
	color: #fff;
	cursor: pointer;
}

.stepper .stepper-item.active {
	background-color: var(--primary-color);
}

.stepper .line-item {
	flex-grow: 1;
	height: 5px;
	background-color: var(--yellow-color);
}

.stepper .line-item.active {
	background-color: var(--primary-color);
}

.thanks-for-joining-card {
	background-color: #fff;
	box-shadow: 0px 5px 20px 0px #00000040;
	border-radius: 10px;
	padding: 40px 30px;
	text-align: center;
	max-width: 850px;
	margin: 0 auto;
}

.thanks-for-joining-card .main-subheader-text {
	margin: 0;
	color: var(--primary-color);
}

.thanks-for-joining-card-para-box {
	margin-top: 40px;
	text-align: center;
}

.thanks-for-joining-card-para-box > .main-para-text {
	color: var(--dark-color) !important;
}

.thanks-for-joining-card-para-box > .main-para-text:not(:last-of-type) {
	margin-bottom: 40px;
}

.thanks-for-joining-card--btn-box {
	margin-top: 50px;
}

.document-container * {
	color: var(--dark-color) !important;
}

.general-link {
	color: var(--primary-color) !important;
	font-weight: 600;
}

.bootstrap-select .dropdown-toggle {
	border: none !important;
	outline: none !important;
	background-color: #fff !important;
	border-radius: 50px !important;
	box-shadow: 0px 5px 10px 0px #00000040;
	height: 30px;
	display: flex;
	align-items: center;
	padding-left: 20px;
	padding-right: 20px;
}

.bootstrap-select .dropdown-toggle .filter-option {
	height: unset !important;
}

.bootstrap-select .dropdown-toggle .filter-option-inner-inner {
	color: var(--dark-color) !important;
}

.bootstrap-select .dropdown-toggle::after {
	color: var(--primary-color) !important;
	border-top: .4em solid;
	border-right: .4em solid transparent;
	border-left: .4em solid transparent;
}

.bootstrap-select.dropup .dropdown-toggle::after {
	border-top: none;
	border-bottom: .4em solid;
	border-right: .4em solid transparent;
	border-left: .4em solid transparent;
}

.bootstrap-select div.dropdown-menu {
	border: none !important;
	border-radius: 10px !important;
	box-shadow: 0px 5px 20px 0px #00000040 !important;
}

.bootstrap-select div.dropdown-menu .dropdown-item {
	padding-left: 20px;
	padding-right: 20px;
	padding-top: 0;
	padding-bottom: 0;
}

.bootstrap-select div.dropdown-menu .dropdown-item.active {
	background-color: var(--primary-color) !important;
}

.bootstrap-select ul.dropdown-menu > li:not(:last-of-type) {
	margin-bottom: 5px;
}

.fw-700 {
	font-weight: 700 !important;
}

#to-top-global {
	background-color: var(--yellow-color);
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	border-radius: 100px;
	position: fixed;
	bottom: 25px;
	right: 25px;
	transition: all .4s;
	z-index: -1;
	opacity: 0;
	pointer-events: none;
}

#to-top-global.active {
	bottom: 25px;
	opacity: 1;
	pointer-events: auto;
	z-index: 5;
}

#to-top-global i {
	color: var(--dark-color);
	font-size: 18px;
}

.with-icon {
	position: relative;
}

.with-icon .form-control {
	padding-right: 45px !important;
}

.input-icon {
	position: absolute;
	right: 15px;
	top: 50%;
	line-height: 0;
	transform: translateY(-50%);
}

.input-icon i {
	font-size: 18px;
	color: var(--dark-color);
}

.input-icon a {
	line-height: 0;
}

.faq-list {
	margin-top: 40px;
}

.alert {
	box-shadow: 0px 5px 20px 0px #00000040;
	border-radius: 10px;
	border: none !important;
	font-weight: 500 !important;
}

.alert.alert-success {
	background-color: var(--green-color) !important;
	color: #fff !important;
}

.alert.alert-danger {
	background-color: var(--red-color) !important;
	color: #fff !important;
}

.action-btn-flex {
	display: flex;
	align-items: center;
	gap: 20px;
	width: max-content;
}

.action-btn-flex a, .action-btn-flex button {
	padding: 0;
}

.action-btn-flex i {
	font-size: 16px !important;
}

/* Avatar upload ============================================================= */
.avatar-upload-cont {
	margin: 20px 0;
}

.avatar-upload-form-cont {
	display: flex;
	align-items: flex-end;
	gap: 15px;
	margin-top: 20px;
}

.avatar-upload-img-cont {
	width: max-content;
	height: max-content;
	position: relative;
}

.avatar-upload-img-cont img {
	width: 100px;
	height: 100px;
	border-radius: 50%;
}

.avatar-delete-file-btn {
	background-color: #D9D9D9;
	width: 28px;
	height: 28px;
	display: flex;
	align-items: center;
	justify-content: center;
	position: absolute;
	top: 0;
	right: 0;
	cursor: pointer;
	border-radius: 50%;
}

.avatar-delete-file-btn i {
	font-size: 16px;
	color: #000;
	pointer-events: none;
}

.avatar-btn-label {
	display: flex;
	align-items: center;
	gap: 5px;
	cursor: pointer;
}

.avatar-btn-label span {
	font-size: 16px;
	font-weight: 300;
	line-height: 24px;
}

.avatar-btn-label i {
	font-size: 20px;
}

/* FilePond ============================================================= */
.filepond--credits {
	display: none !important;
}

.filepond--root,
.filepond--root * {
    font-family: "DM Sans", sans-serif !important;
	font-weight: 500;
}

.filepond--item-panel {
    background-color: var(--dark-color) !important;
}

[data-filepond-item-state='processing-complete'] .filepond--item-panel {
    background-color: var(--green-color) !important;
}

[data-filepond-item-state*='invalid'] .filepond--item-panel,
[data-filepond-item-state*='error'] .filepond--item-panel {
    background-color: var(--red-color) !important;
}

/* Toastify ================== */
.toastify {
	border-radius: 10px;
	box-shadow: none !important;
	font-weight: 500;
}

.toastify .toast-close {
	position: absolute;
	top: 0;
	right: 5px;
	padding: 0;
}

.toastify-success {
	border: none !important;
	background: var(--green-color) !important;
	color: #fff !important;
}

.toastify-success .toast-close {
	color: #fff !important;
}

.toastify-danger {
	border: none !important;
	background: var(--red-color) !important;
	color: #fff !important;
}

.toastify-danger .toast-close {
	color: #fff !important;
}

/* SweetAlert ========================================= */
.swal2-styled.swal2-confirm, .swal2-styled.swal2-cancel {
	font-weight: 500 !important;
	line-height: 20px;
	letter-spacing: 0.07em;
	border-radius: 30px !important;
	box-shadow: none !important;
}

.swal2-styled.swal2-confirm, .swal2-styled.swal2-confirm:active, .swal2-styled.swal2-confirm:focus,
.swal2-styled.swal2-cancel, .swal2-styled.swal2-cancel:active, .swal2-styled.swal2-cancel:focus {
	color: #fff !important;
	background-color: var(--primary-color) !important;
	border-color: var(--primary-color) !important;
}

.swal2-styled.swal2-confirm,
.swal2-styled.swal2-cancel  {
	border: 1px solid var(--primary-color) !important;
} 

.swal2-styled.swal2-cancel {
	background-color: #fff !important;
	color: var(--primary-color) !important;
}

.swal2-icon.swal2-info {
	border-color: var(--primary-color) !important;
	color: var(--primary-color) !important;
}

/* Cropper ============================================ */

.crop-img {
    display: inline;
    width: 100%;
    height: 100%;
}

.crop-img-cont {
    width: 100%;
    max-height: 600px;
}

.crop-preview {
    overflow: hidden;
    width: 200px;
    height: 200px;
    border-radius: 50%;
}

.modal-dialog.big {
	max-width: 1000px !important;
}

#avatarModal .modal-dialog,
#coverModal .modal-dialog {
	max-width: 1000px !important;
	max-height: 600px !important;
} 

.header-avatar {
	border-radius: 50%;
	width: 28px;
	height: 28px !important;
	object-fit: cover;
}

/* Modal =================================================================== */
.modal-content {
	border-radius: 10px;
	border: none !important;
}

.modal-body {
	padding: 30px 25px !important;
}

.modal-header, .modal-footer {
	border: none !important;
	color: var(--dark-color) !important;
	background-color: var(--light-blue-color) !important;
}

.modal-header .btn-close {
	margin-right: 10px !important;
}

/* Accordion ================================================================ */
.accordion.default {
	display: flex;
	flex-direction: column;
	gap: 25px;
}

.accordion.default .accordion-body {
	padding-top: 5px;
}

.accordion.default .main-para-text {
	color: #fff !important;
	font-size: 14px;
	line-height: 17px;
}

.accordion.default .accordion-item {
	border: none !important;
	background-color: var(--primary-color);
	box-shadow: 0px 5px 20px 0px #00000040;
}

.accordion.default .accordion-item,
.accordion.default .accordion-button {
	border-top-left-radius: 10px !important;
	border-top-right-radius: 10px !important;
}

.accordion.default .accordion-button {
	font-size: 18px;
	font-weight: 700;
	line-height: 21px;
	color: #fff !important;
	outline: none !important;
	box-shadow: none !important;
	background-color: var(--primary-color) !important;
	padding-top: 12px;
	padding-bottom: 12px;
}

.accordion.default .accordion-button::after {
	background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='white' stroke='%23212529' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='M2 5L8 11L14 5'/%3e%3c/svg%3e");
}

.accordion.default .accordion-button.collapsed,
.accordion.default .accordion-item {
	border-bottom-left-radius: 10px !important;
	border-bottom-right-radius: 10px !important;
}

.accordion.default .main-para-text {
	text-align: left !important;
}

/* Slider =================================================================== */

.custom-slider-controls {
	display: flex;
	align-items: center;
	gap: 15px;
}

.slider-control-btn {
	border: none;
	outline: none;
	box-shadow: 0px 4px 10px 0px #00000040;
	border-radius: 50%;
	width: 50px;
	height: 50px;
	background-color: var(--primary-color);
	color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
}

.splide__slide[aria-hidden="true"] .teacher-details-card,
.splide__slide[aria-hidden="true"] .popular-teacher-card  {
 	opacity: 0.8;
	box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0);
}

.slider-control-mobile {
	display: none;
}

/* animations =============================================================== */
.left-col,
.right-col {
	opacity: 0;
	filter: blur(5px);
	transform: translateY(40px);
	transition: transform 0.6s ease, opacity 0.6s ease, filter 0.6s ease;      
}

.left-col.visible,
.right-col.visible {
	opacity: 1;
	filter: blur(0);
	transform: translateY(0);
	will-change: transform, opacity, filter;
}

.left-col-direction,
.right-col-direction {
	opacity: 0;
	filter: blur(5px);
	transition: transform 2s ease, opacity 2s ease, filter 2s ease;
}

.left-col-direction {
	transform: translateX(-100%);
}

.right-col-direction {
	transform: translateX(100%);
}

.left-col-direction.visible,
.right-col-direction.visible {
	opacity: 1;
	filter: blur(0);
	transform: translateX(0);
	will-change: transform, opacity, filter;
}

.size-transition-col {
	opacity: 0;
	filter: blur(5px);
	transform: scale(0.5);
	transition: transform 0.6s ease, opacity 0.6s ease, filter 0.6s ease;  
}

.size-transition-col.visible {
	opacity: 1;
	filter: blur(0);
	transform: scale(1);
	will-change: transform, opacity, filter;
}

@keyframes fade-in {
	from { opacity: 0; transform: translateY(20px); }
	to   { opacity: 1; transform: translateY(0); }
}

.animate-fade-in {
	animation: fade-in 0.5s ease-out forwards;
}

/* Header =================================================================== */
header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 1000;
}

main {
	padding-top: var(--padding-top-for-main-container);
	min-height: calc(100vh - 250px);
	display: flex;
	flex-direction: column;
}

.header__auth-btn-container {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 20px;
	padding: 15px 0;
	transition: margin-top 0.3s ease;
}

.sticky-header .header__auth-btn-container {
	margin-top: var(--margin-top-sticky-upper-header);
}

.sticky-header .header__menu {
	margin-top: var(--margin-top-sticky-lower-header);
}

.sticky-header header {
	background-color: var(--body-background-color);
}

.header__auth-btn-container--mobile {
	display: none;
}

.header__menu {
	display: flex;
	align-items: center;
	justify-content: space-between;
	box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2);
	border-radius: 10px;
	height: 60px;
	background-color: var(--light-blue-color);
	padding-top: 0;
	padding-bottom: 0;
	padding-left: 20px;
	padding-right: 15px;
	gap: 10px;
	transition: margin-top 0.3s ease;
}

.header__menu-logo {
	height: 32px;
}

.header__menu-list {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	gap: 20px;
}

.header__menu-item {
	display: flex;
	align-items: center;
	gap: 5px;
	color: var(--dark-color);
	font-weight: 700;
	font-size: 14px;
}

.header__menu-icon-container {
	display: flex;
	align-items: center;
	gap: 8px;
}

.header__menu-icon-container img {
	height: 20px;
}

.general-dropdown-cont .btn {
	background-color: transparent !important;
	color: var(--primary-color) !important;
	border: unset !important;
	padding: 0;
	font-weight: 400;
	font-size: 16px;
}

.general-dropdown-cont .dropdown-menu {
	background-color: #fff !important;
	border-radius: 5px;
	box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.2);
	border: none !important;
	padding-top: 0;
	padding-bottom: 0;
	overflow: hidden;
}

.general-dropdown-cont .dropdown-menu > li:first-of-type .dropdown-item {
	padding-top: 8px;
}

.general-dropdown-cont .dropdown-menu > li:last-of-type .dropdown-item {
	padding-bottom: 8px;
}

.general-dropdown-cont .dropdown-menu .dropdown-item {
	color: var(--dark-color) !important;
}

.general-dropdown-cont .dropdown-menu .dropdown-item svg path {
	fill: var(--dark-color);
}

.general-dropdown-cont .dropdown-menu .dropdown-item svg {
	width: 18px !important;
}

.general-dropdown-cont .dropdown-menu .dropdown-item:hover,
.general-dropdown-cont .dropdown-menu .dropdown-item:focus {
	background-color: #002f77 !important;
	color: var(--yellow-color) !important;
	font-weight: 700;
}

.general-dropdown-cont .dropdown-menu .dropdown-item:hover svg path,
.general-dropdown-cont .dropdown-menu .dropdown-item:focus svg path {
	fill: var(--yellow-color);
}

.general-dropdown-cont .dropdown-menu .dropdown-item.active {
	background-color: var(--primary-color) !important;
	color: var(--yellow-color) !important;
	font-weight: 700;
}

.general-dropdown-cont .dropdown-menu .dropdown-item.active svg path {
	fill: var(--yellow-color);
}

.general-dropdown-cont.auth-dropdown-cont .dropdown-menu .dropdown-item {
	display: flex;
	align-items: center;
	gap: 15px;
	padding-right: 30px;
}

.general-dropdown-cont.auth-dropdown-cont .dropdown-menu .dropdown-item > div:first-of-type {
	flex-basis: 18px;
	max-width: 18px !important;
	width: 100%;
}

.general-dropdown-cont.auth-dropdown-cont .dropdown-menu {
	min-width: 225px;
}

.header__menu-style-switcher-container {
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.switcher-cont {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 60px;
	height: 30px;
	background-color: #fff;
	box-shadow: 0px 5px 10px 0px #00000026;
	border-radius: 15px;
	padding: 0 5px;
	position: relative;
}

.switcher-cont .icon-sun {
	height: 22px;
}

.switcher-cont .icon-moon {
	height: 18px;
}

.active-dot {
	position: absolute;
	background-color: var(--primary-color);
	display: block;
	width: 21px;
	height: 21px;
	border-radius: 50%;
	top: 50%;
	transform: translateY(-50%);
	left: 6px;
	transition: left 0.3s ease;
}

.toogle-light {
	pointer-events: none;
}

.hamburger-cont  {
	display: none;
}

.hamburger-cont .hamburger-icon {
	height: 20px;
}

/* Mobile menu ==================================== */

#mobileMenu {
	background-color: var(--mobile-menu-background-color);
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
}

#mobileMenu .offcanvas-header {
	padding: 20px;
	justify-content: space-between;
}

#mobileMenu .offcanvas-body {
	padding-top: 0;
	padding-left: 20px;
	padding-right: 20px;
}

#mobileMenuCloseBtn i {
	font-size: 25px;
	color: var(--mobile-menu-icon-color);
}

.mobile-menu-list {
	list-style: none;
	padding-left: 0;
	padding-right: 0;
}

.mobile-menu-list > li {
	padding: 10px 0;
}

.mobile-menu-list > li:not(:last-of-type) {
	border-bottom: 1px solid #fff;
}

#mobileMenu .header__menu-item {
	color: var(--header-menu-item-color);
	gap: 10px;
}

#mobileMenu .header__menu-item span {
	font-size: 16px;
}

#mobileMenu .header__menu-item svg {
	height: 25px;
	width: 25px;
}

#mobileMenu .header__menu-item svg path {
	height: 20px;
	fill: var(--header-menu-item-color);
}

.mobile-menu--additional-menu-box {
	display: flex;
	align-items: center;
	gap: 20px;
	margin-top: 20px;
}

.mobile-menu--additional-menu-box .header__menu-language-switcher {
	display: none;
}

.mobile-menu--additional-menu-box .header__menu-language-switcher .btn {
	color: var(--mobile-lang-switcher-text-color) !important;
}

/* Footer ========================================== */

footer {
	background: var(--dark-blue-color);
	padding: 40px 0;
}

.footer__logo {
	height: 34px;
	margin-bottom: 25px;
}

.footer__para-text {
	color: #fff;
	font-size: 14px;
	line-height: 100%;
}

.footer__social-link-container {
	display: flex;
	align-items: center;
	gap: 25px;
	margin-top: 30px;
}

.footer__social-link-container img {
	height: 24px;
}

.footer__nav-list {
	list-style: none;
	padding-left: 0;
}

.footer__nav-list > li:first-of-type > a {
	font-weight: 700;
}

.footer__nav-list > li:not(:last-of-type) {
	margin-bottom: 10px;
}

.footer__nav-link {
	color: #fff;
	font-size: 14px;
	font-weight: 500;
}

.footer__mobile-app-text {
	color: #fff;
	font-size: 18px;
	text-align: center;
}

.footer__mobile-app-container {
	margin-top: 35px;
}

.footer__mobile-app-store-logo-container {
	display: flex;
	justify-content: center;
	gap: 15px;
	margin-top: 30px;
}

.footer__mobile-app-store-logo {
	height: 59px;
}

.footer__copyright-container {
	margin-top: 50px;
}

.footer__copyright-link {
	color: var(--yellow-color);
	font-weight: 600;
	font-size: 12px;
}

.footer__copyright-text {
	color: #fff;
	font-weight: 300;
	font-size: 14px;
	line-height: 25px;
	text-align: center;
}

.footer__copyright-line { 
	margin-top: 12px;
}

.footer__copyright-upper-line {
	display: flex;
	justify-content: center;
}

.row-footer {
	row-gap: 25px;
}

/* Auth ===================================================================== */
.row-register,
.row-profile-setup,
.row-login {
	align-items: center;
}

.section-auth img {
	width: 100%;
	height: auto;
}

.section__register-main,
.section__general {
	padding: var(--default-section-padding);
}

.auth-box {
	border-radius: 10px;
	box-shadow: 0px 5px 20px 0px #00000040;
	padding: 40px 20px;
}

.auth-box.smaller-pd {
	padding: 20px !important;
}

.auth-box.light {
	background-color: var(--light-blue-color);
}

.auth-box.white {
	background-color: #fff;
}

.auth-box .homepage--from-beginner-to-pro-alert-text {
	margin: 0 !important;
}

.auth-box .main-subheader-text {
	color: var(--primary-color) !important;
	margin: 0 !important;
	text-align: center;
}

.auth-box .main-para-text {
	color: var(--dark-color) !important;
}

.auth-box.profile-setup .homepage--from-beginner-to-pro-alert-text {
	text-align: left;
}

.auth-form-container {
	margin-top: 40px;
}

.auth-form-element {
	margin-bottom: 20px;
}

.auth-form {
	margin-top: 20px;
}

.reg-btn-container {
	margin-top: 40px;
	text-align: center;
}

.profile-setup-para-box {
	margin-top: 40px;
}

.profile-setup-para-box > .main-para-text:not(:last-of-type) {
	margin-bottom: 20px;
}

.profile-setup-para-box.student .main-para-text {
	text-align: center !important;
	margin-bottom: 0 !important;
}

.profile-setup-para-box.student > .main-para-text:last-of-type {
	margin-top: 30px;
}

.profile-setup-form-box {
	margin-top: 40px;
}

.profile-setup-form-box .auth-form-element {
	border-radius: 10px;
	box-shadow: 0px 5px 20px 0px #00000040;
	background-color: var(--light-blue-color);
	padding: 8px 10px;
}

.profile-setup-form-box .auth-form-element .form-check {
	display: flex;
	gap: 15px;
	margin-top: 0;
	margin-bottom: 0;
	padding-top: 0;
	padding-bottom: 0;
}

.profile-setup-form-box .auth-form-element .form-check input[type="radio"] {
	width: 18px;
	height: 18px;
	box-shadow: none !important;
	border: 3px solid var(--dark-color) !important;
}

.profile-setup-form-box .auth-form-element .form-check input[type="radio"]:checked {
	background-color: #fff !important;
	background-image: url('../images/icons/icon-dot.svg') !important;
	background-size: 8px 8px !important;
}

.profile-setup-form-box.student .auth-form-element {
	margin-bottom: 10px;
}

.profile-setup-form-box .auth-form-element .form-check input[type="checkbox"] {
	width: 20px;
	height: 20px;
	box-shadow: none !important;
	border: 3px solid var(--dark-color) !important;
	margin-left: 0;
	margin-top: 0;
}

.profile-setup-form-box.student .auth-form-element .form-check {
	padding-left: 0;
	align-items: center;
}

.profile-setup-form-box.student .auth-form-element .form-check .form-check-label {
	width: 100%;
	text-align: center;
}

.profile-setup-btn-box {
	margin-top: 40px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.profile-setup-form-box .text-danger {
	color: var(--red-color) !important;
	font-weight: 600 !important;
	display: inline-flex;
	margin-bottom: 10px;
}

.auth-form-element .text-danger,
.possible-danger .text-danger {
	color: var(--red-color) !important;
	font-weight: 600 !important;
	display: inline-flex;
	margin-left: 5px;
	margin-top: 5px;
}

.profile-setup-form-box.student,
.profile-setup-btn-box.student {
	padding-left: 50px;
	padding-right: 50px;
	margin-left: auto;
	margin-right: auto;
}

.profile-setup-btn-box.student {
	justify-content: flex-end;
}

.profile-setup-form-box.student .auth-form-element .form-check input[type="checkbox"]:checked {
	background-color: white;
	background-image: url("../images/icons/icon-checkbox-check.svg") !important;
	background-size: 12px auto !important;
	background-position: center;
	background-repeat: no-repeat;
}

.row-login .reg-btn-container {
	margin-top: 10px;
}

.forgot-password-cont {
	margin-top: 10px;
	text-align: center;
}

.forgot-password-cont .main-para-text {
	color: var(--dark-color) !important;
	display: inline;
}

.no-acc-cont {
	margin-top: 40px;
	text-align: center;
}

.no-acc-cont .btn {
	margin-top: 10px;
}

.no-acc-text {
	text-align: center;
	font-weight: 700;
	font-size: 20px;
	line-height: 24px;
	color: var(--primary-color);
}

.row-student-profile-categories {
	justify-content: center;
}

.row-student-profile-categories label {
	word-break: break-all;
}

.row-student-profile-categories .auth-form-element {
	height: 100%;
	display: flex;
	align-items: center;
	padding: 2px 10px !important;
}

.row-student-profile-categories .auth-form-element .form-check {
	width: 100%;
}

.row-register-main {
	margin-left: 0;
	margin-right: 0;
}

.row-register-main .main-subheader-text {
	color: var(--register-main-subheader-text-color) !important;
	text-align: center;
}

.row-register-main .main-para-text {
	color: var(--dark-color) !important;
	text-align: center;
	margin: 40px 0;
}

.register-main-img-cont img {
	border-radius: 10px;
	box-shadow: 0px 5px 20px 0px #00000040;
	width: 100%;
	height: auto;
	object-fit: cover;
	display: block;
	margin-bottom: 20px;
}

.row-register-main--types {
	padding-left: 150px;
	padding-right: 150px;
	row-gap: 40px;
}

.verify-email-col .auth-box {
	padding-left: 120px;
	padding-right: 120px;
}

/* Homepage ================================================================ */
/* ============= SECTION: homepage--slide-1 */

.section__homepage--slide-1 {
	padding-top: var(--minimized-section-padding-top);
	padding-bottom: var(--default-section-padding-bottom);
}

#carouselHome1 {
	box-shadow: 0px 5px 20px 0px #00000040;
}

#carouselHome1,
#carouselHome1 .carousel-item {
	border-radius: 10px;
	overflow: hidden;
}

#carouselHome1 .custom-slider-controls {
	position: absolute;
	bottom: 30px;
	right: 50px;
}

#carouselHome1 .carousel-item img {
	width: 100%;
	max-height: 500px;
	object-fit: cover;
	object-position: center;
	display: block;
}

#carouselHome1 .gradient-border {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 20px;
	width: 100%;
	max-width: calc(50% - 20px);
}

.slider-text-box {
	border-radius: 20px;
	background-color: #f4f8ff;
	padding: 25px 30px;
	max-width: 720px;
	width: 100%;
}

.slider-text-box-title {
	font-size: 40px;
	font-weight: 700;
	line-height: 52px;
	color: var(--primary-color);
	margin-bottom: 25px;
}

.slider-text-box-description {
	font-size: 24px;
	font-weight: 700;
	line-height: 30px;
	color: var(--dark-color);
	margin-bottom: 25px;
}

.carouselHome1__text-box--mobile {
	display: none;
}

/* ============= SECTION: homepage--from-beginner-to-pro */

.section__homepage--from-beginner-to-pro {
	padding: var(--default-section-padding);
}

.homepage--from-beginner-to-pro-list-box {
	margin-top: 40px;
}

.homepage--from-beginner-to-pro-list-box > .homepage--from-beginner-to-pro-list-item:not(:last-of-type) {
	margin-bottom: 20px;
} 

.homepage--from-beginner-to-pro-list-item {
	display: flex;
	align-items: flex-start;
	gap: 30px;
}

.homepage--from-beginner-to-pro-list-item .icon-box {
	width: 45px;
	height: 45px;
	min-width: 45px;
}

.icon-box {
	width: 50px;
	height: 50px;
	min-width: 50px;
	border-radius: 5px;
	background-color: var(--primary-color);
	display: flex;
	align-items: center;
	justify-content: center;
	box-shadow: 0px 5px 20px 0px #00000040;
}

.icon-box img {
	width: 24px;
}

.homepage--from-beginner-to-pro-list-labeltext {
	font-weight: 700;
	font-size: 20px;
	line-height: 28px;
	color: var(--homepage--from-beginner-to-pro-list-labeltext-color);
	margin-bottom: 10px;
}

.homepage--from-beginner-to-pro-img {
	width: 100%;
	height: auto;
}

.homepage--from-beginner-to-pro-alert-box {
	background-color: var(--light-blue-color);
	box-shadow: 0px 5px 20px 0px #00000040;
	border-radius: 10px;
	width: 100%;
	max-width: 980px;
	padding: 20px;
	margin: 0 auto;
	margin-top: 80px;
}

.homepage--from-beginner-to-pro-alert-box .icon-box {
	margin-bottom: 20px;
	margin-left: auto;
	margin-right: auto;
}

.homepage--from-beginner-to-pro-alert-box img {
	width: 38px;
}

.homepage--from-beginner-to-pro-alert-text {
	font-weight: 700;
	font-size: 24px;
	line-height: 34px;
	color: var(--primary-color);
	text-align: center;
	display: block;
}

/* ============= SECTION: homepage--categories */

.section__homepage-categories {
	padding: var(--default-section-padding);
	background-color: var(--primary-color);
	margin-top: var(--default-section-padding-top);
	margin-bottom: var(--default-section-padding-bottom);
}

.section__homepage-categories .splide .splide__track {
	height: max-content !important;
}

.homepage-categories-text {
	font-weight: 700;
	display: block;
}

.homepage-categories-text.big {
	font-size: 70px;
	line-height: 80px;
	color: rgba(255, 255, 255, 0.3) !important;
}

.homepage-categories-text.medium {
	font-size: 56px;
	line-height: 64px;
	color: rgba(255, 255, 255, 0.5) !important;
}

.homepage-categories-text.small {
	font-size: 35px;
	line-height: 40px;
	color: rgba(255, 255, 255, 0.7) !important;
}

.splide-categories-2 {
	margin-top: 20px;
	margin-bottom: 25px;
}

/* ============= SECTION: homepage--change-career */

.section__homepage--change-career {
	padding-top: var(--default-section-padding-top);
	padding-bottom: 0;
}

.accent-word {
	display: inline-flex;
	position: relative;
	color: var(--accent-word-color);
}

.accent-word span {
	position: relative;
	z-index: 1;
}

.accent-word-img {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: calc(100% + 15px);
	height: auto;
	display: block;
	max-width: unset !important;
	z-index: 0;
}

.homepage--change-career-header-box {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 20px;
}

.homepage--change-career-header-box .main-subheader-text {
	margin-bottom: 0;
}

.teacher-details-card {
	background-color: var(--light-blue-color);
	box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	padding: 20px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 20px;
	transition: box-shadow 0.3s ease, opacity 0.3s ease;
	height: 100%;
}

.teacher-details-card--img-box {
	border-radius: 5px;
	overflow: hidden;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 260px;
	width: 100%;
}

.teacher-details-card--label-box {
	display: flex;
	justify-content: flex-end;
	gap: 10px;
	padding: 10px;
}

.teacher-details-card--label-box.with-price {
	justify-content: space-between;
}

.teacher-details-card--label-box.both {
	flex-direction: column;
	justify-content: space-between;
	height: 100%;
}

.teacher-details-card--label-box.both > div {
	display: flex;
	gap: 10px;
	width: 100%;
}

.teacher-details-card--label {
	font-weight: 400;
	font-size: 16px;
	line-height: 24px;
	border-radius: 5px;
	box-shadow: 0px 5px 20px 0px #00000040;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 3px 20px;
}

.teacher-details-card--label.type {
	background-color: var(--primary-color);
	color: #fff;
}

.teacher-details-card--label.price {
	background-color: var(--yellow-color);
	color: var(--dark-color);
}

.teacher-details-card--label.ends  {
	background-color: var(--red-color);
	color: #fff;
}

.teacher-details-card--rating-box {
	display: flex;
	align-items: baseline;
	justify-content: center;
	margin-top: 30px;
	margin-bottom: 20px;
	gap: 1px;
}

.teacher-details-card--rating-box i.active {
	color: var(--yellow-color);
}

.teacher-details-card--rating-box span {
	font-weight: 500;
	font-size: 14px;
	color: var(--dark-color);
}

.teacher-details-card--course-text {
	font-weight: 600;
	font-size: 22px;
	line-height: 30px;
	text-align: center;
	color: var(--dark-color);
}

.teacher-details-card--course-details-box {
	display: flex;
	align-items: center;
	justify-content: space-between;
	background-color: var(--primary-color);
	box-shadow: 0px 5px 10px 0px #00000040;
	max-width: 270px;
	width: 100%;
	padding: 10px 30px;
	border-radius: 5px;
	margin: 0 auto;
}

.teacher-details-card--course-detail-item {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

.teacher-details-card--course-detail-item img {
	height: 18px;
	margin: 0 auto;
	display: block;
}

.teacher-details-card--course-detail-item span {
	font-weight: 400;
	font-size: 12px;
	line-height: 12px;
	color: #fff;
	display: block;
	text-align: center;
}

.teacher-details-card--course-teacher-name-box {
	display: flex;
	align-items: center;
	gap: 10px;
	justify-content: center;
	margin-top: 20px;
}

.teacher-details-card--course-teacher-name-box img {
	width: 30px;
	height: 30px;
	min-width: 30px;
	border-radius: 50%;
	object-fit: cover;
}

.teacher-details-card--course-price-box {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: var(--yellow-color);
	box-shadow: 0px 5px 20px 0px #00000040;
	border-radius: 10px;
	padding: 5px 20px;
	text-align: center;
	margin-left: auto;
	margin-right: auto;
	width: fit-content;
	margin-top: 20px;
	margin-bottom: 10px;
}

.teacher-details-card--course-price-box span {
	font-weight: 700;
	font-size: 20px;
	line-height: 28px;
	color: var(--dark-color);
}

.teacher-details-card--course-teacher-name-box span,
.popular-teacher-card__bottom-text {
	display: block;
	font-weight: 400;
	font-size: 14px;
	line-height: 20px;
	color: var(--dark-color);
}

.row-homepage-change-career__carousel-box .splide .splide__track {
	padding-top: 60px;
	padding-bottom: var(--default-section-padding-bottom);
	padding-left: 20px !important;
	padding-right: 20px !important;
	margin-left: -20px !important;
	margin-right: -20px !important;
}

.row-homepage-change-career__carousel-box .teacher-details-card {
	max-width: 404px;
	width: 100%;
}

.row-homepage-change-career__mobile-controls .slider-control-mobile {
	justify-content: center;
}

.course-progress-container {
	box-shadow: 0px 5px 20px 0px #00000040;
	background-color: var(--primary-color);
	padding: 20px;
	border-radius: 5px;
	margin-top: 20px;
}

.course-progress-container .main-para-text {
	font-weight: 400 !important;
	color: #fff !important;
}

.course-progress--bar {
	border-radius: 50px;
	height: 16px;
	width: 100%;
	padding: 1px;
	overflow: hidden;
	background-color: #fff;
	margin-bottom: 15px;
}

.course-progress--bar-inner {
	border-radius: 50px;
	height: 100%;	
	display: flex;
	justify-content: flex-end;
	align-items: center;
	padding: 1px;
}

.course-progress--bar-inner .dot {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: linear-gradient(0deg, rgba(0, 0, 0, 0.2), rgba(0, 0, 0, 0.2)), #003B95;
}

/* ============= SECTION: homepage--develop */

.section__homepage--develop {
	padding: var(--default-section-padding);
}

.section__homepage--develop .main-subheader-text {
	text-align: center;
	margin-bottom: 55px;
}

.homepage--develop-logo-box {
	background-color: var(--light-blue-color);
	box-shadow: 0px 5px 20px 0px #00000040;
	border-radius: 10px;
	padding: 40px;
}

.homepage--develop-logo-box img {
	max-height: 48px;
}

.section__homepage--develop .homepage--from-beginner-to-pro-alert-box {
	margin-top: 40px;
}

.row-homepage-develop-logo-box {
	row-gap: 20px;
}

.row-homepage-develop-logo-box > div:nth-of-type(2),
.row-homepage-develop-logo-box > div:nth-of-type(3),
.row-homepage-develop-logo-box > div:nth-of-type(4) {
	display: flex;
	align-items: center;
}

.row-homepage-develop-logo-box > div:nth-of-type(2),
.row-homepage-develop-logo-box > div:nth-of-type(3) {
	justify-content: center;
}

.row-homepage-develop-logo-box > div:nth-of-type(4) {
	justify-content: flex-end;
}

/* ============= SECTION: homepage-popular-teachers */

.section__homepage--popular-teachers {
	padding-top: var(--default-section-padding-top);
	padding-bottom: 0;
}

.row-homepage-popular-teachers-carousel {
	position: relative;
}

.splide-popular-teachers .gradient-border {
	border-radius: 5px;
}

.popular-teacher-card {
	border-radius: 5px;
	box-shadow: 0px 5px 20px 0px rgba(0, 0, 0, 0.25);
	overflow: hidden;
	display: flex;
	flex-direction: column;
	height: 100%;
	justify-content: space-between;
	gap: 20px;
	position: relative;
	background-color: var(--light-blue-color);
	transition: box-shadow 0.4s ease, opacity 0.4s ease;
}

.popular-teacher-card .overlay {
	position: absolute;
	inset: -1px;
	background-color: rgba(0, 108, 228, 0.3);
	border-radius: 5px;
	transition: opacity 125ms ease;
}

.popular-teacher-card__img {
	object-fit: cover;
	object-position: center;
	width: 100%;
	height: 295px;
}

.popular-teacher-card__name {
	font-weight: 700;
	font-size: 21px;
	line-height: 23px;
	text-align: center;
	color: var(--dark-color);
	margin-top: 30px;
	margin-bottom: 10px;
}

.popular-teacher-card__role {
	font-weight: 400;
	font-size: 17px;
	line-height: 20px;
	text-align: center;
	color: var(--dark-color);
}

.popular-teacher-card__bottom .teacher-details-card--rating-box {
	margin-top: 0;
	margin-bottom: 5px;
}

.popular-teacher-card__bottom-text {
	text-align: center;
	font-weight: 500;
}

.popular-teacher-card__bottom {
	margin-bottom: 20px;
}

#spliderPopularTeachersPrev, 
#spliderPopularTeachersNext {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 1;
}

#spliderPopularTeachersPrev {
	left: -10px;
}

#spliderPopularTeachersNext {
	right: -10px;
}

.splide-popular-teachers .splide__slide.is-active .gradient-border {
	transition: transform 125ms ease;
	transform: scale(1.05) translateX(5px);
}

.splide__slide.is-active .popular-teacher-card .overlay {
	opacity: 0;
}

.row-homepage-popular-teachers-carousel .splide .splide__track {
	padding-top: 40px;
	padding-bottom: calc(var(--default-section-padding-bottom) + 10px);
	padding-left: 20px !important;
	padding-right: 20px !important;
	margin-left: -20px !important;
	margin-right: -20px !important;
}

/* ============= SECTION: homepage-start-teaching */

.section__homepage-start-teaching {
	padding-top: var(--default-section-padding-top);
	padding-bottom: 0;
}

.homepage-start-teaching-para-box-container {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 20px;
}

.homepage-start-teaching-para-box {
	max-width: 880px;
}

.row-homepage-start-teaching-card-box .splide .splide__track {
	padding-top: 40px;
	padding-bottom: var(--default-section-padding-bottom);
	padding-left: 20px !important;
	padding-right: 20px !important;
	margin-left: -20px !important;
	margin-right: -20px !important;
}

.row-homepage-start-teaching-card-box .teacher-details-card {
	max-width: 404px;
	width: 100%;
}

.row-homepage-start-teaching__mobile-controls .slider-control-mobile {
	justify-content: center;
}

/* ============= SECTION: homepage-yoomten-community */

.section__homepage-yoomten-community {
	padding: var(--default-section-padding);
}

.section__homepage-yoomten-community .main-subheader-text {
	text-align: center;
	margin-bottom: 40px;
}

.row-homepage-yoomten-community__opinion-box {
	margin-bottom: 40px;
	row-gap: 25px;
	justify-content: center;
}

.opinion-card {
	background: url('../images/homepage/opinion-card-bg.webp'), var(--light-blue-color);
	background-blend-mode: color-burn;
	background-size: cover;
	background-position: center;
	background-repeat: no-repeat;
	border-radius: 10px;
	box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.25);
	padding: 40px;
	display: flex;
	flex-direction: column;
	gap: 20px;
	justify-content: space-between;
	height: 100%;
}

.opinion-card__text-box img {
	height: 60px;
	margin: 0 auto;
	display: block;
}

.opinion-card__text-box .main-para-text {
	text-align: center;
	margin-top: 15px;
	color: var(--dark-color);
}

.opinion-card__user-box {
	display: flex;
	justify-content: center;
	gap: 25px;
}

.opinion-card__user-box img {
	width: 50px;
	height: 50px;
	min-width: 50px;
	border-radius: 50%;
	object-fit: cover;
} 

.opinion-card__user-box-text {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 5px;
}

.opinion-card__user-box-text p {
	text-align: center;
}

.opinion-card__user-box-name {
	font-family: "Epilogue", sans-serif;
	font-weight: 700;
	font-size: 17px;
	line-height: 19px;
	color: var(--dark-blue-color);
}

.opinion-card__user-box-role {
	font-family: "Sora", sans-serif;
	font-weight: 400;
	font-size: 13px;
	line-height: 16px;
}

.homepage-yoomten-community__join-box {
	background-color: var(--light-blue-color);
	padding: 20px 60px;
	border-radius: 10px;
	max-width: 620px;
	width: 100%;
	margin: 0 auto;
	box-shadow: 0px 5px 20px 0px #00000040;
}

.join-box-header-text {
	color: var(--dark-color);
	font-weight: 700;
	font-size: 24px;
	line-height: 40px;
}

.join-box--icon-container {
	display: flex;
	justify-content: center;
	align-items: center;
	column-gap: 40px;
	row-gap: 20px;
	margin-top: 40px;
	flex-wrap: wrap;
}

.join-box--icon-container img {
	width: 50px;
	min-width: 50px;
}

/* ============= SECTION: homepage-join-us-as-teacher */

.section__homepage-join-us-as-teacher {
	padding: var(--default-section-padding);
}

.homepage-join-us-as-teacher-para-box {
	display: flex;
	align-items: center;
	gap: 20px;
	justify-content: space-between;
}

.homepage-join-us-as-teacher-para-text {
	max-width: 850px;
}

.row-homepage-join-us-as-teacher__desc-box {
	margin-top: 40px;
}

.homepage-join-us-as-teacher-desc-box-item {
	display: flex;
	align-items: flex-start;
	gap: 18px;
}

.homepage-join-us-as-teacher-desc-box-item .icon-box {
	width: 45px;
	height: 45px;
	min-width: 45px;
}

.homepage-join-us-as-teacher-desc-box-item .icon-box img {
	width: 25px;
	height: auto;
}

.homepage-join-us-as-teacher-desc-box-item .homepage--from-beginner-to-pro-list-labeltext {
	margin-bottom: 10px;
	color: var(--homepage--from-beginner-to-pro-list-labeltext-bottom-color);
}

.row-homepage-join-us-as-teacher-desc-box {
	row-gap: 30px;
}

.join-is-as-teacher__img {
	width: 100%;
	height: auto;
}

/* ============= SECTION: homepage--why-students-likes-us */

.section__homepage--why-students-likes-us {
	padding: var(--default-section-padding);
}

.section__homepage--why-students-likes-us .main-subheader-text {
	text-align: center;
	margin-bottom: 100px;
}

.like-box {
	position: relative;
	background-color: var(--primary-color);
	box-shadow: 0px 5px 20px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	padding: 40px 30px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	gap: 20px;
	height: 100%;
}

.like-box .main-para-text {
	text-align: center;
	color: #fff;
}

.like-box > .main-para-text:nth-of-type(2) {
	font-size: 20px;
	font-weight: 700;
}

.like-box--icon-box {
	background-color: #fff;
	position: absolute;
	width: 80px;
	height: 80px;
	min-width: 80px;
	box-shadow: 0px 5px 20px 0px #00000040;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 10px;
	left: 0;
	right: 0;
	top: -55px;
	margin: 0 auto;
}

.like-box--icon-box img {
	width: 50px;
}

.row-homepage-why-students-likes-us {
	row-gap: 100px;
}

/* ============= SECTION: homepage-plans */

.section__homepage-plans {
	padding: var(--default-section-padding);
}

.row-homepage-plans-list {
	margin-top: 35px;
	row-gap: 40px;
}

.plan-card {
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0px 5px 20px 0px #00000040;
	display: flex;
	flex-direction: column;
	height: 100%;
}

.plan-card__header {
	background-color: #F5F5F5;
	padding: 20px;
	min-height: 90px;
	display: flex;
	align-items: center;
	gap: 20px;
}

.plan-card__header img {
	height: 50px;
}

.plan-card__title {
	color: var(--dark-color);
	font-weight: 700;
	font-size: 24px;
	line-height: 32px;
}

.plan-card__body {
	padding-bottom: 40px;
	display: flex;
	flex-direction: column;
	gap: 45px;
	justify-content: space-between;
	height: 100%;
}

.plan-card__features {
	list-style: none;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-top: 15px;
}

.plan-card__features > li {
	display: flex;
	align-items: center;
	gap: 15px;
	padding: 10px 30px;
}

.plan-card__features > li img {
	width: 30px;
	min-width: 30px;
}

.plan-card__features > li:not(:last-of-type) {
	border-bottom: 1px solid #D9D9D9;
}

.plan-card__features .main-para-text {
	line-height: 20px;
}

.plan-card__btn-box {
	padding: 0 20px;
}

#plan-card-1 {
	background-color: #fff;
}

#plan-card-1 .btn {
	background-color: #002f77 !important;
}

#plan-card-2 {
	background-color: var(--light-blue-color);
}

#plan-card-3 {
	background-color: var(--primary-color);
}

#plan-card-3 .main-para-text {
	color: #fff;
}

#plan-card-3 .btn {
	background-color: #fff !important;
	color: var(--dark-color) !important;
}

#plan-card-3 .btn i {
	color: var(--primary-color) !important;
}

#plan-card-1 .main-para-text,
#plan-card-2 .main-para-text {
	color: var(--dark-color);
}


/* SECTION: homepage-start-progression ================================= */
.section__homepage--start-progression {
	padding: var(--default-section-padding);
}

.section__homepage--start-progression .main-subheader-text {
	text-align: center;
	margin-bottom: 35px;
}

.row-category-box {
	row-gap: 20px;
	justify-content: center;
	margin-bottom: 40px;
}

.row-show-allcourses {
	margin-top: 40px;
}

/* SECTION: homepage-could-be-interesting ============================== */
.section__homepage--could-be-interesting,
.section__homepage--new-to-learn {
	padding-top: var(--default-section-padding-top);
}

.col-could-be-interesting .splide .splide__track,
.col-new-to-learn .splide .splide__track {
	padding-top: 30px;
	padding-bottom: 40px;
	padding-left: 20px !important;
	padding-right: 20px !important;
	margin-left: -20px !important;
	margin-right: -20px !important;
}

/* MY COURSES ============================================================================= */
.profile-init-badge {
	display: flex;
	align-items: center;
	justify-content: center;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	overflow: hidden;
	border-radius: 10px;
	box-shadow: 0px 5px 20px 0px #00000040;
	padding: 40px;
	background-color: #fff;
}

.profile-init-badge#my-courses {
	background-image: url('../images/profile/my-courses-init.webp');
}

.profile-init-badge#wishlist {
	background-image: url('../images/profile/wishlist-init.webp');
}

.profile-init-badge-text-box {
	border-radius: 20px;
	background-color: rgb(244, 248, 255, 0.6);
	backdrop-filter: blur(20px);
	-webkit-backdrop-filter: blur(20px);
	padding: 25px 30px;
	max-width: 720px;
	width: 100%;
}

.wishlist-btn-box {
	margin-top: 40px;
	text-align: center;
}

.course-extended-details-card {
	display: flex;
	flex-direction: column;
}


/* TEACHER PROFILE ======================================================================= */
.section__teacher-profile-summary-box,
.section__course-details-summary-box {
	padding-top: var(--minimized-section-padding-top);
	padding-bottom: var(--minimal-section-padding-bottom);
}

.section-profile-general {
	padding: var(--minimal-section-padding-top) 0;
}

.section-profile-init {
	padding-top: var(--minimal-section-padding-top);
	padding-bottom: var(--default-section-padding-bottom);
}

.section-profile {
	padding: var(--default-section-padding);
}

.section__teacher-profile--courses {
	padding-bottom: var(--default-section-padding-bottom);
}

.teacher-profile__summary-box {
	border-radius: 10px;
	box-shadow: 0px 5px 20px 0px #00000040;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding: 20px 8px;
	align-items: flex-end;
	margin-left: 0;
	margin-right: 0;
	row-gap: 20px;
	background-blend-mode: overlay;
	background-color: var(--light-blue-color);
}

.teacher-profile__summary-box#angela {
	background-image: url('../images/teacher-profile/angela-summary.png');
}

.teacher-profile__summary-box#abel {
	background-image: url('../images/teacher-profile/abel-summary.jpg');
}

.teacher-profile__summary-box#eszter {
	background-image: url('../images/teacher-profile/eszter-summary.jpg');
}

.teacher-profile__nav-box {
	border-radius: 10px;
	background-color: #fff;
	box-shadow: 0px 5px 20px 0px #00000040;
	padding: 20px 10px;
	display: flex;
	flex-direction: column;
	gap: 20px;
	max-width: 160px;
	width: 100%;
}

.teacher-profile__nav-link {
	display: inline-flex;
	width: fit-content;
	align-items: center;
	gap: 10px;
}

.teacher-profile__nav-link .bulletpoint {
	background-color: var(--primary-color);
	width: 10px;
	height: 10px;
	min-width: 10px;
	border-radius: 50%;
}

.teacher-profile__nav-link-text {
	font-weight: 700;
	font-size: 14px;
	line-height: 20px;
	color: var(--dark-color);
}

.teacher-profile__info-box {
	display: flex;
	flex-direction: column;
	gap: 10px;
	width: 100%;
	justify-content: center;
	align-items: center;
}

.teacher-profile__avatar {
	width: 150px;
	height: 150px;
	min-width: 150px;
	border-radius: 50%;
	object-fit: cover;
	box-shadow: 0px 5px 20px 0px #00000040;
}

.teacher-profile__info-title {
	font-weight: 700;
	font-size: 24px;
	line-height: 32px;
	color: var(--primary-color);
	text-align: center;
}

.teacher-profile__subinfo-box {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 20px;
	margin: 0 auto;
	justify-content: center;
	row-gap: 10px;
}

.teacher-profile__subinfo-text {
	font-weight: 700;
	font-size: 14px;
	line-height: 20px;
}

.teacher-profile__subinfo-box .teacher-profile__subinfo-text {
	color: var(--dark-color);
}

.teacher-profile__summary-label {
	border-radius: 5px;
	background-color: #fff;
	box-shadow: 0px 5px 10px 0px #00000040;
	padding: 5px;
	text-align: center;
	display: flex;
	align-items: center;
	justify-content: center;
}

.teacher-profile__summary-label .teacher-profile__subinfo-text {
	color: var(--primary-color);
}

.teacher-profile__summary-label-cont {
	display: flex;
	gap: 10px;
	align-items: center;
	margin: 0 auto;
	flex-wrap: wrap;
	justify-content: center;
}

.teacher-profile__introduction-box {
	background-color: #fff;
	box-shadow: 0px 5px 20px 0px #00000040;
	border-radius: 10px;
	padding: 20px;
}

.teacher-profile__introduction-box .main-para-text {
	color: var(--dark-color);
}

.teacher-profile__introduction-box > .main-para-text:not(:last-of-type) {
	margin-bottom: 30px;
}

.teacher-profile__degrees-table {
	table-layout: fixed;
	width: 100%;
	border-radius: 10px;
	overflow: hidden;
	box-shadow: 0px 5px 20px 0px #00000040;
	background-color: #fff;
}

.teacher-profile__degrees-table thead tr th {
	background-color: var(--light-blue-color);
	font-size: 18px;
	font-weight: 700;
	line-height: 24px;
	color: var(--primary-color);
	padding: 10px 25px;
	border-bottom-width: 0;
}

.teacher-profile__degrees-table tbody tr td {
	padding: 15px 25px;
}

.teacher-profile__degrees-table tbody tr td .main-para-text {
	color: var(--dark-color);
}

.teacher-profile__degrees-table tbody tr td {
	border-color: #f5f5f5 !important;
}

.teacher-profile__degrees-table tbody > tr:last-of-type td {
	border-bottom: none !important;
}

.row-teacher-details-courses {
	row-gap: 25px;
}

.row-update-register-data .main-para-text {
	margin-bottom: 10px !important;
}

/* COURSE DETAILS ======================================================================= */
.course-details__summary-box {
	background-color: var(--light-blue-color);
	box-shadow: 0px 5px 20px 0px #00000040;
	border-radius: 10px;
	margin-left: 0;
	margin-right: 0;
	padding-top: 20px;
	padding-bottom: 20px;
}

.course-details__summary-box .teacher-details-card {
	box-shadow: none;
	padding-left: 20px;
	padding-right: 30px;
	padding-top: 0;
	padding-bottom: 0;
	border-radius: 0;
	height: auto;
}

.course-details__summary-box .teacher-details-card .teacher-details-card--img-box {
	box-shadow: 0px 5px 20px 0px #00000040;
}

.course-details__summary-box .teacher-details-card .teacher-details-card--rating-box > *  {
	filter: drop-shadow(0px 5px 10px rgba(0, 0, 0, 0.25));
}

.course-details__summary-box--content {
	padding-left: 30px;
	padding-right: 20px;
	border-left: 1px solid var(--primary-color);
}

.course-details__summary-box--header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 20px;
	margin-bottom: 25px;
}

.course-details__summary-box--header .teacher-profile__info-title {
	text-align: left;
	margin-bottom: 20px;
}

.course-details__summary-box--general-text {
	font-weight: 700;
	line-height: 26px;
}

.course-details__summary-box--general-text.author {
	color: var(--dark-color);
	font-size: 18px;
}

.course-details__summary-box--general-text.education {
	color: var(--primary-color);
	font-size: 20px;
}

.course-details__summary-box--avatar img {
	width: 100px;
	height: 100px;
	min-width: 100px;
	border-radius: 50%;
	object-fit: cover;
	box-shadow: 0px 5px 20px 0px #00000040;
}

.course-details__summary-box--studies {
	margin-top: 30px;
}

.course-details__summary-box--studies .show-more-cont {
	margin-top: 20px;
}

.course-details__summary-box--description {
	margin-top: 20px;
}

.course-details__summary-box--description .main-para-text {
	text-align: left !important;
	font-style: italic;
	color: var(--dark-color);
}

.course-details__summary-box--description > .main-para-text:not(:last-of-type) {
	margin-bottom: 20px;
}

.show-more-btn {
	display: inline-flex;
	align-items: center;
	gap: 10px;
}

.show-more-btn i {
	font-size: 16px;
	color: var(--dark-color);
}

.course-details__summary-box--labels {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
	margin-top: 30px;
}

.course-details__summary-box--labels .teacher-profile__summary-label {
	padding-top: 10px;
	padding-bottom: 10px;
}

.course-details__summary-box--btn-cont {
	margin-top: 40px;
	text-align: center;
}

.course-details__summary-box--btn-cont[data-display="mobile"] {
	display: none;
	margin-top: 50px;
}

.course-summary-btn {
	border-radius: 10px;
	background-color: var(--primary-color);
	box-shadow: 0px 5px 20px 0px #00000040;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	flex-direction: column;
	gap: 5px;
	padding: 10px 15px;
}

.course-summary-btn-text {
	font-weight: 700;
	font-size: 22px;
	line-height: 30px;
}

.course-summary-btn-text.primary {
	color: #fff;
}

.course-summary-btn-text.secondary {
	color: var(--yellow-color);
}

.course-detail__general-box {
	background-color: #fff;
	box-shadow: 0px 5px 20px 0px #00000040;
	border-radius: 10px;
	padding: 20px;
}

.course-detail__general-box .main-para-text {
	color: var(--dark-color);
}

.section__course-details--what-you-will-learn .course-detail__general-box {
	padding-top: 0;
	padding-bottom: 0;
}

.course-details__achievement-box {
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	align-items: stretch;
	gap: 20px;
}

.course-details__achievement-box > * {
	flex: 1 1 0;
	min-width: 0;
	padding-top: 20px;
	padding-bottom: 20px;
}

.course-details__achievement-box > div:first-of-type {
	border-right: 1px solid #f5f5f5;
	padding-right: 20px;
}

.course-details__general-list-item {
	display: flex;
	align-items: baseline;
	gap: 20px;
}

.course-details__achievement-box .course-details__general-list-item {
	gap: 15px;
}

.course-details__general-list-item .icon-box {
	width: 20px !important;
	height: 20px !important;
	min-width: 20px !important;
	border-radius: 5px !important;
	align-items: center !important;
	justify-content: center !important;
}

.course-details__general-list-item .icon-box i {
	font-size: 11px;
	color: #fff;
	line-height: 0;
}

.course-details__achievement-text {
	font-weight: 700;
	font-size: 18px;
	line-height: 24px;
	color: var(--dark-color);
}

.course-details__achievement-box > div > .course-details__general-list-item:not(:last-of-type) {
	margin-bottom: 20px;
}

.course-details__content-list-box {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 30px;
	row-gap: 20px;
}

.accordion-like-item__content {
	margin-top: 10px;
}

.accordion-like-item__content .main-para-text {
	color: #000;
	text-align: left !important;
}

.icon-box-link > * {
	pointer-events: none;
}

.section__course-details--structure .course-detail__general-box > .course-details__general-list-item:not(:last-of-type),
.section__course-details--detailed-desc .shrinked-text-box > .main-para-text:not(:last-of-type),
.section__course-details--pre-cal .course-detail__general-box > .main-para-text:not(:last-of-type),
.section__course-details--faq .course-detail__general-box > .course-details__general-list-item:not(:last-of-type) {
	margin-bottom: 20px;
}

.row-course-details--structure,
.row-course-details--faq {
	row-gap: 20px;
}

.section__course-details--pre-cal .course-detail__general-box .main-para-text {
	text-align: left !important;
}

.section__course-details--detailed-desc .show-more-cont {
	margin-top: 20px;
}

.section__course-details--detailed-desc .course-detail__general-box .main-para-text {
	text-align: left !important;
}

.row-course-details--opinions {
	margin-left: 0;
	margin-right: 0;
	padding: 0 !important;
}

.course-details__opinion-box {
	padding: 20px;
}

.course-details__opinion-box .main-para-text {
	text-align: left !important;
	color: var(--dark-color);
	font-style: italic;
}

.course-details__rating-box {
	display: flex;
	align-items: center;
	gap: 20px;
	margin-top: 25px;
}

.course-details__rating-box .main-para-text {
	font-weight: 700;
	font-style: normal;
}

.course-details__rating-box .teacher-details-card--rating-box {
	margin: 0;
}

.row-course-details--opinions > div:nth-of-type(odd) {
	border-right: 1px solid #f5f5f5;
}

.row-course-details--opinions .show-more-cont {
	margin-top: 10px;
	padding-left: 20px;
	padding-right: 20px;
	padding-bottom: 20px;
}

.shrinked-text-box {
	max-height: 100px;
	overflow: hidden;
	mask-image: linear-gradient(to bottom, black 10%, transparent 100%);
	-webkit-mask-image: linear-gradient(to bottom, black 10%, transparent 100%);
}

.shrinked-text-box.expanded {
	max-height: none;
	overflow: visible;
	mask-image: none;
	-webkit-mask-image: none;
}

.blog-post-cover-preview {
	max-width: 300px;
	height: auto;
	width: 100%;
	display: block;
	object-fit: cover;
	border-radius: 10px;
}

/* Media queries ================================================================================== */
@media (max-width: 1400px) {
	/* Header ========================== */
	.header__menu {
		justify-content: space-between;
	}

	.header__menu-list,
	.header__menu-style-switcher-container {
		display: none;
	}

	.hamburger-cont {
		display: block;
	}
}

@media (max-width: 1200px) {
	.profile-setup-form-box.student,
	.profile-setup-btn-box.student {
		padding-left: 0;
		padding-right: 0;
		margin-left: auto;
		margin-right: auto;
	}

	.row-register-main--types {
		padding-left: initial;
		padding-right: initial;
	}
}

@media (max-width: 992px) {
	:root {
		--category-box-height: 60px;
	}

	.slider-control-btn {
		width: 30px;
		height: 30px;
	}

	.main-subheader-text {
		font-size: 26px;
		line-height: 32px;
		text-align: center;
		margin-bottom: 15px;
	}

	.main-para-text {
		font-size: 16px;
		text-align: center;
	}

	.plan-card__features .main-para-text {
		text-align: left;
	}

	.icon-box,
	.homepage-join-us-as-teacher-desc-box-item .icon-box {
		width: 40px;
		height: 40px;
		min-width: 40px;
	}

	.icon-box img {
		width: 18px;
	}

	.btn:not(.dropdown-toggle) {
		height: 30px;
	}

	.btn img {
		height: 20px;
	}

	.btn i {
		font-size: 20px;
	}

	.btn.small {
		height: 24px;
		border-radius: 15px;
		padding-left: 15px;
		padding-right: 15px;
		font-size: 14px;
	}

	.btn.small img {
		height: 14px;
	}

	.btn.small i {
		font-size: 14px;
	}

	.custom-slider-controls {
		gap: 10px;
	}

	.slider-control-desktop {
		display: none;
	}

	.slider-control-mobile {
		display: flex;
	}

	.responsive-stack thead {
		display: none;
	}

	.responsive-stack tbody > tr:not(:last-of-type) {
		border-bottom: 5px solid var(--primary-color);
		margin-bottom: 20px;
	}

	.responsive-stack tbody tr td {
		padding: 0;
	}

	.responsive-stack tbody tr td .main-para-text {
		text-align: left;
	}
 
	.responsive-stack tr {
		display: block;
	}

	.responsive-stack td {
		display: block;
		border: none !important;
	}

	.responsive-stack td:last-child {
		border-bottom: none;
	}

	.responsive-stack td::before {
		content: attr(data-label);
		display: block;
		background-color: var(--light-blue-color);
		font-size: 20px;
		font-weight: 700;
		line-height: 28px;
		color: var(--primary-color);
	}

	.responsive-stack td::before,
	.responsive-stack tbody tr td .main-para-text {
		padding: 10px 20px;
	}

	.register-main-img-cont img {
		max-width: 500px;
		margin-left: auto;
		margin-right: auto;
	} 

	.category-box .icon-cont img {
		height: 28px;
	}

	/* Footer ============================================== */
	.footer__logo-container {
		text-align: center;
		display: flex;
		justify-content: center;
		flex-direction: column;
		max-width: 300px;
		margin: 0 auto;
	}

	.footer__social-link-container {
		justify-content: center;
	}

	.footer__logo {
		margin-bottom: 15px;
	}

	.footer__social-link-container,
	.footer__mobile-app-store-logo-container {
		margin-top: 15px;
	}

	.footer__nav-list li {
		text-align: center;
	}

	.footer__mobile-app-text {
		font-size: 14px;
		line-height: 20px;
	}

	.footer__mobile-app-store-logo {
		height: 35px;
	}

	.footer__copyright-upper-line {
		display: block;
		text-align: center;
	}

	/* SECTION: homepage-slide-1 =========================== */
	#carouselHome1 .custom-slider-controls {
		bottom: 10px;
		right: 10px;
	}

	#carouselHome1 .carousel-item img {
		height: 420px;
	}

	.slider-text-box {
		padding: 15px;
	}

	.slider-text-box-title {
		font-size: 30px;
		line-height: 36px;
		margin-bottom: 5px;
	}

	.slider-text-box-description {
		font-size: 14px;
		line-height: 20px;
		margin-bottom: 0;
	}

	#carouselHome1 .gradient-border {
		position: relative;
		top: unset;
		transform: none;
		left: unset;
		width: 100%;
		max-width: 100%;
	}

	.carouselHome1__text-box--mobile {
		position: absolute;
		display: block;
		top: 10px;
		transform: none;
		left: 10px;
		right: 10px;
		margin: 0 auto;
		max-width: 500px;
	}

	.carouselHome1__text-box--mobile .btn {
		margin-top: 20px;
	}

	.carouselHome1__text-box--desktop {
		display: none;
	}

	/* SECTION: homepage-from-beginner-to-pro ============================== */
	.row-homepage-from-beginner-to-pro {
		flex-direction: column-reverse;
	}

	.homepage--from-beginner-to-pro-list-box {
		margin-top: 20px;
	}

	.homepage--from-beginner-to-pro-list-item {
		flex-direction: column;
		align-items: center;
		gap: 20px;
	}

	.homepage--from-beginner-to-pro-list-labeltext {
		text-align: center;
	}

	.homepage--from-beginner-to-pro-img {
		margin-top: 35px;
		width: auto;
		margin-left: auto;
		margin-right: auto;
		display: block;
	}

	.homepage--from-beginner-to-pro-alert-box {
		margin-top: 40px;
	}

	.homepage--from-beginner-to-pro-alert-text {
		font-size: 20px;
		line-height: 30px;
	}

	.homepage--from-beginner-to-pro-alert-box .icon-box {
		margin-bottom: 15px;
	}

	.homepage--from-beginner-to-pro-alert-box .icon-box img {
		width: 25px;
	}

	/* SECTION: homepage-develop-logo-box =========================== */
	.section__homepage--develop .main-subheader-text {
		text-align: center;
		margin-bottom: 40px;
	}

	.row-homepage-develop-logo-box > div:nth-of-type(3) {
		justify-content: flex-start;
	}

	.row-homepage-develop-logo-box > div:nth-of-type(2),
	.row-homepage-develop-logo-box > div:nth-of-type(4) {
		justify-content: flex-end;
	}

	/* SECTION: homepage-popular-teachers ======================== */
	.section__homepage--popular-teachers .main-subheader-text {
		margin-bottom: 0;
	}

	/* SECTION: homepage-yoomten-community ======================== */
	.join-box-header-text {
		font-size: 20px;
		line-height: 30px;
	}

	.join-box--icon-container {
		margin-top: 20px;
	}

	/* SECTION: homepage-join-us-as-teacher ======================== */
	.homepage-join-us-as-teacher-para-box {
		flex-direction: column;
		justify-content: center;
	}

	.homepage-join-us-as-teacher-desc-box-item {
		flex-direction: column;
		align-items: center;
		justify-content: center;
	}

	.join-is-as-teacher__img {
		width: auto;
		margin-top: 35px;
		margin-left: auto;
		margin-right: auto;
		display: block;
	}

	/* SECTION: homepage-why-students-likes-us ======================================= */
	.section__homepage--why-students-likes-us .main-subheader-text {
		color: var(--primary-color);
	}

	.section__homepage--why-students-likes-us .main-subheader-text {
		margin-bottom: 60px;
	}

	.row-homepage-why-students-likes-us {
		row-gap: 60px;
	}

	.like-box {
		padding-top: 60px;
		padding-bottom: 20px;
		padding-left: 20px;
		padding-right: 20px;
	}

	.like-box--icon-box {
		top: -30px;
		width: 60px;
		height: 60px;
		min-width: 60px;
	}

	.like-box--icon-box img {
		width: 35px;
	}

	/* SECTION: homepage-plans ================================= */
	.plan-card__header {
		gap: 10px;
		padding: 10px;
		min-height: unset;
	}

	.plan-card__header img {
		height: 30px;
	}

	.plan-card__title {
		font-size: 20px;
		line-height: 28px;
	}

	.plan-card__body {
		padding-bottom: 20px;
		gap: 40px;
	}

	.plan-card__features .main-para-text {
		font-size: 18px;
		line-height: 24px;
	}

	.plan-card__features > li {
		padding: 8px 10px;
	}

	.plan-card__btn-box {
		padding: 0 10px;
	}

	/* SECTION: homepage-change-career */
	.homepage--change-career-header-box {
		justify-content: center;
		margin-bottom: 0;
	}
	
	/* TEACHER PROFILE ============================================================== */
	.teacher-profile__summary-box {
		flex-direction: column-reverse;
		align-items: unset;
	}

	.teacher-profile__nav-box {
		margin: 0 auto;
	}

	.teacher-profile__introduction-box .main-para-text {
		text-align: left;
	}

	.section__homepage--new-to-learn .row-homepage-change-career__mobile-controls {
		margin-bottom: 40px;
	}
}

@media (max-width: 991px) {
	:root {
		--padding-top-for-main-container: 114px;
		--margin-top-sticky-upper-header: -54px;
	}

	/* AUTH ========================================== */
	.auth-general-image {
		display: none;
	}

	/* COURSE DETAILS =============================== */
	.course-details__summary-box--content {
		border-left: none;
	}

	.course-details__summary-box--content,
	.course-details__summary-box .teacher-details-card {
		padding-left: 20px;
		padding-right: 20px;
	}

	.course-details__summary-box .teacher-details-card {
		max-width: 400px;
		margin-left: auto;
		margin-right: auto;
	}

	.course-details__summary-box {
		flex-direction: column-reverse;
		row-gap: 40px;
	}

	.course-details__summary-box--header {
		flex-direction: column-reverse;
		justify-content: center;
		align-items: center;
		gap: 10px;
	}

	.course-details__summary-box--title > * {
		text-align: center !important;
	}

	.course-details__summary-box--header .teacher-profile__info-title {
		font-size: 20px;
		line-height: 28px;
		margin-bottom: 15px;
	}

	.course-details__summary-box--general-text.author {
		font-size: 14px;
		line-height: 20px;
	}

	.course-details__summary-box--general-text.education {
		font-size: 18px;
		line-height: 24px;
		text-align: center;
	}

	.show-more-btn .course-details__summary-box--general-text.author {
		font-size: 18px;
		line-height: 24px;
	}

	.course-details__summary-box--labels .teacher-profile__summary-label {
		padding-top: 5px;
		padding-bottom: 5px;
	}

	.course-details__summary-box--btn-cont[data-display="desktop"] {
		display: none;
	}

	.course-details__summary-box--btn-cont[data-display="mobile"] {
		display: block;
	}

	.course-summary-btn {
		gap: 0;
	}

	.course-summary-btn-text {
		font-size: 20px;
		line-height: 28px;
	}

	.course-details__achievement-box {
		padding-top: 20px;
		padding-bottom: 20px;
	}

	.course-details__achievement-box > * {
		padding-top: 0;
		padding-bottom: 0;
	}

	.course-details__achievement-box > div:first-of-type {
		border-right: none;
		padding-right: 0;
	}

	.course-details__achievement-box {
		flex-direction: column;
	}

	.course-details__content-list-box {
		gap: 25px;
		row-gap: 20px;
	}

	.row-course-details--opinions {
		padding-top: 20px !important;
		row-gap: 25px;
	}

	.row-course-details--opinions > div:nth-of-type(odd) {
		border-right: none;
	} 

	.course-details__rating-box {
		margin-top: 10px;
	}

	.course-details__opinion-box {
		padding-top: 0;
		padding-bottom: 0;
	}

	.section__homepage--could-be-interesting .homepage-start-teaching-para-box-container,
	.section__homepage--new-to-learn .homepage-start-teaching-para-box-container {
		justify-content: center;
	}
}

@media (max-width: 768px) {
	:root {
		--main-label-height: 35px;
		--default-section-padding-top: 20px;
		--default-section-padding-bottom: 20px;
		--default-section-padding: 20px 0;
		--padding-top-for-main-container: 60px;
		--category-box-height: 50px;
	}

	.left-col-direction,
	.right-col-direction {
		transition: transform 1s ease, opacity 1s ease, filter 1s ease;
	}

	.main-label {
		padding-top: 6px;
		padding-bottom: 6px;
	}

	.main-label-text {
		font-size: 18px;
		line-height: 26px;
	}

	.main-label .icon-cont img {
		height: 25px;
	}

	.main-label.course-details {
		margin-bottom: 20px;
	}

	.form-control,
	.form-select {
		height: 32px;
		border-radius: 5px;
		padding-left: 10px;
		padding-right: 10px;
		font-size: 14px;
	}

	.thanks-for-joining-card {
		padding: 20px;
	}

	.thanks-for-joining-card .main-subheader-text {
		font-size: 24px;
		line-height: 30px;
	}

	.thanks-for-joining-card-para-box {
		margin-top: 20px;
	}

	.thanks-for-joining-card-para-box > .main-para-text:not(:last-of-type) {
		margin-bottom: 20px;
	}

	.thanks-for-joining-card--btn-box {
		margin-top: 35px;
	}

	.forgot-password-cont {
		text-align: left;
	}

	.category-box .icon-cont img {
		height: 24px;
	}

	.auth-form-element .text-danger,
	.possible-danger .text-danger {
		font-size: 14px;
		line-height: 20px;
	}

	.with-icon .form-control {
		padding-right: 35px !important;
	}

	.input-icon {
		right: 10px;
	}

	.input-icon i {
		font-size: 16px;
		color: var(--dark-color);
	} 

	/* Header ========================== */
	.header__auth-btn-container {
		display: none;
		justify-content: space-between;
	}

	.header__auth-btn-container--mobile {
		display: flex;
		align-items: center;
		flex-wrap: wrap;
		row-gap: 10px;
		column-gap: 20px;
		margin-bottom: 20px;
		margin-top: 10px;
	}

	.header__menu-icon-container .header__menu-language-switcher {
		display: none;
	}

	.mobile-menu--additional-menu-box .header__menu-language-switcher  {
		display: block;
	}

	/* AUTH =============================== */
	.auth-box {
		padding: 20px;
	}

	.auth-form-container {
		margin-top: 20px;
	}

	.auth-box .homepage--from-beginner-to-pro-alert-text,
	.auth-form-container .main-para-text {
		text-align: left !important;
	}  

	.reg-btn-container {
		text-align: left;
		margin-top: 20px;
	}

	.row-register .reg-btn-container {
		text-align: center;
	}

	.auth-box .main-subheader-text {
		font-size: 24px;
		line-height: 30px;
	}

	.stepper {
		margin: 20px auto;
	}

	.profile-setup-para-box,
	.profile-setup-form-box {
		margin-top: 20px;
	}

	.profile-setup-para-box .main-para-text {
		text-align: left !important;
	}

	.profile-setup-form-box .form-check-label {
		font-size: 14px;
		line-height: 20px;
	}

	.profile-setup-form-box .auth-form-element .form-check {
		gap: 10px;
	}

	.profile-setup-form-box .auth-form-element {
		padding: 5px 10px;	
	}

	.profile-setup-para-box.student > .main-para-text:not(:last-of-type) {
		margin-bottom: 20px !important;
	}

	.profile-setup-para-box.student > .main-para-text:last-of-type {
		margin-top: 20px !important;
	} 

	.profile-setup-btn-box.student {
		margin-top: 25px;
	}

	.row-register-main .main-para-text {
		margin: 20px 0;
	}

	.verify-email-col .reg-btn-container {
		text-align: center;
		margin-top: 40px;
	}

	.verify-email-col .auth-box {
		padding-left: 20px;
		padding-right: 20px;
	}

	.verify-email-col .auth-box .homepage--from-beginner-to-pro-alert-text {
		text-align: center !important;
	}

	.profile-init-badge {
		padding: 25px;
	}

	.profile-init-badge-text-box {
		padding: 15px 20px;
	}

	.section__my-courses-list .homepage-start-teaching-para-box-container {
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 0;
		margin-bottom: 20px;
	}

	/* SECTION: hompage-categories ======================================= */
	.homepage-categories-text.big {
		font-size: 50px;
		line-height: 62px;
	}

	.homepage-categories-text.medium {
		font-size: 30px;
		line-height: 42px;
	}

	.homepage-categories-text.small {
		font-size: 18px;
		line-height: 30px;
	}

	.splide-categories-2 {
		margin-top: 0;
		margin-bottom: 10px;
	}

	/* SECTION: homepage-develop-logo-box ============================== */
	.homepage--develop-logo-box {
		padding: 15px 20px;
	}

	.homepage--develop-logo-box img {
		max-height: 28px;
	}

	/* SECTION: homepage--yoomten-community ============================== */
	.opinion-card {
		padding: 20px;
		gap: 15px;
	}

	.opinion-card__text-box .main-para-text {
		margin-top: 10px;
	}

	.opinion-card__text-box img {
		height: 40px;
	}

	.homepage-yoomten-community__join-box {
		padding: 15px 50px;
	}

	/* SECTION: homepage-change-career =========================== */
	.row-homepage-change-career__carousel-box .splide .splide__track {
		padding-top: 40px;
	}

	.row-homepage-change-career__carousel-box .splide .splide__track,
	.row-homepage-start-teaching-card-box .splide .splide__track {
		padding-bottom: 40px;
	}

	.teacher-details-card {
		padding: 10px;
	}

	.teacher-details-card--img-box {
		height: 220px;
	}

	.teacher-details-card--rating-box {
		margin-top: 20px;
		margin-bottom: 15px;
	}

	.teacher-details-card--course-text {
		font-size: 16px;
		line-height: 20px;
	}

	.teacher-details-card--course-details-box {
		padding: 5px 15px;
	}

	.teacher-details-card--course-detail-item {
		gap: 5px;
	}

	.teacher-details-card--label {
		font-size: 8px;
		line-height: 12px;
		padding: 3px 10px;
	}

	.teacher-details-card--course-detail-item span {
		font-size: 9px;
		line-height: 12px;
	}

	/* SECTION: homepage-popular-teachers ====================== */
	.row-homepage-popular-teachers-carousel .splide .splide__track {
		padding-bottom: 40px;
	}

	.popular-teacher-card {
		gap: 15px;
	}

	.popular-teacher-card__img {
		height: 160px;
	}

	.popular-teacher-card__name {
		font-size: 14px;
		line-height: 18px;
		margin-top: 15px;
	}

	.popular-teacher-card__role,
	.popular-teacher-card__bottom-text {
		font-size: 12px;
		line-height: 16px;
	}

	/* TEACHER PROFILE ============================================================== */
	.teacher-profile__nav-box {
		gap: 15px;
		padding: 15px;
	}

	.teacher-profile__avatar {
		width: 100px;
		height: 100px;
		min-width: 100px;
	}

	.teacher-profile__info-title {
		font-size: 20px;
		line-height: 28px;
	}

	.teacher-profile__introduction-box > .main-para-text:not(:last-of-type) {
		margin-bottom: 20px;
	}

	/* COURSE DETAILS ====================================== */
	.course-details__achievement-box .course-details__general-list-item {
		flex-direction: column;
		align-items: center;
	}

	.course-details__achievement-box .course-details__general-list-item .course-details__achievement-text {
		text-align: center;
	}

	.course-details__general-list-item {
		gap: 10px;
	}

	.row-course-details--opinions .show-more-cont {
		display: flex;
		justify-content: center;
	}

	.section__login .reg-btn-container,
	.section__login .forgot-password-cont {
		text-align: center !important;
	}
}

@media (max-width: 575px) {
	#spliderPopularTeachersPrev {
		left: 2px;
	}

	#spliderPopularTeachersNext {
		right: 2px;
	}

	.container-main {
		padding-left: 20px;
		padding-right: 20px;
	}

	.row-category-box {
		row-gap: 15px;
	}

	.category-box {
		max-width: 250px;
		margin-left: auto;
		margin-right: auto;
	}
}

@media (max-width: 560px) {
	.splide-start-teaching,
	.splide-change-career {
		padding-left: 15px;
		padding-right: 15px;
	}

	.row-homepage-change-career__carousel-box .teacher-details-card, 
	.row-homepage-start-teaching-card-box .teacher-details-card,
	.teacher-details-card,
	.course-progress-container {
		max-width: 80%;
	}

	.course-progress-container {
		margin-left: auto;
		margin-right: auto;
	}

	.section__teacher-profile--courses .teacher-details-card,
	.row-teacher-details-courses .teacher-details-card,
	.row-homepage-change-career__carousel-box .teacher-details-card,
	.row-homepage-start-teaching-card-box .teacher-details-card,
	.splide-could-be-interesting .teacher-details-card,
	.splide-new-to-learn .teacher-details-card {
		margin: 0 auto;
	}

	.course-extended-details-card > * {
		width: 100%;
	}
}

@media (max-width: 480px) {
	.header-avatar {
		width: 100% !important;
		height: auto !important;
		aspect-ratio: 1 / 1 !important;
		max-width: 28px !important;
	}
}

/* Min widths ============================================================== */

@media (min-width: 576px) {
	:root {
		--container-max-width: 540px;
	}
}

@media (min-width: 768px) {
	:root {
		--container-max-width: 720px;
	}
}

@media (min-width: 992px) {
	:root {
		--container-max-width: 960px;
	}

	.row-homepage-from-beginner-to-pro > div:nth-of-type(1) {
		padding-right: calc(80px / 2);
	}

	.row-homepage-from-beginner-to-pro > div:nth-of-type(2) {
		padding-left: calc(80px / 2);
	}

	.row-homepage-from-beginner-to-pro,
	.row-homepage-join-us-as-teacher__desc-box {
		align-items: center;
	}
}

@media (min-width: 1200px) {
	:root {
		--container-max-width: 1140px;
	}
}

@media (min-width: 1400px) {
	.container-main {
		max-width: var(--container-max-width);
	}
}

/* Dark mode styles =============================================================== */
.darkmode .active-dot {
	left: 36px;
}

.darkmode .toogle-light {
	pointer-events: auto;
}

.darkmode .toogle-dark {
	pointer-events: none;
}