.header-top {
	padding: 10px 0;
	background: var(--color-primary);
	position: relative;
}

.header-top::before {
	content: "";
	position: absolute;
	top: 0;
	left: 5%;
	bottom: 0;
	width: 48%;
	background: var(--theme-color);
	border-radius: 50px;
}

.header-top::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	width: 6%;
	background: var(--theme-color);
	border-radius: 50px 0 0 50px;
}

.header-top-wrap {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	position: relative;
}

.header-top-list ul {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 25px;
}

.header-top-list a {
	color: var(--color-white);
}

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

.header-top-list a i {
	color: var(--color-white);
	margin-right: 5px;
}

.header-top-left,
.header-top-right {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 15px;
}

.header-top-social span {
	color: var(--color-white);
}

.header-top-social a {
	color: var(--color-white);
	font-size: 16px;
	text-align: center;
	margin-left: 12px;
	transition: var(--transition);
}

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

.header-top-lang .top-lang {
	color: var(--color-white);
}

.header-top-lang .dropdown-menu {
	min-width: 60px;
	border-radius: 15px;
	padding: 10px;
	border: none;
	box-shadow: var(--box-shadow);
}

.header-top-lang .dropdown-item {
	color: var(--color-dark);
	border-radius: 10px;
}

.header-top-lang .dropdown-item:hover {
	background: var(--theme-color);
	color: var(--color-white);
}

@media all and (max-width: 1199px) {
	.header-top::before {
		left: 0;
		width: 62%;
	}

	.header-top::after {
		display: none;
	}

	.header-top-social span {
		display: none;
	}
}

@media all and (max-width: 991px) {
	.header-top::before {
		width: 53%;
	}

	.header-top-list ul li:last-child {
		display: none;
	}
}

@media all and (max-width: 767px) {

	.header-top::before,
	.header-top::after {
		display: none;
	}

	.header-top-right {
		margin-top: 15px;
	}
}


/*====================
1-2. Navbar css
======================*/

.navbar {
	background: transparent;
	padding-top: 0px;
	padding-bottom: 0px;
	z-index: 4;
}

.navbar.fixed-top {
	position: fixed;
	background: var(--color-white);
	box-shadow: var(--box-shadow2);
	animation: slide-down 0.7s;
}

@keyframes slide-down {
	0% {
		transform: translateY(-100%);
	}

	100% {
		transform: translateY(0);
	}
}

.navbar .navbar-brand .logo-display {
	display: block;
}

.navbar .navbar-brand .logo-scrolled {
	display: none;
}

.navbar.fixed-top .navbar-brand .logo-display {
	display: none;
}

.navbar.fixed-top .navbar-brand .logo-scrolled {
	display: block;
}

.navbar-brand {
	margin-right: 0;
}

.navbar-brand img {
	width: 180px;
}

.navbar .dropdown-toggle::after {
	display: inline-block;
	margin-left: 5px;
	vertical-align: baseline;
	font-family: 'Font Awesome 6 Pro';
	content: "\f107";
	font-weight: 600;
	border: none;
	font-size: 14px;
}

.nav-right .header-form {
	position: relative;
	display: inline-block;
}

.nav-right .header-form input {
	width: 70%;
}

.nav-right .header-form button {
	border-radius: 100%;
}

