@charset "utf-8";
/* CSS Document for Benson Cars */

body {
	margin: 0;
	padding: 0;
	background: url(images/body-background.jpg) center top no-repeat #000;
	text-align: center;
	font-family: Arial, Helvetica, sans-serif;
}

* {margin: 0; padding: 0; border: 0}

a,a:active,a:visited,a:focus{ outline: none; }

div#entrancepage			{ width: 100%; height: 100%; position: fixed; left: 0; top: 0; z-index: 10000; display: block; overflow: hidden; background: url(images/entrancepage-bg.jpg) center top no-repeat #222222; }
div#entrancepage a			{ width: 71px; height: 25px; display: block; text-indent: -9999px; overflow: hidden; background: url(../images/splash-page-button.jpg) top; margin: 345px auto 0 auto; }
div#entrancepage a:hover	{ background-position: bottom; }

div#container {
	position: relative;
	z-index: 1;
	margin: 0 auto;
	padding: 0; 
	width: 970px;
	background: #0f0f0f
}
	
div#top {
	width: 970px;
	height: 128px;
	background:url(images/top-background.jpg) 0 0 no-repeat
}
	
div#imageback-and-speedo {	
	position: relative;
	z-index: 2;
	width: 970px;
	height: 250px;
	background: url(images/imageback-and-speedo.jpg) 0 0 no-repeat transparent
}

div#main-image {
	position: absolute;
	margin: 0; 
	padding: 0;
	left: 0;
	top: 35px;
	z-index: 10
}

div#main-image img {margin: 0; padding: 0}

div#main-nav {
	position: absolute; 
	top: 30px; 
	right: 0; 
	z-index: 100;
	width: 500px; 
	height: 370px;  
}

img#bee {position: absolute; left: 228px; top: 235px; z-index: 100000}

div#needle-area
{font-size: 1px; color: #404040}


/* ----------------------------------- CURRENT NEEDLE POSITION -------------------------------------- */
div#needle img, div#needle-stock img, div#needle-about-us img, div#needle-finance img, div#needle-warranty img, div#needle-find-us img, div#needle-vehicle-sourcing img, div#needle-our-hours img, div#needle-contact-us img
{			margin: 0; 
			padding: 0;
 			position: absolute; 
			left: 132px; 
			top: 79px; 
			width: 218px; 
			height: 218px;
			}

/* ------------- NEEDLE CURRENT STATES ------------ */			
body#body-home div#needle img,
body#body-stock div#needle-stock img,
body#body-about-us div#needle-about-us img,
body#body-finance div#needle-finance img,
body#body-warranty div#needle-warranty img,
body#body-find-us div#needle-find-us img,
body#body-vehicle-sourcing div#needle-vehicle-sourcing img,
body#body-our-hours div#needle-our-hours img,
body#body-contact-us div#needle-contact-us img
{z-index: 1000; display: block}

div#content {
	width: 100%;
	background: url(images/content-back.jpg) left top no-repeat;
	overflow: hidden
}

div#left-col {
	float: left;
	width: 540px;
	overflow: hidden
}

div#left-col-large {
	float: left;
	width: 710px;
	overflow: hidden
}


div#right-col {
	float: right;
	width: 430px;
	overflow: hidden
}

div#right-col-small {
	float: right;
	width: 260px;
	overflow: hidden
}

div#search-cars {
	position: relative;
	width: 394px;
	height: 379px;
	background: url(images/search-background.jpg) 0 0 no-repeat
}

div#search-cars-small {
	position: relative;
	width: 230px;
	height: 220px;
	background: url(images/search-background-small.gif) 0 0 no-repeat
}

div#bottom-nav {
	position: relative;
	clear: both;
	width: 100%;
	height: 45px;
	background: url(images/bottom-background.gif) 0 bottom no-repeat
}

div#logoscroller {
	position: absolute;
	right: 10px;
	top: 0;
	width: 115px;
	height: 380px;
}


/* ---------------------------------------------- TYPOGRAPHY ---------------------------------------------------- */
#top a {position: absolute; left: 10px; top: 16px; display: block; margin: 0; padding: 0}
#top a span {display: none}
#top a img {border: 0}
h1, h2, h3, h4, h5 {margin: 10px 20px; font-family: Arial, Helvetica, sans-serif; font-weight: normal; text-align: left}
h4, h5 {font-weight: bold}

