/* ==========================================================================
   LAYA HOTELS - RESPONSIVE MOBILE STYLESHEET
   ========================================================================== */

@media (max-width: 991px) {
  .middle-wrp {
    padding: 0 16px;
  }
  
  .header-wrapper .middle-wrp {
    flex-direction: column;
    gap: 12px;
  }
  
  .menu-wrapper .middle-wrp {
    flex-direction: column;
    gap: 12px;
  }
  
  .menu-wrapper .middle-wrp ul.navigation {
    flex-direction: column;
    gap: 10px;
    align-items: center;
  }
  
  .menu-wrapper .middle-wrp .main-navig {
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
  }
  
  .below-content {
    grid-template-columns: 1fr;
    gap: 24px;
  }
  
  .submenu-wrapper .subnavi1 .middle-wrp {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  
  .footer-wrapper .topwrapper {
    flex-direction: column;
    text-align: center;
  }
  
  .footer-wrapper .topwrapper .right {
    justify-content: center;
  }
}

@media (max-width: 640px) {
  h1 {
    font-size: 2.2rem;
  }
  
  h4 {
    font-size: 2.2rem;
  }
  
  .content-wrapper {
    padding: 30px 0;
  }
  
  .menu-wrapper .middle-wrp .main-navig a {
    font-size: 0.8rem;
    padding: 6px 10px;
  }
  
  .make-a-reservation, .make-a-reservation-btn {
    width: 100% !important;
    justify-content: center;
  }
}