@media (max-width:620px){
    .hero { 
        height: calc(44vh - 86px);
    }
    .welcome-intro h1 {
        font-size: 24px !important;
    }
    .welcome-intro h5 {
        font-size: 16px !important; 
    }
    .welcome-intro p {
        font-size: 14px !important; 
    }
    
    .details-carousel{
        height: 182px;
    }
    .scroll{ 
        overflow-x: scroll;
    }
    .scroll::-webkit-scrollbar{ 
      width: 0px;
    }
    .scroll::-webkit-scrollbar{
        width: 0px;
        height: 0px;
    }
    .services-details {  
        width: 78%;
        margin: 0 auto; 
    }
    .apointment-headding{
        font-size: 16px;
    }
    .emp-list h6{
        font-size: 12px;
    }
   .nav.kk.nav-item.nav-link {
  font-size: 12px;
   }
}
@media (max-width:820px){
    .salon-scroll{
        height: auto;
        overflow-y: auto;
     }
     .number-of-people{
        width: 60px;
    }
    .carousel-caption {
        bottom: 2rem!important;
    }
    .carousel-caption h1{
        font-size: 20px!important;
    }
}