@charset "utf-8";
/* CSS Document */

/*---------- Google Fonts ----------*/
/* @import url('https://fonts.googleapis.com/css2?family=Manrope:wght@200..800&display=swap'); */
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');


body {
	/* font-family: "Open Sans", sans-serif; */
	background: #f6f7f9;
	overflow-x: hidden;
	color: #263140;
}

.overflowSection {
	overflow: hidden;
}

:root {
	--primary: #ff8000;
	--secondary: #263140;
	--text-color: #6c7c93;
}

strong {
	font-weight: 600;
}

* {
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-o-font-smoothing: antialiased;
}

a,
input,
button,
textarea {
	outline: none !important;
}

p {
	font-weight: 400;
	font-size: 18px;
	line-height: 28px;
	color: #6c7c93;
}

.section-padding {
	padding: 96px 0;
}

.section-padding-80 {
	padding: 80px 0;
}

a {
	transition: all ease-in-out 300ms;
	-webkit-transition: all ease-in-out 300ms;
	-ms-transition: all ease-in-out 300ms;
	-o-transition: all ease-in-out 300ms;
	-moz-transition: all ease-in-out 300ms;
}

.btn {
	font-size: 16px;
	line-height: 16px;
	font-weight: 600;
	padding: 12px 32px;
	color: #FFFFFF;
	background: #ff8000;
	transition: all .5s ease;
	border: none;
	border-radius: 12px;
	box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
	display: inline-flex;
	align-items: center;
	width: auto;
}

.btn:hover,
.btn:focus {
	color: #fff;
	background: #ff8000;
	box-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);
}

.simple-btn {
	font-size: 14px;
	line-height: 14px;
	font-weight: 600;
	padding: 0;
	color: var(--secondary);
	background: transparent;
	transition: all .5s ease;
	border: none;
	display: inline-flex;
	align-items: center;
	width: auto;
	box-shadow: none !important;
}

.simple-btn svg {
	width: 16px;
	height: auto;
	margin-left: 8px;
}

.simple-btn:hover,
.simple-btn:focus {
	color: var(--secondary);
	background: #f0f2f4;
}

.simple-btn:hover svg {
	transform: translateX(4px);
}

.btn-arrow svg {
	width: 16px;
	margin-left: 8px;
	transition-property: transform;
	transition-timing-function:
		cubic-bezier(.4, 0, .2, 1);
	transition-duration: .15s;
}

.btn-arrow:hover svg {
	transform: translateX(4px);
}

.btn-border {
	background: #f6f7f9;
	color: #263140;
	border: 2px solid #e5e7eb;
	padding: 14px 32px;
	box-shadow: none;
}

.btn-border:hover {
	background: #f0f2f4;
	color: #263140;
	border: 2px solid #e5e7eb;
	box-shadow: none;
}

.btn-arrow-border {
	font-size: 14px;
	line-height: 14px;
	padding: 8px 16px;
}

.btn-arrow-border svg {
	width: 16px;
	height: auto;
	margin-left: 4px;
	transition-property: transform;
	transition-timing-function:
		cubic-bezier(.4, 0, .2, 1);
	transition-duration: .15s;
}

.btn-arrow-border:hover {
	background: #f0f2f4;
	color: #263140;
	border: 2px solid #e5e7eb;
	box-shadow: none;
}

.btn-arrow-border:hover svg {
	transform: translateX(4px);
}


.main {
	padding: 90px 0 0;
}

.main-title {
	color: #263140;
	font-size: 72px;
	line-height: 72px;
	font-style: normal;
	font-weight: 700;
	text-align: center;
	padding: 0 0 32px;
	/* letter-spacing: -1px; */
}

.main-title * {
	color: inherit;
	line-height: inherit;
	font-size: inherit;
	margin: 0;
	font-weight: inherit;
}

.top-label {
	display: inline-flex;
	font-size: 14px;
	line-height: 14px;
	background: #f0f2f4;
	color: #263140;
	padding: 8px 16px;
	border: 1px solid #e5e7eb;
	border-radius: 50px;
	font-weight: 600;
	margin: 0 0 32px;
}

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

.section-title {
	padding: 0 0 16px;
	color: #263140;
	font-size: 48px;
	line-height: 48px;
	font-style: normal;
	font-weight: 700;
	text-align: center;
}

.section-title * {
	color: inherit;
	line-height: inherit;
	font-size: inherit;
	margin: 0;
	font-weight: inherit;
}

