html {font-size: 100%; width: 100%; overflow: auto; overflow-y: scroll;}

body {
	width: 100%; 
	margin: 0px;
	padding: 0px 0px 3.2em;
	overflow: visible;
	vertical-align: top;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 62.5%;
	background-color: #000;
	color: #fff;
}

a,
a:link,
a:visited,
a:hover,
a:active {
	color: #8d8d8d;
}

a:hover {
	text-decoration: none;
}

form, #output {
	font-size: 1.2em;
}

form {
	position: relative;
	margin: 0px auto;
	top: 20px;
	width: 715px;
	padding-left: 85px;
	height: 134px;
}

#output {
	width: 100%;
	height: 492px;
	background: #000 url(../img/main_bg.jpg) repeat-y 50% 0%;
}

.nocanvas #output {
	/*top: -250px;*/
	height: 311px;
}

.showNumber,
#perfWeightD00, #perfWeightD01, #perfWeightD02,
#perfMpgD00, #perfMpgD01, #perfMpgD02 {
	position: absolute;
	font-size: 0.92em;
	text-align: center;
	vertical-align: middle;
	height: 17px;
	width: 18px;	
	line-height: 16px;
	color: #fff;
	font-weight: bold;
}

#carBox0, #carBox1, #carBox2 {
	width: 200px;
	margin: 5px;
	float: left;
	text-align: center;
	
}

.nocanvas #carBox0, .nocanvas #carBox1, .nocanvas #carBox2 {
	height: 350px;
}

h2 {
	margin: 0px 0px 0px 10px;
	padding: 0px;
	line-height: 0.45em;
	width: 50px;
	font-size: 2.8em;
	position: relative;
	text-align: left;
	top: -0.25em;
	font-style: italic;
	text-shadow: #222 2px 2px 2px;
}

.carContainer {
	border: 0px solid #000;
	width: 196px;
	height: 6.2em;
	line-height: 2em;
	padding: 0px;
	text-align: center;
	background-color: #fff;
	margin: 0px auto;
}

legend {display: none;}

.carContainer b, #textOutput td {
	color: #000;
}

.carContainer legend {
	margin-bottom: 20px;
	padding: 0px;
}

.carContainer select {
	width: 98%;
	margin: 0px 1%;
	vertical-align: middle;
	visibility: hidden;
}

.carContainer select.active {
	visibility: visible;
}


.noscript .carContainer select {
	margin: 0px 1px;
	width: 148px;
}

input {
	display: none;
	vertical-align: middle;
	width: 36px;
}

.noscript input {
	display: inline;
}

input.reset {
	display: inline;
	float: right;
	text-transform: uppercase;
	font-size: 0.7em;
	width: auto;
}

.msrp {
	display: block;
	width: 100%;
	padding-bottom: 2px;
	border-bottom: 1px solid #000;
}

.carContainer label {
	line-height: 2em;
	text-transform: uppercase;
	text-align: right;
	font-weight: bold;
	margin-left: -9080px;
	width: 80px;
	margin-right: 9050px;
	float: left;
	clear: left;
	position: relative;
	left: -9080px;
	margin: 0px -9080px 0px 0px;	
}

#car0 label {
	left: -90px;
	margin: 0px -80px 0px 0px;
}

/*	Color-codings...	*/
.colorCode {background-color: #8d8d8d}

.nocanvas div.colorCode {
	background: #8d8d8d url(../img/box_bg.jpg) repeat-x 0% 100%;
}

.colorCode0, .showPlotData0 {background-color: #f63}
col.colorCode0 {background-color: #FFB294}
.colorCode1, .showPlotData1 {background-color: #6c2}
col.colorCode1 {background-color: #B5E78C}
.colorCode2, .showPlotData2 {background-color: #26f}
col.colorCode2 {background-color: #8CB2FF}

#views {
	text-align: center;
	padding: 20px 0px 0px 160px;
	height: 26px;
	margin: -1px auto 0px;
	width: 640px;
	clear: left;
	position: relative;
}

#views a {
	color: #c5c5c5;
	display: block;
	float: left;
	text-transform: uppercase;
	font-size: 1.28em;
	font-weight: bold;
	width: 180px;
	margin: 0px -10px;
	height: 24px;
	padding-top: 2px;
	line-height: 24px;
	vertical-align: middle;
	cursor: pointer;
	
	
	z-index: 5;
}

#views a.currentTab {
	color: #fff;
	background: transparent url(../img/views_bg.jpg) no-repeat 50% 0px;
	cursor: default;
	z-index: 6;
}

/*	Output */
#dimDisplay {
	width: 800px;
	height: 230px;
}

#fuelMpg, #perfHpTorque {
	width: 275px;
	height: 188px;
}

#fuelCost {
	width: 255px;
	height: 188px;
}

#fuelRange {
	width: 263px;
	height: 180px;
}

