/*
@import url("main.css");
*/

* {
font-family: Helvetica, Arial, sans-serif;
padding: 0;
margin: 0;
}

/* ----------
  header
-----------*/

html,
body {
  width: 600px;
  max-width: 600px;
  text-align: center !important;
}

body {
  background: #f0f0ec;
}

[data-role="header"] {
  height: 25px;
  background: #3f464e;
  padding-top: 20px;
}

[data-role="header"] > div {
  max-width: 600px;
  width: 600px;
  margin: 0 auto;
  position: relative;
}

[data-role="header"] h1 {
  font-size: 18px;
  margin-top: -8px;
}

[data-role="header"] .ui-btn.ui-btn-left,
[data-role="header"] .ui-btn.ui-btn-right {
  background: #3cf;
  border-radius: 7px;
  padding: 0 !important;
  margin-top: -8px;
  color: white;
}

.ui-bar-a {
  color: #fff;
  font-weight: 700;
}

.ui-header .ui-title {
  padding-top: 10px;
  color: white;
}

.ui-header .ui-btn-left,
.ui-header .ui-btn-right,
.ui-footer .ui-btn-left,
.ui-footer .ui-btn-right,
.ui-header-fixed.ui-fixed-hidden .ui-btn-left,
.ui-header-fixed.ui-fixed-hidden .ui-btn-right {
  top: 6px;
}

.ui-header .ui-btn-left,
.ui-footer .ui-btn-left {
  padding: 0 0 0 6px;
}

.ui-header .ui-btn-right,
.ui-footer .ui-btn-right {
  padding: 0 6px 0 0;
}

.ui-header .ui-btn-inner {
  padding: 6px 2px 7px;
}

.ui-bar-a input {
  /* remove halo on header buttons */
  background: none;
}

button,
button:focus {
  /* remove halo on main buttons */
  -webkit-appearance: none;
  outline: none;
}

/* ----------
  content
-----------*/

