/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Title : Author : Chris Munn / chris.munn@gforces.co.uk / G-Forces Web Management Ltd Type: Screen, Projection Description : Screen and projection stylesheet for 06 Vauxhall site - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* COMMON AND GLOBAL */ html { height: 100%; } body { height: 100%; font:62.5%/1.6 arial, verdana, helvetica, sans-serif; margin:0; padding:0; background:#ffffff url(../images/layup/bodyBgInternal.jpg) top center no-repeat; color:#000000; 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! */ * html #container{ height: 100%; } /* ----- IDS ----- */ #container { min-height: 100%; width:960px; margin:0 auto; text-align:left; font-size:110%; line-height: normal; background: url(../images/layup/containerBgInternal.jpg) top left no-repeat; } #printHeader { display:none;} #header { height: 109px; position: relative; } #header #logo { position: absolute; top: 12px; left:0px; } #header #contactDetails { position: absolute; top: 28px; right: 90px; } #header #badge { position: absolute; top: 12px; right: 0px; } /* ----- LEFT COLUMN ----- */ #leftCol { float: left; width: 230px; } #leftCol .padding { padding: 0px 0px 0px 0px; } #leftCol .box { margin-bottom: 20px; } #leftCol .usedCarSearch { background:#626262 url(../images/layup/usedSearchBg.jpg) no-repeat; min-height: 251px; margin-bottom: 14px; } #leftCol .usedCarSearch .domTabs { padding: 54px 15px 0px 15px; } #leftCol .usedCarSearch select { width: 198px; margin-bottom: 10px; border-color: #4e4e4e; } #leftCol .usedCarSearch #usedSearchBtns a, #leftCol .usedCarSearch #usedSearchBtns2 a { color: #FFF; } #leftCol .liveChatBox { position:relative; background:url(../images/layup/liveChatBg.jpg) no-repeat; width:230px; height:135px; margin-bottom: 20px; } #leftCol .liveChatBox #orms { position:absolute; left:15px; top:85px; } #leftCol .liveChatBox #skel { position:absolute; left:15px; top:45px; } #leftCol #favourites { width:230px; height:161px; background:url(../images/layup/favouritesBg.jpg) no-repeat left top; } #leftCol #favourites .padding { padding:59px 0 0; } #leftCol #favourites .fav { width:54px; height:40px; padding:1px 0 0 1px; margin:0 0 15px 16px; display:inline; float:left; position:relative; } #leftCol #favourites .fav .frame { position:absolute; left:0; top:0; } #leftCol #favourites .one { background:url(../images/layup/favourites1.gif) no-repeat left top; } #leftCol #favourites .two { background:url(../images/layup/favourites2.gif) no-repeat left top; } #leftCol #favourites .three { background:url(../images/layup/favourites3.gif) no-repeat left top; } #leftCol #favourites .btnRetrieve { margin:0 0 0 13px; display:inline; float:left; } #leftCol #favourites .btnCompare { margin:0 13px 0 0; display:inline; float:right; } /* ----- RIGHT COLUMN ----- */ #rightCol { float: right; width: 711px; } #rightCol .padding { padding: 0px 0px 0px 0px; } #rightCol #mainImage { margin-bottom: 24px; margin-top: 3px; margin-left: 3px; position: relative; } #rightCol #mainImage .offerImage { margin: 0px; } #rightCol #homeJumps { height: 165px; margin-bottom: 20px; } #rightCol #homeJumps a { float: left; } #rightCol #homeJumps #jumpNewCars { display: block; position: relative; width: 232px; height: 165px; } #rightCol #homeJumps #jumpNewCars .position { display: block; position: absolute; top: 80px; left: 75px; } #rightCol #homeJumps #jumpUsedCars { display: block; position: relative; width: 244px; height: 165px; } #rightCol #homeJumps #jumpUsedCars .position { display: block; position: absolute; top: 75px; left: 90px; } #rightCol #homeJumps #jumpPartners { display: block; position: relative; width: 235px; height: 165px; } #rightCol #homeJumps #jumpPartners .position { display: block; position: absolute; top: 75px; left: 90px; } /* ----- HOME OFFER CONTROLS ----- */ #rightCol #offerControls { z-index:999; width: 266px; height: 226px; position: absolute; top: 15px; right: 20px; background: url(../images/layup/offerControlsBg.png) no-repeat; } #rightCol #offerControlsBg { width: 266px; height: 226px; position: absolute; top: 15px; right: 20px; z-index: 1000; } #rightCol #offerControlsBg #offerContent { padding: 15px; } #rightCol #offerControlsBg #controlPrev a { display: block; width: 70px; height: 35px; background: url(../images/layup/ie6LinkFix.gif); position: absolute; bottom: 0px; left: 0px; z-index: 999999; } #rightCol #offerControlsBg #controlAll a { display: block; width: 130px; height: 35px; background: url(../images/layup/ie6LinkFix.gif); position: absolute; bottom: 0px; left: 70px; z-index: 999999; } #rightCol #offerControlsBg #controlNext a { display: block; width: 66px; height: 35px; background: url(../images/layup/ie6LinkFix.gif); position: absolute; bottom: 0px; left: 200px; z-index: 999999; } /* ----- CMS IMAGE ----- */ .internalImage { float: right; margin: 0px 0px 15px 15px; position: relative; } .internalImage .position { padding: 0px 3px 0px 0px; } .internalImage .frame { position: absolute; top: -3px; left: -3px; } .internalImage .noImage { width: 288px; height: 216px; background: url(../images/layup/noImage288x216.jpg) no-repeat; } /* ----- OFFER BANNER IMAGE ----- */ .offerImage { position: relative; margin: 3px 0px 23px 3px; } .offerImage .frame { position: absolute; top: -3px; left: -3px; z-index:999; } /* ----- SUBPAGE NAV ----- */ #subNavigation { width: 294px; float: right; clear: right; margin: 0px 0px 15px 15px; } #subNavigation ul { list-style: none; padding: 0px; margin: 0px -3px 0px 0px; } #subNavigation ul li { background:#6d6d6d url(../images/layup/subPageBg.gif) no-repeat; border-bottom: 1px solid #888888; width: 294px; float: left; } #subNavigation ul li.firstItem { background:#6d6d6d url(../images/layup/subPageTopBg.gif) no-repeat; } #subNavigation ul li.lastItem { background:#6d6d6d url(../images/layup/subPageBotBg.gif) bottom no-repeat; border-bottom: none; } #subNavigation ul li a { text-decoration: none; font-weight: bold; font-size: 1.2em; color: #FFFFFF; display: block; padding: 15px 25px 15px 15px; border-bottom: 1px solid #595959; } #subNavigation ul li.lastItem a { border-bottom: none; } /* ----- LIST ----- */ #list {} #list .listItem {} #list .listItem a { display: block; } #list .listItem .thumb { display: block; } #list .listItem .thumb .frame { display: block; } #list .listItem .title { display: block; } #list .listItem .description { display: block; } #list .listItem .btn { display: block; } /* ----- BOX LIST ----- */ #boxList {} #boxList .box { width: 223px; float: left; margin-right: 20px; } #boxList .box.lastItem { margin-right: 0px; } #boxList .box a { display: block; border-bottom: 1px solid #dedede; padding-bottom: 30px; text-decoration: none; margin-bottom: 15px; } #boxList .box .thumb { display: block; position: relative; width: 216px; height: 162px; background: url(../images/layup/noImageCMS216x162.gif) no-repeat; } #boxList .box .thumb .frame { display: block; position: absolute; top: -3px; left: -3px; } #boxList .box .thumb .btnView { display: block; position: absolute; bottom: -18px; left: 55px; } #boxList .box .title { display: block; font-size: 1.4em; color: #6b6b6b; padding-bottom: 15px; } /* ----- NEW CAR DETAIL ----- */ #newCarImg { width: 345px; float: left; margin-right: 15px; margin-bottom: 20px; } #newCarImg a { display: block; border-bottom: 1px solid #dedede; text-decoration: none; } #newCarImg .thumb { display: block; position: relative; width: 340px; height: 255px; background: url(../images/layup/noImage340x255.gif) no-repeat; } #newCarImg .thumb .frame { display: block; position: absolute; top: -3px; left: -3px; z-index: 999999; } #newCarForm { width: 345px; height: 258px; background: url(../images/layup/newCarFormBg.gif) no-repeat; float: right; color: #444444; } #newCarForm.offers { margin-left: 15px; } #newCarForm .padding { padding: 13px 15px 13px 15px; } #newCarForm form { padding: 0px; margin: 0px; } #newCarForm #formTitle { height: 41px; font-size: 1.1em; } #newCarForm label { text-align: right; color: #333333; width: 55px; } #newCarForm label.long { width: 155px; text-align: left; } #newCarForm #frmContact input { width: 85px; float: right; } #newCarForm #frmContact select { width: 89px; float: right; } #newCarForm #frmContact div { width: 165px; float: left; } #newCarForm #frmContact div.short { width: 150px; float: left; } #newCarForm #frmContact div.long { width: 315px; float: left; } #newCarForm #frmContact textarea { width: 235px; float: right; height: 50px; } #newCarForm #frmContact div { margin-bottom: 5px; } #newCarForm #frmContact input.checkRadio { float: left; width: 20px; } #frmContact input#btnSubmitNewCar { width: 88px; height: 33px; } #newCarJumps { width: 710px; height: 56px; position: relative; margin-bottom: 15px; } #newCarJumps a { display: block; float: left; height: 56px; } /* ----- LOCATION CONTACT FORM DETAIL ----- */ #contactLocationForm { width: 710px; height: 258px; background: url(../images/layup/locationCarFormBg.gif) no-repeat; float: right; color: #444444; margin-top:20px;} #contactLocationForm.offers { } #contactLocationForm .padding { padding: 13px 15px 13px 15px; } #contactLocationForm form { padding: 0px; margin: 0px; } #contactLocationForm #formTitle { height: 41px; font-size: 1.1em; } #contactLocationForm label { text-align: left; color: #333333; width: 110px; } #contactLocationForm label.long { width: 160px; text-align: left; } #contactLocationForm #frmContact input { width: 172px; } #contactLocationForm #frmContact select { width: 175px; } #contactLocationForm #frmContact div { width: 309px; } #contactLocationForm #frmContact div.clear { width: auto; float: none; } #contactLocationForm #frmContact div.short { width: 309px; } #contactLocationForm #frmContact div.long { width: 360px; float: right; } #contactLocationForm #frmContact textarea { width: 350px; float: left; height: 122px; } #contactLocationForm #frmContact div { margin-bottom: 5px; } #contactLocationForm #frmContact input.checkRadio { float: left; width: 20px; } /* ----- RECRUITMENT CONTACT FORM DETAIL ----- */ #recruitmentFormDiv { width: 710px; height: 258px; background: url(../images/layup/locationCarFormBg.gif) no-repeat; float: right; color: #444444; margin-top:20px;} #recruitmentFormDiv.offers { } #recruitmentFormDiv .padding { padding: 13px 15px 13px 15px; } #recruitmentFormDiv form { padding: 0px; margin: 0px; } #recruitmentFormDiv #formTitle { height: 41px; font-size: 1.1em; } #recruitmentFormDiv label { text-align: left; color: #333333; width: 110px; } #recruitmentFormDiv label.long { width: 160px; text-align: left; } #recruitmentFormDiv #frmContact input { width: 172px; } #recruitmentFormDiv #frmContact select { width: 175px; } #recruitmentFormDiv #frmContact div { width: 309px; } #recruitmentFormDiv #frmContact div.clear { width: auto; float: none; } #recruitmentFormDiv #frmContact div.short { width: 309px; } #recruitmentFormDiv #frmContact div.long { width: 360px; float: right; } #recruitmentFormDiv #frmContact textarea { width: 350px; float: left; height: 122px; } #recruitmentFormDiv #frmContact div { margin-bottom: 5px; } #recruitmentFormDiv #frmContact input.checkRadio { float: left; width: 20px; } /* ----- OFFER LIST ----- */ #offerList .listItem { margin-bottom: 20px; border-bottom: 1px solid #dedede; padding-bottom: 20px; } #offerList .listItem a { display: block; text-decoration: none; } #offerList .listItem .itemImage { padding: 3px 0px 0px 3px; } #offerList .listItem .thumb { display: block; position: relative; width: 349px; height: 125px; background: url(../images/layup/noImage349x125.gif) no-repeat; } #offerList .listItem .thumb .frame { display: block; position: absolute; top: -3px; left: -3px; } #offerList .listItem .itemImage { width: 363px; float: left; } #offerList .listItem .itemContent { width: 345px; float: left; } #offerList .listItem .itemContent .itemDetails { width: 345px; } #offerList .listItem .itemContent .itemDetails .padding { padding: 0px 15px 15px 5px; } #offerList .listItem .itemContent .itemDetails h2 { padding: 0px; } #offerList .listItem .itemContent .itemDetails h2.price { padding: 15px 0px 15px 0px; } /* ----- USED CAR LIST ----- */ .usedOptions { color: #000000; padding: 0px 0px 10px 0px; margin: 0px 0px 10px 0px; } .usedOptions #sortUsedCars label { width: 50px; font-weight: bold; } .usedOptions #sortUsedCars { width: 200px; float: left; margin-left: 30px; } .usedOptions #sortUsedCars2 label { width: 50px; font-weight: bold; } .usedOptions #sortUsedCars2 { width: 200px; float: left; margin-left: 30px; } #usedList .listItem { margin-bottom: 20px; } #usedList .listItem a { display: block; text-decoration: none; } #usedList .listItem .itemImage { padding: 3px 0px 0px 3px; } #usedList .listItem .thumb { display: block; position: relative; width: 216px; height: 162px; background: url(../images/layup/noImage216x162.gif) no-repeat; } #usedList .listItem .thumb .frame { display: block; position: absolute; top: -3px; left: -3px; } #usedList .listItem .itemImage { width: 230px; float: left; } #usedList .listItem .itemContent { width: 477px; float: left; } #usedList .listItem .itemContent .itemTitle { width: 447px; height: 25px; background: url(../images/layup/usedListTitleBg.gif) no-repeat; font-weight: bold; font-size: 1.4em; color: #FFF; padding: 8px 15px 0px 15px; margin-bottom: 10px; } #usedList .listItem .itemContent .itemDetails { width: 477px; height: 124px; background: url(../images/layup/usedListDetailsBg.gif) no-repeat; } #usedList .listItem .itemContent .itemDetails .padding { padding: 10px 15px 15px 15px; } #usedList .listItem .itemContent .itemDetails .tblSpec { padding: 0px 0px 15px 0px; } #usedList .listItem .itemContent .itemDetails table { width: 100%; color: #454545; text-transform: uppercase; } #usedList .listItem .itemContent .itemDetails table td { padding: 2px 0px 2px 0px; } #usedList .listItem .itemContent .itemDetails .btnMoreDetails { float: right; } #usedList .listItem .itemContent .itemDetails .itemLocation { color: #2b2b2b; font-weight: bold; text-transform: uppercase; } #usedList .listItem .itemContent .itemDetails .itemLocation span { color: #a00f0d; } /* ----- USED CAR DETAIL ----- */ #usedCarPhoto { width: 345px; float: left; padding: 3px 0px 3px 3px; position: relative; margin-bottom: 20px; } #usedCarPhoto .enlarge { display: absolute; } #usedCarPhoto .special { display: absolute; } #usedCarPhoto a { display: block; border-bottom: 1px solid #dedede; text-decoration: none; } #usedCarPhoto .thumb { display: block; position: relative; width: 340px; height: 255px; background: url(../images/layup/noImage340x255.gif) no-repeat; } #usedCarPhoto .thumb .frame { display: block; position: absolute; top: -3px; left: -3px; } #usedCarInfo { width: 345px; height: 187px; background: url(../images/layup/usedDetailInfoBg.gif) no-repeat; float: right; margin-bottom: 15px; } #usedCarInfo .padding { padding: 10px; line-height: normal; } #usedCarInfo .padding .title { color: #971b19; font-size: 1.6em; font-weight: bold; height: 45px; } #usedCarInfo .padding .title span { font-size: 0.8em; } #usedCarInfo .padding .location { color: #363535; font-size: 1.2em; height: 27px; padding-top: 6px; } #usedCarInfo .padding .location span { color: #a00f0d; font-size: 1.0em; font-weight: bold; text-transform: uppercase; } #usedCarInfo .padding .price { height: 30px; color: #6b6b6b; font-weight: bold; font-size: 1.4em; padding-top: 8px; margin-bottom: 18px; } #usedCarInfo .padding .price span { color: #a00f0d; font-size: 1.2em; padding-left: 10px; } #usedCarThumbs { float: right; width: 345px; clear: right; margin-bottom: 20px; } #usedCarThumbs .thumb { float: left; cursor: pointer; position: relative; margin-right: 9px; } #usedCarThumbs .thumb.lastItem { margin-right: 0px; } #usedCarThumbs .thumb .frame { position: absolute; top: 0px; left: 0px; } #usedCarThumbs .thumb .thumbImage { padding: 3px; } #usedCarJumps { width: 710px; height: 56px; position: relative; margin-bottom: 20px; } #usedCarJumps a { display: block; float: left; height: 56px; } #usedCarTabs { width: 458px; float: left; margin-bottom: 20px; } #usedCarTabs .domTabs {} #usedCarTabs .domTabs .domHeadings { border-bottom: 1px solid #d7d7d7; height: 41px; margin-bottom: 0px; } #usedCarTabs .domTabs .domHeadings a { display: block; height: 41px; } #usedCarTabs .domTabs .domHeadings a span { display: none; } #usedCarTabs .domTabs .domContent { color: #5d5d5d; font-size: 12px; background:#e7e7e7 url(../images/layup/domContentFooter.gif) left bottom no-repeat; border-top: 1px solid #FFF; padding: 10px 10px 10px 10px; height: 193px; overflow: auto; } #usedCarTabs .domTabs .domContent .tblVehicleSpec { padding: 0px 0px 10px 0px; } #usedCarTabs .domTabs .domContent table { width: 100%; } #usedCarTabs .domTabs .domContent table td { padding: 4px 0px 4px 0px; } #financeCalculator { float: right; width: 231px; font-family:Verdana, Arial, Helvetica, sans-serif; height: 256px; background:#e7e7e7 url(../images/layup/financeCalcFoot.gif) no-repeat left bottom; margin-bottom: 20px; } #financeCalculator .domtab { } #financeCalculator .tabset_tabs { padding: 0; margin:0; list-style:none; } #financeCalculator .tabset_tabs a { font-size: 0.9em; background: #000; color: #FFF; text-decoration:none; font-weight: bold; padding:5px 14px 6px 14px; /*border-top: 2px solid #e1e1e1; border-left: 2px solid #e1e1e1; border-right: 2px solid #e1e1e1;*/ display:block; float: left; } #financeCalculator .tabset_tabs li { float:left; margin-right: 0px; position:relative; } #financeCalculator .tabset_tabs li .calculator { position:absolute; top: -5px; right: 0px; } #financeCalculator .tabset_content table { /*border: 5px solid #e1e1e1;*/ } #financeCalculator .tabset_content form { } #financeCalculator .tabset_content select { width: 70px; font-size: 10px; font-weight: bold; font-family: Verdana, Arial, Helvetica, sans-serif; } #financeCalculator .tabset_content input { width: 67px; font-size: 1.0em; font-weight: bold; font-family: Verdana, Arial, Helvetica, sans-serif; } #financeCalculator .tabset_content td { height: 20px; font-size: 0.9em; font-family:Verdana, Arial, Helvetica, sans-serif; } #financeCalculator .tabset_content .title { vertical-align: top; font-size: 1.2em; font-weight: bold; padding-top: 10px; } #financeCalculator .tabset_content .price { vertical-align: top; color:#FF0000; font-size: 1.2em; font-weight: bold; } #relatedVehicles { width: 710px; height: 314px; background: url(../images/layup/relatedVehiclesBg.gif) no-repeat; } #relatedVehicles .padding { padding: 59px 15px 0px 15px; float: left; } #relatedVehicles .listItem { width: 329px; float: left; height: 107px; margin-bottom: 30px; margin-right: 10px; } #relatedVehicles .listItem.bottomItem { margin-bottom: 0px; } #relatedVehicles .listItem a { display: block; font-weight: normal; text-decoration: none; } #relatedVehicles .listItem .thumb { display: block; position: relative; width: 132px; height: 99px; background: url(../images/layup/noImage132x99.gif) no-repeat; float: left; margin-right: 9px; } #relatedVehicles .listItem .thumb .frame { display: block; position: absolute; top: -3px; left: -3px; } #relatedVehicles .listItem .itemDetails { display: block; float: left; width: 185px; } #relatedVehicles .listItem .itemDetails .itemHeading { display: block; color: #971b19; font-size: 1.3em; font-weight: bold; height:30px; } #relatedVehicles .listItem .itemDetails .itemSpec { display: block; color: #5d5d5d; font-size: 1.1em; height: 35px; padding-top: 5px; } #relatedVehicles .listItem .itemDetails .itemSpec span { margin-right: 15px; } #relatedVehicles .listItem .itemDetails .itemSpec span.wasPrice { margin-right: 5px; } #relatedVehicles .listItem .itemDetails .itemSpec span.nowPrice { margin: 0px; color: #ab0502; font-size: 1.1em; text-transform: uppercase; font-weight: bold; } /* ----- CONTACT PAGE ----- */ #googleMap { width: 710px; height: 162px; position: relative; border: 1px solid #6b6b6b; margin-bottom: 15px; } #googleMap .frameLeft { position: absolute; left: -1px; top: -1px; z-index: 999999; } #googleMap .frameRight { position: absolute; right: -1px; top: -1px; z-index: 999999; } .boxLeft { width: 355px; float: left; border-right: 1px solid #dedede; } .boxLeft .padding { padding: 0px 22px 0px 0px !important; } .boxRight { width: 355px; float: left; } .boxRight .padding { padding: 0px 0px 0px 21px !important; } .boxLeft .salesTimes { width: 155px; float: left; margin-bottom: 15px; } .boxRight .salesTimes { width: 155px; float: left; margin-bottom: 15px; } .boxLeft .serviceTimes { width: 155px; float: right; margin-bottom: 15px; } .boxRight .serviceTimes { width: 155px; float: right; margin-bottom: 15px; } .boxLeft .salesTimes table, .boxRight .salesTimes table, .boxLeft .serviceTimes table, .boxRight .serviceTimes table{ width: 100%; } .directionsContainer { width: 205px; height: 29px; background: url(../images/layup/directionsBg.gif) no-repeat; padding: 9px 6px 0px 122px; } .directionsContainer .btnGo { float: right; width: 36px; height: 22px; } .directionsContainer #directions, .directionsContainer #directions2 { width: 159px; } /* ----- 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; } /* ----- HEADINGS & PARAGRAPHS ----- */ h1, h2, h3, h4, h5, h6 { margin:0; padding:0 0 10px 0; font-size:100%; font-weight:bold;} h1 { font-size: 1.8em; color: #980705; } h2 { font-size: 1.4em; color: #980705; } h3 { font-size: 1.2em; color: #980705; } p { padding:0 0 10px 0; margin:0; } /* ----- TOP NAVIGATION ----- */ #primaryNav { margin: 0px 0px 10px 0px; padding: 0px 0px 0px 0px; } #primaryNav ul { list-style: none; margin: 0px; padding: 0px; height: 37px; background: url(../images/layup/primaryNavBg.jpg) no-repeat; } #primaryNav li { padding: 0px; margin: 0px; float: left; background: url(../images/layup/navSpacer.gif) right no-repeat; } #primaryNav li.lastItem { background: none; } #primaryNav li a { display: block; text-decoration: none; padding: 12px 18px 11px 17px; margin-right: 2px; color: #FFFFFF; } #primaryNav li.lastItem a { margin-right: 0px; padding: 12px 24px 11px 25px; } /* change margin / padding on last item to sit at end of the nav */ /* hover / active states */ #primaryNav li a:hover, #primaryNav li a.active { background: url(../images/layup/primaryNavActive.jpg) repeat-x; } #primaryNav li.firstItem a:hover, #primaryNav li.firstItem a.active { background: url(../images/layup/primaryNavFirstBg.jpg) top left no-repeat; } #primaryNav li.lastItem a:hover, #primaryNav li.lastItem a.active { background: url(../images/layup/primaryNavLastBg.jpg) top right no-repeat; } /* ----- 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; } /* ----- SITE MAP ----- */ #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; height: 20px; border-bottom: 1px solid #6c6c6c; margin-bottom: 10px; } #breadcrumbs a { font-weight: normal; text-decoration: none; padding: 0px; color: #3d3d3d; } #breadcrumbs a:hover { text-decoration: underline; } #breadcrumbs span { font-weight: bold; color: #93110d; } #breadcrumbs .btnBack { float: right; padding: 0px; color: #3d3d3d; font-weight: bold; } .pagination { float: right; } .pagination.bottom ul { float: right; } .pagination.bottom .typicalAPR { color: #e58d03; font-size: 13px; font-weight: bold; } .pagination ul { padding: 0px; margin: 0px; list-style: none; } .pagination ul li { padding: 0px; margin: 0px; float: left; } .pagination a { display: block; padding: 0px 4px 0px 5px; text-decoration: none; font-weight: bold; margin-right: 1px; } .pagination a.nextPrev, .pagination a.nextPrev:hover { background: none; color: #a00f0d; font-weight: bold; } .pagination a:hover { text-decoration: underline; background:#a00f0d; color:#FFFFFF; } .pagination .active { text-decoration: none; background:#a00f0d; color:#FFFFFF; font-weight: bold; } /* ----- FOOTER ----- */ #footer { font-size: 11px; padding:0; background: url(../images/layup/footerBg.jpg) repeat-x top center; text-align: center; color: #FFFFFF; height: 86px; margin-top: -86px; } #footer #footerContainer { height: 86px; width:960px; margin:0 auto; text-align:left; line-height: normal; } #footer #footerContainer .padding { padding: 25px 12px 0px 13px; } #footer a { font-weight:normal; text-decoration: underline; color: #FFFFFF; } #footer a:hover { text-decoration:underline;} /* ----- GLOBAL ----- */ img { display:block; border:0; } address { font-style:normal; } /* ----- LINKS ----- */ a { color:#000000; 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:#950402;} .checkRadio { width:20px; position:relative; left:-7px;} #frmContact { margin-bottom:15px;} #frmContact p { padding:7px 0;} #frmContact select { width:204px;} #frmContact div { margin-bottom:10px;} #submit { width:88px; height:33px; border:none;} #btnUsedSearch, #btnUsedSearch2 { width: 85px; height: 29px; float: right; } /* ----- Prototype Validation ----- */ input.disabled { border: 1px solid #F2F2F2; background-color: #950402; } input.validation-failed, textarea.validation-failed, select.validation-failed { border: 1px solid #950402; 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: #950402; color : #FFF; font-weight: bold; } /* ----- 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 ----- */ .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; } ul.domHeadings li a:hover, ul.domHeadings li.active a { background: #BCBCBC; color: #000; } /* used search tabs */ ul.domHeadings { height: 36px; margin-bottom: 10px; } ul.domHeadings li a#tabsNewCars { width: 103px; height: 36px; background: url(../images/layup/spriteUsedTabs.jpg) 0px 0px no-repeat; } ul.domHeadings li a#tabsUsedCars { width: 97px; height: 36px; background: url(../images/layup/spriteUsedTabs.jpg) -103px -36px no-repeat; } ul.domHeadings li.active a#tabsNewCars { width: 103px; height: 36px; background: url(../images/layup/spriteUsedTabs.jpg) 0px -36px no-repeat; } ul.domHeadings li.active a#tabsUsedCars { width: 97px; height: 36px; background: url(../images/layup/spriteUsedTabs.jpg) -103px 0px no-repeat; } #servicingTabs { margin-bottom: 15px; } #servicingTabs ul { margin-bottom:0px !important; height: 51px; } #servicingTabs li a { display: block; float: left; height: 51px; } #servicingTabs li a#tabSelectVehicle { background:url(../images/layup/spriteServicing.gif) 0px 0px no-repeat; height: 51px; width: 184px; margin-right: 3px; } #servicingTabs li.active a#tabSelectVehicle { background:url(../images/layup/spriteServicing.gif) 0px -51px no-repeat;} #servicingTabs li a#tabChooseService { background:url(../images/layup/spriteServicing.gif) -186px 0px no-repeat; height: 51px; width: 188px; margin-right: 3px; } #servicingTabs li.active a#tabChooseService { background:url(../images/layup/spriteServicing.gif) -186px -51px no-repeat; } #servicingTabs li a#tabExtrasBooking { background:url(../images/layup/spriteServicing.gif) -376px 0px no-repeat; height: 51px; width: 208px; } #servicingTabs li.active a#tabExtrasBooking { background:url(../images/layup/spriteServicing.gif) -376px -51px no-repeat; } #servicingTabs .domContent { background: #e7e7e7; width: 710px; } #servicingTabs .domContent .padding { padding: 0px 14px 0px 14px; width: 682px; } #servicingTabs .domContent h2 { text-align: center; color: #747474; font-weight: bold; font-size: 1.6em; } #servicingTabs .domContent #servicing1To3Years { float: left; margin-right: 13px; width: 218px; height: 226px; background: url(../images/layup/servicingJump1To3Years.gif) top left no-repeat; position: relative; } #servicingTabs .domContent #servicing1To3Years .selectVehicle { position: absolute; top: 152px; left: 35px; } #servicingTabs .domContent #servicing1To3Years .selectVehicle select { width: 148px; } #servicingTabs .domContent #servicingMasterFit99 { float: left; margin-right: 13px; width: 218px; height: 226px; background: url(../images/layup/servicingJumpMasterFit99.gif) top left no-repeat; position: relative; } #servicingTabs .domContent #servicingMasterFit99 .btn { position: absolute; top: 193px; left: 70px; } #servicingTabs .domContent #servicingMasterFit149 { float: left; width: 218px; height: 226px; background: url(../images/layup/servicingJumpMasterFit149.gif) top left no-repeat; position: relative; } #servicingTabs .domContent #servicingMasterFit149 .btn { position: absolute; top: 193px; left: 70px; } #servicingTabs .domContent .serviceBox { width: 326px; background: url(../images/layup/serviceTabRepeatBg.gif) repeat-y; font-size: 1.1em; color: #747474; } #servicingTabs .domContent .serviceBox .boxBg { background: url(../images/layup/serviceTab2Bg.gif) no-repeat; padding: 15px 15px 0px 15px; min-height: 360px; } #servicingTabs .domContent .serviceBox .service1stService20000 { margin-top: 14px; margin-bottom: 10px; background:url(../images/layup/servicing1stService20000.gif) top left no-repeat; position: relative; width: 294px; height: 88px; } #servicingTabs .domContent .serviceBox .service2ndService40000 { margin-top: 14px; margin-bottom: 10px; background:url(../images/layup/servicing2ndService40000.gif) top left no-repeat; position: relative; width: 294px; height: 88px; } #servicingTabs .domContent .serviceBox .serviceInspectionServicing { margin-top: 14px; margin-bottom: 10px; background:url(../images/layup/servicingInspectionService.gif) top left no-repeat; position: relative; width: 294px; height: 88px; } #servicingTabs .domContent .serviceBox .servicingOilChangeService { margin-top: 14px; margin-bottom: 10px; background:url(../images/layup/servicingOilChangeService.gif) top left no-repeat; position: relative; width: 294px; height: 88px; } #servicingTabs .domContent .serviceBox .servicingIntervalService { margin-top: 14px; margin-bottom: 10px; background:url(../images/layup/servicingIntervalService.gif) top left no-repeat; position: relative; width: 294px; height: 88px; } #servicingTabs .domContent .serviceBox .servicingInspectionService { margin-top: 14px; margin-bottom: 10px; background:url(../images/layup/servicingInspectionService.gif) top left no-repeat; position: relative; width: 294px; height: 88px; } #servicingTabs .domContent .serviceBox .btnWhatsIncluded { position: absolute; top: 42px; left: 14px; } #servicingTabs .domContent .serviceBox .btnBookNow { position: absolute; top: 42px; left: 176px; } #servicingTabs .domContent #serviceIncluded { background:url(../images/layup/servicingBoxIncluded.gif) top left no-repeat; width: 649px; height: 243px; margin-top: 18px; padding: 14px 17px 0px 17px; } #servicingTabs .domContent #serviceIncluded h2 { text-align: left; border-bottom: 1px solid #ccc; margin-bottom: 15px; } #servicingTabs .domContent #serviceIncluded ul { padding: 0; margin: 0; list-style: none; } #servicingTabs .domContent #serviceIncluded li { background:url(../images/layup/bulletRedSquare.gif) 0px 2px no-repeat; padding: 0px 0px 20px 20px; font-size: 1.1em; float: left; width: 280px; padding-right: 20px; } #servicingTabs .domContent .serviceBox table {} #servicingTabs .domContent .serviceBox td, #servicingTabs .domContent .serviceBox th { font-size: 1.1em; padding: } #servicingTabs .domContent .serviceBox td { border-bottom: 1px solid #cacaca; padding: 3px 10px 3px 0px; } #servicingTabs .domContent .serviceBox tfoot td { background: #e7e7e7; font-weight: bold; color: #950402; padding: 9px 10px 9px 27px; } #servicingTabs .domContent .serviceBox thead th { font-weight: bold; padding: 9px 10px 9px 0px; } #bookServiceByPhone { background: url(../images/layup/bookServiceByTelephone.gif) top left no-repeat; width: 295px; height: 58px; padding-top: 40px; text-align: center; font-weight: bold; font-size: 1.4em; text-transform: uppercase; color: #950402; } #servicingTabs .domContent #bookServiceForm { background: url(../images/layup/bookServiceFormBg.gif) top left no-repeat; } #servicingTabs .domContent #bookServiceForm h3 { text-transform: uppercase; color: #950402; font-size: 1.3em; font-weight: bold; text-align: center; padding: 12px 0px 15px 0px; } #servicingTabs .domContent #bookServiceForm form { padding: 0px 16px 0px 26px; font-size: 0.9em; } #servicingTabs .domContent #bookServiceForm div { margin-bottom: 5px; } #servicingTabs .domContent #bookServiceForm label { width: 110px; padding-top: 2px; } #servicingTabs .domContent #bookServiceForm input { width: 133px; } #servicingTabs .domContent #bookServiceForm textarea { width: 245px; height: 70px; } #servicingTabs .domContent #bookServiceForm .required { color: #950402; } #servicingTabs .domContent #bookServiceForm #submit { width: 176px; height: 33px; } #servicingTabs .domContent #bookServiceForm .validation-advice { width:235px; } #servicingTabs .domContent #bookServiceForm input.checkRadio { width: auto; float: left; } /* ----- RECRUITMENT ----- */ #jobList {} #jobList .item { border-bottom: 1px dotted #000; padding-bottom:15px; margin-bottom:10px;} #jobList .item a { text-decoration:none; font-weight:normal; } #jobList .item .title { font-size:16px; color:#000; font-weight:bold; display:block; margin-bottom:10px;} #jobList .item .text { display:block; font-weight:normal; font-size:11px; } #jobList .item .more { float:right; color:#850b08; font-weight:bold; display:block; margin-top:10px; } .recruitUL { padding:15px 0 15px 15px; margin:0px; } .recruitUL li { font-weight:bold; }