#perfWeight, #perfMpg {
	width: 300px;
	height: 215px;
}

.showNumber {
	cursor: default;
}

.showChartData {
	font-weight: bold;
	color: #fff;
	width: 50px;
	position: absolute;
	text-align: center;
	cursor: default;
}

.showLabel, .permLabel {
	font-family: Georgia, serif;
	font-size: 118%;
	position: absolute;
	background-color: #fff;
	width: 50px;
	text-align: center;
	cursor: default;
}

#perfView .showPlotData0,
#perfView .showPlotData1,
#perfView .showPlotData2 {
	margin-top: 0px;
	padding-left: 4px;
	height: 50px;
	width: 76px;
	line-height: 1.42em;
	text-align: left;
	z-index: 9;
}

.hide {
	display: none;
}

.blur {
	visibility: hidden;
}

#dimView, #perfView, #fuelView, 
.nocanvas #output {
	margin: 0px auto;
	width: 800px;
	clear: left;
	position: relative;
	background: none;
}

#dimView, #perfView, #fuelView {
	color: #000;
	background-color: #fff;
	height: 490px;
}

/*	Output containers	*/
#dimBox {
	position: absolute;
	top: 96px;
}

/*	specific to dimensions...	*/
#dimInst {
	position: absolute;
	top: -20px;
	left: 15px;
	width: 500px;
	height: 20px;
}

#dimFocus {
	position: absolute;
	top: 0px;
	left: 15px;
	width: 200px;
	height: 40px;
}

#dimFocus a {
	float: left;
	font-size: 1.6em;
	font-weight: bold;
	color: #fff;
	height: 40px;
	width: 40px;
	margin-right: 10px;
	cursor: pointer;
	line-height: 40px;
	text-align: center;
	vertical-align: middle;
}

/*	dimension labels	*/

#dimPerson {
	background-color: transparent;
	left: 720px;
	top: 80px;
}

#dimLength, #dimWidth {
	top: 206px;
}

#dimWidth {
	left: 615px;
}

#dimHeight{
	padding: 5px 0px;
	left: 502px;
}

/*	fuel economy 	*/
#fuelView div.permLabel,
#perfView div.permLabel {
	background-color: transparent;
	text-align: right;
}

#fuelMpgBox, #perfHpTorqueBox {
	position: absolute;
	top: 36px;
	left: 262px;
	width: 275px;
	height: 188px;
	background: transparent url(../img/chart_bg.jpg) no-repeat 25px 1px;
}

#fuelMpgL0Max, #fuelCostL0Max,
#perfHpTorqueL0Max {
	top: -8px;
	left: -54px;
}

#fuelMpgL0Half, #fuelCostL0Half,
#perfHpTorqueL0Half {
	top: 81px;
	left: -54px;
}

#fuelMpgL0Min, #fuelCostL0Min,
#perfHpTorqueL0Min {
	top: 171px;
	left: -54px;
}

#fuelMpgD00, #fuelMpgD01, #fuelMpgD02,
#fuelMpgD10, #fuelMpgD11, #fuelMpgD12,
#perfHpTorqueD00, #perfHpTorqueD01, #perfHpTorqueD02,
#perfHpTorqueD10, #perfHpTorqueD11, #perfHpTorqueD12 {
	width: 30px;
}

#fuelMpgD10, #fuelMpgD11, #fuelMpgD12,
#perfHpTorqueD10, #perfHpTorqueD11, #perfHpTorqueD12 {
	color: #000;
}

#fuelMpgN0, #perfHpTorqueN0 {
	top: 170px;
	left: 98px;
}

#fuelMpgN1, #perfHpTorqueN1 {
	top: 170px;
	left: 164px;
}

#fuelMpgN2, #perfHpTorqueN2 {
	top: 170px;
	left: 230px;
}