@media all and (min-width: 992px) {
	.navbar .nav-item .nav-link {
		margin-right: 22px;
		padding: 30px 0 30px 0;
		font-size: 16px;
		font-weight: 600;
		color: var(--color-dark);
		text-transform: capitalize;
	}

	.navbar.fixed-top .nav-item .nav-link {
		color: var(--color-dark);
	}

	.navbar .nav-item .nav-link.active,
	.navbar .nav-item:hover .nav-link {
		color: var(--theme-color);
	}

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

	.navbar .nav-item .dropdown-menu {
		display: block;
		padding: 10px;
		margin-top: 0;
		left: -15px;
		border-radius: 15px;
		border: none;
		background: var(--color-white);
		width: 220px;
		box-shadow: var(--box-shadow);
		opacity: 0;
		visibility: hidden;
		transition: var(--transition2);
	}

	.navbar .nav-item .dropdown-menu .dropdown-item {
		font-size: 14px;
		padding: 6px 15px;
		font-weight: 500;
		color: var(--color-dark);
		position: relative;
		overflow: hidden;
		border-radius: 10px;
		text-transform: capitalize;
		transition: var(--transition2);
		z-index: 1;
	}

	.navbar .nav-item .dropdown-menu .dropdown-item:hover {
		background: var(--theme-color);
		color: var(--color-white);
		padding-left: 25px;
	}

	.navbar .nav-item .dropdown-menu .dropdown-item::before {
		content: "\f178";
		position: absolute;
		font-family: "Font Awesome 6 Pro";
		left: -15px;
		top: 6px;
		color: var(--color-white);
		opacity: 0;
		visibility: hidden;
		transition: var(--transition2);
		z-index: -1;
	}

	.navbar .nav-item .dropdown-menu .dropdown-item:hover::before {
		left: 0;
		opacity: 1;
		visibility: visible;
	}

	.navbar .nav-item:hover .dropdown-menu {
		transition: .3s;
		opacity: 1;
		visibility: visible;
		top: 100%;
		transform: rotateX(0deg);
	}

	.navbar .dropdown-menu-end {
		right: 0;
		left: auto;
	}

	.navbar .dropdown-menu.fade-down {
		top: 80%;
		transform: rotateX(-75deg);
		transform-origin: 0% 0%;
	}

	.navbar .dropdown-menu.fade-up {
		top: 140%;
	}

	/* nav right */


	.nav-right {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 30px;
		margin-left: 15px;
	}

	.nav-right .search-block {
		position: relative;
		display: inline-block;
	}

	.nav-right-link {
		position: relative;
		font-size: 20px;
		color: var(--color-dark);
		border: none;
		padding: 0;
		background: transparent;
		transition: var(--transition);
	}

	.nav-right-link:hover {
		color: var(--theme-color);
	}

	.navbar.fixed-top .nav-right-link {
		color: var(--color-dark);
	}

	.navbar.fixed-top .nav-right-link:hover {
		color: var(--theme-color);
	}

	.nav-right .call-wrap {
		display: flex;
		align-items: center;
		justify-content: flex-start;
		gap: 7px;
	}

	.nav-right .call-wrap .content span {
		color: var(--theme-color);
		font-weight: 500;
	}

	.nav-right .call-wrap .content h6 a {
		color: var(--color-dark);
		font-weight: 800;
	}

	.nav-right .sidebar-btn span {
		display: block;
		width: 24px;
		border-bottom: 3px solid var(--color-dark);
		border-radius: 50px;
		margin-top: 6px;
		margin-left: auto;
		transition: var(--transition);
	}

	.nav-right .sidebar-btn span:first-child {
		width: 10px;
		margin-top: 0;
	}

	.nav-right .sidebar-btn span:nth-child(3) {
		width: 15px;
	}

	/* navbar light */
	.navbar.light .nav-item .nav-link {
		color: var(--color-white);
	}

	.navbar.light.fixed-top .nav-item .nav-link {
		color: var(--color-dark);
	}

	.navbar.light .nav-item .nav-link.active,
	.navbar.light .nav-item:hover .nav-link {
		color: var(--theme-color);

	}

	.navbar.light .nav-right-link {
		color: var(--color-white);
	}

	.navbar.light.fixed-top .nav-right-link {
		color: var(--color-dark);
	}

	.navbar.light .nav-right-link:hover {
		color: var(--theme-color);
	}

	.navbar.light .nav-right .sidebar-btn span {
		border-color: var(--color-white);
	}

	.navbar.light.fixed-top .nav-right .sidebar-btn span {
		border-color: var(--color-dark);
	}
}

@media all and (max-width: 1199px) {
	.navbar .nav-item .nav-link {
		margin-right: 15px;
	}

	.nav-right {
		margin-left: 15px;
	}

	.nav-right .sidebar-btn,
	.nav-right .call-wrap {
		display: none;
	}
}

/* navbar mobile menu */
.navbar .mobile-menu-right {
	display: none;
}

