@use "sass:math";

:root {
	--theme-color: #0D5EF4;
	--theme-color2: #F20F10;
	--title-color: #0F2239;
	--body-color: #4D5765;
	--smoke-color: #F3F7FB;
	--black-color: #000000;
	--white-color: #ffffff;
	--light-color: #72849B;
	--yellow-color: #FFB539;
	--success-color: #28a745;
	--error-color: #dc3545;
	--border-color: #ecf1f9;
	--title-font: 'Jost', sans-serif;
	--body-font: 'Roboto', sans-serif;
	--icon-font: "Font Awesome 6 Pro";
	--main-container: 1380px;
	--container-gutters: 24px;
	--section-space: 120px;
	--section-space-mobile: 80px;
	--section-title-space: 70px;
	--ripple-ani-duration: 5s
}

 

 
.th-header {
	position: relative;
	z-index: 41
}

.th-header .icon-btn {
	--btn-size: 45px;
	line-height: 43px;
	border: 1px solid #d0dbe9;
	-webkit-transition: 0.4s;
	transition: 0.4s
}

.th-header .icon-btn:hover {
	border-color: var(--theme-color)
}

.th-header .th-btn {
	padding: 19px 29px
}

.sticky-wrapper {
	-webkit-transition: 0.4s ease-in-out;
	transition: 0.4s ease-in-out
}

.sticky-wrapper.sticky {
	position: fixed;
	top: 0;
	right: 0;
	left: 0;
	background-color: var(--white-color);
	box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.07);
	-webkit-animation: stickyAni 0.4s ease-in-out;
	animation: stickyAni 0.4s ease-in-out
}

@-webkit-keyframes stickyAni {
	0% {
		-webkit-transform: translate3d(0, -40px, 0) scaleY(0.8);
		transform: translate3d(0, -40px, 0) scaleY(0.8);
		opacity: 0.7
	}

	100% {
		-webkit-transform: translate3d(0, 0, 0) scaleY(1);
		transform: translate3d(0, 0, 0) scaleY(1);
		opacity: 1
	}
}

@keyframes stickyAni {
	0% {
		-webkit-transform: translate3d(0, -40px, 0) scaleY(0.8);
		transform: translate3d(0, -40px, 0) scaleY(0.8);
		opacity: 0.7
	}

	100% {
		-webkit-transform: translate3d(0, 0, 0) scaleY(1);
		transform: translate3d(0, 0, 0) scaleY(1);
		opacity: 1
	}
}

 

.category-menu ul {
	padding: 0;
	margin-bottom: 0
}

.category-menu li {
	list-style: none;
	margin-bottom: 6px
}

.category-menu li:last-child {
	margin-bottom: 0
}

.category-menu a {
	text-transform: capitalize;
	color: var(--title-color);
	position: relative;
	padding-left: 23px
}

.category-menu a:before {
	content: "\f07c";
	position: absolute;
	top: 4px;
	left: 0;
	font-family: var(--icon-font);
	width: 11px;
	height: 11px;
	text-align: center;
	border-radius: 50%;
	display: inline-block;
	font-size: 0.9em;
	line-height: 1;
	color: var(--theme-color);
	font-weight: 400
}

.category-menu a:hover {
	color: var(--theme-color)
}

.category-menu-wrap {
	position: relative;
	height: 100%;
	padding: 0;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	border: 1px solid #D0DBE9;
	border-radius: 5px
}

.category-menu-wrap:hover .category-menu {
	visibility: visible;
	opacity: 1;
	margin-top: 0;
	z-index: 9
}

.category-menu-wrap .search-form {
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex
}

.category-menu-wrap .search-form input {
	background: transparent;
	border: 0;
	padding-right: 10px;
	padding-left: 15px;
	height: 48px
}

.category-menu-wrap .search-form input:hover,
.category-menu-wrap .search-form input:focus,
.category-menu-wrap .search-form input:active {
	border: 0
}

.category-menu-wrap .search-form input::-webkit-input-placeholder {
	color: #9FAAB7
}

.category-menu-wrap .search-form input::-moz-placeholder {
	color: #9FAAB7
}

.category-menu-wrap .search-form input:-ms-input-placeholder {
	color: #9FAAB7
}

.category-menu-wrap .search-form input::-ms-input-placeholder {
	color: #9FAAB7
}

.category-menu-wrap .search-form input::placeholder {
	color: #9FAAB7
}

.category-menu-wrap .search-form button {
	border: none;
	width: auto;
	height: 48px;
	line-height: 48px;
	background-color: transparent;
	color: var(--title-color);
	padding-right: 15px;
	display: inline-block;
	border-radius: 0
}



.simple-icon {
	border: none;
	background-color: transparent;
	padding: 0;
	color: var(--body-color)
}

.simple-icon:hover {
	color: var(--theme-color)
}

.header-button {
	height: 100%;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center;
	gap: 15px;
	margin-left: 15px
}

.header-button .icon-btn {
	position: relative
}

.header-links ul {
	margin: 0;
	padding: 0;
	list-style-type: none
}

.header-links li {
	display: inline-block;
	position: relative;
	font-size: 16px;
	font-weight: 400
}

.header-links li:not(:last-child) {
	padding: 0 20px 0 0;
	margin: 0 17px 0 0
}

.header-links li:not(:last-child):before {
	content: "";
	position: absolute;
	right: 0;
	top: 50%;
	background-color: rgba(255, 255, 255, 0.2);
	width: 1px;
	height: 16px;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%)
}

.header-links li>i {
	margin-right: 10px
}

.header-links li,
.header-links span,
.header-links p,
.header-links a {
	font-family: var(--body-font);
	color: var(--body-color)
}

.header-links i {
	color: var(--body-color)
}

.header-links b,
.header-links strong {
	font-weight: 600
}

.header-social .social-title {
	font-weight: 400;
	font-size: 16px;
	display: inline-block;
	margin: 0 10px 0 0
}

.header-social a {
	font-size: 14px;
	display: inline-block;
	color: var(--body-color);
	margin: 0 15px 0 0
}

.header-social a:last-child {
	margin-right: 0
}

