/*  mobile phone css
        iphone 4 and below use 480px width
        iphone 5 uses 640 (which is like 605 visible) */
@media screen and (max-device-width: 605px) {
  html {
    width: 100vw;
  }

  body {
    font-family: Helvetica, Arial, Verdana, sans-serif;
    width: 100vw;
    min-width: 360px;
    height: 100vh;
    padding: 0;
    -webkit-text-size-adjust: none;
    overflow: scroll;
    margin: 0;
  }

  .punch-box-flex {
    display: block;
  }

  .customer {
    box-shadow: 2px 2px 5px rgba(85, 85, 85, 0.48);
    width: 98%;
    margin: 0 1% 10px !important;
  }

  #customer-list-content {
    position: relative;
    display: flex;
    overflow: hidden;
    align-content: center;
    align-items: stretch;
    flex-direction: column;
    justify-content: space-between;
    width: calc(100% - 50px);
    margin: 80px 10px;
  }

  .bookings {
    display: none;
  }

  .trashcan-link, #search-box, #customer-menu-box {
    display: none;
  }

  .nomobile {
    display: none;
  }

  .mobile {
    display: flex;
  }

  #customer-detail-container {
    margin: 50px 0 0 !important;
    border: 0;
  }

  .customer-detail-box {
    overflow-y: hidden;
  }

  .customer-map .detail-content iframe {
    width: calc(100vw);
    margin-left: -25px;
  }

  .customer-map .detail-content {
    padding: 0;
  }

  .main-menu, .bottom-menu.mobile, #mobile-menu {
    padding: 6px 0 !important;
    background: linear-gradient(#123300, #247c01);
  }
  .main-menu ul, .bottom-menu.mobile ul, #mobile-menu ul {
    align-content: space-around;
  }
  .main-menu ul li, .bottom-menu.mobile ul li, #mobile-menu ul li {
    font-size: inherit;
  }
  .main-menu .material-icons, .bottom-menu.mobile .material-icons, #mobile-menu .material-icons {
    font-size: 2rem;
    color: #2eed7adb;
  }

  #mobile-menu {
    border-top: 0;
    background: linear-gradient(#123300, #164e00);
    border-bottom: 5px solid rgba(114, 88, 255, 0.38);
    box-shadow: -2px -1px 7px 8px #0c143ceb;
  }
  #mobile-menu .material-icons {
    font-size: 2rem;
    color: #99ffb8de;
    filter: drop-shadow(5px -3px 3px rgba(8, 45, 5, 0.87));
  }

  #content-wrapper {
    padding-top: 60px;
  }

  .bottom-menu {
    box-shadow: -3px -5px 6px 0px #ffffff !important;
    -moz-box-shadow: -3px -5px 6px 0px #ffffff !important;
    -webkit-box-shadow: -3px -5px 6px 0px #ffffff !important;
    background: black !important;
    border: 0 !important;
    border-top: 6px solid #2e2e2e8c !important;
  }
  .bottom-menu .material-icons {
    font-size: 1.8rem !important;
    color: #2eed7adb;
    filter: none;
    padding: 7px;
  }
}

/*# sourceMappingURL=mobile.css.map */