/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Title : Author : John Davies / john.davies@gforces.co.uk / G-Forces Web Management Ltd Type: Screen, Projection Description : Screen and projection stylesheet for Chapelhouse site - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* COMMON AND GLOBAL */ html { height:100% !important; } body { height: 100%; min-width: 959px; font:62.5%/1.6 arial, verdana, helvetica, sans-serif; margin:0; padding:0; background: url(../images/layup/bodyBg.gif); 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! */ /* ----- IDS ----- */ #outer { background: url(../images/layup/outerBg.jpg) top center no-repeat; width: 100%; height: 100%; } #container { width:959px; margin:0 auto; text-align:left; font-size:110%; line-height: normal; } #inner { background:url(../images/layup/containerBg.gif) top left repeat-y; padding: 0px 18px 0px 16px; width: 925px; min-height: 421px; } #printHeader { display:none; } #header { height: 115px; position: relative; } #header #logo { position: absolute; top: 11px; left: -33px; } #header #clock { position: absolute; top:16px; right: 0px;} #header #contactDetails { position: absolute; top: 0px; right: 0px; } #header #backToGroup { position: absolute; top: 21px; right: 160px; } /* ----- LEFT COLUMN ----- */ #leftCol { float: left; position: relative; width: 230px; } #leftCol .shadowL { position: absolute; top: 0px; left: -22px; } #leftCol .box { margin-bottom: 11px; width: 230px; } #leftCol .usedCarSearch { background: #074f7e url(../images/layup/usedCarSearchBg.gif) top left no-repeat; } #leftCol .usedCarSearch form { padding: 68px 0px 4px 43px; } #leftCol .usedCarSearch select { width:164px; border:1px solid #d0d0d0; margin:0px 0px 15px 0px; font-size: 1.0em; height: 19px; } #leftCol .usedCarSearch .search { width: 105px !important; height: 27px !important; margin-left: 56px; margin-bottom: 3px; } #leftCol .usedCarSearch .advancedSearch { margin-left: 56px; background: #032d49; color: #fff; text-transform: uppercase; font-size: 0.9em; text-decoration: none; } #leftCol .usedCarSearch .tabs { height: 92px; } #leftCol .usedCarSearch .tabs #carsSearchTab { float: left; display: block; width: 115px; height: 92px; background: url(../images/layup/spriteBtnCars.gif) no-repeat; cursor: pointer; } #leftCol .usedCarSearch .tabs #vansSearchTab { float: left; display: block; width: 115px; height: 92px; background: url(../images/layup/spriteBtnVans.gif) no-repeat; cursor: pointer; } #leftCol .usedCarSearch .tabs #carsSearchTab.active { background: url(../images/layup/spriteBtnCars.gif) 0px -92px no-repeat; } #leftCol .usedCarSearch .tabs #vansSearchTab.active { background: url(../images/layup/spriteBtnVans.gif) 0px -92px no-repeat; } #leftCol .favourites { background: url(../images/layup/favouritesBg.jpg) top left no-repeat; height: 217px; width: 192px; padding: 78px 0px 0px 38px; } #leftCol .favourites .thumb { width: 60px; float: left; height: 45px; background: url(../images/layup/noImageFavourites.gif) top left no-repeat; margin-right: 32px; margin-bottom: 14px; position: relative; } #leftCol .favourites .thumb .frame { position: absolute; top: -14px; left: -15px; } #leftCol .favourites .btnSave { float: left; width: 67px; height: 22px; } #leftCol .favourites .btnSave a { display: block; width: 67px; height: 22px; background:url(../images/layup/btnSave.gif) top left no-repeat; } #leftCol .favourites .btnSave a:hover { display: block; background:url(../images/layup/btnSave.gif) left -22px no-repeat; } #leftCol .favourites .btnSave span, #leftCol .favourites .btnCompare span { display:none; } #leftCol .favourites .btnCompare { float: left; width: 96px; height: 22px; } #leftCol .favourites .btnCompare a { display: block; width: 96px; height: 22px; background:url(../images/layup/btnCompare.gif) top left no-repeat; } #leftCol .favourites .btnCompare a:hover { display: block; background:url(../images/layup/btnCompare.gif) left -22px no-repeat; } #leftCol .favourites .btnRetrieve { float: left; width: 93px; height: 22px; } #leftCol .favourites .btnRetrieve a { display: block; width: 93px; height: 22px; background:url(../images/layup/btnRetrieve.gif) top left no-repeat; } #leftCol .favourites .btnRetrieve a:hover { display: block; background:url(../images/layup/btnRetrieve.gif) left -22px no-repeat; } #leftCol .favourites .btnRetrieve span { display:none; } /* ----- RIGHT COLUMN ----- */ #rightCol { float: right; position: relative; width: 689px; } #rightCol .shadowR { position: absolute; top: 0px; right: -24px; } #mainContent { padding: 15px 11px 0px 11px; } #mainContent h1 { font-size: 1.2em; } #mainContent .cmsImage { position: relative; float: right; margin: 8px 11px 25px 25px; } #mainContent .cmsImage .frame { position: absolute; top: -11px; left: -13px; } #mainContent .bannerImage { margin-bottom: 10px; padding-bottom: 10px; background:url(../images/layup/dotsH.gif) bottom left repeat-x; } /* ----- NEW CAR DETAIL ----- */ #newCarDetails { float: right; width: 336px; margin:0 0 15px 15px ; } #newCarDetails #newCarImage { position: relative; margin-left: 20px; margin-top: 20px; margin-bottom: 30px; } #newCarDetails #newCarImage .frame { position: absolute; top: -25px; left: -20px; } #newCarDetails #newCarImage .special { position: absolute; top: -8px; right: 10px; z-index:1000; } #newCarDetails #newCarImage2 { position: relative; margin-left: 20px; margin-top: 20px; margin-bottom: 30px; } #newCarDetails #newCarImage2 .frame { position: absolute; top: -25px; left: -20px; } #newCarDetails #newCarImage2 .special { position: absolute; top: -8px; right: 10px; z-index:1000; } #newCarDetails #newVehicleOptions { background:url(../images/layup/newVehicleOptions.gif) top left no-repeat; width: 336px; height: 137px; padding: 18px 0px 0px 9px; } #newCarDetails #newVehicleOptions span { display: none; } #newCarDetails #newVehicleOptions .btn { float: left; } #newCarDetails #newVehicleOptions .getBrochure a { display: block; background:url(../images/layup/spriteNewVehicleOptions.jpg) 0px 0px no-repeat; width: 162px; height: 61px; } #newCarDetails #newVehicleOptions .getBrochure a:hover { background:url(../images/layup/spriteNewVehicleOptions.jpg) 0px -119px no-repeat; } #newCarDetails #newVehicleOptions .bookTestDrive a { display: block; background:url(../images/layup/spriteNewVehicleOptions.jpg) -162px 0px no-repeat; width: 156px; height: 61px; } #newCarDetails #newVehicleOptions .bookTestDrive a:hover { background:url(../images/layup/spriteNewVehicleOptions.jpg) -162px -119px no-repeat; } #newCarDetails #newVehicleOptions .manufacturerSite a { display: block; background:url(../images/layup/spriteNewVehicleOptions.jpg) 0px -61px no-repeat; width: 162px; height: 58px; } #newCarDetails #newVehicleOptions .manufacturerSite a:hover { background:url(../images/layup/spriteNewVehicleOptions.jpg) 0 -180px no-repeat; } #newCarDetails #newVehicleOptions .askQuestion a { display: block; background:url(../images/layup/spriteNewVehicleOptions.jpg) -162px -61px no-repeat; width: 156px; height: 58px; } #newCarDetails #newVehicleOptions .askQuestion a:hover { background:url(../images/layup/spriteNewVehicleOptions.jpg) -162px -180px no-repeat; } #newCarDetails #financeCalculator { float: left; width: 306px; height: 277px; background:url(../images/layup/newVehicleFinanceBg.gif) top left no-repeat; padding-left: 30px; padding-top: 26px; } #newCarDetails #financeCalculator .tab { padding: 0px 0px 1px 0px; margin: 0; list-style: none; background:url(../images/layup/dotsHWhite.gif) bottom left repeat-x; height: 30px; width: 281px; } #newCarDetails #financeCalculator .tab li { float:left; font-size: 1.1em;display: inline; font-weight: bold; background: #015389; color: #fff; float: left; cursor: default; padding: 7px 17px 7px 17px; } #newCarDetails #financeCalculator .trAlt { background:#e6ecdf !important; } #newCarDetails #financeCalculator .tabset_content { background:url(../images/layup/dotsHWhite.gif) bottom left repeat-x; width: 281px; } #newCarDetails #financeCalculator .tabset_content table { margin-top: 4px; } #newCarDetails #financeCalculator .tabset_content td { height: 25px; padding: 0px; color: #fff; } #newCarDetails #financeCalculator .tabset_content form { } #newCarDetails #financeCalculator .tabset_content select { width: 70px; } #newCarDetails #financeCalculator .tabset_content input { width: 67px; } #newCarDetails #financeCalculator .tabset_content tr { background:#1f1b1b; } #newCarDetails #financeCalculator .tabset_content .trAlt { background:#454141 !important; } #newCarDetails #financeCalculator .tabset_content tfoot td { background: #181313 url(../images/layup/dotsHWhite.gif) top left repeat-x; height: 25px; } #newCarDetails #financeCalculator .tabset_content a { color: #fff; text-decoration: none; } #newCarDetails #financeCalculator .tabset_content a:hover { color: #ff0000; } /* ----- LIST ----- */ #list { margin-left: 12px;} #list .listItem { margin-bottom: 21px; } #list .listItem a { display: block; width: 643px; cursor: pointer; text-decoration: none; font-weight: normal; color: #000; } #list .listItem .thumb { display: block; position: relative; float: left; background:url(../images/layup/noImage149x112.gif) top left no-repeat; width: 149px; height: 112px; margin-right: 5px; } #list .listItem .thumb .frame { position: absolute; top: 0px; left: 0px; } #list .listItem .thumb .special { position: absolute; top: 0px; left: 0px; } #list .listItem .titlePrice { display: block; float: left; width: 489px; height: 28px; font-weight: bold; background:url(../images/layup/listTitleBg.gif) top left no-repeat; padding: 4px 0px 0px 0px; } #list .listItem .titlePrice .title { float: left; padding-left: 15px; text-transform: uppercase; color: #fff; font-size:14px; } #list .listItem .titlePrice .price { float: right; padding-right: 15px; color: #fff; font-size: 1.3em; } #list .listItem .description { display: block; float: left; padding: 10px 15px 0px 15px; color: #fff; width: 459px; min-height: 70px; background:url(../images/layup/usedListBg.jpg) no-repeat;} #list .listItem .description .finance { display:block; float:right; border-left:1px dotted #fff; } #list .listItem .description .finance .amount { display:block; width:131px; height:35px; text-transform:uppercase; font-weight:bold; color:#ffc000; font-size:11px; background:url(../images/layup/usedListFinanceBg.gif) no-repeat; margin-left:10px; padding:10px 5px 10px 5px; } #list .listItem .description .finance .amount .price { font-size:18px; color:#fff; } #list .listItem .btn { display: block; } #list .listItem .clear { display: block; clear:both; } /* ----- BOX LIST ----- */ #boxListing {} #boxListing .box { float: left; position: relative; margin-right: 6px; margin-bottom: 25px; } #boxListing .box a { display: block; cursor: pointer; text-decoration: none; width: 216px; height: 213px; } #boxListing .box a.largeItem { width: 323px; height: 293px; } #boxListing .box .thumb { display: block; padding: 18px 0px 10px 14px; width: 190px; height: 143px; background: url(../images/layup/noImage190x143.gif) 14px 18px no-repeat; } #boxListing .box a.largeItem .thumb { display: block; padding: 18px 0px 10px 14px; width: 296px; height: 222px; background: url(../images/layup/noImage190x143.gif) 14px 18px no-repeat; } #boxListing .box .frame { position: absolute; top: 0px; left: 0px; } #boxListing .box .special { position: absolute; top: -1px; right: -10px; } #boxListing .box .title { display: block; background:url(../images/layup/boxListFrameBottom.gif) top left no-repeat; height: 42px; width: 216px; color: #015389; font-size: 1.1em; text-align: center; } #boxListing .last { margin-right: 0px; } #boxListing .box .titleLarge { background: url(../images/layup/boxListFrameBottomLarge.gif) no-repeat left top; display: block; height: 42px; width: 323px; color: #015389; font-size: 1.1em; text-align: center; } /* ----- OFFER LIST ----- */ #offerList { } #offerList .listItem { margin-bottom: 21px; } #offerList .listItem a { display: block; width: 643px; cursor: pointer; text-decoration: none; font-weight: normal; color: #000; } #offerList .listItem .thumb { display: block; position: relative; float: left; width: 670px; height: 126px; } #offerList .listItem .title { display: block; float: left; padding: 6px 10px 6px 10px; color: #fff; width: 650px; background: #272a30; } #offerList .listItem .clear { display: block; clear:both; } /* ----- CAR DETAIL ----- */ #usedVehicleImagery { background: #201a1a; width: 654px; } #usedVehicleImagery #carPhoto { float:left; position:relative; width: 296px; margin: 0px 0px 0px 14px; display: inline; background:url(../images/layup/noImage296x222.gif) top left no-repeat; } #usedVehicleImagery #carPhoto .frame { position: absolute; top: 0px; left: 0px; } #usedVehicleImagery #carPhoto .special { position: absolute; top: 0px; left: 0px; } #usedVehicleImagery #advert { width:302px; float:right; margin-right:10px; position:relative; } #usedVehicleImagery #advert img { position:absolute; right:0px; top:0px; } #usedVehicleImagery #advert .price { position:absolute; top:147px; margin-left: 18px; font:Arial, Helvetica, sans-serif; font-size:72px; color:#a00000; font-weight:bold; } #usedVehicleImagery #carPhoto #thumbnails { float: left; width: 296px; margin:8px 0 0 0; display:inline; overflow:hidden; position:relative; height:80px;} #usedVehicleImagery #carPhoto #thumbnails #innerThumbs { width: 3000px; height: 53px; } #usedVehicleImagery #carPhoto #thumbnails #innerThumbs .thumb { position: relative; float: left; height: 53px; width: 71px; margin-right:4px; display: inline; margin-bottom:8px; } #usedVehicleImagery #carPhoto #thumbnails #innerThumbs .thumb.last { margin-right:0px !important; } #usedVehicleImagery #carPhoto #thumbnails #innerThumbs .thumb .unActive { position:absolute; left:0px; top:0px; width:71px; height:53px; background:url(../images/layup/thumbOverlay.png) no-repeat; } #usedVehicleImagery #vehicleTitle { text-transform: uppercase; color: #fff; font-weight: bold; padding-left: 17px; line-height: 150%; float: left; } #usedVehicleImagery #vehiclePrice { text-transform: uppercase; color: #fff; font-weight: bold; padding-left: 40px; line-height: 150%; float: left; } #usedVehicleImagery #vehicleLocation { text-transform: uppercase; color: #fff; font-weight: bold; padding-left: 17px; line-height: 150%; float: left; } #usedVehicleImagery #vehiclePhone { text-transform: uppercase; color: #fff; font-weight: bold; padding-left: 40px; line-height: 150%; float: left; } #usedVehicleImagery #vehiclePrice .red { color: #ff0000; } #usedVehicleImagery #printCarDetails { display: none; } #usedVehicleOptionsPrimary { width: 647px; height: 79px; padding: 20px 0px 0px 9px; background:url(../images/layup/usedVehicleOptions.gif) top left no-repeat; } #usedVehicleOptionsPrimary span { display: none; } #usedVehicleOptionsPrimary .btn { float: left; } #usedVehicleOptionsPrimary .enquireAboutVehicle a { display: block; background:url(../images/layup/spriteUsedVehicleOptions.gif) 0px -60px no-repeat; width: 197px; height: 60px; } #usedVehicleOptionsPrimary .enquireAboutVehicle a:hover { background:url(../images/layup/spriteUsedVehicleOptions.gif) top left no-repeat; } #usedVehicleOptionsPrimary .sendToFriend a { display: block; background:url(../images/layup/spriteUsedVehicleOptions.gif) -197px -60px no-repeat; width: 136px; height: 60px; } #usedVehicleOptionsPrimary .sendToFriend a:hover { background:url(../images/layup/spriteUsedVehicleOptions.gif) -197px 0px no-repeat; } #usedVehicleOptionsPrimary .printDetails a { display: block; background:url(../images/layup/spriteUsedVehicleOptions.gif) -333px -60px no-repeat; width: 165px; height: 60px; } #usedVehicleOptionsPrimary .printDetails a:hover { background:url(../images/layup/spriteUsedVehicleOptions.gif) -333px 0px no-repeat; } #usedVehicleOptionsPrimary .findCar a { display: block; background:url(../images/layup/spriteUsedVehicleOptions.gif) -498px -60px no-repeat; width: 140px; height: 60px; } #usedVehicleOptionsPrimary .findCar a:hover { background:url(../images/layup/spriteUsedVehicleOptions.gif) -498px 0px no-repeat; } #usedVehicleOptionsSecondary { width: 661px; height: 91px; } #usedVehicleOptionsSecondary a { height:91px !important; } #usedVehicleOptionsSecondary span { display: none; } #usedVehicleOptionsSecondary .btn { float: left; } #usedVehicleOptionsSecondary .printDetails a { display: block; background:url(../images/layup/spriteUsedVehicleOptions.jpg) 0 0 no-repeat; width:165px; } #usedVehicleOptionsSecondary .printDetails a:hover { background:url(../images/layup/spriteUsedVehicleOptions.jpg) 0 -91px no-repeat; } #usedVehicleOptionsSecondary .similarCars a { display: block; background:url(../images/layup/spriteUsedVehicleOptions.jpg) -165px 0 no-repeat; width:169px; } #usedVehicleOptionsSecondary .similarCars a:hover { background:url(../images/layup/spriteUsedVehicleOptions.jpg) -165px -91px no-repeat; } #usedVehicleOptionsSecondary .valueCar a { display: block; background:url(../images/layup/spriteUsedVehicleOptions.jpg) -334px 0 no-repeat; width:157px !important; } #usedVehicleOptionsSecondary .valueCar a:hover { background:url(../images/layup/spriteUsedVehicleOptions.jpg) -334px -91px no-repeat; } #usedVehicleOptionsSecondary .askQuestion a { display: block; background:url(../images/layup/spriteUsedVehicleOptions.jpg) -491px 0 no-repeat; width:170px !important; } #usedVehicleOptionsSecondary .askQuestion a:hover { background:url(../images/layup/spriteUsedVehicleOptions.jpg) -491px -91px no-repeat; } #similarVehicles { margin-top: 10px; margin-left: 6px; width: 648px; } #similarVehicles .mainTitle { background: #015389; } #similarVehicles .box { float: left; width: 170px; margin-top: 25px; } #similarVehicles .box a { display: block; cursor: pointer; text-decoration: none; width: 170px; font-weight: normal; padding-bottom: 10px; color: #000; } #similarVehicles .box .thumb { display: block; position: relative; background:url(../images/layup/noImage149x112.gif) top left no-repeat; width: 149px; height: 112px; padding-bottom: 22px; margin-left: 11px; } #similarVehicles .box .thumb .frame { position: absolute; top: -11px; left: -12px; } #similarVehicles .box .title { display: block; color: #fff; background: #000; font-weight: bold; font-size: 1.1em; text-transform: uppercase; padding: 6px 0px 6px 17px; margin-bottom: 10px; } #similarVehicles .box .detail { display: block; padding: 0px 0px 0px 5px; } #similarVehicles .box .detail .link { color: #015389; font-weight: bold; } #similarVehicles .spacer { float: left; margin-top: 25px; } /* ----- DOMTABS ----- */ #usedVehicleDetail { background: url(../images/layup/usedVehicleDetailBg.gif) top left repeat-y; } #usedVehicleDetail #vehicleSpec { float: left; width: 644px; background:url(../images/layup/usedVehicleSpecBg.gif) top left no-repeat; padding-left: 23px; padding-top: 32px; } #usedVehicleDetail #vehicleSpec .domtab { } #usedVehicleDetail #vehicleSpec .tabset_print { display: none;} #usedVehicleDetail #vehicleSpec .tabset_tabs { height:39px; width: 610px; margin:0px; padding:0px; list-style:none; } #usedVehicleDetail #vehicleSpec .tabset_tabs li { list-style: none; display: inline; padding: 0px; float:left; font-size: 1.1em; } #usedVehicleDetail #vehicleSpec .tabset_tabs a { display: block; height:39px; } #usedVehicleDetail #vehicleSpec .tabset_tabs .vehicleDetails { width:121px; background:url(../images/layup/spriteUsedDetailTabs.gif) 0 0 no-repeat; } #usedVehicleDetail #vehicleSpec .tabset_tabs .vehicleDetails:hover, #usedVehicleDetail #vehicleSpec .tabset_tabs li.active .vehicleDetails { background:url(../images/layup/spriteUsedDetailTabs.gif) 0 -39px no-repeat; } #usedVehicleDetail #vehicleSpec .tabset_tabs .spec { width:123px; background:url(../images/layup/spriteUsedDetailTabs.gif) -121px 0 no-repeat; } #usedVehicleDetail #vehicleSpec .tabset_tabs .spec:hover, #usedVehicleDetail #vehicleSpec .tabset_tabs li.active .spec { background:url(../images/layup/spriteUsedDetailTabs.gif) -121px -39px no-repeat; } #usedVehicleDetail #vehicleSpec .tabset_tabs .warranty { width:121px; background:url(../images/layup/spriteUsedDetailTabs.gif) -244px 0 no-repeat; } #usedVehicleDetail #vehicleSpec .tabset_tabs .warranty:hover, #usedVehicleDetail #vehicleSpec .tabset_tabs li.active .warranty { background:url(../images/layup/spriteUsedDetailTabs.gif) -244px -39px no-repeat; } #usedVehicleDetail #vehicleSpec .tabset_content { background:url(../images/layup/dotsHWhite.gif) bottom left repeat-x; width:610px; margin-bottom:20px; } #usedVehicleDetail #vehicleSpec .tabset_content h1 { color: #000; padding: 0px; } #usedVehicleDetail #vehicleSpec .tabset_content td { height: 28px; padding: 0px 0px 0px 17px; color: #fff; } #usedVehicleDetail #vehicleSpec .tabset_content .price { background:none !important;} #usedVehicleDetail #vehicleSpec .tabset_content .price td { font-size: 1.5em; font-weight: bold; color: #ff0000; padding: 2px 0px 5px 0px; } #usedVehicleDetail #vehicleSpec .tabset_content tr { background:#615f5f; } #usedVehicleDetail #vehicleSpec .tabset_content .trAlt { background:#3d3e40 !important; } #usedVehicleDetail #financeCalculator { float: left; width: 644px; background:url(../images/layup/usedVehicleFinanceBg.gif) bottom left no-repeat; padding-left: 23px; padding-bottom:80px; padding-top:10px; } #usedVehicleDetail #financeCalculator .tabset_tabs { height:39px; width: 610px; margin:0px; padding:0px; list-style:none; } #usedVehicleDetail #financeCalculator .tab li { float:left; font-size: 1.1em;display: inline; list-style:none; padding:0px; height:39px; list-style:none; } #usedVehicleDetail #financeCalculator .trAlt { background:#e6ecdf !important; } #usedVehicleDetail #financeCalculator .tabset_content { width: 610px; padding:0; margin:0; } #usedVehicleDetail #financeCalculator .tabset_content td { height: 28px; padding: 0px; color: #fff; } #usedVehicleDetail #financeCalculator .tabset_content form { } #usedVehicleDetail #financeCalculator .tabset_content select { width: 70px; } #usedVehicleDetail #financeCalculator .tabset_content input { width: 67px; } #usedVehicleDetail #financeCalculator .tabset_content tr { background:#3d3e40; } #usedVehicleDetail #financeCalculator .tabset_content .trAlt { background:#615f5f !important; } #usedVehicleDetail #financeCalculator .tabset_content tfoot td { background: none !important; height: 40px; } #usedVehicleDetail #financeCalculator .tabset_content a { color: #fff; text-decoration: none; } #usedVehicleDetail #financeCalculator .tabset_content a:hover { color: #ff0000; } /* ----- DEALER ----- */ #dealerImagery { background:url(../images/layup/dealerImageryBg.jpg) top left no-repeat; height: 317px; width: 656px; margin-bottom: 15px; } #dealerImagery #dealerTitle { height: 50px; padding-bottom: 16px; } #dealerImagery #dealerTitle h1 { color: #fff; text-transform: uppercase; font-weight: bold; font-size: 1.4em; padding-top: 22px; padding-left: 16px; } #dealerImagery #dealerPhoto { position: relative; float: left; margin-left: 18px; display: inline; } #dealerImagery #dealerPhoto .frame { position: absolute; top: 0px; left: 0px; } #dealerImagery #dealerMap { position: relative; float: left; margin-left: 22px; } #dealerImagery #dealerMap .frame { position: absolute; top: 0px; left: 0px; } #dealerDetails { background:url(../images/layup/dealerDetailsBg.jpg) top left no-repeat; height: 330px; width: 654px; margin-bottom: 15px; color: #fff; } #dealerDetails h2 { color: #fff; text-transform: uppercase; font-weight: bold; padding: 19px 0px 9px 16px; } #dealerDetails a { color: #fff; } #dealerDetails .col1 { float: left; width: 322px; } #dealerDetails .col1 .box { width: 227px; background: #2e5b81; margin: 15px 0px 0px 10px; padding: 5px 5px 5px 5px; } #dealerDetails .col2 { float: left; width: 332px; } #dealerDetails .col2 .box { width: 227px; background: #2e5b81; margin: 15px 0px 0px 10px; padding: 5px 5px 5px 5px; } #dealerDetails .col2 p { padding: 0; } #dealerDetails .col2 table { margin-bottom: 15px; } #dealerDetails .col1 .box { line-height: 20px; } /* ----- OFFERS ----- */ #franchiseOfferList {} #franchiseOfferList ul { list-style:none; padding: 0px; margin: 0px; } #franchiseOfferList ul li { float: left; padding: 0px 0px 0px 0px; margin: 0px; } #franchiseOfferList ul li a { display: block; float: left; width: 95px; height: 80px; } #franchiseOfferList ul li span { display: none; } #franchiseOfferList ul li.hyundaiOffers a { background: url(../images/layup/spriteOfferTabs.jpg) 0px 0px no-repeat; } #franchiseOfferList ul li.kiaOffers a { background: url(../images/layup/spriteOfferTabs.jpg) -95px 0px no-repeat; } #franchiseOfferList ul li.citroenOffers a { background: url(../images/layup/spriteOfferTabs.jpg) -190px 0px no-repeat; } #franchiseOfferList ul li.peugeotOffers a { background: url(../images/layup/spriteOfferTabs.jpg) -285px 0px no-repeat; } #franchiseOfferList ul li.suzukiOffers a { background: url(../images/layup/spriteOfferTabs.jpg) -380px 0px no-repeat; } #franchiseOfferList ul li.fiatOffers a { background: url(../images/layup/spriteOfferTabs.jpg) -475px 0px no-repeat; } #franchiseOfferList ul li.saabOffers a { background: url(../images/layup/spriteOfferTabs.jpg) -570px 0px no-repeat; } #franchiseOfferList ul li.servicingOffers a { background: url(../images/layup/spriteOfferTabs.jpg) -665px 0px no-repeat; } #franchiseOfferList ul li.servicingForm a { background: url(../images/layup/spriteOfferTabs.jpg) -760px 0px no-repeat; } #franchiseOfferList ul li.hyundaiOffers a:hover, #franchiseOfferList ul li.hyundaiOffers a.active { background: url(../images/layup/spriteOfferTabs.jpg) 0px -80px no-repeat; } #franchiseOfferList ul li.kiaOffers a:hover, #franchiseOfferList ul li.kiaOffers a.active { background: url(../images/layup/spriteOfferTabs.jpg) -95px -80px no-repeat; } #franchiseOfferList ul li.citroenOffers a:hover, #franchiseOfferList ul li.citroenOffers a.active { background: url(../images/layup/spriteOfferTabs.jpg) -190px -80px no-repeat; } #franchiseOfferList ul li.peugeotOffers a:hover, #franchiseOfferList ul li.peugeotOffers a.active { background: url(../images/layup/spriteOfferTabs.jpg) -285px -80px no-repeat; } #franchiseOfferList ul li.suzukiOffers a:hover, #franchiseOfferList ul li.suzukiOffers a.active { background: url(../images/layup/spriteOfferTabs.jpg) -380px -80px no-repeat; } #franchiseOfferList ul li.fiatOffers a:hover, #franchiseOfferList ul li.fiatOffers a.active { background: url(../images/layup/spriteOfferTabs.jpg) -475px -80px no-repeat; } #franchiseOfferList ul li.saabOffers a:hover, #franchiseOfferList ul li.saabOffers a.active { background: url(../images/layup/spriteOfferTabs.jpg) -570px -80px no-repeat; } #franchiseOfferList ul li.servicingOffers a:hover, #franchiseOfferList ul li.servicingOffers a.active { background: url(../images/layup/spriteOfferTabs.jpg) -665px -80px no-repeat; } #franchiseOfferList ul li.servicingForm a:hover, #franchiseOfferList ul li.servicingForm a.active { background: url(../images/layup/spriteOfferTabs.jpg) -760px -80px no-repeat; } #offerTabList {} #offerTabList ul { list-style:none; padding: 0px; margin: 0px; } #offerTabList ul li { float: left; padding: 0px 0px 0px 0px; margin: 0px; } #offerTabList ul li a { display: block; float: left; width: 166px; height: 80px; } #offerTabList ul li span { display: none; } #offerTabList ul li.newOffersTab a { background: url(../images/layup/spriteOfferTabs.jpg) 0px -160px no-repeat; } #offerTabList ul li.usedOffersTab a { background: url(../images/layup/spriteOfferTabs.jpg) -166px -160px no-repeat; } #offerTabList ul li.aftersalesTab a { background: url(../images/layup/spriteOfferTabs.jpg) -332px -160px no-repeat; } #offerTabList ul li.bestOffersTab a { background: url(../images/layup/spriteOfferTabs.jpg) -498px -160px no-repeat; } #offerTabList ul li.servicingOffersTab a { background: url(../images/layup/spriteOfferTabs.jpg) -664px -160px no-repeat; } #offerTabList ul li.newOffersTab a:hover, #offerTabList ul li.newOffersTab a.active { background: url(../images/layup/spriteOfferTabs.jpg) 0px -240px no-repeat; } #offerTabList ul li.usedOffersTab a:hover, #offerTabList ul li.usedOffersTab a.active { background: url(../images/layup/spriteOfferTabs.jpg) -166px -240px no-repeat; } #offerTabList ul li.aftersalesTab a:hover, #offerTabList ul li.aftersalesTab a.active { background: url(../images/layup/spriteOfferTabs.jpg) -332px -240px no-repeat; } #offerTabList ul li.bestOffersTab a:hover, #offerTabList ul li.bestOffersTab a.active { background: url(../images/layup/spriteOfferTabs.jpg) -498px -240px no-repeat; } #offerTabList ul li.servicingOffersTab a:hover, #offerTabList ul li.servicingOffersTab a.active { background: url(../images/layup/spriteOfferTabs.jpg) -664px -240px no-repeat; } #financeCalculator .printH1 { display: none; } /* ----- 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; } .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; } .red { color: #800809; } .lightBlue { color: #41607d; } .blue { color: #0c2d83; } .font11 { font-size: 1.1em; } /* ----- HEADINGS & PARAGRAPHS ----- */ h1, h2, h3, h4, h5, h6 { margin:0; padding:0 0 15px 0; font-size:100%; font-weight:bold;} /* ----- TOP NAVIGATION ----- */ /* ---------------------- MAKE SURE THE NAV IS TESTED IN FIREFOX ON A MAC ------------------------ */ #primaryNav { margin-left: 9px; margin-top: 2px; height: 61px; } #primaryNav ul { list-style: none; margin: 0; padding: 0; } #primaryNav li { display: block; float: left; position: relative; } #primaryNav li a { display: block; float: left; text-decoration: none; color: #fff; text-transform: uppercase; font-size: 1.1em; padding-top: 18px; } #primaryNav li a:hover { background: #55678d url(../images/layup/navArrow.gif) top right no-repeat; } #primaryNav li span { display: block; padding: 12px 16px 11px 16px; background: url(../images/layup/navDivider.gif) 0px 0px no-repeat; } #primaryNav li.last { display: block; background:url(../images/layup/navDivider.gif) right 18px no-repeat; padding-right: 2px; } #primaryNav a .navCorner { position: absolute; top: -400px; } #primaryNav a:hover .navCorner { display: block; position: absolute; top: 0px; left: -4px; } #primaryNav li .active { background: #55678d url(../images/layup/navArrow.gif) top right no-repeat; } #primaryNav li .active .navCorner { display: block; position: absolute; top: 0px; left: -4px; } /* ----- 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 ----- */ #pageInfo { background: url(../images/layup/dotsH.gif) bottom left repeat-x; margin: 0px 11px 0px 11px; height: 23px; } #breadcrumbs { float: left; color: #fff; } #breadcrumbs a { background: #002a68; text-decoration: none; color: #fff; font-weight: normal; padding: 1px 6px 1px 6px; line-height: 20px; display: block; float: left; } #breadcrumbs a:hover { text-decoration: underline; } #breadcrumbs .active { background: #015389; padding: 1px 6px 1px 6px; line-height: 20px; display: block; float: left; } #pagination { float: right; margin-top: 4px; } #pagination a { padding: 0px 4px 0px 4px; text-decoration: none; font-weight: normal; color: #000 !important; } #pagination a:hover { text-decoration: none; background:#015389; color:#fff !important; font-weight: bold; } #pagination .active { text-decoration: none; background:#015389; color:#fff !important; font-weight: bold; } #pagination span { display: block; float: left; padding: 0px 2px 0px 2px; } #pagination .prev, #pagination .next { font-weight: bold; } #pagination .prev:hover, #pagination .next:hover { background: none; font-weight: bold; color: #000; text-decoration: underline; color: #000 !important; } #back { float: right; } #back a { display: block; background: #015389 url(../images/layup/iconArrowLeft.gif) 10px 5px no-repeat; color: #fff; padding: 3px 10px 3px 30px; text-decoration: none; font-weight: normal; } #back a:hover { text-decoration: underline; } #searchInfo { background: url(../images/layup/dotsH.gif) bottom left repeat-x; margin: 0px 11px 0px 11px; height: 23px; padding: 6px 8px 5px 0px; } #sortBy { float: right; } #sortBy label { width: 50px; font-weight: bold; margin-top: 3px; } #sortBy select { height: 20px; } #paginationBottom { float: right; margin-top: 4px; padding-right: 12px; } #paginationBottom a { padding: 0px 4px 0px 4px; text-decoration: none; font-weight: normal; color: #000 !important; } #paginationBottom a:hover { text-decoration: none; background:#015389; color:#fff !important; font-weight: bold; } #paginationBottom .active { text-decoration: none; background:#015389; color:#fff !important; font-weight: bold; } #paginationBottom span { display: block; float: left; padding: 0px 2px 0px 2px; } #paginationBottom .prev, #paginationBottom .next { font-weight: bold; } #paginationBottom .prev:hover, #paginationBottom .next:hover { background: none; font-weight: bold; color: #000; text-decoration: underline; color: #000 !important; } /* ----- FOOTER ----- */ #footer { background: url(../images/layup/footerBg.png) top left no-repeat; height: 90px; padding: 9px 30px 0px 30px; text-align: right; color: #fff; } #footer a { font-weight:normal; text-decoration:none; color: #fff; position: relative; z-index: 999; } #footer a:hover { text-decoration:underline;} #footer p { padding-top: 21px; } /* ----- GLOBAL ----- */ img { display:block; border:0; } p { padding:0 0 15px 0; margin:0; } address { font-style:normal;} /* ----- LINKS ----- */ a { color:#000000; font-weight:bold; text-decoration:underline; cursor: pointer; } a:hover { text-decoration:none; } /* ----- FORMS ----- */ form { padding:0; margin:0; } fieldset { padding:0; margin:0; border:0px none; display:inline; } legend { padding:0; margin:0; display:none; } label { display:block; width:260px; float:left; } input, textarea { width:200px; font-size:11px !important;} .requiredLabel { color:#095e8c;} .checkRadio { width:20px; position:relative; left:-7px;} .radio { width: 20px !important; } #frmContact { margin-bottom:15px;} #frmContact p { padding:7px 0;} #frmContact select { width:204px;} #frmContact div { margin-bottom:10px;} #searchFormAdv { margin-bottom:15px;} #searchFormAdv p { padding:7px 0;} #searchFormAdv select { width:204px;} #searchFormAdv div { margin-bottom:10px; padding: 0px 5px 0px 5px; } #btnSubmit { width:76px; height:25px; border:none; } #frmContact select#dobDay, #frmContact select#dobMonth, #frmContact select#dobYear { width: 66px; } select#yrsAtPresentLocation, select#mthsAtPresentLocation, select#yrsAtEmployer, select#mthsAtEmployer, select#yrsAtBank, select#mthsAtBank { width: 101px !important; } /* ----- Prototype Validation ----- */ input.disabled { border: 1px solid #F2F2F2; background-color: #F2F2F2; } input.validation-failed, textarea.validation-failed, select.validation-failed { border: 1px solid #095e8c; 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: #095e8c; color : #FFF; font-weight: bold; } /* ----- TABLES ----- */ table { border-collapse:collapse; } table p { padding:0px; }