h1 {margin: 0 20px; font-size: 1.65em; color: #eee}
h2 {margin-top: 5px; font-size: 1.10em; color: #afaeae; border-bottom: 1px solid #333}
div#search-cars h2, div#search-cars-small h2 {border: 0; color: #fff; margin-top: 15px; float: left; clear: both; }
div#search-cars a#view-all-stock {display: block; position: absolute; left: 20px; top: 330px; color: #000; background: #ffbf00; border: 1px solid #000; width: 120px; height: 20px; line-height: 20px; font-size: 11px; text-decoration:none; text-transform:uppercase}

ul, ol {margin: 10px 20px; font-size: 0.75em}
a {text-decoration: none; color: #ffbf00}
a:hover {color: #f4240f}

p#address, p#contact-details {position: absolute; left: 10px; top: 83px; margin: 0; padding: 0; font-size: 11px; color: #dadada}
p#contact-details {position: absolute; left: 10px; top: 100px}

p {margin: 10px 20px; color: #eee; line-height: 1.4; font-size: 0.75em; text-align: left}

table.content-table {margin: 10px 20px 20px 20px; padding: 7px 11px; background: #222; border: 1px solid #444; color: #eee; line-height: 1.4; font-size: 0.75em; text-align: left; width: 500px;}

iframe {margin: 0 85px 0 20px}


/* ---------------------------------------------- MAIN NAV ---------------------------------------------------- */
div#main-nav ul {margin: 0; padding: 0; display: block; width: 500px; height: 370px; position: relative}
div#main-nav ul li {display: block; text-align: center; z-index: 10000}
div#main-nav ul li#home {position: absolute; left: 62px; top: 267px}
div#main-nav ul li#stock {position: absolute; left: -4px; top: 207px}
div#main-nav ul li#about-us {position: absolute; left: -3px; top: 144px}
div#main-nav ul li#finance {position: absolute; left: 28px; top: 70px}
div#main-nav ul li#warranty {position: absolute; left: 102px; top: 5px}
div#main-nav ul li#find-us {position: absolute; left: 250px; top: 0px}
div#main-nav ul li#vehicle-sourcing {position: absolute; left: 352px; top: 40px}
div#main-nav ul li#our-hours {position: absolute; left: 380px; top: 157px}
div#main-nav ul li#contact-us {position: absolute; left: 350px; top: 255px}

div#main-nav ul li a {display: block; color: #fff; font-weight: bold; font-size: 0.90em; text-decoration: none;  text-transform:uppercase; padding: 20px;}
div#main-nav ul li a:hover {color: #ffbf00}

/* VIEW STOCK */
a#view-stock-light {margin: 0; padding: 0; display: block; position: absolute; left: 207px; top: 279px; z-index: 10000; width: 69px; height: 23px; background-image: url(images/view-stock.gif); background-position: left top; background-repeat: no-repeat}
a#view-stock-light:hover {background-position: left bottom}
a#view-stock-light span {display: none}

/* ---------------------------------------------- BOTTOM NAV ---------------------------------------------------- */
div#bottom-nav ul {margin: 0 0 0 20px; padding: 0; text-align: left}
div#bottom-nav ul li {margin: 0; padding: 0; display: inline; color: #444}
div#bottom-nav ul li a {margin: 0; padding: 0 6px 0 3px; display: inline; color: #aaa; font-size: 0.80em; text-transform:uppercase}
div#bottom-nav ul li a:hover {color: #ffbf00}

a#ukwebsites {position: absolute; left: 22px; top: 19px; color: #aaa; font-size: 10px; text-transform: uppercase; text-align:left}
a#ukwebsites:hover {color: #ffbf00}
#reg {
	font-size: 10px;
	color: #999999;
	text-align: left;
	width: 900px;
	padding: 10px 0 15px 0;
	margin: 0 auto;
}

#map		{ width: 600px; height: 500px; margin: 20px; }
#map iframe	{ width: 600px; height: 500px; }

