/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Title : Author : Chris Munn / chris.munn@gforces.co.uk / G-Forces Web Management Ltd Type: Screen, Projection Description : Screen and projection stylesheet for Cotswold BMW site - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* COMMON AND GLOBAL */ html { height: 100%; } body { height: 100%; font:62.5%/1.6 verdana, arial, helvetica, sans-serif; margin:0; padding: 0px 0px 0px 0px; background:#ffffff url(../images/layup/bodyBg.gif) repeat-x top left; color: #787878; text-align:center; } /* This font sizing is for standards based browsers (firefox, opera, mozilla) that can re-size text. Declaring the font size in pixels makes it more consistent across browsers. */ td, textarea, input, select { font:100% arial, verdana, helvetica, sans-serif; } html>body td, html>body textarea, html>body input, html>body select { font-size:11px; } /* some browsers don't inherit the font into tables or textareas! */ /* ----- IDS ----- */ #container { min-height: 100%; width:958px; margin:0 auto; text-align:left; font-size:110%; line-height: normal; } * html #container { height: 100%; } #printHeader, .printHeader { display:none;} #header { height: 50px; position: relative; margin: 0px 0px 1px 0px; padding-top: 11px; z-index: 1099; } #header #logo { position: absolute; top: 26px; left: 19px; } #header #contactDetails { position: absolute; top: 0px; right: 110px; } #header #badge { position: absolute; top: 0px; right: -2px; } #header #cotswold { position: absolute; top: 0px; right: 91px; } /* header model nav */ #header #modelNav { padding: 7px 0px 0px 12px; float: left; } #header #modelNav .title { padding: 0px 0px 5px 5px; } #header #modelNav ul { list-style: none; margin: 0px; padding: 0px; } #header #modelNav li { float: left; } #header #modelNav li a { display:block; height: 30px; } #header #modelNav li a#mn1 { width: 22px; background: url(../images/layup/spriteModelNav.gif) 0px 0px no-repeat; } #header #modelNav li a#mn2 { width: 29px; background: url(../images/layup/spriteModelNav.gif) -22px 0px no-repeat; } #header #modelNav li a#mn3 { width: 25px; background: url(../images/layup/spriteModelNav.gif) -51px 0px no-repeat; } #header #modelNav li a#mn4 { width: 26px; background: url(../images/layup/spriteModelNav.gif) -76px 0px no-repeat; } #header #modelNav li a#mn5 { width: 26px; background: url(../images/layup/spriteModelNav.gif) -102px 0px no-repeat; } #header #modelNav li a#mn6 { width: 25px; background: url(../images/layup/spriteModelNav.gif) -128px 0px no-repeat; } #header #modelNav li a#mn7 { width: 41px; background: url(../images/layup/spriteModelNav.gif) -153px 0px no-repeat; } #header #modelNav li a#mn8 { width: 34px; background: url(../images/layup/spriteModelNav.gif) -194px 0px no-repeat; } #header #modelNav li a#mn1:hover, #header #modelNav li a#mn1.active { background: url(../images/layup/spriteModelNav.gif) 0px -30px no-repeat; } #header #modelNav li a#mn2:hover, #header #modelNav li a#mn2.active { background: url(../images/layup/spriteModelNav.gif) -22px -30px no-repeat; } #header #modelNav li a#mn3:hover, #header #modelNav li a#mn3.active { background: url(../images/layup/spriteModelNav.gif) -51px -30px no-repeat; } #header #modelNav li a#mn4:hover, #header #modelNav li a#mn4.active { background: url(../images/layup/spriteModelNav.gif) -76px -30px no-repeat; } #header #modelNav li a#mn5:hover, #header #modelNav li a#mn5.active { background: url(../images/layup/spriteModelNav.gif) -102px -30px no-repeat; } #header #modelNav li a#mn6:hover, #header #modelNav li a#mn6.active { background: url(../images/layup/spriteModelNav.gif) -128px -30px no-repeat; } #header #modelNav li a#mn7:hover, #header #modelNav li a#mn7.active { background: url(../images/layup/spriteModelNav.gif) -153px -30px no-repeat; } #header #modelNav li a#mn8:hover, #header #modelNav li a#mn8.active { background: url(../images/layup/spriteModelNav.gif) -194px -30px no-repeat; } /* ----- LEFT COLUMN ----- */ #leftCol { float: left; width: 232px; } #leftCol .box .title { padding: 0px 0px 12px 0px; } #leftCol .box { margin: 0px 0px 13px 0px; } #leftCol .box.locations { height: 156px; } #leftCol .box .padding { padding: 0px 19px 0px 19px; } #leftCol .box .padding p { padding-bottom: 7px; } #leftCol .box a { color: #2465a6; font-weight: normal; } #leftCol .usedCarSearch { padding: 20px 17px 30px 18px; background: #c1c1c1; min-height: 228px; } * html #leftCol .usedCarSearch { height:228px; } #leftCol .usedCarSearch.groupSearch { padding: 20px 17px 9px 18px; } #leftCol .usedCarSearch select { width: 197px; margin-bottom: 5px; } #leftCol .usedCarSearch.groupSearch select { margin-bottom: 0px; margin-top:5px; } #leftCol .usedCarSearch select#location { margin-bottom: 10px; } #leftCol #usedSearchBtns a { color: #FFFFFF; font-weight: normal; font-size: 12px; display: block; padding-top: 7px; } #leftCol #formSwitchContain { width:197px; float:left;} #leftCol #formSwitchContain a#bike { float:left; display:block; width:80px; height:12px; background:url(../images/layup/spriteCarBikeTab.gif) right top no-repeat; } #leftCol #formSwitchContain a#bike.active {background:url(../images/layup/spriteCarBikeTab.gif) right bottom no-repeat; } #leftCol #formSwitchContain a#usedCar { float:left; display:block; width:62px; height:12px; background:url(../images/layup/spriteCarBikeTab.gif) left bottom no-repeat; } #leftCol #formSwitchContain a#usedCar.active {background:url(../images/layup/spriteCarBikeTab.gif) left top no-repeat; } #leftCol #usedSearchBtnsGroup { width:192px; float:right; margin-top:5px; } #leftCol #usedSearchBtnsGroup a { color: #FFFFFF; font-weight: normal; font-size: 12px; display: block; padding-top: 7px; } #leftCol #saveCompare {} #leftCol #saveCompare .padding { padding:0 0 0 19px; } #leftCol #saveCompare a.thumb { width:66px; height:49px; background:url(../images/layup/noImageSaveCompare.gif) no-repeat left top; border:1px solid #bfbfbf; margin:0 3px 20px 0; display:block; float:left; } #leftCol #saveCompare a.end { margin:0 0 20px; } /* ----- RIGHT COLUMN ----- */ #rightCol { float: right; width: 725px; } #rightCol #homeJumps { width: 725px; height: 162px; position: relative; margin-bottom: 20px; } #rightCol #homeJumps img { position: absolute; top: 0px; } #rightCol #homeJumps img.jump1 { left: 0px; } #rightCol #homeJumps img.jump2 { left: 242px; } #rightCol #homeJumps img.jump3 { left: 484px; } #rightCol .padding { padding: 5px 15px 15px 15px; } #rightCol #franchiseHomeImage { margin-bottom: 8px; } #rightCol #franchiseHomeJumps { margin-bottom: 25px; } #rightCol #franchiseHomeJumps .newVehicles img, #rightCol #franchiseSubJumps .jumpStore img { position: relative; left: -1px; } #rightCol #franchiseHomeJumps img { float: left; } #rightCol #franchiseSubJumps { margin-bottom: 25px; } #rightCol #franchiseSubJumps img { float: left; } #rightCol #franchiseHomeJumps #homeFeatured { display: block; width: 300px; height: 161px; background: url(../images/layup/bmw/bmwOfWeekBg.jpg) no-repeat; float: left; position: relative; } #rightCol #franchiseHomeJumps #homeFeatured .featuredLink { display: block; text-decoration: none; font-weight: normal; height: 161px; } #rightCol #franchiseHomeJumps #homeFeatured .padding { display: block; padding: 37px 0px 7px 14px; } #rightCol #franchiseHomeJumps #homeFeatured .offerBtns { position: absolute; width: 125px; top: 12px; right: 0px; } #rightCol #franchiseHomeJumps #homeFeatured .offerBtns .offer { width: 14px; height: 14px; display: block; background: #c1c1c1; margin:0 0 4px 4px; float: left; } #rightCol #franchiseHomeJumps #homeFeatured .title { display: block; font-weight: bold; padding: 0px 5px 10px 0px; } #rightCol #franchiseHomeJumps #homeFeatured .itemDetails { display: block; width: 168px; float: right; } #rightCol #franchiseHomeJumps #homeFeatured .itemDetails .itemField { display: block; width: 82px; float: left; } #rightCol #franchiseHomeJumps #homeFeatured .price { display: block; font-weight: bold; font-size: 14px; float: right; clear: right; padding: 10px 0px 0px 0px; } #rightCol #franchiseHomeJumps #homeFeatured .itemImage { display: block; width: 106px;; float: left; } /* ----- CMS IMAGE ----- */ #rightCol #cmsImage { width: 725px; height: 257px; margin-bottom: 10px; background: url(../images/layup/cmsInternal.jpg) no-repeat; position: relative; } #rightCol #cmsImage h1 { padding: 15px 15px 0px 15px; color: #FFFFFF; } #rightCol #cmsImage #imgThumb { position: absolute; top: 0px; left: 0px; } #rightCol #cmsImage #pageDetails { color: #FFFFFF; width: 725px; height: 68px; background: url(../images/layup/cmsImageBg.png) no-repeat; position: relative; z-index: 1098; } /* ----- BOX LIST ----- */ #dealerLocator { width:725px; } #boxListCMS {} #boxListCMS .listItem { margin-right: 23px; float: left; } #boxListCMS .listItem.last { margin-right: 0px; } #boxListCMS .listItem a { display: block; text-decoration: none; width: 202px; } #boxListCMS .listItem .thumb { display: block; border: 1px solid #787878; float: left; width: 202px; } #boxListCMS .listItem .title { display: block; padding: 10px 5px 10px 5px; text-align: left; float: left; width: 202px; height: 35px; } /* ----- NEW CAR LIST ----- */ #newList {} #newList .listItem { width: 173px; height: 120px; float: left; position: relative; } #newList .modelType { position: absolute; top: 5px; left: 0px; } /* group / motorrad / mini - new car list */ #boxList {} #boxList .listItem { width: 695px; margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #787878; } #boxList .listItem a { display: block; text-decoration: none; font-weight: normal; } #boxList .listItem .thumb { display: block; border: 1px solid #787878; width: 310px; float: left; } #boxList .listItem .title { display: block; padding: 5px; width: 360px; float: right; font-weight: bold; } #boxList .listItem .content { display: block; padding: 5px; width: 360px; float: right; color:#000; } #boxListSmall {} #boxListSmall .listItem { width: 328px; float:left; margin-bottom: 10px; padding:0 20px 10px 0; border-right:1px solid #c1c1c1; } #boxListSmall .listItem.noBorder { border:none; float:right; padding-right:0px; } #boxListSmall .listItem a { display: block; text-decoration: none; font-weight: normal; } #boxListSmall .listItem .thumb { display: block; border: 1px solid #787878; width: 328px; float: left; margin-bottom:15px; } #boxListSmall .listItem .title { display: block; padding: 10px 0 0; width: 295px; float: left; font-weight: normal; font-size:18px; } #boxListSmall .listItem .content { display: block; padding: 5px 0 10px; width: 328px; float: right; color:#000; } /* ----- NEW CAR DETAILS PAGE ----- */ #newCarJumps {} #newCarJumps a { display: block; width: 351px; height: 28px; float: left; margin-left: 7px; margin-bottom: 7px; } #newCarJumps a#jumpBrochure { background: url(../images/layup/spriteNewCarJumps.gif) 0px 0px no-repeat; } #newCarJumps a#jumpAdvice { background: url(../images/layup/spriteNewCarJumps.gif) -351px 0px no-repeat; } #newCarJumps a#jumpSite { background: url(../images/layup/spriteNewCarJumps.gif) 0px -28px no-repeat; } #newCarJumps a#jumpOffers { background: url(../images/layup/spriteNewCarJumps.gif) -351px -28px no-repeat; } #newCarJumps a#jumpTestDrive { background: url(../images/layup/spriteNewCarJumps.gif) 0px -56px no-repeat; } #newCarJumps a#jumpValue { background: url(../images/layup/spriteNewCarJumps.gif) -351px -56px no-repeat; } #newCarJumps a#jumpBrochure:hover { background: url(../images/layup/spriteNewCarJumps.gif) 0px -84px no-repeat; } #newCarJumps a#jumpAdvice:hover { background: url(../images/layup/spriteNewCarJumps.gif) -351px -84px no-repeat; } #newCarJumps a#jumpSite:hover { background: url(../images/layup/spriteNewCarJumps.gif) 0px -112px no-repeat; } #newCarJumps a#jumpOffers:hover { background: url(../images/layup/spriteNewCarJumps.gif) -351px -112px no-repeat; } #newCarJumps a#jumpTestDrive:hover { background: url(../images/layup/spriteNewCarJumps.gif) 0px -140px no-repeat; } #newCarJumps a#jumpValue:hover { background: url(../images/layup/spriteNewCarJumps.gif) -351px -140px no-repeat; } /* ----- USED CAR LIST ----- */ #sortOptions #sortUsedCars { float: right; width: 187px; } #sortUsedCars label { width: 55px; position: relative; top: 2px; } #usedList {} #usedList .listItem { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px solid #bababa; } #usedList .listItem .itemImage { width: 204px; position:relative; float: left; } #usedList .listItem .itemImage img { border: 1px solid #787878; } #usedList .listItem .itemImage .overlay { position:absolute; left:0; top:0; } #usedList .listItem .itemContent { width: 471px; float: right; } #usedList .listItem .itemContent .itemTitle { font-size: 18px; display: block; padding: 0px 0px 10px 0px; } #usedList .listItem .itemContent .tblSpec { padding-bottom: 15px; } #usedList .listItem .itemContent .tblSpec td { padding: 2px 10px 2px 0px; } #usedList .listItem .itemContent .price { width: 200px; float: left; } #usedList .listItem .itemContent .price a { font-weight: normal; text-decoration: none; font-size: 18px; display: block; padding: 0px 0px 0px 0px; } #usedList .listItem .itemContent .btnSave { float: right; margin-right: 20px; padding-top: 3px; } #usedList .listItem .itemContent .btnMoreDetails { float: right; padding-top: 3px; } /* ----- USED CAR DETAIL ----- */ #usedCarPhoto { width: 335px; float: right; margin-bottom: 27px; } #usedCarPhoto .largePhoto { border: 1px solid #787878; margin-bottom: 4px; } #usedCarPhoto #usedCarThumbs { width: 335px; height: 80px; position: relative; } #usedCarPhoto #usedCarThumbs .thumb { border: 1px solid #787878; float: left; margin-right: 7px; cursor:pointer; } #usedCarPhoto #usedCarThumbs .btnLeft { position: absolute; top: 1px; left: 1px; z-index: 1099; } #usedCarPhoto #usedCarThumbs .btnRight { position: absolute; top: 1px; left: 317px; z-index: 99999; } #usedCarPhoto #usedCarThumbs #thumbContainer { width: 335px; height: 80px; overflow: hidden; position: relative; } #usedCarPhoto #usedCarThumbs #thumbContainer .overflowWidth { width: 4000px; } #usedCarThumbsPrint { display: none; } #usedCarInfo { width: 360px; float: left; margin-bottom: 27px; } #usedCarInfo .title { font-size: 18px; padding-bottom: 15px; } #usedCarInfo .price { padding: 10px; font-size: 28px; } #usedCarInfo .location { padding: 10px; } #usedCarInfo .location span { font-weight: bold; } #usedCarInfo #usedCarJumps {} #usedCarInfo #usedCarJumps a { display: block; height: 28px; width: 351px; background: url(../images/layup/spriteUsedCarJumps.gif) no-repeat; margin-bottom: 7px; } #usedCarInfo #usedCarJumps a#jumpEnquire { background: url(../images/layup/spriteUsedCarJumps.gif) right 0px no-repeat; } #usedCarInfo #usedCarJumps a#jumpValue { background: url(../images/layup/spriteUsedCarJumps.gif) right -28px no-repeat; } #usedCarInfo #usedCarJumps a#jumpSave { background: url(../images/layup/spriteUsedCarJumps.gif) right -56px no-repeat; } #usedCarInfo #usedCarJumps a#jumpFriend { background: url(../images/layup/spriteUsedCarJumps.gif) right -84px no-repeat; } #usedCarInfo #usedCarJumps a#jumpEnquire:hover { background-position: left 0px; } #usedCarInfo #usedCarJumps a#jumpValue:hover { background-position: left -28px; } #usedCarInfo #usedCarJumps a#jumpSave:hover { background-position: left -56px; } #usedCarInfo #usedCarJumps a#jumpFriend:hover { background-position: left -84px; } #usedCarInfo #financeOptions { display: block; padding: 10px; } #usedCarInfo #financeOptions span { font-weight: bold; } /* Alternative version 1 - overhangs page right edge: #usedCarPhoto { width: 335px; float: right; margin-bottom: 27px; } #usedCarPhoto .largePhoto { border: 1px solid #787878; margin-bottom: 4px; margin-left:17px; width: 333px; } #usedCarPhoto #usedCarThumbs { width: 352px; height: 80px; position: relative; } #usedCarPhoto #usedCarThumbs .btnRight { position: absolute; top: 1px; left: 352px; z-index: 1099; } #usedCarPhoto #usedCarThumbs #thumbContainer { margin-left: 17px; width: 335px; height: 80px; overflow: hidden; position: relative; } #usedCarInfo { width: 360px; float: left; margin-bottom: 27px; } #usedCarInfo #usedCarJumps a { display: block; height: 28px; width: 351px; background: url(../images/layup/spriteUsedCarJumps.gif) no-repeat; margin-bottom: 7px; } */ /* Alternate version 2 (requires resized images): #usedCarPhoto { width: 355px; float: right; margin-bottom: 27px; } #usedCarPhoto .largePhoto { border: 1px solid #787878; margin-bottom: 4px; margin-left:17px; width: 333px; } #usedCarPhoto #usedCarThumbs { width: 352px; height: 80px; position: relative; } #usedCarPhoto #usedCarThumbs .btnRight { position: absolute; top: 1px; left: 352px; z-index: 1099; } #usedCarPhoto #usedCarThumbs #thumbContainer { margin-left: 17px; width: 335px; height: 80px; overflow: hidden; position: relative; } #usedCarInfo { width: 340px; float: left; margin-bottom: 27px; } #usedCarInfo #usedCarJumps a { display: block; height: 28px; width: 331px; background: url(../images/layup/spriteUsedCarJumps.gif) no-repeat; margin-bottom: 7px; } */ #relatedVehicles {} #relatedVehicles .heading { padding: 0px 0px 10px 13px; } #relatedVehicles .listItem { margin-right: 41px; float: left; } #relatedVehicles .listItem.lastItem { margin-right: 0px; } #relatedVehicles .listItem a { display: block; text-decoration: none; } #relatedVehicles .listItem .thumb { display: block; border: 1px solid #787878; width: 202px; } #relatedVehicles .listItem .title { display: block; padding: 5px; } /* ----- OFFER DETAILS ----- */ #frmOfferContact { padding-top: 10px; } #frmOfferContact label { width: 83px; } #frmOfferContact textarea { width: 270px; float: right; height: 102px; } #frmOfferContact #enquiryDetails { float: right; width: 365px; } #frmOfferContact div { margin-bottom: 4px; } #frmOfferContact input { width: 200px; } #frmOfferContact select { width: 204px; } #frmOfferContact input#submit { width: 121px; } /* ----- CONTACT PAGE ----- */ #dealerPhoto { border: 1px solid #787878; float: left; margin-bottom: 18px; } #dealerPhoto #getDriections { background: #a0a0a0; height: 35px; width: 335px; } #dealerPhoto #getDriections form { padding: 7px 7px 0px 7px; } #dealerPhoto #getDriections #btnGo { float: right; width: 122px; height: 18px; } #dealerPhoto #getDriections #saddr { width: 132px; float: left; } #dealerMap { border: 1px solid #787878; float: right; margin-bottom: 18px; } #dealerMap #map { width: 333px; height: 216px; } #dealerDetails { width: 340px; float: left; } #dealerDetails .dealerAddress { margin-bottom: 15px; } #dealerDetails .dealerOpeningTimes table { width: 100%; } #dealerDetails .dealerOpeningTimes table td, #dealerDetails .dealerOpeningTimes table th { padding: 2px 5px 2px 5px; } #dealerContact { width: 335px; float: right; } #dealerContact form label { width: 122px; } #dealerContact form input#submit { padding-right: 6px; } #dealerContact form textarea { height: 60px; } /* ----- GLOBAL CLASSES ----- */ .clear { clear:both; display: block; } .clearSmall { clear: both; display: block; height: 0; line-height: 0; font-size: 0; } .hide { display:none; } .show { display:block; } .printShow { display:none; } .printHide { display:block; } .float_left { float:left !important; } .float_right { float:right !important; } .align_left { text-align:left !important; } .align_center { text-align:center !important; } .align_right { text-align:right !important; } .align_justify { text-align:justify !important; } .align_bottom { vertical-align:bottom !important; } .image_right { float:right; margin:0 0 15px 15px; } .image_left { float:left; margin:0 15px 15px 0; } .image_center { margin:0 auto; } .hand { cursor:pointer; } .seo {text-decoration:none;font-weight:normal;} .width60 { width: 60px; } .usedTitle { font-size: 18px; font-weight: normal; padding: 10px; border-top: 1px solid #BABABA; } /* ----- HEADINGS & PARAGRAPHS ----- */ h1, h2, h3, h4, h5, h6 { margin:0; padding:0 0 10px 0; font-size:100%; font-weight:bold;} h1 { font-size: 18px; font-weight: normal; } p { padding:0 0 10px 0; margin:0; } /* ----- TOP NAVIGATION ----- */ #primaryNav { background: url(../images/layup/headerNavLine.gif) right 23px no-repeat; margin: 2px 4px 0px 0px; float: right; width: 650px; } /* added width to fix the logo dissapearing in ie6 */ #primaryNav ul { list-style: none; margin: 0px; padding: 0px; height: 24px; float: right; clear: right; } #primaryNav li { padding: 0px; margin: 0px; float: left; } #primaryNav li a { display: block; font-weight: normal; text-decoration: none; padding: 4px 11px 6px 11px; color: #FFFFFF; } #primaryNav ul#navBottom li a { padding: 4px 7px 7px 7px; } /* bottom nav ul has 1px more padding on bottom to line up with bottom of the header */ #primaryNav li a:hover, #primaryNav li.active a { background: #FFFFFF; color: #33457d; } #primaryNav a.navShop:hover { background: none; color: #FFF; text-decoration: underline; } /* ----- SECONDARY NAVIGATION ----- */ #secondaryNav {} #secondaryNav ul { list-style: none; margin: 0; padding: 0; } #secondaryNav li { } #secondaryNav li a { text-decoration: none; } /* ----- DROPDOWN NAV ----- */ #primaryNav ul li ul { left: -999em; position: absolute; } #primaryNav ul li:hover ul, #primaryNav ul li.sfhover ul { left: auto; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; display: block; width: 200px; } #primaryNav ul li:hover ul li, #primaryNav ul li.sfhover ul li { display: block; padding: 4px 0px 0px 0px; margin: 0px; background: #ececec; width: 200px; height: 20px; border-bottom: 1px solid #CFCFCF; border-left: 1px solid #CFCFCF; border-right: 1px solid #CFCFCF; } #primaryNav ul li:hover ul li a, #primaryNav ul li.sfhover ul li a { padding: 0px 5px 5px 10px; margin: 0px; color: #666666; } #primaryNav ul li:hover ul li a:hover, #primaryNav ul li.sfhover ul li a:hover { padding: 0px 5px 5px 10px; margin: 0px; color: #000; } #modelNav ul li ul { padding: 10px 0px 10px 0px !important; width: 200px !important; left: -999em; position: absolute; border: 1px solid #e6e5e5; border-top: none; } #modelNav ul li:hover ul, #modelNav ul li.sfhover ul { left: auto; margin: 0px 0px 0px -1px !important; display: block; background: #FFFFFF; } #modelNav ul li:hover ul li, #modelNav ul li.sfhover ul li { width: 200px; display: block; padding: 0px 0px 0px 0px; margin: 0px; background: url(../images/layup/arrowBlue.gif) no-repeat 10px 10px; } #modelNav ul li:hover ul li a, #modelNav ul li.sfhover ul li a { width: 173px; float: left; text-decoration: none; color: #33457d; padding: 5px 5px 5px 22px; margin: 0px; font-weight: normal; height: auto !important; } #modelNav ul li:hover ul li a:hover, #modelNav ul li.sfhover ul li a:hover { text-decoration: underline; } /* dropdown model nav */ #modelNav ul.modelMini li ul.firstlevel { padding: 10px 0px 10px 0px !important; width: 200px !important; left: -999em; position: absolute; border: 1px solid #e6e5e5; border-top: none; } #modelNav ul.modelMini li:hover ul.firstlevel, #modelNav ul.modelMini li.sfhover ul.firstlevel { left: auto; margin: 0px 0px 0px -1px !important; display: block; background: #FFFFFF; } #modelNav ul.modelMini li:hover ul.firstlevel li, #modelNav ul.modelMini li.sfhover ul.firstlevle li { width: 200px; display: block; padding: 0px 0px 0px 0px; margin: 0px; background: url(../images/layup/arrowRed.gif) no-repeat 10px 10px; } #modelNav ul.modelMini li:hover ul.firstlevel li a, #modelNav ul.modelMini li.sfhover ul.firstlevel li a { width: 173px; float: left; text-decoration: none; color: #515151; padding: 5px 5px 5px 22px; margin: 0px; font-weight: normal; height: auto !important; } #modelNav ul.modelMini li:hover ul.firstlevel li a:hover, #modelNav ul.modelMini li.sfhover ul.firstlevel li a:hover { text-decoration: underline; } /* dropdown model nav sub */ #modelNav ul.modelMini li ul li ul.secondlevel { padding: 7px 0px 7px 0px !important; width: 200px !important; left: -999em; position: absolute; border: 1px solid #9b9b9b; background: #fff !important; } #modelNav ul.modelMini li ul li:hover ul.secondlevel, #modelNav ul.modelMini li ul li.sfhover ul.secondlevel { left: 202px; margin: -10px 0px 0px -1px !important; display: block; background: #FFFFFF; } #modelNav ul.modelMini li ul li:hover ul.secondlevel li, #modelNav ul.modelMini li ul li.sfhover ul.secondlevel li { width: 200px; display: block; padding: 0px 0px 0px 0px; margin: 0px; background: #fff url(../images/layup/arrowRed.gif) no-repeat 10px 10px; } #modelNav ul.modelMini li ul li ul.secondlevel li a { width: 173px; float: left; text-decoration: none; color: #515151; padding: 5px 5px 5px 22px !important; margin: 0px; font-weight: normal; height: auto !important; } #modelNav ul.modelMini li ul li:hover ul.secondlevel li a, #modelNav ul.modelMini li ul li.sfhover ul.secondlevel li a { width: 173px; float: left; text-decoration: none; color: #515151; padding: 5px 5px 5px 22px !important; margin: 0px; font-weight: normal; height: auto !important; } #modelNav ul.modelMini li ul li:hover u.secondlevell li a:hover, #modelNav ul.modelMini li ul li.sfhover ul.secondlevel li a:hover { text-decoration: underline; } /* ----- SITE MAP ----- */ #sitemapContainer { padding: 20px; } .sitemap { list-style:none; margin:0 0 0 5px; padding:0;} .sitemap ul { list-style:none; margin:10px 0 0px 15px; padding:0;} .sitemap li { background:url(../images/layup/bulletSitemap.gif) 0px 11px no-repeat; padding:6px 0 5px 15px;} /* ----- BREADCRUMBS/PAGINATION/PAGE TOP AND BOTTOMS ----- */ #breadcrumbs { line-height: normal; padding: 0px 0px 20px 0px; } #pageDetails #breadcrumbs { padding: 5px 15px 0px 15px; } #breadcrumbs span { color: #2465a6; font-weight: bold; } #breadcrumbs a { font-weight: normal; text-decoration: none; padding: 2px 5px 4px 0px; color: #787878; } #pageDetails #breadcrumbs a { color: #FFFFFF; } #breadcrumbs .btnBack { float: right; padding: 0px; } .pagination ul { padding: 0px; margin: 0px; list-style: none; } .pagination ul li { float: left; } .pagination { width:170px; float: right; } .pagination a { padding: 0px 4px 0px 4px; text-decoration: none; background: #c1c1c1; margin-left: 4px; color: #FFFFFF; } .pagination a:hover { text-decoration: none; background:#787878; } .pagination .active { text-decoration: none; background:#787878; } .pagination span { display: block; float: left; padding: 0px 2px 0px 2px; } /* ----- FOOTER ----- */ #footer { height: 156px; margin: -156px 0 0 0; text-align: left; background:#e4e4e4 url(../images/layup/footerBg.gif) repeat-x bottom; } #footer #footerBg { background: url(../images/layup/footerStripBg.gif) repeat-x top left; } #footer .padding { width: 958px; margin: 0px auto 0 auto; } #footer a { font-weight:normal; text-decoration:none;} #footer a:hover { text-decoration:underline;} #footer ul#footerNav { padding: 0px; margin: 0px; list-style: none; height: 19px; margin-bottom: 1px; } #footer ul#footerNav li { background: #4c4c4c; border-right: 1px solid #FFFFFF; float: left; } #footer ul#footerNav li a { display: block; float: left; color: #FFFFFF; text-decoration: none; font-weight: normal; padding: 2px 9px 1px; } #footer #footerContent { height: 104px; width: 918px; background: #f2f2f2; padding: 20px 20px 0px 20px; } #footer #footerContent p { padding-top: 20px; } #footer .footerBox { width: 435px; float: left; } #footer .footerBox .title { padding: 0px 0px 10px 0px; } #footer .footerBox a { display: block; text-decoration: none; font-weight: normal; width: 217px; float: left; } #footer .footerBox a:hover { text-decoration: underline; } /* ----- GLOBAL ----- */ img { display:block; border:0; } address { font-style:normal; } /* ----- LINKS ----- */ a { color:#787878; font-weight:bold; text-decoration:underline;cursor:pointer; outline: none; } a:hover { text-decoration:none; } /* ----- FORMS ----- */ form { padding:0; margin:0; } fieldset { padding:0; margin:0; border:0px none; } legend { padding:0; margin:0; display:none; } label { display:block; width:260px; float:left; } input, textarea { width:200px; font-size:11px !important;} .required { color:#2465A6;} .checkRadio { width:20px !important; position:relative; left:-7px;} #frmContact { margin-bottom:15px;} #frmContact p { padding:7px 0;} #frmContact select { width:204px;} #frmContact div { margin-bottom:10px;} #submit { width:121px; height:18px; border:none;} #btnUsedSearch { width: 96px; height: 28px; float: right; } .sideRadios { float:left; width:76px;} .sideRadios label { float:right; width:49px;} .radioTitle { float:left; padding:0px 16px 0px 9px;} .radioTitle p { padding:0;} .vehicleConditionRadios { width:77px !important; margin:0 !important; padding:0 !important;} /* cms forms */ #contactForm { margin: 10px; background: #dfdfdf; border: 1px solid #999999; padding-top: 10px; } #contactForm form { margin: 0px; padding: 0px; } /* Part Exchange Form */ .partExchangeValuationHolder .container .padding { margin:0px 2px 0px 2px; padding:0 !important} .partExchangeValuationHolder .padding2 { padding:11px 17px 0px 17px !important;} .partExchangeValuationHolder .container .titlePadding { padding:0px 0px 0px 17px;} .partExchangeValuationHolder .container .box { padding:9px 0px 5px 17px;} .partExchangeValuationHolder .container .box label { width:150px;} .partExchangeValuationHolder .container .box input { width:147px;} .partExchangeValuationHolder .container .box .short { width:45px !important;} .partExchangeValuationHolder .container .box select { width:151px;} .partExchangeValuationHolder .container .box span { padding:0px 8px 0px 0px;} .partExchangeValuationHolder .container .checkRadio {margin:0px 0px 0px 5px; padding:0;} .partExchangeValuationHolder .container .yourDetails {} .partExchangeValuationHolder .container .blue { background:#e8f5fe;} .partExchangeValuationHolder .container .long textarea { width:305px; height:71px;} .partExchangeValuationHolder .container .box.radioBox { padding:3px 0px 3px 0px !important;} .partExchangeValuationHolder .container .box2 { padding:9px 0px 5px 17px; background:#e8f5fd;} .partExchangeValuationHolder .container .box2 label { width:353px;} .partExchangeValuationHolder .container .box .sideRadios { float:left; width:76px;} .partExchangeValuationHolder .container .box .sideRadios label { float:right; width:49px;} .partExchangeValuationHolder .container .box.twoDropDowns select { width:72px !important; margin-right:3px} .partExchangeValuationHolder .container .box .radioTitle { float:left; padding:0px 16px 0px 9px;} .partExchangeValuationHolder .container .box .radioTitle p { padding:0;} .partExchangeValuationHolder .container .box .vehicleConditionRadios { width:77px !important; margin:0 !important; padding:0 !important;} .partExchangeValuationHolder .container .submitHolder { padding:11px 0px 0px 223px} /* ----- Prototype Validation ----- */ input.disabled { border: 1px solid #F2F2F2; background-color: #F2F2F2; } input.validation-failed, textarea.validation-failed, select.validation-failed { border: 1px solid #f30; color : #FF3300; } input.validation-passed, textarea.validation-passed, select.validation-passed { border: 1px solid #00CC00; color : #000; } .validation-advice { margin: 5px 0; width:452px; padding: 5px; background-color: #2465A6; color : #FFF; font-weight: bold; } .validation-advice-mini { margin: 5px 0; width:auto; padding: 5px; background-color: #2465A6; color : #FFF; font-weight: bold; clear: both; } /* ----- TABLES ----- */ table { border-collapse:collapse; } table p { padding:0px; } /* ----- STOCK UPDATES FORM ----- */ #promoForm { padding:12px 0 0 19px; } #promoForm .signupBoxes { margin-bottom:20px; margin-top:10px;} #promoForm .signupBoxes label { float:left; width:450px; position:relative; top:4px;} #promoForm .signupBoxes input { float:left; width: 14px; margin-right: 10px;} #promoForm select { width:125px !important; margin-bottom: 10px; display:block; margin-right:15px;} #promoForm .carSelects { padding-top:18px;} #promoForm .submitButton { margin:5px 0 20px 0;} /* ----- DOMTABS ----- */ .domTabs { } .domContent { width: 675px; background: #f0f0f0; padding: 15px 10px 15px 10px; margin-bottom: 20px; } .domContent table td { padding: 2px 5px 2px 5px; } .domContent #additionalDets { width: 210px; float: right; padding: 0px 10px 0px 10px; border-left: 1px solid #a8a8a8; } .dt1 { display: block; } ul.domHeadings { padding: 0px; margin: 0px; list-style: none; } ul.domHeadings li { float: left; } ul.domHeadings li a { display: block; float: left; height: 33px; text-decoration: none; } ul.domHeadings li a span { visibility: hidden; } ul.domHeadings li a.dt1 { width: 144px; background: url(../images/layup/spriteDomTabs.gif) 0px 0px no-repeat; } ul.domHeadings li a.dt2 { width: 134px; background: url(../images/layup/spriteDomTabs.gif) -144px 0px no-repeat; } ul.domHeadings li a.dt3 { width: 97px; background: url(../images/layup/spriteDomTabs.gif) -278px 0px no-repeat; } ul.domHeadings li a.dt4 { width: 99px; background: url(../images/layup/spriteDomTabs.gif) -375px 0px no-repeat; } ul.domHeadings li a.dt1:hover, ul.domHeadings li.active a.dt1 { background-position: 0px bottom; } ul.domHeadings li a.dt2:hover, ul.domHeadings li.active a.dt2 { background-position: -144px bottom; } ul.domHeadings li a.dt3:hover, ul.domHeadings li.active a.dt3 { background-position: -278px bottom; } ul.domHeadings li a.dt4:hover, ul.domHeadings li.active a.dt4 { background-position: -375px bottom; } /* .backButton { padding-top: 40px; } */ /* ----- SAVE AND COMPARE ----- */ #compareVehicles {} #compareVehicles th { padding:5px 0; background:#d7d7d7; color:#000000; } #compareVehicles th.whiteBg { background:#fff; } #compareVehicles td { background:#eee; border:1px solid #fff; }