#fuelCostBox {
	position: absolute;
	top: 244px;
	left: 45px;
	width: 255px;
	height: 200px;
	background: transparent url(../img/chart_bg.jpg) no-repeat 5px 1px;
}

#perfWeightBox {
	position: absolute;
	top: 248px;
	left: 17px;
	width:300px;
	height: 215px;
	background: transparent url(../img/chart_bg.jpg) no-repeat 50px 1px;
}

#perfWeightL0Max, #perfMpgL0Max {
	top: -8px;
	left: -8px;
}

#perfWeightL0Half, #perfMpgL0Half {
	top: 81px;
	left: -8px;
}

#perfWeightL0Min, #perfMpgL0Min {
	top: 175px;
	left: -4px;	
}

#fuelView #fuelRangeL0Max, #fuelView #fuelRangeL0Half, #fuelView #fuelRangeL0Min,
#perfView div#perfWeightL1Half, #perfView div#perfWeightL1Max,
#perfView div#perfMpgL1Half, #perfView div#perfMpgL1Max {
	text-align: center;
}

#perfView div#perfWeightL1Half, #perfView div#perfMpgL1Half {
	top: 182px;
	left: 148px;	
}

#perfView div#perfWeightL1Max, #perfView div#perfMpgL1Max {
	top: 182px;
	left: 276px;	
}

#perfWeightD00, #perfWeightD01, #perfWeightD02,
#perfMpgD00, #perfMpgD01, #perfMpgD02 {
	position: absolute;
	margin-top: 33px;
	cursor: pointer;
}

#fuelCostN0 {
	top: 170px;
	left: 91px;
}

#fuelCostN1 {
	top: 170px;
	left: 151px;
}

#fuelCostN2 {
	top: 170px;
	left: 211px;
}

#fuelView div#fuelCostControl {
	position: absolute;
	top: 194px;
	left: 0px;
	width: 255px;
	text-align: center;
}

#fuelRangeBox {
	position: absolute;
	top: 248px;
	left: 491px;
	width: 263px;
	height: 200px;	
	background: transparent url(../img/chart_bg.jpg) no-repeat 9px 1px;
}

#perfMpgBox {
	position: absolute;
	top: 248px;
	left: 454px;
	width:300px;
	height: 215px;	
	background: transparent url(../img/chart_bg.jpg) no-repeat 50px 1px;
}

#fuelRangeL0Max {
	top: 182px;
	left: 239px;
}

#fuelRangeL0Half {
	top: 182px;
	left: 111px;
}

#fuelRangeL0Min {
	top: 182px;
	left: -16px;
}

#fuelRangeN0 {
	top: 58px;
	left: 0px;
}

#fuelRangeN1 {
	top: 100px;
	left: 0px;
}

#fuelRangeN2 {
	top: 142px;
	left: 0px;
}

/*		NOCANVAS		*/

#textOutput {
	border-spacing: 10px;
	text-align: center;
	position: absolute;
	top: -250px;
	width: 720px;
	z-index: 9;
}

#textOutput td, #textOutput th {
	padding: 0px;
}

th {background-color: transparent; text-align: right;}
th span {
	display: block;
	height: 0px;
	overflow: hidden;
}

colgroup.leftHeaders {
	width: 70px;
}

col {
	width: 200px;
}

#textMode {
	position: absolute;
	text-align: right;
	white-space: nowrap;
	top: 1.8em;
	left: 50%;
	margin-left: 210px;
}

#textMode a,
#textMode a:link,
#textMode a:visited,
#textMode a:hover,
#textMode a:active {
	display: block;
	line-height: 1.8em;
	width: 10em;
	padding-right: 3.4em;
}

#textMode a.eye:hover {
	background: transparent url(../img/vis_impaired.jpg) no-repeat 100% 50%;	
}

#disclaimer {
	color: #8d8d8d;
	text-align: center;
	line-height: 4em;
	margin-top: 20px;
}

/*	Crumbs	*/
#crumbs {
	color: #8d8d8d;
	white-space: nowrap;
	width: 100%;
	height: 1.3em;
	line-height: 1.3em;
	font-size: 1.2em;
	letter-spacing: 0.083em;
	background-color: #383838;
	border-bottom: 1px solid #222;
}

#crumbs span {
	margin-left: 1.8em;
}