.page-title {
	padding: 0 0 16px;
	color: #263140;
	font-size: 60px;
	line-height: 60px;
	font-style: normal;
	font-weight: 700;
	text-align: center;
}

.page-title span {
	color: var(--primary);
}

.section-title span {
	color: var(--primary);
}

.page-title * {
	color: inherit;
	line-height: inherit;
	font-size: inherit;
	margin: 0;
	font-weight: inherit;
}

.sub-title {
	color: var(--secondary);
	font-size: 18px;
	font-weight: 700;
	line-height: 28px;
	padding: 0 0 19px;
}

.sub-title * {
	color: inherit;
	line-height: inherit;
	font-size: inherit;
	margin: 0;
	font-weight: inherit;
}

.white-title {
	color: #FFFFFF;
}

.navbar {
	padding: 0;
}


.navbar-nav .nav-item {
	position: relative;
	padding: 0 14px;
}

.navbar-nav .nav-item:last-child {
	padding-right: 0;
}

.navbar-nav .nav-item:first-child {
	padding-left: 0;
}

.navbar-nav .nav-item:last-child:after {
	display: none;
}

.navbar-nav .nav-item .nav-link {
	font-weight: 400;
	font-size: 14px;
	line-height: 14px;
	padding: 0;
	color: #263140;
	position: relative;
}


.navbar-nav .nav-item .nav-link.show,
.navbar-nav .nav-item .nav-link.active,
.navbar-nav .nav-item.active>.nav-link,
.navbar-nav .nav-item.current-menu-item>.nav-link,
.navbar-nav .nav-item>.nav-link.active,
.navbar-nav .nav-item>.nav-link.current-menu-item,
.navbar-nav .nav-item>.nav-link:hover {
	color: var(--primary);
}

.navbar-nav .nav-item .nav-link.show:after,
.navbar-nav .nav-item .nav-link.active-menu:after,
.navbar-nav .nav-item.active>.nav-link:after,
.navbar-nav .nav-item.current-menu-item>.nav-link:after,
.navbar-nav .nav-item>.nav-link.active:after,
.navbar-nav .nav-item>.nav-link.current-menu-item:after,
.navbar-nav .nav-item>.nav-link:hover :after {
	color: #FFFFFF;
}

.navbar-brand {
	padding: 0;
	position: relative;
	margin: 0;
	margin-right: 15px;
}


.navbar-brand img {
	width: 57px;
	width: 90px;
}

.header {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	z-index: 99;
	background: #f7f7f9;
	padding: 12px 0;
	border-bottom: 1px solid #e5e7eb;
	backdrop-filter: blur(12px);
}

.right-menu {
	display: flex;
	list-style-type: none;
	padding: 0;
	margin: 0;
	align-items: center;
	gap: 12px;
}

.right-menu li a {
	font-weight: 600;
	font-size: 14px;
	line-height: 14px;
	color: #263140;
	position: relative;
	display: block;
	padding: 11px 15px;
	text-decoration: none;
	border-radius: 12px;
}

.right-menu li a:hover {
	background: #f0f2f4;
}

.right-menu li a.btn {
	color: #fff;
}

.right-menu li a.btn:hover {
	color: #fff;
	background: #ff8000;
	box-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);
}

.right-menu li a.book-btn:hover {
	background: #503E0E;
}

.right-menu .btn {
	box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
}

.book-main {
	padding: 80px 0;
}

.book-main p {
	font-size: 20px;
	line-height: 28px;
	margin: 0 0 56px;
	color: #6c7c93;
}

.book-main ul {
	display: flex;
	list-style-type: none;
	padding: 70px 0 0;
	margin: 0;
	align-items: center;
	justify-content: center;
	gap: 32px;
	max-width: 768px;
	margin: 0 auto;
	flex-wrap: wrap;
}

.book-main ul li {
	position: relative;
	padding: 0;
	padding-left: 24px;
	font-size: 14px;
	line-height: 14px;
	color: #6c7c93;
}

.book-main ul li:after {
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ff8000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-circle-check h-4 w-4 text-primary'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpath d='m9 12 2 2 4-4'%3E%3C/path%3E%3C/svg%3E") no-repeat;
	position: absolute;
	left: 0;
	top: 0;
	content: "";
	display: block;
	background-size: 16px;
	height: 16px;
	width: 16px;
}

.course-block .c-detail {
	padding: 24px;
}

