@charset "utf-8";
/* CSS Document for M4 Van Centre, Copyright 2009 */
/*
	COLOURS:
	TEXT: #000000
	BLUE: #2560a1
	LIGHT GREY: #dbdbdb
*/

body {margin: 0; padding: 0; background: url(../images/body-back.gif) left bottom repeat-x #2560a1; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px}
input {font-family: Verdana, Arial, Helvetica, sans-serif;}
* {margin: 0; padding: 0}
a img {border: 0}

h1, h2, h3, h4 {margin: 20px 20px 0 20px; font-weight: bold; color: #2560a1; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif}
h1 {font-size: 24px; margin-top: 40px}
h1 em {font-size: 18px; color: #444444; margin-top: 0; font-style: normal; display: block}
h2 {font-size: 20px;}
h2.sub {font-size: 18px; color: #444444; margin-top: 0}
h2.sub a {color: #444444}
h3 {font-size: 18px}
h4 {font-size: 15px}

h3.block {margin: 1px 1px 0 1px; font-size: 12px; background: #2560a1; color: #fff; text-indent: 15px; font-weight: normal; line-height: 2.5}

p, ol, ul {margin: 10px 20px; line-height: 1.5}
p.largeText {font-size: 14px; font-weight: bold}
.smalltext {font-size: 10px; line-height: 1.3 }
ul li, ol li {margin-left: 20px}
ul li {list-style: square outside; margin-left: 20px}

a {text-decoration: none; color: #2560a2}
a:hover {color: #000}

div.hr {height: 30px; margin: 20px; border-bottom: 1px solid #ddd}

table tr td {vertical-align: top}

/* TABLES IN SITE CONTENT */
table.contentTable {border: 0; padding: 0; margin: 10px 20px; font-size: 12px;}
table.contentTable tr th {padding: 10px 15px; background: #2560a1; color: #fff; text-align: left}
table.contentTable tr td {padding: 10px 15px; background: #eee}

/* _________________________ HOME PAGE BASIC LAYOUT __________________________ */
div#container {margin: 0 auto; padding-bottom: 30px; width: 990px; position: relative; z-index: 1; background: url(../images/container-back.gif) left top repeat-y; overflow: hidden}
div#container #containerBottom {position: absolute; left: 0; bottom: 0; width: 990px; height: 30px; z-index: 2; background: url(../images/content-bottom.gif) 0 0 no-repeat }

div#top {width: 950px; height: 367px; margin-left: 20px; position: relative; z-index: 2}
body#bodyGroupPage div#top {width: 950px; height: 474px; margin-left: 20px; position: relative; z-index: 2}

/* HOME PAGE LINKS */
a#m4vancentreHomeLink {display: block; width: 448px; height: 293px; position: absolute; left: 21px; top: 18px; z-index: 6; background: url(../images/blankgif.gif)}
a#m4minibuscentreHomeLink {display: block; width: 448px; height: 293px; position: absolute; left: 485px; top: 18px; z-index: 6; background: url(../images/blankgif.gif)}

a#usedcarsHomeLink {display: block; width: 180px; height: 128px; position: absolute; left: 91px; top: 330px; z-index: 6; background: url(../images/blankgif.gif)}
a#hgvHomeLink {display: block; width: 180px; height: 128px; position: absolute; left: 288px; top: 330px; z-index: 6; background: url(../images/blankgif.gif)}
a#selfdriveHomeLink {display: block; width: 180px; height: 128px; position: absolute; left: 485px; top: 330px; z-index: 6; background: url(../images/blankgif.gif)}
a#tradecentreHomeLink {display: block; width: 180px; height: 128px; position: absolute; left: 682px; top: 330px; z-index: 6; background: url(../images/blankgif.gif)}

/* LARGER LINKS: */
span.linkTitle {cursor: pointer; display: block; width: 100%; margin-top: 225px; text-align: center; font-size: 17px; font-weight: bold}
span.enterSite {cursor: pointer; display: block; width: 100%; margin-top: 5px; text-align: center; font-size: 15px; font-weight: bold; text-indent: 25px; background: url(../images/group-page/linkArrow.gif) 175px 50% no-repeat}

/* SMALLER LINKS: */
span.linkTitleSmall {cursor: pointer; display: block; width: 100%; margin-top: 89px; text-align: center; font-size: 14px; font-weight: bold}
span.enterSiteSmall {cursor: pointer; display: block; width: 100%; text-align: center; font-size: 10px; font-weight: bold; text-transform: uppercase}

div#top a:hover {color: #000}

/*  IMAGE TRANS  */
div#imgTrans {width: 950px; height: 367px; position: relative; z-index: 3; position: absolute; left: 0; top: 0; overflow: hidden; background: #000; border-bottom: 10px solid #dbdbdb} 
body#bodyGroupPage div#imgTrans {height: 474px;}

p#miniBusDomain {font-size: 24px; font-weight: bold; text-transform: uppercase; font-family: "Arial Black", Arial, Helvetica, sans-serif; margin: 20px 0 0 20px}
p#miniBusDomain em {color: #2560a1; font-style: normal}

/* PAGES WITH SMALL IMGTRANS */
body#bodyM4SelectCars div#top,
body#bodyM4HeavyVehicles div#top,
body#bodyM4SelfDrive div#top,
body#bodyM4TradeCentre div#top {height: 148px;}

body#bodyM4SelectCars div#imgTrans,
body#bodyM4HeavyVehicles div#imgTrans,
body#bodyM4SelfDrive div#imgTrans,
body#bodyM4TradeCentre div#imgTrans {height: 148px; background: #2560a1}

div#pageContent {margin: 10px 20px 0 20px; width: 950px; overflow: hidden; position: relative; z-index: 3} 

div#fullCol {float: left; padding: 0 0 50px 0; width: 950px; overflow: hidden; background: url(../images/fullCol.gif) 0 0 repeat-y}
body#bodyGroupPage div#fullCol {background: none}
/* USE FOR A 2 COL SITE WHICH DOESNT NEED GREY LINE: */
body.twocol div#fullCol {background: url(../images/fullColNoLine.gif) 0 0 repeat-y}

/* FOOTER */
div#footer {width: 990px; margin: 0 auto; height: 210px; overflow: hidden}
div#footer div#footerLinks {padding: 16px 0 10px 0; float: left}
div#footer div#footerLinks p {font-size: 11px; margin-top: 0; color: #2560a1}
div#footer ul {margin: 0 0 0 20px; padding: 0;}
div#footer ul li {margin: 0; padding: 0 15px 0 0; list-style: none outside; display: inline; font-size: 11px}

/* ADDRESSES AT BOTTOM OF FOOTER */
div#footer div#footerAddresses {width: 100%; height: 38px; overflow: hidden; clear: both}
div#footer div#footerAddresses div {float: left; width: 460px; border: 1px solid #c7def4; height: 36px; line-height: 36px; font-size: 11px; margin: 0 0 0 20px; display: inline; text-indent: 20px; font-size: 11px; color: #2560a2}


/*  UK WEB SITES LINK  */
span#ukwebsites {float: right; padding: 10px 20px 0 0; line-height: 30px; font-size: 11px; margin: 0 20px 0 0; color: #568ac3; background: url(../images/uk-websites-ball.gif) right 17px no-repeat}
span#ukwebsites a {color: #2560a1}
span#ukwebsites a:hover {color: #000}


/* ________________________________________ OTHER PAGES ____________________________________________ */
a#siteLink {display: block; width: 256px; height: 122px; z-index: 101; position: absolute; left: 38px; top: 41px; background: url(../images/blankgif.gif) 0 0 repeat}

body#bodyM4SelectCars a#siteLink,
body#bodyM4HeavyVehicles a#siteLink,
body#bodyM4SelfDrive a#siteLink,
body#bodyM4TradeCentre a#siteLink {left: 18px; top: 18px; width: 235px; height: 110px;}


div#phoneNumber {position: absolute; right: 20px; top: 40px; z-index: 100; font-size: 38px; color: #fff; text-align: right; padding: 0 0 0 60px; height: 40px; line-height: 40px; font-weight: bold; background: url(../images/ringing-phone.gif) left 50% no-repeat}

/* PUSH PHONE NUMBER DOWN SLIGHTLY FOR PAGES WITH THE NARROW BANNER */
body#bodyM4SelectCars div#phoneNumber,
body#bodyM4HeavyVehicles div#phoneNumber,
body#bodyM4SelfDrive div#phoneNumber,
body#bodyM4TradeCentre div#phoneNumber {top: 55px}

div#phoneNumberDark {position: absolute; right: 20px; top: 40px; z-index: 100; font-size: 38px; color: #222; text-align: right; padding: 0 0 0 60px; height: 40px; line-height: 40px; font-weight: bold; background: url(../images/ringing-phone-dark.gif) left 50% no-repeat}

/* MAIN NAV */
ul#nav {width: 193px; margin: 20px 10px;}
ul#nav li {margin: 0; padding: 0; display: block; float: left; width: 193px; border-bottom: 1px solid #668fbd; list-style: none outside}
ul#nav li a {display: block; padding: 4px 5px; float: left; width: 183px; line-height: 20px; color: #eee; background: url(../images/navArrow.gif) 185px 50% no-repeat}
ul#nav li a.backLink {background: url(../images/navBackArrow.gif) 185px 50% no-repeat}
ul#nav li a:hover {background-color: #3c77b8; color: #fff}

ul#nav li a.current {background: url(../images/navArrow.gif) 185px 50% no-repeat #3c77b8; color: #fff }

div#leftCol {float: left; width: 212px; overflow: hidden}
div#centreCol {float: left; width: 538px; overflow: hidden}
div#rightCol {float: right; width: 200px; overflow: hidden}	/* 3 col pages */
div#rightColLrge {float: right; width: 738px; overflow: hidden} /* 2 col pages */


#fbookIcon {margin: 10px 0 0 10px; position: absolute; z-index: 100; bottom: 8px; right: 150px}

body.twocol #fbookIcon {margin: 10px 0 0 10px; position: absolute; z-index: 100; bottom: 8px; right: 10px}

/* ______________________________________ FOOTER NAV _____________________________________________ */
a#ttt {float: left; color: #999; line-height: 30px; padding: 0 0 0 30px; font-size: 11px}
a#ttt:hover {color: #eee}


#map, #map iframe {width: 480px; height: 350px;}
#map {border: 1px solid #000; margin: 20px 0 0 22px}


/* ___________________________________ FINANCE PAGE TABS ________________________________________ */
ul.tabNavigation {
    list-style: none;
    margin: 20px 25px 0 20px;
    padding: 0;
	background: #fff;
	overflow: hidden
}

ul.tabNavigation li {
	display: block;
	float: left;
	margin: 0; 
	padding: 0 2px 0 0;
	height: 27px; 
	line-height: 27px;
    display: inline;
}
 
ul.tabNavigation li a {
	display: block;
	float: left;
    padding: 0 14px;
	height: 27px; 
	line-height: 27px;
	background-color:#2560a1;
    color: #fff;
	font-size: 11px;
	text-align: center;
    text-decoration: none;
}
 
ul.tabNavigation li a.selected {
	background-color:#dbdbdb;
    color: #000;
}

ul.tabNavigation li a:hover {
    background-color:#4e7eb3;
    color: #fff;
}

ul.tabNavigation li a.selected:hover {
	background-color:#dbdbdb;
    color: #000;
}
		
ul.tabNavigation li a:focus {
	outline: 0;
}
 
div.tabs > div {
	padding: 5px;
	margin: 0 25px 0 20px;
	height: 800px
}
		
div.tabs > div h2 {
	margin-top: 10px;
}
 
#first,
#second,
#third {
    background-color: #dbdbdb;
}

/* _________________________________ MEET THE TEAM PAGE ______________________________________ */
div#meetTheTeam {padding: 20px 20px 0 10px; overflow: hidden}

div#meetTheTeam h4 {color: #fff; margin:30px 0 0 105px; font-size: 12px; font-family: Verdana, Arial, Helvetica, sans-serif}
div#meetTheTeam p {color: #fff; margin: 0 0 0 105px; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px}

/* DIV FOR THE OWNER/MD */
div#meetTheTeam div.md {width: 236px; height: 94px; background: #2560a1; margin: 0 0 0 132px; overflow: hidden; position: relative; z-index:10}

/* DIV FOR ANY OTHER STAFF MEMBER */
div#meetTheTeam div.staff {width: 236px; height: 94px; background: #2560a1; margin: 12px 0 0 15px; float: left; overflow: hidden; position: relative; z-index:10}

div#meetTheTeam div img {position: absolute; left: 4px; top: 4px; z-index: 11}

div#meetTheTeamLeft {float: left; width: 236px; clear: left} /* LEFT COL */

div#meetTheTeamRight {float: right; width: 236px; padding: 0 21px 0 0} /* LEFT COL */

div#meetTheTeamLeft div.staff, div#meetTheTeamRight div.staff {width: 236px;}
div#meetTheTeamLeft h3, div#meetTheTeamRight h3 {margin-left: 10px}



/* ______________________________________ MISC _____________________________________________ */
.bannerArea {width: 696px; height: 150px;}
.bannerArea img {width: 696px!important;}
.imgRight {float: right; margin: 10px;}

.insuranceQuoteLink {display: block; height: 40px; line-height: 40px; font-size: 16px; padding-left: 40px; background: url(../images/quoteArrow.gif) 2px 50% no-repeat}

/* YouTube videos */
#VDVideoDiv {
	overflow: hidden;
	height: 385px;
	width: 640px;
	background: #000;
	margin-top: 5px;
}

#VDVideoDiv div {
	background: #000;
	overflow: hidden;	
}

#VDVideolink {
	outline: none;
	border: none;
	display: block;
	height: 20px;
}

#VDVideolink .youtube {
	display: block;
	margin-right: 4px;
	margin-top: 9px;
	width: 12px;
	height: 12px;
	background: url('../images/youtube.jpg') no-repeat 0px 0px;
	text-indent: -9999px;
	float: left;
}

#VDVideolink .minus {
	background-position: 0px -12px;
}

#VDVideolink img {
	margin-top: 4px;
	margin-left: 6px;
	display: inline-block;
}