.col-lg-3.col-md-4.col-sm-6.col-12.mb-3 img.img-fluid {
    padding: 1px;
    height: 470px;
    object-fit: fill;
	border-radius: 5px;
    background-color:#fff;
}
.content-matter ul li {
    list-style: circle;
    margin-left: 20px;
}

*body{font-family: "Manrope", sans-serif;overflow-x: hidden;}

.lising_bas_data ul li {

    list-style: inside;

    color: #065149;

    font-size: 20px;

    margin-bottom: 6px;

}

img.img-fluid.w-100.image-set {

    background: #fff;

    border-radius: 25px;

    box-shadow: 0px 0px 2px #000;

    height: 60vh;

    object-fit: cover;

}

.basic-items {

    background-image: linear-gradient(180deg, #065149, #065149, #fff);

    width: 100px;

    border-radius: 100px;

    font-size: 2em;

    display: flex;

    font-weight: 800;

    text-align: center;

    color: #fff;

    height: 100px;

    justify-content: center;

    align-items: center;

}

span.review-stars {

    color: #e1ae14;

    position: relative;

    font-size: 27px;

    text-shadow: 0px 0px 5px #ffffff;

}

.blog-card img.custome-logo-press {

    position: absolute;

    height: 70px;

    width: auto;

    border: 3px solid #065149;

    background: #ffffff96;

    padding: 5px;

    margin: 5px;

    border-radius: 10px;

    transform: scale(1.0);

    transition: .3s;

}

.blog-card:hover img.custome-logo-press {

    position: absolute;

    height: 80px;

    width: auto;

    border: 3px solid #065149;

    background: #ffffff96;

    padding: 5px;

    margin: 5px;

    border-radius: 10px;

    transform: scale(1.1);

    transition: .3s;

}

img.img-res-basic {

    height: 70px;

    object-fit: cover;

    width: 70px;

}

section.program-section.tour-secton{padding: 40px 0;margin: 40px 0;}

section.tour-proc {

    background: #e6f1f0;

    padding: 60px 0px;

    margin-top: 0px;

}

img.img-fluid-icons {

    border-radius: 100px;

    width: 50px;

    object-fit: cover;

    height: 50px;

    border: 2px solid #fff;

}

img.img-ser-cs {

    height: 300px;

    bottom: 0em;

    position: relative;

   animation: xfghthdfghbghggfgfs 2s ease 0s infinite normal forwards;

}

@keyframes xfghthdfghbghggfgfs {

    0% {

        transform: translateY(0)scale(1.5);

    }



    50% {

        transform: translateY(10px)scale(1.4);

    }





       100% {

        transform: translateY(0)scale(1.5);

    }

}

img.servcie-ca-img {

    background: #ffffff;

    height: 100px;

    width: 100px;

    object-fit: cover;

    box-shadow: 0px 0px 0px 15px #06514969;

    border-radius: 50%;

}

.modal-fullscreen .modal-content {

    background: #16675ec7;

}

.modal-header{background-color: #16675e00;border: none !important;}



.card-custome {

    text-align: center;

    margin: auto;

    background-image: linear-gradient(to bottom, #ffffff42, #ffffffa8);

    padding: 15px 15px;

    border-radius: 20px;

    min-height: 230px;

    transition: .3s;

    border: 1px solid #fff;

}

.card-custome:hover{

    text-align: center;

    margin: auto;

    background-image: linear-gradient(to bottom, #ffffff62, #ffffffa8);

    padding: 15px 15px;

    border-radius: 20px;

    min-height: 230px;

    transition: .3s;

    border: 1px solid #fff;

}



.card-custome span.appointment-btn{

border-radius: 0px;



}



.card-custome span.appointment-btn i{

border-radius: 0px;



}



.card-custome:hover span.appointment-btn{

background: linear-gradient(90deg, #ffffff, #ffffff);

transform:translateY(-2px);

color: #095f56;

box-shadow:0px 0px 0px 2px #095f56;

transition: .3s;



}



.card-custome:hover span.appointment-btn i{

    transform: scale(1.5);

transition:.4s;



}





.card-custome img.img-service {   width: 100px;

    height: 100px;transition: .3s;transform: scale(1.0);}



.card-custome:hover img.img-service {   width: 100px;

    height: 100px;transition: .3s;transform: scale(1.1)rotate(1deg);}





.custome-card-servicen {

    border: 2px solid #fff;

    border-radius: 175px 20px 20px 150px;

}

img.img-ser-card {

    position: relative;

    right: 6px;

    top: 2px;

    background: #fff;

    border: 0px solid #ffffff;

    border-radius: 190px;

}

.box-main-service {

    background: #0651491f;

    padding: 10px 15px;

    border-radius: 25px;

    font-weight: 700;

    text-align: center;

    color: #000;

    margin-bottom: 10px;

    font-size: 18px;

}

.text-green-color{color: #065149;}

.border-service-25{border: 2px solid #065149 !important; border-radius: 25px;}

.border-bottom{border-bottom: 2px solid #065149 !important;}

.servcie-content-sec-box{color: #065149;}

.accordion-button:focus {box-shadow: none !important;}

.accordion.new .accordion-item .accordion-header button {

    background: #fff;

    border: none !important;

    box-shadow: none !important;

}

.accordion.new .accordion-item .accordion-body {

    background: #fff;

}

.main-card-box1 {

    background-image: linear-gradient(180deg, #065149 0%, rgba(6, 81, 73, 0.2) 100%);

    color: #fff;

    text-align: center;

    padding: 20px;

    border-radius:0px 30px 0px 30px;

}

.main-card-box2 {

    background-image: linear-gradient(180deg, #065149 0%, rgba(6, 81, 73, 0.2) 100%);

    color: #fff;

    text-align: center;

    border-radius: 20px 20px 0px 0px;

    padding: 20px;

}

.main-card-box3 {

    background-image: linear-gradient(180deg, #065149 0%, rgba(6, 81, 73, 0.2) 100%);

    color: #fff;

    text-align: center;

    padding: 20px;

    border-radius:30px 30px 30px 0px;

}

.main-card-box1 h3 {

    font-size: 37px !important;

    font-weight: 700;

}

.main-card-box2 h3 {

    font-size: 37px !important;

    font-weight: 700;

}

.main-card-box3 h3 {

    font-size: 37px !important;

    font-weight: 700;

}

.custome-icon-tour {

    width: 90px;

    height: 90px;

}

.title-abcd {

    color: #065149;

}

ul.dropdown-menu p {

    font-size: 14px;

    font-weight: 500;

    color: #065149;

}

.title-con {

    color: #065149;

}

img.custome-img-about-tour {

    height: 450px;

    object-fit: cover;

    width: auto;

}

section.card-tour-box {

    background: #ffffff;

    padding: 30px;

    box-shadow: 0px 0px 9px #00000069;

    border-radius: 25px;

}

section.card-tour-box p.con {

    color: #065149;

}

section.card-tour-box h2.tour-title-en {

    color: #065149;

    font-weight: 700;

    font-size: 26px;

}

.form-inner {

    border: 1px solid #065149;

    padding: 25px;

    border-radius: 25px;

}

.label-con{color: #065047;margin-bottom: 5px;}

span.second-btn-new-about {

    background: #fdfdfd7d;

    width: 100%;

    display: flex;

    text-align: center;

    font-size: 14px;

    border-radius: 15px;

    justify-content: center;

    padding: 10px 10px;

    color: #fff;

}

span.second-btn-new-con{font-size: 14px;}

span.second-btn-new-con {

    background-color: #7ba39f;

    padding: 10px 20px;

    color: #fff;

    width: 100%;

    border-radius: 10px;

    display: block;

}

.incard-blog-card {

    border: 1px solid #065149;

    border-top: none;

    margin-bottom: 20px;

}

img.bg-blog-img {

    border: 1px solid #065149;

    border-bottom: navajowhite;

    width: 100%;

    object-fit: cover;

    min-height: 150px;

}

h4.contact-box

 {

    text-align: center;

    color: #065149;

}

.contact-box{padding: 30px 0px;}

.basic-con-box-con p

 {

    color: #065149;

}

.blog-card {

    border: 1px solid #065149;

    padding: 15px;

    border-radius: 15px;

}

h5.title-blog

 {

    color: #065149;

    padding: 14px 0px;

}

.click-blgo

 {

    background: #065149;

    padding: 0;

    min-height: 38px;

    border-radius: 25px;

    box-shadow: 0px 0px 0px 0px #065149;

    color: #fff;

    transition: .3s;

    padding: 0px 0px;

}



.click-blgo:hover

 {

    background: #065149;

    padding: 0;

    border-radius: 25px;

    box-shadow: 0px 0px 0px 4px #065149;

    color: #fff;

    transition: .3s;

    padding: 2px 10px;

}

img.profile-img {

    border-radius: 25px 25px 0px 0px; height: 340px; width: auto;

}

img.profile-img-con {

    border-radius: 25px 25px 0px 0px; height: 270px; width: auto;

}

.box-con-basic {

    text-align: center;

    display: flex;

    bottom: 10px;

    position: relative;

    justify-content: center;

    transition: .3s;

    min-height: 200px;

}

.box-con-basic:hover {

    text-align: center;

    display: flex;

    bottom: 5px;

    position: relative;

    justify-content: center;

    transition: .3s;

    min-height: 200px;

}

.forth_se_sp-all-section {

    padding: 80px 0px;

}

.forth_se_sp-all-section h3{font-size: 3em;font-weight: 700;margin-top: 15px;margin-bottom: 20px;}



.forth_se_sp-all-section .second-btn-new

 {

    background: #ffffff5c;

    text-align: center;

    justify-content: center;

    display: flex;

    min-width: 309px;

    margin-top: .5em;

    font-size: 1.5em;

}



img.basic-con-img {

    height: 290px;

    margin: auto;

    transform: scale(1.2);

    object-fit: cover;

}

.footer{

        background: #fff;

    padding: 60px 0px;

    margin-top: 25px !important;

}

.footer-address {

    display: flex;

}

.footer-address a i {

    min-width: 45px;

    height: 45px;

    text-align: center;

    padding: 8px;

}

.footer-address p {padding: 10px;}

.heading-carding{color: #065149;}

.review-marquee{

    overflow: hidden;

    width: 100%;

    padding: 0px 0px 50px 0px ;



}

section.second-section-part {

    background: #ffffff;

    padding: 60px 0px;

    margin-top: 0px;

}

/* Left Blur */

.review-marquee::before{

    content: "";

    position: absolute;

    left: 0;

    top: 0;

    width: 120px;

    height: 100%;

    z-index: 5;

    pointer-events: none;

    background: linear-gradient(to right, #065149 0%, rgb(6 81 73 / 78%) 30%, rgba(15, 107, 97, 0) 100%);

}



/* Right Blur */

.review-marquee::after{

    content: "";

    position: absolute;

    right: 0;

    top: 0;

    width: 120px;

    height: 100%;

    z-index: 5;

    pointer-events: none;

   background: linear-gradient(to left, #065149 0%, rgb(6 81 73 / 78%) 30%, rgba(15, 107, 97, 0) 100%);

}



.review-track{

    display:flex;

    gap:20px;

    width:max-content;

    animation:marquee-rev 30s linear infinite;

}



.review-marquee:hover .review-track{

    animation-play-state:paused;

}



.review-card{

    width:300px;

    min-width:300px;

    padding:25px;

    border-radius:20px;

    background:#fff;

    flex-shrink:0;

}



@keyframes marquee-rev{

    from{

        transform:translateX(0);

    }

    to{

        transform:translateX(-50%);

    }

}

















.hero-imgs {

    min-height: 88vh;

}

span.second-btn-new {

    background: #ffffff5c;

    width: 180px;

    text-align: center;

    font-size: 14px;

    color: #fff;

    padding: 6px 20px;

    margin: auto;

    border-radius: 10px !important;

}

span.second-btn-new-o {

    background: #ffffff5c;

    text-align: center;

    font-size: 24px;

    color: #fff;

    padding: 6px 20px;

    margin: auto;

    border-radius: 10px !important;

}



.second-box p {

    line-height: 28px;

    letter-spacing: 1px;

}

.video-card {

    position: relative;

    overflow: hidden;

}



.video-card .play-btn {

    position: absolute;

    top: 50%;

    left: 50%;

    transform: translate(-50%, -50%);

    width: 50px;

    height: 50px;

    background: #ffffff2b;

    border-radius: 50%;

    display: flex;

    align-items: center;

    justify-content: center;

    color: #000;

    font-size: 24px;

    transition: 0.3s ease;

    z-index: 2;

    box-shadow: 0 8px 20px rgba(0,0,0,0.25);

}



.video-card:hover .play-btn {

    transform: translate(-50%, -50%) scale(1.1);

    background: #000000b3;

    color: #fff;

}



.video-card img {

    width: 100%;

    min-height: 220px;

        object-fit: cover;

    display: block;

}







.forth_se_sp{padding: 40px 0px;}

img.custome-img-about {

    border-radius: 100% 100% 0% 0%;

    transition: .3s;

    transform: scale(1.0);

 

}

img.custome-img-about:hover {

    border-radius: 100% 100% 0% 0%;

    transition: .3s;

    transform: scale(1);



}

img.custome-img-new {

    border-radius: 100% 100% 0% 0%;

    transition: .3s;

    transform: scale(1.0);

 

}

img.custome-img-new:hover {

    border-radius: 100% 100% 0% 0%;

    transition: .3s;

    transform: scale(1);



}

img.custome-img-service {

    border-radius: 100% 100% 0% 0%;

    transition: .3s;

    transform: scale(1);

        width: 50%;

    padding: 20px;

}

img.custome-img-service:hover {

    border-radius: 100% 100% 0% 0%;

    transition: .3s;

    transform: scale(1.1);

    padding: 20px;

}

section.second-section {

    background: #e6f1f0;

    padding: 40px 0px;

    margin-top: 40px;

}

section.three-section {

    background: #e6f1f0;

    padding: 60px 0px;

    margin-top: 0px;

}

.second-btn {

    background: #0651491f;

    padding: 8px 20px;

    border: navajowhite;

    color: #065149;

    margin-bottom: 20px;

    border-radius: 10px;

    transition: .3s;

    font-size: 14px;

}

.second-btn:hover {

    background: #065149;

    padding: 8px 20px;

    border: navajowhite;

    color: #fff;

    margin-bottom: 20px;

    border-radius: 10px;

    transition: .3s;

    font-size: 14px;

}







h2.second-sec-heading {

    font-size: 2.4em;

    color: #065149;

    font-weight: 700;

}

.second-box { color: #065149;}

h2.sec-dr-name{color: #065149;font-size: 29px;margin-top: 10px;font-weight: 600;min-height:40px;align-items: center;}

h5.sec-dr-heading{color: #065149;font-size: 17px;margin-top: 10px;font-weight: 700;}

p.sec-p-name{ color: #065149;}



h4.listing{color: #065149;padding-bottom: 5px;}













:root{



--primary:#065149;

--secondary:#17a59c;

--orange:#ff9f1c;

--dark:#17364f;

--white:#ffffff;

--text:#6c757d;

--light:#f8fbff;

--shadow:0 15px 40px rgba(0,0,0,.08);



}



*{

margin:0;

padding:0;

box-sizing:border-box;

}



html{

scroll-behavior:smooth;

}



body{



font-family:'Poppins',sans-serif;

background:#f5fbfb;

color:#222;

overflow-x:hidden;



}



img{

max-width:100%;

display:block;

}



a{

text-decoration:none;

transition:.4s;

}



ul{

margin:0;

padding:0;

list-style:none;

}



/*==============================

TOPBAR

==============================*/



.topbar{



background:linear-gradient(90deg,#065149,#065149);

color:#fff;

padding:10px 0;

font-size:14px;



}



.marquee{

    width:100%;

    overflow:hidden;

    white-space:nowrap;

    position:relative;

}



.marquee-track{

    display:flex;

    width:max-content;

    animation:marquee 25s linear infinite;

}



.marquee:hover .marquee-track{

    animation-play-state:paused;

}



.marquee-item{

    flex-shrink:0;

    padding-right:80px;

    font-weight:500;

}



@keyframes marquee{



    from{

        transform:translateX(0);

    }



    to{

        transform:translateX(-50%);

    }



}



.social-icons{



display:flex;

justify-content: flex-end;

gap:15px;



}



.social-icons a{



width:32px;

height:32px;

border-radius:50%;

background:#fff;

display:flex;

align-items:center;

justify-content:center;

color:var(--primary);

font-size:16px;



}



.social-icons a:hover{

background:rgba(255,255,255,.15);

color:#fff;

transform:translateY(-1px);



}



/*==============================

NAVBAR

==============================*/



.navbar{



padding:18px 0;

transition:.4s;

z-index:999;



}



.navbar.shadow{



box-shadow:0 8px 30px rgba(0,0,0,.08);



}



.navbar-brand img{



width:210px;



}



/*.navbar-nav{



gap:18px;



}*/



.nav-link{



font-weight:500;

font-size:14px;

color:#17364f !important;

position:relative;



}



.nav-link:hover,

.nav-link.active{



color:var(--primary)!important;



}



/*.nav-link::after{



    content: "";

    position: absolute;

    left: 0;

    bottom: 0px;

    height: 4px !important;

    width: 0;



    background: var(--primary);

    transition: .4s;



}



.nav-link:hover::after,

.nav-link.active::after{



width:100%;



}*/



/*==============================

DROPDOWN

==============================*/



.dropdown-menu{



border-radius:18px;



border:none;



box-shadow:0 20px 45px rgba(0,0,0,.12);



}



.dropdown-item{

color: #000;

padding:10px 22px;

font-size: 14px;

transition:.3s;



}



.dropdown-item:hover{

padding-left:28px;

font-size: 14px;

background:#edfdfb;

color:#0d7f7a;

transition:.3s;

}



@keyframes dropdown{



from{



opacity:0;

transform:translateY(20px);



}



to{



opacity:1;

transform:translateY(0);



}



}



/*==============================

BUTTONS

==============================*/



.btn-success{



background:linear-gradient(90deg,#e7e7e7,#e7e7e7);

border:none;

font-size: 14px;

color: #065149;

border: 2px solid #065149;

font-weight:600;



}



.btn-success:hover{



background:linear-gradient(90deg,#065149,#065149);

box-shadow: 0px 0px 1px 2px #065149;

border: 2px solid #065149;

color: #fff;



}



.circle-btn{



width:45px;

height:45px;

border-radius:50%;

  background-image: linear-gradient(180deg, #065149, #065149, #fff);

display:flex;

align-items:center;

justify-content:center;

color:#fff;

font-size:18px;

transition: .9s;



}



.circle-btn:hover{

background-image: linear-gradient(180deg, #065149, #065149,#065149, #065149);

color:#fff;

transition: .9s;



}



/*==============================

HERO

==============================*/



.hero{



padding:1px 0;

background:linear-gradient(180deg,#edfdfb,#ffffff);



}



.hero-box-main{

border-radius:35px;

position:relative;

overflow:hidden;



}



.hero-box{

position:relative;

overflow:hidden;

width: 100%;

margin: auto;

}



.hero-box::before{

content:"";

position:absolute;

top:0px;

right:3.5%;

width:93%;

height:100%;

background-image: linear-gradient(180deg, #3a81ad, #234288);

border-radius: 35px;



}

.hero-box.green-bg::before{background-image: linear-gradient(180deg, #065149, #065149);}



.hero-second{



padding:40px 0;

background:linear-gradient(180deg,#edfdfb,#ffffff);



}



.hero-second-box-main{

border-radius:35px;

position:relative;

overflow:hidden;



}



.hero-second-box{

position:relative;

overflow:hidden;

width: 100%;

margin: auto;

}



.hero-second-box::before{

content:"";

position:absolute;

top:0px;

right:3.50%;

width:93%;

height:100%;

background-image: linear-gradient(180deg, #065149, #065149);

border-radius: 35px;



}



.custome-color{background-image: linear-gradient(180deg, #065149, #065149);}

.badge-title{



display:inline-block;

background:#5d98bc;

color:#fff;

padding:8px 24px;

border-radius:10px;

font-weight:600;

margin-bottom:20px;



}

.badge-title.tour{background: #f9fdff30;}

.hero h1{



font-size:48px;

font-weight:600;

line-height:1.15;

color:#fff;

margin-bottom:20px;



}



.hero p{



font-size:14px;

line-height:1.9;

color:#fff;

max-width:520px;

margin-bottom:35px;



}



/*==============================

APPOINTMENT BUTTON

==============================*/



.appointment-btn{

display:inline-flex;

align-items:center;

gap:12px;

padding:10px 28px;

border-radius:60px;

background:linear-gradient(90deg,#eea676,#eea676);

color:#fff;

font-weight:700;

box-shadow:0 1px 3px rgba(255,162,0,.35);

transition: .3s;

}



.appointment-btn:hover{

background: linear-gradient(90deg, #ffffff, #ffffff);

transform:translateY(-2px);

color: #095f56;

box-shadow:0px 0px 0px 2px #095f56;

transition: .3s;



}



.appointment-btn i{

    transform: scale(1.5);

transition:.4s;



}



/*==============================

REVIEW BOX

==============================*/









.new-appointment-btn{

display:inline-flex;

align-items:center;

gap:12px;

padding:10px 28px;

border-radius:60px;

background:linear-gradient(90deg,#fff,#fff);

color:#065149;

font-weight:700;

box-shadow:0 1px 3px rgba(255,162,0,.35);

transition: .3s;

}



.new-appointment-btn:hover{

background: linear-gradient(90deg, #000, #000);

transform:translateY(-2px)translateX(0px);

color: #fff;

box-shadow:0px 0px 0px 2px #000 inset;

transition: .3s;



}



.new-appointment-btn i{

    transform: scale(1.5);

transition:.4s;



}











.review-box{



display:flex;

align-items:center;

gap:20px;

margin-top:30px;



}



.review-images{



display:flex;



}



.review-images img{



width:55px;

height:55px;

border-radius:50%;

border:4px solid #fff;

margin-left:-15px;

transition:.4s;

object-fit:cover;



}



.review-images img:first-child{



margin-left:0;



}



.review-box h4{



font-size:18px;

color: #fff;

font-weight:700;

margin-bottom:5px;



}



.review-box p{



color:#fff;

margin:0;



}



/*==============================

DOCTOR IMAGE

==============================*/



.doctor{



position:relative;

z-index:2;

transition:.4s;

top: 0px;





}



















.circle-glow{

    position:absolute;

    left:50%;

    top:65%;

    transform:translate(-50%,-50%);

    width:520px;

    height:520px;

    border-radius:50%;

    pointer-events:none;

    z-index:0;



    background:

    radial-gradient(circle,

    rgba(0,255,255,.30) 0%,

    rgba(0,255,255,.12) 5%,

    transparent 70%);

}



/* OUTER ROTATING RING */

.circle-glow::before{

    content:"";

    position:absolute;

    inset:-12px;

    border-radius:50%;

    border:3px solid transparent;

    border-top:3px solid #fff;

    border-right:3px solid #fff;

    border-bottom:3px solid rgba(95,252,255,.2);

    border-left:3px solid rgba(95,252,255,.2);



    box-shadow:

        0 0 20px #5ffcff,

        inset 0 0 20px rgba(95,252,255,.4);



    animation:ringRotate 8s linear infinite;

}



/* INNER HUD RING */

.circle-glow::after{

    content:"";

    position:absolute;

    inset:35px;

    border-radius:50%;

    border:2px dashed rgba(255,255,255,.35);



    box-shadow:

        inset 0 0 20px rgba(0,255,255,.3),

        0 0 15px rgba(0,255,255,.3);



    animation:ringRotateReverse 5s linear infinite;

}



@keyframes ringRotate{

    from{

        transform:rotate(0deg);

    }

    to{

        transform:rotate(360deg);

    }

}



@keyframes ringRotateReverse{

    from{

        transform:rotate(360deg);

    }

    to{

        transform:rotate(0deg);

    }

}



















/*=========================================

STYLE.CSS - PART 2

Animations • Floating Cards • WhatsApp

==========================================*/



/*==============================

FLOATING CARDS

==============================*/



.floating-card{

    position:absolute;

    background:rgba(255,255,255,.96);

    backdrop-filter:blur(10px);

    -webkit-backdrop-filter:blur(10px);

    border-radius:60px;

    padding:16px 28px;

    font-size:24px;

    font-weight:700;

    color:#17364f;

    box-shadow:0 18px 40px rgba(0,0,0,.12);

    z-index:10;

    animation:floating 4s ease-in-out infinite;

    transition:.35s;

    cursor:pointer;

}



.floating-card:hover{

    transform:translateY(-4px) scale(1.05);

    box-shadow:0 25px 55px rgba(0,0,0,.18);

    background:#f5f5f58a;

}



.card1{

    top:250px;

    right:15px;

    animation-delay:.2s;

}



.card2{

    left:0px;

    bottom:100px;

    animation-delay:1.2s;

}



/*==============================

LEFT & RIGHT FLOAT BUTTONS

==============================*/



.left-float,

.right-float{

    position:fixed;

    top:40%;

    transform:translateY(-40%);

    writing-mode:vertical-rl;

    text-orientation:mixed;

    color:#fff;

    padding:15px 7px;

    font-size:14px;

    font-weight:600;

    z-index:999;

    letter-spacing:.5px;

    transition:.35s;

    cursor:pointer;

}





.left-float{

    left:0;

        background: linear-gradient(90deg, #eea676, #eea676);

        border-radius:15px 0px 0px 15px;

        transform: rotate(180deg);

}



.right-float{

    right:0;



        background-image: linear-gradient(to top, #3a81ad, #234288);

        border-radius:0px 15px 15px 0px;

        transform: rotate(180deg);

}



.left-float:hover,

.right-float:hover{

    padding:24px 12px;

}



/*==============================

WHATSAPP

==============================*/



.whatsapp{

    position:fixed;

    right:30px;

    bottom:90px;

    width:55px;

    height:55px;

    border-radius:50%;

    background:#25D366;

    display:flex;

    justify-content:center;

    align-items:center;

    color:#fff;

    font-size:35px;

    text-decoration:none;

    z-index:999;

    box-shadow:0 15px 35px rgba(37,211,102,.45);

    animation:pulse 2s infinite;

}



.whatsapp:hover{

    color:#fff;

    transform:scale(1.08);

}

.calls{

    position:fixed;

    right:30px;

    bottom:20px;

    width:55px;

    height:55px;

    border-radius:50%;

    background-image: linear-gradient(to top, #3a81ad, #234288);

    display:flex;

    justify-content:center;

    align-items:center;

    color:#fff;

    font-size:30px;

    text-decoration:none;

    z-index:999;

    box-shadow:0 15px 35px #3a81ad;

    animation: vibrates 1.5s infinite;

}



.calls:hover{

    color:#fff;

    transform:scale(1.08);

}

/*==============================

SHOW ANIMATION

==============================*/



.hero h1,

.hero p,

.doctor,

.appointment-btn,

.review-box{

    opacity:0;

    transform:translateY(40px);

    animation:fadeUp .8s ease forwards;

}



.hero p{animation-delay:.2s;}

.doctor{animation-delay:.4s;}

.appointment-btn{animation-delay:.6s;}

.review-box{animation-delay:.8s;}



@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(40px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}



/*==============================

GLASS EFFECT

==============================*/



.glass{

    background:rgba(255,255,255,.18);

    backdrop-filter:blur(20px);

    -webkit-backdrop-filter:blur(20px);

    border:1px solid rgba(255,255,255,.35);

}



/*==============================

HOVER EFFECTS

==============================*/



.doctor:hover{

    transform:scale(1.03);

}



.review-images img:hover{

    transform:translateY(-8px) scale(1.08);

}



.circle-btn:hover i{

    transform:rotate(360deg);

    transition:.5s;

}



.social-icons i{

    transition:.35s;

}



.social-icons a:hover i{

    transform:rotate(360deg);

}



/*==============================

CUSTOM SCROLLBAR

==============================*/



::-webkit-scrollbar{

    width:8px;

}



::-webkit-scrollbar-thumb{

    background:#0d7f7a;

    border-radius:20px;

}



::-webkit-scrollbar-track{

    background:#edf8f8;

}



/*==============================

TEXT SELECTION

==============================*/



::selection{

    background:#0d7f7a;

    color:#fff;

}



/*==============================

ANIMATIONS

==============================*/



@keyframes floating{



0%{

    transform:translateY(0px);

}



25%{

    transform:translateY(-6px);

}



50%{

    transform:translateY(0px);

}



75%{

    transform:translateY(6px);

}



100%{

    transform:translateY(0px);

}



}



@keyframes vibrate{



0%{

    transform:translate(0);

}



20%{

    transform:translate(-2px,2px);

}



40%{

    transform:translate(-2px,-2px);

}



60%{

    transform:translate(2px,2px);

}



80%{

    transform:translate(2px,-2px);

}



100%{

    transform:translate(0);

}



}



.vibrate{

    animation:vibrate .18s linear 3;

}



@keyframes pulse{



0%{

    box-shadow:0 0 0 0 rgba(37,211,102,.55);

}



70%{

    box-shadow:0 0 0 20px rgba(37,211,102,0);

}



100%{

    box-shadow:0 0 0 0 rgba(37,211,102,0);

}



}



@keyframes vibrates {

    0%   { transform: rotate(0deg) translateX(0); }

    10%  { transform: rotate(1deg) translateX(0px); }

    20%  { transform: rotate(2deg) translateX(0px); }

    30%   { transform: rotate(1deg) translateX(0); }

    40%   { transform: rotate(0deg) translateX(0); }

    50%   { transform: rotate(0deg) translateX(0); }

    60%   { transform: rotate(0deg) translateX(0)scale(1.1); }

    70%  { transform: rotate(-5deg) translateX(-1px); }

    80%  { transform: rotate(5deg) translateX(1px); }

    90%  { transform: rotate(-2deg); }

    100% { transform: rotate(0deg); }

}



@keyframes rotateGlow{



0%{

    transform:translate(-50%,-50%) rotate(0deg);

}



100%{

    transform:translate(-50%,-50%) rotate(360deg);

}



}



@keyframes fadeIn{



0%{

    opacity:0;

}



100%{

    opacity:1;

}



}



@keyframes slideUp{



0%{

    transform:translateY(40px);

    opacity:0;

}



100%{

    transform:translateY(0);

    opacity:1;

}



}



/*==============================

UTILITY CLASSES

==============================*/



.shadow-lg-custom{

    box-shadow:0 25px 60px rgba(0,0,0,.12);

}



.rounded-30{

    border-radius:30px;

}



.rounded-50{

    border-radius:50px;

}



.text-primary-custom{

    color:#0d7f7a;

}



.bg-primary-custom{

    background:#0d7f7a;

}



.bg-gradient-primary{

    background:linear-gradient(135deg,#0d7f7a,#16b5a6);

}



.transition{

    transition:.35s ease;

}



.z-1{z-index:1;}

.z-2{z-index:2;}

.z-3{z-index:3;}

.z-10{z-index:10;}



.position-relative{

    position:relative;

}



.overflow-hidden{

    overflow:hidden;

}



    /* Desktop Hover Dropdown */

@media(min-width:992px){



.navbar .dropdown-menu{

    display:block;

    opacity:0;

    visibility:hidden;

    transition:.3s;



}



.navbar .dropdown:hover>.dropdown-menu{

    display:block;

    opacity:1;

    visibility:visible;

    margin-top:0;

}



}



@media(max-width:991.98px){



.navbar .dropdown-menu{



display:none;



position:static;



float:none;



width:100%;



border:none;



box-shadow:none;



padding-left:15px;



margin-top:10px;



}



.navbar .dropdown-menu.show{



display:block;



}



}

/* Mobile & Tablet */

@media (max-width:991.98px){



    .navbar .dropdown-menu{

        display:none;

        position:static;

        border:none;

        box-shadow:none;

        padding-left:15px;

        margin-top:8px;

    }



    .navbar .dropdown-menu.show{

        display:block;

    }



}