.course-list [class*=col-] {
	padding-bottom: 24px;
}

.course-block {
	box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	background: #FFFFFF;
	height: 100%;
}

.course-block:hover {
	box-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);
}

.course-block .c-head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0 0 12px;
}

.course-block .c-head .label {
	padding: 2px 10px;
	background: var(--secondary);
	border-radius: 50px;
	font-size: 12px;
	line-height: 18px;
	color: #FFFFFF;
	font-weight: 600;
}

.course-block .c-head .rating {
	display: flex;
	align-items: center;
}

.course-block .c-head .rating svg {
	width: 16px;
	margin-right: 3px;
}

.course-block .c-head .rating svg path {
	fill: var(--primary);
	stroke: var(--primary);
}

.course-block .c-head .rating span {
	font-size: 14px;
	line-height: 14px;
	display: block;
	color: var(--secondary);
	font-weight: 600;
}

.course-block h5 {
	font-size: 20px;
	line-height: 20px;
	display: block;
	color: var(--secondary);
	font-weight: 600;
	margin: 6px 0;
}

.course-block p {
	font-size: 14px;
	line-height: 20px;
	display: block;
	color: var(--text-color);
	margin: 0 0 16px;
}

.course-block ul {
	display: flex;
	padding: 0;
	margin: 0;
	list-style-type: none;
	gap: 16px;
}

.course-block ul li {
	display: flex;
	padding: 0;
	margin: 0;
	list-style-type: none;
	font-size: 14px;
	line-height: 14px;
	color: var(--text-color);
}

.course-block ul li svg {
	width: 16px;
	margin-right: 4px;
	height: auto;
}

.course-block ul.tags {
	padding: 16px 0;
}

.course-block ul.tags li {
	border: 1px solid #e5e7eb;
	border-radius: 50px;
	background: #FFFFFF;
	padding: 2px 10px;
	font-size: 12px;
	line-height: 18px;
	color: var(--secondary);
	font-weight: 600;
}

.course-block .c-footer h3 {
	font-size: 24px;
	line-height: 24px;
	color: var(--secondary);
	margin: 0;
	font-weight: 600;
}

.course-block .c-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-top: 1px solid #e5e7eb;
	padding: 16px 24px 24px;
}

.text-block {
	padding: 0 0 64px;
}

.why-choose {
	background: #f0f2f44d;
}

.choose-block {
	box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	background: #FFFFFF;
	height: 100%;
	padding: 32px;
}

.choose-block:hover {
	box-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);
}

.choose-block .icon {
	height: 48px;
	width: 48px;
	margin: 0 0 20px;
	border-radius: 12px;
	background: #FF80001A;
	display: flex;
	align-items: center;
	justify-content: center;
}

.choose-block .icon svg * {
	stroke: var(--primary);
}

.choose-block h5 {
	font-size: 18px;
	line-height: 28px;
	display: block;
	color: var(--secondary);
	font-weight: 600;
	margin: 0 0 8px;
}

.choose-block p {
	font-size: 14px;
	line-height: 26px;
	display: block;
	color: var(--text-color);
	margin: 0;
}

.counter-main {
	background: var(--secondary);
}



.counter-block h3 {
	font-weight: 700;
	font-size: 48px;
	line-height: 50px;
	margin: 0 0 8px;
	color: #FFFFFF;

}

.counter-list {
	max-width: 1024px;
	margin: 0 auto;
}

.counter-block {
	text-align: center;
}


.counter-block p {
	font-size: 14px;
	line-height: 20px;
	display: block;
	color: #FFFFFFCC;
	margin: 0;
}

.workplace-main {
	background: var(--secondary);
}

.workplace-main p {
	color: #FFFFFFCC;
}

.workplace-main .btn-border {
	background: #ffffff1a;
	color: #FFFFFF;
	border-color: #fff3;
}

.workplace-main ul li {
	color: #FFFFFFCC;
}

.footer {
	background: var(--secondary);
	padding: 64px 0;
}


.f-logo a img {
	width: 90px;
	filter: invert(100%);
}

.f-logo p {
	font-size: 14px;
	line-height: 20px;
	margin: 16px 0;
	color: #FFFFFFCC;
}

.f-logo ul {
	display: flex;
	align-items: center;
	padding: 0;
	margin: 0;
	gap: 16px;
}

.f-logo ul li {
	display: block;
	padding: 0 !important;
	margin: 0;
	list-style: none;
}