@media all and (max-width: 991px) {
	.navbar {
		padding-top: 10px;
		padding-bottom: 10px;
	}

	.navbar-brand img {
		width: 130px;
	}

	.navbar .offcanvas {
		width: 300px;
	}

	.navbar .offcanvas-header .btn-close {
		background: var(--color-red);
		width: 20px;
		height: 20px;
		line-height: 20px;
		text-align: center;
		border-radius: 50px;
		color: var(--color-white);
		font-size: 18px;
		box-shadow: none;
		opacity: 1;
	}

	.navbar .offcanvas-brand {
		width: 150px;
	}

	.navbar .nav-item .nav-link {
		color: var(--color-dark);
		font-weight: 700;
		margin-right: 0px;
		transition: var(--transition);
	}

	.navbar .nav-item .nav-link:hover {
		color: var(--theme-color);
	}

	.navbar .nav-item .dropdown-menu {
		border-radius: 15px;
	}

	.navbar .nav-item .dropdown-toggle::after {
		float: right;
		margin-top: 2.5px;
	}

	.navbar-toggler {
		padding: 0;
		border: none;
	}

	.navbar-toggler:focus {
		outline: none;
		box-shadow: none;
	}

	.navbar-toggler span {
		display: block;
		width: 22px;
		border-bottom: 3px solid var(--color-dark);
		border-radius: 50px;
		margin-top: 5px;
	}

	.navbar-toggler span:first-child {
		margin-top: 0;
	}

	.navbar-toggler span:nth-child(2) {
		width: 15px;
	}

	.navbar .mobile-menu-right {
		display: flex;
		align-items: center;
		gap: 20px;
	}

	.navbar .mobile-menu-right .nav-right-link {
		background: transparent;
		border: none;
		font-size: 20px;
		color: var(--color-dark);
	}

	.navbar .mobile-menu-right .nav-right-link:hover {
		color: var(--theme-color);
	}

	.nav-right {
		display: none;
	}

	/* navbar light */


	/* .navbar.light .navbar-toggler span {
		border-color: var(--color-white);
	}

	.navbar.light.fixed-top .navbar-toggler span {
		border-color: var(--color-dark);
	}

	.navbar.light .mobile-menu-right .nav-right-link {
		color: var(--color-white);
	}

	.navbar.light.fixed-top .mobile-menu-right .nav-right-link {
		color: var(--color-dark);
	}

	.navbar.light .mobile-menu-right .nav-right-link:hover {
		color: var(--theme-color);
	} */
}

/*==============================
1-3. Navbar multi level dropdown
================================*/

.navbar .nav-item .dropdown-submenu {
	position: relative;
}

.navbar .nav-item .dropdown-submenu .dropdown-menu::before {
	display: none;
}

.navbar .nav-item .dropdown-submenu a::after {
	transform: rotate(-90deg);
	position: absolute;
	right: 15px;
	top: 8px;
	font-weight: 600;
}

.navbar .nav-item .dropdown-submenu a:hover {
	background: transparent;
	color: var(--color-white);
}

.navbar .nav-item .dropdown-submenu a:focus {
	background: transparent;
}

.navbar .nav-item .dropdown-submenu .dropdown-menu {
	top: 120%;
	left: 100%;
	opacity: 0;
	visibility: hidden;
}

.navbar .nav-item .dropdown-submenu:hover .dropdown-menu {
	top: 0;
	opacity: 1;
	visibility: visible;
}

@media all and (max-width: 991px) {
	.navbar .nav-item .dropdown-menu .dropdown-item {
		color: var(--color-dark)
	}

	.navbar .nav-item .dropdown-submenu .dropdown-menu {
		margin: 0 17px;
	}

	.navbar .nav-item .dropdown-submenu .dropdown-menu {
		opacity: unset;
		visibility: unset;
	}

	.navbar .nav-item .dropdown-submenu a::after {
		top: 3px;
	}

	.navbar .nav-item .dropdown-submenu a:hover {
		color: var(--theme-color);
	}
}



/*============================
1-4. Navbar mega menu
==============================*/

@media all and (min-width: 992px) {
	.nav-item.mega-menu {
		position: static;
	}

	.navbar .nav-item.mega-menu .dropdown-menu {
		width: 98.2%;
		left: 12px;
	}

	.navbar .mega-menu .mega-content {
		padding: 12px;
	}

	.navbar .mega-menu .mega-menu-title {
		font-size: 17px;
		margin-bottom: 15px;
		color: var(--color-dark);
	}

	.navbar .mega-menu-img img {
		border-radius: 15px;
	}

	.navbar .nav-item.mega-menu .dropdown-menu .dropdown-item {
		padding-left: 0;
	}

	.navbar .nav-item.mega-menu .dropdown-menu .dropdown-item::before {
		left: 0;
	}

	.navbar .nav-item.mega-menu .dropdown-menu .dropdown-item:hover {
		padding-left: 15px;
	}

	/* mega-menu small */
	.navbar .nav-item.mega-menu.small {
		position: relative;
	}

	.navbar .mega-menu.small .dropdown-menu {
		width: 340px;
		left: 50%;
		transform: translateX(-50%);
	}
}


@media all and (max-width: 991px) {
	.navbar .mega-menu-img {
		display: none;
	}

	.navbar .mega-menu .mega-content h5 {
		margin: 15px 0;
	}
}

/* ======================
1-6. Search popup
====================== */

.search-popup {
	position: fixed;
	left: 0;
	top: 0;
	height: 100vh;
	width: 100%;
	z-index: 99999;
	margin-top: -540px;
	transform: translateY(-100%);
	background-color: rgba(10, 33, 85, .95);
	transition: all 1500ms cubic-bezier(0.860, 0.000, 0.070, 1.000);
	transition-timing-function: cubic-bezier(0.860, 0.000, 0.070, 1.000);
}

