/*Global Styles*/
a:link, a:visited{
	color:#4790c9;
	text-decoration:none;
}
a:hover{
	text-decoration:underline;
}
body{
	font:12px Arial, Helvetica, sans-serif;
	line-height:1.5;
	color:#434343;
	background:#fff;
	text-align:left;
	margin:0px;
	padding:0px;
	padding-bottom:20px;
}
hr{
	margin:25px 0 10px 0;
	padding:0;
	height:1px;
	background-color:#C0C0C0;
	border:none;
}
#pagewrapper{
	width:1100px;
}
#site-wrapper{
	background:url(../../images/content-bg.gif) repeat-y;
	width:800px;
	float:left;
}
#header{
	position:relative;
	background:url(../../images/header.gif) no-repeat;
	width:800px;
	height:94px;
}
#header a{
	position:absolute;
	top:0;
	left:40px;
	width:185px;
	height:94px;
	text-indent:-5000px;
}
#footer{
	background:url(../../images/footer.gif) no-repeat;
	width:760px;
	height:46px;
	padding:14px 0 0 40px;
	text-transform:uppercase;
	color:#292929;
	font:10px Arial, Helvetica, sans-serif;
	clear:both;
}
#content{
	padding:10px 34px 40px 40px;
	float:left;
}
h3{
	font:normal 12px Arial, Helvetica, sans-serif;
	color:#920f0f;
	margin:0;
	padding:0 0 10px 0;
	text-transform:uppercase;
}

/*MAIN FORM*/
form
{
	margin: 0;
	padding: 0;
}
#customize-form{
	width:724px;
	padding:0;
	margin:0 0 30px 0;
	float:left;
}
#customize-form input.text{
	margin: 0 3px 0 0;
	padding:2px;
	border-width:1px;
	border-color:#aaa;
	border-style:solid; 
}
#form-label{
	float:left;
	padding-bottom: 10px;
	width:31px;
	height:304px;
	overflow:hidden;
	box-sizing:border-box;
	background:url(../../images/form-label-bg.gif) no-repeat;
}
#form-label h2{
	font-size:13px;
	color:#fff;
	text-transform:uppercase;
	margin: 0 0 0 6px;
	padding: 0;
	writing-mode: tb-rl;
	filter: flipv fliph;
}
#form-content{
	float:left;
	position: relative;
}

/*Step 1*/
#form-content #rental-details{
	background:url(../../images/form-bg-1.gif) no-repeat;
	overflow:hidden;
	float:left;
	height:234px;
	width:653px;
	margin:0;
	padding:70px 0 0 40px;
	border:none;
	font:11px Arial, Helvetica, sans-serif;
}
#form-content #rental-details .buttons{
	margin:40px 20px 0 0;
	float:right;
}
#form-content #rental-details .step1{
	margin-top: 170px;
}
h3.next{
	margin-top:10px;
	font-size:11px;
	color:#333;
	font-weight:bold;
}
#form-content #rental-details .column{
	margin-right:70px;
}
#form-content #rental-details .small{
	margin-right: 30px;
}
#form-content #rental-details #validation{
	float: left;
	clear: left;
}
#form-content #rental-details span{
	color: red;
}
#form-content #rental-details span.alert{
	padding-left: 15px;
}
/*Step 2*/
#form-content #car-choices{
	background:url(../../images/form-bg-2.gif) no-repeat;
	overflow:hidden;
	float:left;
	height:254px;
	width:653px;
	margin:0;
	padding:50px 0 0 40px;
	border:none;
	font:11px Arial, Helvetica, sans-serif;
	text-transform:uppercase;
	color:#920f0f;
	display:none;/*Delete to preview step 2*/
}
#form-content #car-choices .buttons{
	margin:190px 20px 0 0;
	float:right;
}
/*Step3*/
#form-content #rental-summary{
	background:url(../../images/form-bg-3.gif) no-repeat;
	overflow:hidden;
	float:left;
	height:254px;
	width:653px;
	margin:0;
	padding:50px 0 0 40px;
	border:none;
	display:none;/*Delete to preview step 2*/
}
#form-content #rental-summary .buttons{
	margin:0 20px 0 0;
	float:right;
}

/*Form Navigation*/
#nav_dates-and-location, #nav_car-type, #nav_confirmation 
{
	display:block;	
	position:absolute;
	top:0;
	left:0;
	height:35px;	
	z-index:50;
	text-indent: -5000px;
}

#nav_dates-and-location 
{
	width:190px;
}

#nav_car-type
{
	left:195px;
	width:131px;
}

#nav_confirmation
{
	left:327px;
	width:155px;
}

/*Widget*/
#price-widget{
	background:url(../../images/widget-bg-lg.gif) no-repeat;
	width:181px;
	height:215px;
	position:absolute;
	top:145px;
	left:550px;
	font:13px Arial, Helvetica, sans-serif;
	color:#383838;
	padding:35px 0 0 25px;
	visibility:hidden;
	z-index:75;
}
#price-widget-iframe h3{
	margin: 0;
	padding: 0 0 5px 0;
}
#price-widget-iframe td{
	margin: 0;
	padding:2px 17px 2px 0;
}
#price-widget-iframe td.cost{
	padding:2px 0;
}
#widget-close{
	position: absolute;
	top: 0;
	right: 0;
	margin:2px 2px 0 0;
}

/*PROMOS*/
#promos{
	clear:both;
}
#promos img{
	float:left;
}