.f-logo ul li a svg {
	width: 20px;
	height: auto;
}

.f-logo ul li a svg * {
	stroke: #FFFFFF;
}

.f-logo ul li a:hover svg * {
	stroke: var(--primary);
}

.f-title {
	font-size: 16px;
	line-height: 16px;
	color: #FFFFFF;
	margin: 0 0 16px;
	font-weight: 600;
}

.f-block ul {
	padding: 0;
	margin: 0;
	list-style-type: none;
	padding: 0;
}

.f-block ul li {
	padding: 0 0 10px;
	margin: 0;
	list-style-type: none;
}

.f-block ul li a {
	color: #FFFFFFCC;
	text-decoration: none;
	font-size: 14px;
	line-height: 20px;
	display: block;
}

.f-block ul li a:hover {
	color: var(--primary);
}

.f-bottom {
	text-align: center;
	margin: 48px 0 0;
	padding: 32px 0 0;
	border-top: 1px solid #ffffff33;
}

.f-bottom p {
	font-size: 14px;
	line-height: 14px;
	color: #FFFFFFCC;
	margin: 0;
}

.trust-block {
	box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	background: #FFFFFF;
	height: 100%;
	padding: 24px;
}

.trust-block:hover {
	box-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);
}


.trust-block .rating svg {
	width: 16px;
	height: auto;
}

.trust-block .rating svg * {
	fill: var(--primary);
	stroke: var(--primary);
}


.trust-block p {
	font-size: 16px;
	line-height: 26px;
	display: block;
	color: var(--secondary);
	margin: 16px 0;
}

.trust-block .user-name .icon {
	height: 40px;
	width: 40px;
	flex: 0 0 40px;
	background: #ff80001a;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 16px;
	line-height: 16px;
	font-weight: 600;
	color: var(--primary);
	margin-right: 12px;
}

.trust-block .user-name {
	display: flex;
	align-items: center;
}

.trust-block .user-name h6 {
	font-size: 14px;
	line-height: 20px;
	font-weight: 600;
	margin: 0;
	color: var(--secondary);
}

.trust-block .user-name span {
	font-size: 12px;
	line-height: 16px;
	display: block;
	margin: 0;
	color: var(--text-color);
}

.about-us-page .counter-main {
	background: rgb(240 242 244 / 50%);
	padding: 64px 0;
}

.about-us-page .counter-block h3 {
	color: var(--secondary);
}

.about-us-page .counter-block p {
	color: var(--text-color);
}

.our-story .section-title {
	padding: 0 0 48px;
}

.our-story .text-block {
	max-width: 896px;
	margin: 0 auto;
}

.our-story .text-block p {
	font-size: 16px;
	line-height: 24px;
	margin: 0 0 24px;
}

.our-story {
	padding-bottom: 0;
}

.drive-us {
	background: #f0f2f44d;
}

.drive-us .container {
	max-width: 1048px;
}

.drive-us .choose-block {
	padding: 32px 24px 24px;
}

.drive-us .choose-block p {
	margin: 0;
	font-size: 16px;
	line-height: 24px;
}

.drive-us .choose-block .icon {
	margin: 0 auto 16px;
	border-radius: 50%;
}

.drive-us .choose-block h5 {
	font-size: 20px;
	font-weight: 700;
}

.commitment-sec .container {
	max-width: 896px;
}

.commitment-sec ul {
	display: block;
	padding: 0;
	margin: 0;
	list-style-type: none;
}

.commitment-sec ul li {
	display: block;
	padding: 0 0 24px;
	margin: 0;
	list-style-type: none;
	position: relative;
	padding-left: 36px;
	font-size: 18px;
	line-height: 28px;
	color: var(--text-color);
}

.commitment-sec ul li:after {
	display: block;
	content: "";
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ff8000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-circle-check h-6 w-6 text-primary flex-shrink-0 mt-1'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpath d='m9 12 2 2 4-4'%3E%3C/path%3E%3C/svg%3E") no-repeat;
	position: absolute;
	left: 0;
	top: 4px;
	height: 20px;
	width: 20px;
	background-size: 20px;
}

.work-main {
	background: #FF80001A;
	background: linear-gradient(180deg, rgba(255, 128, 0, 0.06) 0%, rgba(255, 255, 255, 0.1) 100%);
	padding: 48px 0;
}

.work-main p {
	font-size: 20px;
	line-height: 28px;
}

