@import url("https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");

:root {
    --primary-color: #0caf60;
    --paracolor: #5c728e;
    --secondary-color: #ff2c54;
    --blue-color: #00a6fb;
    --extra-color: #0caf60;
    --colorWhite: #fff;
    --colorYellow: #ffc422;
    --primary-linear-gradient:
        linear-gradient(141.55deg, #0caf60 3.46%, #0caf60 99.86%), #0caf60;
}

/*======================
    Css indexing

    1. common css
    2. header css
    3. banner posts css
    4. feaure posts css
    5. section posts css
    6. recent posts css
    7. sidebar category css
    8. sidebar newsletter
    9. footer css
=======================*/

/*==== 1. common css start ====*/
body {
    font-family: "Barlow", sans-serif;
    margin: 0;
    padding: 0;
    outline: 0;
    font-size: 14px;
    background: #fcfcfc;
    font-family: "DM Sans", sans-serif;
}

ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

li {
    display: inline-block;
}

a {
    text-decoration: none;
    color: #333333;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    margin: 0;
    padding: 0;
}

p {
    margin: 0;
    padding: 0;
}

h4,
.h4 {
    font-size: 1.25rem;
}

input,
input:focus,
select,
select:focus {
    height: 42px;
    box-shadow: 0 0 !important;
    outline: 0 !important;
    bordar-color: none !important;
}

.form-check-input {
    height: 25px !important;
    width: 50px !important;
}

.custom-checkbox {
    width: 18px !important;
    height: 18px !important;
}

button {
    border: 0 !important;
}

img {
    height: 50%;
    width: 80%;
}

.contact_btn {
    display: inline-block;
    background-color: var(--blue-color);
    border-radius: 65px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white !important;
    font-weight: 500;
    position: relative;
    transition: all linear 0.3s;
}
.common_btn {
    display: inline-block;
    background-color: var(--blue-color);
    border-radius: 65px;
    display: flex;
    justify-content: center;
    align-items: center;
    color: white !important;
    font-weight: 500;
    position: relative;
    transition: all linear 0.3s;
}

.common_btn::after {
    position: absolute;
    content: "";
    background: url("../images/arrow_icon.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    opacity: 0;
    top: 50%;
    left: 0;
    width: 23px;
    height: 24px;
    transform: translateY(-50%);
    transition: all linear 0.3s;
}

.common_btn:hover::after {
    opacity: 1;

    left: 18px;
}

.common_btn span {
    transition: all linear 0.3s;
}

.common_btn:hover {
    background-color: var(--primary-color);

    span {
        /* opacity: 1; */

        margin-left: 30px;
    }
}

/*==== common css end====*/

/*==== 2. header css start====*/

.fixed-top {
    position: fixed;
    /*    top: -44px;*/
    left: 0;
    z-index: 99999;
}

.main-header {
    background: #fff;
    border-bottom: 1px solid #ddd;
    /*    margin-top: 41px;*/
}

.logo {
    height: 70px;
    width: 165px;
}

.logo img {
    height: 100%;
    object-fit: contain !important;
}

.menu-search ul li a {
    font-size: 18px;
    margin-right: 12px;
    color: #222;
    cursor: pointer;
}

.social-icon ul li a {
    font-size: 15px;
    margin-left: 2px;
    height: 30px;
    width: 30px;
    line-height: 30px;
    text-align: center;
    color: #fff;
    display: inline-block;
    border-radius: 50%;
}

.social-icon .facebook {
    background: #1877f2;
}

.social-icon .instagram {
    background: #e4405f;
}

.social-icon .linkedin {
    background: #0a66c2;
}

.social-icon .twitter {
    background: #1da1f2;
}

.social-icon .youtube {
    background: #ff0000;
}

.social-icon .dribble {
    background: #ea4c89;
}

.social-icon .behance {
    background: #1769ff;
}

.social-icon .tiktok {
    background: #000000;
}

.main-menu {
    text-align: center;
    position: relative;
}

.main-nav {
    padding: 20px 0;
    background: #fff;
}

.main-menu ul li a {
    font-size: 16px;
    margin: 0 8px;
    font-weight: 500;
    transition: 0.35s all;
    font-family: "DM Sans", sans-serif;
}

.main-menu ul li a:hover {
    color: var(--blue-color);
}

.mobile-header {
    display: none;
}

li.nav_link:hover .dropdown {
    visibility: visible;
    opacity: 1;
}

ul.dropdown {
    min-width: 250px;
    max-height: 250px;
    position: absolute;
    top: 47px;
    background-color: white;
    color: white;
    border-radius: 4px;
    box-shadow: darkgrey;
    box-shadow: rgb(0 0 0 / 15%) 0px 4px 14px;
    visibility: hidden;
    opacity: 0;
    transition: all linear 0.3s;
    z-index: 99999;
}

ul.dropdown li {
    width: 100%;
    max-height: 100px;
    line-height: 38px;
    border-bottom: 1px solid #00a6fb26;
    transition: all 0.3s linear;
    cursor: pointer;
    /* align-items: start; */
    display: flex;
    justify-content: start;
    /* margin-left: 10px; */
}

ul.dropdown li a {
    margin-left: 10px;
}

ul.dropdown li:hover {
    border-left: 5px solid var(--blue-color);
    width: 100%;
    line-height: 38px;
    background-color: #edf9ff;
}

/*mobile header*/
.off-canvas-menu {
    width: 100%;
    top: 100px;
    position: fixed;
    /* top: 0; */
    z-index: 99999;
    background-color: #fff;
    /* height: 100vh; */
    transition: all 0.3s ease;
    overflow-y: auto;
    visibility: hidden;
    opacity: 0;
    box-shadow: 5px 2px 100px #ddd;
    padding: 15px 20px;
    visibility: hidden;
    opacity: 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.off-canvas-menu li {
    display: block;
}

.off-canvas-menu li a {
    margin: 20px 0;
    display: block;
    font-weight: 500;
    color: #555;
    font-size: 16px;
    transition: 0.35s;
    font-family: "DM Sans", sans-serif;
}

.off-canvas-menu li a:hover {
    color: var(--blue-color);
}

.menu-bar {
    display: flex;
    justify-content: end;
    align-items: center;
}

.menu-bar i {
    font-size: 22px;
    margin-left: 5px;
    color: #fff;
    width: 40px;
    height: 40px;
    background-color: var(--blue-color);
    border-radius: 5px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.menu-bar.active i {
    font-size: 22px;
    margin-left: 5px;
    color: #fff;
    width: 40px;
    height: 40px;
    background-color: var(--secondary-color);
    border-radius: 5px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
}

.off-canvas-menu-close-btn {
    display: none;
}

.off-canvas-menu-close-btn.active {
    display: block;
}

.off-canvas-menu-show-btn {
    display: block;
}

.off-canvas-menu-show-btn.active {
    display: none;
}

.off-canvas-menu.active {
    top: 120px;
    visibility: visible;
    opacity: 1;
}

.menu-close ul {
    display: grid;
    grid-template-columns: 75% 20%;
    align-items: center;
    gap: 5%;
}

.menu-close .toggle {
    text-align: right;
}

.menu-close .toggle i {
    font-size: 28px;
    cursor: pointer;
}

form.search-form {
    display: grid;
    border: 1px solid #ddd;
    grid-template-columns: 80% 20%;
}

form.search-form input {
    border: 0;
    height: 40px;
    padding: 5px 25px;
}

.menu-search {
    display: flex;
    justify-content: end;
}

.mobile-menu-search ul {
    display: flex;
    gap: 20px;
    justify-content: center;
    align-items: center;
}

.appointment_mobile_btn {
    width: 148px;
    height: 45px;
    line-height: 45px;
    text-align: center;
}

.m_search_icon {
    font-size: 17px !important;
}

.appointment_mobile_btn span {
    padding: 5px;
}

/*==== header css end====*/

/*==== 3. banner post css start====*/
.banner-post-section {
    padding: 20px 0;
}

.banner-post {
    display: grid;
    grid-template-columns: 60% auto;
    gap: 20px;
}

.banner-img {
    position: relative;
    height: 100%;
    border-radius: 5px;
    overflow: hidden;
    transition: 0.35s all;
}

.banner-img::before {
    position: absolute;
    bottom: 0;
    width: 100%;
    background: linear-gradient(to bottom, transparent, #222);
    content: "";
    height: 50%;
    transition: 0.35s all;
}

.banner-img img {
    transition: 0.35s all;
}

.banner-img:hover.banner-img img {
    transform: scale(1.1);
}

.banner-title {
    position: absolute;
    bottom: 20px;
    left: 20px;
    color: #fff;
}

.banner-title h5 {
    margin-bottom: 3px;
}

.banner-right .banner-post-item {
    height: 190px;
}

.banner-left .banner-post-item {
    height: 400px;
}

.banner-post-item.banner-gap {
    margin-bottom: 20px;
}

/*==== banner post css end====*/

/*==== 4. grid post css start====*/
.feature-section {
    background: #fff;
    padding: 30px 0;
}

.section-title {
    margin-bottom: 20px;
}

.section-title h2 {
    font-size: 25px;
    font-weight: 600;
}

.post-title {
    display: grid;
    font-size: 15px;
    height: 70px;
    font-weight: 700;
    margin: 10px 0;
    color: #444;
}

.post-img {
    position: relative;
    border-radius: 5px;
    overflow: hidden;
}

.post-img img,
.category-post img {
    transition: 0.35s;
    overflow: hidden;
}

.grid-post:hover .post-img img,
.category-post:hover.category-post img {
    transform: scale(1.1);
}

a.post-cat {
    position: absolute;
    bottom: 5px;
    left: 5px;
    background: var(--primary-color);
    color: #fff;
    padding: 1px 6px;
    border-radius: 5px;
    font-size: 13px;
}

/*==== grid post css end====*/

/*==== 5. section post css start ====*/
.content-and-sidebar {
    padding: 20px 0;
    background: #fff;
    border-top: 1px solid #ddd;
}

.category-heading {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
}

.category-post-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    margin-top: 15px;
}

.category-post img {
    height: 170px;
    border-radius: 5px;
}

.category-posts {
    padding: 30px 0;
}

.category-post p {
    margin: 5px 0;
}

.category-post h5 {
    font-size: 15px;
    font-weight: 700;
    color: #444;
}

.category-btn {
    font-size: 14px;
    background: var(--secondary-color);
    color: #fff;
    display: inline-block;
    padding: 4px 8px;
    border-radius: 5px;
}

.category-heading h5 {
    font-size: 25px;
    font-weight: 600;
}

/*==== 5. section post css end ====*/

/*==== 6. recent post css start ====*/
.sidebar-content {
    position: sticky;
    top: 20px;
}

.recent-posts {
    margin: 30px 0;
    border: 1px solid#ddd;
    padding: 15px;
    border-radius: 5px;
}

.recent-posts h4 {
    font-size: 20px;
    margin-bottom: 15px;
    font-weight: 600;
}

.recent-post {
    display: grid;
    grid-template-columns: 80px auto;
    gap: 15px;
    margin: 20px 0;
}

.recent-title h5 {
    font-size: 15px;
    margin-bottom: 5px;
    transition: 0.35s all;
}

.recent-post:hover .recent-title h5 {
    color: var(--primary-color);
}

.recent-image {
    border-radius: 5px;
    overflow: hidden;
}

/*==== 6. recent post css end ====*/

/*==== 7. sidebar category css start ====*/
.sidebar-category {
    padding: 15px;
    border: 1px solid #ddd;
    border-radius: 5px;
}

.sidebar-category h4 {
    font-size: 20px;
    margin-bottom: 15px;
    font-weight: 600;
}

.sidebar-nav ul li {
    display: flex;
    justify-content: space-between;
    border-bottom: 1px dashed #ddd;
    align-items: center;
}

.sidebar-nav ul li:hover>a {
    color: var(--primary-color) !important;
}

.sidebar-nav ul li a {
    display: block;
    margin: 4px 0;
    padding: 10px 0;
    font-weight: 600;
}

.sidebar-nav ul li:last-child {
    border-bottom: none;
}

/*==== 7. sidebar category css end ====*/

/*==== 8. sidebar newslatter css start ====*/
.sidebar-newsletter {
    border: 1px solid #ddd;
    border-radius: 5px;
    padding: 15px;
    margin-top: 30px;
}

.sidebar-newsletter h4 {
    font-size: 20px;
    margin-bottom: 15px;
    font-weight: 600;
}

.s-newsletter input {
    border-radius: 50px;
    text-align: center;
    font-size: 14px;
}

.s-newsletter button {
    margin-top: 15px;
    width: 100%;
    background: var(--primary-color);
    color: #fff;
    padding: 10px 0;
    border-radius: 50px;
}

/*==== 8. sidebar newslatter css end ====*/

/*==== 9. footer  css start ====*/
.main-footer {
    padding: 40px 0;
    background: #fff;
    border-top: 1px solid #ddd;
}

.footer-logo {
    height: auto;
    width: 80px;
}

.footer-title {
    font-size: 22px;
    font-weight: 600;
    margin-bottom: 25px;
    position: relative;
    display: inline-block;
}

.footer-title:after {
    position: absolute;
    left: 4px;
    bottom: -8px;
    width: 40%;
    height: 2px;
    content: "";
    background: var(--secondary-color);
}

.footer-title:before {
    position: absolute;
    left: 4px;
    bottom: -8px;
    width: 100%;
    height: 2px;
    content: "";
    background: #ddd;
}

.footer-nav ul li {
    display: block;
}

.footer-nav ul li a {
    font-size: 16px;
    display: inline-block;
    margin: 5px 0;
    transition: 0.35s all;
}

.footer-nav ul li a:hover {
    margin-left: 2px;
    color: var(--primary-color);
}

.footer-about p {
    font-size: 16px;
    color: #444;
}

.footer-nav.category ul li {
    display: inline-block;
}

.footer-nav.category ul li a {
    background: #ddd;
    padding: 4px 12px;
    border-radius: 50px;
}

.footer-nav.social-icon li {
    display: inline;
}

/*==== 9. footer  css end ====*/

/*==== 10. category page  css start ====*/
.page-breadcrumb {
    text-align: center;
    padding: 40px 0;
}

.page-title {
    margin-bottom: 5px;
}

.page-caption ul li a {
    margin: 0 5px;
    font-size: 18px;
    color: #555;
}

.category-section {
    background: #fff;
    padding: 50px 0;
}

.category-item {
    display: grid;
    grid-template-columns: 30% auto;
    grid-gap: 25px;
    align-items: center;
    margin: 15px 0;
    border-radius: 5px;
}

.category-title h5 {
    font-weight: 600;
    font-size: 22px;
    margin-bottom: 5px;
}

.category-des {
    color: #555;
    margin-top: 15px;
}

.category-item {
    display: grid;
    grid-template-columns: 30% auto;
    grid-gap: 25px;
    align-items: center;
    border-radius: 5px;
    border-bottom: 1px dashed #ddd;
    padding: 30px 0;
}

.category-item:hover .category-img img {
    transform: scale(1.1);
}

.category-img {
    overflow: hidden;
}

.category-img img {
    transition: 0.35s all;
}

.category-img {
    height: 100%;
}

a.read-btn {
    margin-top: 15px;
    display: inline-block;
    color: var(--primary-color);
    font-weight: 600;
    font-size: 15px;
    border-bottom: 1px solid;
}

/*==== 10. category page  css end ====*/

/*==== 11. post details  css start ====*/
.details-section {
    padding: 30px 0;
}

.post-image {
    margin: 25px 0;
    border-radius: 5px;
    overflow: hidden;
}

.author-share {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 15px;
}

.author {
    display: flex;
    align-items: center;
    gap: 11px;
}

.author-image {
    width: 40px;
    border-radius: 50px;
    overflow: hidden;
}

.comment-section {
    padding-top: 40px;
}

.comment-item {
    display: flex;
    align-items: center;
    gap: 15px;
    margin: 25px 0;
}

.comment-user {
    width: 40px;
}

.comment-bar {
    margin-bottom: 25px;
    border-bottom: 2px solid #ddd;
    padding-bottom: 8px;
}

.comment-content strong {
    margin-right: 8px;
}

.comment-item.replay {
    margin-left: 35px;
    border-left: 1px solid #ddd;
    padding-left: 15px;
}

.leave-comment {
    margin-bottom: 20px;
    margin-top: 35px;
}

/*==== 11. post details  css end ====*/

/* doctor appotimant site  */

/* top bar stat  */

section.topbar {
    background: #2ac28e;
    height: 40px;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 0;
}

ul.topbar_link {
    line-height: 39px;
}

ul.topbar_icon {
    line-height: 39px;
}

ul.topbar_link li a {
    margin-left: 16px;
    color: white;
    font-weight: 400;
    font-size: 15px;
    font-family: "DM Sans", sans-serif;
}

ul.topbar_link li a i {
    margin-right: 12px;
}

.topbar_link li a {
    margin-left: 16px;
    color: white;
}

.topbar_icon li a {
    margin-left: 16px;
    color: white;
    font-size: 16px;
    background-color: #eee9e940;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    line-height: 30px;
    background: transparent;
    display: inline-block;
    text-align: center;
    transition: 1ms all;
    transition-duration: 1s;
}

.topbar_icon li a:hover {
    background: #ffffff40;
}

.hover_underline:hover {
    text-decoration: underline;
}

/* a.appointment_btn {
    width: 110px;
    height: 42px;
} */
 .menu_area {
    display: grid;
    grid-template-columns: 20% 65% 15%;
    justify-content: center;
    align-items: center;
}
 a.appointment_btn {
    padding: 6px 13px;
    display: flex;
    gap: 8px;
}

.search_btn {
    width: 132px;
    height: 45px;
    font-size: 18px;
    position: absolute;
    right: 10px;
    top: 9px;
}

.menu_search {
    background: #000000b3;
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 999999;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    overflow: hidden;
    transition: 2s all;
    transition-duration: 0.5s;
}

.menu_search.active {
    opacity: 1;
    visibility: visible;
    overflow: visible;
}

.menu_search form {
    display: flex;
    position: relative;
}

.menu_search form input {
    width: 700px;
    height: 60px;
    border-radius: 35px;
    font-size: 17px;
    padding: 20px;
}

.close_search {
    position: absolute;
    color: white;
    background-color: var(--blue-color);
    width: 40px;
    height: 40px;
    line-height: 16px;
    /* text-align: center; */
    /* align-items: center; */
    font-size: 22px;
    border-radius: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    top: -90px;
    right: 0px;
    cursor: pointer;
}

/* slider start  */

.slider {
    position: relative;
}

.main-slider {
    position: relative;
}

.slider-content {
    position: relative;
    width: 100% !important;
    height: 100vh;
    z-index: 9;
}

/* @media screen and (min-width:320px) and (max-width:767px){
.slider-content {
    height: 350px !important;
    width: 100%;
    position: relative;
    z-index: 9;
}
} */

.slider-image {
    height: 270px;
}

.owl-carousel.hero-slider.main_slider {
    position: relative;
    height: 270px;
}

.slider-image img {
    height: 100% !important;
}

.index__data h1 {
    color: #1a6db5;
    font-size: 33px;
    font-weight: 600;
    margin-bottom: 20px;
}

.index__data p {
    font-weight: 600;
}

.index__data {
    margin-top: 50px;
}

.index__data li {
    display: block;
    margin-top: 8px;
}

.slider-text {
    position: absolute;
    top: 40%;
    left: 50%;
    text-align: center;
    color: white;
    /* margin: 0 auto;  */
    max-width: 100%;
    z-index: 99;
    transform: translate(-50%);
}

.slider-text h1 {
    font-size: 50px;
}

.slider-text h4 {
    font-size: 30px;
}

.main_slider .owl-prev {
    position: absolute;
    top: 50%;
    left: 20px;
    height: 50px !important;
    width: 50px !important;
    transform: translateY(-50%);
    z-index: 999999;
    border: 1px solid var(--blue-color) !important;
    border-radius: 50%;
    color: white !important;
    font-size: 30px !important;
    text-align: center;
    transition: 0.5s all;
    line-height: 35px !important;
}

.main_slider .owl-prev:hover {
    background-color: var(--blue-color) !important;
}

.main_slider .owl-next {
    position: absolute;
    top: 50%;
    right: 20px;
    height: 50px !important;
    width: 50px !important;
    transform: translateY(-50%);
    z-index: 999999;
    border: 1px solid var(--blue-color) !important;
    border-radius: 50%;
    color: white !important;
    font-size: 30px !important;
    text-align: center;
    transition: 0.5s all;
    line-height: 35px !important;
}

.main_slider .owl-next:hover {
    background-color: var(--blue-color) !important;
}

.main_slider .owl-dots {
    position: absolute !important;
    bottom: 1% !important;
    left: 50% !important;

    transform: translateX(-50%) !important;
}

.main_slider .owl-dots .owl-dot.active span,
.owl-theme .owl-dots .owl-dot:hover span {
    background: var(--blue-color) !important;
    height: 30px;
    width: 5px;
}

.main_slider .owl-dots .owl-dot span {
    width: 8px;
    height: 20px;
    margin: 5px 2px;
    background: white !important;
    display: block;
    -webkit-backface-visibility: visible;
    transition: opacity 0.2s ease;
    border-radius: 30px;
}

.mean_photo {
    position: absolute;
    color: white;
    font-size: 50px;
}

/* slider end */

/* about start*/
section.about_section {
    padding-bottom: 70px;
    /*padding-top: 70px;*/
}

.about_container {
    height: 500px;
}

.about_left {
    height: 100%;
    position: relative;
}

.about_img {
    height: 550px;
    box-shadow: -8px 8px 0px 0px var(--blue-color);
}

.about_img img {
    width: 100%;
    height: 100%;
}

.about_left .title h3 {
    font-size: 10px;
    color: var(--blue-color);
    margin-left: 20px;
}

.common_heading h5::after {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 2px;
    height: 20px;
    background: var(--blue-color);
}

.about_iteam {
    margin-top: 45px;
    margin-bottom: 38px;
}

.about_btn {
    width: 200px;
    height: 50px;
    font-size: 17px;
    text-transform: capitalize;
}

.common_heading h5 {
    font-size: 18px;
    font-weight: 700;
    font-family: var(--paraFont);
    color: var(--blue-color);
    text-transform: capitalize;
    position: relative;
    display: inline-block;
    padding-left: 20px;
}

.about_iteam li {
    font-size: 18px;
    font-weight: 500;
    text-transform: capitalize;
    font-family: var(--paraFont);
    width: 50%;
    position: relative;
    padding-left: 33px;
    margin-bottom: 18px;
}

.about_iteam li::after {
    position: absolute;
    content: "\f00c";
    color: white;
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    top: 2px;
    left: 0;
    width: 23px;
    height: 23px;
    line-height: 24px;
    text-align: center;
    font-size: 11px;
    border-radius: 50%;
    background: var(--blue-color);
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

/* about end  */

/* service section start  */

.service {
    background: url("../images/service_bg.jpg");
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    position: relative;
}
.service_overlay {
    padding-bottom: 30px;
    background: #ffffff9c;
    padding-top: 30px;
}
.hero_section {
    padding: 30px 0;
}
.center_heading {
    text-align: center;
}

.common_heading h5 {
    font-size: 18px;
    font-weight: 700;
    font-family: var(--paraFont);
    color: var(--blue-color);
    text-transform: capitalize;
    position: relative;
    display: inline-block;
    padding-left: 20px;
}

.common_heading h2 {
    /* text-align: start; */
    font-size: 44px;
    font-weight: 600;
    color: var(--colorBlack);
    text-transform: capitalize;
    margin-top: 15px;
    margin-bottom: 12px;
}

.blog_details_img {
    height: 500px;
}

ul.blog_details_header_left {
    padding: 13px 0;
    gap: 13px;
}

.blog_details_text {
    margin-bottom: 50px;
    color: #646161;
}

.slick-slider {
    position: relative;
    display: block;
    box-sizing: border-box;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
    touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

section.service h2 {
    text-align: center;
}

.slick-slider .slick-track,
.slick-slider .slick-list {
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    -ms-transform: translate3d(0, 0, 0);
    -o-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.slick-track {
    position: relative;
    top: 0;
    left: 0;
    display: block;
    margin-left: auto;
    margin-right: auto;
}

.single_service {
    margin-top: 25px;
    padding: 20px;
    background: var(--colorWhite);
    transition: all linear 0.3s;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    border-radius: 10px;
    -webkit-transition: all linear 0.2s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.service_slider .single_service {
    margin: 25px 12px 0px 12px;
}

.service_img {
    position: relative;
    height: 290px;
}

.tf_service_icon2 {
    background: var(--colorPrimary);
}

.service_img img {
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
}

.tf_service_icon {
    position: absolute;
    bottom: -21px;
    right: 25px;
    width: 50px;
    height: 50px;
    line-height: 50px;
    font-size: 24px;
    background: var(--blue-color);
    color: var(--colorWhite);
    text-align: center;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}

.service_text {
    margin-top: 25px;
}

.service_heading {
    display: block;
    font-size: 24px;
    font-weight: 600;
    font-family: var(--headingFont);
    color: var(--colorBlack);
    text-transform: capitalize;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.service_text p {
    margin: 10px 0px 15px 0px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 17px;
}

.service_link {
    font-size: 16px;
    font-weight: 500;
    font-family: var(--paraFont);
    color: var(--colorBlack);
    text-transform: capitalize;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.service_link:hover {
    color: var(--blue-color);
}

.service_link i {
    margin-left: 5px;
}

/* service section end */

/* faq start */
.faq {
    position: relative;
    padding-top: 50px;
    padding-bottom: 50px;
}

.faq_accordion .accordion-item {
    margin-top: 25px;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    background: #e0f5ff;
}

.faq_accordion .accordion-collapse {
    border: none;
    border-width: 0 1px;
}

.faq_accordion .accordion-header .accordion-button {
    border: none;
    border-radius: 0;
    background: none;
    box-shadow: none;
    font-size: 18px;
    font-weight: 500;
    color: var(--colorBlack);
    font-family: var(--paraFont);
    padding-left: 50px;
    text-align: left;
}

.faq_accordion .accordion-button:not(.collapsed)::after {
    background-image: url(../images/Vector-min.png);
}

.faq_accordion .accordion-button::after {
    position: absolute;
    width: 15px;
    height: 15px;
    background-image: url(../images/Vecto-plusr.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    top: 16px;
    left: 14px;
}

.faq_accordion .accordion-body {
    padding: 20px 20px 20px 50px;
    font-size: 16px;
    font-weight: 400;
    font-family: var(--paraFont);
    color: var(--paraColor);
    border-top: 1px solid #2ac28e21;
}

.faq_img::after {
    position: absolute;
    content: "";
    background: var(--blue-color);
    width: 150px;
    height: 150px;
    top: 0;
    left: 0;
    border-radius: 10px;
    z-index: -1;
}

.faq_img::before {
    position: absolute;
    content: "";
    width: 150px;
    height: 150px;
    bottom: 0;
    right: 0;
    z-index: -1;
    border-bottom: 4px solid var(--primary-color);
    border-right: 4px solid var(--primary-color);
    border-radius: 0px 0px 10px 0px;
}

.faq_img {
    padding: 15px;
    z-index: 1;
    position: relative;
    margin-top: 25px;
    height: 385px;
    margin-left: 25px;
}

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

.faq_img .play_btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: var(--colorPrimary) !important;
    background: var(--colorWhite);
}

.faq_img .play_btn::after {
    background: var(--colorWhite);
}

.faq::after {
    position: absolute;
    content: "";
    background: url(../images/shape-6.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 60px;
    height: 60px;
    top: 15%;
    left: 5%;
    opacity: 0.2;
    animation: zoom_animi linear 1s infinite alternate;
    -webkit-animation: zoom_animi linear 1s infinite alternate;
    z-index: 1;
}

.faq::before {
    position: absolute;
    content: "";
    background: url(../images/shape-2.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 60px;
    height: 60px;
    bottom: 20%;
    right: 5%;
    opacity: 0.2;
    animation: zoom_animi linear 1s infinite alternate;
    -webkit-animation: zoom_animi linear 1s infinite alternate;
    z-index: 1;
}

.play_btn {
    width: 55px;
    height: 55px;
    line-height: 55px;
    text-align: center;
    background: var(--colorPrimary);
    color: var(--colorWhite) !important;
    border-radius: 50%;
    position: relative;
    z-index: 1;
}

.faq_img .play_btn {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: var(--blue-color) !important;
    background: var(--colorWhite);
}

/* faq end */

/* working process start */

.process {
    padding-bottom: 50px;
    background: url("../images/work_bg.jpg");
    background-size: cover !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    position: relative;
    padding-top: 80px;
}

.process_shape {
    position: relative;
}

.work_process_area {
    position: relative;
    z-index: 1;
}

.work_process_area::after {
    position: absolute;
    content: "";
    width: 1000px;
    height: 65px;
    top: 25px;
    left: 50px;
    background-image: url(../images/process_shape.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    z-index: -1;
}

.single_process {
    margin-top: 25px;
}

.process_number.num1 {
    background: var(--primary-color);
}

.process_number.num2 {
    background: var(--blue-color);
}

.process_number.num3 {
    background: var(--secondary-color);
}

.process_number.num4 {
    background: var(--colorYellow);
}

.process_number {
    display: block;
    width: 70px;
    height: 70px;
    line-height: 70px;
    text-align: center;
    font-size: 26px;
    font-weight: 600;
    color: var(--colorWhite);
    background: #ddd;
    border-radius: 50%;
    margin-bottom: 25px;
}

.single_process h4 {
    font-size: 20px;
    font-weight: 700;
    color: var(--colorBlack);
    text-transform: capitalize;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.single_process p {
    margin-top: 15px;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    font-size: 17px;
}

/* working process end */

/* appoitment form start  */
.appoinment {
    position: relative;
    background: var(--colorWhite);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    padding-top: 50px;
    padding-bottom: 60px;
}

.appoinment_bg {
    background: url("../images/appointment_bg.jpg");

    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    position: relative;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}

.appoinment_overlay {
    padding: 60px;
    background: #00a6fbde;
    border-radius: 10px;
}

.mb_30 {
    margin-bottom: 30px !important;
}

.appoinment_form h5,
.appoinment_form h2 {
    color: var(--colorWhite);
}

.appoinment_form h5::after {
    background: var(--colorWhite);
}

.common_heading h5::after {
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    width: 2px;
    height: 20px;
    background: var(--blue-color);
}

.appoinment_form_input {
    margin-top: 20px;
}

.appoinment_form_input input,
.appoinment_form_input select {
    padding: 13px 20px;
    font-size: 16px;
    color: var(--paraColor);
    background-color: var(--colorWhite);
    border: none;
    box-shadow: none;
}

input,
textarea {
    width: 100%;
    padding: 12px 20px;
    outline: none;
    resize: none;
    font-size: 16px;
    font-weight: 400;
    border: 1px solid #5e5b5b17;
    border-radius: 30px;
}

.appoinment_img {
    position: absolute;
    bottom: 0;
    right: 15px;
    height: 605px;
}

img {
    width: 100% !important;
    height: 100% !important;
}

.appoinment_form h5,
.appoinment_form h2 {
    color: var(--colorWhite);
}

.appoinment_form_input input,
.appoinment_form_input select {
    padding: 13px 20px;
    font-size: 16px;
    color: var(--paraColor);
    background-color: var(--colorWhite);
    border: none;
    border-radius: 50px;
    box-shadow: none;
    width: 100%;
}

input,
input:focus,
select,
select:focus {
    height: 42px;
    box-shadow: 0 0 !important;
    outline: 0 !important;
    bordar-color: none !important;
}

p,
span {
    font-size: 16px;
    font-weight: 400;
    margin: 0;
    padding: 0;
    color: var(--paraColor);
    font-family: var(--paraFont);
}

button.bookapoitment_btn {
    color: white;
    background-color: #1d78e2;
    font-size: 18px;
    padding: 12px 40px;
    border-radius: 28px;
    width: 100%;
    font-weight: 600;
    transition: all 0.5s ease;
}

button.bookapoitment_btn:hover {
    background-color: white;
    color: #1d78e2;
}

/* appoitment form end */

/* helpline start  */

.helpline {
    background: #eef9ff;
    position: relative;
    padding-top: 133px;
    padding-bottom: 50px;
}

.helpline::before {
    position: absolute;
    content: "";
    background: url("../images/shape-5.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 60px;
    height: 60px;
    top: 50%;
    left: 45%;
}

.helpline::after {
    position: absolute;
    content: "";
    background: url("../images/shape-1.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 69px;
    height: 63px;
    top: 5%;
    left: 5%;
    animation: zoom_animi linear 1s infinite alternate;
    -webkit-animation: zoom_animi linear 1s infinite alternate;
}

.helpline_iteam {
    margin-top: 45px;
    margin-bottom: 60px;
}

ul,
ol {
    list-style: none;
    margin: 0;
    padding: 0;
}

.helpline_contact li {
    /* margin-right: 30px; */
    padding: 20px;
    background: var(--colorWhite);
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.helpline_contact li span {
    width: 50px;
    height: 50px;
    background: var(--blue-color);
    text-align: center;
    line-height: 52px;
    border-radius: 50%;
    color: var(--colorWhite);
    display: inline-block;
    margin-right: 20px;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.helpline_contact li:hover {
    background: var(--primary-color);
    color: white;
    cursor: pointer;
}

.helpline_contact li:hover i {
    color: var(--primary-color);
}

.helpline_contact li:hover span {
    background-color: white;
}

.helpline_contact_text {
    float: right;
}

.helpline_contact_text p {
    font-size: 18px;
    font-weight: 500;
    font-family: var(--paraFont);
    color: var(--paraColor);
    text-transform: capitalize;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.helpline_contact_text a {
    font-size: 18px;
    font-weight: 500;
    font-family: var(--paraFont);
    color: var(--colorBlack);
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.helpline_img {
    margin-top: 140px;
    height: 365px;
    position: relative;
}

.helpline_img::after {
    position: absolute;
    content: "";
    background: url("../images/helpline_img2.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 178px;
    height: 138px;
    top: -55px;
    left: 25px;
    z-index: 3;
    animation: zoom_animi 2s linear infinite alternate;
    -webkit-animation: zoom_animi 2s linear infinite alternate;
}

.helpline_iteam li {
    font-size: 18px;
    font-weight: 500;
    text-transform: capitalize;
    font-family: var(--paraFont);
    position: relative;
    padding-left: 33px;
    margin-bottom: 18px;
    display: block !important;
}

.helpline_iteam li::after {
    position: absolute;
    content: "\f00c";
    color: var(--colorWhite);
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    top: 2px;
    left: 0;
    width: 23px;
    height: 23px;
    line-height: 24px;
    text-align: center;
    font-size: 11px;
    border-radius: 50%;
    background: var(--blue-color);
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

/* helpline end */

/* our team start  */

section.team {
    padding: 30px 0 0px 0px;
}

.single_team {
    margin-top: 25px;
    border-radius: 10px;
    overflow: hidden;
}

.team_img {
    height: 310px;
    position: relative;
    overflow: hidden;
}

.team_img img {
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
}

.single_team:hover .team_overlay {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    opacity: 1;
}

.team_overlay {
    position: absolute;
    content: "";
    width: 90%;
    height: 90%;
    top: 5%;
    left: 5%;
    opacity: 0;
    background: #00a6fb69;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s ease;
    -moz-transition: all linear 0.3s ease;
    -ms-transition: all linear 0.3s ease;
    -o-transition: all linear 0.3s ease;
}

.team_icon {
    position: absolute;
    bottom: 20px;
    right: 20px;
    background: var(--blue-color);
    border-radius: 30px;
    padding: 3px 5px;
}

.team_icon li a:hover {
    color: var(--blue-color);
    background: var(--colorWhite);
}

.team_icon li a {
    margin: 5px 0px;
    font-size: 15px;
    color: var(--colorWhite);
    display: block;
    width: 33px;
    height: 33px;
    line-height: 35px;
    border-radius: 50%;
    background: transparent;
    text-align: center;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.team_designation {
    position: relative;
    background: var(--blue-color);
    padding: 15px 25px;
    border-bottom-left-radius: 10px;
    border-bottom-right-radius: 10px;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.team_designation h6 {
    font-size: 18px;
    font-weight: 600;
    color: var(--colorWhite);
}

.team_designation p {
    font-size: 14px;
    font-weight: 400;
    color: var(--colorWhite);
    margin-top: 4px;
}

.team_designation span {
    display: block;
    font-size: 14px;
    font-weight: 400;
    color: var(--colorWhite);
    margin-top: 4px;
    position: relative;
    padding-left: 25px;
}

.team_designation .doctor_details_view {
    position: absolute;
    top: 50%;
    right: 25px;
    transform: translateY(-50%);
    width: 35px;
    height: 35px;
    color: var(--blue-color);
    background: var(--colorWhite);
    line-height: 36px;
    text-align: center;
    font-size: 18px;
    border-radius: 50%;
}

.team_designation span::after {
    position: absolute;
    content: "\f19d";
    font-family: "font awesome 5 free";
    font-size: 16px;
    font-weight: 600;
    top: -1px;
    left: 0;
}
.doctor_info h6 a {
    color: #fff;
}

/* our team end */

/* review start */
.review {
    position: relative;
    background: rgba(94, 94, 238, 0.1);
    padding-top: 10px;
    padding-bottom: 80px;
}

.single_review {
    padding: 40px 30px;
    background: var(--colorWhite);
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    position: relative;
    margin: 0px 12px;
}

.review_icon {
    color: #ffc422;
    margin-bottom: 20px;
}

.reviewer_info {
    margin-top: 25px;
}

.reviewer_info .img {
    width: 60px;
    height: 60px;
    float: left;
    margin-right: 20px;
    border-radius: 50%;
    overflow: hidden;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

.reviewer_info h3 {
    display: block;
    font-size: 20px;
    font-weight: 600;
    font-family: var(--paraFont);
    color: var(--colorBlack);
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.single_review::after {
    position: absolute;
    content: "";
    background: url(../images/review-shape.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 52px;
    height: 40px;
    bottom: 30px;
    right: 30px;
}

.single_review:hover .tf_reviewer_name {
    color: var(--colorPrimary);
}

.review::after {
    position: absolute;
    content: "";
    background: url(../images/shape-4.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 90px;
    height: 90px;
    bottom: 10%;
    left: 5%;
    opacity: 0.2;
    animation: zoom_animi 1s linear infinite alternate;
    -webkit-animation: zoom_animi 1s linear infinite alternate;
}

.review::before {
    position: absolute;
    content: "";
    background: url(../images/shape-2.png);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 90px;
    height: 90px;
    top: 10%;
    right: 10%;
    opacity: 0.2;
    animation: shake_animi 2s linear infinite alternate;
    -webkit-animation: shake_animi 2s linear infinite alternate;
}

.slick-dots {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 30px;
}

.slick-dots li button {
    font-size: 0;
    border-radius: 10px;
    background: rgb(0 166 251 / 30%);
    width: 15px;
    height: 8px;
    margin: 0px 2px;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.slick-dots li.slick-active button {
    background: var(--blue-color);
    width: 30px;
}

/* review end */

/* blog start */
.blog {
    position: relative;
    padding-top: 60px;
    padding-bottom: 60px;
}

.single_blog {
    margin-top: 25px;
    border-radius: 10px;
    background: var(--colorWhite);
    overflow: hidden;
    box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
}

.blog_img {
    height: 260px;
    position: relative;
    overflow: hidden;
}

.blog_img img {
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.blog_text {
    padding: 30px;
}

.blog_text .blog_date li {
    margin-right: 20px;
    font-size: 15px;
    font-weight: 400;
    color: var(--paraColor);
}

.blog_text .blog_date li i {
    color: var(--blue-color);
    margin-right: 10px;
}

.blog_text .blog_heading {
    font-size: 24px;
    font-weight: 600;
    font-family: var(--headingFont);
    color: var(--colorBlack);
    text-transform: capitalize;
    margin: 15px 0px;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.blog_text p {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.blog_text_icon {
    display: flex;
    justify-content: space-between;
    margin-top: 20px;
}

.blog_text_icon .blog_link {
    font-size: 16px;
    font-weight: 500;
    text-transform: capitalize;
    color: var(--colorBlack);
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.blog_text_icon .blog_link i {
    margin-left: 5px;
}

.blog_text_icon .blog_link:hover {
    color: var(--blue-color);
}

.blog_react li {
    font-size: 16px;
    font-weight: 400;
    color: var(--paraColor);
    margin-left: 15px;
}

.blog_react li i {
    margin-right: 5px;
}

.blog_heading:hover {
    color: var(--blue-color);
}

.single_blog .category {
    position: absolute;
    top: 15px;
    left: 15px;
    font-size: 14px;
    background: var(--primary-color);
    color: var(--colorWhite);
    padding: 5px 20px;
    border-radius: 30px;
    z-index: 1;
}

.single_blog .category.blue {
    background: var(--blue-color);
}

.single_blog .category.red {
    background: #f7588d;
}

.single_blog:hover img {
    transform: scale(1.05);
    -webkit-transform: scale(1.05);
    -moz-transform: scale(1.05);
    -ms-transform: scale(1.05);
    -o-transform: scale(1.05);
}

/* blog end */

/* footer start */
.footer {
    background: url("../images/footer_bg.jpg");
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    position: relative;
    padding-top: 30px;
}

.tf_footer_logo {
    width: 165px;
    margin-bottom: 30px;
    display: inline-block;
}

.footer_mail {
    margin-top: 25px;
    margin-bottom: 15px;
}

.footer_mail span,
.tf_footer_icon span {
    font-size: 16px;
    font-weight: 500;
    color: var(--colorBlack);
    display: inline-block;
    min-width: 85px;
}

.footer_mail a {
    font-size: 16px;
    font-weight: 400;
    font-family: var(--paraFont);
    color: var(--paraColor);
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.footer_mail a:hover {
    color: var(--blue-color);
}

.tf_footer_icon ul li a {
    font-size: 16px;
    margin-right: 10px;
    color: var(--blue-color);
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    background: #fff;
    display: block;
    border-radius: 50%;
}

.tf_footer_icon ul li a:hover {
    color: var(--colorWhite);
    background: var(--blue-color);
}

.quick_link h5,
.address h5 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 25px;
}

.quick_link ul li a {
    font-size: 16px;
    font-weight: 400;
    font-family: var(--paraFont);
    color: var(--paraColor);
    text-transform: capitalize;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
    display: block;
    margin-top: 12px;
}

.quick_link ul li {
    display: block;
}

.quick_link ul li a:hover {
    color: var(--blue-color);
    padding-left: 5px;
}

.tf_footer_address {
    margin-top: 15px;
}

.tf_footer_address p,
.tf_footer_address a {
    margin-bottom: 0;
}

.tf_footer_address p,
.tf_footer_address a {
    display: block;
    padding-left: 30px;
    position: relative;
    padding-bottom: 20px;
    color: var(--paraColor);
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.tf_footer_address p i,
.tf_footer_address a i {
    color: var(--blue-color);
    position: absolute;
    left: 0;
    top: 4px;
    font-size: 18px;
}

.tf_footer_address a:hover {
    color: var(--blue-color);
}

.copyright {
    padding: 20px 0px;
    border-top: 1px solid #ddd;
}

.copyright ul li a {
    font-size: 16px;
    font-weight: 400;
    font-family: var(--paraFont);
    color: var(--paraColor);
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
    margin-left: 25px;
}

.copyright ul li a:hover {
    color: var(--blue-color);
}

.subscription {
    background: var(--blue-color);
    padding: 40px;
    border-radius: 100px;
    position: relative;
    top: -60px;
    width: 100%;
    -webkit-border-radius: 100px;
    -moz-border-radius: 100px;
    -ms-border-radius: 100px;
    -o-border-radius: 100px;
}

.subscribe_text h2 {
    color: var(--colorWhite);
    font-size: 32px;
    font-weight: 600;
}

.subscrib_form {
    position: relative;
}

.subscrib_form input {
    padding: 30px 20px;
    border: none;
    background: var(--colorWhite);
    position: relative;
    text-transform: capitalize;
}

.subscrib_form .subscrib_btn {
    width: 139px;
    height: 49px;
    font-weight: 500;
    font-size: 17px;
    position: absolute;
    top: 50%;
    right: 7px;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
}

/* footer end */

/* scroll button start */
.scroll_btn {
    width: 35px;
    height: 70px;
    border-radius: 25px;
    position: fixed;
    bottom: 30px;
    right: 30px;
    z-index: 111;
    cursor: pointer;
    text-align: center;
    line-height: 70px;
    background: var(--blue-color);
    border: 3px solid var(--colorWhite);
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.scroll_btn span {
    font-size: 16px;
    color: var(--colorWhite);
    animation: scroll_amini linear 2s infinite alternate;
    -webkit-animation: scroll_amini linear 2s infinite alternate;
    position: absolute;
    left: 50%;
    bottom: -20px;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
}

.scroll_btn:hover {
    background: var(--primary-color);
}

@keyframes scroll_amini {
    from {
        bottom: -20px;
    }

    to {
        bottom: 12px;
    }
}

/* scroll button end */

/* .page-breadcrumb start */

.breadcrumb {
    background: url(../images/breadcrumb_bg.jpg);
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    padding: 186px 0px 128px;
    position: relative;
}

.breadcrumb::after {
    position: absolute;
    content: "";
    background: #013c5aa3;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 1;
}

.breadcrumb_text {
    position: relative;
    z-index: 2;
}

.breadcrumb_text h1 {
    font-size: 56px;
    font-weight: 700;
    text-transform: capitalize;
    margin-bottom: 10px;
    color: var(--colorWhite);
}

.breadcrumb_text ul {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    margin-left: 20px;
}

.breadcrumb_text ul li,
.breadcrumb_text ul li a {
    font-size: 18px;
    font-weight: 500;
    font-family: var(--paraFont);
    color: var(--colorWhite);
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.breadcrumb_text ul li a {
    position: relative;
    margin-right: 15px;
    padding-right: 15px;
}

.breadcrumb_text ul li a::after {
    position: absolute;
    content: "\f054";
    font-family: "font awesome 5 free";
    font-weight: 600;
    font-size: 12px;
    color: var(--colorWhite);
    top: 4px;
    right: -4px;
}

.breadcrumb_text ul li a:hover {
    color: var(--colorWhite);
}

.breadcrumb_text ul li {
    color: var(--colorWhite);
}

.breadcrumbs::after {
    position: absolute;
    content: "";
    background: url("../images/shape-1.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    width: 92px;
    height: 92px;
    bottom: 67px;
    right: 8%;
}

/* .page-breadcrumb end */

/* ===========================
  SERVICE DETAILS START
=============================*/
.service_dstails_img {
    height: 400px;
    position: relative;
}

.service_dstails_img img {
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}

.service_dstails_img span {
    position: absolute;
    bottom: -10px;
    right: 46px;
    width: 70px;
    height: 70px;
    line-height: 70px;
    font-size: 30px;
    background: var(--blue-color);
    color: var(--colorWhite);
    text-align: center;
    border-radius: 10px;
}

.tf_service_details_text h1,
.tf_service_details_text h2,
.tf_service_details_text h3,
.tf_service_details_text h4,
.tf_service_details_text h5,
.tf_service_details_text h6 {
    font-weight: 600;
    text-transform: capitalize;
    margin-top: 25px;
}

.tf_service_details_text h1,
.tf_service_details_text h2 {
    font-size: 32px;
}

.tf_service_details_text h3,
.tf_service_details_text h4 {
    font-size: 28px;
}

.tf_service_details_text h5,
.tf_service_details_text h6 {
    font-size: 24px;
}

.tf_service_details_text p {
    margin-top: 25px;
}

.tf_service_details_text ul,
.tf_service_details_text ol {
    margin-top: 25px;
    margin-bottom: 25px;
}

.tf_service_details_text ul li,
.tf_service_details_text ol li {
    font-size: 16px;
    font-weight: 400;
    font-family: var(--paraFont);
    color: var(--paraColor);
    position: relative;
    padding-left: 33px;
    margin-bottom: 15px;
}

.tf_service_details_text ul li::after,
.tf_service_details_text ol li::after {
    position: absolute;
    content: "\f00c";
    color: var(--colorWhite);
    font-family: "Font Awesome 5 Free";
    font-weight: 600;
    top: 1px;
    left: 0;
    width: 22px;
    height: 22px;
    line-height: 22px;
    text-align: center;
    font-size: 11px;
    border-radius: 50%;
    background: var(--colorPrimary);
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.service_details_gallery {
    margin-top: 25px;
    display: block;
    height: 250px;
    position: relative;
    overflow: hidden;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}

.service_details_gallery .overlay {
    position: absolute;
    background: #0d79b1c9;
    width: 90%;
    height: 90%;
    top: 5%;
    left: 5%;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
    opacity: 0;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.service_details_gallery .overlay i {
    display: block;
    font-size: 30px;
    width: 60px;
    height: 60px;
    line-height: 60px;
    border: 2px solid var(--colorWhite);
    color: var(--colorWhite);
    text-align: center;
    border-radius: 50%;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.service_details_gallery:hover .overlay {
    opacity: 1;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
}

.tf_service_dtls_process {
    margin-top: 50px;
    text-align: center;
}

.tf_service_dtls_process i {
    font-size: 36px;
    color: var(--colorPrimary);
}

.tf_service_dtls_process h5 {
    font-size: 24px;
    font-weight: 600;
    text-transform: capitalize;
    margin-top: 10px;
    margin-bottom: 10px;
}

.tf_service_pdf_link {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding-top: 25px;
}

.tf_service_pdf_link li {
    width: 48%;
}

.tf_service_pdf_link li a {
    color: var(--paraColor);
    font-size: 16px;
    text-align: center;
    padding: 20px 0px;
    margin-top: 25px;
    width: 100%;
    display: block;
    border: 1px solid rgba(0, 166, 251, 0.1);
    background: rgba(0, 166, 251, 0.08);
    border-radius: 40px;
    -moz-border-radius: 40px;
    -ms-border-radius: 40px;
    -o-border-radius: 40px;
    -webkit-border-radius: 40px;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.tf_service_pdf_link li a i {
    color: var(--blue-color);
    font-size: 20px;
    margin-right: 15px;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.tf_service_pdf_link li a span {
    color: var(--colorBlack);
    font-size: 16px;
    font-weight: 600;
    text-transform: uppercase;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.tf_service_pdf_link li a:hover {
    color: var(--colorWhite);
    background: var(--blue-color);
}

.tf_service_pdf_link li a:hover i,
.tf_service_pdf_link li a:hover span {
    color: var(--colorWhite);
}

.service_dtls_rightside {
    border: 1px solid #5e5b5b17;
    border-radius: 10px;
    padding: 30px;
    margin-bottom: 30px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}

.service_dtls_rightside h5 {
    font-size: 24px;
    font-weight: 600;
    text-transform: capitalize;
    border-bottom: 2px solid #5e5b5b17;
    padding-bottom: 5px;
    margin-bottom: 25px;
    position: relative;
}

.service_dtls_rightside h5::after {
    position: absolute;
    content: "";
    width: 100px;
    height: 2px;
    bottom: -2px;
    left: 0;
    background: var(--colorPrimary);
}

.service_dtls_rightside input,
.service_dtls_rightside select {
    width: 100%;
    padding: 10px 0px 10px 12px;
    border-radius: 30px;
    box-shadow: none;
}

.form-select:focus {
    border-color: #5c728e3d;
    box-shadow: none;
}

.service_dtls_rightside_img {
    position: relative;
}

.service_dtls_rightside_img img {
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}

.service_dtls_img_text {
    position: absolute;
    top: 0;
    left: 0;
    padding: 100px 80px;
    height: 100%;
    text-align: center;
    background: #031d36c7;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}

.service_dtls_img_text i {
    font-size: 36px;
    color: var(--colorPrimary);
}

.service_dtls_img_text h3 {
    font-size: 44px;
    font-weight: 600;
    text-transform: capitalize;
    color: var(--colorWhite);
    margin: 34px 0px 50px;
}

.sidebar_category li a::after {
    position: absolute;
    content: "\f054";
    font-family: "font awesome 5 free";
    font-weight: 600;
    font-size: 12px;
    color: var(--paraColor);
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    transition: all linear 0.3s;
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.sidebar_category li a {
    display: block;
    color: #031d36;
    font-style: normal;
    font-weight: 400;
    border-bottom: 1px solid #5e5b5b17;
    padding-bottom: 15px;
    margin-bottom: 15px;
    position: relative;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

ul.sidebar_category li {
    display: inherit !important;
}

.sidebar_tags ul li {
    margin-bottom: 20px;
}

.sidebar_tags ul li a:hover {
    color: var(--blue-color);
    border-color: var(--blue-color);
}

.sidebar_tags ul li a {
    color: #031d36;
    text-align: center;
    font-size: 14px;
    border-radius: 30px;
    border: 1px solid rgba(3, 29, 54, 0.1);
    padding: 4px 17px;
    margin-top: 17px;
    margin-right: 10px;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
    -webkit-border-radius: 30px;
}

.blog_form {
    position: relative;
    margin-top: 10px;
}

.service_dtls_rightside input,
.service_dtls_rightside select {
    width: 100%;
    padding: 22px 0px 22px 14px;
    border-radius: 30px;
    box-shadow: none;
}

section.service_details {
    padding: 20px 0px;
}

._blog_btn {
    position: absolute;
    width: 36px;
    height: 36px;
    line-height: 36px;
    border-radius: 50%;
    top: 5px;
    right: 5px;
    font-size: 14px;
    background: var(--blue-color);
    color: var(--colorWhite);
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.sidebar_post li {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 20px;
    align-items: center;
}

.recent_post_img {
    width: 80px;
    height: 80px;
    margin-right: 15px;
    overflow: hidden;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}

.recent_post_text {
    width: 61%;
}

.recent_post_text a {
    font-family: var(--headingFont);
    font-size: 16px;
    font-weight: 600;
    text-transform: capitalize;
    margin-top: 5px;
    color: var(--colorBlack);
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.recent_post_text p,
span {
    font-size: 16px;
    font-weight: 400;
    margin: 0;
    padding: 0;
    color: var(--paraColor);
    font-family: var(--paraFont);
}

.recent_post_text p i {
    color: var(--blue-color);
    margin-right: 5px;
}

/* comment area start  */

.comment_area {
    border: 1px solid #5e5b5b17;
    padding: 30px;
    margin-top: 50px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}

.comment_area h2 {
    font-size: 24px;
    font-weight: 600;
    text-transform: capitalize;
}

.single_comment {
    border-top: 1px solid #5e5b5b17;
    display: flex;
    flex-wrap: wrap;
    margin-top: 25px;
    padding-top: 25px;
}

.comment_img {
    width: 90px;
    height: 90px;
    overflow: hidden;
    border-radius: 50%;
    margin-right: 20px;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    -ms-border-radius: 50%;
    -o-border-radius: 50%;
}

.comment_text {
    width: 87%;
}

.comment_text h4 {
    font-size: 20px;
    font-weight: 600;
    text-transform: capitalize;
    margin-bottom: 10px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
}

.comment_text h4 span {
    font-size: 14px;
    font-weight: 400;
    font-family: var(--paraFont);
}

.comment_text h4 span i {
    margin-right: 5px;
}

.comment_text p {
    margin-bottom: 13px;
}

.comment_text .rating {
    color: #ffc422;
    display: block;
    margin-bottom: 10px;
}

.comment_text a {
    font-size: 14px;
    font-weight: 400;
    color: var(--colorWhite);
    text-transform: capitalize;
    padding: 7px 20px;
    border-radius: 30px;
    background: var(--colorPrimary);
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
    -webkit-border-radius: 30px;
    -moz-border-radius: 30px;
    -ms-border-radius: 30px;
    -o-border-radius: 30px;
}

.comment_text a i {
    margin-right: 5px;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.comment_text a:hover {
    background: var(--colorSecondary);
}

.commant_reply {
    margin-left: 90px;
}

.commant_reply .comment_text {
    width: 84%;
}

.comment_text .review_icon {
    margin-top: 12px;
    margin-bottom: 12px;
}

.review_icon_noncolor {
    color: #5c728e3d !important;
}

.comment_input_area {
    border: 1px solid #5e5b5b17;
    padding: 30px;
    margin-top: 50px;
    border-radius: 10px;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    -ms-border-radius: 10px;
    -o-border-radius: 10px;
}

.comment_input_area input {
    margin-bottom: 20px;
}

.comment_input_area button {
    margin-top: 15px;
}

.comment_input_area h2 {
    font-size: 24px;
    font-weight: 600;
    text-transform: capitalize;
    margin-bottom: 25px;
}

.comment_input_area p {
    color: #ffc422;
    font-size: 16px;
    margin-bottom: 25px;
}

.comment_input_area p i {
    cursor: pointer;
    transition: all linear 0.3s;
    -webkit-transition: all linear 0.3s;
    -moz-transition: all linear 0.3s;
    -ms-transition: all linear 0.3s;
    -o-transition: all linear 0.3s;
}

.comment_input_area p i:hover {
    color: var(--colorBlack);
}

/* comment area end */

/*===============gallery photo====================*/
item-img {
    position: relative;
    margin-bottom: 30px;
}

.item-img img {
    height: 100%;
    width: 100%;
}

.item-img {
    position: relative;
    overflow: hidden;
    margin: 14px 0;
    height: 250px;
}

.item-img img {
    height: 100%;
    width: 100%;
    transition: 0.35s;
}

.item-img:hover.item-img img {
    transform: scale(1.2);
}

.item-img-overlay {
    position: absolute;
    right: 0;
    text-align: center;
    top: 50%;
    height: 100%;
    width: 100%;
    transform: translateY(-50%);
    background: rgba(0, 126, 202, 0.8);
    opacity: 0;
    transition: 0.35s;
}

.item-img-overlay i {
    color: #fff;
    font-size: 25px;
}

.item-img:hover .item-img-overlay {
    opacity: 1;
}

.item-img-overlay h5 {
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    top: 35%;
    transform: translateY(-35%);
    opacity: 0;
    transition: 0.35s all;
    font-weight: 600;
    text-transform: capitalize;
    color: #fff;
}

.item-img-overlay .icons {
    position: absolute;
    left: 0;
    right: 0;
    text-align: center;
    top: 65%;
    transform: translateY(-65%);
    opacity: 0;
    transition: 0.35s all;
}

.item-img:hover .item-img-overlay .sm-titl {
    top: 40%;
    opacity: 1;
}

.item-img:hover .item-img-overlay .icons {
    top: 60%;
    opacity: 1;
}

.icons span {
    margin: 0 6px;
}

/*===============gallary photo end====================*/
.lg-backdrop,
.lg-outer,
.lg-container,
.lg-toolbar,
.lg-thumb-outer {
    z-index: 99999 !important;
}

/* LightGallery image contain */
.lg-img-wrap img,
.lg-object {
    object-fit: contain !important;
    width: 100% !important;
    height: 100% !important;
}


.appointment-form {
    background: #ffffff;
    padding: 30px;
    border-radius: 14px;
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.08);
}

.form-field {
    margin-bottom: 18px;
    position: relative;
}

.form-field input,
.form-field select {
    width: 100%;
    padding: 14px 16px;
    border-radius: 10px;
    border: 1px solid #dfe6e9;
    font-size: 15px;
    transition: all .3s ease;
    background: #f9fbfd;
}

.form-field input:focus,
.form-field select:focus {
    outline: none;
    border-color: #2ecc71;
    background: #ffffff;
    box-shadow: 0 0 0 4px rgba(46, 204, 113, 0.15);
    transform: translateY(-2px);
}

/* Select2 fix */
.interactive-select {
    height: 50px;
}

/* Button */
.btn-appointment {
    width: 100%;
    padding: 14px;
    border-radius: 12px;
    background: linear-gradient(135deg, #2ecc71, #27ae60);
    color: #fff;
    font-weight: 600;
    font-size: 16px;
    border: none;
    cursor: pointer;
    transition: all .3s ease;
    box-shadow: 0 12px 30px rgba(46, 204, 113, 0.35);
}

.btn-appointment:hover {
    transform: translateY(-3px);
    box-shadow: 0 18px 40px rgba(46, 204, 113, 0.45);
}

.btn-appointment:active {
    transform: scale(0.97);
}

.payment-wrapper {
    background: #f6fbf8;
    border-radius: 14px;
    padding: 20px;
    margin-bottom: 20px;
    border: 1px solid #e3f4ea;
}

.payment-title {
    font-weight: 600;
    margin-bottom: 14px;
    color: #2d3436;
}

.payment-option {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 10px;
    cursor: pointer;
    transition: all .3s ease;
}

.payment-option:hover {
    background: #ecf9f1;
}

.payment-option input {
    display: none;
}

/* Custom Radio */
.custom-radio {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    border: 2px solid #2ecc71;
    position: relative;
}

.payment-option input:checked+.custom-radio::after {
    content: "";
    width: 10px;
    height: 10px;
    background: #2ecc71;
    border-radius: 50%;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.label-text {
    font-weight: 500;
    color: #34495e;
}

/* ============ Donation Wrapper ================ */
.donation-wrapper {
    background: #f2f7fd;
    padding: 60px 20px;
    /*        min-height: 100vh;*/
}

.donation-title {
    text-align: center;
    font-size: 32px;
    font-weight: 700;
    color: #1d4ed8;
    margin-bottom: 40px;
}

.donation-form {
    background: #00a6fb08;
    padding: 35px;
    border-radius: 3px;
    border: 1px solid #ddd;
}

.donation-grid {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    gap: 20px;
    align-items: center;
    margin-bottom: 40px;
}

.donation-group label {
    font-weight: 600;
    margin-bottom: 6px;
    display: block;
}

.donation-group label span {
    color: red;
}

.donation-group select,
.donation-group input {
    width: 100%;
    padding: 12px 14px;
    border-radius: 8px;
    border: 1px solid #d1d5db;
    outline: none;
    font-size: 14px;
}

.donation-group select:focus,
.donation-group input:focus {
    border-color: #2563eb;
}

.donation-submit {
    text-align: center;
}

.donation-submit button {
    background: var(--primary-color);
    color: #fff;
    border: none;
    padding: 9px 25px;
    border-radius: 8px;
    font-size: 16px;
    font-weight: 600;
    margin-top: 28px;
    cursor: pointer;
    width: 100%;
}

.donation-submit button:hover {
    background: var(--blue-color);
}

.donation-footer {
    margin-top: 30px;
    text-align: center;
    font-size: 14px;
    color: #374151;
}

.donation-footer a {
    color: #2563eb;
    text-decoration: none;
    font-weight: 600;
}

/* Responsive */
@media (max-width: 992px) {
    .donation-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (max-width: 576px) {
    .donation-grid {
        grid-template-columns: 1fr;
    }
}

/* ================================ */

/* Center Card */
.form-card {
    max-width: 560px;
    margin: 0 auto;
    background: #ffffff;
    padding: 35px 40px;
    border-radius: 18px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.05);
}

/* Title */
.form-card h2 {
    text-align: center;
    color: #1e73be;
    font-weight: 700;
    margin-bottom: 30px;
}

/* Form Group */
.form-group {
    margin-bottom: 10px;
}

/* Labels */
.form-group label {
    display: block;
    font-weight: 600;
    color: #333;
}

/* Inputs + Select */
.form-group input,
.form-group select {
    width: 100%;
    padding: 12px 14px;
    border-radius: 8px;
    border: 1px solid #dcdcdc;
    font-size: 14px;
    transition: 0.3s;
    background: #fff;
}

/* Focus Effect */
.form-group input:focus,
.form-group select:focus {
    border-color: #1e73be;
    outline: none;
    box-shadow: 0 0 0 3px rgba(30, 115, 190, 0.1);
}

/* Payment Section */
.payment-methods {
    display: flex;
    gap: 15px;
    margin-top: 10px;
}

/* Payment Box */
.pay-option {
    flex: 1;
    padding: 18px;
    border-radius: 12px;
    border: 2px solid #e0e0e0;
    text-align: center;
    cursor: pointer;
    transition: 0.3s ease;
    background: #fff;
    font-weight: 500;
}

.pay-option i {
    display: block;
    font-size: 22px;
    margin-bottom: 8px;
}

/* Hover */
.pay-option:hover {
    border-color: #28a745;
}

/* Active Cash Style (Green Like Image) */
.active-cash {
    background: #e6f6ea;
    border-color: #28a745;
    color: #28a745;
    font-weight: 600;
}

/* When bkash selected */
.active-bkash {
    background: #fde7f3;
    border-color: #e2136e;
    color: #e2136e;
}

/* Submit Button */
.submit-btn {
    width: 100%;
    padding: 14px;
    border-radius: 10px;
    border: none;
    background: #28a745;
    color: #fff;
    font-size: 16px;
    font-weight: 600;
    cursor: pointer;
    margin-top: 10px;
    transition: 0.3s;
}

.submit-btn:hover {
    background: #218838;
}

/* bKash Details Box */
#bkashDetails {
    background: #fff;
    border: 1px solid #eee;
    padding: 15px;
    border-radius: 10px;
    margin-top: 15px;
}


/* =========================
    CATEGORY DESIGN
========================= */
.category_list {
    list-style: none;
    padding: 0;
    display: inline-flex;
    gap: 15px;
    flex-wrap: wrap;
}

.category_list li {
    padding: 8px 18px;
    border-radius: 30px;
    border: 1px solid #ddd;
    cursor: pointer;
    transition: .3s;
    font-weight: 500;
}

.category_list li.active,
.category_list li:hover {
    background: #000;
    color: #fff;
}


/* =========================
    NEWSPAPER STYLE
========================= */

/* ==============================
   MAIN CONTAINER
================================= */
.newspaper {
    background: #f8f8f8;
    padding: 50px;
    border: 1px solid #dcdcdc;
    margin-bottom: 60px;
    font-family: 'Georgia', serif;
}

/* ==============================
   HEADLINE
================================= */
.headline {
    font-size: 48px;
    font-weight: 700;
    line-height: 1.2;
    margin-bottom: 40px;
}

/* ==============================
   TOP GRID
================================= */
.top-grid {
    display: grid;
    grid-template-columns: 1fr 380px;
    gap: 50px;
    margin-bottom: 40px;
}

/* ==============================
   LEFT TIMELINE STYLE
================================= */
.timeline {
    position: relative;
    padding-left: 40px;
}

.timeline:before {
    content: '';
    position: absolute;
    left: 15px;
    top: 0;
    bottom: 0;
    width: 2px;
    background: #e74c3c;
}

.timeline p {
    position: relative;
    margin-bottom: 20px;
    padding-left: 20px;
    border-bottom: 1px dotted #bbb;
    padding-bottom: 10px;
}

.timeline p:before {
    content: '';
    position: absolute;
    left: -30px;
    top: 5px;
    width: 12px;
    height: 12px;
    background: #e74c3c;
    border-radius: 50%;
}

/* ==============================
   IMAGE BOX
================================= */
.image-box {
    border: 1px solid #cfcfcf;
    padding: 10px;
    background: #fff;
}

.image-box img {
    width: 100%;
    height: 420px;
    object-fit: contain;
}

/* ==============================
   BOTTOM 2 COLUMN NEWSPAPER
================================= */
.bottom-content {
    column-count: 2;
    column-gap: 50px;
    column-rule: 1px solid #ccc;
    font-size: 16px;
    line-height: 1.9;
    text-align: justify;
}

/* ==============================
   Donation
================================= */
.donation-card {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    transition: 0.3s ease-in-out;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08);
    height: 100%;
    display: flex;
    flex-direction: column;
}

.donation-card:hover {
    transform: translateY(-5px);
}

.donation-image {
    height: 220px;
    overflow: hidden;
}

.donation-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.donation-content {
    padding: 20px;
    flex-grow: 1;
    display: flex;
    flex-direction: column;
}

.donation-content h4 {
    font-weight: 600;
    margin-bottom: 10px;
}

.donation-content p {
    flex-grow: 1;
    color: #555;
    font-size: 14px;
}

.donate-btn {
    display: block;
    text-align: center;
    padding: 10px;
    background: #2f6fa3;
    color: #fff;
    border-radius: 8px;
    text-decoration: none;
    font-weight: 500;
    transition: 0.3s;
}

.donate-btn:hover {
    background: #1f4f78;
}

/* ==============================
   donation details
================================= */

.donation-top {
    text-align: center;
    padding: 60px 20px;
    background: #ffffff;
}

.donation-top h1 {
    font-size: 32px;
    font-weight: 700;
    margin-bottom: 15px;
}

.donation-top p {
    max-width: 700px;
    margin: 0 auto 25px;
    color: #555;
}

.donation-form {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-bottom: 20px;
}

.donation-form input {
    padding: 12px;
    width: 250px;
    border: 1px solid #ccc;
    border-radius: 6px;
}

/* Amount Section */

.donation-amount {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 15px;
}

.amount-btn {
    background: #0ea5a8;
    color: #fff;
    border: none;
    padding: 10px 18px;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
}

.amount-btn:hover {
    background: #0b8a8d;
}

.or-text {
    font-weight: 600;
}

.custom-amount {
    width: 100px;
    padding: 10px;
    border: 1px solid #aaa;
    border-radius: 6px;
}

.donate-details-btn {
    background: var(--blue-color);
    color: #fff;
    border: none;
    padding: 11px 22px;
    border-radius: 6px;
    cursor: pointer;
    font-weight: 600;
}

.donate-btn:hover {
    background: var(--primary-color);
}

/* Bottom Section */

.donation-details-content {
    color: white;
    z-index: 1;
    position: relative;
    padding: 50px 0;
}

.donation-details-content::after {
    content: "";
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(to right, #2b6aa3 50%, transparent);
    z-index: -1;
}

.donation-content-left {
    width: 50%;
}

.donation-content-left h2 {
    font-size: 28px;
    margin-bottom: 20px;
}

.donation-content-left p {
    margin-bottom: 15px;
    line-height: 1.6;
}

.program-section {
    padding: 60px 0;
    background: #f5f5f5;
}



.program-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
}

/* Left */

.video-box iframe {
    width: 100%;
    height: 300px;
    border-radius: 12px;
}

.video-box {
    background: #fff;
    padding: 2px 10px;
    border-radius: 15px;
    margin-bottom: 15px;
}

.info-card {
    background: #fff;
    padding: 25px;
    border-radius: 12px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05);
    margin-bottom: 20px;
}

.image-box img {
    width: 100%;
    border-radius: 12px;
    margin-top: 20px;
}

h1.donateion_header_title {
    font-size: 20px;
    padding: 10px 0;
    color: var(--blue-color);
    font-weight: 600;
}



/* ==============================
   Doctor Details
================================= */
.doctor_details_section {
    padding: 60px 0;
    background: #f5f6f8;
    font-family: Arial, sans-serif;
}

.doctor_info {
    width: 80%;
    white-space: nowrap;
    overflow: hidden;
}

.doctor_details_wrapper {
    display: flex;
    gap: 60px;
    align-items: flex-start;
}

/* LEFT */

.doctor_details_left {
    flex: 1;
}

.doctor_details_specialization {
    color: #3aa6b9;
    font-size: 14px;
    display: block;
    margin-bottom: 10px;
}

.doctor_details_name {
    font-size: 28px;
    font-weight: 700;
    margin-bottom: 10px;
    position: relative;
    padding-left: 15px;
}

.doctor_details_name::before {
    content: "";
    width: 4px;
    height: 25px;
    background: #d81b60;
    position: absolute;
    left: 0;
    top: 5px;
}

.doctor_details_degree {
    font-weight: 600;
    margin-bottom: 5px;
}

.doctor_details_designation {
    color: #666;
    margin-bottom: 20px;
}

.doctor_details_description p {
    color: #555;
    line-height: 1.7;
    margin-bottom: 15px;
    font-size: 15px;
}

/* RIGHT */

.doctor_details_right {
    width: 380px;
}

.doctor_details_image_box {
    border: 1px solid #cfd8dc;
    border-radius: 10px;
    padding: 15px;
    background: #fff;
}

.doctor_details_image_box img {
    width: 100%;
    border-radius: 8px;
}

.doctor_details_info {
    margin-top: 20px;
    color: #555;
}

.doctor_details_location,
.doctor_details_schedule {
    margin-bottom: 10px;
    font-size: 14px;
}

/* Responsive */

@media (max-width: 992px) {
    .doctor_details_wrapper {
        flex-direction: column;
    }

    .doctor_details_right {
        width: 100%;
    }
}
/* ==============================
   RESPONSIVE
================================= */
@media(max-width:992px) {

    .top-grid {
        grid-template-columns: 1fr;
    }

    .bottom-content {
        column-count: 1;
    }

    .headline {
        font-size: 34px;
    }

    .image-box img {
        height: auto;
    }
}