:root{
    --font:"Poppins";
    --theme : #0096FF;
    --white:#fff;
    --black:#000;
    --secondary-theme:#CC0563;
    --dark-blue:#00487A;
    --bg-light-white:#f8f9fa;
    --light-white:#FEFEFE;
    --emergency-overlay:rgba(57, 174, 255, 0.7);
    --inpatient-overlay:rgba(255, 60, 152, 0.7);
    --outpatient-overlay:rgba(0, 212, 106, 0.7);
    --operation-theater-overlay:rgba(155, 78, 254, 0.7);
    --icu-overlay:rgba(255, 106, 109, 0.7);
    --xray-overlay:rgba(240, 81, 255, 0.7);
    --dialysis-overlay:rgba(251, 145, 40, 0.7);
    --pharmacy-overlay:rgba(0, 195, 202, 0.7);
    --laboursuite-overlay:rgba(108, 106, 106, 0.7);
    --lab-overlay:rgba(141, 222, 141, 0.7);
    --lite-blue-shadow: 0px 4px 8px 0px #7ab4dc;
    

}

body{
    margin: 0;
    padding: 0;
    font-family: var(--font);
}
a{
    text-decoration: none !important;
}
ul, ol {
    margin: 0;
    padding: 0;
    list-style-type: none;
}
.hero-sec h1{
    font-size: 48px;
    font-weight: 700;
    color: var(--white);
}

/*  modal  */
.modal  .btn-close{

    width: 1.4em;
    height: auto;
    color: #ffffff;
    font-weight: 700;
    position: absolute;
    right: -11px;
    top: -11px;
    z-index: 1;
    border-radius: 50%;
    padding: 5px;
    opacity: 1;
    background:var(--theme);
    /* background:var(--dark-blue); */
    transition: all 0.5s ease-in-out;
}
.modal .btn-close:hover{
    background:var(--dark-blue);
}
.modal .modal-body{
    padding: 0;
    border-radius: 10px;
    overflow: hidden;
}
.modal .modal-dialog{
    width: 400px;
    height: 100vh;
    margin: auto;
}
/*  sections part */
.section-head{
    color: var(--theme);
    font-weight: 700;
    font-size: 32px;
    line-height: 44px;

}
.section-head::before{
    content: " ";
    display: inline-block;
    width: 34px;
    height: 20px;
    background-image: url('../assets/icons/heading-style.svg');
    background-repeat: no-repeat;
    margin-right: 12px;
}
.section-sub-head{
    font-weight: 700;
    font-size: 36px;
    line-height: 52px;
    color: var(--black);

}
.hero-sec{
    padding: 120px 0px;
    background: url('../assets/images/about/hero-sec/background.png');
    background-repeat: no-repeat;
    background-size: cover;
}


 .accordion .accordion-item{
    margin-bottom: 20px;
    border-radius: 12px;
    border: none;
    padding: 0px;
   
     
}
.accordion-item:first-of-type .accordion-button{
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}
.accordion-item:last-of-type .accordion-button.collapsed{
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}
 .accordion .accordion-button{
    font-weight: 500;
    font-size: 18px;
    line-height: 26px;
    background: rgba(243, 244, 246, 1);
    border-radius: 12px;
    color: var(--black);
    transition: box-shadow 0.5ms ease-in-out 0.3s;
}
 .accordion .accordion-body{
    font-weight: 300;
    font-size: 16px;
    line-height: 22px;
}
 .accordion .accordion-item:has(.accordion-collapse.show) {
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2) !important;
    border-radius: 12px; 
}
 .accordion .accordion-button:not(.collapsed){
    background-color: var(--white);
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
    color: var(--black);
    box-shadow: none !important;
}
.accordion  button.accordion-button.collapsed{
    box-shadow: none !important;
}
 .accordion .accordion-button::after{
    content: "+";
    width: 24px;
    height: 24px;
    font-size: 24px;
    padding-left: 4px;
    border-radius: 3px;
    color: var(--black);
    background-color: var(--white);
    background-image: none !important;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
}

 .accordion .accordion-button:not(.collapsed)::after{
    content: "-";
    
    color: var(--white);
    background-color: var(--theme);
}

@media screen and (max-width:991px) {
    .section-sub-head {
        font-size: 32px;
        line-height: 46px;
    }
    
}
@media screen  and (max-width:575px){
    .hero-sec{
        background:var(--theme);
    }
    .modal .modal-dialog{
        width: 300px;
    }
    
}