div[data-role="content"] {
  padding: 15px;
  max-width: 600px;
  width: 600px;
  margin: 10px auto 0;
  box-sizing: border-box;
  text-align: left;  -webkit-appearance: none;
}
div[data-role="content"] p:first-child {
}
div[data-role="content"] p:first-child + p {
  padding-top: 5px;
  font-size: 22px;
  font-family: "Avenir-Heavy", sans-serif !important;
}
.timerdiv {
  border-bottom: solid 1px #bbb;
  padding: 10px 15px;
  margin: -10px -15px;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.timerdiv:last-child {
  border-bottom: 0;
}
.timerdiv p + div {
  /* timer display */
  display: block;
  padding-top: 5px;
  margin-bottom: -5px;
  font-size: 22px;
  font-family: "Avenir-Heavy", sans-serif !important;
}
.timerdiv .timer_name {
  width: 100%;
  padding-bottom: 5px;
}

div[data-role="content"] > .timerdiv:first-of-type {
  padding-top: 0px;
  margin-top: -15px;
}

.cf:before, .cf:after {
  content: "";
  display: table;
}
.cf:after {
  clear: both;
}
.cf {
  zoom: 1;
  padding-top: 10px;
}

.timerdiv .ui-btn-inner,
.timerdiv .ui-btn-hidden {
  margin-left: -5px;
  margin-right: 5px;
  border-radius: 7px;
  background: #e8e8e8;
  border-bottom: solid 1px #ccc;
  padding: 5px;
  width: 60px;
}

.timerdiv .ui-disabled .ui-btn-inner,
.timerdiv .ui-disabled .ui-btn-hidden {
  opacity: 0.4;
}

.ui-btn-text {
  padding: 0px 6px;
  background: none;
}

ul[data-role="listview"] {
  padding: 0;
} 
ul[data-role="listview"] .ui-li-divider {
  /* client  name */
  background: white;
  font-size: 18px;
  letter-spacing: -0.5px;
  white-space: nowrap;
  margin: 3px 0 -3px;
}
ul[data-role="listview"] .ui-li-divider:first-child {
  margin-top: 0;
  border-top: 0;
}

ul[data-role="listview"] li form {
  margin: -15px -15px;
  border-bottom: solid 1px #ddd;
}
ul[data-role="listview"] li:first-child form {
  margin-top: -5px;
}
ul[data-role="listview"] li:last-child form {
  border-bottom: 0 !important;
  padding-bottom: 5px;
}

ul[data-role="listview"] li form .ui-btn {
  /* button container */
  width: 50px;
  float: left;
}
ul[data-role="listview"] li form button,
ul[data-role="listview"] li form .ui-btn-inner {
  margin: 0 0 3px 5px;
  width: 40px;
  -webkit-appearance: none;
}
ul[data-role="listview"] li form.locked .ui-btn-inner {
  background-image: url('images/lock.png'), linear-gradient(bottom, rgb(235,235,235) 20%, rgb(255,255,255) 60%);
  background-image: url('images/lock.png'), -moz-linear-gradient(bottom, rgb(235,235,235) 20%, rgb(255,255,255) 60%);
  background-image: url('images/lock.png'), -webkit-linear-gradient(bottom, rgb(235,235,235) 20%, rgb(255,255,255) 60%);
  background-image: url('images/lock.png'), -ms-linear-gradient(bottom, rgb(235,235,235) 20%, rgb(255,255,255) 60%);
  background-repeat: no-repeat, repeat !important;
  background-size: 14px 18px, cover;
  background-position: center center, 0 0 !important;
}

ul[data-role="listview"] li form .timelistdetails {
  float: left;
  padding: 16px 15px 0px 10px;
  font-size: 17px;
  max-width: 70%;
  text-align: left;
  white-space: normal;
}
ul[data-role="listview"] li form .timelistdetails .timelistdate {
  text-align: left;
  font-size: 16px;
  font-weight: bold;
  margin-bottom: 7px;
}
div[data-role="content"] ul[data-role="listview"] li form .timelistdetails .timelistdesc {
  text-align: left;
  padding-top: 0px;
  font-size: 15px;
  font-family: Helvetica, Arial, sans-serif !important;
}
div[data-role="content"] ul[data-role="listview"] li form .timelistdetails .timelistclient {
  text-align: left;
  padding-top: 0px;
  font-size: 15px;
  font-family: Helvetica, Arial, sans-serif !important;
  font-style: italic;
  margin-bottom: 3px;
}

.timerdiv.running div[data-disabled="false"] .ui-btn-inner {
  background: #d00;
  border: 0;
  border-bottom: solid 1px #600;
  padding-bottom: 9px;
  padding-top: 10px;
  margin-right: 7px;
}
.timerdiv.running div[data-disabled="false"] .ui-btn-text {
  padding: 3px 8px 0 7px;
  margin-top: 1px;
  color: white;
}

h4 {
  padding-bottom: 15px;
}

/* ----------
  forms
-----------*/

div[data-role="content"] form input.ui-input-text,
div[data-role="content"] form textarea.ui-input-text {
  margin: 0 5px 0 -5px;
  border-radius: 5px;
  background: white;
  border: solid 1px #ddd;
  border-top: solid 1px #bbb;
  padding: 5px 5px 7px;
}
div[data-role="content"] form textarea.ui-input-text {
  width: 100%;
  margin: 0;
}
div[data-role="content"] form textarea.ui-input-text,
div[data-role="content"] form input[type="text"].ui-input-text {
  -webkit-appearance: none;
}

div[data-role="content"] form input.ui-input-text:focus {
  background: #fff;
}
div[data-role="content"] span.ui-btn-inner,
div[data-role="content"] form .ui-btn-inner {
  background: #666;
  border-radius: 7px;
  border: solid 1px #ddd;
  border-bottom: solid 1px #bbb;
  padding: 9px 3px;
  background-image: linear-gradient(bottom, rgb(235,235,235) 20%, rgb(255,255,255) 60%);
  background-image: -o-linear-gradient(bottom, rgb(235,235,235) 20%, rgb(255,255,255) 60%);
  background-image: -moz-linear-gradient(bottom, rgb(235,235,235) 20%, rgb(255,255,255) 60%);
  background-image: -webkit-linear-gradient(bottom, rgb(235,235,235) 20%, rgb(255,255,255) 60%);
  background-image: -ms-linear-gradient(bottom, rgb(235,235,235) 20%, rgb(255,255,255) 60%);
}

label.ui-select,
label.ui-input-text {
  margin: 8px 0 -3px;
}
textarea.ui-input-text {
  margin-top: 8px !important;
}

option {
  font-size: 13px;
}

input[type=password] {
  margin-bottom: 25px !important;
}


/* ----------
  footer
-----------*/

div[data-role="footer"] {
  border: solid 1px #3f464e;
  margin-bottom: -1px;
}

div[data-role="footer"] .ui-btn-inner {
  background: #3f464e;
  color: white;
}

/* ----------
  list filters
-----------*/
.dispInlineLabel {
	height: 40px;
	display: inline;
	float: left;
	margin-top: 8px;
}

.dispInline {
	height: 40px;
	display: inline;
	float: left;
}

.ui-bar {
  padding-bottom: 20px;
}

/* ----------
  notices
-----------*/

.red_error_message {
	color:red;
	font-size:small;
}

.green_message {
	color:green;
	font-size:small;
}

.red_error_message,
.green_message {
  padding: 5px 0;
}

/* ----------
  jQuery mobile stock icons
-----------*/

.ui-icon,
.ui-icon-searchfield:after {
  background-color: #666;
  background-color: rgba(0, 0, 0, .4);
  background-image: url("https://code.jquery.com/mobile/1.3.2/images/icons-18-white.png");
  background-repeat: no-repeat;
  -webkit-border-radius: 9px;
  border-radius: 9px;
}
.ui-icon-alt .ui-icon,
.ui-icon-alt .ui-icon-searchfield:after {
  background-color: #fff;
  background-color: rgba(255, 255, 255, .3);
  background-image: url("https://code.jquery.com/mobile/1.3.2/images/icons-18-black.png");
  background-repeat: no-repeat;
}
.ui-icon-nodisc .ui-icon,
.ui-icon-nodisc .ui-icon-searchfield:after,
.ui-icon-nodisc .ui-icon-alt .ui-icon,
.ui-icon-nodisc .ui-icon-alt .ui-icon-searchfield:after {
  background-color: transparent; 
}
.ui-icon-plus {
  background-position: -1px -1px !important;
}
.ui-icon-minus {
  background-position: -37px -1px !important;
}
.ui-icon-delete {
  background-position: -73px -1px !important;
  background-color: #d00;
}
.ui-icon-arrow-r {
  background-position: -108px -1px !important;
  background-color: #000;
}
.ui-icon-arrow-l {
  background-position: -144px -1px !important;
  background-color: #000;
}
.ui-icon-arrow-u {
  background-position: -180px -1px !important;
  background-color: #000;
}
.ui-icon-arrow-d {
  background-position: -216px -1px !important;
}
.ui-icon-check {
  background-position: -252px -1px !important;
  background-color: green;
}
.ui-icon-gear {
  background-position: -288px -1px !important;
}
.ui-icon-refresh {
  background-position: -323px -1px !important;
}
.ui-icon-forward {
  background-position: -360px -1px !important;
}
.ui-icon-back {
  background-position: -396px -1px !important;
}
.ui-icon-grid {
  background-position: -432px -1px !important;
}
.ui-icon-star {
  background-position: -467px -1px !important;
}
.ui-icon-alert {
  background-position: -503px -1px !important;
}
.ui-icon-info {
  background-position: -539px -1px !important;
}
.ui-icon-home {
  background-position: -575px -1px !important;
}
.ui-icon-search,
.ui-icon-searchfield:after {
  background-position: -611px -1px;
}
.ui-icon-checkbox-on {
  background-position: -647px -1px;
}
.ui-icon-checkbox-off {
  background-position: -683px -1px;
}
.ui-icon-radio-on {
  background-position: -718px -1px;
}
.ui-icon-radio-off {
  background-position: -754px -1px;
}
.ui-icon-bars {
  background-position: -788px -1px;
}
.ui-icon-edit {
  background-position: -824px -1px;
}

@media only screen 
and (-webkit-min-device-pixel-ratio:1.3),
only screen and (min--moz-device-pixel-ratio:1.3),
only screen and (min-resolution:200dpi) {
  .ui-icon-plus,
  .ui-icon-minus,
  .ui-icon-delete,
  .ui-icon-arrow-r,
  .ui-icon-arrow-l,
  .ui-icon-arrow-u,
  .ui-icon-arrow-d,
  .ui-icon-check,
  .ui-icon-gear,
  .ui-icon-refresh,
  .ui-icon-forward,
  .ui-icon-back,
  .ui-icon-grid,
  .ui-icon-star,
  .ui-icon-alert,
  .ui-icon-info,
  .ui-icon-home,
  .ui-icon-bars,
  .ui-icon-edit,
  .ui-icon-search,
  .ui-icon-searchfield: after,
  .ui-icon-checkbox-off,
  .ui-icon-checkbox-on,
  .ui-icon-radio-off,
  .ui-icon-radio-on {
    background-image: url("https://code.jquery.com/mobile/1.3.2/images/icons-36-white.png");
    -moz-background-size: 864px 18px;
    -o-background-size: 864px 18px;
    -webkit-background-size: 864px 18px;
    background-size: 864px 18px;
  }
  .ui-icon-alt .ui-icon {
    background-image: url("https://code.jquery.com/mobile/1.3.2/images/icons-36-black.png");
  }
  .ui-icon-plus {
    background-position: 0 50%;
  }
  .ui-icon-minus {
    background-position: -36px 50%;
  }
  .ui-icon-delete {
    background-position: -72px 50%;
  }
  .ui-icon-arrow-r {
    background-position: -108px 50%;
  }
  .ui-icon-arrow-l {
    background-position: -144px 50%;
  }
  .ui-icon-arrow-u {
    background-position: -179px 50%;
  }
  .ui-icon-arrow-d {
    background-position: -215px 50%;
  }
  .ui-icon-check {
    background-position: -252px 50%;
  }
  .ui-icon-gear {
    background-position: -287px 50%;
  }
  .ui-icon-refresh {
    background-position: -323px 50%;
  }
  .ui-icon-forward {
    background-position: -360px 50%;
  }
  .ui-icon-back {
    background-position: -395px 50%;
  }
  .ui-icon-grid {
    background-position: -431px 50%;
  }
  .ui-icon-star {
    background-position: -467px 50%;
  }
  .ui-icon-alert {
    background-position: -503px 50%;
  }
  .ui-icon-info {
    background-position: -538px 50%;
  }
  .ui-icon-home {
    background-position: -575px 50%;
  }
  .ui-icon-search, .ui-icon-searchfield:after {
    background-position: -611px 50%;
  }
  .ui-icon-checkbox-on {
    background-position: -647px 50%;
  }
  .ui-icon-checkbox-off {
    background-position: -683px 50%;
  }
  .ui-icon-radio-on {
    background-position: -718px 50%;
  }
  .ui-icon-radio-off {
    background-position: -754px 50%;
  }
  .ui-icon-bars {
    background-position: -788px 50%;
  }
  .ui-icon-edit {
    background-position: -824px 50%;
  }
}
/* end icon media query */
.ui-checkbox .ui-icon,
.ui-selectmenu-list .ui-icon {
  -webkit-border-radius: 3px;
  border-radius: 3px;
}
.ui-icon-checkbox-off,
.ui-icon-radio-off {
  background-color: transparent;
}
.ui-checkbox-on .ui-icon,
.ui-radio-on .ui-icon {
  background-color: #4596ce;
}
.ui-icon-loading {
  background: url("https://code.jquery.com/mobile/1.3.2/images/ajax-loader.gif");
  background-size: 46px 46px;
}

/* ----------
  media queries for mobile
-----------*/

@media screen 
and (min-width: 320px)
and (max-width: 736px) {

  html,
  body {
    width: 100%;
    max-width: 100%;
  }
  
  [data-role="header"] > div {
    max-width: 100%;
    width: 100%;
  }
  [data-role="header"] .ui-btn.ui-btn-left,
  [data-role="header"] .ui-btn.ui-btn-right {
    margin-top: -10px;
  }
  
  div[data-role="content"] {
    max-width: 100%;
    width: 100%;
    margin: 10px auto 0;
    box-sizing: border-box;
    text-align: left;
  }

  .ui-bar {
    margin-top: -20px;
    padding-bottom: 30px;
  }
}