/************ control button **************/

.controlElement {
	padding:3px;
	padding-right:8px;
	padding-left:8px;
	border: 1px solid rgb(169, 169, 169);
	border-top-width:0px;
	border-bottom-width:0px;
	border-left-width:0px;
	cursor: pointer;
}
.controlBox {
	min-width: 40px;
	height: 40px;
	background: #EEF6FF;
	color: black;
	border-radius: 5px;		
	border: 1px solid rgb(27, 56, 92);
	text-align: center;
	padding-top: 0px;
	
}
.controlBox .z-vlayout-inner {
	top: -1px;
	min-height: 16px;
}
.controlLabel {
	font-size: 9px !important;
	font-weight: bold;
	position: relative;
	top: -1px;
	left: 0px;
	cursor: pointer;
}
.controlValue {
	font-size: 18px !important;
	padding-left: 10px;
	padding-right: 10px;
}

/************ gnss filter button **************/

.gnssFilterElement {
	padding:3px;
	padding-right:5px;
	padding-left:5px;
	border: 1px solid rgb(169, 169, 169);
	border-top-width:0px;
	border-bottom-width:0px;
	border-left-width:0px;
	cursor: pointer;
}
.gnssFilterBoxSelected {
	width: 40px;
	height: 40px;
	background: rgb(252, 220, 139); 
	color: black;
	border-radius: 5px;		
	text-align: center;
	padding-top: 0px;
}
.gnssFilterBox {
	width: 40px;
	height: 40px;
	background: white;
	color: black;
	border-radius: 5px;		
	text-align: center;
	padding-top: 0px;
}
.gnssFilterBoxSelected .z-vlayout-inner,
.gnssFilterBox .z-vlayout-inner {
	top: 2px;
	min-height: 16px;
}
.gnssFilterLabel {
	font-size: 11px !important;
	font-weight: bold;
	position: relative;
	top: -3px;
	left: 0px;
}

.gnssFilterBoxSelected .all {
	background: rgb(252, 220, 139) ;
}
.gnssFilterBoxSelected .filtered {
	background: linear-gradient(to bottom, rgb(252, 220, 139), rgb(255,255,255) 75%);
} 	
.gnssFilterBoxSelected .none {
	background: white;
} 
.filterImage {
	height: 18px;
	width: 18px;
}

/************ gnss button **************/

.gnssElement {
	padding:3px;
	padding-right:8px;
	padding-left:8px;
	border: 1px solid rgb(169, 169, 169);
	border-top-width:0px;
	border-bottom-width:0px;
	border-left-width:0px;
	cursor: pointer;
}
.gnssBoxSelected {
	width: 40px;
	height: 40px;
	background: rgb(252, 220, 139);
	color: black;
	border-radius: 5px;		
	text-align: center;
	padding-top: 0px;
	
}
.gnssBox {
	width: 40px;
	height: 40px;
	background: white;
	color: black;
	border-radius: 5px;		
	text-align: center;
	padding-top: 0px;
	
}
.gnssBoxSelected .z-vlayout-inner,
.gnssBox .z-vlayout-inner {
	top: -1px;
	min-height: 16px;
}
.gnssLabel {
	font-size: 11px !important;
	font-weight: bold;
	position: relative;
	top: 1px;
	left: 0px;
	cursor: pointer;
}
.gnssValue {
	font-size: 18px !important;
	cursor: pointer;
}

/************ clock button **************/

.timeElement {
	padding:3px;
	padding-right:8px;
	padding-left:8px;
	border: 1px solid rgb(169, 169, 169);		
	border-top-width:0px;
	border-bottom-width:0px;
	border-left-width:0px;
	cursor: pointer;
}

.dateBox {
	width: 40px;
	height: 40px;
	background: #424242;
	color: white;
	border-radius: 5px;		
	text-align: center;
	padding-top: 0px;
}
.timeBox {
	width: 40px;
	height: 40px;
	background: rgb(27, 56, 92); 
	color: white;
	border-radius: 5px;		
	text-align: center;
	padding-top: 0px;
}
.dateBox .z-vlayout-inner,
.timeBox .z-vlayout-inner {
	top: 0px;
	min-height: 16px;
}
.timeLabel {
	font-size: 9px !important;
	position: relative;
	top: 0px;
	left: 0px;
}
.timeValue {
	font-size: 18px !important;
}

/************ action button **************/

.actionElement {
	padding:3px;
	padding-right:5px;
	padding-left:5px;
	border: 1px solid rgb(169, 169, 169);
	border-top-width:0px;
	border-bottom-width:0px;
	border-left-width:0px;
	cursor: pointer;
}
.actionBox {
	min-width: 40px;
	height: 40px;
	background: transparent;
	color: black;
	border-radius: 5px;		
	border: 1px solid rgb(27, 56, 92);
	text-align: center;
	padding-top: 0px;
	
}
.actionBox .z-vlayout-inner {
	#top: -1px;
}
.actionLabel {
	font-size: 10px !important;
	font-weight: bold;
	position: relative;
	top: -1px;
	left: 0px;
}
.actionValue {
	font-size: 18px !important;
	padding-left: 10px;
	padding-right: 10px;
}

/************ info button **************/

.infoElement {
	padding:3px;
	padding-right:8px;
	padding-left:8px;
	border: 1px solid rgb(169, 169, 169);
	border-top-width:0px;
	border-bottom-width:0px;
	border-left-width:0px;
	cursor: default;
}
.infoBox {
	min-width: 40px;
	height: 40px;
	background: transparent;
	color: black;
	border-radius: 5px;		
	text-align: center;
	padding-top: 0px;
	
}
.infoBox .z-vlayout-inner {
	top: 0px;
	min-height: 16px;
}
.infoLabel {
	font-size: 9px !important;
	font-weight: bold;
	position: relative;
	top: -1px;
	left: 0px;
}
.infoValue {
	font-size: 18px !important;
}