/* Mobile layout fixes for Milestone CMS pages */
@media only screen and (max-width: 1023px) {
  html,
  body {
    width: 100%;
    max-width: 100%;
    overflow-x: hidden;
  }

  #wrapper,
  #main,
  #middle,
  .contentinfo,
  header {
    min-width: 0 !important;
    max-width: 100% !important;
    width: 100% !important;
    overflow-x: hidden;
  }

  img,
  video,
  iframe {
    max-width: 100%;
    height: auto;
  }

  .container {
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
  }

  header .container {
    padding-right: 52px;
    min-height: 75px;
  }

  .mobile-nav-toggle {
    display: block;
    position: absolute;
    right: 10px;
    top: 18px;
    z-index: 12;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 0;
    background: transparent;
    cursor: pointer;
  }

  .mobile-nav-toggle__bar,
  .mobile-nav-toggle__bar::before,
  .mobile-nav-toggle__bar::after {
    display: block;
    position: absolute;
    left: 8px;
    right: 8px;
    height: 2px;
    background: #008849;
    transition: transform 0.2s ease, top 0.2s ease, opacity 0.2s ease;
  }

  .mobile-nav-toggle__bar {
    top: 19px;
  }

  .mobile-nav-toggle__bar::before,
  .mobile-nav-toggle__bar::after {
    content: "";
    left: 0;
    right: 0;
  }

  .mobile-nav-toggle__bar::before {
    top: -8px;
  }

  .mobile-nav-toggle__bar::after {
    top: 8px;
  }

  body.mobile-nav-open .mobile-nav-toggle__bar {
    background: transparent;
  }

  body.mobile-nav-open .mobile-nav-toggle__bar::before {
    top: 0;
    transform: rotate(45deg);
  }

  body.mobile-nav-open .mobile-nav-toggle__bar::after {
    top: 0;
    transform: rotate(-45deg);
  }

  .logo {
    position: absolute;
    left: 10px;
    top: 12px;
    right: auto;
    width: auto;
    max-width: calc(100% - 110px);
  }

  .logo img {
    max-height: 48px;
    width: auto;
    max-width: 100%;
  }

  .lang-switch {
    top: 22px;
    right: 56px;
  }

  .language-dropdown .lang-drop {
    width: 72px;
    font-size: 12px;
    height: 36px;
    padding: 4px 20px 4px 6px;
  }

  .ic-dd {
    right: 4px;
    top: 6px;
    font-size: 16px;
  }

  .menu-sec {
    display: none;
    position: fixed;
    top: 75px !important;
    left: 0 !important;
    right: 0 !important;
    width: 100% !important;
    z-index: 11;
    background: #fff;
    border-bottom: 1px solid #ccc;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.12);
    max-height: calc(100vh - 75px);
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  body.mobile-nav-open .menu-sec {
    display: block;
  }

  nav.top-navigation ul li {
    display: block;
    float: none;
    padding: 0;
    border-bottom: 1px solid #eee;
  }

  nav.top-navigation ul li a {
    display: block;
    padding: 14px 20px;
    font-size: 15px;
  }

  .submenulist > a::before {
    display: none;
  }

  .top-navigation ul li ul.dropnav {
    position: static;
    margin: 0;
    padding: 0;
    box-shadow: none;
  }

  #mainimage img {
    width: 100%;
    height: auto;
  }

  #mainimage .flex-control-nav::after {
    display: none;
  }

  .caption-data {
    font-size: 28px;
    line-height: 1.2;
    padding: 0 16px;
    box-sizing: border-box;
  }

  .home-content-section {
    margin-bottom: 40px;
  }

  .home-content-section::before {
    display: none;
  }

  .home-left-content,
  .home-right-content {
    float: none;
    width: auto;
    max-width: none;
    margin: 0;
    padding: 70px 15px 20px;
  }

  .welcome-text {
    font-size: 36px;
    line-height: 1.1;
  }

  .welcome-small-text {
    margin-left: 0;
    margin-top: 8px;
  }

  .content-area {
    padding-left: 0;
    padding-top: 20px;
  }

  .home-right-content {
    margin: 0 15px 30px;
    padding: 28px 22px;
  }

  .content-image {
    display: none;
  }

  .homesection1,
  .homesection2,
  .homesection3 {
    padding-top: 40px;
    padding-bottom: 40px;
  }

  .home-special-box,
  .home-special-box.home-blog-box {
    left: 0;
    right: 0;
    max-width: 100%;
    padding: 0 15px;
    box-sizing: border-box;
  }

  .home-special-box-left-section,
  .home-special-box-right-section,
  .home-special-box.home-blog-box .home-special-box-left-section,
  .home-special-box.home-blog-box .home-special-box-right-section {
    float: none;
    width: 100%;
    padding: 0;
    text-align: left;
  }

  .home-special-box-content1,
  .home-special-box-content2 {
    padding: 20px 0;
  }

  .home-special-box-desc1,
  .home-special-box.home-blog-box .home-special-box-desc2,
  .home-special-box.home-blog-box .home-special-box-header2 {
    padding-right: 0;
    text-align: left;
  }

  .home-special-box-cta2,
  .home-special-box.home-blog-box .home-special-box-cta2 {
    width: 100%;
    max-width: 100%;
    margin: 0;
    float: none;
  }

  .home-special-box-header2 {
    font-size: 32px;
    line-height: 1.2;
  }

  .home-menu-box {
    max-width: 100%;
    margin: 0;
    padding: 0 15px 30px;
    box-sizing: border-box;
  }

  .menu-left-box {
    position: relative;
    width: 100%;
    left: auto;
    bottom: auto;
    margin-bottom: 20px;
  }

  .menu-left-box-wrap {
    padding: 24px 20px;
  }

  .menu-right-box {
    float: none;
    width: 100%;
  }

  .menu-left-box-wrap .item-main-box .item-box,
  .ITEM {
    width: 100% !important;
    margin-left: 0;
    padding-left: 0;
    padding-right: 0;
  }

  .footer-left,
  .footer-right {
    display: block;
    float: none;
    width: 100%;
    max-width: none;
    min-width: 0;
    padding: 0 15px 25px;
    text-align: center;
    border: 0;
  }

  .hotel-adddress::before {
    display: none;
  }

  .reservation-section {
    text-align: center;
  }

  .reservation-text,
  .reservation-number,
  .reserve-btn {
    float: none;
    display: block;
    width: 100%;
    margin: 8px 0;
    text-align: center;
  }

  .reserve-btn {
    width: auto;
    max-width: 220px;
    margin-left: auto;
    margin-right: auto;
  }

  .second-footer-wrap {
    height: auto;
    padding: 20px 15px 90px;
  }

  .second-footer,
  .sub-navigation {
    display: block;
    width: 100%;
  }

  .sub-navigation ul li {
    display: block;
    border: 0;
    margin: 0;
    padding: 8px 0;
  }

  .home-menu-box.home-bar-box::before,
  .homesection2::before,
  .homesection4::before,
  .home-chef-left::before {
    display: none !important;
  }

  .home-menu-box.home-bar-box .menu-left-box {
    position: relative;
    left: auto;
    right: auto;
    top: auto;
    width: 100%;
  }

  .home-menu-box.home-bar-box .menu-right-box {
    float: none;
    width: 100%;
  }

  .home-bar-box .menu-left-box-wrap {
    padding: 24px 20px;
  }

  .home-bar-box .menu-left-box-wrap .menu-button {
    width: 100%;
    max-width: 280px;
    padding-top: 24px;
  }

  .social-gallery-section {
    margin: 40px 15px;
    max-width: 100%;
    padding: 0;
  }

  .social-gallery-section::before,
  .social-gallery-section::after,
  .social-gallery-holder::before,
  .social-gallery-holder::after,
  .social-gallery-inner::before,
  .social-gallery-inner::after {
    display: none;
  }

  .leftimage,
  .centerimage,
  .rightimage,
  .left-top-img,
  .left-bottom-img,
  .right-top-img,
  .right-bottom-img {
    float: none;
    width: 100%;
    margin-bottom: 12px;
  }

  .social-head {
    padding: 20px 0;
  }

  .homesection6 {
    padding-bottom: 30px;
  }

  #header {
    font-size: 34px;
    line-height: 1.15;
    padding: 0 15px;
    margin-bottom: 20px;
  }

  #breadcrumb {
    padding: 88px 15px 18px;
    font-size: 13px;
    line-height: 1.5;
    word-break: break-word;
  }

  .page-content-padding {
    padding-left: 15px;
    padding-right: 15px;
  }

  .inner-bg::before {
    display: none !important;
  }

  .con-info,
  .con-form,
  .column21,
  .column22,
  .column31,
  .column32,
  .column33,
  .column41,
  .column42,
  .column43,
  .column44,
  .column51,
  .column52,
  .column53,
  .column54,
  .column55,
  .frmfieldset {
    float: none;
    width: 100% !important;
    padding-right: 0;
    margin-right: 0;
  }

  .contactusfrm {
    padding: 40px 15px 70px;
  }

  .about-snippet-holder .about-snippet,
  .special-snippet-section .special-snippet,
  .pressroom-snippet-section .pressroom-snippet,
  .group-section .group-snippet-box {
    float: none;
    width: 100% !important;
    box-sizing: border-box;
  }

  .specialpkg-content-right,
  .special-snippet:nth-child(2n) .specialpkg-content-right {
    padding: 20px !important;
  }

  #photogallery-thumbs li {
    width: 50%;
    box-sizing: border-box;
  }

  .eventExpandInfo,
  .EcDetailContent,
  .event-calendar-sec {
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
  }

  table {
    display: block;
    max-width: 100%;
    overflow-x: auto;
  }
}

@media only screen and (min-width: 1024px) {
  .mobile-nav-toggle {
    display: none;
  }

  .contentbg-section {
    position: relative;
    z-index: 4;
  }

  .home-content-section,
  .home-left-content,
  .home-right-content {
    position: relative;
    z-index: 1;
  }

  .menu-option .MENU {
    display: none;
  }

  .menu-option .MENU:first-child {
    display: block;
  }

  .header-fixed .logo {
    left: 0;
    max-width: 185px;
  }

  .header-fixed .logo img {
    display: block;
    max-width: 100%;
    height: auto;
  }

  .header-fixed .menu-sec {
    left: 205px;
    right: 110px;
    text-align: right;
  }
}

@media only screen and (min-width: 1024px) and (max-width: 1170px) {
  .header-fixed .menu-sec {
    left: 175px;
    right: 95px;
  }

  .header-fixed nav.top-navigation ul li {
    padding-left: 4px;
    padding-right: 4px;
  }

  .header-fixed nav.top-navigation ul li.submenulist {
    padding-right: 12px;
  }

  .header-fixed nav.top-navigation ul li a {
    font-size: 13px;
  }
}
