.ui-mobile, .ui-mobile body {
  height: 100%;
  margin: 0px;
}

.outer-frame {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  z-index: 10;
  background-color: #fff;
  /*
  opacity: 0.5;
  background-color: transparent!important;
  */
}
.outer-frame::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 1px rgba(0, 0, 0, 0.3);
  background-color: #F5F5F5;
}
.outer-frame::-webkit-scrollbar {
  width: 1px;
  background-color: #F5F5F5;
}
.outer-frame::-webkit-scrollbar-thumb {
  background-color: #000000;
}
.outer-frame .page-popup {
  position: absolute;
}

.outer-frame-nav {
  position: fixed;
  top: 3px;
  right: 3px;
  z-index: 20;
  border-radius: 10px;
}
.outer-frame-nav div {
  display: block;
  margin: 0px;
  float: left;
  border-radius: 8px !important;
  background-color: #000;
  border: 0px;
  width: auto;
}
.outer-frame-nav div:after {
  background-color: #000;
  background-size: 18px 18px;
}
.outer-frame-nav div:hover:after {
  opacity: 0.5;
  background-color: #000;
}
.outer-frame-nav div:first-of-type {
  margin-right: 3px;
}

.outer-frame-bg {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  z-index: 1;
  text-align: center;
  background-image: url("../images/frame-bg.jpg");
  background-repeat: no-repeat;
  background-position: 50% 50%;
  background-size: cover;
}
.outer-frame-bg img {
  max-width: 100%;
  max-height: 100%;
  display: none;
}

.outer-frame-bg[data-type=ipad][data-orientation=landscape] img.ipad-landscape {
  display: inline-block;
}

.outer-frame-bg[data-type=ipad][data-orientation=portrait] img.ipad-portrait {
  display: inline-block;
}

.outer-frame-bg[data-type=iphone][data-orientation=landscape] img.iphone-landscape {
  display: inline-block;
}

.outer-frame-bg[data-type=iphone][data-orientation=portrait] img.iphone-portrait {
  display: inline-block;
}

.outer-frame[data-type=iphone][data-orientation=portrait] .ui-footer a,
.outer-frame[data-type=iphone][data-orientation=portrait] .main-footer a {
  width: 20%;
}

.outer-frame[data-type=iphone][data-orientation=portrait] .ui-footer.btn-footer a,
.outer-frame[data-type=iphone][data-orientation=portrait] .main-footer.btn-footer a {
  width: 100%;
}

.outer-frame[data-type=iphone][data-orientation=landscape] .ui-footer,
.outer-frame[data-type=iphone][data-orientation=landscape] .main-footer {
  bottom: auto;
  position: fixed;
  top: 0px;
  width: auto;
  height: 100%;
  padding: 0px 5px;
  border-top-width: 0px;
  border-left-width: 1px;
}
.outer-frame[data-type=iphone][data-orientation=landscape] .ui-footer a,
.outer-frame[data-type=iphone][data-orientation=landscape] .main-footer a {
  display: block;
  width: auto;
  height: 25%;
  min-width: 50px;
  padding: 5px 0px;
}
.outer-frame[data-type=iphone][data-orientation=landscape] .ui-footer a img,
.outer-frame[data-type=iphone][data-orientation=landscape] .main-footer a img {
  width: auto;
  height: 100%;
}

.outer-frame[data-type=iphone][data-orientation=portrait] #search-orders .ui-grid-a .ui-block-a {
  width: 50%;
}
.outer-frame[data-type=iphone][data-orientation=portrait] #search-orders .ui-grid-a .ui-block-b {
  width: 50%;
}

@media (orientation: landscape) {
  .outer-frame-bg img {
    /*height: 100%;*/
  }

  /*.outer-frame-bg img.ipad-portrait { display: none; }
  .outer-frame-bg img.ipad-landscape { display: inline-block; }*/
}
@media (orientation: portrait) {
  .outer-frame-bg img {
    /*width: 100%;*/
  }

  /*.outer-frame-bg img.ipad-portrait { display: inline-block; }
  .outer-frame-bg img.ipad-landscape { display: none; }*/
}
#start,
#login {
  position: absolute;
  top: 0px;
  bottom: 0px;
  left: 0px;
  right: 0px;
  height: auto !important;
}

.outer-frame[data-type=iphone][data-orientation=portrait] .login-form {
  width: 96%;
  margin-left: -48%;
}

.outer-frame[data-type=iphone] .btns-list .text-input-holder {
  width: 100%;
}

.outer-frame[data-type=iphone] #time-calendar-holder .is-accounted-for,
.outer-frame[data-type=iphone] #time-calendar-holder .is-not-accounted-for,
.outer-frame[data-type=iphone] #time-calendar-holder .is-extra,
.outer-frame[data-type=iphone] .custom-time-calendar-holder .is-accounted-for,
.outer-frame[data-type=iphone] .custom-time-calendar-holder .is-not-accounted-for,
.outer-frame[data-type=iphone] .custom-time-calendar-holder .is-extra {
  width: 8px;
  height: 8px;
  top: 9px;
  right: -5px;
  font-size: 5px;
}

.outer-frame[data-type=iphone] #time-calendar-holder .is-accounted-for > div,
.outer-frame[data-type=iphone] #time-calendar-holder .is-not-accounted-for > div,
.outer-frame[data-type=iphone] #time-calendar-holder .is-extra > div,
.outer-frame[data-type=iphone] .custom-time-calendar-holder .is-accounted-for > div,
.outer-frame[data-type=iphone] .custom-time-calendar-holder .is-not-accounted-for > div,
.outer-frame[data-type=iphone] .custom-time-calendar-holder .is-extra > div {
  font-size: 8px;
}

/*# sourceMappingURL=web-app.css.map */
