/* CSS for Islington Citroen - Copyright www.ukwebsites.net*/

body {margin: 0; padding: 0; background: url(images/body-back.gif) left top repeat-x #fff; font-family: Verdana, Arial, Helvetica, sans-serif}
* {margin: 0; padding: 0}


/* ---------------------------------- LAYOUT ------------------------------------------ */
div#container {
	position: relative;
	margin: 0 auto;
	width: 990px;
}

div#top {
    position: relative;
    width: 990px;
    height: 73px
}

div#image-and-search {
	position: relative;
	width: 990px;
	height: 238px;	
}

div#main-image {
	position: absolute;
	left: 0;
	top: 0;
	width: 761px;
	height: 238px;
	background: #000
}

div#used-car-search {
	position: absolute;
	right: 0;
	top: 0;
	width: 219px;
	height: 238px;
	background: url(images/used-car-search-back.gif) left top repeat-x #ff6600
}

div#content {
	width: 990px;
	background: url(images/content-back.gif) left 0 repeat-y;
	overflow: hidden	
}

div#left-col {
	float: left;
	width: 190px;
	overflow: hidden	
}

div#centre-col {
	float: left;
	width: 581px;
}

div#right-col-large {
	float: left;
	width: 800px;

}

div#right-col {
	float: right;
	width: 219px;
	overflow: hidden
}

div#footer-full {margin: 20px 0 0 0; width: 100%; border-top: 1px solid #e1e1e1; }
div#footer {position: relative; width: 990px; margin: 0 auto; height: 80px}

div#footer-nav-address-ukwebsites {width: 770px; height: 80px; position: absolute; left: 0; top: 0; z-index: 1}
div#footer-nav-address-ukwebsites p {margin: 0 2px; color: #7f7f7f;}
div#footer-nav-address-ukwebsites p a {color: #7f7f7f; font-weight: normal}
div#footer-nav-address-ukwebsites p a:hover {color: #444}

div#footer-numbers {width: 220px; height: 80px; position: absolute; left: 770px; top: 0; z-index: 10}
div#footer-numbers p {margin: 10px 2px 0 0; font-size: 11px; text-align: right; color: #7f7f7f}

form#contactform-frm {width: 300px}
div#contact-right {float: right; width: 200px; overflow: hidden}
div#contact-right h4 {margin: 0 0 0px 30px; font-size: 1.10em; color: #ff6600}
div#contact-right p {margin: 0 0 25px 30px;font-family: Arial, Helvetica, sans-serif; font-weight: normal; font-size: 0.8em; color: #7a7a7a; font-weight: bold; padding: 0 0 0 18px; background: url(images/tiny-phone.gif) left 50% no-repeat }