.header-social a:hover {
	color: var(--theme-color)
}

.header-logo {
	padding-top: 20px;
	padding-bottom: 20px
}

.header-notice {
	margin-bottom: 0;
	display: inline-block
}

.counter-list {
	padding: 0;
	margin: 0;
	display: -webkit-inline-box;
	display: -webkit-inline-flex;
	display: -ms-inline-flexbox;
	display: inline-flex;
	gap: 18px;
	background-color: var(--theme-color2);
	padding: 2px 20px;
	border-radius: 999px;
	margin-left: 15px;
	color: var(--white-color)
}

.counter-list li {
	display: -webkit-inline-box;
	display: -webkit-inline-flex;
	display: -ms-inline-flexbox;
	display: inline-flex;
	gap: 4px;
	position: relative;
	color: var(--white-color)
}

.counter-list li:after {
	content: ":";
	position: absolute;
	top: 50%;
	right: -11.5px;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	color: var(--white-color);
	font-weight: 600
}

.counter-list li:last-child::after {
	display: none
}

.counter-list .count-number,
.counter-list .count-name {
	color: var(--white-color);
	font-weight: 500
}

.dropdown-link {
	position: relative;
	display: inline-block
}

.dropdown-link>a {
	color: var(--white-color)
}

.dropdown-link>a i {
	margin-right: 3px;
	-webkit-transition: 0.4s;
	transition: 0.4s
}

.dropdown-link>a:hover i {
	color: var(--white-color) !important
}

.dropdown-toggle::after {
	content: "\f107";
	border: none;
	font-family: var(--icon-font);
	vertical-align: middle;
	font-weight: 400;
	margin-left: 6px
}

.dropdown-menu {
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	min-width: auto;
	top: calc(100% + 10px) !important;
	left: 50% !important;
	-webkit-transform: translateX(-50%) !important;
	-ms-transform: translateX(-50%) !important;
	transform: translateX(-50%) !important;
	padding: 8px 20px !important;
	border-color: var(--border-color)
}

.dropdown-menu li {
	padding-right: 0;
	margin-right: 0
}

.dropdown-menu li:after {
	display: none
}

.dropdown-menu li a {
	display: block
}

.dropdown-menu a {
	color: var(--title-color) !important
}

.dropdown-menu a:hover {
	color: var(--theme-color) !important
}

.dropdown-menu:before {
	content: "";
	position: absolute;
	left: 50%;
	top: -7px;
	width: 14px;
	height: 14px;
	margin-left: -7px;
	background-color: var(--white-color);
	z-index: -1;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	border-top: 1px solid var(--border-color);
	border-left: 1px solid var(--border-color)
}

.header-layout-default .header-top {
	--body-color: #fff;
	background-color: var(--theme-color);
	padding: 9px 88px 9px 300px;
	position: relative;
	z-index: 3
}

@media (min-width: 1922px) {
	.header-layout-default .header-top {
		padding: 9px 188px 9px 400px
	}
}

@media (max-width: 1600px) {
	.header-layout-default .header-top {
		padding: 9px 30px 9px 265px
	}
}

@media (max-width: 1299px) {
	.header-layout-default .header-top {
		padding: 9px 30px
	}
}

.header-layout-default .header-top a:hover {
	color: var(--title-color)
}

.header-layout-default .header-top .header-links a:hover {
	color: var(--theme-color)
}

.header-layout-default .header-top .header-links.header-right li:first-child {
	padding-right: 60px
}

@media (min-width: 1922px) {
	.header-layout-default .header-top .header-links.header-right li:first-child {
		padding-right: 0
	}
}

@media (max-width: 1355px) {
	.header-layout-default .header-top .header-links.header-right li:first-child {
		padding-right: 0px
	}
}

.header-layout-default .header-top .header-links.header-right li:not(:last-child):before {
	display: none
}

.header-layout-default .header-top .header-links.header-right li a i {
	-webkit-transition: 0.4s;
	transition: 0.4s
}

.header-layout-default .header-top .header-links.header-right li a:hover {
	color: var(--white-color);
	opacity: 0.6
}

.header-layout-default .header-top .header-links.header-right li a:hover i {
	color: var(--theme-color)
}

@media (max-width: 991px) {
	.header-layout-default .header-top .header-links.header-right li {
		display: none
	}

	.header-layout-default .header-top .header-links.header-right li:first-child {
		display: block;
		margin: 0;
		padding: 0
	}
}

.header-layout-default .header-top:after {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: calc(100% - 267px);
	border-radius: 0 0 50px 0;
	background: var(--title-color);
	z-index: -1
}

@media (min-width: 1922px) {
	.header-layout-default .header-top:after {
		width: calc(100% - 757px)
	}
}

@media (max-width: 1600px) {
	.header-layout-default .header-top:after {
		width: calc(100% - 207px)
	}
}

@media (max-width: 1500px) {
	.header-layout-default .header-top:after {
		width: calc(100% - 205px)
	}
}

@media (max-width: 1399px) {
	.header-layout-default .header-top:after {
		width: calc(100% - 220px)
	}
}

@media (max-width: 1355px) {
	.header-layout-default .header-top:after {
		width: 100%;
		border-radius: 0
	}
}

@media (max-width: 991px) {
	.header-layout-default .header-top:after {
		width: 100%;
		border-radius: 0
	}
}

.header-layout-default .menu-area {
	background-color: var(--white-color);
	position: relative;
	z-index: 2;
	padding: 0 88px 0 30px
}

@media (min-width: 1922px) {
	.header-layout-default .menu-area {
		padding: 0 188px 0 130px
	}
}

@media (max-width: 1600px) {
	.header-layout-default .menu-area {
		padding: 0 30px 0 10px
	}
}

@media (max-width: 575px) {
	.header-layout-default .menu-area {
		padding: 0
	}
}

.header-layout-default .menu-area .header-logo {
	margin-top: -29px
}

@media (max-width: 1299px) {
	.header-layout-default .menu-area .header-logo {
		margin-top: 0
	}
}

.header-layout-default .menu-area .main-menu {
	margin-left: 60px
}

