@media (max-width:1015px){
  .otherServices{
    font-size: 57px;
  }
}

@media (max-width:1020px){
  .item-service{
    margin: 0 10px 0; 
  }
}

@media (max-width:960px){
  .item-service{
    margin: 0 5px 0px; 
  }
}

@media (max-width:930px){
  .item-service{
    margin: 0 10px 20px; 
  }
}

@media (max-width:900px) {
  .subTitle{
    font-size: 90px;
  }
  .barberShopTitle{
    font-size: 140px;
  }
  #footer .barberShopTitle{ 
    font-size: 95px;
  }
  .BtnContacUs{
    font-size: 20px;
    width: 200px;
    height: 60px;
  }
  #footer #contact,
  .item-schedule,
  .item-service li,
  #welcome main p{
    font-size: 18px;
  }
  #footer #contact label i{
    font-size: 30px;
  }
  
  .subTitle2{
    font-size: 52px;
  }
  #welcome, #services, #feedback{
    padding-top: 20px;
  }
}
@media (max-width:800px) {

  /* Section - Header  */
  #closeMenu,
  #openMenu{
    display: block;
  }
  #menu.show{
    display: flex;
  }
  #menu {
    display: none;
    position: absolute;
    width: 100%;
    background-color: #FFF;
    left: 0;
    top: 0;
    flex-direction: column;
    align-items: center;
  }
  #menu li{
    width: 200px;
  }
  .item-menu {
    text-align: center;
  }
  .item-menu,
  .item-menu.active{
    color: #000;
  }
  /* Section - Welcome  */
  #welcome main > div{
    width: 85% !important;
  }
}

@media (max-width:700px) {
  #welcome > section{
    align-items:center;
    flex-direction: column-reverse;
  }
  #welcome main{
    width: 70% !important;
  }
  #welcome main > div{
    width: 100% !important;
  }
  #welcome-image{
    top: 0;
  }
  #findUs{
    flex-wrap: wrap-reverse;
    justify-content: center;
  }
  #findUs #openingHours{
    width: 60% !important;
  }
  #findUs #map{
    height: 600px;
    width: 80% !important;
    margin-top: 35px;
    padding: 0;
  }
  #findUs #map .subTitle{
    position: relative;
    top: 20px;
  }
  #footer #contact{
    margin-top: 30px;
  }

  #footer > main{
    flex-direction: column;
    align-items: center;
  }
}

@media (max-width:600px) {
  .subTitle{
    font-size: 65px;
  }
  #footer #contact, .item-schedule, .item-service li, #welcome main p{
    font-size: 16px;
  }
  .item-service{
  margin: 0 10px 40px;
  }
}

@media (max-width:535px){
  .BtnContacUs{
    
  font-size: 18px;
  width: 150px;
  height: 50px;
  }
  #findUs #openingHours{
   
    width: 80% !important;
    margin: 0;
  }
  #findUs{
    padding-top: 120px;
  }
  #footer > main > aside{width: 100% !important;}
  #footer > footer label{
    font-size: 15px;
  }
}
@media (max-width:500px){
    #footer #contact{
    width: 100% !important;
    text-align: center;
  }
  #footer #contact label.d-flex{
    width: 60%;
    margin: 0 auto;
  }
}
@media(max-width:400px){
  #title{max-width: 200px;}
  .barberShopTitle{
    
  font-size: 100px;
  line-height: initial;
  }
  #welcome,#services,#feedback{
    padding-top: 90px;
  }
  #welcome main{
  width: 80% !important;
  }
  .subTitle{
  font-size: 45px;
  line-height: inherit;
    margin-bottom: 40px;
  }
  #findUs #openingHours{
    width: 95% !important;
  }
  #findUs #map{
    width: 90% !important;
  }
  #footer .barberShopTitle{
    
  font-size: 65px;
  }
  #footer #contact label.d-flex{
    width: 70%;
  }
  
}

@media(max-width:340px){
  .item-schedule{flex-direction: column;line-height: 35px;margin-bottom: 20px;}
}

@media (max-width:300px){
  #footer #contact label.d-flex{
    position: relative;
    left: 50%;
    transform: translateX(-50%);
    width: 91%;
  }
}
@media (max-width:278px){
  #footer #contact label.d-flex{
    justify-content: center;
    width: 100%;
    flex-wrap: wrap;
  }
}