/* ----------------------------------------------------------------------------------------
* Author        : Awaiken
* Template Name : Primecare - Dentist & Dental Clinic HTML Template
* File          : CSS File
* Version       : 1.0
* ---------------------------------------------------------------------------------------- */
/* INDEX
----------------------------------------------------------------------------------------
01. Global Variables
02. General css
03. Header css
04. Hero css
05. About Us css
06. Our Services css
07. Our Expertise css
08. Why Choose Us css
09. How It Work css
10. Our Testiminial css
11. Our Transformation css
12. Our FAQs css
13. Our Blog Post css
14. Book Appointment css
15. Footer css
16. About us Page css
17. Services Page css
18. Service Single css
19. Blog Archive css
20. Blog Single css
21. Page Doctor css
22. Doctor Single css
23. Gallery Page css
24. Testimonials Page css
25. Page FAQs css
26. Contact us Page css
27. Page Book Appointment css
28. 404 Page css
29. responsive css
-------------------------------------------------------------------------------------- */

/************************************/
/*** 	 01. Global Variables	  ***/
/************************************/

:root {
	--primary-color: #0B0B38;
	--secondary-color: #F8F8FF;
	--text-color: #555574;
	--accent-color: #5E5EEE;
	--white-color: #FFFFFF;
	--divider-color: #F0F0FF;
	--dark-divider-color: #FFFFFF26;
	--error-color: rgb(230, 87, 87);
	--default-font: "Plus Jakarta Sans", sans-serif;
}

/************************************/
/*** 	   02. General css		  ***/
/************************************/
a {
	text-decoration: none !important;
}
body {
	font-family: var(--default-font);
	font-size: 18px;
	font-weight: 500;
	line-height: 1.6em;
	background-color: var(--white-color);
	color: var(--text-color);
}

p {
	line-height: 1.8em;
	margin-bottom: 1.6em;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	font-weight: 700;
	line-height: 1.2em;
	color: var(--primary-color);
}

figure {
	margin: 0;
}

img {
	max-width: 100%;
}

a {
	text-decoration: none;
}

a:hover {
	text-decoration: none;
	outline: 0;
}

a:focus {
	text-decoration: none;
	outline: 0;
}

html,
body {
	width: 100%;
	overflow-x: clip;
}

.container {
	max-width: 1300px;
}

.container,
.container-fluid,
.container-lg,
.container-md,
.container-sm,
.container-xl,
.container-xxl,
.mfp-container {
	padding-right: 15px;
	padding-left: 15px;
}

.image-anime {
	position: relative;
	overflow: hidden;
}

.image-anime:after {
	content: "";
	position: absolute;
	width: 200%;
	height: 0%;
	left: 50%;
	top: 50%;
	background-color: rgba(255, 255, 255, .3);
	transform: translate(-50%, -50%) rotate(-45deg);
	z-index: 1;
}

.image-anime:hover:after {
	height: 250%;
	transition: all 600ms linear;
	background-color: transparent;
}

.reveal {
	position: relative;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	visibility: hidden;
	overflow: hidden;
}

.reveal img {
	height: 100%;
	width: 100%;
	-o-object-fit: cover;
	object-fit: cover;
	-webkit-transform-origin: left;
	transform-origin: left;
}

.row {
	margin-right: -15px;
	margin-left: -15px;
}

.row>* {
	padding-right: 15px;
	padding-left: 15px;
}

.row.no-gutters {
	margin-right: 0px;
	margin-left: 0px;
}

.row.no-gutters>* {
	padding-right: 0px;
	padding-left: 0px;
}

.btn-default {
	position: relative;
	display: inline-block;
	font-size: 16px;
	font-weight: 700;
	line-height: 1.2em;
	text-transform: capitalize;
	background: var(--accent-color);
	color: var(--white-color);
	border-radius: 100px;
	padding: 19px 60px 19px 30px;
	border: none;
	transition: all 0.5s ease-in-out;
	overflow: hidden;
	z-index: 1;
}

.btn-default:hover {
	background-color: var(--primary-color);
}

.btn-default::before {
	content: '';
	position: absolute;
	top: 50%;
	right: 0;
	width: 16px;
	height: 16px;
	border-radius: 50%;
	background-image: url('../images/icon-plus.svg');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 16px auto;
	transform: translate(-30px, -50%);
	transition: all 0.4s ease-in-out;
}

.btn-default:hover::before {
	transform: translate(-30px, -50%) rotate(45deg);
}

.btn-default::after {
	content: '';
	position: absolute;
	width: 100%;
	height: 0;
	top: 50%;
	left: 50%;
	background: var(--primary-color);
	opacity: 0;
	z-index: -1;
	-webkit-transform: translateX(-50%) translateY(-50%) rotate(45deg);
	-moz-transform: translateX(-50%) translateY(-50%) rotate(45deg);
	-ms-transform: translateX(-50%) translateY(-50%) rotate(45deg);
	transform: translateX(-50%) translateY(-50%) rotate(45deg);
	transition: all 0.6s ease-in-out;
}

.btn-default:hover:after {
	height: 450%;
	opacity: 1;
}

.btn-default.btn-highlighted {
	background-color: transparent;
	border: 1px solid var(--white-color);
	color: var(--white-color);
	padding: 18px 60px 18px 30px;
}

.btn-default.btn-border {
	border: 1px solid transparent;
	padding: 18px 60px 18px 30px;
}

.btn-default.btn-border:hover {
	border-color: var(--white-color);
}

#magic-cursor {
	position: absolute;
	width: 10px !important;
	height: 10px !important;
	pointer-events: none;
	z-index: 1000000;
}

#ball {
	position: fixed;
	display: block;
	left: 0;
	top: 0;
	transform: translate(-50%, -50%);
	width: 8px !important;
	height: 8px !important;
	background: var(--accent-color);
	margin: 0;
	border-radius: 50%;
	pointer-events: none;
	opacity: 1 !important;
}

.preloader {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1000;
	background-color: var(--accent-color);
	display: flex;
	align-items: center;
	justify-content: center;
}

.loading-container,
.loading {
	height: 100px;
	position: relative;
	width: 100px;
	border-radius: 100%;
}

.loading-container {
	margin: 40px auto;
}

.loading {
	border: 1px solid transparent;
	border-color: transparent var(--white-color) transparent var(--white-color);
	animation: rotate-loading 1.5s linear 0s infinite normal;
	transform-origin: 50% 50%;
}

.loading-container:hover .loading,
.loading-container .loading {
	transition: all 0.5s ease-in-out;
}

#loading-icon {
	position: absolute;
	top: 50%;
	left: 50%;
	max-width: 66px;
	transform: translate(-50%, -50%);
}

@keyframes rotate-loading {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

.section-row {
	margin-bottom: 80px;
}

.section-row .section-title {
	margin-bottom: 0;
}

.section-title-content p {
	margin: 0;
}

.section-btn {
	text-align: end;
}

.section-title {
	position: relative;
	margin-bottom: 50px;
}

.section-title h3 {
	display: inline-block;
	position: relative;
	font-size: 14px;
	font-weight: 700;
	line-height: 1.2em;
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--accent-color);
	padding-left: 28px;
	margin-bottom: 20px;
	text-align: center !important;
	align-items: center;
}

.section-title h3::before {
	content: '';
	position: absolute;
	top: 50%;
	bottom: 0;
	left: 0;
	transform: translateY(-50%);
	/* background: url("../images/icon-sub-heading.svg") no-repeat; */
	background: url(../images/titleicon.png)no-repeat;
	background-position: left center;
	background-size: cover;
	width: 18px;
	height: 18px;
}

.section-title h1 {
	font-size: 54px;
	font-weight: 700;
	margin-bottom: 0;
}

.section-title h2 {
	font-size: 46px;
	font-weight: 700;
	margin-bottom: 0;
}

.section-title p {
	margin-top: 30px;
	margin-bottom: 0;
}

.help-block.with-errors ul {
	margin: 0;
	text-align: left;
}

.help-block.with-errors ul li {
	color: var(--error-color);
	font-weight: 500;
	font-size: 14px;
}

/************************************/
/**** 	   03. Header css		 ****/
/************************************/

header.main-header {
	position: fixed;
	top: 0;
	width: 100%;
	background-color: var(--white-color);
	z-index: 100;

}

header.main-header .header-sticky {
	position: relative;
	top: 0;
	z-index: 100;
}

header.main-header .header-sticky.hide {
	transform: translateY(-100%);
	transition: transform 0.3s ease-in-out;
	border-radius: 0;
}

header.main-header .header-sticky.active {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	border-radius: 0;
	transform: translateY(0);
	background-color: var(--secondary-color);
	border-bottom: 1px solid var(--divider-color);
}

.navbar {
	padding: 7px 0;
	align-items: center;
}

.navbar-brand {
	padding: 0;
	margin: 0;

	align-items: center;
	text-align: center;
	justify-content: center;
	align-self: center;
}

.navbar-brand img {
	margin: 0;
	width: 200px;
	height: 95px;
}

/* Ensure the logo doesn't get compressed between 992px and 1200px */
@media (min-width: 992px) and (max-width: 1200px) {
    .navbar-brand img {
        width: 120px !important; /* Keeps the width proportionate */
        height: 50px; /* Fixed height */
    }
}

.main-menu .nav-menu-wrapper {
	flex: 1;
	text-align: center;
}

.main-menu .nav-menu-wrapper>ul {
	align-items: center;
	display: inline-flex;
}

.main-menu ul li {
	margin: 0 4px;
	position: relative;
}

.main-menu ul li a {
	font-size: 16px;
	font-weight: 500;
	padding: 13px !important;
	color: var(--primary-color);
	text-transform: capitalize;
	transition: all 0.3s ease-in-out;
}

.main-menu ul li.submenu>a:after {
	content: '\f107';
	font-family: 'Font Awesome 5 Free';
	/* for FA5 */
	font-weight: 900;
	font-size: 14px;
	margin-left: 8px;
}

.main-menu ul li a:hover,
.main-menu ul li a:focus {
	color: var(--accent-color);
}

.main-menu ul ul {
	visibility: hidden;
	opacity: 0;
	transform: scaleY(0.8);
	transform-origin: top;
	padding: 0;
	margin: 0;
	list-style: none;
	width: 330px;
	border-radius: 20px;
	position: absolute;
	left: 0;
	top: 100%;
	background-color: var(--accent-color);
	transition: all 0.3s ease-in-out;
	text-align: left;
}

.main-menu ul li.submenu ul li.submenu>a:after {
	content: '\f105';
	float: right;
}

.main-menu ul li.submenu:first-child ul {
	width: 220px;
}

.main-menu ul ul ul {
	left: 100%;
	top: 0;
	text-align: left;
}

.main-menu ul ul li {
	margin: 0;
	padding: 0;
}

.main-menu ul ul li a {
	color: var(--white-color);
	padding: 8px 20px !important;
	transition: all 0.3s ease-in-out;
}

.main-menu ul li:hover>ul {
	visibility: visible;
	opacity: 1;
	transform: scaleY(1);
	padding: 5px 0;
}

.main-menu ul ul li a:hover,
.main-menu ul ul li a:focus {
	color: lightgreen;
	background-color: transparent;
	padding: 8px 20px 8px 26px !important;
}

.contact-now-box {
	display: flex;
	align-items: center;
}

.contact-now-box .icon-box {
	background-color: var(--accent-color);
	border-radius: 50%;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 15px;
	transition: all 0.3s ease-in-out;
}

.contact-now-box:hover .icon-box {
	background-color: var(--primary-color);
}

.contact-now-box .icon-box img {
	max-width: 20px;
}

.contact-now-box-content {
	width: calc(100% - 55px);
}

.contact-now-box-content p {
	line-height: normal;
	text-transform: capitalize;
	margin-bottom: 5px;
}

.contact-now-box-content h3 {
	font-size: 18px;
}

.responsive-menu,
.navbar-toggle {
	display: none;
}

.responsive-menu {
	top: 0;
	position: relative;
}

.slicknav_btn {
	background: var(--accent-color);
	padding: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 38px;
	height: 38px;
	margin: 0;
	border-radius: 10px;
}

.slicknav_icon .slicknav_icon-bar {
	display: block;
	width: 100%;
	height: 3px;
	width: 22px;
	background-color: var(--white-color);
	border-radius: 6px;
	margin: 4px auto !important;
	transition: all 0.1s ease-in-out;
}

.slicknav_icon .slicknav_icon-bar:first-child {
	margin-top: 0 !important;
}

.slicknav_icon .slicknav_icon-bar:last-child {
	margin-bottom: 0 !important;
}

.navbar-toggle a.slicknav_btn.slicknav_open .slicknav_icon span.slicknav_icon-bar:nth-child(1) {
	transform: rotate(-45deg) translate(-5px, 5px);
}

.navbar-toggle a.slicknav_btn.slicknav_open .slicknav_icon span.slicknav_icon-bar:nth-child(2) {
	opacity: 0;
}

.navbar-toggle a.slicknav_btn.slicknav_open .slicknav_icon span.slicknav_icon-bar:nth-child(3) {
	transform: rotate(45deg) translate(-5px, -5px);
}

.slicknav_menu {
	position: absolute;
	width: 100%;
	padding: 0;
	background: var(--accent-color);
	border-radius: 0;
	
}

.slicknav_menu ul {
	margin: 5px 0;
}

.slicknav_menu ul ul {
	margin: 0;
}

.slicknav_nav .slicknav_row,
.slicknav_nav li a {
	position: relative;
	font-size: 16px;
	font-weight: 500;
	text-transform: capitalize;
	padding: 10px 20px;
	color: var(--white-color);
	line-height: normal;
	margin: 0;
	border-radius: 0 !important;
	transition: all 0.3s ease-in-out;
}

.slicknav_nav a:hover,
.slicknav_nav a:focus,
.slicknav_nav .slicknav_row:hover {
	background-color: transparent;
	color: var(--primary-color);
}

.slicknav_menu ul ul li a {
	padding: 10px 20px 10px 30px;
}

.slicknav_arrow {
	font-size: 0 !important;
}