.search {
	position: relative;
	max-width: 672px;
	margin: 0 auto;
}

.search .s-icon svg {
	width: 20px;
	height: auto;
}

.search .s-icon {
	position: absolute;
	left: 16px;
	top: 50%;
	transform: translate(0, -50%);
}

.form-control {
	background: #f6f7f9;
	height: 50px;
	padding: 12px 16px;
	font-size: 14px;
	line-height: 14px;
	border-radius: 12px;
}

.search .form-control {
	height: 56px;
	padding: 8px 12px 8px 48px;
}

.form-control:focus {
	border-color: #ff8000;
	box-shadow: 0 0 0 .25rem rgba(255, 118, 0, .25);
}


.nav-tabs {
	border: none;
	margin: 0 0 24px;
	justify-content: center;
}

.nav-tabs .nav-item {
	padding: 0 5px;
}

.nav-tabs .nav-link {
	font-size: 16px;
	line-height: 20px;
	padding: 10px 16px;
	background: #f0f2f4;
	border-radius: 12px;
	color: var(--secondary);
	border: none !important;
}

.nav-tabs .nav-link:hover,
.nav-tabs .nav-item.show .nav-link,
.nav-tabs .nav-link.active {
	color: #FFFFFF;
	background: var(--primary);
}


.course-sidebar .nav-tabs {
	display: block;
}

.course-sidebar .nav-tabs .nav-item {
	padding: 0 0 10px;
}

.course-sidebar .nav-tabs .nav-item .nav-link img {
	margin-right: 10px;
}

.course-sidebar .nav-tabs .nav-item .nav-link {
	display: block;
	width: 100%;
	text-align: left;
}

.result h6 {
	font-size: 16px;
	line-height: 16px;
	color: var(--text-color);
	margin: 0 0 24px;
	font-weight: 400;
}

.result h6 span {
	font-weight: 600;
}

.course-tabing {
	padding: 48px 0;
}

.course-tabing .course-block {
	position: relative;
}

.course-tabing .course-block:hover {
	box-shadow: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);
	border-color: rgba(255, 128, 0, 0.5);
}

.course-tabing .course-block::after {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 8px;
	background: #FF8000;
	background: linear-gradient(90deg, rgba(255, 128, 0, 1) 0%, rgba(240, 242, 244, 1) 100%);
	content: "";
	display: block;
}

.course-tabing .course-block h5 {
	color: var(--primary);
}

.course-tabing .course-block .c-head .rating svg path {
	stroke: var(--secondary);
	fill: var(--secondary);
}

.course-tabing .course-block p {
	font-size: 16px;
	line-height: 24px;
}

.course-tabing .course-block .btn {
	font-size: 14px;
	line-height: 14px;
	padding: 10px 24px;
}

.course-tabing .course-block ul.tags {
	padding: 16px 0 0;
}

.course-tabing .course-block .c-footer h3 {
	color: var(--primary);
	font-weight: 700;
}

.course-tabing .course-block .c-footer {
	padding-top: 0;
	border: none;
}

.help-block {
	padding: 24px;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	background: #FFFFFF;
}

.course-sidebar {
	position: sticky;
	top: 100px;
}

.price-block {
	padding: 40px 24px 24px;
	box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	background: #FFFFFF;
	height: 100%;
	position: relative;
}

.price-block h3 {
	font-size: 24px;
	line-height: 32px;
	color: var(--secondary);
	margin: 0 0 8px;
	font-weight: 600;
}

.price-block .btn {
	display: block;
	padding: 16px;
}

.price-block .btn-border {
	padding: 14px;
}

.price-block h2 {
	font-size: 48px;
	line-height: 48px;
	color: var(--secondary);
	margin: 0;
	font-weight: 700;
}

.price-block p {
	font-size: 16px;
	line-height: 24px;
	color: var(--text-color);
	margin: 6px 0 0;
}

.price-block ul {
	display: block;
	padding: 32px 0 8px;
	margin: 0;
	list-style-type: none;
}

.price-block ul li {
	font-size: 16px;
	line-height: 24px;
	color: var(--text-color);
	padding: 0 0 16px;
	margin: 0;
	list-style-type: none;
	position: relative;
	padding-left: 28px;
	text-align: left;
}

