/* Falfield Cars 2006 CSS Layout 
   Webbits Design - Somerset / Warwickshire
*/
body {  
min-height: 100%; height: 100%;
font: 70% "Lucida Grande", Verdana, Arial, sans-serif; 
margin: 0; 
padding: 0; 
color: #333; 
background: #FFF url(/resources/img/bg.jpg) repeat; 
}
p {
font-family: "Lucida Grande", Verdana, Arial, sans-serif; 
font-size:small;
padding: 0 5px 10px 10px;
color: #000;
} 
p.description {
_height:75px;
min-height:75px;
}
p.form {
/* DO I NEED THIS
font-family: "Lucida Grande", Verdana, Arial, sans-serif; 
font-size:small;
color: #000; */
} 
p.parent {padding: 0px 400px 0 10px;/*Right padding is important to keep text in shape i.e. no wrap around right div */}
.logo {visibility: hidden;}

h1, h2, h3, h4, h5, h6 {
	font-family: "Lucida Grande","Verdana", "Arial", sans-serif; 
	font-weight: normal;
	padding: 0 0 0 0px;	
	margin-bottom: 0.5em;
}
h1 {font-size: 164%; line-height: 1.3em;}
h1.titles {	padding: 0 0 0 10px; color: #D6550F;}
h2 {font-size: 124%; line-height: 1.3em;}
.car-title {padding: 0 0 0 10px; color: #D6550F;}
.sold {padding: 0 0 0 10px; color: #CC0000;}
h2.vehicleTitle {padding: 10px 0 0 10px;}
h2.vehiclePrice {padding: 10px 0 0 50px;}
h3 {font-size: 145%; line-height: 1.3em; padding: 0.5em 0 0 10px;}
h4 {font-size: 118%; line-height: 1.3em;}

a{text-decoration: none; outline: none;	}  
/* Good browsers */
div#content { min-height: 1000px; }
#clear { clear:both; }
#indexContainer { 
float:left;
width: 800px; 
background-color: #fff;
margin:0;
background-image:url(../resources/img/index_bg.jpg);
}
#locationContainer { 
float:left;
width: 800px; 
background-color: #fff;
margin:0;
background-image:url(/resources/img/location_bg.jpg);
}
#container { float:left; width: 800px; background-color: #fff; margin:0; }
#banner {
width: 800px;
_height: 155px;
min-height: 155px;
margin:0;
padding:0;
background-color: #fff;
background-image:url(/resources/img/affordablecars.jpg);
background-repeat:no-repeat;
}
#header { 
width: 800px;
_height:73px;
min-height:73px;
margin:0;
padding:0;
background-color: #fff;
background-image:url(/resources/img/detailpage/d_title.jpg);
}
#vehicleTitle {float:left; width: 700px; padding-top: 20px;}
#vehiclePrice {float:left; width: 100px; padding-top: 20px;}
#parent {
float:left;
width: 800px; /*Important to stop the float wandering off! */
_height: 400px; /* Set the minimum height, the box can grow but not shrink used _ for internet explorer filter only. */
min-height: 400px; /* 361px; Firefox et al require min-height to be applied - happy days :) */
background-image:url(/resources/img/detailpage/d_bg.jpg); 
background-repeat: repeat-y;
}
/* Container Styles */
#contact {
float:left;
width:800px;
height:0px;
overflow:hidden;
background-color: #fff;
background-image:url(/resources/img/dropdown_bg.jpg);
background-repeat: repeat-x;
} 
#slideshow {
_height: 361px; /* Set the minimum height, the box can grow but not shrink used asterisk for internet explorer filter only. */
min-height: 361px; /* 361px; Firefox et al require min-height to be applied - happy days :) */
margin-right: 17px;  /*17px Firefox uses this one and ignores the 2nd one */
_margin-right: 9px; /* 9px IE 6 uses this one and ignores the 1st one*/
margin-left:0;
float: right;
width: 351px;
background-image:url(/resources/img/detailpage/d_slideshow.jpg);
}
#maps {
_height: 361px; /* Set the minimum height, the box can grow but not shrink used asterisk for internet explorer filter only. */
min-height: 361px; /* 361px; Firefox et al require min-height to be applied - happy days :) */
margin-right: 30px;  /*17px Firefox uses this one and ignores the 2nd one */
_margin-right: 0px; /* 9px IE 6 uses this one and ignores the 1st one*/
margin-left:0;
float: right;
width: 351px;
}
#location { 
float:left;
width: 800px; 
margin:0;
}
#map1 {
position: relative;
margin-right: 33px;   
_margin-right: 18px; 
margin-top: 30px;
float: right;
}
#map2 {
position: relative;
margin-right: 33px;  
_margin-right: 18px; 
margin-top: 30px;
margin-bottom: 30px;
float: right;
}
#locationTitle {
float:left; 
width: 400px;
}
#locationParent {
float:left;
width: 800px; /*Important to stop the float wandering off! */
_height: 400px; /* Set the minimum height, the box can grow but not shrink used _ for internet explorer filter only. */
min-height: 400px; /* 361px; Firefox et al require min-height to be applied - happy days :) */
}
#directions {
float:left; 
/*width: 800px;*/
}
p.directions {
padding: 0px 465px 0 10px;/*Right padding is important to keep text in shape i.e. no wrap around right div */
}
#slides {
position: relative;
margin-right: 23px;  /*17px Firefox uses this one and ignores the 2nd one */
_margin-right: 11px; /* 9px IE 6 uses this one and ignores the 1st one*/
margin-top: 83px;
float: right;
}
#largephotos {
width: 800px;
_height: 121px; /* Set the minimum height, the box can grow but not shrink used asterisk for internet explorer filter only. */
min-height: 121px; /* 361px; Firefox et al require min-height to be applied - happy days :) */
margin:0;
padding:0;
background-image:url(/resources/img/detailpage/d_superthumbs.jpg);
}
#superphoto { 
width: 800px;
_height: 523px; /* Set the minimum height, the box can grow but not shrink used asterisk for internet explorer filter only. */
min-height: 523px; /* 361px; Firefox et al require min-height to be applied - happy days :) */
margin:0;
padding:0;
background-image:url(/resources/img/detailpage/d_largebg.jpg);
}
#super {
position: relative;
margin-left: 54px;  /*17px Firefox uses this one and ignores the 2nd one */
_margin-left: 28px; /* 9px IE 6 uses this one and ignores the 1st one*/
margin-top: 30px;
float: left;
}
#superOne {
position: relative;
margin-left: 21px;  /*17px Firefox uses this one and ignores the 2nd one */
_margin-left: 11px; /* 9px IE 6 uses this one and ignores the 1st one*/
margin-top: 12px;
float: left;
/*border:1px solid #000; */
}
#superTwo {
position: relative;
margin-left: 27px;  /*17px Firefox uses this one and ignores the 2nd one */
_margin-left: 28px; /* 9px IE 6 uses this one and ignores the 1st one*/
margin-top: 12px;
float: left;
/*border:1px solid #000; */
}
#superThree {
position: relative;
margin-left: 27px;  /*17px Firefox uses this one and ignores the 2nd one */
_margin-left: 28px; /* 9px IE 6 uses this one and ignores the 1st one*/
margin-top: 12px;
float: left;
/*border:1px solid #000; */
}
#superFour {
position: relative;
margin-left: 27px;  /*17px Firefox uses this one and ignores the 2nd one */
_margin-left: 28px; /* 9px IE 6 uses this one and ignores the 1st one*/
margin-top: 11px;
float: left;
/*border:1px solid #000; */
}
#friend{
float:left;
_float:none; /*IE Breaks without floating this hidden div with none. */
width:800px;
height:0px;
overflow:hidden;
z-index:1;
background-image:url(/resources/img/dropdown_bg.jpg);
background-repeat: repeat-x;
} 
#enquire {
float:left;
width:800px;
height:0px;
overflow:hidden;
z-index:2;
background-image:url(/resources/img/dropdown_bg.jpg);
background-repeat: repeat-x;
} 
#footer {
float:left;
width: 800px; 
color: #fff;
border-top: 1px solid #999; 
background-color: #fff; 
}
#descriptionOne {
float:left; 
width: 800px;
_height:20px;
min-height:20px;
}
#left-col { width: 250px; float: left; padding: 0px; color: #777;}
#col-1  { width: 510px; float: right; padding: 5px; color: #000; }
#col-2  { width: 510px; float: right; padding: 5px; color: #000; }
#col-3  { width: 510px; float: right; padding: 5px; color: #000; }
#col-4  { width: 510px; float: right; padding: 5px; color: #000; }
#col-5  { width: 510px; float: right; padding: 5px; color: #000; }
#col-6  { width: 510px; float: right; padding: 5px; color: #000; }
#col-7  { width: 510px; float: right; padding: 5px; color: #000; }
/* Only requires 7 vehicles per page.
#col-8  { width: 510px; float: right; padding: 5px; color: #000;  }
#col-9  { width: 510px; float: right; padding: 5px; color: #000; }
#col-10 { width: 510px; float: right; padding: 5px; color: #000;  }
*/
#vehicle-left { float: left; width: 210px;  padding-right: 5px; color: #000;}
#vehicle-description { float: right; width: 280px; padding-left: 0px; }
#clear { clear:both; }
#moreDetails {padding: 0 0 0 10px; float:left; width: 100px;}
#vehicleSimilar {float:right; width: 100px;}
#clearSearch {float:right; width: 160px;}
#vehicle-description span.price {
font-size: 124%;
padding-left: 10px;
padding-right: 90px;
margin: 3px;
line-height: 4.0em;
}
#vehicle-description a {color: #404A2E; font-size: 124%; line-height: 1.3em;}
#vehicle-description a:hover {color: #D6550F; font-size: 124%; line-height: 1.3em;}	
fieldset {margin: 1em 0;  padding: 1em; border: solid 0 transparent;}
legend {font-weight:bold; color:#fff;}
label {
width: 23em;
float: left;
text-align: right;
margin-right: 0.5em;
display: block;
color: #fff;
}
textarea {
width: 300px;
height: 80px;
font-family: "Lucida Grande", Verdana, Arial, sans-serif; 
font-size:small;
color: #000;
}
input.typebox {
width: 300px;
font-family: "Lucida Grande", Verdana, Arial, sans-serif; 
font-size:small;
color: #000;
}
input:focus, textarea:focus {background: #3C4D21;}
input[type="text"], textarea {
border-top: 2px solid #999;
border-left: 2px solid #999;
border-bottom: 1px solid #ccc;
border-right: 1px solid #ccc;
}
input.submit{
color: #000;
background: #DE5214;
border: 2px outset #d7b9c9
width: 150px;
}
.required {font-size: 0.75em; color:#DE5214;}
.vehicle-photo p {
 margin: 0 0 1px -10px;
_margin: 0 0px 1.2em -3px; /*Another IE Hack not pretty */
padding: 0;
}
.vehicle-photo p a img {
padding: 11px;
background: transparent url(/resources/img/photo_bg_std.jpg) no-repeat;
border: none;
}
.vehicle-photo p a:hover img { 
background: transparent url(/resources/img/photo_bg_dk.jpg) no-repeat;
border: none;
}
/*MENU SYSTEM */
#menu { float: left; background-color: #fff;}
ul {
margin:0;
padding:0;
list-style: none;
width: 800px;
float: left; 
background: #0F1A00 url(/resources/img/menu_bg.jpg) repeat-x;
}
ul li { float: left;}
ul a {
display: block; 
float:left; /*Keep Macs Happy*/
padding: 0 2em;
line-height: 2.1em;
background: url(/resources/img/menu_divider.jpg) repeat-y left top;
text-decoration: none;
color:#fff;
cursor:pointer;
}
ul .spacer {
display: block; 
float:left; /*Keep Macs Happy*/
padding: 0 2em;
line-height: 2.1em;
background: url(/resources/img/menu_divider.jpg) repeat-y left top;
width: 130px;
}
ul .location {
display: block; 
float:left; /*Keep Macs Happy*/
padding: 0 2em;
line-height: 2.1em;
background: url(/resources/img/menu_divider.jpg) repeat-y left top;
width: 370px;
}
ul .indexSpacer {
display: block; 
float:left; /*Keep Macs Happy*/
padding: 0 2em;
line-height: 2.1em;
background: url(/resources/img/menu_divider.jpg) repeat-y left top;
width: 190px;
}
ul .baseSpacer {
display: block; 
float:left; /*Keep Macs Happy*/
padding: 0 2em;
line-height: 2.1em;
background: url(../resources/img/menu_divider.jpg) repeat-y left top;
width: 430px;
}
ul .first a { background: none; }
ul a:hover {color:#336600;}