.slicknav_arrow:after {
	content: '\f107';
	font-family: 'FontAwesome';
	font-weight: 900;
	font-size: 12px;
	margin-left: 8px;
	color: var(--white-color);
	position: absolute;
	right: 15px;
	top: 15px;
	transition: all 0.3s ease-out;
}

.slicknav_open>a .slicknav_arrow:after {
	transform: rotate(-180deg);
	color: var(--primary-color);
}


.submenu .nav-item .active {
	color: lightgreen !important
}

/************************************/
/***        04. Hero css	      ***/
/************************************/

.hero {
	position: relative;
	padding-bottom: 86px;
	padding-top: 30px
}

.hero .hero-section {
	background: url(../images/hero-bg.svg), linear-gradient(90deg, #2C2C66 -10.82%, #0B0B38 56.59%) no-repeat;
	background-position: left center;
	background-size: contain;
	padding: 100px 0 186px;
}

.hero.bg-image .hero-section {
	position: relative;
	background: url('../images/hero-bg.jpg') no-repeat;
	background-position: center center;
	background-size: cover;
	padding: 150px 0 236px;
}

.hero.bg-image .hero-section::before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: var(--primary-color);
	opacity: 50%;
	width: 100%;
	height: 100%;
}

.hero.bg-image .hero-section .hero-content {
	max-width: 900px;
	margin: 0 auto;
	text-align: center;
}

.hero.bg-image .hero-section .hero-content .section-title h1 {
	font-size: 80px;
}

.hero.bg-image .hero-section.hero-slider-layout {
	background: none;
	padding: 0;
}

.hero-section.hero-slider-layout .hero-slide {
	position: relative;
	padding: 150px 0 236px;
}

.hero.bg-image .hero-section .hero-slide::before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: var(--primary-color);
	opacity: 50%;
	width: 100%;
	height: 100%;
	z-index: 1;
}

.hero-section.hero-slider-layout .hero-slide .hero-slider-image {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
}

.hero-section.hero-slider-layout .hero-slide .hero-slider-image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hero-section.hero-slider-layout .hero-slide .hero-content {
	position: relative;
	z-index: 2;
}

.hero-section.hero-slider-layout .hero-pagination {
	position: absolute;
	bottom: 120px;
	text-align: center;
	z-index: 2;
}

.hero-section.hero-slider-layout .hero-pagination .swiper-pagination-bullet {
	width: 12px;
	height: 12px;
	background: var(--white-color);
	opacity: 1;
	transition: all 0.3s ease-in-out;
	margin: 0 5px;
}

.hero-section.hero-slider-layout .hero-pagination .swiper-pagination-bullet-active {
	background-color: var(--accent-color);
}

.hero-section.hero-video {
	position: relative;
	overflow: hidden;
}

.hero-section.hero-video::before {
	content: '';
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	background-color: var(--primary-color);
	opacity: 70%;
	width: 100%;
	height: 100%;
	z-index: 1;
}

.hero-section.hero-video .hero-bg-video {
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
}

.hero-section.hero-video .hero-bg-video video {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.hero-section.hero-video .hero-content {
	position: relative;
	z-index: 1;
}

.hero-content .section-title {
	margin-bottom: 40px;
}

.hero-content .section-title p,
.hero-content .section-title h1 {
	color: var(--white-color);
}

.hero-content .section-title h1 img {
	max-width: 129px;
	border-radius: 100px;
}

.hero-content-body {
	border-top: 1px solid var(--dark-divider-color);
	border-bottom: 1px solid var(--dark-divider-color);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 60px;
	padding: 25px 0;
	margin-bottom: 40px;
}

.hero-counter-box {
	width: calc(33.33% - 40px);
}

.hero-counter-box h2 {
	font-size: 40px;
	font-weight: 600;
	color: var(--white-color);
	margin-bottom: 20px;
}

.hero-counter-box p {
	text-transform: capitalize;
	line-height: 1.4em;
	color: var(--white-color);
	margin: 0;
}

.hero-content-footer .btn-default {
	padding: 19px 30px 19px 70px;
	margin-right: 30px;
}

.hero-content-footer .btn-default::before {
	left: 0;
	right: auto;
	width: 24px;
	height: 24px;
	background-image: url(../images/icon-phone.svg);
	background-size: 24px auto;
	transform: translate(30px, -50%);
}

.hero-content-footer .btn-default.btn-highlighted {
	padding: 18px 30px 18px 60px;
	margin-right: 0px;
}

.hero-content-footer .btn-default.btn-highlighted::before {
	background-image: url(../images/icon-plus.svg);
	width: 16px;
	height: 16px;
	background-size: 16px auto;
}

.hero-content-footer .btn-default.btn-highlighted:hover:before {
	transform: translate(30px, -50%) rotate(45deg);
}

.hero-image {
	position: relative;
	padding-left: 80px;
}

.hero-img figure {
	display: block;
	border-radius: 40px;
}

.hero-img img {
	width: 100%;
	aspect-ratio: 1 / 1.12;
	object-fit: cover;
	border-radius: 40px;
}

.hero .hero-section .container .row{
	display:flex;
}
.hero-image {
	order: 1 !important;
	/* Display hero image first */
}

.hero-content {
	order: 0 !important;
	/* Display hero content second */
}

/* For screens smaller than 989px, stack the image and content vertically */
@media (max-width: 989px) {
	.hero .hero-section .container .row{
		flex-direction: column;
		padding-top: 80px !important
	}

	.hero .hero-section .container .row .herocontent{
		order: 1 !important;
		/* Ensure image is first */
		margin-bottom: 20px;
		/* Add some spacing after the image */
	}

	.hero .hero-section .container .row .heroimage{
		margin-bottom:80px;
		order: 0 !important;
		/* Ensure content is second */
	}
}

.company-service-rating {
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	max-width: 275px;
	background: rgba(243, 242, 242, 0.15);
	/* Adjust opacity as needed */
	border-radius: 15px;
	padding: 20px;
	backdrop-filter: blur(5px);
	/* Adjust blur effect as needed */
	/* border: 1px solid rgba(255, 255, 255, 0.2); */
	border: 1px solid white;
	/* Light border for glass effect */
	animation: serviceratingmoveobject 5s infinite linear alternate;

}

@keyframes serviceratingmoveobject {
	50% {
		left: 60px;
	}
}

.company-rating-icon {
	margin-bottom: 10px;
}

.company-rating-icon ul {
	padding: 0;
	margin: 0;
	list-style: none;
}

.company-rating-icon ul li {
	display: inline-block;
}

.company-rating-icon ul li i {
	font-size: 16px;
	/* color: var(--accent-color); */
	color: greenyellow
}

.company-rating-content h3 {
	font-size: 18px;
	font-weight: 600;
	text-transform: capitalize;
	margin-bottom: 10px;
	color: white
}

.company-rating-content p {
	line-height: 1.4em;
	margin: 0;
	color: whitesmoke
}

.our-cta-box {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	margin: 0 15px;
	z-index: 2;
}

.cta-content-box {
	background-color: var(--white-color);
	border: 1px solid var(--divider-color);
	box-shadow: 0px 10px 30px 0px #00000008;
	border-radius: 40px;
	padding: 50px;
}

.cta-item {
	border-right: 1px solid var(--divider-color);
	display: flex;
	align-items: center;
	padding-right: 15px;
}

.cta-item .icon-box {
	position: relative;
	background-color: var(--accent-color);
	border-radius: 15px;
	width: 70px;
	height: 70px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	margin-right: 15px;
	transition: all 0.5s ease-in-out;
	color: white !important;
	font-size: 45px
}

.cta-item:hover .icon-box {
	background-color: var(--primary-color);
}

.cta-item .icon-box::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	background: var(--primary-color);
	color: white !important;
	border-radius: 15px;
	width: 100%;
	height: 100%;
	transform: scale(0);
	transition: all 0.4s ease-in-out;
}

.cta-item:hover .icon-box:before {
	transform: scale(1);
}

.cta-item .icon-box img {
	position: relative;
	max-width: 34px;
	z-index: 1;
}

.cta-item-content {
	width: calc(100% - 85px);
}

.cta-item-content h3 {
	font-size: 20px;
	font-weight: 600;
	text-transform: capitalize;
	margin-bottom: 10px;
}

.cta-item-content p {
	margin: 0;
}

.cta-btn {
	text-align: center;
}

/************************************/
/***       05. About Us css	      ***/
/************************************/

.about-us {
	padding: 100px 0;
}

.about-img figure {
	display: block;
	mask-image: url(../images/about-image-bg-shape.svg);
	background-image: url(../images/about-image-bg-shape.svg);
	mask-size: cover;
	mask-position: center center;
	mask-repeat: no-repeat;
	width: 100%;
	height: 100%;
}

.about-image {
	position: relative;
	margin-right: 30px;
}

.about-img img {
	width: 100%;
	height: 100%;
}

.company-experience {
	position: absolute;
	bottom: 0;
	right: 0;
	background: url('../images/about-counter-bg.jpg') no-repeat;
	background-position: center center;
	background-size: cover;
	border-radius: 30px;
	display: flex;
	align-items: center;
	width: 192px;
	height: 214px;
	overflow: hidden;
	padding: 20px;
}

.company-experience::before {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: var(--primary-color);
	opacity: 90%;
	width: 100%;
	height: 100%;
}

.company-experience-box {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
}

.company-experience-counter {
	position: relative;
	text-align: center;
	margin-bottom: 5px;
	z-index: 1;
}

.company-experience-counter h2 {
	font-size: 60px;
	color: var(--white-color);
}

.company-experience-content {
	position: relative;
	text-align: center;
	z-index: 1;
}

.company-experience-content p {
	color: var(--white-color);
	margin: 0;
}

.about-us-body {
	border-top: 1px solid var(--divider-color);
	border-bottom: 1px solid var(--divider-color);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	gap: 50px;
	padding: 25px 0;
	margin-bottom: 40px;
}

.about-body-item {
	width: calc(50% - 25px);
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 20px;
}

.about-counter {
	width: calc(40% - 10px);
}

.about-counter h2 {
	font-size: 40px;
	font-weight: 600;
	color: var(--accent-color);
}

.about-counter-content {
	width: calc(60% - 10px);
}

.about-counter-content p {
	text-transform: capitalize;
	margin: 0;
	font-size: large;
	font-weight: bold
}

.about-us-footer {
	display: flex;
	align-items: center;
}

.about-us-footer-btn {
	margin-right: 50px;
	line-height: normal;
}

.about-company-founder {
	display: flex;
	align-items: center;
}

.company-founder-image {
	margin-right: 20px;
}

.company-founder-image img {
	width: 60px;
	height: 60px;
	border-radius: 50%;
}

.company-founder-content {
	width: calc(100% - 80px);
}

.company-founder-content h3 {
	font-size: 20px;
	font-weight: 600;
	text-transform: capitalize;
	margin-bottom: 5px;
}

.company-founder-content p {
	text-transform: capitalize;
	margin: 0;
}

/************************************/
/***      06. Our Services css	  ***/
/************************************/

.our-service {
	background: linear-gradient(180deg, var(--secondary-color) 70%, var(--white-color) 30%);
	padding: 100px 0 20px;
}

.service-item {
	background-color: var(--white-color);
	box-shadow: 0px 10px 30px 0px #00000008;
	border: 1px solid var(--divider-color);
	border-radius: 40px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	padding: 40px;
}

.service-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-bottom: 1px solid var(--divider-color);
	padding-bottom: 20px;
	margin-bottom: 20px;
}

.service-item-box {
	display: flex;
	align-items: center;
}

.service-item-box .icon-box {
	position: relative;
	background-color: var(--accent-color);
	border-radius: 10px;
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	margin-right: 15px;
	transition: all 0.5s ease-in-out;
	color: white !important
}

.service-item-box .icon-box::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	background: var(--primary-color);
	border-radius: 10px;
	width: 100%;
	height: 100%;
	transform: scale(0);
	transition: all 0.4s ease-in-out;
}

.service-item:hover .service-item-box .icon-box::before {
	transform: scale(1);
}

.service-item-box .icon-box img {
	position: relative;
	max-width: 38px;
	z-index: 1;
}

.service-item-content {
	width: calc(100% - 65px);
}

.service-item-content h3 {
	font-size: 20px;
	font-weight: 600;
	text-transform: capitalize;
}

.service-readmore {
	margin-left: 10px;
}

.service-readmore img {
	max-width: 30px;
	transition: all 0.3s ease-in-out;
}

.service-item:hover .service-readmore img {
	transform: rotate(45deg);
}

.service-body {
	margin-bottom: 30px;
}

.service-body p {
	margin: 0;
}

.service-image {
	border-radius: 40px;
	overflow: hidden;
}

.service-image img {
	aspect-ratio: 1 / 0.67;
	object-fit: cover;
	border-radius: 40px;
	transition: all 0.5s ease-out;
}

.service-item:hover .service-image img {
	transform: scale(1.1)
}

/************************************/
/***     07. Our Expertise css	  ***/
/************************************/

.our-expertise {
	padding: 50px 0 100px;
}

.expertise-content .section-title {
	border-bottom: 1px solid var(--divider-color);
	padding-bottom: 40px;
	margin-bottom: 40px;
}

.expertise-list-box {
	margin-bottom: 30px;
}

.expertise-list-box:last-child {
	margin-bottom: 0;
}

.expertise-list-title {
	margin-bottom: 20px;
}

.expertise-list-title h3 {
	position: relative;
	font-size: 20px;
	font-weight: 600;
	padding-left: 35px;
}

.expertise-list-title h3::before {
	content: '\f14a';
	position: absolute;
	font-family: 'FontAwesome';
	left: 0;
	top: 50%;
	transform: translateY(-50%);
	width: 24px;
	height: 24px;
	color: var(--accent-color);
}

.expertise-list-content p {
	margin: 0;
}

.expertise-image {
	position: relative;
	background: url('../images/expertise-image-bg.svg') no-repeat;
	background-position: center center;
	background-size: auto;
	border-radius: 40px;
	display: flex;
	flex-wrap: wrap;
	align-items: start;
	gap: 30px;
}

.expertise-img-1 {
	width: calc(50% - 15px);
}

.expertise-img-2 {
	padding-top: 165px;
	width: calc(50% - 15px);
}