.search-active .search-popup {
	transform: translateY(0%);
	margin-top: 0;
}

.search-popup .close-search {
	position: absolute;
	left: 0;
	right: 0;
	top: 75%;
	border: none;
	margin: 0 auto;
	margin-top: -200px;
	border-radius: 50px;
	text-align: center;
	background: var(--color-red);
	text-align: center;
	width: 50px;
	height: 50px;
	color: var(--color-white);
	font-size: 20px;
	cursor: pointer;
	box-shadow: var(--box-shadow);
	transition: all 500ms ease;
	opacity: 0;
	visibility: hidden;
}

.search-active .search-popup .close-search {
	visibility: visible;
	opacity: 1;
	top: 50%;
	transition-delay: 1500ms;
}

.search-active .search-popup .close-search span {
	transition: var(--transition);
}

.search-active .search-popup .close-search:hover span {
	transform: rotate(180deg);
}

.search-popup form {
	position: absolute;
	max-width: 700px;
	top: 50%;
	left: 15px;
	right: 15px;
	margin: -35px auto 0;
	transform: scaleX(0);
	transform-origin: center;
	transition: all 300ms ease;
}

.search-active .search-popup form {
	transform: scaleX(1);
	transition-delay: 1200ms;
}

.search-popup .form-group {
	position: relative;
	margin: 0px;
	overflow: hidden;
}



.search-popup .form-control {
	position: relative;
	width: 100%;
	height: 70px;
	outline: none;
	border-radius: 0px;
	border: none;
	border-bottom: 2px solid var(--color-white);
	background-color: transparent;
	color: var(--color-white);
	font-size: 40px;
	padding: 0 70px 0 20px;
	transition: all 500ms ease;
	text-transform: capitalize;
}

.search-popup .form-control::placeholder {
	color: var(--color-white);
	font-size: 40px;
}

.search-popup .form-group button {
	position: absolute;
	right: 5px;
	top: 5px;
	border-radius: 50px;
	background: transparent;
	text-align: center;
	font-size: 30px;
	color: var(--color-white);
	height: 50px;
	width: 50px;
	border: none;
	cursor: pointer;
	transition: all 500ms ease;
}

.search-popup .form-group button:hover {
	color: var(--theme-color);
}

/*====================
1-7. Sidebar popup css 
======================*/

.sidebar-popup {
	padding: 20px;
}

.sidebar-popup .btn-close {
	background: var(--theme-color);
	width: 25px;
	height: 25px;
	line-height: 25px;
	text-align: center;
	border-radius: 50px;
	color: var(--color-white);
	font-size: 20px;
	transition: var(--transition);
	box-shadow: var(--box-shadow);
	opacity: 1;
}

.sidebar-popup .btn-close:hover {
	background: var(--color-red);
}

.sidebar-popup .btn-close i {
	transition: var(--transition);
}

.sidebar-popup .btn-close:hover i {
	transform: rotate(180deg);
}

.sidebar-popup-logo img {
	width: 180px;
}

.sidebar-popup-about {
	margin-top: 10px;
}

.sidebar-popup-about h4 {
	margin-bottom: 10px;
	font-weight: 700;
}

.sidebar-popup-contact {
	margin-top: 20px;
}

.sidebar-popup-contact h4 {
	margin-bottom: 15px;
	font-weight: 700;
}

.sidebar-popup-contact li {
	display: flex;
	gap: 12px;
	margin-bottom: 15px;
}

.sidebar-popup-contact li .icon {
	padding-right: 10px;
}

.sidebar-popup-contact li .icon i {
	width: 35px;
	height: 35px;
	line-height: 35px;

	color: var(--color-white);
	background: var(--theme-color);
	text-align: center;
	border-radius: 35px;
}

.sidebar-popup-contact li a:hover {
	color: var(--theme-color);
}

.sidebar-popup-social {
	margin-top: 25px;
}

.sidebar-popup-social h4 {
	margin-bottom: 20px;
	font-weight: 700;
}

.sidebar-popup-social a i {
	width: 40px;
	height: 40px;
	line-height: 40px;
	text-align: center;
	border-radius: 40px;
	margin-right: 8px;
	background: var(--theme-color);
	color: var(--color-white);
	box-shadow: var(--box-shadow);
	border: solid 1px #0A7C5A;
}

.sidebar-popup-social a:hover i {
	background: var(--color-white);
	color: #0A7C5A;
	border: solid 1px #0A7C5A;
}

/* ===================
1-8. About css 
====================== */

.about-left {
	position: relative;
	margin-right: 25px;
}

