/* CSS for Shaks Specialist Cars - Copyright www.ukwebsites.net */

body {margin: 0; padding: 0; color: #eee; background: #000; font-family: Verdana, Arial, Helvetica, sans-serif}
* {margin: 0; padding: 0}
a img {border: 0}

h1, h2, h3, h4, h5 {font-family: Arial, Helvetica, sans-serif; color: #d9d9d9}
h1 {margin: 0 30px; text-transform: uppercase; font-size: 25px}
h2 {margin: 30px 30px 0 30px; text-transform: uppercase; font-size: 16px; border-bottom: 1px solid #444}
h3 {margin: 10px 30px; text-transform: uppercase; font-size: 14px}
h4 {}
h5 {}
p, table, ul, ol {font-size: 11px}
p {margin: 5px 30px 20px 30px; line-height: 1.7;}

ul {margin: 5px 30px 20px 30px; line-height: 1.7}
ul li {margin: 0 0 0 10px; padding: 0 0 0 10px; list-style: none outside; background: url(../images/ul-bullet.gif) left 8px no-repeat}

a {color: #fe0000; text-decoration: none}
a:hover {color: #fff}

.xmasmessage {
font-size:14px;
font-weight:bold;
height:190px;
width:406px;
left:13px;
top:341px;
position:absolute;
z-index: 1000;
background: #000;
}

.newyearsmessage {
font-size:14px;
font-weight:bold;
height:190px;
width:406px;
left:13px;
top:341px;
position:absolute;
z-index: 1000;
background: #000;
}

/* ______________________________ LANDING PAGE __________________________ */
img#land-logo {position: absolute; left: 0; top: 0; z-index: 10}

img#living-the-dream {position: absolute; left: 375px; top: 22px; z-index: 11}

div#land-address {position: absolute; left: 390px; top: 90px; width: 560px; z-index: 10}
div#land-address p {margin: 0; font-weight: normal; color: #000; text-align: right}

div#land-intro {position: absolute; left: 25px; top: 140px; width: 480px; z-index: 10}
div#land-intro p {margin: 0; font-weight: bold; color: #000}

div#land-main-image {position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 561px;
	overflow: hidden}
	
div#land-logos {position: absolute; left: 20px; top: 550px; z-index: 10; width: 945px}	

a#enter-site {position: absolute; left: 630px; top: 490px; z-index: 11; display: block; width: 236px; height: 55px}
a#enter-site:hover {background-position: left bottom}


/* ______________________________ MAIN SITE _____________________________ */
a#logo {position: absolute; left: 0; top: 0; z-index: 10}

#main-image {position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 346px; overflow: hidden}
#main-image img {position: absolute; left: 0; top: 0; z-index: 2}

#container {margin: 0; z-index: 3; width: 990px}

#leftcol {float: left; width: 251px; margin: 206px 0 0 0; padding: 0 0 20px 0; position: relative; z-index: 5; overflow: hidden}
#rightcol {float: right; width: 739px; margin: 206px 0 0 0; padding: 8px 0 40px 0; position: relative; z-index: 6; overflow: hidden}


/* ________________________________ MAIN NAV______________________________ */
#leftcol ul {margin: 0; padding: 0; width: 100%;}
#leftcol ul li {margin: 0 0 1px 0; padding: 0; display: block; float: left; height: 39px; width: 100%; background: none}
#leftcol ul li a {margin: 0; padding: 0; display: block; float: left; height: 39px; line-height: 39px; width: 100%; text-indent: 24px; color: #dedede; font-weight: bold; text-transform: uppercase; background-image: url(../images/nav-a.gif); background-repeat: no-repeat; background-position: left top}
#leftcol ul li a:hover {background-position: left bottom}

/* CURRENT STATES */
body#body-home #leftcol ul li a#nav-home,
body#body-accessories #leftcol ul li a#nav-accessories,
body#body-view-stock #leftcol ul li a#nav-view-stock,
body#body-vehicle-sourcing #leftcol ul li a#nav-vehicle-sourcing,
body#body-sell-your-car #leftcol ul li a#nav-sell-your-car,
body#body-service #leftcol ul li a#nav-service,
body#body-finance #leftcol ul li a#nav-finance,
body#body-warranty #leftcol ul li a#nav-warranty,
body#body-number-plates #leftcol ul li a#nav-number-plates,
body#body-testimonials #leftcol ul li a#nav-testimonials,
body#body-location-and-hours #leftcol ul li a#nav-location-and-hours,
body#body-gallery #leftcol ul li a#nav-gallery,
body#body-contact #leftcol ul li a#nav-contact
{background-position: left bottom}


/* ___________________________ HOME PAGE LINKS __________________________ */
ul#rightlinks {float: right; margin: 20px 0 20px 20px; width: 234px; overflow: hidden}
ul#rightlinks li {margin: 0 0 16px 0; padding: 0; height: 106px; border: 1px solid #999; background: none}
ul#rightlinks li a {display: block; width: 232px; height: 106px; background-position: left top; background-repeat: no-repeat; position: relative; z-index: 1}
ul#rightlinks li a span {font-family: Arial, Helvetica, sans-serif; font-size: 16px; font-weight: bold; text-transform: uppercase; color: #eee}

/* SET THE SPANS TO BE THE SIZE OF THE LINK: */
ul.rightlinks li a span {display: block; width: 234px; height: 106px; cursor: pointer}

ul#rightlinks li a.fadeThis * {display: none; cursor: pointer}

ul#rightlinks li a#servicing-link.fadeThis {background: url(../images/servicing-link.jpg) 0 top no-repeat}
ul#rightlinks li a#servicing-link.fadeThis span.hover {position: absolute; top: 0; left: 0; z-index: 3; display: block; width: 236px; height: 139px; background:url(../images/servicing-link.jpg) 0 -106px no-repeat; border: 0; cursor: pointer; text-decoration: none;}

ul#rightlinks li a#vehicle-sourcing-link.fadeThis {background: url(../images/vehicle-sourcing-link.jpg) 0 top no-repeat}
ul#rightlinks li a#vehicle-sourcing-link.fadeThis span.hover {position: absolute; top: 0; left: 0; z-index: 3; display: block; width: 236px; height: 139px; background:url(../images/vehicle-sourcing-link.jpg) 0 -106px no-repeat; border: 0; cursor: pointer; text-decoration: none}

ul#rightlinks li a#part-ex-link.fadeThis {background: url(../images/part-ex-link.jpg) 0 top no-repeat}
ul#rightlinks li a#part-ex-link.fadeThis span.hover {position: absolute; top: 0; left: 0; z-index: 3; display: block; width: 236px; height: 139px; background:url(../images/part-ex-link.jpg) 0 -106px no-repeat; border: 0; cursor: pointer; text-decoration: none}


/* ___________________________ BULLETS BAR __________________________ */
div#bullets {clear: both; margin: 0 0 35px 0; padding: 20px 0 0 0; width: 990px; height: 132px; background: url(../images/bullets.jpg) left top no-repeat; overflow: hidden}
div#bullets ul {float:left; margin-top: 0}


/* _____________________________ FOOTER ____________________________ */
div#footer {clear: both; width: 990px; height: 70px; border-top: 1px solid #444; overflow: hidden}
div#footer ul {margin: 0; padding: 0}
div#footer ul li, div#footer ul li a {margin: 0; padding: 0; display: block; float: left; height: 30px; line-height: 30px; background: none; text-transform: uppercase; color: #444; font-size: 11px}
div#footer ul li a {color: #777; padding: 0 15px; background: url(../images/footer-a-back.gif) left 50% no-repeat}
div#footer ul li a:hover {color: #aaa}

div#footer ul li a#ttt {padding: 0 95px 0 40px; background: url(../images/ttt.gif) 23px 9px no-repeat}
#topcontrol {display: none}
div#footer p {float: left; width: 800px; margin: 10px 0 0 20px; color: #777; font-size: 10px;text-transform: uppercase}
div#footer a#ukwebsites {float: right; display: block; width: 150px; font-size: 10px; padding: 10px 20px 0 0; color: #777; text-align: right; text-transform: uppercase}

div#foot-logos {margin: 0 0 0 35px; clear: both; width: 945px}	


/* _____________________ SELL OR PART EXCHANGE ______________________ */
ul#sell-or-partex {margin: 10px 20px; height: 30px;}
ul#sell-or-partex li,
ul#sell-or-partex li a 
{margin: 0; padding: 0; float: left; display: block; height: 39px; line-height: 39px; width: 250px}

ul#sell-or-partex li {padding: 0 5px 0 10px; background: none}
ul#sell-or-partex li a {background-image: url(../images/nav-a.gif); background-repeat: no-repeat; background-position: left top; text-align: center; font-size: 11px; color: #ddd; text-transform: uppercase; font-weight: bold}
ul#sell-or-partex li a.current,
ul#sell-or-partex li a:hover {background-position: left bottom}



/* _________________________ NUMBER PLATES __________________________ */
ul.number-plates {margin: 10px 20px}
ul.number-plates li {float: left; margin: 0 0 20px 0; padding: 0; height: 71px; line-height: 71px; text-align: center; width: 50%; background: url(../images/number-plate.jpg) 50% 0 no-repeat; font-size: 52px; color: #000; text-transform: uppercase; font-family: Arial, Helvetica, sans-serif; font-weight: bold}
ul.number-plates li p {line-height: 71px; margin: 0; padding: 0; font-size: 52px!important;}
ul.number-plates li p * {font-size: 52px!important; font-family:Arial, Helvetica, sans-serif}


/* __________________________ TESTIMONIALS __________________________ */
div.testimonials-container {padding: 30px; background: url(../images/quotemarks-left.gif) 30px 30px no-repeat}


/* _______________________ LOCATION AND HOURS ________________________ */
div#map {float: left; width: 508px; height: 400px; background: #333}
div#hours {float: right; width: 230px; height: 400px}

div#MyMap {width: 460px; height: 420px; margin: 10px 0 0 30px;}
div#MyMap iframe {width: 460px; height: 420px;}


/* ______________________________ GALLERY _____________________________ */
#gallery {
	position:relative;
	width:656px;
	margin: 0 0 0 20px;
	padding:10px;
}

#images {border:1px solid #9ac1c9; height:480px; background:#eef5f6; margin-bottom:20px}

#image {position:relative; width:640px; height:480px; padding:5px; border:1px solid #666; background:#000 url(../images/loading.gif) center center no-repeat}

#image img {position:absolute; top:5px; left:5px}

#thumbwrapper {margin-top:10px; padding:5px 0; width:650px; height:75px; border:1px solid #666; background:#000000;}

#thumbarea {position:relative; overflow:hidden; height:75px; width:650px;}

#thumbs {margin: 0; padding: 0; position:absolute; list-style:none; margin-left:5px; height:100px; width:10000px; border-right:5px solid #000000;}

#thumbs li {float:left; margin: 0 5px 0 0; padding: 0; cursor:pointer; list-style: none outside; background: none}

.imgnav {position:absolute; height:480px; z-index:100; width:20%; outline:none; cursor:pointer}

#previmg {left:0; background:url(../images/left.gif) left center no-repeat; border-left:5px solid #000000}

#previmg:hover {opacity:1; filter:alpha(opacity=100)}

#nextimg {right:0; background:url(../images/right.gif) right center no-repeat; border-right:5px solid #000000}

#nextimg:hover {opacity:1; filter:alpha(opacity=100)}



/* ______________________________ GALLERY _____________________________ */
.contact-tel {float:right; font-family: Arial, Helvetica, sans-serif; font-size: 18px; padding: 0 0 0 30px; margin: 15px 30px 0 0; background: url(../images/tel-icon.gif) left 4px no-repeat}



/* _______________________________ VD PICS _____________________________ */
.vdp-button {margin: 0 5px; display: block; height: 39px; line-height: 39px; width: 250px; background-image: url(../images/vd-pics-a.gif); background-repeat: repeat-x; background-position: left top; font-size: 11px; color: #ddd; text-transform: uppercase; font-weight: bold; text-align: center}
.vdp-button:hover {background-position: left bottom}


/* _________________________ FINANCE PAGE LOGOS _________________________ */
div.finance-logos {width: 167px; float: right; margin: 0 0 20px 30px;}
div.finance-logos img {margin: 8px 0 10px 0}



/* ________________________ OVERRIDE EDITABLE STYLES _________________________ */
div.editable-over {}
div.editable-over * {
	color: #fff!important;
	font-size: 12px!important;	
	margin: 10px 20px!important;
	text-align: left!important;
}