.expertise-img-1 img figure,
.expertise-img-2 img figure {
	display: block;
	border-radius: 40px;
}

.expertise-img-1 img,
.expertise-img-2 img {
	aspect-ratio: 1 / 1.29;
	object-fit: cover;
	border-radius: 40px;
}

.expert-doctor {
	position: absolute;
	bottom: 0;
	left: 0;
	background-color: var(--white-color);
	box-shadow: 10px 0px 36.8px -4px #0000001A;
	border: 1px solid var(--divider-color);
	border-radius: 15px;
	display: flex;
	align-items: center;
	width: 100%;
	max-width: 300px;
	padding: 25px;
	animation: doctormoveobject 3s infinite linear alternate;
}

@keyframes doctormoveobject {
	50% {
		left: 40px;
	}
}

.expert-doctor .icon-box {
	background-color: var(--accent-color);
	border-radius: 50%;
	width: 60px;
	height: 60px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 20px;
	transition: all 0.3s ease-in-out;
}

.expert-doctor:hover .icon-box {
	background-color: var(--primary-color);
}

.expert-doctor .icon-box img {
	max-width: 30px;
}

.expert-doctor-content {
	width: calc(100% - 80px);
}

.expert-doctor-content h3 {
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 5px;
}

.expert-doctor-content p {
	text-transform: capitalize;
	margin: 0;
}

/************************************/
/***     08. Why Choose Us css	  ***/
/************************************/

.why-choose-us {
	background: var(--primary-color) url('../images/why-choose-us-bg.svg') no-repeat;
	background-position: center center;
	background-size: cover;
	padding: 100px 0 0;
}

.why-choose-content .section-title p,
.why-choose-content .section-title h2,
.why-choose-content .section-title h3 {
	color: var(--white-color);
}

.why-choose-content .section-title h3::before {
	filter: brightness(0) invert(1);
}

.why-choose-image img {
	width: 100%;
	aspect-ratio: 1 / 1.42;
	object-fit: cover;
}

.why-choose-item {
	border-bottom: 1px solid var(--dark-divider-color);
	display: flex;
	padding-bottom: 30px;
	margin-bottom: 30px;
}

.why-choose-item:last-child {
	border-bottom: none;
	padding-bottom: 0px;
	margin-bottom: 0px;
}

.why-choose-item .icon-box {
	position: relative;
	background-color: var(--accent-color);
	border-radius: 10px;
	width: 50px;
	height: 50px;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	margin-right: 20px;
	transition: all 0.5s ease-in-out;
}

.why-choose-item .icon-box::before {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	background: var(--white-color);
	border-radius: 10px;
	width: 100%;
	height: 100%;
	transform: scale(0);
	transition: all 0.4s ease-in-out;
}

.why-choose-item:hover .icon-box::before {
	transform: scale(1);
}

.why-choose-item .icon-box img {
	position: relative;
	max-width: 35px;
	z-index: 1;
	transition: all 0.3s ease-in-out;
}

.why-choose-item:hover .icon-box img {
	filter: brightness(1) invert(1);
}

.why-choose-item-content {
	width: calc(100% - 70px);
}

.why-choose-item-content h3 {
	font-size: 20px;
	font-weight: 600;
	text-transform: capitalize;
	color: var(--white-color);
	margin-bottom: 5px;
}

.why-choose-item-content p {
	color: var(--white-color);
	margin: 0;
}

/************************************/
/***      09. How It Work css	  ***/
/************************************/

.how-it-work {
	padding: 100px 0;
}

.how-work-image {
	position: relative;
	display: flex;
	flex-wrap: wrap;
	gap: 15px;
	margin-right: 30px;
}

.how-work-img-2,
.how-work-img-1 {
	width: calc(50% - 7.5px);
}

.how-work-img-3 {
	width: 100%;
}

.how-work-img-3 figure,
.how-work-img-2 figure,
.how-work-img-1 figure {
	display: block;
	width: 100%;
	border-radius: 20px;
}

.how-work-img-3 img,
.how-work-img-2 img,
.how-work-img-1 img {
	width: 100%;
	border-radius: 20px;
}

.how-work-img-2 img,
.how-work-img-1 img {
	aspect-ratio: 1 / 1.09;
	object-fit: cover;
}

.how-work-img-3 img {
	aspect-ratio: 1 / 0.49;
	object-fit: cover;
}

