body {
  /* Disables pull-to-refresh but allows overscroll glow effects. */
  overscroll-behavior-y: contain;
  font-family: Arial;
}

.body,
.wrapper {
  /* Break the flow */
  position: absolute;
  top: 0px;

  /* Give them all the available space */
  width: 100%;
  height: 100%;

  /* Remove the margins if any */
  margin: 0;
}
.app_frame {
  width: 100%;
  height:100%;

}
.app_mainbar {
  width: 100%;
  height:8vh;
  line-height:8vh;
  background: #568EEA;
  color:#ffffff;
  text-align:  center;
  font-size: 4vh;
}
.actlist {
  float:left;
  width:100%;
  height:42vh;
  overflow: auto;
  z-index: 100;
  line-height: 8vh;
}

.midbar {
  float: left;
  width: 100%;
  height: 8vh;
  line-height: 8vh;
  background: #568EEA;
  padding-top: 1vh;
}

.avlist {
  float:left;
  width:100%;
  height:41vh;
  overflow: auto;
  z-index: 10;
}

.noitems {
  width: 100%;
  height:8vh;
  text-align: center;
}

.listItemRow {
  float:left;
  width: 100%;
  height: 40px;
  line-height: 40px;
  line-height: 8vh;
  background: #ffffff;
  color:#568EEA;
  padding-left: 1vh;
  border-bottom: solid 1px #568EEA;

}

.listItemText {
  float:left;
  width: 80%;
  height: 40px;
  line-height: 40px;
}

.handle {
  float:left;
  width: 20%;
  height: 40px;
  line-height: 40px;
  text-align: center;
}


input[type=text],input[type=password],input[type=password],input[type=datetime-local],input[type=number], select, textarea,input[type="checkbox"] {

  height: 7vh;
  width: 100%;
  border: 1px solid #ffffff;
  border-radius: 1vh;
  border-color: #cecece;
  box-sizing: border-box;
  resize: vertical ;

}

@media all and (orientation:portrait) {
  .listItemRow, .listItemText {
    font-size: 20px;
    height: 40px;
    line-height: 40px;
  }
}
