@charset "UTF-8";
/* CSS Document */
.wheelOverlay{
	width: 100%;
	float: left;
	position: absolute;
	left: 0px;
	z-index: 999;
	pointer-events: none;
	height:204px;
}
.wheelOverlayAndroid{
	display:none;
}
.blackBackground{
	background: #000;
}
#backgroundImageContainer{
	max-width:100vw;
	display:none;
}
/*.revealcell {
	max-height:100px;
	text-align:center;
	color:#ABA9A9;
	
}*/
.navigationBar {
	font-family: -apple-system;
	font-size: 19px;
	text-align: center;
	line-height: 84px;
	height: 64px;
	color: #FFF;
	background-color: #181818;
	border-bottom: #333333 solid thin;
}
#navigationEdit{
	float:left;height: 100%;margin-left: 20px;font-size: 1em;color: #e6992f;display:none;
}
#navigationAdd{
	float:right;height: 100%;margin-right: 20px;font-size: 2em; font-weight:200; color: #e6992f; margin-left:10px;display:none;
}
#navigationTitle{
	font-weight:500;
}
.iphoneXNavBar {
	height: 88px;
	line-height: 139px; /*was 108*/
}
#wholecontainer{
	background-color:#0d0d0d;
}
/*.clickoverlay
{
	font-family: -apple-system;
	z-index: 1; 
	position: relative; 
	right: 10px; 
	bottom: 123px; 
	background-color: #0d0d0d; 
	width: 100%; 
	height: 100px; 
	padding: 0px; 
	color: white; 
}
.clickoverlayhours
{
	float: left;
	padding-left: 35%;
}
.clickoverlayminutes
{
	float: right;
	padding-right: 30%;
}*/
.alertType
{
	width: 100%;
/*	margin-top: -50px;*/
/*	margin-top: 24px;*/
	background-color: #191919; 
	height: 44px;
	text-align: left;
	line-height: 44px;
	padding-left: 10px;
	float: left;
	font-family: -apple-system;
	font-size: 18px;
	border-top: #333333 groove thin;
	border-bottom: #333333 groove thin;
	color: #FFF;
}
.alertTypeInner
{
	z-index: 1; 
	position: relative; 
	text-align: right;
	float: right;
	padding-left: 10px;
	font-size: 19px;
	color: #8e8e93;
	padding-right: 20px;
}

.round-button {
	width:20%;
	float: left;
	padding-top: 10px;
	padding-bottom: 5px;
	position: relative; 
	
}
.round-button-green {
	width:20%;
	float: right;
	padding-top: 10px;
	padding-bottom: 5px;
	position: relative; 
}
.round-button-circle {
	width: 100%;
	height:0;
	padding-bottom: 100%;
    border-radius: 50%;
	border:2px solid #000;
    overflow:hidden;
    
    background: #323232; 
    box-shadow: 0 0 3px gray;
}
.round-button-circle-green {
	width: 100%;
	height:0;
	padding-bottom: 100%;
    border-radius: 50%;
	border:2px solid #000;
    overflow:hidden;
    
    background:#19351e; 
    box-shadow: 0 0 3px gray;
}
.round-button a {
    display:block;
	float:left;
	width:100%;
	padding-top:50%;
    padding-bottom:50%;
	line-height:1em;
	margin-top:-0.5em;
    
	text-align:center;
	color:#A2A1A1;
    font-family:-apple-system;
    font-size:0.9em;
    text-decoration:none;
}
.round-button-green a {
    display:block;
	float:left;
	width:100%;
	padding-top:50%;
    padding-bottom:50%;
	line-height:1em;
	margin-top:-0.5em;
    
	text-align:center;
	color:#4cd964;
    font-family:Helvetica;
    font-size:0.9em;
    text-decoration:none;
}
.cardSelectionTable
{
	padding: 15px;
	border-spacing: 15px;
	color: #7C7A7A;
	text-align: center;
	position: fixed;
	bottom: 40px;
	width: 100%;
	max-width: 414px;
}
.cardSelectionTable td
{
	border: 1px solid #7C7A7A;
	border-radius: 20px;
	padding: 15px;
	width: 25%;
	height: 35px;
	position: relative;

}
.tabBar
{
	color: #FFF;
	position:absolute;
	bottom:0;
	max-width: 414px;
	max-height:60px;
	width: 100%;
	height: 56px;
	line-height: 40px;
	background: #181818;
}
.tabBar ul
{
	background-image: url(images/en/tabBar5.PNG);
	background-repeat: no-repeat;
	background-size:contain;
	list-style-type: none;
    margin: 0;
    padding: 0;
}
.tabBar li
{
	display: inline-block;
	width: 20%;
	height: 85px;
}
.tabBar li.active
{
	color: #ff9500
}
body, html {
	position: absolute;
	margin: 0 auto;
	padding: 0;
	overflow: hidden;
	min-height: 568px;
	/*max-height: 736px;*/
	max-height: 812px;
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	user-select: none;
	background-color:#0d0d0d;
	font-family: -apple-system;
	font-size: 18px;
}
div.date_wrapper {
width: 80%;
}
div.date_wrapper .date_header {
height: 25px;
font-weight: 400;
border-bottom: 1px solid #CCC;
margin-bottom: 10px;
}
div.date_wrapper .date_header span.title {
float: left;
text-align: left;
}
div.date_wrapper .date_header span.selection {
float: right;
text-align: right;
color: #CE0000;
}
div.date_wrapper form {
position: relative;
}
div.date_wrapper .lines {
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
border-top: solid 1px #333;
border-bottom: solid 1px #333;
position: absolute;
top: 84.5px;
left: 0px;
width: 100%;
height: 38px;
color:#fff;
}
div.date_wrapper .lines div {
margin-left: 220px;
line-height: 21px;
	
}
div.drum-wrapper {
float: left;
}
div.drum figure {
text-align: right;
	color: #FFF;
}
#drum_hours figure,  #drum_date figure {
text-align: right;
}
#drum_date, #drum_to_date {
margin-left: 10px;
margin-right: 5px;
}
#drum_date,  #drum_hours,  #drum_minutes, #drum_seconds {
/*width: 45%;*/
	width: 32%;
	height:204px;
}
#drum_hours {
margin-left: -4%;
}
#drum_minutes {
	margin-right: 0%;
	margin-left: 2%;
	/*padding-left: -50%;*/
	/*padding-left: 15%*/
}
#drum_seconds {
	margin-right: 0%;
	padding-left: 6%;
	/*padding-left: 25%;*/
}
#drum_month {
width: 90px;
}
#drum_fullYear {
width: 45px;
}
#drum_hours .dial div {
margin: 0 7px;
}
#drum_minutes .dial div {
margin: 0 2px;
}
#drum_seconds .dial div {
margin: 0 2px;
}