@charset "utf-8";

/* CSS Document */

/*---------------------------------------------
	Brookfield Commercials by nwonline.co.uk
	Author: Matt Litherland
	Copyright © 2010
----------------------------------------------*/

html, body {
	width: 100%;
	margin: 0;
	padding: 0;
	background: #00437b url('../img/bg_body.jpg') 0 0 repeat-x;
	font-family: "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, sans-serif;
	line-height: 20px;
	font-size: 12px;
	text-align:center }

body #wrapper { height: auto; min-height: 100%;}
#page_wrapper { background: #FFF; width: 980px; margin: 0 auto; padding-bottom: 10px; text-align: left;}

#footer { position: relative; margin: 0 auto; height: 48px; clear:both; width: 960px; display: block;}

#header { margin: 0; padding: 0; background-image: url('../img/HEADER.jpg'); width: 980px; height: 150px; }

	
/*Typography*/
a:link { color: #0d59b9; text-decoration: none}
a:hover { color: #C00; text-decoration: none}
a:active { color: #900; text-decoration: none}

h2 { color: #036; font-weight: bold;}
h3 { color: #06F; font: bold 12px/16px sans-serif #36C;}
h5 { color: #1a1a1a; font: bold 12px/24px sans-serif;}

address { color: #4a4a4a; font: normal italic 12px/18px 'Arial', Helvetica, sans-serif; margin: 10px 0 0 0}

.button { float: left; position: relative; margin: 5px 10px; font-family: Arial, sans-serif; font-size: 12px; font-weight: bold; padding: 4px 8px; cursor: pointer; text-decoration: none;}
.button:active { top: 1px; left: 1px;}
.button.blue { background: #0f5ac2; color: #fff; border-left: 1px solid #92cefc; border-top: 1px solid #92cefc; border-right: 1px solid #3f4c03; border-bottom: 1px solid #3f4c03;}
.button.green { background: #91ad0c url('../img/button_green.jpg') 0 0 repeat-x; color: #0b0b0b; border-left: 1px solid #ff0; border-top: 1px solid #ff0; border-right: 1px solid #848484; border-bottom: 1px solid #848484;}
a.back { padding: 4px 8px; background: url('../img/nav_tile.jpg') 0 0 repeat-x; color: #fff; font: normal 11px/20px sans-serif; text-decoration: none; float: right; position: relative;}
a.back:hover { color: #1a1a1a;}
a.back:active { left: 1px; top: 1px;}


div#maincol { margin-left: 10px; }

h1 { font: bold 21px/40px 'Helvetica', sans-serif; color: #06C; letter-spacing: -1px }
div#maincol h1 { font: bold 21px/40px 'Helvetica', sans-serif; color: #06C; letter-spacing: -1px}
div#maincol p { color: #666;}
div#maincol p em { font-style: italic;}
div#maincol p strong, div#maincol p b { font-weight: bold;}
div#maincol blockquote { font-style: italic; border-left: 2px solid #c00; padding: 10px; margin: 10px 50px; display: block; color: #666;}



/*Members Area*/
div#maincol div.ma_panel { width: 320px; float: left; margin: 0 0 10px 0; padding: 10px;}

div#maincol div.ma_panel.ex label { display: none;}
div#maincol div.ma_panel.ex input[type=text]{ float: left; clear: both; padding: 6px 4px; font-size: 12px; color: #ccc; border: 1px solid #ccc; color: #4c4c4c; width: 187px; background: #eee;}
div#maincol div.ma_panel.ex input[type=password]{ float: left; clear: both; padding: 6px 4px; font-size: 12px; color: #ccc; border: 1px solid #ccc; color: #4c4c4c; width: 187px; background: #eee}
div#maincol div.ma_panel.ex div { float: left; clear: both; padding: 0 0 3px 0 }
div#maincol div.ma_panel.ex div .button { margin: 5px 10px 5px 0;}

.btns { width: 61px !important; text-align: center;}
.btnr { width: 126px !important; clear: right;}

/*Header*/
div#head_wrap { width: 980px; height: 192px; margin: 0 auto; padding: 0; position: relative; display: block;}

/*Header GI*/
div#logo a { width: 487px; height: 80px; float: left; position: relative; text-indent: -9999px; background: url('../img/logo.jpg') 0 0 no-repeat;}
div#tel { width: 255px; height: 83px; float: left; position: relative; margin: 0; text-indent: -9999px; background: url('../img/tel.jpg') 0 0 no-repeat; left: 10px; top: 20px;}
div#cars { width: 184px; height: 92px; position: absolute; display: block; background: url('../img/address.jpg') 0 0 no-repeat; right: 3px; top: 30px;}

/*Top Navigation*/
ul#nav { width: 965px; height: 42px; float: left; clear: both; padding: 0 8px; background: #d7d7d7 url('../img/nav_tile.jpg') 0 0 repeat-x;}
ul#nav li { float: left; display: inline; position: relative; margin: 0 2px;}
ul#nav li a { float: left; display: inline; position: relative; padding: 0 7px; font: bold 12px/42px sans-serif; color: #fff; text-decoration: none; text-shadow: 1px 1px 1px #113868;}
ul#nav li a:hover { color: #8fbee7; text-shadow: none}
ul#nav li a:active { left: 1px; top: 1px;}
ul#nav li a.current { color: #1a1a1a; left: 0; background: #fff url('../img/nav_current.jpg') 0 0 repeat-x; top: 5px; height: 37px; text-shadow: none !important}

/*Layout*/
div#index_wrap { width: 960px; margin: 0 auto; padding: 10px 0 10px 0; position: relative; display: block; overflow: hidden; clear: both;}

/*Main Col*/
div#maincol{ width: 707px; float: left; padding: 0 0 10px 12px;}

div#pheader { float: left; width: 704px;}
div#pheader h1 { font: bold 21px/30px 'Helvetica', sans-serif; color: #06C; letter-spacing: -1px;}
div#pheader span.detail_price { font: bold 21px/30px 'Helvetica', sans-serif; color: #036; letter-spacing: -1px;}
div#pcost { float: right; width: 200px; font: bold 21px/40px 'Helvetica', sans-serif; color: #0d59b9; letter-spacing: -1px; text-align: right;}



/*Left Column*/
div#leftcol { width: 240px; float: left; position: relative; padding: 0; margin: 0 0 10px 0;}
div#leftcol h2 { font: bold 20px/30px 'Helvetica', Arial, sans-serif; letter-spacing: -1px; display: block; border-bottom: 1px dotted #7a7a7a; margin: 0 0 10px 0;}


/*Leftcol Homepage*/
div.leftcol_home { width: 222px; float: left; padding: 15px 10px; background: #114483 url('../img/fader_blue.jpg') 0 0 repeat-x; min-height: 190px; margin: 0 0 20px 0;}
div#leftcol div.leftcol_home h2 { color: #fff; border-bottom: 1px dotted #000;}
div#leftcol div.leftcol_home .form select { border: 1px solid #006;}
div#leftcol div.leftcol_home .form input[type=submit] { background: #f8f8f8 url('../img/fader_silver.jpg') 0 0 repeat-x; font-weight: bold; color: #1a1a1a; border: 1px solid #fff; padding: 4px 8px; cursor: pointer; text-shadow: 1px 1px 1px #fff;}
div#leftcol div.leftcol_home .form div.short label { color: #CFF;}


/*Sections*/

div#carsearch { width: 220px; float: left; position: relative; padding: 15px 10px; background: #fff url('../img/bg_leftcol.jpg') 0 0 repeat-x; border: 1px solid #d7d7d7; margin: 0 0 10px 0;}
div#carsearch ul { float: left; width: 220px; position: relative; clear: both; padding: 10px 0 20px 0;}
div#carsearch ul li { float: left; display: inline; width: 60px; height: 60px; text-align: center; position: relative; padding: 2px;}
div#carsearch ul li img { position: absolute; top: 50%; left: 50%; width: 55px; margin-top: -20px; margin-left: -20px;} 



div#finance { width: 220px; float: left; position: relative; padding: 15px 10px; background: #fff url('../img/bg_leftcol.jpg') 0 0 repeat-x; border: 1px solid #d7d7d7; margin: 0 0 10px 0;}
div#finance ul { width: 220px; position: relative; clear: both; padding: 0;}
div#finance ul li { display: block; text-align: center; position: relative; padding:5px;}
div#finance ul li img { margin: 0 auto; } 
div#finance p { font: normal 12px/20px sans-serif; color: #666;}


/*Middle Column*/
div#midcol { width: 700px; float: left; position: relative; padding: 0 0 0 10px;}

div#splash { width: 960px; height: 215px; margin: 0 auto 10px 0; padding: 0; float: left; }





div.arrivals { width: 686px; float: left; position: relative; overflow: hidden; padding: 10px; background: #fff url('../img/bg_leftcol.jpg') 0 0 repeat-x; border: 1px solid #d7d7d7; margin: 0 0 10px 0;}

div.arrivals ul { float: left; clear: both; position: relative; padding: 10px 0 10px 0; width: 682px; background: transparent;}
div.arrivals ul li { float: left; display: inline; display: inline-block; width: 135px; padding: 0 0 10px 0; text-align: center;}	
div.arrivals ul li a img { display: block; width: 125px; margin: 0 auto; border: 3px solid #fff;}
div.arrivals ul li a { float: left; display: inline; width: 135px; color: #1a1a1a; text-decoration: none;}
div.arrivals ul li a:hover span { color: #06F;}
div.arrivals ul li a:hover img { border: 3px solid #00427c;}
div.arrivals ul li span { color: #1a1a1a; font: normal 11px/18px 'Tahoma', sans-serif; margin: 0; padding:10px 0;}

div.arrivals p { font: normal 12px/20px sans-serif; color: #666;}

div.arrivals ul#three_col li { width: 227px;}	
div.arrivals ul#three_col li a img { width: 221px;}
div.arrivals ul#three_col li a { width: 227px;}


/*	Home Page Text	*/

div.introduction { width: 686px; float: left; position: relative; overflow: hidden; padding: 10px; background: #fff url('../img/bg_leftcol.jpg') 0 0 repeat-x; border: 1px solid #d7d7d7; margin: 0 0 10px 0;}

div.introduction ul { clear: both; padding: 0 0 10px 0; background: transparent;}
div.introduction ul li { display: block; display: block; width: 300px; margin-left: 25px; line-height: 20px; font: normal 12px/20px sans-serif; color: #666; list-style-type:square;}	

div.introduction p { font: normal 12px/20px sans-serif; color: #666;}



/*Footer*/
div#footer_container { width: 938px; display: block; margin: 0; overflow: hidden; position: relative; bottom: 0; padding: 0 10px; background: #fff url('../img/bg_leftcol.jpg') 0 0 repeat-x; border: 1px solid #d7d7d7; float: left;}
div#footer_container ul.left { float: left; position: relative; width: 400px;}
div#footer_container ul.left li { float: left; position: relative; display: inline;}
div#footer_container ul.right { float: right; position: relative; width: 400px;}
div#footer_container ul.right li { float: right; position: relative; display: inline;}
div#footer_container ul li { color: #333; font: normal 11px/48px 'Tahoma', sans-serif; margin: 0 4px;}
div#footer_container ul li a { text-decoration: none; color: #333;}
div#footer_container ul li a:hover{ color: #C00}
div#footer_container ul.left li:first-child:before { content: "";}
div#footer_container ul.left li:before { content: "-"; padding: 0 8px 0 0;}
div#footer_container ul.right li:first-child:after { content: "";}
div#footer_container ul.right li:after { content: "-"; padding: 0 0 0 8px;}


/*Components*/
div#options { width: 705px; height: 62px; float: left; position: relative;
				background: #d9d9d9 url('../img/bg_options.jpg') 0 0 repeat-x; 
				margin: 0; border: 1px solid #ddd;}
div#options p{ padding: 0; margin: 0; }

div#options ul { float: left; width: 657px; height: 42px; margin: 0; padding: 10px 10px; position: relative;}

div#options ul li { float: left; display: inline; margin: 0; 
					border-left:1px solid #9d9d9d; border-right:1px solid #fff;}

div#options ul li#opt_001 { background: url('../img/icon_opt_001.gif') 20px 7px no-repeat; border-left:none;}
div#options ul li#opt_002 { background: url('../img/icon_opt_002.gif') 20px 7px no-repeat;}
div#options ul li#opt_003 { background: url('../img/icon_opt_003.gif') 20px 7px no-repeat;}
div#options ul li#opt_004 { background: url('../img/icon_opt_004.gif') 20px 7px no-repeat; border-right:none;}

div#options ul li a { float: left; display: inline; width: 120px; height: 42px; text-align: center; padding: 0 0 0 40px; font: normal 11px/42px 'Tahoma', sans-serif; color: #333; text-decoration: none; text-shadow: 1px 1px 1px #fff;}
div#options ul li a:hover { color: #C00 }	



/*Results*/
div#results { float: left; width: 710px; margin: 0; padding: 0; position: relative;}
div#results ul { float: left; width: 707px; margin: 5px 0 0 5px; padding: 0; position: relative; border-top: 1px dotted #ccc}
div#results ul li { float: left; clear: both; width: 707px; min-height: 200px; border-bottom: 1px dotted #ccc; background: url('../img/bg_silverfade_large.jpg') 0 0 repeat-x;}

div#results ul li p { padding: 0; margin: 0; }

div#results span.imgwrap { float: left; margin: 0; padding: 4px; text-align: center; background: #fff; margin: 20px 0 0 10px; border: 1px solid #ccc;}

div#results div.mini_spec { float: left; width: 215px; padding: 10px 0 10px 10px;}
div#results div.mini_spec h3 { padding: 0; font: bold 12px/25px Arial, sans-serif; color: #666; margin: 3px 0}
div#results div.mini_spec h3 a { color: #444;}
div#results div.mini_spec div { float: left; clear: both; padding: 0;}
div#results div.mini_spec span { float: left; display: inline; color: #333; width: 85px; font: normal 11px/17px 'Tahoma', Helvetica, sans-serif}
div#results div.mini_spec span.left { width: 90px; color: #00529c }
div#results div.mini_spec span.right { width: 100px; padding: 0 10px; text-align: left; clear: right;}

div#results div.title_price { float: left; width: 465px; padding: 15px 0 10px 10px;}
div#results div.title_price span.price { float: right; font: bold 13px/22px 'Helvetica', Arial, sans-serif; color: #036; text-align: left; padding: 0}
div#results div.title_price h3 a:link { width: 300px; color: #036; font: bold 13px/22px Arial, Helvetica, sans-serif; float: left; text-decoration: none;}

div#results div.title_price h3 a:visited { width: 300px; color: #036; font: bold 13px/22px Arial, Helvetica, sans-serif; float: left; }
div#results div.title_price h3 a:visited a:hover { text-decoration: underline;}
div#results div.title_price h3 { color: #036; font: bold 13px/22px Arial, Helvetica, sans-serif;}

div#results div.options { float: left; width: 240px; text-align: left; padding: 5px; font: normal 11px/18px sans-serif;}
div#results div.options a { color: #0d59b9; font: bold 11px/20px sans-serif;}
div.options span { float: left; clear: both;}

div#results div.options ul.ticks { padding: 7px 0; margin: 0; width: 155px;background: transparent; height: 100px; border: none;}
div#results div.options ul.ticks li { padding: 0 0 0 20px; margin: 0; width: 230px; height: 20px; border: none; background: url('../img/icon_tick.png') 0 1px no-repeat; color: #3d3c45; font: normal 11px/20px 'Tahoma', sans-serif; text-align: left;}


/*-------------------------------------
			Details Page
--------------------------------------*/

div#results-details { float: left; width: 690px; margin: 0; padding: 0; position: relative;}
div#results-details ul { float: left; width: 707px; margin: 5px 0 0 5px; padding: 0; position: relative; border-top: 1px dotted #ccc}
div#results-details ul li { float: left; clear: both;  border-bottom: 1px dotted #ccc; background: url('../img/bg_silverfade_large.jpg') 0 0 repeat-x;}

div#results-details ul li p { padding: 10px; margin: 0; line-height: 16px; }

div#results-details div.options ul.ticks { float: left; padding: 7px 0; margin: 0; width: 350px;background: transparent;  border: none;}
div#results-details div.options ul.ticks li { float: left; padding: 0 0 0 20px; margin-left: 30px; width: 300px; border: none; background: url('../img/icon_tick.png') 0 1px no-repeat; color: #000; font: normal 11px/20px 'Tahoma', sans-serif; text-align: left; max-height: 50px;}

div#results-details span.imgwrap { float: left; margin: 0; padding: 4px; text-align: center; background: #fff; margin: 5px 0 0 5px; border: 1px solid #ccc;}

div#results-details span.imgwrap ul.alt-images { padding: 0; margin: 0; width: 285px; background: transparent;  border: none; display: inline;}
div#results-details span.imgwrap ul.alt-images li {margin: 1px 0 0 1px;  border: none; color: #000; display: inline; width: 70px; height: 53px; float: left; list-style: none; clear: right;}

div#results-details div.mini_spec { float: left; width: 250px; padding: 10px 0 10px 10px;}
div#results-details div.mini_spec h3 { padding: 0; font: bold 12px/25px Arial, sans-serif; color: #666; margin: 3px 0}
div#results-details div.mini_spec h3 a { color: #444;}
div#results-details div.mini_spec div { float: left; clear: both; padding: 0;}
div#results-details div.mini_spec span { float: left; display: inline; color: #333; width: 200px; font: normal 11px/17px 'Tahoma', Helvetica, sans-serif}
div#results-details div.mini_spec span.left { width: 100px; color: #00529c }
div#results-details div.mini_spec span.right { width: 120px; padding: 0 10px; text-align: left; clear: right;}

div#results-details div.title_price { float: left; width: 375px; padding: 10px;}
div#results-details div.title_price span.price { float: right; font: bold 13px/22px 'Helvetica', Arial, sans-serif; color: #036; text-align: left; padding: 0; }
div#results-details div.title_price h3 a:link { width: 260px; color: #036; font: bold 13px/22px Arial, Helvetica, sans-serif; float: left; text-decoration: none;}

div#results-details div.title_price h3 a:visited { width: 300px; color: #036; font: bold 13px/22px Arial, Helvetica, sans-serif; float: left; }
div#results-details div.title_price h3 a:visited a:hover { text-decoration: underline;}
div#results-details div.title_price h3 { color: #036; font: bold 13px/22px Arial, Helvetica, sans-serif;}

div#results-details div.options { float: left; width: 370px; text-align: left; padding: 0; font: normal 11px/18px sans-serif;}
div#results-details div.options a { color: #0d59b9; font: bold 11px/20px sans-serif;}
div.options span { float: left; clear: both;}





div#spec { float: left; width: 707px; position: relative;}

div#spec div.panel { width: 216px; float: left; padding: 0; background: #fff; border: 1px solid #aeaeae; position: relative; margin: 15px 5px 0 0;}
div#spec div.panel h4 { float: left; background: #fff; font: bold 12px/30px sans-serif; padding: 0 10px; color: #0d59b9}
div#spec div.panel ul { float: left; width: 216px; position: relative; padding: 0; margin: 0; border-top: 1px dotted #cecece;}	
div#spec div.panel ul li { font: normal 11px/26px 'Tahoma', sans-serif; color: #333; border-bottom: 1px dotted #cecece;}
div#spec div.panel ul li { float: left; display: inline; width: 196px; padding: 0 10px;}
div#spec div.panel ul li span.left { float: left; width: 115px; text-align: left; height: 26px;}
div#spec div.panel ul li span.right { float: left; width: 76px; text-align: left; border-left: 1px dotted #ccc; padding: 0 2px; text-align: right; height: 26px;}
div#spec div.panel input[type=text] { border:1px solid #ccc; width: 50px; padding: 3px; color: #666; vertical-align: middle;}
div#spec div.panel select { padding: 3px; color: #666; border: 1px solid #7f9db9; background: #fff; width: 70px;}
.cost { font-size: 11px; font-weight: bold; color: #0ba200; margin: 2px 0 0 0}
.nomargin { margin: 15px 0 0 0 !important;}
.pad { padding: 3px 0 0 0 !important;}

div#spec div.terms { padding: 10px 0; float: left;}

div#spec ul.details { float: left; width: 665px; position: relative; padding: 0; margin: 10px 0; border-top: 1px dotted #cecece;}	
div#spec ul.details li { font: normal 11px/26px 'Tahoma', sans-serif; color: #333; border-bottom: 1px dotted #cecece;}
div#spec ul.details li { float: left; display: inline; width: 310px; padding: 0 10px;}
div#spec ul.details li span.left { float: left; width: 130px; font-weight: bold; text-align: left;}
div#spec ul.details li span.right { float: left; width: 180px; font-weight: normal; text-align: left;}

div#spec ul.stats { float: left; width: 665px; position: relative; padding: 0; margin: 10px 0; border-top: 1px dotted #cecece;}	
div#spec ul.stats li { font: normal 11px/26px 'Tahoma', sans-serif; color: #333; border-bottom: 1px dotted #cecece;}
div#spec ul.stats li { float: left; display: inline; width: 310px; padding: 0 10px;}
div#spec ul.stats li span.left { float: left; width: 130px; font-weight: bold; text-align: left;}
div#spec ul.stats li span.right { float: left; width: 180px; font-weight: normal; text-align: left;}

div#spec ul.spec { float: left; width: 665px; position: relative; padding: 0; margin: 10px 0; border-top: 1px dotted #cecece;}	
div#spec ul.spec li { font: normal 11px/26px 'Tahoma', sans-serif; color: #333; border-bottom: 1px dotted #cecece;}
div#spec ul.spec li { float: left; clear: both; width: 645px; padding: 0 10px;}

div#spec p { font: normal 11px/20px 'Tahoma', sans-serif; color: #666; padding: 0 10px; margin: 5px 0 2px 0}


/*UImage Gallery*/
div#demos { float: left; clear: both; border: 1px solid #f00;}



.specs p{ text-align: left; border-top: 1px dotted #CCC; border-bottom: 1px dotted #CCC; 
			padding: 10px 5px; font: bold 10px/12px Verdana, Geneva, sans-serif; clear: both; }



/*****************************
		Enquiry Form
******************************/

div#form-title { height: 24px; width: 682px; padding: 5px; background: #174276 url('../img/form_legend_bg.jpg');}
div#form-title h2{ font: bold 13px/20px sans-serif; color: #FFF; margin: 0; }

div#enquiryForm { width: 705px; margin: 30px 5px; float: left; }
div#form { width: 690px; margin: 0 0 15px 0; padding: 10px 0; border: 1px dotted #CCC; background-color: #F2F2F2}
div.row { float: left; width: 600px; padding: 0 0 5px 0; position: relative;}

.label {
	float: left;
	clear: left;
	display: inline;
	width: 200px;
	padding: 0 0 0 6px;
	margin: 0 10px 10px 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-weight: bold;
	line-height: 20px;
	 color: #1f3959;}
	
.text { float: left; padding: 5px 3px; background: #fff; border: 1px solid #ccc; width: 200px; font-size: 12px; color: #666;}
.textarea { float: left; padding: 5px 3px; background: #fff; border: 1px solid #ccc; width: 250px; height: 150px; font-size: 12px; color: #666;}
#submit { float: left; font-size: 12px; font-weight: bold; color: #333; position: relative; left: 125px; padding: 4px 10px}
legend { font: bold 12px/20px Verdana, Geneva, sans-serif #000 }


