﻿html, body {
	height: 100%;
	overflow: auto; 
}
	
* {
	padding: 0px;
	margin: 0px;
}

.grey
{
	background-color:#E1E1E1;
	
}

.MSVE_modeCell
{
	display: none;
	visibility:hidden;
}


	#map {
		position: absolute;
		top: 0px;
		left: 0px;
		width: 75%;
		height: 75%;
	}
	
	#loading {
		position:absolute;
		right: 360px;
		top: 10px;
		display:none;
		z-index:10;
	}

	#right {
		position: absolute;
		right: 0px;
		height: 100%;
		z-index:2;
		border-top: 1px solid #333;
		top:100px;
		width: 350px;
		background: url("../img/right_bg.gif") repeat 0px 0px;
	}
	
		#right #tab {
			height: 70px;
			background: url("../img/tabs_bg.gif") repeat-x 0px 0px;
				padding-top: 10px;
			margin-bottom: 10px;
		}
		
			#right #tab h1 {
				color: white;
				font-size: 15px;
				font-family: arial;
				text-align: center;
				margin-bottom: 10px;
			}
			
			#right #tab ul {
				list-style: none;
				height: 50px;
			}
			
			#right #tab .info {
				background: url("../img/tabs_info.gif");
			}
			
			#right #tab .cam {
				background: url("../img/tabs_camera.gif");
			}
			
			#right #tab li {
				display: block;
				float: left;
			}
			
			#right #tab span {
				color: white;
				text-decoration: none;
				font-family: arial;
				font-size: 12px;
			}
			
				#right #tab ul .fuel-cell-info {
					height: 50px;
					width: 160px;
					line-height: 40px;
					text-align: center;
					display: block;
					cursor: pointer; 
				}
				
				#right #tab ul .live-car-cam {
					height: 50px;
					margin-left: 8px;
					width: 160px;
					line-height: 36px;
					text-align: center;
					display: block;
					cursor: pointer; 
				}
	
		#right #stats {
			text-transform: uppercase;
			font-family: arial; 
			display: block;
		}
		
			#right #stats #battery {
				float: left;
				width: 160px;
				margin-left: 10px;
				display: block;
				height: 150px;
			}
				
			#right #stats #fuel-cell {
				float: left;
				width: 160px;
				margin-left: 10px;
				display: block;
				height: 180px;
			}
				
			#right #stats #fuel {
				float: left;
				width: 160px;
				margin-left: 10px;
				display: block;
				height: 180px;
			}
			
			#right #stats #motor {
				float: left;
				width: 160px;
				margin-left: 10px;
				display: block;
				height: 150px;
			}
			
				.fctitle {
					font-family: arial;
					background-color: #ccc;
					padding: 3px;
					text-align: right;
					color: black;
					font-size: 12px;
					display: block;
					margin-top: 10px;
				}
		
				#right #stats .graph {
					display: block;
					width: 160px;
					height: 30px;
				}
			
					#right #stats .graph .title {
						float: left;
						display: block;
						width: 80px;
						line-height: 28px;
						font-size: 12px;
						color: white;
					}
				
					#right #stats .graph .bars {
						display: block;
						float: right;
						width: 60px;
						height: 18px;
						margin: 5px;
						margin-right: 0px;
					}
				
						#right #stats .graph .bars span {
							display: block;
							float: right;
							border: 1px solid #666;
							width: 4px;
							margin-left: 5px;
							height: 17px;
						}
						
						#right #stats .graph .bars .onred {
							background-color: #a71210;
							border: 1px solid #a71210;
						}
						
						#right #stats .graph .bars .onblue{
							background-color: #011879;
							border: 1px solid #011879;
						}
						
						#right #stats .graph .bars .onbeige {
							background-color: #90916e;
							border: 1px solid #90916e;
						}
						
					#right #stats .graph .scale {
						height: 10px;
						font-size: 10px;
						width: 100px;
						display: block;
						float: right;
						color: white;
						padding-right: 10px;
						text-align: right;
						text-decoration: right;
					}
	
		#right #cam {
			display: none;
		}

	
	#dashboard {
		position: absolute;
		width: 100%;
		min-width: 1200px;
		bottom: 0px;
		
		z-index:2;
		left: 0px;
		background: url('../img/dash_bg.gif') repeat-x 0px 0px;
		height: 169px;
	}
	
		#holder {
			width: 1200px;
			height: 200px;
			min-width: 1200px;
			float: left;
		}
		
		#form {
			float: right;
			position: absolute;
			right: 0px;
			z-index: 40;
			width: 330px;
			margin-right: 10px;
			height: 169px;
			font-family: arial;
			font-size: 11px;
			background: url("../img/form_bg.gif") repeat-x 0px 35px;
		}
		
			#form input {
				width: 75px;
			}
		
			#form h1 {
				text-transform: uppercase;
				font-family: arial;
				font-size: 13px;
				font-weight: 100;
				margin-top: 18px;
				color: white;
			}
			
			#form .left {
				float: left;
				width: 120px;
				color: white;
			}
			
				#form .left .title {					
					display: block;
					color: white;
					margin-top: 5px;
					height: 20px;
					line-height: 17px;
					margin-bottom: 7px;
				}
				
				#form .left span {
					display: block;
					height: 30px;
				}
						
				#form .left label {
					float: left;
					display: block;
					
				}
				
				#form .left .date {
					float: right;
					display: block;
				}
				
				#form .left .time {
					display: block;
					position:absolute;
					left: 10px;
				}
							
			#form .right {
				float: right;
				width: 120px;
				color: white;
			}
				
				#form .right .title {
					display: block;
					color: white;
					margin-top: 5px;
					height: 20px;
					line-height: 17px;
					margin-bottom: 7px;
				}
				
				#form .right span {
					display: block;
					height: 30px;
				}
				
				#form .right button {
					padding: 0px;
					border: 0px;
					background: none;
				}
						
				#form .right label {
					float: left;
					display: block;	
					width: 20px;				
				}
				
				#form .right .date {
					float: right;
					display: block;
				}
				
				#form .right .time {
					display: block;
					position:absolute;
					left: 15px;
				}
								
				#form .right .go {
					display: block;
					margin-bottom: 5px;
				}
				
	
		#dashboard #logo {
			height: 70px;
			width: 210px;
			margin-top: 50px;
			margin-left: 40px;
			float: left;
			background: url('../img/shootlogo.gif') no-repeat 0px 0px;
			cursor:pointer;	
		}

		#dashboard #dashboard_controls {
			width: 555px;
			height: 230px;			
			float: left;
			z-index: 2;
			position: relative;
			top: -84px;
			margin-left: 10px;
			background: url('../img/dash_controls.png') no-repeat;
		}
		
			#dashboard #dashboard_controls #h2 {
				float: left;
				margin-left: 60px;
				margin-top: 72px;
			}
			
			#dashboard #dashboard_controls #speed {
				float: left;
				margin-top: 22px;
			}
			
			#dashboard #dashboard_controls #batt {
				float: left;
				margin-top: 72px;
			}

		#dashboard #copy {
			display: block;
			position: absolute;
			float: right;
			width: 365px;
			top: 180px;
			right: 0px;
		}













