.logo-header{
    width: 40px;
    height: 40px;
    object-fit: cover;
}
body{
    background: #e9ecef;
}
header{
    display: grid;
    grid-template-columns: 50% 50%;
       z-index: 10;
    padding: 5px;
    align-items: center;
    position: sticky;
    top: 0;
    background-color: #e9ecef;
    box-shadow:0px 2px 2px 2px rgba(0,0,0,0.1)
}
header .logo{
    display: flex;
    padding:0px 20px;
}
.flex{display: flex;} 
.grid{display: grid;} 
.item-center{align-items: center;}
.text-center{text-align: center;}
.justify-center{justify-content: center;}
.flex-col{flex-direction: column;}
.gap-10{gap: 10px;}
.gap-40{gap:40px} 
.px-10{padding-right: 10px;padding-left: 10px;}
.font-14{font-size: 14px;}
.mb-15{margin-bottom: 15px;}
.font-bold{font-weight: bold;}
.home-banner{
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-align-items: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    background: linear-gradient(180deg, #f4faff 0%, #fff 100%);
    padding: 48px 24px;
    gap: 24px;
}
h2{font-weight: bold;}
.category-item{
    grid-template-columns: 150px 150px 150px 150px 150px 150px;
    gap: 25px;
    margin: 20px;
    justify-content: center;
}
.category-item h5{font-size: 14px;}
.cat-item-image{
    border-radius: 12px;
    padding: 12px;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    position: relative;
    justify-content: center;
    align-items: center;
}
.cat-item-image1{background-color: #E6F3FF;}
.cat-item-image2{background-color: #E8FBEE;}
.cat-item-image3{background-color: #FFE5EE;}
.cat-item-image4{background-color: #DFFFF4;}
.cat-item-image5{background-color: #E6F3FF;}
.cat-item-image6{background-color: #F0F2F4;}
.special-list{
  
    background-color: #E6F3FF;
    padding: 20px 50px;
}


.special-list-section{
    grid-template-columns: 200px 200px 200px 200px 200px;
    gap:20px;
    justify-content: center;
}
.special-list-item{
    border: 1px solid #FFFFFF;
    background-color: white;
    border-radius: 12px;
    cursor: pointer;
    -webkit-text-decoration: none;
    text-decoration: none;
    color: unset;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 10px;
}

.service-disease{
  
  
    padding: 20px 50px;
}
.service-disease-section{
    grid-template-columns: 200px 200px 200px 200px 200px;
    gap:20px;
    justify-content: center;
}
.service-disease-section a{
    border-radius: 10px;
    padding:10px 20px ;

    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    border:1px solid #999;
}
.download-app{
    background-color: #E6F3FF;
    padding: 20px 50px;
    grid-template-columns: 50% 50%;
}
.download-app .download{
    margin: 10px;
    align-items: center;

}
.download-app .download .google{
  
    height: 50px;
}
.download-app .download .apple{
  
    height: 35px;
}
.phone-preview{
 
    display: flex;
    justify-content: center;
 
    width: 270px;
    height: 400px;
}

.footer{
background-color: #003365;
    padding: 20px 50px;
    grid-template-columns: 40% 30% 30%;
    color:#fff;
}
.footer svg{
    fill: #fff;
}
.right-reserved{
    background: #e9ecef;
  height: 45px;
  margin: 0px;
  align-items: center;
}
.mt-10{margin-top: 10px;}
.mt-20{margin-top: 20px;}
.footer a{color: #fff;}
.certificate{
    height: 60px;
    width: 60px;
}
@media only screen and (max-width: 1000px) {
    .special-list-section{
        grid-template-columns: 200px 200px 200px ;
      
    }
    .service-disease-section{
        grid-template-columns: 150px 150px 150px 150px;
      
    }
    .category-item{
        grid-template-columns: 150px 150px 150px 150px;
    }
}

@media only screen and (max-width: 750px) {
    .special-list-section{
        grid-template-columns: 200px 200px ;
      
    }
    .service-disease-section{
        grid-template-columns: 150px 150px 150px;
      
    }
    .category-item{
        grid-template-columns: 150px 150px 150px;
    }
    .header-menu .menu{display: none;}
    .footer{  grid-template-columns:  100%}
}
@media only screen and (max-width: 600px) {
    .special-list-section{
        grid-template-columns: 300px;
      
    }
    .service-disease-section{
        grid-template-columns:  150px 150px;
    }
    .category-item{
        grid-template-columns: 150px 150px ;
    }
    .header-menu{flex-direction: row-reverse;}
    .header-menu .menu{display: none;}
    .download-app{
        grid-template-columns: 100%;
    }
    .footer{  grid-template-columns:  100%}
}