div.editable-region {margin: 15px; color: #444!important}


/* ------------------------------------------- TYPE ------------------------------------------- */
h1 {position: absolute; left: 0; top: 2px}
h1 span {position: relative; top: -1000px;}  /* IMAGE REPLACEMENT */
h2, h3, h4, h5 {margin: 10px 15px; font-family: Arial, Helvetica, sans-serif; font-weight: normal}

h2 {margin: 15px 15px 0 15px; font-size: 1.75em; color: #ff6600}
h3 {margin: 0 15px; font-size: 0.9em; text-transform:uppercase; color: #7a7a7a; font-weight: bold}
div#used-car-search h3 {margin: 0; font-size: 1.05em; position: absolute; left: 20px; top: 17px; color: #fff; text-transform: none}

h3.grey {margin: 10px 0 0 0; height: 40px; line-height: 40px; width: 209px; padding: 0 0 0 10px; color: #fff; font-size: 16px; font-weight: bold; background: #7f7f7f;}

p {margin: 15px; color: #666; font-size: 0.70em; line-height: 1.3}

ul, ol {font-size: 0.70em;}

.highlight {color: #ff6600}  /* use to highlight anything in orange */

a#book-mot {display: block; margin: 30px 0 20px 15px; width: 300px; height: 30px; line-height: 30px; background: url(images/mot-small.gif) left 50% no-repeat; padding: 0 0 0 30px}

a.emailaddress {font-weight: normal; color: #666}
a.emailaddress:hover {color: #ff6600}


/* ------------------------------------------ LINKS ------------------------------------------- */
#suzuki-logo {position: absolute; right: 75px; top: 7px}
#peugeot-logo {position: absolute; right: 0px; top: 7px} 
#citroen-logo {position: absolute; right: 150px; top: 7px} 

a {color: #ff6600; text-decoration: none; font-weight: bold}
a:hover {color: #333}


/* ---------------------------------------- MAIN NAV ------------------------------------------ */
img#nav-spcr {float: left}

div#left-col ul {
	position: relative;
	margin: 0;
	padding: 0;	
	z-index: 1000;
}

div#left-col ul li {
	margin: 0;
	padding: 0;
	float: left;
	display: block;
	list-style-type: none;
	width: 100%;
}

div#left-col ul li a {
	float: left;
	display: block;
	width: 180px;
	padding: 0 0 0 10px;
	height: 25px;
	line-height: 25px;
	color: #fff;
	font-weight: normal;
	background: #ff6600;
	border-bottom: 1px solid #d45500
}

div#left-col ul li a.more {background: url(images/nav-more.gif) 175px 50% no-repeat #ff6600}

div#left-col ul li a:hover {background: #e85d00}
div#left-col ul li a.more:hover {background: url(images/nav-more.gif) 175px 50% no-repeat #e85d00}

body#body-home a#home,
body#body-new-vehicles a#newvehicles,
body#body-used-vehicles a#usedvehicles,
body#body-citroen-offers a#citroen-offers,
body#body-suzuki-offers a#suzuki-offers,
body#body-business-solutions a#business-solutions,
body#body-testimonials a#testimonials,
body#body-valeting a#valeting,
body#body-where-are-we a#where-are-we,
body#body-current-vacancies a#current-vacancies,
body#body-about-us a#about-us,
body#body-contact-us a#contact-us
{color: #FFFF00}


/* ------------------------------------- FLYOUT MENUS ------------------------------------------- */
#menu4Container {position:absolute; visibility:hidden; left:190px; top:347px; overflow:hidden; z-index: 10000}
#menu4Container, #menu4Content { position:absolute; width:190px; height:260px; clip:rect(0 190 260 0);}

#menu5Container {position:absolute; visibility:hidden; left:190px; top:580px; overflow:hidden; z-index: 10000}
#menu5Container, #menu5Content { position:absolute; width:190px; height:260px; clip:rect(0 190 260 0);}

#menu6Container {position:absolute; visibility:hidden; left:190px; top:473px; overflow:hidden; z-index: 10000}
#menu6Container, #menu6Content { position:absolute; width:190px; height:260px; clip:rect(0 190 260 0);}

.menuInsert  { z-index: 200;}
.menuContainer { z-index: 1000;}

ul#ddown {width: 190px; margin: 0; padding: 0; height: 260px; overflow: hidden; border-top: 1px solid #bc4b00}
ul#ddown li {display: block; float: left; padding: 0; margin: 0; text-align: left; list-style: none inside; width: 100%}
ul#ddown li a {display: block; float: left; padding: 0 0 0 10px; width: 180px; margin: 0; height: 25px;
	line-height: 25px; text-align: left; color: #fff; background: #e85d00!important;
	border-bottom: 1px solid #bc4b00; font-weight: normal}
ul#ddown li a:hover {background: #d45500!important} 

ul#ddown2 {width: 190px; margin: 0; padding: 0; height: 260px; overflow: hidden; border-top: 1px solid #bc4b00}
ul#ddown2 li {display: block; float: left; padding: 0; margin: 0; text-align: left; list-style: none inside; width: 100%}
ul#ddown2 li a {display: block; float: left; padding: 0 0 0 10px; width: 180px; margin: 0; height: 25px;
	line-height: 25px; text-align: left; color: #fff; background: #e85d00!important;
	border-bottom: 1px solid #bc4b00; font-weight: normal}
ul#ddown2 li a:hover {background: #d45500!important} 



/* ---------------------------------------- RIGHT COL LINKS ------------------------------------------ */
div#right-col ul {margin: 5px 0 0 0}
div#right-col ul li {padding: 5px 0 0 0; list-style-type: none}

a#book-a-service,
a#mot,
a#sell-your-car {font-family: Arial, Helvetica, sans-serif; display: block; background: url(images/right-nav-arrow.gif) 199px 50% no-repeat #7f7f7f; height: 40px; line-height: 40px; width: 209px; padding: 0 0 0 10px; color: #fff; font-size: 16px; font-weight: bold}

a#book-a-service:hover,
a#mot:hover,
a#sell-your-car:hover {background-color: #6c6c6c}

a#motability {display: block; width: 219px; height: 41px; background-image: url(images/motability-link.gif); background-position: left bottom}
a#motability:hover {background-position: left top}

a#xmasopeninghours {display: block; width: 219px; height: 41px; background-image: url(images/xmasopeninghours-link.jpg); background-position: left bottom}
a#xmasopeninghours:hover {background-position: left top}

a#commercials {display: block; width: 219px; height: 174px; background-image: url(images/commercials-link.jpg); background-position: left top}
a#commercials:hover {background-position: left bottom}


/* -------------------------------------- FOOTER NAVIGATION ------------------------------------------ */
div#footer-nav-address-ukwebsites ul {margin: 2px 0 0 -8px; height: 30px;}
div#footer-nav-address-ukwebsites ul li {margin: 0; display: block; float: left; padding: 0 15px 0 10px; height: 30px; background: url(images/footer-nav-li-back.gif) right 15px no-repeat}
div#footer-nav-address-ukwebsites ul li.last {background: none}
div#footer-nav-address-ukwebsites ul li a {margin: 0; display: block; float: left; padding: 0; height: 30px; line-height: 30px; font-size: 11px; color: #ff6600; font-weight: normal}
div#footer-nav-address-ukwebsites ul li a:hover {color: #7f7f7f}



/* ---------------------------------------- NEW VEHICLES PAGE ----------------------------------------- */
ul#new-vehicle-list {margin: 0; padding: 0;}
ul#new-vehicle-list li {margin: 0; padding: 0 0 20px; display: block; float: left; width: 271px}
ul#new-vehicle-list li a {margin: 0; padding: 0; display: block; float: left; width: 271px; text-align: center}


/* ----------------------------------- NEW CITROEN AND NEW SUZUK PAGES -------------------------------- */
div.new-car {margin: 10px 15px; border-bottom: 1px solid #ddd;}
div.new-car h4 {margin: 0 210px 0 0; padding: 10px 0 0 0; font-size: 1.25em; color: #ff6600}
div.new-car h4 span.from {color: #7a7a7a; text-align: right; font-size: 0.55em; font-weight: bold; text-transform: uppercase}
div.new-car p {margin: 0 210px 0 0; padding: 10px 0}
div.new-car img {float: right; width: 200px; height: 124px; font-size: 11px; z-index: 1}



/* ----------------------------------------------- OTHER --------------------------------------------- */
div#map {width: 550px; height: 350px; margin: 20px 0 0 15px; border: 1px solid #000; z-index: 1}

a#citroen-scrappage-btn {display: block; float: right; margin: 10px; width: 217px; height: 108px; background: url(images/citroen-scrappage-btn.jpg) left top no-repeat}
a#citroen-scrappage-btn:hover {background-position: left bottom}