.doctor-work-img-box {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.doctor-work-img-box figure {
	background-color: var(--secondary-color);
	border: 10px solid var(--white-color);
	border-radius: 40px;
	padding: 5px 6px;

}

.doctor-work-img-box img {
	max-width: 158px;
	/* border-radius: 40px; */
	height: 80px
}

.faq-accordion.how-work-accordion .accordion-item {
	margin-bottom: 30px;
	padding-bottom: 30px;
	background-color: var(--white-color);
	border-bottom: 1px solid var(--divider-color);
}

.faq-accordion.how-work-accordion .accordion-item:last-child {
	margin-bottom: 0;
	padding-bottom: 0;
	border: none;
}

.faq-accordion.how-work-accordion .accordion-header .accordion-button {
	font-size: 20px;
	font-weight: 600;
	background-color: transparent;
	color: var(--primary-color);
	padding: 0px 25px 0 45px;
	border: none;
	position: relative;
	transition: all 0.3s ease-in-out;
}

.faq-accordion.how-work-accordion .accordion-header .accordion-button span {
	position: absolute;
	left: 0;
	top: -3px;
	bottom: auto;
	transform: translateY(50%);
	font-size: 20px;
	line-height: 1em;
	color: var(--primary-color);
	transition: all 0.3s ease-in-out;
}

.faq-accordion.how-work-accordion .accordion-button:not(.collapsed) span {
	color: var(--primary-color);
}

.faq-accordion.how-work-accordion .accordion-button:not(.collapsed) {
	color: var(--primary-color);
}

.faq-accordion.how-work-accordion .accordion-header .accordion-button.collapsed {
	color: var(--primary-color);
}

.faq-accordion.how-work-accordion .accordion-item .accordion-button::after,
.faq-accordion.how-work-accordion .accordion-item .accordion-button.collapsed::after {
	content: '\f068';
	font-family: "Font Awesome 6 Free";
	position: absolute;
	right: 0;
	top: 50%;
	bottom: auto;
	transform: translate(0px, -50%);
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 900;
	font-size: 20px;
	width: 20px;
	height: 20px;
	padding: 0px;
	color: var(--primary-color);
}

.faq-accordion.how-work-accordion .accordion-item .accordion-button.collapsed::after {
	content: '\f067';
	color: var(--primary-color);
}

.faq-accordion.how-work-accordion .accordion-item .accordion-body {
	padding: 20px 25px 0px 45px;
}

.faq-accordion.how-work-accordion .accordion-item .accordion-body p {
	color: var(--text-color);
	margin-bottom: 20px;
}

.faq-accordion.how-work-accordion .accordion-item .accordion-body p:last-child {
	margin-bottom: 0;
}

/************************************/
/***    10. Our Testiminial css	  ***/
/************************************/

.our-testimonials {
	background: url('../images/testimonial-bg.png'), linear-gradient(180deg, var(--primary-color) 60%, var(--white-color) 40%);
	background-position: center center;
	background-size: auto;
	padding: 100px 0 50px;
}

.our-testimonials .section-title h2 {
	color: var(--white-color);
}

.testimonial-slider {
	background-color: var(--white-color);
	box-shadow: 0px 12px 37.1px 0px #0000000D;
	border: 1px solid var(--divider-color);
	border-radius: 40px;
	padding: 100px;
}

.testimonial-header {
	margin-bottom: 50px;
}

.testimonial-quote {
	margin-bottom: 30px;
}

.testimonial-quote img {
	max-width: 50px;
}

.testimonial-content p {
	font-size: 20px;
	font-weight: 600;
	margin: 0;
}

.testimonial-body {
	display: inline-flex;
	align-items: center;
}

.author-image {
	margin-right: 20px;
}

.author-image img {
	width: 60px;
	height: 60px;
	border-radius: 50%;
}

.author-content {
	text-align: left;
	width: calc(100% - 80px);
}

.author-content h3 {
	font-size: 20px;
	font-weight: 600;
	text-transform: capitalize;
	margin-bottom: 5px;
}

.author-content p {
	text-transform: capitalize;
	margin: 0;
}

.testimonial-btn {
	position: absolute;
	bottom: 0;
	right: 0;
	display: flex;
	align-items: center;
	justify-content: right;
	margin-top: 30px;
	z-index: 1;
}

.testimonial-slider .testimonial-button-next,
.testimonial-slider .testimonial-button-prev {
	position: relative;
	width: 45px;
	height: 45px;
	background-color: var(--accent-color);
	border-radius: 10px;
	transition: all 0.4s ease-in-out;
}

.testimonial-slider .testimonial-button-next {
	margin-left: 30px;
}


.testimonial-slider .testimonial-button-next:hover,
.testimonial-slider .testimonial-button-prev:hover {
	background-color: var(--primary-color);
}

.testimonial-slider .testimonial-button-next::before,
.testimonial-slider .testimonial-button-prev::before {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: url("../images/arrow-white.svg") no-repeat center center;
	background-size: 16px auto;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.4s ease-in-out;
}

.testimonial-slider .testimonial-button-prev::before {
	transform: rotate(180deg);
}

/************************************/
/***  11. Our Transformation css  ***/
/************************************/

.our-transformation {
	padding: 50px 0 70px;
}

.transformation_image {
	margin-bottom: 30px;
}

.transformation_image img {
	width: 100%;
	aspect-ratio: 1 / 0.71;
	object-fit: cover;
	border-radius: 40px;
}

/************************************/
/***       12. Our fAQs css       ***/
/************************************/

.our-faqs {
	background-color: var(--secondary-color);
	padding: 100px 0;
}

.our-faqs-content {
	margin-right: 30px;
}

.section-cta-box {
	background-color: var(--white-color);
	border-radius: 40px;
	display: inline-flex;
	padding: 40px;
}

.section-cta-box .icon-box {
	margin-right: 30px;
}

.section-cta-box .icon-box img {
	max-width: 60px;
}

.section-cta-content {
	width: calc(100% - 90px);
}

.section-cta-content p {
	margin-bottom: 10px;
}

.section-cta-content h3 {
	font-size: 22px;
	font-weight: 600;
	margin-bottom: 10px;
}

.our-faq-section .accordion-item {
	border-radius: 20px;
	margin-bottom: 25px;
	padding: 0;
	transition: all 0.3s ease-in-out;
	overflow: hidden;
}

.our-faq-section .accordion-item:last-child {
	margin-bottom: 0;
}

.our-faq-section .accordion-header .accordion-button {
	font-size: 20px;
	font-weight: 600;
	line-height: 1.2em;
	background-color: var(--accent-color);
	color: var(--white-color);
	padding: 20px 50px 20px 20px;
	transition: all 0.3s ease-in-out;
}

.our-faq-section .accordion-button:not(.collapsed) {
	background-color: var(--accent-color);
	color: var(--white-color);
	border-bottom: 1px solid var(--dark-divider-color);
}

.our-faq-section .accordion-header .accordion-button.collapsed {
	background-color: var(--white-color);
	color: var(--primary-color);
}

.our-faq-section .accordion-item .accordion-button::after,
.our-faq-section .accordion-item .accordion-button.collapsed::after {
	content: '\f068';
	font-family: "Font Awesome 6 Free";
	position: absolute;
	right: 20px;
	top: 50%;
	bottom: auto;
	transform: translate(0px, -10px);
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 900;
	font-size: 20px;
	width: 20px;
	height: 20px;
	padding: 5px;
	color: var(--white-color);
}

.our-faq-section .accordion-item .accordion-button.collapsed::after {
	content: '\f067';
	color: var(--primary-color);
}

.our-faq-section .accordion-item .accordion-body {
	background-color: var(--accent-color);
	padding: 20px 50px 20px 20px;
}

.our-faq-section .accordion-item .accordion-body p {
	color: var(--white-color);
	margin: 0;
}

/************************************/
/***     13. Our Blog Post css	  ***/
/************************************/

.our-blog {
	padding: 100px 0 70px;
}

.blog-item {
	background-color: var(--white-color);
	border: 1px solid var(--divider-color);
	box-shadow: 0px 10px 30px 0px #00000008;
	border-radius: 40px;
	display: flex;
	align-items: center;
	height: calc(100% - 30px);
	margin-bottom: 30px;
}

.blog-item .post-featured-image {
	width: 50%;
	height: 100%;
}

.blog-item .post-featured-image figure {
	height: 100%;
}

.blog-item .post-featured-image a {
	height: 100%;
	cursor: none;
	display: block;
	border-radius: 40px 0 0 40px;
	overflow: hidden;
}

.blog-item .post-featured-image img {
	width: 100%;
	height: 100%;
	aspect-ratio: 1 / 1.03;
	object-fit: cover;
	border-radius: 40px 0 0 40px;
	transition: all 0.5s ease-in-out;
}

.blog-item:hover .post-featured-image img {
	transform: scale(1.1);
}

.post-item-body {
	display: flex;
	width: 50%;
	flex-wrap: wrap;
	align-items: center;
	padding: 20px;
}

.post-item-content {
	margin-bottom: 20px;
}

.post-item-content h3 {
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 20px;
}

.post-item-content h3 a {
	color: inherit;
}

.post-item-content p {
	margin: 0;
}

.post-readmore-btn a {
	position: relative;
	font-weight: 700;
	text-transform: capitalize;
	color: var(--accent-color);
	transition: all 0.3s ease-in-out;
	padding-right: 26px;
}

.post-readmore-btn a::before {
	content: '';
	position: absolute;
	top: 50%;
	right: 0;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background-image: url(../images/icon-plus-accent.svg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	transform: translate(0px, -50%);
	transition: all 0.4s ease-in-out;
}

.post-readmore-btn a:hover:before {
	transform: translate(0px, -50%) rotate(45deg);
	filter: brightness(3) invert(1);
}

.post-readmore-btn a:hover {
	color: var(--primary-color);
}

/************************************/
/***   14. Book Appointment css	  ***/
/************************************/

.book-appointment {
	background-color: var(--secondary-color);
	padding: 100px 0;
}

.working-time-box {
	background-color: var(--primary-color);
	border-radius: 40px;
	padding: 40px;
	margin-bottom: 40px;
}

.working-box-title {
	border-bottom: 1px solid var(--dark-divider-color);
	padding-bottom: 30px;
	margin-bottom: 30px;
}

.working-box-title h3 {
	font-size: 20px;
	font-weight: 600;
	text-transform: capitalize;
	color: var(--white-color);
}

.working-time-list ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.working-time-list ul li {
	font-weight: 600;
	color: var(--white-color);
	display: flex;
	justify-content: space-between;
	margin-bottom: 30px;
}

.working-time-list ul li:last-child {
	margin-bottom: 0;
}

.working-time-list ul span {
	margin-right: 10px;
}

.book-appointment-sidebar .section-cta-box {
	padding: 30px;
}

.appointment-form {
	background-color: var(--white-color);
	border-radius: 40px;
	padding: 50px;
}

.appointment-form-content {
	margin-bottom: 40px;
}

.appointment-form-content p {
	margin: 0;
}

.appointment-form .form-control {
	padding: 15px 20px;
	background-color: transparent;
	border: 1px solid rgb(220, 214, 214);
	border-radius: 40px;
	color: var(--text-color);
	box-shadow: none;
}

.appointment-form-title {
	margin-bottom: 20px;
}

.appointment-form-title h3 {
	font-size: 20px;
	font-weight: 600;
	text-transform: capitalize;
}

.appointment-reason {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 30px;
	margin-bottom: 40px;
}

.appointment-reason .reason-box {
	width: calc(33.33% - 20px);
}

.appointment-reason .reason-box input[type="radio"]:checked {
	background-color: var(--accent-color);
	border-color: var(--accent-color);
}

.appointment-reason .reason-box label {
	cursor: pointer;
	text-transform: capitalize;
	margin-left: 5px;
}

.appointment-reason .reason-box input:checked~label {
	color: var(--accent-color);
}

/************************************/
/***   		15. Footer css        ***/
/************************************/

.main-footer {
	background: url(../images/hero-bg.svg), linear-gradient(90deg, #2C2C66 -10.82%, var(--primary-color) 56.59%);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: contain;
	padding: 100px 0 0;
}

.about-footer {
	width: 100%;
	max-width: 412px;
}

.footer-logo {
	margin-bottom: 30px;
}

.footer-logo img {
	max-width: 180px;
}

.about-footer-content {
	margin-bottom: 30px;
}

.about-footer-content p {
	color: var(--white-color);
	margin: 0;
}

.footer-contact-content h3 {
	font-size: 20px;
	font-weight: 600;
	color: var(--white-color);
	margin-bottom: 15px;
}

.footer-contact-content h3:last-child {
	margin-bottom: 0;
}

.footer-links h3 {
	font-size: 20px;
	text-transform: capitalize;
	color: var(--white-color);
	margin-bottom: 30px;
}

.footer-links ul {
	margin: 0;
	padding: 0;
	padding-left: 20px;
}

.footer-links ul li {
	text-transform: capitalize;
	margin-bottom: 20px;
}

.footer-links ul li:last-child {
	margin-bottom: 0;
}

/* 
.footer-links ul li::marker {
	color: var(--accent-color);	
} */

.footer-links ul {
	list-style-type: none;
	/* Remove default markers */
	padding: 0;
	/* Remove padding */
}

.footer-links ul li {
	position: relative;
	/* Position for the pseudo-element */
	padding-left: 20px;
	/* Space for the arrow */
}

.footer-links ul li::before {
	content: '\f054';
	/* Font Awesome right arrow */
	font-family: 'Font Awesome 5 Free';
	/* Font Awesome font family */
	font-weight: 900;
	/* Font Awesome solid style */
	position: absolute;
	left: 0;
	/* Position the arrow */
	color: var(--accent-color);
	/* Color for the arrow */
}


.footer-links ul li a {
	color: var(--white-color);
	transition: all 0.3s ease-in-out;
}

.footer-links ul li:hover a {
	padding-left: 7px;
	color: lightgreen
}

.footer-contact-details .footer-info-box {
	position: relative;
	padding-left: 40px;
	margin-bottom: 25px;
}

.footer-contact-details .footer-info-box:last-child {
	margin-bottom: 0;
}

.footer-info-box .icon-box {
	position: absolute;
	top: -2px;
	left: 0;
}

.footer-info-box .icon-box img {
	max-width: 24px;
}

.footer-info-box-content p {
	color: var(--white-color);
	margin-bottom: 0;
}

.footer-copyright {
	border-top: 1px solid var(--dark-divider-color);
	padding: 40px 0;
	margin-top: 80px;
}

.footer-copyright-text p {
	color: var(--white-color);
	margin: 0;
}

.footer-privacy-policy ul {
	list-style: none;
	margin: 0;
	padding: 0;
	text-align: end;
}

.footer-privacy-policy ul li {
	display: inline-block;
	margin-right: 40px;
}

.footer-privacy-policy ul li:last-child {
	margin-right: 0;
}

.footer-privacy-policy ul li a {
	color: var(--white-color);
	text-transform: capitalize;
	transition: all 0.3s ease-in-out;
}

.footer-privacy-policy ul li:hover a {
	color: var(--accent-color);
}

/************************************/
/***     16. About us Page css	  ***/
/************************************/

.page-header {
	background: url(../images/hero-bg.svg), linear-gradient(90deg, #2C2C66 -10.82%, #0B0B38 56.59%);
	background-repeat: no-repeat;
	background-position: left center;
	background-size: contain;
	padding: 140px 0;
}

.page-header-box {
	text-align: center;
}

.page-header-box h1 {
	font-size: 54px;
	font-weight: 700;
	text-align: center;
	color: var(--white-color);
	margin-bottom: 20px;
}

.page-header-box ol {
	margin: 0;
	display: inline-flex;
	justify-content: center;
}

.page-header-box ol {
	margin: 0;
	padding: 0;
	justify-content: center;
}

.page-header-box ol li.breadcrumb-item {
	font-size: 16px;
	font-weight: 400;
	color: var(--white-color);
	text-transform: capitalize;
}

.page-header-box ol li.breadcrumb-item a {
	color: inherit;
}

.page-header-box ol .breadcrumb-item+.breadcrumb-item::before {
	color: var(--white-color);
}

.our-excellence {
	background: linear-gradient(180deg, var(--primary-color) 70%, var(--white-color) 30%);
	padding: 100px 0 20px;
}

.our-excellence .section-title h2 {
	color: var(--white-color);
}

.excellence-item {
	background-color: var(--white-color);
	box-shadow: 0px 10px 30px 0px #00000008;
	border: 1px solid var(--divider-color);
	border-radius: 40px;
	text-align: center;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	padding: 40px;
}

.excellence-item .icon-box {
	margin-bottom: 30px;
}

.excellence-item .icon-box img {
	max-width: 80px;
}

.excellence-title {
	border-bottom: 1px solid rgb(221, 218, 218);
	padding-bottom: 10px;
	margin-bottom: 2px
}

.excellence-title h3 {
	font-size: 20px;
	font-weight: 600;
	text-transform: capitalize;
}

.excellence-content p {
	margin: 0;
}

.how-it-work.about-how-work {
	padding: 50px 0 100px;
}

.our-doctors {
	padding: 100px 0;
}

.team-member-item {
	position: relative;
	height: calc(100% - 0px);
	margin-bottom: 30px;
	z-index: 1;
}

.team-image {
	position: relative;
	overflow: hidden;
	border-radius: 40px;
	margin-bottom: 30px;
}

.team-image img {
	width: 100%;
	aspect-ratio: 1/1.18;
	object-fit: cover;
	transition: all 0.5s ease-in-out;
}

.team-member-item:hover .team-image img {
	transform: scale(1.1);
}

.team-social-icon {
	position: absolute;
	right: 20px;
	top: 0;
	transform: translateY(-100%);
	text-align: center;
	z-index: 1;
	transition: all 0.5s ease-in-out;
}

.team-member-item:hover .team-social-icon {
	top: 20px;
	transform: translateY(0%);
}

.team-social-icon ul {
	display: block;
	list-style: none;
	margin: 0;
	padding: 0;
}

.team-social-icon ul li {
	display: block;
	text-align: center;
	margin-bottom: 10px;
}

.team-social-icon ul li:last-child {
	margin-bottom: 0;
}

.team-social-icon ul li a {
	height: 30px;
	width: 30px;
	background-color: var(--primary-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease-in-out;
}

.team-social-icon ul li a i {
	color: var(--white-color);
	font-size: 16px;
	transition: all 0.3s ease-in-out;
}

.team-social-icon ul li a:hover {
	background: var(--accent-color);
}

.team-content {
	text-align: center;
}

.team-content h3 {
	font-size: 20px;
	font-weight: 600;
	text-transform: capitalize;
	margin-bottom: 5px;
}

.team-content h3 a {
	color: inherit;
}

.team-content p {
	text-transform: capitalize;
	margin: 0;
}

.our-faqs.page-about-faqs {
	background-color: transparent;
	padding: 50px 0 100px;
}

.our-faqs.page-about-faqs .section-cta-box {
	background-color: var(--secondary-color);
}

.our-faqs.page-about-faqs .our-faq-section .accordion-header .accordion-button.collapsed {
	background-color: var(--secondary-color);
}

/************************************/
/***     17. Page Services css	  ***/
/************************************/

.page-services {
	padding: 100px 0 70px;
}

.our-faqs.page-about-faqs.page-service-faqs {
	padding: 100px 0;
}

.our-testimonials.service-testimonials {
	padding: 100px 0;
}

/************************************/
/***   18. Service Single css	  ***/
/************************************/

.page-service-single {
	padding: 100px 0;
}

.service-single-content {
	margin-right: 30px;
}

.service-single-slider {
	position: relative;
	margin-bottom: 40px;
}

.service-single-btn .service-single-button-prev::before {
	transform: rotate(225deg);
}

.service-slider-image {
	border-radius: 40px;
	overflow: hidden;
}

.service-slider-image img {
	border-radius: 40px;
	overflow: hidden;
	aspect-ratio: 1 / 0.6;
	object-fit: cover;
}

.service-single-slider .swiper-pagination {
	position: absolute;
	text-align: center;
	bottom: 20px;
	z-index: 1;
}

.service-single-slider .swiper-pagination .swiper-pagination-bullet {
	height: 12px;
	width: 12px;
	border-radius: 50%;
	background-color: var(--white-color);
	opacity: 1;
	margin: 0px 4px;
}

.service-single-slider .swiper-pagination .swiper-pagination-bullet-active {
	background-color: var(--accent-color);
	opacity: 1;
}

.service-entry {
	margin-bottom: 50px;
}

.service-entry h2 {
	font-size: 46px;
	margin-bottom: 20px;
}

.service-entry h3 {
	font-size: 20px;
	text-transform: capitalize;
	margin-bottom: 20px;
}

.service-entry p {
	margin-bottom: 20px;
}

.service-entry p:last-child {
	margin-bottom: 0px;
}

.service-entry ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

.service-entry ul li {
	position: relative;
	width: 100%;
	color: var(--primary-color);
	font-size: 16px;
	font-weight: 600;
	text-transform: capitalize;
	padding-left: 30px;
}

.service-entry ul li:before {
	content: '\f14a';
	font-family: 'Font Awesome 6 Free';
	font-weight: 900;
	font-size: 20px;
	color: var(--accent-color);
	display: inline-block;
	line-height: normal;
	position: absolute;
	top: 2px;
	left: 0;
}

.service-entry-image {
	margin-bottom: 20px;
}

.service-entry-img img {
	border-radius: 40px;
}

.service-single-faqs .our-faq-section .accordion-item {
	border: 1px solid var(--divider-color);
}

.service-sidebar {
	position: sticky;
	top: 20px;
}

.service-catagery-list {
	background-color: var(--secondary-color);
	border-radius: 40px;
	padding: 40px;
	margin-bottom: 40px;
}

.service-catagery-list h3 {
	font-size: 20px;
	font-weight: 600;
	text-transform: capitalize;
	margin-bottom: 30px;
}

.service-catagery-list ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.service-catagery-list ul li {
	background-color: var(--white-color);
	border-radius: 14px;
	padding: 15px;
	margin-bottom: 15px;
}

.service-catagery-list ul li:last-child {
	margin-bottom: 0;
}

.service-catagery-list ul li a {
	display: block;
	position: relative;
	color: var(--text-color);
	text-transform: capitalize;
	transition: all 0.3s ease-in-out;
}

.service-catagery-list ul li:hover a {
	color: var(--accent-color);
}

.service-catagery-list ul li a::after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	right: 0px;
	transform: translate(0px, -50%);
	background-image: url('../images/icon-plus-accent.svg');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	width: 14px;
	height: 14px;
	transition: all 0.3s ease-in-out;
}

.service-catagery-list ul li:hover a::after {
	transform: translate(0px, -50%) rotate(45deg);
}

.service-sidebar .section-cta-box {
	display: flex;
	box-shadow: 0px 10px 30px 0px #00000008;
	border: 1px solid var(--divider-color);
	padding: 30px;
}

/************************************/
/***      19. Blog Archive css	  ***/
/************************************/

.page-blog {
	padding: 100px 0;
}

.page-blog .blog-item {
	display: block;
}

.page-blog .post-featured-image {
	width: 100%;
	height: auto;
}

.page-blog .post-featured-image a {
	border-radius: 40px 40px 0 0px;
}

.page-blog .post-featured-image img {
	height: auto;
	aspect-ratio: 1 / 0.7;
	border-radius: 40px 40px 0 0px;
}

.page-blog .post-item-body {
	width: 100%;
	display: block;
	padding: 30px;
}

.page-pagination {
	margin-top: 30px;
	text-align: center;
}

.page-pagination ul {
	justify-content: center;
	padding: 0;
	margin: 0;
}

.page-pagination ul li a,
.page-pagination ul li span {
	display: flex;
	text-decoration: none;
	justify-content: center;
	align-items: center;
	background: var(--secondary-color);
	color: var(--accent-color);
	border-radius: 10px;
	width: 40px;
	height: 40px;
	margin: 0 5px;
	font-weight: 700;
	line-height: 1em;
	transition: all 0.3s ease-in-out;
}

.page-pagination ul li.active a,
.page-pagination ul li a:hover {
	background: var(--accent-color);
	color: var(--white-color);
}

/************************************/
/***      20. Blog Single css	  ***/
/************************************/

.page-single-post {
	padding: 100px 0;
}

.post-image {
	position: relative;
	margin-bottom: 30px;
}

.post-image figure {
	display: block;
}

.post-image figure,
.post-image img {
	aspect-ratio: 1 / 0.50;
	object-fit: cover;
	border-radius: 40px;
}

.post-content {
	width: 100%;
	max-width: 1100px;
	margin: 0 auto;
}

.post-entry {
	border-bottom: 1px solid var(--divider-color);
	padding-bottom: 30px;
	margin-bottom: 30px;
}

.post-entry:after {
	content: '';
	display: block;
	clear: both;
}

.post-entry a {
	color: var(--accent-color);
}

.post-entry h1,
.post-entry h2,
.post-entry h3,
.post-entry h4,
.post-entry h5,
.post-entry h6 {
	margin: 0 0 0.6em;
}

.post-entry h1 span,
.post-entry h2 span {
	font-weight: 400;
}

.post-entry h1 {
	font-size: 54px;
}

.post-entry h2 {
	font-size: 46px;
}

.post-entry h3 {
	font-size: 40px;
}

.post-entry h4 {
	font-size: 30px;
}

.post-entry h5 {
	font-size: 24px;
}

.post-entry h6 {
	font-size: 18px;
}

.post-entry p {
	margin-bottom: 20px;
}

.post-entry p:last-child {
	margin-bottom: 0;
}

.post-entry p strong {
	color: var(--primary-color);
	font-size: 18px;
	font-weight: 600;
}

.post-entry ol {
	margin: 0 0 30px;
}

.post-entry ol li {
	margin-bottom: 20px;
	font-size: 18px;
	font-weight: 600;
	color: var(--text-color);
}

.post-entry ul {
	padding: 0;
	margin: 20px 0 20px;
	padding-left: 20px;
}

.post-entry ul li {
	font-size: 18px;
	font-weight: 500;
	color: var(--primary-color);
	position: relative;
	margin-bottom: 15px;
}

.post-entry ul li:last-child {
	margin-bottom: 0;
}

.post-entry ul ul,
.post-entry ul ol,
.post-entry ol ol,
.post-entry ol ul {
	margin-top: 20px;
	margin-bottom: 0;
}

.post-entry ul ul li:last-child,
.post-entry ul ol li:last-child,
.post-entry ol ol li:last-child,
.post-entry ol ul li:last-child {
	margin-bottom: 0;
}

.post-entry blockquote {
	background: var(--secondary-color) url(../images/icon-blockquote.svg) no-repeat 35px 40px;
	background-size: 50px;
	border-radius: 40px;
	padding: 30px 30px 30px 120px;
	margin-bottom: 30px;
}

.post-entry blockquote p {
	color: var(--primary-color);
	font-size: 20px;
	font-weight: 600;
	line-height: 1.4em;
}

.post-entry blockquote p:last-child {
	margin-bottom: 0;
}

.tag-links {
	font-size: 22px;
	font-weight: 600;
	color: var(--primary-color);
	display: inline-block;
}

.post-tags .tag-links a {
	display: inline-block;
	font-size: 16px;
	font-weight: 600;
	text-transform: capitalize;
	background-color: var(--primary-color);
	color: var(--white-color);
	border-radius: 10px;
	padding: 8px 20px;
	margin-left: 10px;
	margin-bottom: 10px;
	transition: all 0.3s ease-in-out;
}

.post-tags .tag-links a:hover {
	background: var(--accent-color);
}

.post-social-sharing {
	text-align: right;
}

.post-social-sharing ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.post-social-sharing ul li {
	display: inline-block;
	margin-right: 10px;
}

.post-social-sharing ul li:last-child {
	margin-right: 0;
}

.post-social-sharing ul li a {
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	background-color: var(--primary-color);
	color: var(--white-color);
	border-radius: 10px;
	width: 38px;
	height: 38px;
	transition: all 0.3s ease-in-out;
}

.post-social-sharing ul li:hover a {
	background-color: var(--accent-color);
}

.post-social-sharing ul li a i {
	font-size: 18px;
	color: inherit;
	transition: all 0.3s ease-in-out;
}

.post-social-sharing ul li:hover a i {
	color: var(--secondry-color);
}

/************************************/
/***      21. Page Doctor css 	  ***/
/************************************/

.page-doctor {
	padding: 100px 0 70px;
}

/************************************/
/***    22. Doctor Single css 	  ***/
/************************************/

.page-doctor-single {
	padding: 100px 0;
}

.about-doctor-info {
	margin-bottom: 50px;
}

.about-doctor-info p {
	margin-bottom: 30px;
}

.about-doctor-info p:last-child {
	margin-bottom: 0;
}

.about-doctor-info h2 {
	font-size: 46px;
	margin-bottom: 30px;
}

.team-member-skills {
	margin-bottom: 30px;
}

.team-member-skills .skills-progress-bar {
	margin-bottom: 25px;
}

.team-member-skills .skills-progress-bar:last-child {
	margin-bottom: 0;
}

.skillbar .skill-data {
	display: flex;
	justify-content: space-between;
	margin-bottom: 15px;
}

.skillbar .skill-data .skill-title {
	font-size: 18px;
	font-weight: 600;
	color: var(--primary-color);
	text-transform: capitalize;
}

.skillbar .skill-data .skill-no {
	font-size: 18px;
	font-weight: 600;
	color: var(--primary-color);
	margin-left: 20px;
}

.skillbar .skill-progress {
	width: 100%;
	height: 15px;
	background: var(--secondary-color);
	border-radius: 99px;
	position: relative;
}

.skillbar .skill-progress .count-bar {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	background-color: var(--accent-color);
	border-radius: 99px;
}

.doctor-feature-list ul {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 20px;
}

.doctor-feature-list ul li {
	position: relative;
	width: calc(50% - 10px);
	color: var(--primary-color);
	font-size: 16px;
	font-weight: 600;
	text-transform: capitalize;
	padding-left: 30px;
}

.doctor-feature-list ul li:before {
	content: '\f14a';
	font-family: 'Font Awesome 6 Free';
	font-weight: 900;
	font-size: 20px;
	color: var(--accent-color);
	display: inline-block;
	line-height: normal;
	position: absolute;
	top: 2px;
	left: 0;
}

.doctor-details-sidebar {
	position: sticky;
	top: 20px;
	margin-left: 30px;
}

.doctor-details-box {
	background-color: var(--white-color);
	box-shadow: 0px 10px 30px 0px #00000008;
	border: 1px solid var(--divider-color);
	border-radius: 40px;
	padding: 20px;
	margin-bottom: 40px;
}

.doctor-details-box .doctor-image {
	position: relative;
	overflow: hidden;
	border-radius: 40px;
	margin-bottom: 30px;
}

.doctor-details-box .doctor-image img {
	width: 100%;
	aspect-ratio: 1/1.18;
	object-fit: cover;
	transition: all 0.5s ease-in-out;
}

.doctor-details-box:hover .doctor-image img {
	transform: scale(1.1);
}

.doctor-details-box .doctor-content {
	text-align: center;
	margin-bottom: 20px;
}

.doctor-details-box .doctor-content h3 {
	font-size: 20px;
	font-weight: 600;
	text-transform: capitalize;
	margin-bottom: 5px;
}

.doctor-details-box .doctor-content h3 a {
	color: inherit;
}

.doctor-details-box .doctor-content p {
	text-transform: capitalize;
	margin: 0;
}

.doctor-social-list ul {
	text-align: center;
	list-style: none;
	margin: 0;
	padding: 0;
}

.doctor-social-list ul li {
	display: inline-block;
	text-align: center;
	margin-right: 10px;
}

.doctor-social-list ul li:last-child {
	margin-right: 0;
}

.doctor-social-list ul li a {
	height: 30px;
	width: 30px;
	background-color: var(--accent-color);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	transition: all 0.3s ease-in-out;
}

.doctor-social-list ul li a i {
	color: var(--white-color);
	font-size: 16px;
	transition: all 0.3s ease-in-out;
}

.doctor-social-list ul li a:hover {
	background: var(--primary-color);
}

.get-touch-box {
	background-color: var(--secondary-color);
	border-radius: 40px;
	padding: 30px;
}

.get-touch-title {
	border-bottom: 1px solid var(--divider-color);
	margin-bottom: 20px;
	padding-bottom: 20px;
}

.get-touch-title h3 {
	font-size: 20px;
	font-weight: 600;
	text-transform: capitalize;
}

.get-touch-box ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

.get-touch-box ul li {
	border-bottom: 1px solid var(--divider-color);
	margin-bottom: 15px;
	padding-bottom: 15px;
}

.get-touch-box ul li:last-child {
	border-bottom: none;
	margin-bottom: 0px;
	padding-bottom: 0px;
}

.get-touch-box ul li span {
	font-size: 18px;
	font-weight: 600;
	text-transform: capitalize;
	color: var(--primary-color);
}

/************************************/
/***     23. Gallery Page css	  ***/
/************************************/

.our-gallery-page {
	padding: 100px 0 70px;
}

.photo-gallery {
	margin-bottom: 30px;
	border-radius: 40px;
	overflow: hidden;
}

.photo-gallery a {
	cursor: none;
}

.photo-gallery img {
	position: relative;
	aspect-ratio: 1 / 1;
	object-fit: cover;
	border-radius: 40px;
}

.mfp-arrow-left:before,
.mfp-arrow-right:before {
	border: none;
}

.mfp-arrow-left:after {
	border-right: 13px solid var(--accent-color);
	opacity: 1;
}

.mfp-arrow-right:after {
	border-left: 13px solid var(--accent-color);
	opacity: 1;
}

/************************************/
/***   24. Testimonials Page css  ***/
/************************************/

.page-testimonials {
	padding: 100px 0 70px;
}

.testimonial-box-item {
	background: var(--white-color);
	box-shadow: 0px 10px 30px 0px #00000008;
	border: 1px solid var(--divider-color);
	border-radius: 40px;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	padding: 40px;
}

.testimonial-box-header {
	display: flex;
	align-items: center;
	border-bottom: 1px solid var(--divider-color);
	padding-bottom: 30px;
	margin-bottom: 30px;
}

.testimonial-box-header .author-box-image {
	margin-right: 15px;
}

.testimonial-box-header .author-box-image img {
	width: 60px;
	height: 60px;
	object-fit: cover;
	border-radius: 50%;
}

.author-box-content {
	width: calc(100% - 75px);
}

.author-box-content h3 {
	font-size: 20px;
	font-weight: 600;
	text-transform: capitalize;
	margin-bottom: 5px;
}

.author-box-content p {
	text-transform: capitalize;
	line-height: normal;
	margin: 0;
}

.testimonial-box-item .testimonial-box-body {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 30px;
}

.testimonial-quote-img img {
	max-width: 30px;
}

.testimonial-box-body .testimonial-rating i {
	font-size: 16px;
	color: var(--accent-color);
	margin-right: 2px;
}

.testimonial-box-content p {
	margin: 0;
}

/************************************/
/***       25. FAQs Page css      ***/
/************************************/

.page-faqs {
	padding: 100px 0;
}

.page-faqs-catagery {
	margin-right: 30px;
}

.page-faqs .page-faq-accordion {
	margin-bottom: 60px;
}

.page-faqs .page-faq-accordion:last-child {
	margin-bottom: 0;
}

.page-faqs .faq-accordion-title {
	margin-bottom: 30px;
}

.page-faqs .faq-accordion-title h2 {
	font-size: 46px;
}

.page-faq-accordion .accordion-item {
	border: 1px solid var(--divider-color);
	border-radius: 20px;
	margin-bottom: 25px;
	padding: 0;
	transition: all 0.3s ease-in-out;
	overflow: hidden;
}

.page-faq-accordion .accordion-item:last-child {
	margin-bottom: 0;
}

.page-faq-accordion .accordion-header .accordion-button {
	font-size: 20px;
	font-weight: 600;
	line-height: 1.2em;
	background-color: var(--accent-color);
	color: var(--white-color);
	padding: 20px 50px 20px 20px;
	transition: all 0.3s ease-in-out;
}

.page-faq-accordion .accordion-button:not(.collapsed) {
	background-color: var(--accent-color);
	color: var(--white-color);
	border-bottom: 1px solid var(--dark-divider-color);
}

.page-faq-accordion .accordion-header .accordion-button.collapsed {
	background-color: var(--white-color);
	color: var(--primary-color);
}

.page-faq-accordion .accordion-item .accordion-button::after,
.page-faq-accordion .accordion-item .accordion-button.collapsed::after {
	content: '\f068';
	font-family: "Font Awesome 6 Free";
	position: absolute;
	right: 20px;
	top: 50%;
	bottom: auto;
	transform: translate(0px, -10px);
	display: flex;
	align-items: center;
	justify-content: center;
	font-weight: 900;
	font-size: 20px;
	width: 20px;
	height: 20px;
	padding: 5px;
	color: var(--white-color);
}

.page-faq-accordion .accordion-item .accordion-button.collapsed::after {
	content: '\f067';
	color: var(--primary-color);
}

.page-faq-accordion .accordion-item .accordion-body {
	background-color: var(--accent-color);
	padding: 20px 50px 20px 20px;
}

.page-faq-accordion .accordion-item .accordion-body p {
	color: var(--white-color);
	margin: 0;
}

.faq-sidebar {
	position: sticky;
	top: 20px;
}

.faq-catagery-list {
	background-color: var(--secondary-color);
	border-radius: 30px;
	padding: 30px;
	margin-bottom: 40px;
}

.faq-catagery-list ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.faq-catagery-list ul li {
	background-color: var(--white-color);
	border-radius: 14px;
	margin-bottom: 20px;
}

.faq-catagery-list ul li:last-child {
	margin-bottom: 0;
}

.faq-catagery-list ul li a {
	display: block;
	position: relative;
	color: var(--text-color);
	text-transform: capitalize;
	padding: 15px;
	transition: all 0.3s ease-in-out
}

.faq-catagery-list ul li a::after {
	content: '';
	display: block;
	position: absolute;
	top: 50%;
	right: 15px;
	transform: translateY(-50%);
	background-image: url(../images/icon-plus-accent.svg);
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	width: 14px;
	height: 14px;
	transition: all 0.3s ease-in-out;
}

.faq-catagery-list ul li:hover a::after {
	transform: translateY(-50%) rotate(45deg);
}

.faq-catagery-list ul li:hover a {
	color: var(--accent-color);
}

.faq-sidebar .section-cta-box {
	display: flex;
	box-shadow: 0px 10px 30px 0px #00000008;
	border: 1px solid var(--divider-color);
	padding: 30px;
}

/************************************/
/***   26. Contact us Page css	  ***/
/************************************/

.page-contact-us {
	padding: 100px 0;
}

.contact-us-info {
	margin-bottom: 70px;
}

.contact-us-content {
	margin-right: 30px;
}

.contact-us-item {
	position: relative;
	border: 1px solid var(--dark-divider-color);
	border-radius: 30px;
	padding: 30px;
	box-shadow: 0px 4px 40px 0px #0000000F;
	height: calc(100% - 30px);
	margin-bottom: 30px;
	overflow: hidden;
}

.contact-us-item:before {
	content: '';
	position: absolute;
	top: 100%;
	right: 0;
	left: 0;
	background-color: var(--accent-color);
	border-radius: 500px 500px 0 0;
	transition: all 0.4s ease-in-out;
	height: 100%;
	width: 100%;
	z-index: 0;
	opacity: 0;
}

.contact-us-item:hover:before {
	top: 0;
	border-radius: 0;
	opacity: 1;
}

.contact-us-item .icon-box {
	position: relative;
	margin-bottom: 20px;
	z-index: 2;
}

.contact-us-item .icon-box img {
	max-width: 60px;
	transition: all 0.4s ease-in-out;
}

.contact-us-item:hover .icon-box img {
	filter: brightness(0) invert(1);
}

.contact-us-item .contact-info-content {
	position: relative;
	z-index: 2;
}

.contact-us-item .contact-info-content h3 {
	font-size: 20px;
	font-weight: 700;
	text-transform: capitalize;
	margin-bottom: 20px;
	transition: all 0.3s ease-in-out;
}

.contact-us-item .contact-info-content p {
	width: 100%;
	max-width: 250px;
	margin: 0;
	transition: all 0.3s ease-in-out;
}

.contact-us-item:hover .contact-info-content p,
.contact-us-item:hover .contact-info-content h3 {
	color: var(--white-color);
}

.contact-us-form .form-control {
	padding: 15px;
	font-size: 16px;
	background-color: var(--secondary-color);
	border-color: var(--divider-color);
	border-radius: 14px;
	color: var(--primary-color);
	box-shadow: none;
	outline: none;
}

.contact-us-form .form-group label {
	color: var(--primary-color);
	font-size: 16px;
	font-weight: 500;
	text-transform: capitalize;
	margin-bottom: 10px;
}

.google-map .container-fluid {
	padding: 0;
}

.google-map-iframe iframe,
.google-map-iframe {
	width: 100%;
	height: 450px;
}

.google-map-iframe iframe {
	filter: grayscale(100%);
	transition: all 0.3s ease-in-out;
}

.google-map-iframe:hover iframe {
	filter: grayscale(0%);
}

/*************************************/
/*** 27. Page Book Appointment css ***/
/*************************************/

.page-book-appointment {
	padding: 100px 0;
}

.page-book-appointment .section-title {
	width: 100%;
	max-width: 650px;
	margin: 0 auto;
	text-align: center;
}

.page-book-appointment .appointment-form {
	box-shadow: 0px 10px 30px 0px #00000008;
	border: 1px solid var(--divider-color);
}

/************************************/
/*** 	   28. 404 Page css       ***/
/************************************/

.error-page {
	padding: 100px 0;
}

.error-page-image {
	text-align: center;
	margin-bottom: 30px;
}

.error-page-image img {
	max-width: 50%;
}

.error-page .error-page-content {
	text-align: center;
}

.error-page-content-heading {
	margin-bottom: 30px;
}

.error-page-content-heading h2 {
	font-size: 46px;
}

.error-page-content-body p {
	margin-bottom: 30px;
}

/************************************/
/***      29. Responsive css	  ***/
/************************************/

@media only screen and (max-width: 1024px) {

	.main-menu ul li {
		margin: 0;
	}

	.company-experience {
		width: 140px;
		height: 160px;
		padding: 10px;
	}

	.company-experience-counter h2 {
		font-size: 50px;
	}

	.company-experience-content p {
		font-size: 14px;
	}
}

@media only screen and (max-width: 991px) {

	.slicknav_nav li,
	.slicknav_nav ul {
		display: block;
	}

	.responsive-menu,
	.navbar-toggle {
		display: block;
	}

	.section-row {
		margin-bottom: 50px;
	}

	.section-btn {
		margin-top: 20px;
		text-align: left;
	}

	.section-title-content p {
		margin: 0;
		margin-top: 15px;
	}

	.section-title {
		margin-bottom: 40px;
	}

	.section-title h3 {
		margin-bottom: 15px;
	}

	.section-title h1 {
		font-size: 40px;
	}

	.section-title h2 {
		font-size: 38px;
	}

	.section-title p {
		margin-top: 20px;
		margin-bottom: 0;
	}

	.hero {
		padding-bottom: 108px;
	}

	.hero .hero-section {
		padding: 50px 0 158px;
	}

	.hero-section.hero-slider-layout .hero-slide {
		padding: 100px 0 200px;
	}

	.hero.bg-image .hero-section {
		padding: 100px 0 200px;
	}

	.hero-section.hero-slider-layout .hero-pagination {
		bottom: 140px;
	}

	.hero-content {
		margin-bottom: 30px;
	}

	.hero-content .section-title {
		margin-bottom: 30px;
	}

	.hero.bg-image .hero-section .hero-content .section-title h1 {
		font-size: 62px;
	}

	.hero-content-body {
		padding: 20px 0;
		margin-bottom: 30px;
	}

	.hero-counter-box h2 {
		font-size: 36px;
		margin-bottom: 15px;
	}

	.hero-image {
		padding-left: 0px;
		padding-bottom: 50px;
	}

	.hero-img img {
		aspect-ratio: 1 / 0.8;
	}

	.company-service-rating {
		top: auto;
		bottom: 0;
		left: 50%;
		transform: translateX(-50%);
		max-width: 275px;
		padding: 15px;
	}

	@keyframes serviceratingmoveobject {
		50% {
			left: 43%;
		}
	}

	.company-rating-icon {
		margin-bottom: 5px;
	}

	.company-rating-content h3 {
		margin-bottom: 5px;
	}

	.cta-content-box {
		padding: 30px;
	}

	.cta-item {
		margin-bottom: 30px;
	}

	.cta-content-box .col-md-6:nth-child(2n + 2) .cta-item {
		border-right: none;
		padding-right: 0;
	}

	.cta-item .icon-box {
		width: 60px;
		height: 60px;
	}

	.cta-item .icon-box img {
		max-width: 28px;
	}

	.cta-item-content {
		width: calc(100% - 75px);
	}

	.cta-item-content h3 {
		font-size: 18px;
		margin-bottom: 5px;
	}

	.about-us {
		padding: 50px 0;
	}

	.about-us-content {
		margin-bottom: 30px;
	}

	.about-us-body {
		gap: 20px;
		padding: 20px 0;
		margin-bottom: 30px;
	}

	.about-body-item {
		width: calc(50% - 10px);
	}

	.about-counter {
		width: calc(32% - 10px);
	}

	.about-counter h2 {
		font-size: 36px;
	}

	.about-counter-content {
		width: calc(68% - 10px);
	}

	.about-image {
		margin-right: 0px;
	}

	.company-experience {
		width: 230px;
		height: 255px;
	}

	.company-experience-counter h2 {
		font-size: 50px;
	}

	.our-service {
		padding: 50px 0 0px;
	}

	.service-item {
		padding: 30px;
	}

	.service-item-content h3 {
		font-size: 18px;
	}

	.service-body {
		margin-bottom: 20px;
	}

	.our-expertise {
		padding: 25px 0 50px;
	}

	.expertise-content {
		margin-bottom: 30px;
	}

	.expertise-content .section-title {
		padding-bottom: 30px;
		margin-bottom: 30px;
	}

	.expertise-list-title {
		margin-bottom: 10px;
	}

	.expertise-list-box {
		margin-bottom: 20px;
	}

	.expertise-image {
		max-width: 635px;
		margin: 0 auto;
	}

	.why-choose-us {
		padding: 50px 0 0;
	}

	.why-choose-content {
		margin-bottom: 30px;
	}

	.why-choose-list {
		margin-bottom: 30px;
	}

	.why-choose-item {
		padding-bottom: 20px;
		margin-bottom: 20px;
	}

	.why-choose-image {
		text-align: center;
	}

	.why-choose-image img {
		width: 100%;
		max-width: 50%;
		aspect-ratio: 1 / 1.4;
		margin: 0 auto;
	}

	.how-it-work {
		padding: 50px 0;
	}

	.how-work-content {
		margin-bottom: 30px;
	}

	.faq-accordion.how-work-accordion .accordion-item {
		margin-bottom: 20px;
		padding-bottom: 20px;
	}

	.faq-accordion.how-work-accordion .accordion-header .accordion-button {
		padding: 0px 25px 0 35px;
	}

	.faq-accordion.how-work-accordion .accordion-item .accordion-body {
		padding: 10px 25px 0px 35px;
	}

	.how-work-image {
		margin-right: 0px;
	}

	.how-work-img-2 img,
	.how-work-img-1 img {
		aspect-ratio: 1 / 0.8;
		object-fit: cover;
	}

	.how-work-img-3 img {
		aspect-ratio: 1 / 0.4;
		object-fit: cover;
	}

	.our-testimonials {
		padding: 50px 0 25px;
	}

	.testimonial-slider {
		padding: 50px;
	}

	.testimonial-header {
		margin-bottom: 40px;
	}

	.testimonial-quote {
		margin-bottom: 20px;
	}

	.testimonial-content p {
		font-size: 18px;
	}

	.our-transformation {
		padding: 25px 0 20px;
	}

	.our-faqs {
		padding: 50px 0;
	}

	.our-faqs-content {
		margin-right: 0px;
		margin-bottom: 30px;
	}

	.section-cta-box {
		padding: 30px;
	}

	.section-cta-box .icon-box {
		margin-right: 20px;
	}

	.section-cta-box .icon-box img {
		max-width: 50px;
	}

	.section-cta-content {
		width: calc(100% - 70px);
	}

	.section-cta-content p {
		margin-bottom: 5px;
	}

	.section-cta-content h3 {
		font-size: 20px;
		margin-bottom: 5px;
	}

	.our-faq-section .accordion-header .accordion-button {
		padding: 15px 45px 15px 15px;
	}

	.our-faq-section .accordion-item .accordion-body {
		padding: 15px 45px 15px 15px;
	}

	.our-faq-section .accordion-item .accordion-button::after,
	.our-faq-section .accordion-item .accordion-button.collapsed::after {
		right: 15px;
	}

	.our-blog {
		padding: 50px 0 20px;
	}

	.blog-item .post-featured-image img {
		aspect-ratio: 1 / 0.8;
	}

	.post-item-content h3 {
		margin-bottom: 15px;
	}

	.book-appointment {
		padding: 50px 0;
	}

	.book-appointment-sidebar {
		margin-bottom: 30px;
	}

	.working-time-box {
		padding: 30px;
		margin-bottom: 30px;
	}

	.working-box-title {
		padding-bottom: 20px;
		margin-bottom: 20px;
	}

	.working-time-list ul li {
		margin-bottom: 20px;
	}

	.appointment-form {
		padding: 40px;
	}

	.appointment-form-content {
		margin-bottom: 30px;
	}

	.appointment-reason {
		margin-bottom: 30px;
	}

	.main-footer {
		padding: 50px 0 0;
		background-size: cover;
	}

	.footer-logo {
		margin-bottom: 20px;
	}

	.about-footer-content {
		margin-bottom: 20px;
	}

	.about-footer {
		max-width: 100%;
		margin-bottom: 40px;
	}

	.footer-links h3 {
		margin-bottom: 20px;
	}

	.footer-links ul li {
		margin-bottom: 10px;
	}

	.footer-copyright {
		padding: 30px 0;
		margin-top: 60px;
	}

	.footer-privacy-policy ul li {
		margin-right: 20px;
	}

	.page-header {
		padding: 80px 0;
	}

	.page-header-box h1 {
		font-size: 40px;
		margin-bottom: 10px;
	}

	.our-excellence {
		background: linear-gradient(180deg, var(--primary-color) 50%, var(--white-color) 50%);
		padding: 50px 0 0px;
	}

	.excellence-item {
		padding: 30px;
	}

	.excellence-item .icon-box {
		margin-bottom: 20px;
	}

	.excellence-item .icon-box img {
		max-width: 70px;
	}

	.excellence-title {
		margin-bottom: 20px;
		padding-bottom: 20px;
	}

	.how-it-work.about-how-work {
		padding: 25px 0 50px;
	}

	.our-doctors {
		padding: 50px 0 20px;
	}

	.team-image {
		margin-bottom: 20px;
	}

	.team-image img {
		aspect-ratio: 1 / 1.1;
	}

	.our-faqs.page-about-faqs {
		padding: 25px 0 50px;
	}

	.page-services {
		padding: 50px 0 20px;
	}

	.our-faqs.page-about-faqs.page-service-faqs {
		padding: 50px 0;
	}

	.our-testimonials.service-testimonials {
		padding: 50px 0;
	}

	.page-service-single {
		padding: 50px 0;
	}

	.service-single-content {
		margin-right: 0px;
		margin-bottom: 30px;
	}

	.service-single-slider {
		margin-bottom: 30px;
	}

	.service-entry {
		margin-bottom: 40px;
	}

	.service-entry h2 {
		font-size: 38px;
	}

	.service-catagery-list {
		padding: 30px;
		margin-bottom: 30px;
	}

	.service-catagery-list h3 {
		margin-bottom: 20px;
	}

	.page-blog {
		padding: 50px 0;
	}

	.page-blog .post-featured-image img {
		aspect-ratio: 1 / 0.7;
	}

	.page-blog .post-item-body {
		padding: 20px;
	}

	.page-pagination {
		margin-top: 10px;
	}

	.page-single-post {
		padding: 50px 0;
	}

	.post-image {
		margin-bottom: 20px;
	}

	.post-entry blockquote {
		background: var(--secondary-color) url('../images/icon-blockquote.svg') no-repeat 30px 35px;
		background-size: 45px;
		padding: 25px 25px 25px 90px;
		margin-bottom: 20px;
	}

	.post-entry blockquote p {
		font-size: 18px;
	}

	.post-entry h2 {
		font-size: 36px;
	}

	.post-entry ul li {
		font-size: 16px;
	}

	.post-tag-links {
		padding: 0 0px;
	}

	.post-tags {
		margin-bottom: 10px;
	}

	.post-social-sharing ul {
		text-align: left;
	}

	.post-tags .tag-links a {
		font-size: 16px;
		padding: 8px 15px;
	}

	.page-doctor {
		padding: 50px 0 20px;
	}

	.page-doctor-single {
		padding: 50px 0;
	}

	.doctor-details-sidebar {
		position: initial;
		margin-left: 0px;
		margin-bottom: 30px;
	}

	.about-doctor-info {
		margin-bottom: 40px;
	}

	.doctor-details-box {
		margin-bottom: 30px;
	}

	.doctor-details-box .doctor-image {
		max-width: 80%;
		margin: 0 auto;
		margin-bottom: 20px;
	}

	.doctor-details-box .doctor-image img {
		aspect-ratio: 1 / 0.99;
	}

	.about-doctor-info p {
		margin-bottom: 20px;
	}

	.about-doctor-info h2 {
		font-size: 38px;
		margin-bottom: 20px;
	}

	.team-member-skills .skills-progress-bar {
		margin-bottom: 20px;
	}

	.skillbar .skill-data {
		margin-bottom: 10px;
	}

	.our-gallery-page {
		padding: 50px 0 20px;
	}

	.page-testimonials {
		padding: 50px 0 20px;
	}

	.testimonial-box-item {
		padding: 30px;
	}

	.testimonial-box-header {
		padding-bottom: 20px;
		margin-bottom: 20px;
	}

	.testimonial-box-item .testimonial-box-body {
		margin-bottom: 20px;
	}

	.page-faqs {
		padding: 50px 0;
	}

	.faq-sidebar {
		position: initial;
		margin-bottom: 30px;
	}

	.faq-catagery-list {
		padding: 20px;
		margin-bottom: 30px;
	}

	.page-faqs-catagery {
		margin-right: 0px;
	}

	.page-faqs .page-faq-accordion {
		margin-bottom: 40px;
	}

	.page-faqs .faq-accordion-title {
		margin-bottom: 20px;
	}

	.page-faqs .faq-accordion-title h2 {
		font-size: 38px;
	}

	.page-faq-accordion .accordion-header .accordion-button {
		padding: 15px 45px 15px 15px;
	}

	.page-faq-accordion .accordion-item .accordion-body {
		padding: 15px 45px 15px 15px;
	}

	.page-faq-accordion .accordion-item .accordion-button::after,
	.page-faq-accordion .accordion-item .accordion-button.collapsed::after {
		right: 15px;
	}

	.page-contact-us {
		padding: 50px 0;
	}

	.contact-us-info {
		margin-bottom: 20px;
	}

	.contact-us-item .icon-box img {
		max-width: 50px;
	}

	.google-map-iframe iframe,
	.google-map-iframe {
		height: 500px;
	}

	.page-book-appointment {
		padding: 50px 0;
	}

	.error-page {
		padding: 50px 0;
	}

	.error-page-image {
		margin-bottom: 20px;
	}

	.error-page-image img {
		max-width: 80%;
	}

	.error-page-content-heading {
		margin-bottom: 20px;
	}

	.error-page-content-heading h2 {
		font-size: 38px;
	}

	.error-page-content-body p {
		margin-bottom: 20px;
	}
}

@media only screen and (max-width: 767px) {

	.btn-default {
		padding: 17px 55px 17px 25px;
	}

	.section-row {
		margin-bottom: 40px;
	}

	.section-title {
		margin-bottom: 30px;
	}

	.section-title h1 {
		font-size: 28px;
	}

	.section-title h2 {
		font-size: 28px;
	}

	.section-title p {
		margin-top: 15px;
	}

	.hero {
		padding-bottom: 141px;
	}

	.hero .hero-section {
		padding: 50px 0 190px;
	}

	.hero.bg-image .hero-section .hero-content .section-title h1 {
		font-size: 38px;
	}

	.hero-section.hero-slider-layout .hero-slide {
		padding: 50px 0 250px;
	}

	.hero-section.hero-slider-layout .hero-pagination {
		bottom: 190px;
	}

	.hero-content .section-title h1 img {
		max-width: 90px;
	}

	.hero-content-body {
		padding: 15px 0;
		margin-bottom: 30px;
		gap: 20px;
	}

	.hero-counter-box {
		width: calc(33.33% - 13.33px);
	}

	.hero-counter-box h2 {
		font-size: 32px;
		margin-bottom: 10px;
	}

	.hero-content-footer .btn-default.btn-highlighted {
		margin-top: 15px;
	}

	.hero-content-footer .btn-default {
		padding: 17px 25px 17px 65px;
		margin-right: 20px;
	}

	.hero-content-footer .btn-default.btn-highlighted {
		padding: 16px 25px 16px 55px;
	}

	.hero-image {
		padding-bottom: 80px;
	}

	.company-rating-content h3 {
		font-size: 16px;
		margin-bottom: 5px;
	}

	.cta-content-box {
		padding: 20px 10px;
	}

	.cta-item {
		border-right: none;
		padding-right: 0px;
	}

	.about-us-body {
		padding: 15px 0;
	}

	.about-body-item {
		width: 100%;
	}

	.about-counter {
		width: calc(28% - 10px);
	}

	.about-counter h2 {
		font-size: 32px;
	}

	.about-counter-content {
		width: calc(72% - 10px);
	}

	.about-us-footer {
		display: block;
	}

	.about-us-footer-btn {
		margin-right: 0px;
		margin-bottom: 20px;
	}

	.company-experience {
		width: 110px;
		height: 125px;
		padding: 5px;
	}

	.company-experience-counter h2 {
		font-size: 30px;
	}

	.company-experience-content p {
		font-size: 12px;
	}

	.service-item {
		padding: 20px;
	}

	.service-header {
		padding-bottom: 15px;
		margin-bottom: 15px;
	}

	.service-body {
		margin-bottom: 15px;
	}

	.service-image img {
		aspect-ratio: 1 / 0.6;
	}

	.expertise-list-title h3 {
		font-size: 18px;
		padding-left: 30px;
	}

	.expertise-list-title h3::before {
		width: 22px;
		height: 22px;
	}

	.expertise-image {
		background-size: 75% auto;
		gap: 20px;
	}

	.expertise-img-1,
	.expertise-img-2 {
		width: calc(50% - 10px);
	}

	.expertise-img-2 {
		padding-top: 100px;
	}

	.expert-doctor {
		max-width: 220px;
		padding: 10px 15px;
	}

	.expert-doctor .icon-box {
		width: 50px;
		height: 50px;
		margin-right: 15px;
	}

	.expert-doctor .icon-box img {
		max-width: 26px;
	}

	.expert-doctor-content {
		width: calc(100% - 55px);
	}

	.expert-doctor-content h3 {
		font-size: 18px;
		margin-bottom: 0px;
	}

	.why-choose-item-content h3 {
		font-size: 18px;
	}

	.why-choose-image img {
		max-width: 100%;
	}

	.faq-accordion.how-work-accordion .accordion-item {
		margin-bottom: 15px;
		padding-bottom: 15px;
	}

	.faq-accordion.how-work-accordion .accordion-header .accordion-button {
		font-size: 18px;
		padding: 0px 25px 0 25px;
	}

	.faq-accordion.how-work-accordion .accordion-header .accordion-button span {
		font-size: 18px;
	}

	.faq-accordion.how-work-accordion .accordion-item .accordion-body {
		padding: 10px 0px 0px 25px;
	}

	.doctor-work-img-box figure {
		border: 6px solid var(--white-color);
		padding: 6px 8px;
	}

	.how-work-img-2 img,
	.how-work-img-1 img {
		aspect-ratio: 1 / 0.98;
	}

	.how-work-img-3 img {
		aspect-ratio: 1 / 0.55;
	}

	.doctor-work-img-box img {
		max-width: 120px;
	}

	.testimonial-slider {
		padding: 30px;
	}

	.testimonial-header {
		margin-bottom: 30px;
	}

	.testimonial-quote {
		margin-bottom: 15px;
	}

	.testimonial-quote img {
		max-width: 40px;
	}

	.testimonial-content p {
		font-size: 14px;
	}

	.author-content h3 {
		font-size: 18px;
	}

	.testimonial-btn {
		position: initial;
		justify-content: center;
	}

	.section-cta-box {
		padding: 20px;
	}

	.section-cta-box .icon-box {
		margin-right: 15px;
	}

	.section-cta-box .icon-box img {
		max-width: 40px;
	}

	.section-cta-content {
		width: calc(100% - 55px);
	}

	.section-cta-content h3 {
		font-size: 18px;
	}

	.our-faq-section .accordion-header .accordion-button {
		font-size: 18px;
	}

	.our-faq-section .accordion-item .accordion-body {
		padding: 15px;
	}

	.blog-item {
		display: block;
	}

	.blog-item .post-featured-image {
		width: 100%;
		height: auto;
	}

	.blog-item .post-featured-image a {
		border-radius: 40px 40px 0 0px;
	}

	.blog-item .post-featured-image img {
		height: auto;
		border-radius: 40px 40px 0 0px;
	}

	.post-item-body {
		width: 100%;
		display: block;
	}

	.post-item-content h3 {
		font-size: 18px;
	}

	.working-time-box {
		padding: 20px;
	}

	.working-box-title h3 {
		font-size: 18px;
	}

	.working-time-list ul li {
		margin-bottom: 15px;
	}

	.book-appointment-sidebar .section-cta-box {
		padding: 20px;
	}

	.appointment-form {
		padding: 30px 20px;
	}

	.appointment-form .form-control {
		padding: 12px 15px;
	}

	.appointment-form-title h3 {
		font-size: 18px;
	}

	.appointment-reason {
		gap: 10px;
	}

	.appointment-reason .reason-box {
		width: 100%;
	}

	.about-footer {
		margin-bottom: 30px;
	}

	.footer-contact-content h3 {
		font-size: 18px;
		margin-bottom: 10px;
	}

	.footer-links {
		margin-bottom: 30px;
	}

	.main-footer .col-12:last-child .footer-links {
		margin-bottom: 0;
	}

	.footer-links h3 {
		font-size: 18px;
		margin-bottom: 15px;
	}

	.footer-copyright {
		padding: 20px 0;
		margin-top: 40px;
	}

	.footer-copyright-text {
		text-align: center;
		margin-bottom: 10px;
	}

	.footer-privacy-policy ul {
		text-align: center;
	}

	.footer-privacy-policy ul li {
		margin-right: 15px;
	}

	.page-header-box h1 {
		font-size: 28px;
	}

	.our-excellence {
		background: linear-gradient(180deg, var(--primary-color) 40%, var(--white-color) 40%);
	}

	.excellence-item {
		padding: 30px 20px;
	}

	.excellence-item .icon-box {
		margin-bottom: 20px;
	}

	.excellence-item .icon-box img {
		max-width: 60px;
	}

	.excellence-title {
		margin-bottom: 15px;
		padding-bottom: 15px;
	}

	.excellence-title h3 {
		font-size: 18px;
	}

	.service-slider-image img {
		aspect-ratio: 1 / 0.8;
	}

	.service-single-slider .swiper-pagination {
		bottom: 10px;
	}

	.service-entry h2 {
		font-size: 28px;
	}

	.service-entry h3 {
		font-size: 18px;
	}

	.service-entry ul {
		display: block;
	}

	.service-entry ul li {
		width: 100%;
		font-size: 16px;
		margin-bottom: 10px;
	}

	.service-entry ul li:last-child {
		margin-bottom: 0;
	}

	.service-entry ul li:before {
		font-size: 18px;
		top: 4px;
	}

	.service-entry-img {
		margin-bottom: 20px;
	}

	.service-catagery-list {
		padding: 20px;
	}

	.service-catagery-list h3 {
		font-size: 18px;
	}

	.service-catagery-list ul li {
		padding: 12px;
	}

	.service-sidebar .section-cta-box {
		padding: 20px;
	}

	.post-image figure,
	.post-image img {
		aspect-ratio: 1 / 0.70;
	}

	.post-entry blockquote {
		background: var(--secondary-color) url(../images/icon-blockquote.svg) no-repeat 20px 20px;
		background-size: 35px;
		padding: 55px 20px 20px 20px;
	}

	.post-entry h2 {
		font-size: 28px;
	}

	.tag-links {
		font-size: 20px;
	}

	.doctor-details-box .doctor-image {
		max-width: 100%;
		margin: auto;
		margin-bottom: 20px;
	}

	.doctor-details-box .doctor-content {
		margin-bottom: 15px;
	}

	.doctor-details-box .doctor-content h3 {
		font-size: 18px;
	}

	.get-touch-title h3 {
		font-size: 18px;
	}

	.about-doctor-info {
		margin-bottom: 30px;
	}

	.about-doctor-info h2 {
		font-size: 28px;
	}

	.skillbar .skill-data .skill-no,
	.skillbar .skill-data .skill-title {
		font-size: 16px;
	}

	.doctor-feature-list ul {
		gap: 15px;
	}

	.doctor-feature-list ul li {
		padding-left: 25px;
		width: 100%;
	}

	.doctor-feature-list ul li:before {
		font-size: 18px;
		top: 3px;
	}

	.photo-gallery img,
	.photo-gallery {
		border-radius: 20px;
	}

	.testimonial-box-item {
		padding: 20px;
	}

	.testimonial-box-header {
		padding-bottom: 15px;
		margin-bottom: 15px;
	}

	.author-box-content h3 {
		font-size: 18px;
	}

	.testimonial-box-item .testimonial-box-body {
		margin-bottom: 15px;
	}

	.faq-catagery-list ul li a {
		padding: 12px;
	}

	.faq-catagery-list ul li a::after {
		right: 12px;
	}

	.page-faqs .page-faq-accordion {
		margin-bottom: 30px;
	}

	.page-faqs .faq-accordion-title h2 {
		font-size: 28px;
	}

	.page-faq-accordion .accordion-header .accordion-button {
		font-size: 18px;
	}

	.page-faq-accordion .accordion-item .accordion-body {
		padding: 15px;
	}

	.contact-us-item {
		padding: 20px;
	}

	.contact-us-item .icon-box img {
		max-width: 40PX;
	}

	.contact-us-item .contact-info-content h3 {
		font-size: 18px;
	}

	.google-map-iframe iframe,
	.google-map-iframe {
		height: 350px;
	}

	.error-page-image img {
		max-width: 100%;
	}

	.error-page-content-heading h2 {
		font-size: 28px;
	}
}



.expertise-body {
	margin-top: -50px
}


/* CSS for the down arrow on the right side of dropdowns */
.dropdown-arrow {
	position: relative;
}

.dropdown-arrow select {
	appearance: none;
	/* Remove default arrow */
	-webkit-appearance: none;
	-moz-appearance: none;
	padding-right: 30px;
	/* Add space for the custom arrow */
}

.dropdown-arrow-icon {
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	pointer-events: none;
	/* So it doesn't interfere with clicking */
	font-size: 30px;
	color: #999;
}


/* Decrease opacity for regular input placeholders */
::placeholder {
	opacity: 0.6 !important;
	/* Adjust as needed */
	color: #999 !important;
	/* Adjust color as needed */
}

/* Decrease opacity for date and time inputs */
input[type="date"]::placeholder,
input[type="time"]::placeholder {
	opacity: 0.6 !important;
	/* Adjust as needed */
	color: #999 !important;
	/* Adjust color as needed */
}

/* Decrease opacity for select dropdowns (using a trick) */
select {
	color: #999 !important;
	/* Simulate placeholder appearance */
}

select:invalid {
	opacity: 0.6 !important;
	/* Decrease opacity for dropdown placeholder */
}



.navbar-nav .active {
	color: navy !important;
	font-weight: bold;
}

.whatsapp-icon,
.back-to-top {
	position: fixed;
	width: 50px;
	/* Adjust size as needed */
	height: 50px;
	/* Adjust size as needed */
	border-radius: 50%;
	/* Make them circular */
	box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
	z-index: 1000;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 24px;
	/* Adjust icon size */
	color: #fff;
	/* Icon color */
}

.whatsapp-icon {
	font-size: 35px !important;
	left: 20px;
	bottom: 20px;
	background-color: #25D366;
	/* WhatsApp color */
}

.back-to-top {
	right: 20px;
	bottom: 20px;
	background-color: #000;
	/* Background color for the button */
	opacity: 0;
	/* Start hidden */
	transition: opacity 0.3s ease;
	/* Smooth transition */
}

/* Show the Back to Top button when scrolling down */
.show {
	opacity: 1;
}

.bannerdoctor {
	position: absolute;
	top: -30px;
	left: -20px
}

.btn-container {
	display: flex;
	justify-content: center;
	/* Center the button horizontally */
	align-items: center;
	/* Center the button vertically (if needed) */
	width: 100%;
	/* Optional: Set the width of the container */
	height: 50px;
	/* Optional: Set the height of the container */
}


/* information */
.information {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	/* Ensures space between info1 and info2 */
}

.info1,
.info2 {
	flex: 1;

	/* Allows both divs to take equal space */
	padding: 10px;
	/* Adds some space inside the divs */
	min-width: 250px;
	/* Prevents the divs from shrinking too much on small screens */
}

.info1 ul,
.info2 ul {
	margin-top: 20px
}

@media (max-width: 768px) {
	.information {
		flex-direction: column;
		/* Stacks the divs vertically on smaller screens */
	}
}

.info2 ul {
	list-style-type: none !important
}

/* Add Font Awesome icons before each <li> */

.info2 ul li::before {
	content: "\f0f1";
	/* Font Awesome stethoscope icon code */
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #0000FF;
	margin-right: 8px;
	/* Space between icon and text */
}

.info1 ul {
	list-style-type: none;
}

.info1 ul li::before {
	content: "\f061";
	/* Font Awesome right arrow code */
	font-family: "Font Awesome 5 Free";

	font-weight: 900;
	color: #0000FF;
	margin-left: -20px;
	/* Space between icon and text */
	margin-right: 10px
}

.about-doctor-feature .section-title h4 {
	margin-top: 20px;
	margin-bottom: -20px
}

/* Ensure Font Awesome is properly loaded */
@import url('https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.3/css/all.min.css');


/* services */
.sectionp {
	width: 80%;
	margin: 0 auto;
	text-align: center;
}




/* modaal */


.modal {
	display: none;
	/* Hidden by default */
	position: fixed;
	/* Stay in place */
	z-index: 1000;
	/* Sit on top */
	left: 0;
	top: 0;
	width: 100%;
	/* Full width */
	height: 100%;
	/* Full height */
	overflow: auto;
	/* Enable scroll if needed */
	background-color: rgba(0, 0, 0, 0.8);
	/* Black w/ opacity */
}

.modal-content {
	background-color: #fefefe;
	margin: 15% auto;
	/* 15% from the top and centered */
	padding: 30px;
	border: 1px solid #888;
	width: 80%;
	/* Could be more or less, depending on screen size */
}


.close {
	color: #aaa;
	position: absolute;
	right: 10px;
	font-size: 38px;
	font-weight: bold;
	cursor: pointer;
}

.close:hover,
.close:focus {
	color: black;
	text-decoration: none;
	cursor: pointer;
}

.modal-text {
	overflow-y: auto;
	/* Enable vertical scrolling if needed */
}

.modal-text h2 {
	text-align: center;
	margin: 10px;
	letter-spacing: 1px;
	color: var(--accent-color);

}

/* Make the text width 100% if it overflows */
@media (max-width: 768px) {
	.modal-body {
		flex-direction: column;
		/* Stack the image and text on smaller screens */
		margin-top: 2rem !important;
	}

	.modal-image {
		max-width: 100%;
		/* Set max-width to 100% on smaller screens */
	}

	.modal-text {
		max-width: 100%;
		/* Set max-width to 100% on smaller screens */
	}
}

/* gallery */



.tabs-container {
	display: flex;
	justify-content: center;
	/* background-color: #f1f1f1; */
	padding: 10px 0;
	margin-top: 5%
}

.tabs {
	list-style-type: none;
	padding: 0;
	margin: 0;
	display: flex;
}

.tab-item {
	padding: 10px 80px;
	cursor: pointer;
	background-color: #ddd;
	margin: 0 5px;
	border-radius: 5px;
	transition: background-color 0.3s;
}

.tab-item:hover,
.tab-item.active {
	background-color: var(--accent-color);
	color: white;
}

.tab-content {
	display: none;
	padding: 20px;
	text-align: center;
	opacity: 0;
	transition: opacity 0.5s ease-in-out;
}

.tab-content.show {
	opacity: 1;
}

.image-gallery {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
}

.image-gallery img {
	width: 300px;
	height: 300px;
	margin: 10px;
	border-radius: 10px;
	opacity: 0;
	transform: scale(0.8);
	transition: opacity 0.5s ease-in-out, transform 0.5s ease-in-out;
}

.image-gallery img.show-image {
	opacity: 1;
	transform: scale(1);
}

@media screen and (max-width: 768px) {
	.image-gallery img {
		width: 100%;
		height: auto;
	}
}





 /* Base styles for the iframe */
 .footer-links .map-container iframe {
    width: 320px; /* Default width */
    height: 280px; /* Default height */
    border: 0;
  }

  /* Mobile styles: apply only when the screen width is 768px or less */
  @media screen and (max-width: 1300px) {
    .footer-links .map-container iframe {
      width: 100%;  /* Full width on mobile */
      height: 250px;  /* Adjust height for mobile */
    }
  }







/* Style for Social Media Icons */
.footer-social-links {
    display: flex;
    gap: 15px; /* Add space between the icons */
    margin-top: 20px; /* Add some space above the icons */
}

.footer-social-links .social-icon {
    font-size: 20px; /* Set the size of the icons */
    color: #20c997; /* Set a default color */
    text-decoration: none; /* Remove underlines from links */
    transition: all 0.3s ease; /* Smooth transition for hover effect */
    
    /* Add border and make it circular */
    width: 40px; /* Fixed width for consistency */
    height: 40px; /* Fixed height for consistency */
    border: 2px solid #20c997; /* Set border color matching default icon color */
    border-radius: 50%; /* Make the icon circular */
    display: flex; /* Use flexbox to center the icon */
    justify-content: center; /* Horizontally center the icon */
    align-items: center; /* Vertically center the icon */
    text-align: center; /* Ensures that the icon is perfectly centered */
}

.footer-social-links .social-icon:hover {
    color: #6610f2; /* Change the color on hover */
    transform: scale(1.1); /* Slightly enlarge the icon on hover */
    
    /* Change the border color on hover */
    border-color: #6610f2; /* Change border color on hover */
}

/* Optional: Add specific colors for each social media platform */
.footer-social-links .social-icon.facebook {
    color: #6f42c1; /* Facebook blue */
    border-color: #6f42c1; /* Border color for Facebook */
}

.footer-social-links .social-icon.instagram {
    color: #E4405F; /* Instagram pink */
    border-color: #E4405F; /* Border color for Instagram */
}

.footer-social-links .social-icon.linkedin {
    color: #0077b5; /* LinkedIn blue */
    border-color: #0077b5; /* Border color for LinkedIn */
}

/* Optional: Adjust icon size for smaller screens */
@media (max-width: 768px) {
    .footer-social-links {
        gap: 10px;
    }

    .footer-social-links .social-icon {
        font-size: 15px; /* Slightly smaller icons on mobile */
        width: 45px; /* Adjust circle size for smaller screens */
        height: 45px; /* Adjust circle size for smaller screens */
    }
}











/* Modal background overlay */
.modal {
	display: none;
	position: fixed;
	z-index: 1;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	overflow: auto;
	background-color: rgba(0,0,0,0.5);
	animation: fadeIn 0.3s;
}

/* Modal dialog box */
.modal-dialog {
	margin-top: 80px;
	max-width: 500px;
	margin-left: auto;
	margin-right: auto;
}

/* Modal content box */
.modal-content {
	background-color: #fff;
	border-radius: 8px;
	box-shadow: 0 4px 8px rgba(0,0,0,0.2);
	padding: 20px;
	font-family: 'Arial', sans-serif;
}

/* Modal header */
.modal-header {
	border-bottom: 1px solid #ddd;
	padding-bottom: 10px;
}

.modal-title {
	font-size: 1.5rem;
	color: #333;
	font-weight: bold;
}

/* Close button */
.close {
	color: #aaa;
	font-size: 1.5rem;
	font-weight: bold;
	border: none;
	background: transparent;
	padding: 0;
	cursor: pointer;
}

.close:hover, .close:focus {
	color: #333;
	text-decoration: none;
}

/* Modal body */
.modal-body {
	padding: 20px 0;
	font-size: 1.1rem;
	color: #555;
}

/* Modal footer */
.modal-footer {
	border-top: 1px solid #ddd;
	padding-top: 10px;
	text-align: right;
}

/* Footer button styling */
.btn-secondary {
	background-color: #007bff;
	color: white;
	border-radius: 5px;
	padding: 10px 20px;
	font-size: 1rem;
	border: none;
	cursor: pointer;
}

.btn-secondary:hover {
	background-color: #0056b3;
}

/* Fade in animation */
@keyframes fadeIn {
	0% { opacity: 0; }
	100% { opacity: 1; }
}



























.pdf-card-wrapper {
	display: flex;
	align-items: center;
	gap: 24px;
	padding: 24px;
	background-color: #f9f9f9;
	border-radius: 12px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.pdf-card {
	width: 350px;
	border: 1px solid #ddd;
	border-radius: 8px;
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
	overflow: hidden;
	text-align: center;
	background-color: #fff;
	transition: transform 0.3s ease-in, box-shadow 0.3s ease-in;
}

.pdf-card:hover {
	transform: translateY(-10px);
	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.15);
}

.pdf-card img {
	height: 100%;
	width: 100%;
}

.pdf-card h2 {
	margin: 16px 0 8px;
	font-size: 1.4em;
	color: #333;
}

.pdf-view-button,
.pdf-download-button {
	background-color: #7348ff;
	color: #fff;
	border: none;
	padding: 10px 20px;
	border-radius: 30px;
	cursor: pointer;
	font-size: 1em;
	margin-right: 8px;
	text-decoration: none;
	transition: background-color 0.3s;
	display: inline-block;
	/* float: inline-end; */
}

.pdf-view-button:hover,
.pdf-download-button:hover {
	background-color: #0015b3;
}

.pdf-register-button {
	background-color: #7348ff;
	color: #fff;
	border: none;
	padding: 10px 20px;
	border-radius: 30px;
	cursor: pointer;
	font-size: 1em;
	margin-right: 8px;
	text-decoration: none;
	transition: background-color 0.3s;
	display: inline-block;
	float:initial;
}

.pdf-register-button:hover {
	background-color: #0015b3;
}
.pdf-card-extra-content {
	flex: 1;
	font-size: 1em;
	color: #444;
	line-height: 1.6;
}

.pdf-card-extra-content h3 {
	font-size: 1.5em;
	color: #333;
	margin-bottom: 10px;
}

.pdf-card-extra-content p {
	margin-bottom: 12px;
}



/* Responsive Design */
@media (max-width: 768px) {
	.pdf-card-wrapper {
		flex-direction: column;
		text-align: center;
	}
}