.price-block ul li:after {
	display: block;
	content: "";
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='%23ff8000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-circle-check h-6 w-6 text-primary flex-shrink-0 mt-1'%3E%3Ccircle cx='12' cy='12' r='10'%3E%3C/circle%3E%3Cpath d='m9 12 2 2 4-4'%3E%3C/path%3E%3C/svg%3E") no-repeat;
	position: absolute;
	left: 0;
	top: 4px;
	height: 20px;
	width: 20px;
	background-size: 20px;
}

.popular-block {
	border: 2px solid var(--primary);
}

.popular {
	display: table;
	font-size: 14px;
	line-height: 20px;
	background: var(--primary);
	color: #FFFFFF;
	padding: 4px 16px;
	border-radius: 50px;
	font-weight: 600;
	position: absolute;
	top: -14px;
	left: 0;
	right: 0;
	margin: auto;
}

.faq-block {
	padding: 0 0 32px;
}

.faq-block h6 {
	font-size: 20px;
	line-height: 28px;
	color: var(--secondary);
	margin: 0 0 12px;
	font-weight: 600;
}

.our-story .faq-block p {
	margin: 0;
}

.faq-sec {
	background: #f0f2f44d;
}

.book-main .nav-tabs {
	gap: 0;
	padding: 40px 0 32px;
}

.book-main .nav-tabs li .nav-link {
	border: 2px solid #e5e7eb !important;
	background: transparent;
	border-radius: 9999px;
	padding: 10px 24px;
	font-size: 14px;
	line-height: 20px;
	font-weight: 600;
}

.book-main .nav-tabs li .nav-link:hover {
	background: #f0f2f4;
	color: var(--secondary);
}

.book-main .nav-tabs li:after {
	display: none;
}

.book-main .nav-tabs .nav-item.show .nav-link,
.book-main .nav-tabs .nav-link.active {
	color: #FFFFFF;
	background: var(--primary);
	border-color: var(--primary) !important;
}

.book-main .nav-tabs .nav-item.show .nav-link:hover,
.book-main .nav-tabs .nav-link.active:hover {
	color: #FFFFFF;
	box-shadow: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);
	background: var(--primary);
	border-color: var(--primary) !important;
}

.blog-tabing {
	border-top: 1px solid #e5e7eb;
}

.blog-tabing .course-block p {
	font-size: 16px;
	line-height: 24px;
	margin: 0 0 24px;
}

.blog-tabing .course-block .c-footer {
	border: none;
	padding-top: 0;
}

.blog-tabing .course-block h5 {
	font-size: 20px;
	line-height: 28px;
}

.blog-tabing .course-list {
	max-width: 1280px;
	margin: 0 auto;
}

.blog-tabing .course-block:hover h5 {
	color: var(--primary);
}

.course-list .row {
	margin: 0 -16px;
}

.course-list [class*=col-] {
	padding: 0 16px;
	padding-bottom: 32px;
}

.update-sec {
	background: #f0f2f44d;
}

.update-sec .form-group {
	max-width: 448px;
	margin: 0 auto;
	display: flex;
	gap: 16px;
	/* align-items: center; */
}

.update-sec .text-block p {
	font-size: 20px;
	line-height: 28px;
}

.update-sec .text-block {
	padding: 0 0 40px;
}

.update-sec .section-title {
	font-size: 36px;
}

.update-sec form p {
	font-size: 14px;
	line-height: 20px;
	color: var(--text-color);
	margin: 24px 0 0;
	text-align: center;
}

.contact-block {
	box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	background: #FFFFFF;
	padding: 24px;
}

.contact-block h3 {
	font-size: 24px;
	line-height: 24px;
	color: var(--secondary);
	margin: 0;
	font-weight: 600;
}

.contact-block p {
	font-size: 14px;
	line-height: 20px;
	color: var(--text-color);
	margin: 6px 0 0;
}

textarea.form-control {
	height: auto !important;
}

.contact-title {
	padding: 0 0 24px;
}

.form-group {
	margin: 0 0 24px;
}

.form-group label {
	font-size: 14px;
	line-height: 14px;
	color: var(--secondary);
	margin: 0 0 8px;
	display: block;
	font-weight: 500;
}

.contact-form .form-control {
	height: 40px;
	padding: 8px 12px;
	border-radius: 10px;
}

.contact-form .btn {
	padding: 16px 32px;
}

.c-block .icon svg * {
	stroke: var(--primary);
}

.c-block h6 {
	font-size: 16px;
	line-height: 24px;
	margin: 0 0 4px;
	color: var(--secondary);
	font-weight: 600;
}