.about-left::before {
	content: "";
	position: absolute;
	width: 150px;
	height: 80%;
	left: -20px;
	top: 50px;
	border: 5px solid var(--theme-color);
	border-radius: 100px 20px 20px 80px;
	z-index: -1;
}

.about-img .img-1 {
	width: 55%;
	height: 400px;
	margin-top: 70px;
	border-radius: 100px;
}

.about-img .img-2 {
	position: absolute;
	top: -20px;
	right: 0;
	width: 45%;
	border: 10px solid var(--color-white);
	border-radius: 100px;
}

.about-right {
	position: relative;
	display: block;
}

.about-experience {
	background: var(--theme-color);
	position: absolute;
	right: 30px;
	bottom: 40px;
	padding: 14px 25px;
	border-radius: 100px;
	text-align: center;
	border: 10px solid var(--color-white);
}

.about-experience::before {
	content: "";
	position: absolute;
	inset: 4px;
	border: 2px dashed var(--color-white);
	border-radius: 100px;
}

.about-experience h5 {
	color: var(--color-white);
	font-size: 40px;
}

.about-experience p {
	color: var(--color-white);
	font-weight: 600;
}

.about-content {
	/* padding: 15px;
	border: 1px solid var(--border-info-color);
	border-radius: 20px; */
	margin-top: 25px;
	margin-bottom: 25px;
}

.about-item {
	display: flex;
	gap: 12px;
	background: var(--color-white);
}

.about-item .icon {
	width: 45px;
	height: 45px;
	line-height: 45px;
	text-align: center;
	background: var(--theme-color);
	border-radius: 50px;
}

.about-item .icon img {
	width: 25px;
	filter: brightness(0) invert(1);
}

.about-item .content {
	flex: 1;
}

.about-item .content h6 {
	color: var(--color-dark);
	font-size: 17px;
	margin-bottom: 5px;
}

.about-item .content p {
	font-size: 12px;
}

.theme-btn2 {
	font-size: 16px;
	color: var(--color-white);
	padding: 10px 20px;
	transition: all 0.5s;
	text-transform: capitalize;
	position: relative;
	border-radius: 50px;
	font-weight: 500;
	cursor: pointer;
	text-align: center;
	vertical-align: middle;
	overflow: hidden;
	border: none;
	background: var(--theme-color);
	box-shadow: var(--box-shadow);
	z-index: 1;
}

.about-text {
	font-size: 13px;
	text-align: justify;

}

@media all and (max-width: 991px) {
	.about-right {
		margin-top: 80px;
	}
}

@media all and (max-width: 767px) {
	.about-left {
		margin-right: 0;
	}

	.about-left::before {
		top: 60px;
		left: -10px;
	}

	.about-title {
		font-size: 30px;
	}

	.about-experience {
		right: -7px;
		bottom: 5px;
	}

	.about-item {
		border: none !important;
	}
}

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

.site-title-tagline {
	display: inline-block;
	color: var(--color-white);
	font-weight: 500;
	text-transform: capitalize;
	font-size: 18px;
	margin-bottom: 15px;
	background: var(--theme-color);
	border-radius: 50px;
	padding: 2px 15px 2px 3px;
}

.site-title {
	font-weight: 700;
	text-transform: capitalize;
	font-size: 32px;
	color: var(--color-dark);
	margin-bottom: 0px;
}

.process-item {
	position: relative;
	box-shadow: var(--box-shadow);
	background: var(--color-white);
	padding: 20px;
	border-radius: 30px;
}

.process-item .count {
	position: absolute;
	top: 30px;
	right: 25px;
	color: transparent;
	font-size: 50px;
	line-height: 30px;
	font-weight: 800;
	margin-bottom: 20px;
	-webkit-text-stroke: 1px var(--theme-color);
}

.process-item .icon {
	width: 80px;
	height: 80px;
	line-height: 70px;
	text-align: center;
	position: relative;
	background: var(--theme-color);
	border-radius: 50px;
}

.process-item .icon img {
	max-width: 40px;
	margin-top: 5px;
}

.process-item h4 {
	font-size: 16px;
}

/*====================
20. Hero css 
======================*/

.hero-single {
	padding-top: 50px;
	padding-bottom: 50px;
	background-position: center !important;
	background-size: cover !important;
	background-repeat: no-repeat !important;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	z-index: 1;
}

.hero-single::before {
	content: "";
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: -0.5px;
	background: linear-gradient(to bottom right, rgba(0, 42, 126, 1) 0%, rgba(0, 42, 126, 0) 100%);
	z-index: -1;
}

.hero-single .hero-content {
	height: 100%;
}

.hero-single .hero-content .hero-sub-title {
	display: inline-block;
	color: var(--color-white);
	font-size: 24px;
	letter-spacing: 6px;
	font-weight: 600;
	position: relative;
	text-transform: uppercase;
}