@media (max-width: 1600px) {
	.header-layout-default .menu-area .main-menu {

		margin-left: 50px
	}
}

.header-layout-default .menu-area .logo-bg {
	position: absolute;
	height: 100%;
	width: 270px;
	border-radius: 0 0px 0 0;
	background: var(--theme-color);
	bottom: 0;
	left: 0;
	z-index: -1
}

@media (min-width: 1922px) {
	.header-layout-default .menu-area .logo-bg {
		width: 370px
	}
}

@media (max-width: 1600px) {
	.header-layout-default .menu-area .logo-bg {
		width: 240px
	}
}

@media (max-width: 575px) {
	.header-layout-default .menu-area .logo-bg {
		width: 220px
	}
}

.header-layout-default .main-menu>ul>li>a {
	padding: 31.5px 0
}

.header-layout-default .th-btn {
	padding: 18px 29px
}

.header-layout-default .header-button {
	margin-left: 0
}

@media (max-width: 1299px) {
	.header-layout-default .header-button .icon-btn {
		display: none
	}
}

@media (min-width: 1921px) and (max-width: 1963px) {
	.header-layout-default .menu-expand {
		display: none
	}
}

@media (max-width: 1763px) {
	.header-layout-default .menu-expand {
		display: none
	}
}

@media (max-width: 1510px) {
	.header-layout-default .category-menu-wrap {
		display: none
	}
}

@media (max-width: 1500px) {
	.header-layout-default .category-menu-wrap {
		display: none
	}
}

.header-layout-default .sticky-wrapper.sticky .menu-area {
	background: var(--white-color)
}

.header-layout-default .sticky-wrapper.sticky .menu-area .header-logo {
	margin-top: 0
}

.header-layout-default .sticky-wrapper.sticky .menu-area .logo-bg {
	border-radius: 0
}

.header-layout-default .logo-bg-half {
	position: absolute;
	height: 29px;
	width: 270px;
	border-radius: 0 50px 0 0;
	background: var(--theme-color);
	top: 16px;
	left: 0;
	z-index: 4
}

@media (min-width: 1922px) {
	.header-layout-default .logo-bg-half {
		width: 370px
	}
}

@media (max-width: 1600px) {
	.header-layout-default .logo-bg-half {
		width: 240px
	}
}

@media (max-width: 1299px) {
	.header-layout-default .logo-bg-half {
		display: none
	}
}

.admin-bar .header-layout-default .header-top:after {
	width: calc(100% - 227px)
}

@media (min-width: 1922px) {
	.admin-bar .header-layout-default .header-top:after {
		width: calc(100% - 327px)
	}
}

@media (max-width: 1600px) {
	.admin-bar .header-layout-default .header-top:after {
		width: calc(100% - 177px)
	}
}

@media (max-width: 1500px) {
	.admin-bar .header-layout-default .header-top:after {
		width: calc(100% - 175px)
	}
}

@media (max-width: 1399px) {
	.admin-bar .header-layout-default .header-top:after {
		width: calc(100% - 180px)
	}
}

.header-layout1 .header-top {
	--body-color: #fff;
	background-color: var(--title-color);
	padding: 9px 0;
	position: relative;
	z-index: 3
}

.header-layout1 .header-top a:hover {
	color: var(--title-color)
}

.header-layout1 .header-top .header-links.header-right li:first-child {
	padding-right: 60px
}

@media (min-width: 1921px) and (max-width: 2520px) {
	.header-layout1 .header-top .header-links.header-right li:first-child {
		padding-right: 0
	}
}

@media (min-width: 1601px) and (max-width: 1870px) {
	.header-layout1 .header-top .header-links.header-right li:first-child {
		padding-right: 0
	}
}

@media (max-width: 1600px) {
	.header-layout1 .header-top .header-links.header-right li:first-child {
		padding-right: 60px
	}
}

@media (min-width: 1501px) and (max-width: 1550px) {
	.header-layout1 .header-top .header-links.header-right li:first-child {
		padding-right: 0
	}
}

@media (min-width: 1055px) and (max-width: 1199px) {
	.header-layout1 .header-top .header-links.header-right li:first-child {
		padding-right: 0
	}
}

.header-layout1 .header-top .header-links.header-right li:not(:last-child):before {
	display: none
}

.header-layout1 .header-top .header-links.header-right li a i {
	-webkit-transition: 0.4s;
	transition: 0.4s
}

.header-layout1 .header-top .header-links.header-right li a:hover {
	color: var(--theme-color2)
}

.header-layout1 .header-top .header-links.header-right li a:hover i {
	color: var(--title-color)
}

@media (max-width: 991px) {
	.header-layout1 .header-top .header-links.header-right li {
		display: none
	}

	.header-layout1 .header-top .header-links.header-right li:first-child {
		display: block;
		margin: 0;
		padding: 0
	}
}

.header-layout1 .header-top:after {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
	width: calc(100% - 437px);
	border-radius: 0 0 50px 0;
	background: #273c66;
	z-index: -1
}

@media (min-width: 1922px) {
	.header-layout1 .header-top:after {
		width: calc(100% - 757px)
	}
}

@media (min-width: 1921px) and (max-width: 2520px) {
	.header-layout1 .header-top:after {
		width: 100%;
		border-radius: 0
	}
}

@media (min-width: 1601px) and (max-width: 1870px) {
	.header-layout1 .header-top:after {
		width: 100%;
		border-radius: 0
	}
}

@media (max-width: 1600px) {
	.header-layout1 .header-top:after {
		width: calc(100% - 277px);
		border-radius: 0 0 50px 0
	}
}

@media (min-width: 1501px) and (max-width: 1550px) {
	.header-layout1 .header-top:after {
		width: 100%;
		border-radius: 0
	}
}

@media (max-width: 1500px) {
	.header-layout1 .header-top:after {
		width: calc(100% - 205px)
	}
}

@media (max-width: 1399px) {
	.header-layout1 .header-top:after {
		width: calc(100% - 220px)
	}
}

@media (min-width: 1055px) and (max-width: 1199px) {
	.header-layout1 .header-top:after {
		width: 100%;
		border-radius: 0
	}
}

