/* CSS for - Copyright www.ukwebsites.net */ /* */ /* COLOURS: */ /* FORD BLUE: #00549d */ /* */ body {margin: 0; padding: 0 0 14px 0; color: #333; background: url(../images/body-back.jpg) 50% 0 no-repeat #fff; font-family: Arial, Helvetica, sans-serif; text-align: left} * {margin: 0; padding: 0} a img {border: 0} a {text-decoration: none; color: #00549d; font-weight: bold} a:hover {color: #000} .linkArrow {display: block; padding: 0 0 0 17px; cursor: pointer; background:url(../images/link-arrow.gif) 0px 1px no-repeat; font-size: 12px} .linkArrowBlue {display: block; padding: 0 0 0 17px; cursor: pointer; background:url(../images/link-arrow-blue.gif) 0px 1px no-repeat; color: #fff; font-size: 12px} .linkArrowBlue:hover {color: #FFFF00} a#thrapstons {position: absolute; left: 0; top: 27px; z-index: 110; display: block; width: 267px; height: 52px;} img#fordBadge {float: right; margin: 12px 0 0 0} h1, h2, h3, h4, h5 {font-weight: normal; color: #00549d} h1 {margin: 30px 25px 10px 25px; font-size: 26px} body#bodyHome h1 {margin: 25px 18px 10px 18px} /* STYLES FOR h2 IN LEFT COLUMN: */ h2 {margin: 9px 0 0 20px; color: #fff; font-size: 14px} h3 {margin: 30px 18px 10px 25px; font-size: 16px} h4 {} p, ol, ul {margin: 10px 25px; line-height: 1.6; font-size:11px} body#bodyHome p {margin: 10px 18px} ul {} ul li {margin: 0 0 0 20px; list-style: none outside; padding: 2px 0 2px 20px; background:url(../images/bulletBlue.gif) left 4px no-repeat} .clear {clear: both} /* ------------------------------ EDITABLE REGIONS --------------------------------- */ div.editableDiv {margin: 10px 25px} div.editableDiv p {margin: 0!important; font-family:Arial, Helvetica, sans-serif!important} /* ---------------------------------- LAYOUT ------------------------------------------ */ div#container {position: relative; margin: 0 auto; width: 990px; overflow: hidden; background: url(../images/rgt-col-back.jpg) right 141px no-repeat;} body.bodyWithTrans div#container {background: none} div#top {position: relative; width: 990px; height: 92px} div#mainNav {position: relative; z-index: 10; width: 990px; height: 49px; background: url(../images/nav-back.jpg) 0 0 no-repeat} /* --------------------- COLUMNS ---------------------- */ div#leftCol {float: left; width: 241px; padding: 0 0 10px 0; overflow: hidden} div#rightCol {float: right; width: 749px; overflow: hidden} div#rightColLeft {float: left; width: 550px} div#rightColRight {float: right; width: 190px} body#bodyContactUs div#rightColLeft {float: left; width: 450px} body#bodyContactUs div#rightColRight {float: right; width: 290px} body#bodyLocationAndHours div#rightColLeft {float: left; width: 450px} body#bodyLocationAndHours div#rightColRight {float: right; width: 290px} div#imageTrans {width: 749px; height: 286px; background:url(../images/image-trans/back.jpg) 0 0 no-repeat; position: relative; z-index: 5} div#imageTrans a.readMore {position: absolute; z-index: 6; width: 114px; height: 24px; background-image: url(../images/read-more.png); background-repeat: no-repeat; background-position: left top} div#imageTrans a.readMore:hover {background-position: left bottom} /* ------------------------- NEW CARS AND USED CARS LINKS ------------------------- */ div#newCars {width: 241px; height: 182px; background:url(../images/new-cars-back.jpg) 0 0 no-repeat; overflow: hidden} div#newCars h2 {margin-top: 17px} div#usedCars {width: 241px; height: 180px; background:url(../images/used-cars-back.jpg) 0 0 no-repeat; overflow: hidden} a#NewFordRangeLink, a#UsedCarsLink {margin: 14px 0 0 5px; display: block; width: 229px; height: 108px; background:url(../images/new-ford-range.jpg) 0 0 no-repeat; position: relative; z-index: 5; cursor: pointer; font-weight: normal; font-size: 12px} a#UsedCarsLink {margin-top: 10px; background: url(../images/online-showroom.jpg) 0 0 no-repeat} a#NewFordRangeLink:hover, a#UsedCarsLink:hover {background-position: left bottom} a#NewFordRangeLink span, a#UsedCarsLink span {position: absolute; width: 100%; left: 0; bottom: 0; z-index: 10; text-align: center; cursor: pointer; background-position: 47px 1px; padding: 0 0 0 10px} /* ------------------------- THRAPSTON CONTACT DETAILS ------------------------- */ div#thrapstonAddress {width: 241px; height: 227px; background: url(../images/thrapston-garage-back.jpg) 0 0 no-repeat; overflow: hidden} div#thrapstonAddress p {margin: 20px 0 0 25px} div#thrapstonAddress p#thrapstonTelephone {margin-top: 15px; padding: 4px 0 4px 30px; background: url(../images/thrapstonTelephone.gif) left 0 no-repeat; font-size: 12px} div#thrapstonAddress p#thrapstonEmail {margin-top: 5px; padding: 4px 0 4px 30px; background: url(../images/thrapstonEmail.gif) left 0 no-repeat; font-size: 12px} div#thrapstonAddress p#thrapstonEmail a {font-weight: normal} /* ----------------------------- FIND US MAP LINK ---------------------------- */ div#findUsBox {position: relative; z-index: 5; width: 241px; height: 220px; background: url(../images/find-us-back.jpg) 0 0 no-repeat; overflow: hidden} a#findUsLink {margin: 0; position: absolute; left: 5px; top: 35px; z-index: 11; display: block; width: 229px; height: 120px; background: url(../images/find-us-link.jpg) left top no-repeat} a#findUsLink:hover {background-position: left bottom} a#findUsLink span {position: absolute; right: 19px; bottom: 3px; z-index: 12; font-size: 12px} /* ---------------------------- COVERFLOW OFFERS ------------------------------- */ div#coverFlowContainer {border: solid 1px #ddd; padding: 17px; margin: 6px 0 10px 9px;} div#coverFlowAndButtonContainer {position: relative; z-index: 5} div#ipoddiv {} /* --------------------------- RIGHT COLUMN BOXES ------------------------------ */ div#customerService {width: 190px; height: 149px; background:url(../images/customerServiceBack.gif) 0 0 no-repeat; overflow: hidden} div#customerService p {margin: 67px 15px 0 20px; color: #fff} div#classicAndPerformance {width: 190px; height: 276px; background:url(../images/classicAndPerformanceBack.gif) 0 0 no-repeat; overflow: hidden} div#classicAndPerformance p {margin: 192px 15px 0 20px; color: #fff} div#classicAndPerformance a, div#customerService a {margin: 9px 0 0 20px} /* -------------------------------- FOOTER ------------------------------------- */ div#footer {clear: both; width: 990px; height: 101px; background:url(../images/footerBack.gif) 0 0 no-repeat; overflow: hidden} div#footer ul {width: 100%; height: 30px;} div#footer ul li {float: left; line-height: 30px; height: 30px; background: none; padding: 0 30px 0 0; margin: 0} div#footer ul li#ttt {width: 60px;} div#footer ul li#ttt a {display: block; height: 30px; line-height: 30px; width: 40px; padding: 0 0 0 23px; background: url(../images/ttt.gif) 4px 8px no-repeat} div#footer ul li a {line-height: 30px; font-weight: normal; color: #555} div#footer ul li a:hover {color: #000} div#footer ul li#footerNewFord {width: 111px; background:url(../images/newFordRange.gif) 0 0 no-repeat; padding: 0 0 0 8px} div#footer ul li#footerNewFord a {color: #00549d; font-weight: bold;} div#footer ul li#footerUsedCars {float: right; width: 100px; padding: 0 10px 0 0} div#footer ul li#footerUsedCars a {color: #00549d; font-weight: bold} /* ------------------------------ FOOTER LOGOS -------------------------------- */ div#footerLogos * {float: left; margin: 0 2px 0 0} div#footerLogos a {display: block; background-repeat: no-repeat; background-position: left top} div#footerLogos a:hover {background-position: left bottom} div#footerLogos a#motabilityLink {width: 157px; height: 65px; background-image: url(../images/footer-logos/motability-logo.jpg)} /* ------------------------------ UK WEB SITES -------------------------------- */ div#ukWebSites {width: 990px; height: 20px; line-height: 20px; font-size: 11px} div#ukWebSites span {display: block; float: right; padding: 0 10px 0 0} /* ------------------------------ NEW FORD PAGE ------------------------------- */ ul#NewFordRangeList {margin: 25px 15px 25px 25px; padding: 0} ul#NewFordRangeList li {float: left; display: block; width: 169px; height: 139px; margin: 0; padding: 0 6px 6px 0; background: none} ul#NewFordRangeList li a {float: left; display: block; width: 169px; height: 139px; background-repeat: no-repeat; background-position: left top} ul#NewFordRangeList li a:hover {background-position: left bottom} ul#NewFordRangeList li a span {display: block; width: 100%; margin: 111px 0 0 0; text-align: center; color: #fff; cursor: pointer; font-size: 12px} ul#NewFordRangeList li a#NewKa {background-image: url(../images/new-cars/ka.jpg)} ul#NewFordRangeList li a#NewFiesta {background-image: url(../images/new-cars/fiesta.jpg)} ul#NewFordRangeList li a#NewFusion {background-image: url(../images/new-cars/fusion.jpg)} ul#NewFordRangeList li a#NewFocus {background-image: url(../images/new-cars/focus.jpg)} ul#NewFordRangeList li a#NewFocusRs {background-image: url(../images/new-cars/focus-rs.jpg)} ul#NewFordRangeList li a#NewFocusCc {background-image:url(../images/new-cars/focus-cc.jpg)} ul#NewFordRangeList li a#NewCMax {background-image: url(../images/new-cars/c-max.jpg)} ul#NewFordRangeList li a#NewMondeo {background-image: url(../images/new-cars/mondeo.jpg)} ul#NewFordRangeList li a#NewSMax {background-image: url(../images/new-cars/s-max.jpg)} ul#NewFordRangeList li a#NewKuga {background-image: url(../images/new-cars/kuga.jpg)} ul#NewFordRangeList li a#NewGalaxy {background-image: url(../images/new-cars/galaxy.jpg)} /* ------------------------ INDIVIDUAL NEW CAR PAGES --------------------------- */ img.newCarImage {float: right; margin: -40px 20px 20px 20px} div#breadCrumbs {margin: 20px 25px 0 25px; font-size: 11px; line-height: 20px; height: 20px; border-bottom: 1px solid #eee} div#breadCrumbs img {margin: 0 1px 0 0} /* NEW FLASHY ANIMATED JQUERY VD BUTTONS */ ul.newCarButtons {float: left; margin: 5px 0 20px 20px; padding: 10px 0 0 0; } ul.newCarButtons li {float: left; display: block; width: 90px; height: 65px; background: none; list-style: none outside; margin: 0; padding: 0} ul.newCarButtons li a {float: left; display: block; width: 90px; height: 65px; background: url(../images/vd-buttons/shadow.gif) 0 bottom no-repeat; position: relative; z-index: 15} ul.newCarButtons li a span {display: block; width: 90px; height: 56px; position: absolute; z-index: 17; left: 0; bottom: 9px; cursor: pointer} ul.newCarButtons li a span.bounceLinkTitle {width: 90px; height: 20px; left: 0; bottom: 2px; z-index: 16; text-align: center; color: #000; font-weight: normal; text-transform: uppercase; font-size: 10px} ul.newCarButtons li a span#newCarLinksBack {background: url(../images/new-car-buttons/back.gif) 0 0 no-repeat} ul.newCarButtons li a span#newCarLinksPrint {background: url(../images/new-car-buttons/print.gif) 0 0 no-repeat} ul.newCarButtons li a span#newCarLinksBook {background: url(../images/new-car-buttons/testdrive.gif) 0 0 no-repeat} ul.newCarButtons li a span#newCarLinksContact {background: url(../images/new-car-buttons/contact.gif) 0 0 no-repeat} ul.newCarButtons li a span#newCarLinksFinance {background: url(../images/new-car-buttons/finance.gif) 0 0 no-repeat} ul.newCarButtons li a span#newCarLinksFindUs {background: url(../images/new-car-buttons/find-us.gif) 0 0 no-repeat} ul.newCarButtons li a span#newCarLinksOptions {background: url(../images/new-car-buttons/options.gif) 0 0 no-repeat} /* ------------------------ AFTERSALES PAGE --------------------------- */ /* TOP LINKS */ ul#aftersalesLinks {margin: 0 0 20px 25px; padding: 0; overflow: hidden} ul#aftersalesLinks li {display: block; float: left; width: 229px; height: 137px; margin: 0; padding: 0 2px 0 0; background: none;} ul#aftersalesLinks li a {display: block; float: left; width: 229px; height: 137px; background-position: left top; background-repeat: no-repeat} ul#aftersalesLinks li a:hover {background-position: left bottom} ul#aftersalesLinks li a#aftersalesServicingLink {background-image: url(../images/aftersales/aftersalesServicingLink.jpg)} ul#aftersalesLinks li a#aftersalesPartsLink {background-image: url(../images/aftersales/aftersalesPartsLink.jpg)} ul#aftersalesLinks li a#aftersalesOffersLink {background-image: url(../images/aftersales/aftersalesOffersLink.jpg)} /* ------------------------- CONTACT US ----------------------------- */ p#contactTel, p#contactFindUs, p#contactOpeningHours, p#contactAddress, p#contactEmail {font-size: 14px; font-weight: bold; padding: 0 0 0 70px; margin: 0; line-height: 60px; color: #333} p#contactFindUs a, p#contactOpeningHours a {color: #333} p#contactFindUs a:hover, p#contactOpeningHours a:hover {color: #00549d} p#contactAddress {font-size: 12px; line-height: 16px; padding-top: 10px} p#contactTel {margin-top: 30px; background:url(../images/contact-us/contactTel.gif) left 5px no-repeat} p#contactFindUs {background: url(../images/contact-us/contactFindUs.gif) left 5px no-repeat} p#contactOpeningHours {background: url(../images/contact-us/contactOpeningHours.gif) 2px 5px no-repeat} p#contactAddress {background: url(../images/contact-us/contactAddress.gif) 2px 5px no-repeat} p#contactEmail {background: url(../images/contact-us/contactEmail.gif) 2px 5px no-repeat; margin: 10px 0 0 30px} /* ---------------------- LOCATION AND HOURS -------------------------- */ div#MyMap {margin: 0 0 0 27px; width: 690px; height: 370px; border: 1px solid #666} div#MyMap iframe {width: 690px; height: 370px;} /* DIRECTIONS FORM */ div#locationDirections {float: left; width: 310px; padding: 0 0 20px 0} #directionsForm {margin: 10px 0 0 0} #saddr {padding: 2px; background: #eee; border: 1px solid #999} .formSubmitButtonSm {width: 55px; height: 26px; cursor: pointer; border: 0!important; background: url(../images/goButton.gif) 0 0 no-repeat!important; color: #fff!important; font-size: 11px; position: relative; top: 1px} /* OPENING HOURS */ div#hoursContainer {float: right; width: 438px; padding: 0 0 20px 0} /* --------------------------- EASY VD TABS ------------------------------ */ div.menu {height:35px; width:420px; padding: 0; background: url(../images/navLinkHover.gif) 0 50% repeat-x; border-top: 5px solid #00549d} div.menu ul {margin:0; padding:0; list-style:none; text-align:center;} div.menu ul li {margin:0; padding:0 0 0 5px; display: block; float: left; height: 35px; line-height: 35px; background: none} div.menu ul li a {display: block; float: left; padding:0 15px; color:#ffffff; text-decoration:none; height: 35px; line-height: 35px; background: #3c87c8} div.menu ul li a.tabactive {color:#000000; background:#eee; font-weight:bold; position:relative;} #tabcontent1, #tabcontent2, #tabcontent3, #anothercontent1, #anothercontent2, #anothercontent3, #anothercontent5, #anothercontent6, #contentthree1, #contentthree2, #contentthree3 {border:0; padding: 10px; width:400px; height: 185px; text-align:left; font-size:12px; margin-bottom:5px; background: #eee; overflow: auto} /* -------------------------- MEET THE TEAM --------------------------- */ ul#meetTheTeam {display: block; width: 705px; margin: 20px 0 20px 25px;} ul#meetTheTeam li {float: left; display: block; width: 340px; height: 162px; margin: 0 11px 11px 0; padding: 0; background: url(../images/meet-the-team/meet-the-team-back.jpg) 0 0 no-repeat; position: relative; z-index: 5; overflow: hidden} ul#meetTheTeam li img {position: absolute; left: 10px; top: 10px; z-index: 11} ul#meetTheTeam li h3 {position: absolute; left: 170px; top: 50px; z-index: 12; margin: 0; color: #fff} ul#meetTheTeam li p {position: absolute; left: 170px; top: 75px; z-index: 13; margin: 0; color: #fff; font-size: 12px} /* --------------------------- MOTABILITY ---------------------------- */ .motabilityLogo {float: right; margin: -20px 30px 0 30px} /* --------------------------- THRAPSTON ----------------------------- */ #service-voucher-container {display: none} /* ------------------------- MOTABILITY PAGE ---------------------------- */ ul#motabilityOffers {margin: 20px 25px; width: 699px; padding: 0; overflow: hidden; overflow: hidden} ul#motabilityOffers li {margin: 10px 0; padding: 15px 0; background: none; border: 1px solid #ddd; overflow: hidden; position: relative; z-index: 5} ul#motabilityOffers li img {float: right; margin: 5px 10px 0 0} ul#motabilityOffers li h3 {margin-top: 10px} ul#motabilityOffers li h3, ul#motabilityOffers li p {} ul#motabilityOffers li ul {margin: 0; width: 230px; float: left} ul#motabilityOffers li ul li {margin: 0 0 0 20px; list-style: none outside; padding: 2px 0 2px 20px; background:url(../images/bulletBlue.gif) left 4px no-repeat; border: 0} .motabilityOfferPrice {position: absolute; right: 30px; top: 150px; z-index: 6; text-align: right; font-size: 14px}