.hero-single .hero-content .hero-sub-title::before {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 99%;
	height: 15px;
	background: var(--theme-color);
	border-radius: 50px;
	z-index: -1;
}

.hero-single .hero-content .hero-title {
	color: var(--color-white);
	font-size: 60px;
	font-weight: 700;
	margin: 20px 0;
	text-transform: capitalize;
}

.hero-single .hero-content .hero-title span {
	color: transparent;
	-webkit-text-stroke: 2px var(--color-white);
}

.hero-single .hero-content p {
	color: var(--color-white);
	font-size: 18px;
	line-height: 30px;
	font-weight: 400;
	margin-bottom: 20px;
}

.hero-single .hero-content .hero-btn {
	display: flex;
	justify-content: start;
	gap: 1rem;
	margin-top: 35px;
}

.hero-single .hero-content .hero-btn .theme-btn2 {
	background: var(--color-white);
	color: var(--color-dark);
}

.hero-single .hero-content .hero-btn .theme-btn2:hover {
	color: var(--color-white);
}

.hero-single .hero-content .hero-btn .theme-btn2::before {
	background: var(--theme-color);
}

@media all and (max-width: 1199px) {
	.hero-single .hero-content .hero-title {
		font-size: 37px;
	}
}

@media all and (max-width: 991px) {
	.hero-single .hero-content .hero-title {
		font-size: 50px;
	}
}

@media all and (max-width: 767px) {
	.hero-single .hero-content .hero-sub-title {
		font-size: 18px;
	}

	.hero-single .hero-content .hero-btn {
		gap: 1rem;
	}
}


/* hero-slider */
.hero-slider .owl-nav {
	margin-top: 0px;
}

.hero-slider .owl-nav button i {
	display: inline-block;
	height: 55px;
	width: 55px;
	line-height: 55px;
	color: var(--theme-color);
	font-size: 25px;
	text-align: center;
	background: var(--color-white);
	border-radius: 50px;
	cursor: pointer;
	transition: var(--transition);
}

.hero-slider .owl-nav button:hover i {
	background: var(--theme-color);
	color: var(--color-white);
}

.hero-slider .owl-nav .owl-prev {
	left: 40px;
}

.hero-slider .owl-nav .owl-next {
	right: 40px;
}

.hero-slider .owl-nav .owl-prev,
.hero-slider .owl-nav .owl-next {
	position: absolute;
	top: 50%;
	transform: translate(0, -50%);
}

.hero-slider .owl-dots {
	position: absolute;
	left: 50%;
	bottom: 40px;
	transform: translateX(-50%);
	display: none;
}

.hero-slider .owl-dots .owl-dot span {
	display: inline-block;
	width: 15px;
	height: 15px;
	background-color: var(--color-white);
	border-radius: 0px;
	border: 3px solid var(--theme-color);
	margin: 5px;
	transition: var(--transition);
}

.hero-slider .owl-dots .owl-dot.active span {
	background-color: var(--theme-color);
}


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

	.hero-slider .owl-nav .owl-prev,
	.hero-slider .owl-nav .owl-next {
		top: unset;
		bottom: 45px;
	}

	.hero-slider .owl-nav .owl-prev {
		left: unset;
		right: 120px;
	}

	.hero-slider .owl-nav .owl-next {
		right: 40px;
	}
}


.site-breadcrumb {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	background-repeat: no-repeat !important;
	background-position: center !important;
	background-size: cover !important;
	position: relative;
	padding-top: 120px;
	padding-bottom: 120px;
	z-index: 1;
}

.site-breadcrumb::before {
	content: "";
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, 0.8);
	/* opacity: 0.8; */
	z-index: -1;
}

.site-breadcrumb .breadcrumb-title {
	font-size: 35px;
	color: var(--color-white);
	font-weight: 700;
	margin-bottom: 10px;
	text-transform: capitalize;
}

.site-breadcrumb .breadcrumb-menu {
	position: relative;
	z-index: 1;
}

.site-breadcrumb .breadcrumb-menu li {
	position: relative;
	display: inline-block;
	margin-left: 25px;
	color: var(--color-white);
	font-weight: 500;
	text-transform: capitalize;
}

.site-breadcrumb .breadcrumb-menu li a {
	color: var(--color-white);
	transition: all 0.5s ease-in-out;
}

.site-breadcrumb .breadcrumb-menu li::before {
	position: absolute;
	content: '\f101';
	font-family: 'Font Awesome 6 Pro';
	right: -21px;
	top: 1px;
	text-align: center;
	font-size: 16px;
	color: var(--color-white);
}