@media (max-width: 991px) {
	.header-layout1 .header-top:after {
		width: 100%;
		border-radius: 0
	}
}

.header-layout1 .menu-area {
	background-color: #273c66;
	position: relative;
	z-index: 0
}

.header-layout1 .menu-area:after {
	content: '';
	position: absolute;
	right: 0;
	top: 0;
	background: var(--white-color);
	height: 100%;
	width: calc(100% - 220px);
	border-radius: 80px 0 0 0;
	z-index: -1
}

@media (min-width: 1922px) {
	.header-layout1 .menu-area:after {
		width: calc(100% - 500px)
	}
}

@media (min-width: 1921px) and (max-width: 2520px) {
	.header-layout1 .menu-area:after {
		width: 100%
	}
}

@media (min-width: 1601px) and (max-width: 1870px) {
	.header-layout1 .menu-area:after {
		width: 100%
	}
}

@media (max-width: 1600px) {
	.header-layout1 .menu-area:after {
		width: calc(100% - 60px)
	}
}

@media (min-width: 1501px) and (max-width: 1550px) {
	.header-layout1 .menu-area:after {
		width: 100%
	}
}

@media (max-width: 1500px) {
	.header-layout1 .menu-area:after {
		width: 100%
	}
}

@media (max-width: 991px) {
	.header-layout1 .menu-area:after {
		border-radius: 0px 0 0 0
	}
}

.header-layout1 .th-btn {
	padding: 18px 29px
}

@media (max-width: 1299px) {
	.header-layout1 .header-button .icon-btn {
		display: none
	}
}

.header-layout1 .sticky-wrapper.sticky .menu-area {
	background: var(--white-color)
}

.header-layout1 .sticky-wrapper.sticky .menu-area:after {
	display: none
}

.admin-bar .header-layout1 .header-top:after {
	width: calc(100% - 397px)
}

@media (min-width: 1922px) {
	.admin-bar .header-layout1 .header-top:after {
		width: calc(100% - 727px)
	}
}

@media (max-width: 1600px) {
	.admin-bar .header-layout1 .header-top:after {
		width: calc(100% - 237px)
	}
}

@media (max-width: 1500px) {
	.admin-bar .header-layout1 .header-top:after {
		width: calc(100% - 165px)
	}
}

@media (max-width: 1399px) {
	.admin-bar .header-layout1 .header-top:after {
		width: calc(100% - 190px)
	}
}

@media (max-width: 767px) {
	.header-search {
		margin: 0 0 20px 0
	}
}

.unittest-header .header-button {
	margin-left: 0;
	padding-left: 10px !important
}

.unittest-header .header-button:before {
	display: none
}

@media (max-width: 1399px) {
	.unittest-header .main-menu>ul>li {
		margin: 0 10px
	}
}

.header-layout3 {
	position: relative
}

.header-layout3 .logo-bg {
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: -1;
	height: 100%;
	width: 435px
}

@media (min-width: 1922px) {
	.header-layout3 .logo-bg {
		width: 720px;
		background-position: 0 -18px
	}
}

@media (min-width: 2400px) and (max-width: 2522px) {
	.header-layout3 .logo-bg {
		width: 660px;
		background-position: right -12px
	}
}

@media (min-width: 2380px) and (max-width: 2399px) {
	.header-layout3 .logo-bg {
		width: 640px;
		background-position: right -8px
	}
}

@media (min-width: 2340px) and (max-width: 2379px) {
	.header-layout3 .logo-bg {
		width: 600px;
		background-position: right -8px
	}
}

@media (min-width: 2300px) and (max-width: 2339px) {
	.header-layout3 .logo-bg {
		width: 540px;
		background-position: right -8px
	}
}

@media (min-width: 2280px) and (max-width: 2299px) {
	.header-layout3 .logo-bg {
		background-position: -122px -16px
	}
}

@media (min-width: 2230px) and (max-width: 2279px) {
	.header-layout3 .logo-bg {
		background-position: -150px -18px
	}
}

@media (min-width: 2150px) and (max-width: 2229px) {
	.header-layout3 .logo-bg {
		background-position: -190px -18px
	}
}

@media (min-width: 2090px) and (max-width: 2149px) {
	.header-layout3 .logo-bg {
		background-position: -220px -18px
	}
}

@media (min-width: 2000px) and (max-width: 2089px) {
	.header-layout3 .logo-bg {
		background-position: -220px -18px
	}
}

@media (min-width: 1970px) and (max-width: 1999px) {
	.header-layout3 .logo-bg {
		background-position: -120px -6px;
		width: 500px
	}
}

@media (min-width: 1940px) and (max-width: 1969px) {
	.header-layout3 .logo-bg {
		background-position: -180px -10px;
		width: 600px
	}
}

@media (min-width: 1922px) and (max-width: 1939px) {
	.header-layout3 .logo-bg {
		background-position: -210px -10px;
		width: 600px
	}
}

@media (min-width: 1800px) and (max-width: 1879px) {
	.header-layout3 .logo-bg {
		background: var(--theme-color);
		width: 400px
	}
}

@media (min-width: 1780px) and (max-width: 1799px) {
	.header-layout3 .logo-bg {
		background-position: -50px 0px
	}
}

@media (min-width: 1720px) and (max-width: 1779px) {
	.header-layout3 .logo-bg {
		background-position: -80px 0px
	}
}

@media (min-width: 1700px) and (max-width: 1719px) {
	.header-layout3 .logo-bg {
		background-position: -100px 0px
	}
}

@media (min-width: 1601px) and (max-width: 1699px) {
	.header-layout3 .logo-bg {
		background-position: -100px 0px
	}
}

@media (max-width: 1600px) {
	.header-layout3 .logo-bg {
		width: 340px;
		background-position: right
	}
}

@media (min-width: 1550px) and (max-width: 1599px) {
	.header-layout3 .logo-bg {
		width: 410px
	}
}

@media (min-width: 1501px) and (max-width: 1549px) {
	.header-layout3 .logo-bg {
		width: 400px
	}
}