/*Rental Agreement*/
#content h1{
	font:normal 16px Arial, Helvetica, sans-serif;
	color:#920f0f;
	margin:0;
	padding:0 0 20px 0;
	text-transform:uppercase;
	clear:both;
}
table.price-summary th, table.price-summary td{
	text-align:right;
	width:50px;
}
#rental-summary{
	background:none;
	border-bottom:1px solid #c4c4c4;
	margin:0 0 30px 0;
	padding:10px 0 25px 0;
	font-size:13px;
	float:left;
	width:710px;
	overflow:hidden;
}
.column{
	float:left;
	margin-right:80px;
}
.column-bottom{
	margin-top:30px;
}
#rental-summary h3{
	font:normal 12px Arial, Helvetica, sans-serif;
	color:#920f0f;
	margin:0;
	padding:0 0 14px 0;
	text-transform:uppercase;
}
#rental-summary h3 span{
	font-weight:bold;
	text-transform:none;
	color:#434343;
}
#rental-summary h4{
	font:bold 13px Arial, Helvetica, sans-serif;
	margin:0;
	padding:0;
}
#agree{
	text-align:center;
	margin-top:46px;
}
ol{
	color:#555;
	font-size:13px;
}
ol li{
	margin-bottom:7px;
}
/*Car Gallery*/
.car-photos{
	border-top:1px solid #c4c4c4;
	padding:20px 0;
	margin:0;
	float:left;
	width:720px;
}
#photos-bottom{
	border-bottom:1px solid #c4c4c4;
}
.car-photos .photos-header{
	float:left;
}
.car-photos h2{
	font:bold 15px Arial, Helvetica, sans-serif;
	margin:0;
	padding:0 0 14px 0;
	float:left;
}
.car-photos h3{
	font:normal 12px Arial, Helvetica, sans-serif;
	color:#920f0f;
	margin:0;
	padding:0 0 14px 0;
	text-transform:uppercase;
	float:right;
}
.car-photos .photos{
	float:left;
	width:720px;
	padding-top:10px;
}
.car-photos .photos img{
	float:left;
	width:160px;
	margin-left:20px;
	border:2px solid #fff;
	outline: #d4d4d4 solid 1px;
}
.car-photos .photos img.left{
	margin-left:0px;
	outline:none;
}

/*START OVERLAY*/
#start-overlay{
	background:url(../../images/overlay-bg.png);
	position: absolute;
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	z-index: 98;
}
#start-box{
	width:614px;
	position:absolute;
	top:80px;
	left:250px;
	z-index: 99;
}

#start-box .start-content{
	background:url(../../images/start-bg.png) repeat-y top;
	padding:35px;
}
#start-box .start-content p{
	margin-bottom:0;
}
#start-box .start-content h1{
	font:bold 17px Arial, Helvetica, sans-serif;
	color:#920f0f;
	margin:0;
	padding:0 0 20px 0;
}
#start-box .start-content img{
	float:left;
	margin:0 15px 15px 0;
}

/*GUIDE*/
#guide-wrapper{
	width:260px;
	float:left;
	background:#efefef;
	margin:18px 0 0 40px;
}
#guide-content{
	border:2px solid #c0c0c0;
	height:650px;
}
#guide-text{
	padding:10px 12px;
	background:#efefef;
	font-size:11px;
	color:#555;
}
.frame{
	width:255px;
	height:646px;
}
#guide-text h2{
	font:bold 13px Arial, Helvetica, sans-serif;
	color:#920f0f;
	margin:0;
	padding:0;
}
#guide-text h3{
	font:normal 11px Arial, Helvetica, sans-serif;
	color:#131313;
	margin:0;
	padding:20px 0 12px 0;
	text-transform:uppercase;
}
#guide-text h4{
	font:bold 11px Arial, Helvetica, sans-serif;
	margin:0;
	padding:0;
}
#guide-text p 
{
	margin: 5px 0 15px 0;
	padding: 0;
}
.number{
	font-weight:bold;
	color:#920f0f;
}
/*Guide Overlay*/
.code-overlay{
	background:#efefef;
	border:2px solid #c0c0c0;
	width:650px;
	position:absolute;
	top:18px;
	left:185px;
	visibility:hidden;
	z-index:99;
}
.code-overlay h2{
	font:bold 14px Arial, Helvetica, sans-serif;
	color:#920f0f;
	margin:0;
	padding:18px 0 0 15px;
}
.close-code-box{
	float:right;
	margin:8px 8px 0 0;
}
.code-details{
	background:#fff;
	border:1px solid #d7d7d7;
	margin:10px;
	padding:10px;
	width:600px;
	height:610px;
	overflow:scroll;
}
.code-details h3, .code-details h4, .code-details a.copy-code{
	margin:5px 0;
	float:left;
}
.code-details h4{
	margin-bottom: 10px;
}
.code-details pre, .code-details h3, .code-details h4{
	clear:left;
}
.code-details a.copy-code{
	margin-left:10px;
	font-size: 90%;
}

/*Test Links*/
#test-links{
	padding:10px;
	clear:both;
}

/*Generated Content*/
h2.chapter{
	font-size:12px;
	counter-increment: chapter;
	/* reset the section counter at every new chapter */
	counter-reset: section; 
}
h2.chapter:before{
	content: "Chapter " counter(chapter) " - ";
}
h3.section{
	margin-bottom:0;
	font-size:12px;
	counter-increment: section;
}
h3.section:before{
	content: "Section " counter(section) ": ";
}
q{
	quotes: '" "';
}