.site-breadcrumb .breadcrumb-menu li:first-child {
	margin-left: 0;
}

.site-breadcrumb .breadcrumb-menu li:last-child:before {
	display: none;
}

.site-breadcrumb .breadcrumb-menu li a:hover {
	color: var(--color-yellow);
}

.site-breadcrumb .breadcrumb-menu li.active {
	color: var(--color-yellow);
}

.counter-area {
	position: relative;
	background: var(--theme-color);
	opacity: 0.8;
	overflow: hidden;
	z-index: 1;
}

.counter-area::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background-image: url(../image/03.png);
	background-repeat: no-repeat;
	background-position: center;
	background-size: cover;
	opacity: .3;
}

.counter-item {
	display: flex;
	gap: 12px;
	position: relative;
	padding: 15px 10px 15px 15px;
	border-radius: 10px;
	background: var(--color-white);
	box-shadow: 0 0 40px 5px rgb(0 0 0 / 5%);
	z-index: 1;
}

.counter-item .icon {
	width: 50px;
	height: 50px;
	line-height: 50px;
	font-size: 35px;
	border-radius: 50px;
	text-align: center;
	color: var(--color-white);
	background: var(--theme-color);
}

.counter-item .icon img {
	width: 28px;
	filter: brightness(0) invert(1);
}

.counter-item .info {
	display: flex;
	gap: 2px;
}

.counter-item .counter {
	display: block;
	line-height: 1;
	color: var(--color-dark);
	font-size: 18px;
	font-weight: 600;
	line-height: 50px;
	padding-left: 10px;
}

.counter-item .title {
	color: var(--color-dark);
	margin-top: 10px;
	font-size: 12px;
	font-weight: 500;
	text-transform: capitalize;
}

.pt-40 {
	padding-top: 40px;
}

.pt-80 {
	padding-top: 80px;
}

.pb-40 {
	padding-bottom: 40px;
}

/* ======================
25. Service single
====================== */

.service-sidebar .widget {
	background: var(--color-white);
	padding: 30px;
	border-radius: 20px;
	margin-bottom: 30px;
	box-shadow: var(--box-shadow);
}

.service-sidebar .widget .title {
	position: relative;
	padding-bottom: 10px;
	margin-bottom: 30px;
}

.service-sidebar .widget .title::before {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	height: 3px;
	width: 50px;
	background: var(--theme-color);
	border-radius: 50px;
}

.service-sidebar .category a {
	display: block;
	font-size: 16px;
	color: var(--color-dark);
	font-weight: 500;
	padding-bottom: 7px;
	margin-bottom: 7px;
	border-bottom: 1px solid var(--border-info-color);
}

.service-sidebar .category a:hover {
	color: var(--theme-color);
	padding-left: 5px;
}

.service-sidebar .category a i {
	margin-right: 5px;
}

.service-sidebar .category a:last-child {
	padding: 0;
	margin: 0;
	border-bottom: none;
}

.service-sidebar .service-download a {
	display: block;
	color: var(--color-dark);
	font-weight: 500;
	border: 2px solid var(--theme-color);
	padding: 10px 20px;
	margin-bottom: 20px;
	border-radius: 50px;
	transition: var(--transition);
}

.service-sidebar .service-download a:last-child {
	margin-bottom: 0;
}

.service-sidebar .service-download a:hover {
	background: var(--theme-color);
	color: var(--color-white);
}

.service-sidebar .service-download a i {
	margin-right: 10px;
}

.service-details img {
	border-radius: 30px;
}

.service-details h3 {
	color: var(--color-red);
}

.service-details .content .list li {
	font-weight: 500;
	color: var(--color-dark);
	margin-top: 5px;
}

.service-details .content .list i {
	color: var(--theme-color);
	margin-right: 10px;
}

.sv01 img {
	max-width: 200px;
	float: left;
	margin-right: 15px;
}

.sv01 ul li {
	padding: 7px 0;
}

.sv01 ul li i {
	padding-right: 10px;
	color: #0A7C5A;
}

.sv03 .sv033 {
	margin-bottom: 35px;
	background-color: #ECECEC;
	padding: 15px 8px 5px;
	height: 200px;

}

.sv033 i {
	border: 1px solid #0A7C5A;
	width: 40px;
	height: 40px;
	text-align: center;
	line-height: 40px;
	border-radius: 50%;
	margin-right: 15px;
	color: #0A7C5A;
}

.sv033:hover i {
	background-color: #0A7C5A;
	color: #fff;
}

.clear {
	clear: both;
}

/* .sv01,
.sv03 {
	background-color: #0A7C5A;
	opacity: 0.1;
} */

/* ===================
24. Service css 
====================== */

