HotLunches/css/mobile.css

.menu-tougle {
  display: none;
}

@media only screen and (max-width: 600px) {
  .main-header__logo {
    width: 50%;
  }
  .main-header__logo a {
    overflow: hidden;
    display: inline-block;
  }
  .main-header__logo img {
    width: 100%;
    height: auto;
  }
  .main-header__content {
    font-size: 10px;
  }
  .menu-tougle {
    display: block;
    width: 25px;
    min-height: 20px;
    content: "";
    position: absolute;
    right: 5%;
    top: 0;
    z-index: 999;
    border-radius: 5px;
    border: solid 1px black;
    padding: 6px 10px;
    background: white;
  }
  span.menu-tougle__inner {
    display: block;
    background: black;
    height: 3px;
    top: initial;
    position: relative;
    width: 100%;
    right: initial;
    margin: 5px auto;
  }
  a.hideonmobile {
    display: none;
  }
  .cssplayMenu ul {
    position: relative;
    width: 100%;
    display: block;
    overflow: hidden;
    border-radius: 0;
  }
  .cssplayMenu ul li, .cssplayMenu ul li.hover {
    width: 100%;
    position: relative;
    left: auto;
    display: block;
    border-radius: 0;
    display: none;
  }
  .cssplayMenu ul li.up-level, .cssplayMenu ul li.hover.up-level {
    display: block;
  }
  .cssplayMenu ul li.up-level.hover li, .cssplayMenu ul li.hover.up-level.hover li {
    display: block;
  }
  .cssplayMenu ul li:hover a, .cssplayMenu ul li.hover:hover a {
    background: none !important;
    color: white !important;
    text-shadow: none;
  }
  .cssplayMenu ul li:hover ul, .cssplayMenu ul li.hover:hover ul {
    left: auto;
    top: auto;
  }
  .cssplayMenu ul li a, .cssplayMenu ul li.hover a {
    font: 15px arial,sans-serif;
    font-weight: 400;
    letter-spacing: 1px;
    padding: 13px 0;
    display: inline-block;
  }
  .cssplayMenu ul li a.hideonmobile, .cssplayMenu ul li.hover a.hideonmobile {
    display: none;
  }
  .cssplayMenu ul ul {
    position: relative;
    width: 100%;
    left: auto;
    border: none;
    border-bottom: solid 1px white;
    border-radius: 0;
  }
  .cssplayMenu ul ul li {
    width: 100%;
    position: relative;
    left: auto;
    display: block;
    display: none;
    padding-left: 10px;
  }
  .cssplayMenu > ul {
    display: none;
  }
  .cssplayMenu.active > ul {
    display: block;
    position: absolute;
    z-index: 100;
  }
  body {
    background: none;
    margin: 0;
  }
  body, #main, #footer-bg, .cssplayMenu, .cssplayMenu ul, table, .largeButton, a.largeButton, .container, #checkout-form, .warningframedspan {
    width: auto;
  }
  table, .select-width400 {
    width: 100%;
  }
  input[type="text"], input[type="password"] {
    padding: 5px;
    width: 93%;
  }
  table tr td {
    padding: 0;
    margin: 0;
  }
  .btns-home table tr td {
    width: 100%;
    width: auto;
    display: block;
  }
  .smallButton, a.smallButton, .largeButton, a.largeButton, input.submit, .formButton {
    width: auto;
    display: block;
    margin: 10% 0;
    width: 100%;
    width: -webkit-fill-available;
    width: -moz-available;
    width: stretch;
    display: block;
    margin: 10% 0;
    padding: 3%;
    font-size: 14px;
    margin: 6px 0;
  }
  #footer-bg {
    background-position: bottom center;
    height: inherit;
  }
  #footer-bg .smallButton, #footer-bg a.smallButton, #footer-bg .largeButton, #footer-bg a.largeButton, #footer-bg input.submit, #footer-bg .formButton {
    width: initial;
    display: inline-block;
  }
  #footer-bg table tr td {
    display: inline-block;
  }
  .content-table td {
    vertical-align: text-top;
  }
  .menu-item {
    border: none;
    padding: 34px 14px;
  }
}
/*# sourceMappingURL=mobile.css.map */