@media (max-width: 1500px) {
	.header-layout3 .logo-bg {
		width: 272px
	}
}

@media (max-width: 1399px) {
	.header-layout3 .logo-bg {
		width: 290px
	}
}

@media (max-width: 1299px) {
	.header-layout3 .logo-bg {
		width: 280px
	}
}

@media (min-width: 1270px) and (max-width: 1299px) {
	.header-layout3 .logo-bg {
		width: 300px
	}
}

@media (min-width: 1100px) and (max-width: 1199px) {
	.header-layout3 .logo-bg {
		width: 360px
	}
}

@media (max-width: 991px) {
	.header-layout3 .logo-bg {
		width: 255px
	}
}

@media (max-width: 767px) {
	.header-layout3 .logo-bg {
		width: 260px
	}
}

@media (max-width: 575px) {
	.header-layout3 .logo-bg {
		width: 230px
	}
}

.header-layout3 .category-menu-wrap {
	margin-left: 30px
}

@media (min-width: 1601px) and (max-width: 1638px) {
	.header-layout3 .category-menu-wrap {
		display: none
	}
}

@media (max-width: 1600px) {
	.header-layout3 .category-menu-wrap {
		display: none
	}
}

.header-layout3 .menu-area {
	position: relative;
	padding-top: 15px;
	margin: 0 86px
}

@media (max-width: 1500px) {
	.header-layout3 .menu-area {
		margin: 0
	}
}

.header-layout3 .menu-area:after {
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 15px;
	background: var(--theme-color2);
	border-radius: 0 0 30px 30px
}

@media (min-width: 1922px) {
	.header-layout3 .menu-area:after {
		left: -110px;
		width: calc(100% + 110px)
	}
}

@media (min-width: 2460px) and (max-width: 2523px) {
	.header-layout3 .menu-area:after {
		left: -100px;
		width: calc(100% + 100px)
	}
}

@media (min-width: 2300px) and (max-width: 2459px) {
	.header-layout3 .menu-area:after {
		left: -70px;
		width: calc(100% + 70px)
	}
}

@media (min-width: 1922px) and (max-width: 2089px) {
	.header-layout3 .menu-area:after {
		left: -50px;
		width: calc(100% + 50px)
	}
}

@media (min-width: 1922px) {
	.header-layout3 .menu-area {
		margin: 0
	}
}

.header-layout3 .main-menu>ul>li>a {
	padding: 34px 0
}

@media (max-width: 1399px) {
	.header-layout3 .main-menu a {
		font-size: 14px
	}
}

@media (max-width: 1299px) {

	.header-layout3 .header-button .icon-btn:nth-child(1),
	.header-layout3 .header-button .icon-btn:nth-child(2) {
		display: none
	}
}

@media (min-width: 1501px) and (max-width: 1599px) {

	.header-layout3 .header-button .icon-btn:nth-child(1),
	.header-layout3 .header-button .icon-btn:nth-child(2) {
		display: none
	}
}

.header-layout3 .dropdown-link>a {
	color: var(--title-color)
}

@media (max-width: 1299px) {
	.header-layout3 .dropdown-link>a .icon-btn {
		display: inline-block
	}
}

.header-layout3 .dropdown-link>a:hover {
	color: var(--theme-color)
}

.header-layout3 .dropdown-link>a:hover .icon-btn {
	background-color: var(--theme-color);
	color: var(--white-color)
}

@media (max-width: 575px) {
	.header-layout3 .th-menu-toggle {
		margin: 15px 0
	}
}

@media (max-width: 375px) {
	.header-layout3 .header-social a {
		margin: 0 10px 0 0
	}

	.header-layout3 .header-links li {
		font-size: 14px
	}
}

@media (max-width: 1600px) {
	.header-layout4 .menu-expand {
		display: none
	}
}

@media (max-width: 1500px) {
	.header-layout4 .category-menu-wrap {
		display: none
	}
}

@media (max-width: 1299px) {
	.header-layout4 .header-button .icon-btn {
		display: none
	}
}

.header-layout4 .dropdown-link>a {
	color: var(--title-color)
}

@media (max-width: 1299px) {
	.header-layout4 .dropdown-link>a .icon-btn {
		display: inline-block
	}
}

.header-layout4 .dropdown-link>a:hover {
	color: var(--theme-color)
}

.header-layout4 .dropdown-link>a:hover .icon-btn {
	background-color: var(--theme-color);
	color: var(--white-color)
}

.header-layout5 .header-link {
	display: inline-block;
	color: var(--white-color);
	margin-right: 40px;
	-webkit-transition: 0.4s;
	transition: 0.4s
}

.header-layout5 .header-link:last-child {
	margin-right: 0
}

.header-layout5 .header-link:hover {
	color: var(--theme-color)
}

.header-layout5 .header-link .icon-btn {
	margin-right: 10px;
	font-size: 14px;
	border: none
}

.header-layout5 .top-area {
	background-color: var(--title-color)
}

.header-layout5 .header-top {
	padding: 12px 0;
	--body-color: #fff;
	border-bottom: 1px solid #202c3c
}

.header-layout5 .header-top a,
.header-layout5 .header-top li,
.header-layout5 .header-top p,
.header-layout5 .header-top span,
.header-layout5 .header-top i {
	color: var(--white-color)
}

.header-layout5 .header-top a:hover {
	color: var(--theme-color)
}

.header-layout5 .menu-top {
	padding: 20px 0
}

.header-layout5 .menu-top .icon-btn {
	background-color: var(--theme-color);
	color: var(--white-color)
}

.header-layout5 .header-link {
	color: var(--white-color);
	padding-right: 30px;
	margin-right: 30px;
	border-right: 1px solid #202c3c
}

.header-layout5 .header-link:last-child {
	padding-right: 0;
	margin-right: 0;
	border-right: none
}

.header-layout5 .header-link:hover {
	color: var(--theme-color)
}

.header-layout5 .th-social a {
	background-color: #0f2239;
	border: 1px solid #4d5765;
	color: var(--white-color)
}

.header-layout5 .th-social a:hover {
	background-color: var(--theme-color);
	color: var(--white-color);
	border-color: var(--theme-color)
}