.service-item {
	position: relative;
	padding: 15px;
	background: var(--color-white);
	border-radius: 30px;
	transition: var(--transition);
	box-shadow: var(--box-shadow);
	margin-top: 20px;
}

.service-item .count {
	position: absolute;
	bottom: 15px;
	right: 20px;
	font-weight: 800;
	font-size: 50px;
	line-height: 50px;
	color: transparent;
	-webkit-text-stroke: 1px var(--color-dark);
	opacity: .2;
}

.service-img img {
	border-radius: 20px;
}

.service-icon {
	position: absolute;
	top: 0px;
	right: 0px;
	width: 90px;
	height: 90px;
	border-radius: 50px;
	background: var(--theme-color);
	border: 8px solid var(--color-white);
	transition: var(--transition);
	display: flex;
	align-items: center;
	justify-content: center;
}

.service-icon img {
	width: 45px !important;
	filter: brightness(0) invert(1);
}

.service-item:hover .service-icon img {
	transform: rotateY(-360deg);
}

.service-content {
	margin-top: 25px;
}

.service-content h4 a {
	color: var(--color-dark);
}

.service-content h4 a:hover {
	color: var(--theme-color);
}

.service-content p {
	color: var(--body-text-color);
	margin-top: 10px;
	margin-bottom: 30px;
}

/* service area 2 */
.service-area2 .service-item {
	overflow: hidden;
	z-index: 1;
}

.service-area2 .service-item .shape {
	position: absolute;
	right: 0;
	top: 0;
	opacity: .2;
	z-index: -1;
}

.service-area2 .service-icon {
	float: left;
	border: none;
	width: 55px;
	height: 55px;
	position: relative;
	margin-right: 10px;
}

.service-area2 .service-icon::before {
	content: "";
	position: absolute;
	inset: 5px;
	border: 2px dashed var(--color-white);
	border-radius: 50px;
}

.service-area2 .service-content {
	margin-top: 20px;
}

.service-area2 .service-content p {
	margin-bottom: 20px;
}

.service-area2 .service-item .count {
	font-size: 50px;
	line-height: 50px;
	bottom: 19px;
}

.service-area2 .service-title {
	font-size: 18px;
}

/* service-slider */
.service-slider .service-item {
	box-shadow: unset;
}

.service-slider .service-item:hover {
	border-color: var(--theme-color);
}

.about3 {
	border: 1px solid #aaa;
	padding: 10px;
	margin-bottom: 25px;
	margin-top: -25px;
	height: 600px;
}

.about3 img {
	width: 100%;
	max-height: 225px;
}

.about3 h2 {
	font-size: 16px;
	text-align: center;
	padding-top: 10px;
}

.about3 p {
	font-size: 12px;
	text-align: justify;
	margin-bottom: 0px;
}

/* service */
.sv02 h2 {
	font-size: 16px;
	padding-bottom: 15px;
}


/* solution */
.sl01 {
	text-align: center;
}

.sl01 h5 {
	font-size: 13px;
	margin-top: 15px;
}

.sl02 {
	background-color: #e1ebf4;
}

.sl021 p,
.sl023 p {
	/* text-align: justify; */
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 5;
	/*3表示只显示3行*/
	/* autoprefixer: off */
	-webkit-box-orient: vertical;
	/* autoprefixer: on */
}

.sl0211 {
	background-color: #fff;
	padding: 15px;
	border-radius: 10px;
	height: 350px;
	border: 1px solid #ccc;
}

.sl0211:hover,
.sl0221:hover,
.sl0232:hover {
	border: 1px solid var(--color-red);
}

.sl0212 {
	display: grid;
	place-items: center;
	height: 350px;
}

.sl0212 div,
.sl0222 div,
.sl0231 div {
	text-align: center;
}

.sl022,
.sl023 {
	margin-top: 100px;
}

.sl023 {

	padding-bottom: 100px;
}

.sl022 img {
	border-radius: 10px;
}

.sl0221 {
	border: 1px solid #ccc;
	border-radius: 10px;
	padding: 10px 0;
	background-color: #fff;
}

.sl0222,
.sl0231 {
	display: grid;
	place-items: center;
}

.sl0223 {
	display: grid;
	place-items: center;
}

.sl0232 {
	background-color: #fff;
	padding: 15px;
	border-radius: 10px;
	height: 350px;
	border: 1px solid #ccc;
}

.newsletter-widget .single_add_to_cart_button {
	background-color: var(--primary-color);
}

.newsletter-widget a {
	color: #fff;
	border-radius: 10px;
	border: 1px solid #fff;
}

.newsletter-widget a:hover {
	color: var(--primary-color);
	border: 1px solid var(--primary-color);
	background-color: var(--color-white);
}