/* jQuery-Mobile-DateBox Plugin
 * contains all plugin styles
 */
 
/* Base input element Styles */

.ui-input-datebox { width: 95%; background-image: none; padding: .4em; line-height: 1.4; font-size: 16px; display: block; width: 95%; padding-top: 0px; padding-bottom: 0px; padding-right: .4em; }
.ui-input-datebox input { width: 70% !important; border: 1px solid transparent !important; vertical-align: middle; display: inline-block !important; background-color: transparent; zoom: 1; *display: inline; }
.ui-input-datebox input:focus { outline: none;}

@media all and (min-width: 450px){
  .ui-input-datebox { width: 60%; display: inline-block; zoom:1; *display: inline; }
}

/* Calendar Mode Styles */

.ui-datebox-gridheader { text-align: center; }
.ui-datebox-gridheader h4 { text-align: center; display: inline-block; margin-top: 10px; margin-bottom: 10px; zoom:1; *display: inline;}
.ui-datebox-gridplus { float: right; }
.ui-datebox-gridminus { float: left; }
.ui-datebox-gridrow { margin-left: 5px; margin-right: 5px; }
.ui-datebox-grid { clear: both; margin-bottom: 5px; }
.ui-datebox-griddate { width: 36px; height: 30px; display: inline-block; vertical-align: middle; text-align: center; line-height: 30px; font-weight: bold; font-size: 12px; zoom:1; *display: inline;}
.ui-datebox-griddate-empty { border: 1px solid transparent; color: #888; }
.ui-datebox-griddate-label { height: 15px !important; line-height: 15px !important; color: black;}

/* Android Mode Styles */

.ui-datebox-header h4 { margin-top: 5px; margin-bottom: 5px; text-align: center; }
.ui-datebox-controls { text-align: center; }
.ui-datebox-controls div { width: 77px; text-align: center; display: inline-block; zoom: 1; *display: inline;}
.ui-datebox-scontrols { text-align: center; }
.ui-datebox-scontrols div { width: 55px; text-align: center; display: inline-block; zoom: 1; *display: inline;}
.ui-datebox-scontrols .ui-datebox-sinput { width: 68px; }
.ui-datebox-scontrols .ui-datebox-sinput input { width: 48px; text-align: center; }
.ui-datebox-input { width: 74px !important; margin-left: 1px; margin-right: 1px; text-align: center !important; display: inline-block !important; zoom:1; *display: inline; }

/* Slide Mode Styles */

.ui-datebox-sliderow-d { margin-bottom: 5px; text-align: center; height: 40px; width: 280px; overflow: hidden;}
.ui-datebox-sliderow-ym { margin-bottom: 5px; text-align: center; height: 32px; width: 280px; overflow: hidden;}
.ui-datebox-sliderow-hi { text-align: center; height: 32px; width: 280px; overflow: hidden;}
.ui-datebox-sliderow-int { display: inline-block; white-space: nowrap;}

.ui-datebox-slideyear { text-align: center; display: inline-block; zoom:1; *display:inline; width: 84px; vertical-align: middle; line-height: 30px; height: 30px; font-size: 14px; font-weight: bold; }
.ui-datebox-slidemonth { text-align: center; display: inline-block; zoom:1; *display:inline; width: 51px; vertical-align: middle; line-height: 30px; height: 30px; font-size: 12px; font-weight: bold; }
.ui-datebox-slideday { text-align: center; display: inline-block; zoom:1; *display:inline; width: 32px; vertical-align: middle; line-height: 20px; height: 38px; font-size: 14px; font-weight: bold; }
.ui-datebox-slidehour { text-align: center; display: inline-block; zoom:1; *display:inline; width: 32px; vertical-align: middle; line-height: 22px; height: 24px; font-size: 14px; font-weight: bold; }
.ui-datebox-slidemins { text-align: center; display: inline-block; zoom:1; *display:inline; width: 32px; vertical-align: middle; line-height: 22px; height: 24px; font-size: 14px; font-weight: bold; }
.ui-datebox-slidearrow { text-align: center; display: inline-block; zoom:1; *display:inline; width: 10px; vertical-align: middle; line-height: 38px; height: 38px; font-size: 10px; font-weight: bold; }
.ui-datebox-slidewday { font-size: 10px; font-weight: normal; }

/* Flip Mode Styles */
.ui-datebox-flipcontent { text-align: center; height: 125px; margin-bottom: -40px;}
.ui-datebox-flipcontent div { margin-left: 3px; margin-right: 3px; width: 77px; height: 120px; display: inline-block; text-align: center; zoom: 1; *display: inline; overflow: hidden;}
.ui-datebox-flipcenter { border: 1px solid #eee; height: 40px; margin-left: 10px; margin-right: 10px; position: relative; top: -45px;}
.ui-datebox-flipcontent ul { list-style-type: none; display: inline; }
.ui-datebox-flipcontent li { height: 30px; }
.ui-datebox-flipcontent li span { margin-top: 7px; display: block; }
/* Shared Styles */

.ui-datebox-container { border: 5px solid #111 !important; width: 280px; }
.ui-datebox-screen { position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; }
.ui-datebox-screen-modal { background-color: black; -moz-opacity: 0.8; opacity:.80; filter: alpha(opacity=80); }
.ui-datebox-hidden { display: none; }
.ui-dialog .ui-datebox-container { border: none !important; }
.ui-dialog-datebox .ui-content { padding: 5px !important;}

/*####################################################################################################################################

  OVERRIDINGS

####################################################################################################################################*/

.ui-input-datebox {
	background-color: #fff;
  width: 90%;
  padding: 0;
  padding-right: 35px;
}
.ui-input-datebox input {
	height: 58px;
	width: 90%;
	display: block;
	font-size: 25px;
	line-height: 35px;
	border: solid #BEBFB9 1px;
	-moz-border-radius: 0.5em;
	-webkit-border-radius: 0.5em;
	border-radius: 0.5em;
	padding: 10px 10px 10px 1em;
}
.ui-datebox-container {
	width: 550px;
}
.ui-datebox-header h4 {
  margin: 0;
}
.ui-datebox-controls div {
  width: 150px;
}
.ui-datebox-input {
	width: 150px !important;
	height: 90px !important;
	margin: 5px 5px;
	border: 1px solid 		#2A2A2A;
	background: 			#222222;
	color: 					#fff;
	text-shadow: 0 1px 0 	#000;
	font-weight: normal;
	padding: 0 !important;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#666), to(#222)); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(top, #666, #222); /* Chrome 10+, Saf5.1+ */
	background-image:    -moz-linear-gradient(top, #666, #222); /* FF3.6 */
	background-image:     -ms-linear-gradient(top, #666, #222); /* IE10 */
	background-image:      -o-linear-gradient(top, #666, #222); /* Opera 11.10+ */
	background-image:         linear-gradient(top, #666, #222);	
}

/*####################################################################################################################################

  CUSTOM STYLESHEETS

####################################################################################################################################*/

.ui-datebox-header {
	height: 85px;
	background: #222222;
	color: #fff;
	font-size: 23px;
	font-weight: normal;
	margin-bottom: 15px;
	background-image: -webkit-gradient(linear, left top, left bottom, from(#CECECE), to(#9A9A9A)); /* Saf4+, Chrome */
	background-image: -webkit-linear-gradient(top, #CECECE, #9A9A9A); /* Chrome 10+, Saf5.1+ */
	background-image:    -moz-linear-gradient(top, #CECECE, #9A9A9A); /* FF3.6 */
	background-image:     -ms-linear-gradient(top, #CECECE, #9A9A9A); /* IE10 */
	background-image:      -o-linear-gradient(top, #CECECE, #9A9A9A); /* Opera 11.10+ */
	background-image:         linear-gradient(top, #CECECE, #9A9A9A);
}
.ui-datebox-header h4 {
  padding: 30px 0;
}
.ui-datebox-controls .ui-btn-corner-all {
	-moz-border-radius: 1em !important;
	-webkit-border-radius: 1em !important;
	border-radius: 1em !important;
}
.ui-datebox-controls .ui-input-text {
	font-size: 35px !important;
	width: 150px !important;
}
.ui-datebox-controls .ui-btn-inner .ui-btn-text {
	text-shadow: none;
}
.ui-datebox-controls a.ui-btn:hover {
	text-decoration: none !important;
}
.ui-datebox-controls .ui-btn-icon-bottom .ui-btn-inner {
	padding-bottom: 63px;
}
.ui-datebox-controls .ui-btn-icon-top .ui-btn-inner {
  padding-top: 63px;
}
.ui-datebox-controls .ui-btn-icon-top .ui-icon, .ui-datebox-controls .ui-btn-icon-bottom .ui-icon {
  margin-left: -23px;
}
.ui-datebox-controls .ui-btn-icon-top .ui-icon {
  top: 23px;
}
.ui-datebox-controls .ui-btn-icon-left .ui-icon, .ui-datebox-controls.ui-btn-icon-right .ui-icon {
  margin-top: -20px;
}
.ui-datebox-controls .ui-icon-plus {
	height: 43px !important;
  width: 42px !important;
  background-image: url(assets/images/system/phone/icons/datebox/plus.png);
	background-position: 42px 43px !important;
	-moz-background-size: 42px 43px !important;
	-o-background-size: 42px 43px !important;
	-webkit-background-size: 42px 43px !important;
	background-size: 42px 43px !important;
}
.ui-datebox-controls .ui-icon-minus {
	height: 43px !important;
  width: 42px !important;
  background-image: url(assets/images/system/phone/icons/datebox/minus.png);
	background-position: 42px 43px !important;
	-moz-background-size: 42px 43px !important;
	-o-background-size: 42px 43px !important;
	-webkit-background-size: 42px 43px !important;
	background-size: 42px 43px !important;
}
.ui-datebox-controls .ui-icon-check {
	height: 43px !important;
  width: 42px !important;
  background-image: url(assets/images/system/phone/icons/datebox/set.png);
	background-position: 42px 43px !important;
	-moz-background-size: 42px 43px !important;
	-o-background-size: 42px 43px !important;
	-webkit-background-size: 42px 43px !important;
	background-size: 42px 43px !important;
}