.header-layout5 .simple-icon {
	color: var(--white-color)
}

.header-layout5 .dropdown-menu {
	--body-color: #74787c
}

.header-layout5 .logo-shape {
	display: inline-block;
	height: 100%;
	width: 34%;
	position: absolute;
	top: 0;
	left: 0;
	background: var(--white-color);
	background-size: auto;
	background-repeat: repeat;
	-webkit-clip-path: polygon(0 0, calc(100% - 100px) 0%, 100% 100%, 0% 100%);
	clip-path: polygon(0 0, calc(100% - 100px) 0%, 100% 100%, 0% 100%);
	z-index: -1
}

.header-layout5 .icon-style2 {
	color: var(--title-color)
}

.header-layout5 .menu-area {
	position: relative;
	background-color: var(--theme-color);
	z-index: 2
}

.header-layout5 .menu-area .container {
	--main-container: 1562px;
	margin-left: auto;
	margin-right: 66px
}

@media (min-width: 1922px) {
	.header-layout5 .menu-area .container {
		margin-right: auto
	}
}

@media (max-width: 1399px) {
	.header-layout5 .menu-area .container {
		margin-right: auto
	}
}

.header-layout5 .main-menu>ul>li {
	margin: 0 18px
}

.header-layout5 .main-menu>ul>li>a {
	color: var(--white-color);
	padding: 39px 0
}

.header-layout5 .th-menu-toggle {
	margin: 20px 0;
	background-color: var(--title-color)
}

.header-layout5 .header-button {
	margin-left: 130px
}

@media (max-width: 1700px) {
	.header-layout5 .logo-shape {
		width: 22%
	}
}

@media (max-width: 1299px) {
	.header-layout5 .header-button {
		margin-left: 60px
	}
}

@media (max-width: 1300px) {
	.header-layout5 .header-button {
		margin-left: 20px
	}

	.header-layout5 .logo-shape {
		width: 26%
	}
}

@media (max-width: 1199px) {
	.header-layout5 .header-link:nth-child(2) {
		padding-right: 0;
		margin-right: 0;
		border-right: none
	}

	.header-layout5 .logo-shape {
		width: 32%
	}
}

@media (max-width: 991px) {
	.header-layout5 .logo-shape {
		width: 60%
	}

	.header-layout5 .header-link {
		padding-right: 0;
		margin-right: 0;
		border-right: none
	}
}

@media (max-width: 767px) {
	.header-notice {
		text-align: center;
		font-size: 14px
	}

	.header-layout5 .menu-top {
		padding: 12px 0
	}
}

@media (max-width: 575px) {
	.header-layout5 .logo-shape {
		width: 280px
	}
}

.header-layout6 {
	--main-container: 1440px
}

.header-layout6 .dropdown-link {
	position: relative
}

.header-layout6 .dropdown-link>a {
	color: var(--white-color)
}

.header-layout6 .dropdown-toggle::after {
	content: "\f107";
	border: none;
	font-family: var(--icon-font);
	vertical-align: middle;
	font-weight: 400;
	margin-left: 6px
}

.header-layout6 .dropdown-menu {
	width: -webkit-fit-content;
	width: -moz-fit-content;
	width: fit-content;
	min-width: auto;
	top: calc(100% + 10px) !important;
	left: 50% !important;
	-webkit-transform: translateX(-50%) !important;
	-ms-transform: translateX(-50%) !important;
	transform: translateX(-50%) !important;
	padding: 8px 20px !important;
	text-align: center;
	border-color: var(--border-color)
}

.header-layout6 .dropdown-menu li {
	padding-right: 0;
	margin-right: 0
}

.header-layout6 .dropdown-menu li:after {
	display: none
}

.header-layout6 .dropdown-menu li a {
	display: block
}

.header-layout6 .dropdown-menu a {
	color: var(--body-color)
}

.header-layout6 .dropdown-menu a:hover {
	color: var(--theme-color) !important
}

.header-layout6 .dropdown-menu:before {
	content: "";
	position: absolute;
	left: 50%;
	top: -7px;
	width: 14px;
	height: 14px;
	margin-left: -7px;
	background-color: var(--white-color);
	z-index: -1;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	border-top: 1px solid var(--border-color);
	border-left: 1px solid var(--border-color)
}

.header-layout6 .simple-icon {
	border: none;
	background-color: transparent
}

.header-layout6 .simple-icon.style2 {
	font-size: 28px
}

.header-layout6 .simple-icon:hover {
	color: var(--theme-color)
}

.header-layout6 .header-top {
	background-color: var(--theme-color);
	padding: 14px 0;
	--body-color: #fff
}

.header-layout6 .header-top a,
.header-layout6 .header-top li,
.header-layout6 .header-top p,
.header-layout6 .header-top span,
.header-layout6 .header-top i {
	color: var(--body-color)
}

.header-layout6 .header-top a:hover {
	color: var(--white-color)
}

.header-layout6 .header-top li:before {
	background-color: #5792ff
}

.header-layout6 .simple-icon {
	color: var(--white-color)
}

.header-layout6 .dropdown-menu {
	--body-color: #74787c
}

.header-layout6 .logo-shape {
	display: inline-block;
	height: 100%;
	width: 27.7%;
	position: absolute;
	top: 0;
	left: 0;
	background-color: var(--white-color);
	-webkit-clip-path: polygon(0 0, 100% 0%, calc(100% - 50px) 100%, 0% 100%);
	clip-path: polygon(0 0, 100% 0%, calc(100% - 50px) 100%, 0% 100%);
	z-index: -1
}

.header-layout6 .menu-area {
	position: relative;
	background-color: #050f2d;
	background-size: auto;
	background-repeat: repeat;
	z-index: 2
}

.header-layout6 .main-menu>ul>li {
	margin: 0 18px
}

.header-layout6 .main-menu>ul>li>a {
	color: var(--white-color);
	padding: 41.5px 0
}

.header-layout6 .th-menu-toggle {
	margin: 20px 0
}

.header-layout6 .header-button {
	margin-left: 100px
}

