/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Title : Author : Chris Munn / chris.munn@gforces.co.uk / G-Forces Web Management Ltd Type: Screen, Projection Description : Screen and projection stylesheet for Grants SEAT site - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* COMMON AND GLOBAL */ body { font:62.5%/1.6 arial, verdana, helvetica, sans-serif; margin:0; padding:0; background:#292828 url(../images/layup/bodyBgRepeat.jpg) repeat-x; color:#e8d3d3; 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 ----- */ #wrapper { height: 100%; width: 100%; background: url(../images/layup/bodyBgInternal.jpg) top center no-repeat; } #container { width:960px; margin:0 auto; text-align:left; font-size:110%; line-height: normal; } #printHeader { display:none;} #header { position: relative; height: 184px; z-index: 999; } #header #logo { position: absolute; top: 91px; left:0; } #header #contactDetails { position: absolute; top:14px; right: 10px; width:290px; } #header #contactDetails img { margin:2px 0 0 0; } #header #contactDetails a { float:left; margin:0 10px 0 0; } #header #contactDetails a img { margin:0; padding:0; } #header #badge { position: absolute; top: 107px; right: 43px; } #mainContent { width: 960px; background: url(../images/layup/mainContentBg.gif) repeat-y; } #header #homeOffers.active { width: 960px; } #header #homeOffers.active #offerContainer { width: 100%; position: static; left: auto; } #header #homeOffers { padding-top: 70px; width: 88px; height: 276px; float: left; overflow:hidden; position: relative; } #header #homeOffers .offerBtn { position: absolute; top: 150px; left: -1px; width: 88px; height: 143px; z-index:999; } #header #homeOffers #offerContainer { width: 871px; left:88px; position: absolute; height: 276px; background: url(../images/layup/offerBg.png) repeat; float: right; } #header #homeOffers #offerContainer #bannerWrapper.padding { top:24px; left:104px; position:absolute; width:671px; height:233px; overflow:hidden; } #header #homeOffers #offerContainer #offerNext { position: absolute; top: 108px; right: 20px; } #header #homeOffers #offerContainer #offerPrevious { position: absolute; top: 108px; left: 30px; } #header #homeOffers #offerContainer #closeOffers { position: absolute; top: 240px; right: 20px; } /* ----- LEFT COLUMN ----- */ #leftCol { float: left; width: 239px; } #leftCol .box { background: #171717 url(../images/layup/boxBottomLine.gif) no-repeat bottom left; margin-bottom: 15px; } #leftCol .usedCarSearch { padding: 0px; background:#0f0f0f url(../images/layup/usedCarSearchBg.gif) no-repeat; position: relative; top: -10px; border-bottom: 3px solid #313030; min-height: 258px; margin-bottom: 0px; } #leftCol .usedCarSearch form { padding: 85px 17px 14px 20px; } #leftCol .usedCarSearch form select { width: 197px; margin-bottom: 5px; background: #750101; color: #fff; } #leftCol .usedCarSearch form #btnUsedSearch { margin-top: 5px; } #leftCol .usedCarSearch form #usedSearchBtns a { font-weight: normal; text-decoration: none; margin-top: 7px; display: block; } #leftCol .box.stockUpdates a { float: left; display: block; padding: 52px 20px 55px 20px; background: url(../images/layup/stockUpdatesBg.gif) no-repeat; text-decoration: none; font-weight: normal; } #leftCol .box.wishList .padding { background: url(../images/layup/wishListBg.gif) no-repeat; padding: 30px 10px 25px 20px; } #leftCol .box.wishList .padding p { position: relative; } #leftCol .box.wishList .padding .list a { display: block; width: 58px; height: 44px; float: left; margin-right: 14px; margin-bottom: 16px; position: relative; } #leftCol .box.wishList .padding .list a .frame { position: absolute; top: 0; left: 0; } #leftCol .box.wishList .padding .list a.box1 { background: url(../images/layup/wishList1.gif) no-repeat; } #leftCol .box.wishList .padding .list a.box2 { background: url(../images/layup/wishList2.gif) no-repeat; } #leftCol .box.wishList .padding .list a.box3 { background: url(../images/layup/wishList3.gif) no-repeat; margin-right: 0px; } #leftCol .box.wishList .padding a.btnSave { float: left; } #leftCol .box.wishList .padding a.btnCompare { float: right; padding-right: 7px; } #leftCol .box.autism a { display: block; background: url(../images/layup/autismBg.gif) no-repeat; padding: 30px 90px 65px 20px; text-decoration: none; font-weight: normal; float: left; } #leftCol .box.social .padding { padding: 0 20px; } #leftCol .box.social .padding p { display:none; } #leftCol .box.social { background: none; } #leftCol .box.social .padding img { margin-bottom: 14px; } #leftCol { float: left; width: 239px; } #leftCol .usedCarSearchNew { padding: 0px; background:#0f0f0f url(../images/layup/usedCarSearchBgAlt.gif) no-repeat; position: relative; top: -10px; border-bottom: 3px solid #313030; min-height: 258px; margin-bottom: 0px; } #leftCol .usedCarSearchNew .domTabs { width:100%; } #leftCol .usedCarSearchNew form { padding: 23px 17px 14px 20px; } #leftCol .usedCarSearchNew form select { width: 197px; margin-bottom: 5px; background: #750101; color: #fff; } #leftCol .usedCarSearchNew form #btnUsedSearch { margin-top: 5px; } #leftCol .usedCarSearchNew form #usedSearchBtns a { font-weight: normal; text-decoration: none; margin-top: 7px; display: block; } #leftCol .usedCarSearchNew ul.domHeadings { padding:29px 0 0 2px; height:40px; border:none; } #leftCol .usedCarSearchNew ul.domHeadings li { float:left; margin:0; padding:0; } #leftCol .usedCarSearchNew ul.domHeadings li a { height:40px; display:block; background: url(../images/layup/spriteVehicleSearchTabs.gif) no-repeat left top; margin:0; } #leftCol .usedCarSearchNew ul.domHeadings li a span { display:none; } #leftCol .usedCarSearchNew ul.domHeadings li a.dt1 { width:119px; background-position:0 0; } #leftCol .usedCarSearchNew ul.domHeadings li a.dt1:hover, #leftCol .usedCarSearchNew ul.domHeadings li.active a.dt1 { background-position:0 -40px; } #leftCol .usedCarSearchNew ul.domHeadings li a.dt2 { width:117px; background-position:-119px 0; } #leftCol .usedCarSearchNew ul.domHeadings li a.dt2:hover, #leftCol .usedCarSearchNew ul.domHeadings li.active a.dt2 { background-position:-119px -40px; } /* ----- RIGHT COLUMN ----- */ #rightCol { float: right; width: 718px; } #rightCol #homeJumps { border-bottom: 3px solid #636262; position: relative; top: -29px; width: 718px; background: url(../images/layup/homeJumpsBg.gif) repeat-x; } #rightCol #homeJumps #newCars { float: left; margin-right: 3px; } #rightCol #homeJumps #newCars a { display: block; background: url(../images/layup/spriteNewCars.jpg) -237px 19px no-repeat; width: 237px; height: 277px; } #rightCol #homeJumps #newCars a:hover { background: url(../images/layup/spriteNewCars.jpg) 0px 1px no-repeat; } #rightCol #homeJumps #usedCars { float: left; margin-right: 3px; } #rightCol #homeJumps #usedCars a { display: block; background: url(../images/layup/spriteUsedCars.jpg) -231px 19px no-repeat; width: 231px; height: 277px; } #rightCol #homeJumps #usedCars a:hover { background: url(../images/layup/spriteUsedCars.jpg) 0px 1px no-repeat; } #rightCol #homeJumps #aftersales { float: left; } #rightCol #homeJumps #aftersales a { display: block; background: url(../images/layup/spriteAftersales.jpg) -244px 19px no-repeat; width: 244px; height: 277px; } #rightCol #homeJumps #aftersales a:hover { background: url(../images/layup/spriteAftersales.jpg) 0px 1px no-repeat; } #rightCol #secondaryJumps { position: relative; top: -29px; width: 718px; border-bottom: 3px solid #636262; } #rightCol #secondaryJumps a { display: block; text-decoration: none; font-weight: normal; padding: 52px 87px 46px 16px; float: left; } #rightCol #secondaryJumps #motability { width: 243px; height: 150px; float: left; background: url(../images/layup/motabilityBg.gif) no-repeat; } #rightCol #secondaryJumps #latestNews { width: 233px; height: 150px; float: left; background: url(../images/layup/latestNewsBg.gif) no-repeat; } #rightCol #secondaryJumps #fleetSales { width: 242px; height: 150px; float: left; background: url(../images/layup/fleetSalesBg.gif) no-repeat; } #rightCol #mainText { padding: 4px 25px 20px 16px; line-height: 225%; } /* ----- CMS IMAGE ----- */ .cmsImage { float: right; margin: 0px 0px 15px 15px; position: relative; } .frame .tl { display: block; position: absolute; top: 0px; left: 0px; width: 14px; height: 14px; background: url(../images/layup/tl.png) no-repeat; z-index: 999; } .frame .tr { display: block; position: absolute; top: 0px; right: 0px; width: 14px; height: 14px; background: url(../images/layup/tr.png) no-repeat; z-index: 999; } .frame .bl { display: block; position: absolute; top: 217px; left: 0px; width: 14px; height: 14px; background: url(../images/layup/bl.png) no-repeat; z-index: 999; } .frame .br { display: block; position: absolute; top: 217px; right: 0px; width: 14px; height: 14px; background: url(../images/layup/br.png) no-repeat; z-index: 999; } /* ----- BOX LIST ----- */ #boxList {} #boxList .box { width: 225px; float: left; background: url(../images/layup/boxItemBg.gif) 220px 128px no-repeat; margin-bottom: 20px; } #boxList .box a { display: block; width: 220px; text-decoration: none; font-weight: normal; } #boxList .box a .thumb { display: block; border-bottom: 3px solid #191a1c; opacity: 0.7; filter: alpha(opacity=70); width: 220px; height: 165px; background: url(../images/layup/noImage220x165.gif) no-repeat; } #boxList .box a .title { display: block; padding: 7px 15px 7px 15px; } #boxList .box a .title img { display: inline; position: relative; top: 2px; left: -2px; } #boxList .box a:hover { background: none; } #boxList .box a:hover .thumb { opacity: 1; filter: alpha(opacity=100); } #boxList .box a:hover span.title { border: 3px solid #cc0000; padding: 4px 12px 4px 12px; } /* ----- USED CAR DETAIL ----- */ /* new car also inherits most styles from used car styles so careful when changing */ #mainText .arrowHeading { background: url(../images/layup/arrow29x27.gif) no-repeat 0px 5px; font-size: 1.5em; font-weight: bold; color: #e8d3d3; padding: 6px 0 6px 35px; } #usedText { padding-left: 35px; } #contactPrice { border-bottom: 3px solid #252525; padding-bottom: 10px; margin-bottom: 15px; } #mainText .usedPrice { font-size: 1.9em; width: 190px; float: left; } #mainText .usedPrice span { font-size: 12px; color: #FFFFFF; text-transform: uppercase; } #mainText .contactNumber { background: url(../images/layup/headingT.gif) no-repeat 0px 5px; color: #FFFFFF; font-size: 1.9em; float: left; } /* photo */ #usedCarPhoto { float: left; position: relative; } #usedCarPhoto .frame { position: absolute; top: 0px; left: 0px; z-index: 999; } #usedCarPhoto .enlarge { position: absolute; } #usedCarPhoto .special { position: absolute; } .photoFooter { height: 22px; background: url(../images/layup/usedPhotoFoot.gif) 0px 9px no-repeat; padding: 9px 0px 12px 0px; } /* thumbs */ #usedCarThumbs { background: url(../images/layup/dotH.gif) bottom left repeat-x; padding: 0px 0px 20px 0px; margin: 0px 0px 20px 0px; } #usedCarThumbs .thumb { float: left; cursor: pointer; border: 1px solid #222222; margin-right: 6px; } #usedCarThumbs .thumb.last { margin-right: 0px; } #usedCarThumbs .thumb a { display: block; width: 105px; height:69px; position: relative; z-index: 99999; opacity: 0.4; filter: alpha(opacity=40); padding-bottom: 3px; } #usedCarThumbs .thumb a:hover { display: block; border-bottom: 3px solid #cc0000; opacity: 1; padding-bottom: 0px; filter: alpha(opacity=100); } #usedCarThumbs .thumb a.active { display: block; border-bottom: 3px solid #cc0000; opacity: 1; padding-bottom: 0px; filter: alpha(opacity=100); } /* used options */ #usedCarOptions { float: left; width: 228px; margin-top:6px; } #usedCarOptions a { display: block; width: 228px; } #usedCarOptions a#optOne { height: 67px; background: url(../images/layup/spriteUsedJumps.gif) 0px 0px no-repeat; } #usedCarOptions a#optTwo { height: 64px; background: url(../images/layup/spriteUsedJumps.gif) 0px -67px no-repeat; } #usedCarOptions a#optThree { height: 67px; background: url(../images/layup/spriteUsedJumps.gif) 0px -131px no-repeat; } #usedCarOptions a#optFour { height:62px; background: url(../images/layup/spriteUsedJumps.gif) 0px -198px no-repeat; } #usedCarOptions a#optOne:hover { background: url(../images/layup/spriteUsedJumps.gif) -228px 0 no-repeat; } #usedCarOptions a#optTwo:hover { background: url(../images/layup/spriteUsedJumps.gif) -228px -67px no-repeat; } #usedCarOptions a#optThree:hover { background: url(../images/layup/spriteUsedJumps.gif) -228px -131px no-repeat; } #usedCarOptions a#optFour:hover { background: url(../images/layup/spriteUsedJumps.gif) -228px -198px no-repeat; } /* related vehicles */ #relatedVehicles { width: 677px; } #relatedVehicles .box { width: 220px; float: left; margin-right: 4px; } #relatedVehicles .box.last { margin-right: 0px; } #relatedVehicles .box a { display: block; text-decoration: none; width: 220px; font-weight: normal; } #relatedVehicles .box a .thumb { display: block; } #relatedVehicles .box a.imageLink { border-bottom: 3px solid #1d1c1d; } #relatedVehicles .box a.imageLink:hover { border-color: #cc0000; } #relatedVehicles .box .title { display: block; background: url(../images/layup/arrowWhite.gif) 0px 10px no-repeat; padding: 5px 10px 10px 15px; width: 195px; } #relatedVehicles .box .title .price { display: block; font-size: 2em; } /* ----- LIST ----- */ #list {} #list .listItem { width: 677px; position: relative; line-height: normal; margin-bottom: 10px; } #list .listItem .btnSaveVehicle { display: block; position: absolute; bottom: 44px; left: 233px; width: 140px; height: 30px; } .internalOfferList #list .listItem .btnSaveVehicle { top: 154px; bottom:auto; } #list .listItem a { display: block; text-decoration: none; font-weight: normal; } #list .listItem .title { display: block; background: url(../images/layup/dotsH.gif) repeat-x bottom left; font-weight: bold; height: 25px; margin-bottom: 15px; } #list .listItem .thumb { display: block; width: 220px; height: 165px; background: url(../images/layup/noImage220x144.gif) no-repeat; float: left; margin-right: 13px; } #list .listItem .itemDetails { padding:0; display: block; float: left; width: 442px; } #list .listItem .itemDetails .contact { display: block; font-size: 2em; color: #ffffff; float: right; } #list .listItem .itemDetails .contact span { display: block; color: #c00606; font-size: 11px; } #list .listItem .itemDetails .price { display: block; font-size: 2em; color: #e8d3d3; height: 40px; } #list .listItem .itemDetails .price span { display: block; color: #c00606; font-size: 11px; } #list .listItem .itemDetails .description { display: block; height: 69px; } #list .listItem .itemDetails .description .heading { display: block; color: #c00606; padding-bottom: 5px; font-size: 17px; line-height: normal; height: 20px; } #list .listItem .itemDetails .description .detailTbl { height:44px; display: block; } #list .listItem .itemDetails .description .detailTbl .field { width: 145px; float: left; padding-bottom: 8px; } #list .listItem .itemDetails .btn { display: block; padding: 5px 0px 0px 0px; float: right; } #list .listItem .itemDetails .btnOffers { display: block; padding: 5px 0px 0px 0px; float: right; } #list .listItem .itemDetails .borderFoot { width: 210px; margin:0; } /* ----- NEW CAR DETAIL ----- */ /* new car inherits most styles from used car styles */ h2.newCar { float: left; width: 240px; } .newPrice { float: left; } .newPrice span { font-size: 0.65em; color: #FFF; } /* new options */ #usedCarOptions.newCarOptions { width:254px; margin:14px 0 0; } #usedCarOptions.newCarOptions a { width:254px; } #usedCarOptions.newCarOptions a#optOne { height: 70px; background: url(../images/layup/spriteNewJumps.gif) 0px 0px no-repeat; } #usedCarOptions.newCarOptions a#optTwo { height: 72px; background: url(../images/layup/spriteNewJumps.gif) 0px -70px no-repeat; } #usedCarOptions.newCarOptions a#optThree { height: 71px; background: url(../images/layup/spriteNewJumps.gif) 0px -142px no-repeat; } #usedCarOptions.newCarOptions a#optFour { height: 87px; background: url(../images/layup/spriteNewJumps.gif) 0px -213px no-repeat; } #usedCarOptions.newCarOptions a#optOne:hover { background: url(../images/layup/spriteNewJumps.gif) 0px -300px no-repeat; } #usedCarOptions.newCarOptions a#optTwo:hover { background: url(../images/layup/spriteNewJumps.gif) 0px -370px no-repeat; } #usedCarOptions.newCarOptions a#optThree:hover { background: url(../images/layup/spriteNewJumps.gif) 0px -442px no-repeat; } #usedCarOptions.newCarOptions a#optFour:hover { background: url(../images/layup/spriteNewJumps.gif) 0px -513px no-repeat; } .clear.dots { background: url(../images/layup/dotH.gif) repeat-x bottom left; margin-bottom: 20px; height: 20px; } /* ----- OFFER LIST ----- */ #offerList #offerTabs { height: 49px; padding: 0px; margin: 0px 0px 10px 0px; list-style: none; } #offerList #offerTabs li { float: left; } #offerList #offerTabs a { display: block; float: left; height: 49px; } #offerList #offerTabs a#offerNew { width: 226px; background: url(../images/layup/spriteOfferList.gif) 0px 0px no-repeat; } #offerList #offerTabs a#offerUsed { width: 226px; background: url(../images/layup/spriteOfferList.gif) -226px 0px no-repeat; } #offerList #offerTabs a#offerAftersales { width: 223px; background: url(../images/layup/spriteOfferList.gif) -452px 0px no-repeat; } #offerList #offerTabs a#offerNew:hover, #offerList #offerTabs .active a#offerNew { background: url(../images/layup/spriteOfferList.gif) 0px -49px no-repeat; } #offerList #offerTabs a#offerUsed:hover, #offerList #offerTabs .active a#offerUsed { width: 226px; background: url(../images/layup/spriteOfferList.gif) -226px -49px no-repeat; } #offerList #offerTabs a#offerAftersales:hover, #offerList #offerTabs .active a#offerAftersales { width: 223px; background: url(../images/layup/spriteOfferList.gif) -452px -49px no-repeat; } #offerList .listItem .borderFoot { width: 220px; } #offerList .listItem a { text-decoration: none; font-weight: normal; } #offerList .listItem .offerImage { float: right; } #offerList .listItem h3 { width: 215px; float: left; margin-right: 10px; font-weight: normal; color: #e8d3d3; font-size: 1.7em; padding-bottom: 5px; } #offerList .listItem .itemText { width: 215px; float: left; margin-right: 10px; color: #fff; padding: 0px 0px 10px 0px; } #offerList .listItem .btn { width: 215px; float: left; margin-right: 10px; } /* ----- OFFER DETAIL ----- */ #offerImage { border-top: 3px solid #252525; padding: 15px 0px 15px 0px; margin: 10px 0px 10px 0px; background: url(../images/layup/dotH.gif) bottom left repeat-x; } .offerFrm .title { margin-bottom: 10px; } .offerFrm form label { text-align: right; width: 130px; margin-right: 15px; } .offerFrm form label.labelLong { width: 300px; } .offerFrm form select, .offerFrm form input.inputfield, .offerFrm form textarea { background: #0f0f0f; border: 1px solid #acacac; color: #ffffff; width: 310px; } .offerFrm form#frmContact select { width: 312px; } /* ----- DEALER DETAIL ----- */ #dealerLocation { width: 351px; float: right; height: 275px; } #dealerLocation #map { width: 351px; position: relative; height: 227px; margin-bottom: 9px; } #dealerLocation #getDirections { width: 351px; height: 39px; background: url(../images/layup/getDirectionsBg.gif) no-repeat; } #dealerLocation #getDirections form { padding: 10px 10px 0px 10px; } #dealerLocation #getDirections input#btnGetDirections { width: 118px; height: 20px; } #dealerImage { width: 297px; height: 275px; position: relative; float: left; } .dealerLeft { width: 343px; float: left; } .dealerRight { width: 310px; float: left; } .dealerLeft p, .dealerRight p { line-height: normal; padding-left: 37px; font-size: 1.3em; } .dealerRight div { padding-left: 37px; } .dealerRight span { display: block; line-height: normal; font-size: 1.3em; } .dealerRight table { margin-bottom: 20px; line-height: normal; } .dealerRight td { padding: 0px 8px 0px 0px; font-size: 1.3em; } /* ----- AFTERSALES ----- */ .aftersales { margin-bottom: 15px; } .servicing { float: left; width: 315px; } .servicing div { min-height:450px; } * html .servicing div { height:450px; } .parts { float: right; width: 315px; } .parts div { min-height:450px; } * html .parts div { height:450px; } /* ----- SERVICE LIST ----- */ #serviceList #serviceTabs { height: 43px; padding: 0px; margin: 0px 0px 10px 0px; list-style: none; } #serviceList #serviceTabs li { float: left; } #serviceList #serviceTabs a { display: block; float: left; height: 43px; cursor:default; } #serviceList #serviceTabs a#serviceWhat { width: 226px; background: url(../images/layup/spriteService.gif) 0px 0px no-repeat; } #serviceList #serviceTabs a#serviceWhen { width: 226px; background: url(../images/layup/spriteService.gif) -226px 0px no-repeat; } #serviceList #serviceTabs a#serviceWho { width: 225px; background: url(../images/layup/spriteService.gif) -452px 0px no-repeat; } #serviceList #serviceTabs .active a#serviceWhat { background: url(../images/layup/spriteService.gif) 0px -43px no-repeat; } #serviceList #serviceTabs .active a#serviceWhen { width: 226px; background: url(../images/layup/spriteService.gif) -226px -43px no-repeat; } #serviceList #serviceTabs .active a#serviceWho { width: 225px; background: url(../images/layup/spriteService.gif) -452px -43px no-repeat; } #serviceJumps a { text-decoration: none; font-weight: bold; text-transform: uppercase; font-size: 16px; } #serviceJumps #inspectionService { position: relative; display: block; width: 226px; height: 248px; background: url(../images/layup/spriteJumpInspection.jpg) 0px 0px no-repeat; float: left; } #serviceJumps #inspectionService:hover { background: url(../images/layup/spriteJumpInspection.jpg) 0px -248px no-repeat; float: left; } #serviceJumps #inspectionService span { position: absolute; top: 123px; left: 55px; } #serviceJumps #mot { position: relative; display: block; width: 227px; height: 248px; background: url(../images/layup/spriteJumpMOT.jpg) 0px 0px no-repeat; float: left; } #serviceJumps #mot:hover { background: url(../images/layup/spriteJumpMOT.jpg) 0px -248px no-repeat; float: left; } #serviceJumps #mot span { position: absolute; top: 123px; left: 62px; } #serviceJumps #somethingElse { position: relative; display: block; width: 222px; height: 248px; background: url(../images/layup/spriteJumpElse.jpg) 0px 0px no-repeat; float: left; } #serviceJumps #somethingElse:hover { background: url(../images/layup/spriteJumpElse.jpg) 0px -248px no-repeat; float: left; } #divWhen .checkRadio { margin-left: 0; left: 4px; float: left; } #divWhen a.info {font-weight:normal;text-decoration:none !important; float: left; margin-top: 2px; margin-left: 2px; } #divWhen a.info:hover { position:relative; z-index:25; margin-left: 2px; } #divWhen a.info span { display: none; font-weight:normal !important; text-decoration:none !important; color: #fff !important; font-size: 0.9em; line-height: 140%; } #divWhen a.info:hover span { display:block !important; position:absolute; padding:10px 8px 10px 29px; background: url(../images/layup/infoBg.gif) 0px 0px no-repeat; top: -417px; left: 16px; width: 271px; height: 494px; color:#fff; text-align: left; text-decoration:none !important; z-index:100;} /* ----- 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; } .printHeader { 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; } .seo {text-decoration:none;font-weight:normal;} .accessibility { position: absolute; left: -500em; } .borderFoot { background: url(../images/layup/dotH.gif) repeat-x bottom left; height: 14px; margin-bottom: 20px; padding-top: 10px; } .boxLeft { width: 310px; float: left; padding-right: 20px; border-right: 1px solid #3a3a3a; } .boxRight { width: 310px; float: right; } .arrowDown { margin-bottom: 10px; } .txtRed { color: #cc0000; } /* ----- HEADINGS & PARAGRAPHS ----- */ h1, h2, h3, h4, h5, h6 { margin:0; padding:0 0 10px 0; font-size:100%; font-weight:bold;} #mainText h2.listHeading { background: url(../images/layup/dotsH.gif) repeat-x bottom left; font-size: 1.8em; font-weight: normal; padding-bottom: 15px; } #mainText h2 { font-size: 1.8em; font-weight: normal; color: #e8d3d3; } #mainText h2 span { color: #cc0000; } #rightCol #mainText p { padding-bottom: 20px; } p { padding:0 0 10px 0; margin:0; } /* ----- TOP NAVIGATION ----- */ #primaryNav { padding: 41px 0px 0px 0px; } #primaryNav ul { list-style: none; margin: 0px; padding: 0px; height: 43px; background: url(../images/layup/navBg.png) repeat-x; width: 960px; } #primaryNav li { padding: 0px; margin: 0px; float: left; background: url(../images/layup/navSeperator.gif) no-repeat right; } #primaryNav li.last { background: none; } #primaryNav li a { display: block; text-decoration: none; padding: 14px 28px 15px 28px; color: #FFFFFF; position: relative; } #primaryNav li a:hover, #primaryNav li.active a { padding: 11px 25px 12px 25px; border: 3px solid #cc0000; } /* ----- 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; z-index: 1000; } #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: 100px; background: none; border-top: 1px solid #cc0000; } #primaryNav ul li:hover ul li, #primaryNav ul li.sfhover ul li { float: none; display: block; padding: 0px 0px 0px 0px; margin: 0px; background: #d42717; width: 100px; border-bottom: 1px solid #cc0000; border-left: 1px solid #cc0000; border-right: 1px solid #cc0000; } #primaryNav ul li:hover ul li a, #primaryNav ul li:hover ul li.active a, #primaryNav ul li.sfhover ul li a, #primaryNav ul li.sfhover ul li.active a { border: none; padding: 10px 10px 13px 15px; margin: 0px; color: #ffffff; position: relative; background: #d42717; } #primaryNav ul li:hover ul li a:hover, #primaryNav ul li:hover ul li.active a:hover, #primaryNav ul li.sfhover ul li a:hover, #primaryNav ul li.sfhover ul li.active a:hover { padding: 8px 8px 11px 13px; margin: 0px; color: #ffffff; border: 2px solid #CCCCCC; } /* ----- 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: 36px; display: inline; position: relative; top: -20px; background:#0f0f0f url(../images/layup/arrowBg.gif) 15px 6px no-repeat; padding: 10px 10px 10px 45px; z-index:9999; } #breadcrumbs a { font-weight: normal; text-decoration: none; padding: 0px; color: #e8d3d3; } #breadcrumbs span { color: #CC0000; font-weight: bold; } #breadcrumbs .btnBack { float: right; padding: 0px; } #sortOptions { float: left; margin-bottom: 20px; margin-top:15px; } #sortOptions #sortUsedCars { float: left; width: 187px; } #sortUsedCars label { position: relative; width: 55px; } .pagination ul { list-style: none; margin: 0; padding: 0; margin-top:15px; } .pagination ul li { float: left; } .pagination { float: right; margin-bottom: 20px; } .pagination a { color: #FFFFFF; margin-left: 4px; padding: 0 4px; text-decoration: none; } .pagination a:hover { background: #cc0000; text-decoration: none; } .pagination .active { background: #cc0000; text-decoration: none; } .pagination span { display: block; float: left; padding: 0 2px; } .pagination img { display: inline; } .pagination .prevNext img { padding-top: 5px; } .pagination .prevNext a:hover { background: none; } /* ----- FOOTER ----- */ #footer { height: 209px; background: url(../images/layup/footerBg.gif) repeat-x; text-align: center; line-height: 235%; } #footer .padding { width: 960px; margin: 0 auto; text-align: left; padding: 35px 0px 0px 0px; } #footer a { font-weight:normal; text-decoration:none;} #footer a:hover { text-decoration:underline;} /* ----- GLOBAL ----- */ img { display:block; border:0; } address { font-style:normal; } /* ----- LINKS ----- */ a { color:#ffffff; 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;} .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:127px; height:27px; border:none;} #frmContact .title { margin-bottom: 10px; } #frmContact label { text-align: right; width: 130px; margin-right: 15px; } #frmContact label.labelLong { width: 300px; } #frmContact select, #frmContact input.inputfield, #frmContact textarea { background: #0f0f0f; border: 1px solid #acacac; color: #ffffff; } .calendarIconSmall { float: left; } /* ----- Prototype Validation ----- */ input.disabled { border: 1px solid #F2F2F2; background-color: #F2F2F2; } input.validation-failed, textarea.validation-failed, select.validation-failed { border: 1px solid #990000 !important; color : #FF3300; } input.validation-passed, textarea.validation-passed, select.validation-passed { border: 1px solid #00CC00 !important; color : #fff; } .validation-advice { margin: 5px 0px 0px 0px !important; width:337px; padding: 0px 5px 0px 5px; background-color: #990000; 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;} /* ----- FINANCE CALCULATOR ----- */ h2.carDetails { padding-bottom: 20px; } #financeCalculator { float: right; width: 251px; } #financeCalculator .title { height: 27px; color: #fff; background: url(../images/layup/financeBg.gif) no-repeat; font-weight: bold; padding: 3px 10px 0px 10px; margin-bottom: 1px; border-bottom: 1px dotted #333333; } #financeCalculator table { width: 100%; } #financeCalculator tr { background: #131212; } #financeCalculator tr.altRow { background: #1f1f1f; } #financeCalculator td { padding: 5px 15px 5px 15px; } #financeCalculator select { width: 70px; } #financeCalculator input { width: 66px; } /* ----- DOMTABS ----- */ .domTabs { float: left; width: 365px; } .domContent { border-bottom: 1px dotted #333333; } .domContent table { width: 100%; } .domContent tr { background: #131212; } .domContent tr.altRow { background: #1f1f1f; } .domContent td { padding: 5px 15px 5px 15px; } #mainText .domContent .usedPrice { width: auto; padding-top: 15px; } .dt1 { display: block; } ul.domHeadings { padding: 0px; margin: 0px; list-style: none; height: 30px; border-bottom: 1px dotted #333333; margin-bottom: 1px; } ul.domHeadings li { float: left; } ul.domHeadings li a { display: block; float: left; color: #FFF; text-decoration: none; font-weight: bold; margin-right: 2px; } ul.domHeadings li span { display: block; float: left; padding: 3px 10px 3px 10px; } ul.domHeadings li a:hover, ul.domHeadings li.active a { background: url(../images/layup/redTabLeft.gif) no-repeat top left; color: #fff; } ul.domHeadings li a:hover span, ul.domHeadings li.active a span { background: url(../images/layup/redTabRight.gif) no-repeat top right; }