@charset "UTF-8";
/* CSS Document */

body  {
	background-color:#FFF;
	background-image:url(images/body.jpg);
	background-position:left;
	background-repeat:repeat-y; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
	margin-left: 0px;
	font-family:Arial, Helvetica, sans-serif;
	font-size: 100%;
	margin-top: 0;
	margin-right: 0;
	margin-bottom: 0;
	text-decoration: none;
}

.bodytop-repeatx  {
	width:100%;
	background-image:url(images/bodyrepeatx.jpg);
	background-position:top;
	background-repeat:repeat-x;
	
}
.bodytop-topleft {
	width: 1176px;
	height:19px;
	background-image:url(images/bodytopleft.jpg);
	background-position: 108px;
	background-repeat:no-repeat;				  
}

.container { 
	background: #FFFFFF;
	width:100%;
	margin-left: 108px;
	margin-right:108px;
	
	text-align: left; /* this overrides the text-align: center on the body element. */
} 

.header {
	background-image:url(images/header.jpg);
	background-position:left;
	background-repeat:no-repeat;
	height:200px;
	padding-left: 400px;
}

.sidebarleft {
	width: 200px;
	float:left;
	padding: 12px 10px 10px 10px;
	
	
}

.sidebarleft  h3{
	color:#efb908;
	font: Arial, Helvetica, sans-serif;
	font-size:16px;
	font-variant:small-caps;
	padding-bottom: 4px;
	
	
}

.maincontent {
	float:left;
	width:840px;
	background-image:url(images/tiretrack-bg.jpg);
	background-position:top;
	background-repeat:no-repeat;
	padding: 12px 10px 10px 10px;
}
.maincontent h3 {
	font-variant: small-caps;
	color: #C00;
}

.maincontent h1{
	font-size:24px;
}



.submaincontent {
	float:left;
	width:1040px;
	background-image:url(images/tiretrack-bg.jpg);
	background-position:top;
	background-repeat:no-repeat;
	padding: 04px 10px 10px 10px;
}

/*====== list with tires images for bullets =========*/
.maincontent ul
{
list-style-type: none;
padding: 0;
margin: 0;
}

.maincontent li
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
height:42px;
background-image: url(images/tire-very-small.gif);
background-repeat: no-repeat;
background-position: 0 0;
padding-left: 34px;
padding-bottom: 10px;
}

.submaincontent ul
{
list-style-type: none;
padding: 8px;
margin-left: 400px;
}

.submaincontent li
{
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
height:42px;
background-image: url(images/tire-very-small.gif);
background-repeat: no-repeat;
background-position: 0 0;
padding-left: 34px;
padding-bottom: 10px;
}

 ========= 


.submaincontent h2 {
	font-size:20px;
	color:#333;
	font-variant: small-caps;
	font-weight:bold;
	font-family:Arial, Helvetica, sans-serif;
}
.submaincontent h1 {
	font-size: 18px;
	font-weight: bold;
	font-variant: small-caps;
	color: #000;
}

.submaincontent h3 {
	font-size:16px;
	color:#C00;
	font-variant: small-caps;
	font-weight:bold;
}





.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;
}

.footer {
	padding: 0 10px;
	text-align: center;
	width:1000px;
}
.footer h3 {
	text-align:center;
	font-family:Arial, Helvetica, sans-serif;
	font-variant:small-caps;
	font-size:18px;
	color:#666;	
}

.note {  
	font:Georgia, "Times New Roman", Times, serif;
	font-size:14px;
	font-style:italic;
	color:#999;
	margin-left:8px;
}

.maincontent p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
}

.submaincontent p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
}


.bodytop-repeatx .container .submaincontent p .red {
	color: #F00;
}

/*========Question Def List==============*/

dl.question
{
margin: 12px 0;
padding: 0;
font-family:"Arial", san-serif;
}

.question dt
{
position: relative;
left: 0;
top: 6px;
width: 700px;
margin: 10PX;
padding: 6px;
font-weight: bold;
font-size: 16px;
font-variant:small-caps;
color: #163348;
}

.question dd
{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
border-left: 1px solid  #1b3c75;
margin: 0px 0px 0px 100px;
padding: 3px 3px;
}

 FORM ============= 