.header-layout6 .icon-btn:hover {
	border-color: var(--theme-color)
}

@media (min-width: 1922px) {
	.header-layout6 {
		--main-container: 1440px
	}

	.header-layout6 .logo-shape {
		width: 34%
	}
}

@media (max-width: 1700px) {
	.header-layout6 .logo-shape {
		width: 25%
	}
}

@media (max-width: 1399px) {
	.header-layout6 .container {
		margin-left: auto;
		margin-right: auto
	}

	.header-layout6 .header-button {
		margin-left: 60px
	}

	.header-layout6 .logo-shape {
		width: 22%
	}
}

@media (max-width: 1300px) {
	.header-layout6 .logo-shape {
		width: 26%
	}

	.header-layout6 .header-button .th-btn {
		display: none
	}
}

@media (max-width: 1199px) {
	.header-layout6 .logo-shape {
		width: 300px
	}
}

@media (max-width: 991px) {
	.header-layout6 .logo-shape {
		width: 60%
	}
}

@media (max-width: 767px) {
	.header-layout6 .header-top {
		padding: 8px 0
	}
}

@media (max-width: 375px) {
	.header-layout6 .logo-shape {
		width: 75%
	}
}

.header-layout7 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	--main-container: 1920px
}

.header-layout7 .sticky {
	background-color: var(--title-color)
}

.header-layout7 .container {
	padding-left: 0;
	padding-right: 0
}

.header-layout7 .header-logo {
	background-color: rgba(255, 255, 255, 0.1);
	padding: 15px 100px 15px 50px;
	border-right: 5px solid var(--theme-color);
	height: 100%;
	display: -webkit-box;
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-webkit-align-items: center;
	-ms-flex-align: center;
	align-items: center
}

.header-layout7 .header-top {
	padding: 15px 0;
	--body-color: #fff
}

.header-layout7 .header-top a,
.header-layout7 .header-top li,
.header-layout7 .header-top p,
.header-layout7 .header-top span,
.header-layout7 .header-top i {
	color: var(--white-color)
}

.header-layout7 .header-top a:hover {
	color: var(--theme-color)
}

.header-layout7 .header-top li:before {
	background-color: #d9d9d9
}

.header-layout7 .top-left {
	padding-left: 50px
}

.header-layout7 .top-right {
	width: 1080px;
	padding-right: 50px
}

.header-layout7 .simple-icon {
	color: var(--white-color)
}

.header-layout7 .simple-icon.style2 {
	font-size: 28px
}

.header-layout7 .dropdown-menu {
	--body-color: #74787c
}

.header-layout7 .menu-area {
	position: relative;
	padding: 0 50px;
	background-color: rgba(255, 255, 255, 0.1);
	width: 1080px
}

.header-layout7 .main-menu>ul>li {
	margin: 0 18px
}

.header-layout7 .main-menu>ul>li>a {
	color: var(--white-color);
	padding: 36.5px 0
}

.header-layout7 .th-menu-toggle {
	margin: 15px 0
}

.header-layout7 .header-button {
	margin-left: 10px;
	gap: 30px
}

@media (max-width: 1299px) {
	.header-layout7 .header-logo {
		padding: 15px 100px 15px 30px
	}

	.header-layout7 .top-left {
		padding-left: 30px
	}

	.header-layout7 .top-right {
		width: 900px;
		padding-right: 30px
	}

	.header-layout7 .menu-area {
		padding: 0 30px;
		width: 900px
	}
}

@media (max-width: 1399px) {
	.header-layout7 .container {
		max-width: 100%
	}

	.header-layout7 .top-right {
		width: 687px
	}

	.header-layout7 .menu-area {
		width: 100%
	}
}

@media (max-width: 1199px) {
	.header-layout7 .header-logo {
		padding: 15px 100px 15px 15px
	}

	.header-layout7 .top-left {
		padding-left: 15px
	}

	.header-layout7 .top-right {
		width: 680px;
		padding-right: 15px
	}

	.header-layout7 .menu-area {
		padding: 0 15px
	}
}

@media (max-width: 991px) {
	.header-layout7 .top-left {
		padding-left: 15px
	}

	.header-layout7 .top-right {
		width: 100%
	}

	.header-layout7 .top-right .row {
		--bs-gutter-x: 50px
	}
}

@media (max-width: 767px) {
	.header-layout7 .header-logo {
		padding: 15px
	}
}

.header-layout8 {
	--main-container: 1720px;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	background-color: transparent;
	border-bottom: 1px solid rgba(255, 255, 255, 0.15)
}

.header-layout8 .main-menu>ul>li>a {
	padding: 46.5px 0;
	color: var(--white-color)
}

.header-layout8:before {
	content: "";
	height: 100%;
	width: 22%;
	background-color: var(--white-color);
	opacity: 0.13;
	position: absolute;
	top: 0;
	right: 0;
	-webkit-clip-path: polygon(100px 0%, 100% 0, 100% 100%, 0% 100%);
	clip-path: polygon(100px 0%, 100% 0, 100% 100%, 0% 100%);
	z-index: -1
}

.header-layout8 .header-button {
	margin-left: 110px
}

.header-layout8 .header-button .simple-icon {
	color: var(--white-color)
}

.header-layout8 .sticky {
	background-color: var(--title-color)
}

@media (min-width: 1922px) {
	.header-layout8::before {
		width: 30%
	}
}

@media (max-width: 1399px) {
	.header-layout8:before {
		width: 26%
	}
}

@media (max-width: 1300px) {
	.header-layout8:before {
		width: 16%
	}

	.header-layout8 .header-button .th-btn {
		display: none
	}
}

@media (max-width: 1199px) {
	.header-layout8 .main-menu>ul>li>a {
		padding: 31.5px 0
	}
}

@media (max-width: 991px) {
	.header-layout8:before {
		width: 50%;
		-webkit-clip-path: polygon(60px 0%, 100% 0, 100% 100%, 0% 100%);
		clip-path: polygon(60px 0%, 100% 0, 100% 100%, 0% 100%)
	}
}

.header-layout9 {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: 100%;
	background-color: transparent
}