.c-block span,
.c-block a {
	font-size: 16px;
	line-height: 24px;
	margin: 0 0 4px;
	color: var(--text-color);
	text-decoration: none;
	display: block;
}

.c-block a:hover {
	color: var(--primary);
}

.c-block {
	display: flex;
	padding: 0 0 24px;
}

.c-block .icon {
	height: 48px;
	width: 48px;
	margin: 0 16px 0 0;
	border-radius: 12px;
	background: #FF80001A;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 48px;
}

.contact-help-block {
	box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
	background: linear-gradient(164deg, rgba(255, 128, 0, 1) 0%, rgba(240, 242, 244, 1) 100%);
	margin: 24px 0 0;
}

.contact-help-block .btn {
	background: var(--secondary);
	color: #FFFFFF;
	padding: 14px 24px;
}

.contact-help-block p {
	color: #FFFFFF;
	font-size: 14px;
	line-height: 20px;
}

.contact-help-block .sub-title {
	color: #FFFFFF;
}


.login-main {
	display: flex;
	height: 100%;
	align-items: center;
	justify-content: center;
	padding: 64px 0;
}

.login-main .container {
	max-width: 1000px;
	margin: 0 auto;
}


.logo-block {
	padding-right: 30px;
}

.logo-block .logo {
	box-shadow: 3px 3px 6.4px 0 rgba(0, 0, 0, 0.25);
	border-radius: 28px;
	padding: 20px;
	text-align: center;
}

.login-form {
	box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	background: #FFFFFF;
	height: 100%;
	padding: 24px;
}

.login-main a {
	color: var(--primary);
	font-size: 14px;
	font-style: normal;
	font-weight: 600;
	line-height: 14px;
	text-decoration: none;
}

.forgot-group {
	text-align: right;
}

.login-main .form-group {
	position: relative;
}

.login-main .btn {
	display: block;
	width: 100%;
}

.password-field {
	margin: 0 0 22px;
}

.login-main a:hover {
	text-decoration: underline;
}

.login-main p {
	font-size: 14px;
	line-height: 16px;
	margin: 0;
}

.login-main .text-block {
	padding: 0 0 24px;
	text-align: center;
}

.login-main .section-title {
	font-size: 30px;
	line-height: 30px;
}

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

.form-check-input[type=checkbox] {
	border-radius: 50%;
	height: 20px;
	width: 20px;
}

.form-group .form-check-label {
	margin: 0;
	text-align: left;
	padding: 6px 0 0 5px;
}

.faq-block .section-title {
	font-size: 24px;
	line-height: 24px;
	color: var(--secondary);
	margin: 0;
	text-align: left;
	font-weight: 700;
	position: relative;
	padding: 0;
	margin: 0 0 16px;
	padding-left: 36px;
}

.faq-block .section-title:after {
	position: absolute;
	left: 0;
	top: 50%;
	transform: translate(0, -50%);
	height: 4px;
	width: 32px;
	background: var(--primary);
	content: "";
	display: block;
	border-radius: 4px;
}

.accordion {
	padding: 24px;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	background: #FFFFFF;
	box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
}

.exam-block {
	padding: 24px;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	background: #FFFFFF;
	box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
}

.accordion-button {
	padding: 16px 0;
	border: none !important;
	box-shadow: none !important;
	font-size: 16px;
	line-height: 16px;
	color: var(--secondary);
	font-weight: 600;
}

.accordion-button:after {
	position: absolute;
	right: 0;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24' fill='none' stroke='currentColor' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='lucide lucide-chevron-down h-4 w-4 shrink-0 transition-transform duration-200'%3E%3Cpath d='m6 9 6 6 6-6'%3E%3C/path%3E%3C/svg%3E") !important;
	height: 16px;
	width: 16px;
	margin: 0;
	background-position: center center !important;
	background-size: 16px !important;
}

.accordion-item {
	border: none;
	padding: 0;
	margin: 0;
	border-radius: 0 !important;
	border-bottom: 1px solid #e5e7eb !important;
}

.accordion-button:hover,
.accordion-button:not(.collapsed) {
	color: var(--primary);
	background: transparent;
}

.accordion .accordion-body {
	padding: 0 0 16px;
}

.accordion .accordion-body p {
	font-size: 14px;
	line-height: 26px;
	color: var(--text-color);
	margin: 0;
}