.form{
padding: 5px;
}

div.fieldwrapper{ /*field row DIV (includes two columns- Styled label column and 'thefield' column)*/
margin-left:100px;
width: 700px; /*width of form rows*/
overflow: hidden;
padding: 5px 0;
}

div.fieldwrapper label.styled{ /* label elements that should be styled (left column within fieldwrapper DIV) */
float: left;
width: 250px; /*width of label (left column)*/
font-variant:small-caps;
border-bottom: 1px solid red;
margin-right: 15px; /*spacing with right column*/
font-family:Arial, Helvetica, sans-serif;
font-size:14px;
color: #333;

}

div.fieldwrapper div.thefield{ /* DIV that wraps around the actual form fields (right column within fieldwrapper DIV) */
float: left;
margin-bottom: 10px; /* space following the field */
}
div.thefield ul{
	margin-left:8px;
}
div.thefield li{
	font-size:14px;
}

div.fieldwrapper div.thefield input[type="text"]{ /* style for INPUT type="text" fields. Has no effect in IE7 or below! */
width: 250px;
}

div.fieldwrapper div.thefield textarea{ /* style for TEXTAREA fields. */
width: 400px;
height: 150px;
}

div.buttonsdiv{ /*div that wraps around the submit/reset buttons*/
margin-top: 5px; /*space above buttonsdiv*/
}

div.buttonsdiv input{ /* style for INPUT fields within 'buttonsdiv'. Assumed to be form buttons. */
width: 100px;
background: #e1dfe0;
}

.redtext {
	padding-left:60px;
color:#C30;
font-size:20px;
font-variant:small-caps;
}

.gallery { background:url(../images/bg_nav_right.jpg) right top no-repeat; padding:0 4px 10px 0; margin: 0; }
.gallery ul {
	margin:0;
	padding:0;
	background:#960000 url(../images/bg_nav.jpg) left top repeat-x;
	list-style:none;
	position:relative;
	height:36px;
	background-color: #F2D076;
	background-image: url(images/bg_nav.jpg);
}
.gallery li {
	background-image:none;
}

.gallery ul li { 
	display:block; 
	width:auto; 
	float:left; 
	color:#666; 
	height:36px; 
	list-style:none;
	padding:8px 1.3em 8px 1em;
	font-family: Verdana, sans-serif;
	font-size: .8em;
	}
	
.gallery ul li a {
	display:block;
	width:auto;
	color:#666;
	text-decoration:none;
	padding:8px 1.3em 8px 1em;
	/*background:url(../images/nav_arrow.jpg) right 0 no-repeat;*/
	font-family: Verdana, sans-serif;
	font-size: 1em;
}
.gallery ul li a:hover {
	text-decoration:underline;
	/*background:url(../images/nav_arrow.jpg) right -36px no-repeat;*/
	color: #000;
}
.gallery ul li.first { background:url(../images/bg_nav_left.jpg) left top no-repeat; }

.gallery ul li ul { display:none; position:absolute; top:34px; background:#fff url(../images/bg_nav.jpg) left -34px repeat-x; height:auto; border-bottom:6px solid #cc0000; border-left:1px solid #cc0000; border-right:1px solid #cc0000; width:95%; left:2%; padding:8px 5px 15px 5px; }
.gallery ul li:hover ul,
.gallery ul li.over ul { display:block; }
.gallery ul li ul li { display:inline; float:none; background-image:none; height:auto; }
.gallery ul li ul li a { background-image:none; margin:8px; padding:2px; position:relative; border:1px solid #960000; float:left; display:block; width:75px; height:50px; background-color:#fff; }
.gallery ul li ul li a:hover { background-image:none; z-index:2; }
.gallery ul li ul li a img { position:absolute; top:2px; width:75px; height:50px; border:0; margin:0; padding:0; }
.gallery ul li a:hover img,
.gallery ul li a:active img,
.gallery ul li a:focus img { width:100px; height:75px; left:-11px; top:-10px; z-index:1; border:1px solid #000; }
.gallery ul li.overview { display:block; clear:both; padding:5px 10px 0 10px; color:#000; }


#gallery1 ul { z-index:2; }
#gallery2 ul { z-index:1; }