.header-layout9 .navbar-top {
	height: 47px;
	padding-top: 7px;
	background: var(--theme-color);
	-webkit-mask: conic-gradient(from -45deg at bottom, rgba(0, 0, 0, 0), #000 1deg 89deg, rgba(0, 0, 0, 0) 90deg) 10%/20px 100%
}

.header-layout9 .header-links li,
.header-layout9 .header-links span,
.header-layout9 .header-links p,
.header-layout9 .header-links a {
	color: var(--white-color)
}

.header-layout9 .header-links a:hover {
	color: var(--title-color)
}

.header-layout9 .header-links i {
	color: var(--white-color);
	-webkit-transition: 0.4s;
	transition: 0.4s
}

.header-layout9 .header-links.header-right li a:hover i {
	color: var(--title-color)
}

.header-layout9 .header-links li:not(:last-child):before {
	background-color: rgba(255, 255, 255, 0.5)
}

.header-layout9 .simple-icon {
	color: var(--title-color)
}

.header-layout10 .header-top {
	--body-color: #fff;
	background-color: var(--theme-color);
	padding: 9px 0
}

.header-layout10 .header-top a:hover {
	color: var(--title-color)
}

.header-layout10 .menu-area {
	background-color: var(--white-color)
}

.header-layout11 .header-top {
	background-color: #00306e;
	padding: 11.5px 0;
	--body-color: #fff
}

.header-layout11 .header-top a,
.header-layout11 .header-top li,
.header-layout11 .header-top p {
	color: var(--body-color)
}

.header-layout11 .header-top a:hover {
	color: var(--theme-color)
}

.header-layout11 .header-top li:before {
	background-color: #3569ac
}

.header-layout11 .header-button {
	padding-left: 30px;
	margin-left: 6px;
	position: relative
}

.header-layout11 .header-button:before {
	content: "";
	height: 30px;
	width: 1px;
	position: absolute;
	top: 50%;
	left: 0;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	transform: translateY(-50%);
	background-color: #d9d9d9
}

.header-layout11 .th-menu-toggle {
	margin: 20px 0
}

.header-layout11 .menu-expand {
	font-size: 14px;
	font-weight: 500;
	text-transform: uppercase;
	color: var(--theme-color);
	background-color: #eef3f9;
	padding: 12.5px 24px;
	border-radius: 5px
}

.header-layout11 .menu-expand i {
	margin-right: 10px
}

@media (max-width: 575px) {

	.header-layout11 .th-menu-toggle,
	.header-layout12 .th-menu-toggle {
		margin: 15px 0
	}
}

@media (max-width: 375px) {

	.header-layout11 .header-social a,
	.header-layout12 .header-social a {
		margin: 0 10px 0 0
	}

	.header-layout11 .header-links li,
	.header-layout12 .header-links li {
		font-size: 14px
	}
}

.header-layout12 {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%
}

.header-layout12 .header-top {
	background-color: #00306e;
	padding: 9px 0;
	--body-color: #fff
}

.header-layout12 .header-top a,
.header-layout12 .header-top li,
.header-layout12 .header-top p,
.header-layout12 .header-top span,
.header-layout12 .header-top div {
	color: var(--body-color);
	font-family: var(--title-font)
}

.header-layout12 .header-top .counter-list {
	background: var(--white-color)
}

.header-layout12 .header-top .count-number,
.header-layout12 .header-top .count-name {
	font-size: 15px;
	color: #00306e
}

.header-layout12 .header-top a:hover {
	color: var(--theme-color)
}

.header-layout12 .header-top li:before {
	background-color: #3569ac
}

.header-layout12 .th-menu-toggle {
	margin: 20px 0
}

.header-layout12 .menu-area {
	background-color: var(--white-color);
	padding-left: 40px;
	border-radius: 0 0 0 10px
}

.header-layout12 .sticky-wrapper:after {
	content: "";
	height: 100%;
	width: 50%;
	position: absolute;
	top: 0;
	right: 0;
	background-color: var(--white-color);
	z-index: -1
}

.header-layout12 .sticky-wrapper.sticky .menu-area {
	padding-left: 0
}

@media (max-width: 1199px) {
	.header-layout12 .header-notice {
		font-size: 14px
	}

	.header-layout12 .menu-area {
		padding-left: 0
	}

	.header-layout12 .sticky-wrapper {
		background-color: var(--white-color)
	}

	.header-layout12 .sticky-wrapper::after {
		display: none
	}
}

.header-layout13 .header-button {
	padding-left: 0px;
	margin-left: 0px
}

.header-layout13 .header-button:before {
	display: none
}

@media (min-width: 1700px) {
	.header-layout13 {
		--main-container: 1620px
	}
}

@media (max-width: 1699px) {
	.header-layout13 .category-menu-wrap {
		display: none
	}
}

.header-layout14 .menu-area {
	position: relative;
	z-index: 2
}

.header-layout14 .logo-bg {
	position: absolute;
	left: 0;
	bottom: 0;
	height: 100%;
	width: 29%;
	background-color: #F1F2F7;
	-webkit-clip-path: polygon(0 0, 100% 0, calc(100% - 50px) 100%, 0% 100%);
	clip-path: polygon(0 0, 100% 0, calc(100% - 50px) 100%, 0% 100%);
	z-index: -1
}

@media (min-width: 1922px) {
	.header-layout14 .logo-bg {
		width: 34%
	}
}

@media (max-width: 1299px) {
	.header-layout14 .logo-bg {
		width: 22%
	}
}

@media (max-width: 1399px) {
	.header-layout14 .logo-bg {
		width: 26%
	}
}

@media (max-width: 1199px) {
	.header-layout14 .logo-bg {
		width: 30%
	}
}

@media (max-width: 991px) {
	.header-layout14 .logo-bg {
		width: 55%
	}
}

@media (max-width: 420px) {
	.header-layout14 .logo-bg {
		width: 75%
	}

	.header-layout14 .header-social a {
		margin: 0 9px 0 0
	}

	.header-layout14 .header-social a:last-child {
		margin: 0
	}

	.header-layout14 .header-links li {
		font-size: 14px
	}
}