.faq-main .container {
	max-width: 918px;
}

.course-image {
	position: relative;
	display: block;
}

.course-image img {
	width: 100%;
}

.zoom-btn {
	position: absolute;
	right: 10px;
	top: 10px;
}

.plus-minus-block {
	max-width: 105px;
	display: flex;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
}

.plus-minus-block .minus,
.plus-minus-block .minus,
.plus-minus-block .plus {
	height: 30px;
	width: 30px;
	display: flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	border: 1px solid #e5e7eb;
	padding: 5px;
}

.course-detail .form-select {
	width: 200px;
	margin: 0 0 20px;
}

.course-detail h4 {
	font-weight: 700;
	color: var(--primary);
}

.course-detail .plus-minus-block .form-control {
	font-weight: 600;
	font-size: 16px;
	line-height: 100%;
	color: var(--secondary);
	background: transparent !important;
	border: 1px solid #e5e7eb;
	box-shadow: none !important;
	text-align: center;
	height: 30px;
	border-radius: 0;
}

.add-cart {
	display: flex;
	gap: 20px;
	align-items: center;
	padding: 20px 0;
}

.course-detail .pay-btn svg {
	width: 60px;
	height: auto;
	margin-left: 15px;
}

.course-detail .pay-btn {
	justify-content: center;
	display: flex;
	width: 100%;
}

.wishlist a {
	color: var(--secondary);
	margin-top: 10px;
	display: block;
}

.wishlist svg {
	width: 20px;
}


.course-detail ul {
	display: flex;
	list-style-type: none;
	padding: 20px 0 0;
	margin: 0;
}

.course-detail ul li:first-child {
	padding-right: 10px;
}

.course-detail ul li {
	position: relative;
	padding: 0;
	font-size: 14px;
	line-height: 14px;
	color: var(--secondary);
	font-weight: 700;
}

.course-detail ul li a {
	text-decoration: none;
	display: block;
	color: #6c7c93;
	font-weight: 400;
}

.course-detail-main .nav-tabs {
	border-bottom: 1px solid #6c7c93;
	justify-content: flex-start;
	margin-top: 40px;
}

.course-detail-main .nav-tabs .nav-item {
	padding: 0;
}

.course-detail-main .nav-tabs .nav-link {
	padding: 7px 20px;
	font-size: 16px;
	color: var(--secondary);
	font-weight: 700;
	border-bottom: 3px solid transparent !important;
	margin: 0 0 -2px;
	border-radius: 0 !important;
}

.course-detail-main .nav-tabs .nav-link:hover,
.course-detail-main .nav-tabs .nav-item.show .nav-link,
.course-detail-main .nav-tabs .nav-link.active {
	background: transparent;
	border-color: var(--primary) !important;
}

.otp-code .code {
	display: flex;
	justify-content: center;
	padding: 0 0 40px;
	justify-content: space-between;
}

.otp-code .code .form-control {
	border: none;
	border-radius: 8px;
	text-align: center;
	font-size: 20px;
	line-height: 20px;
	width: 80px;
}

.otp-code .section-title {
	padding: 0 0 12px;
}

.otp-code p {
	font-size: 16px;
	font-weight: 400;
	line-height: 22.72px;
	letter-spacing: 0.02em;
	color: #000000;
	margin: 0 0 12px;
}

.enter-email {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 30px 0;
}

.btn.disabled,
.btn:disabled,
fieldset:disabled .btn {
	color: #fff;
	pointer-events: none;
	background-color: #e9ab6c;
}

.course-hero .course-img img {
	max-width: 500px;
	margin: 0 auto;
	width: 100%;
	/* display: block; */
}

.about-course-section .sub-title {
	font-size: 24px;
	line-height: 24px;
}

.about-course-section .choose-block p {
	font-size: 18px;
	line-height: 28px;
}

.exam-block .section-title {
	font-size: 24px;
	line-height: 24px;
	color: var(--secondary);
	margin: 0;
	text-align: left;
	font-weight: 700;
	position: relative;
	padding: 0;
	margin: 0 0 16px;
}

.exam-block {
	padding: 24px;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	background: #FFFFFF;
	box-shadow: 0 1px 2px 0 rgb(0 0 0 / .05);
}

.exam-block .form-check {
	max-width: 25%;
	flex: 0 0 25%;
}

.exam-main .choose-block .icon {
	margin: 0 auto 20px;
}

.section-title span.success {
	color: green;
}