/* - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - Title : Author : Matt Mumford / matt.mumford@gforces.co.uk / G-Forces Web Management Ltd Type: Screen, Projection Description : Screen and projection stylesheet for Silver Street - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */ /* COMMON AND GLOBAL */ html {height:100%;} body { height:100%; font:62.5%/1.6 arial, verdana, helvetica, sans-serif; margin:0; padding:0; color:#fff; text-align:center; background:url(../images/layup/bodyBg.jpg) no-repeat top center #141112; } /* 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! */ body a {text-decoration:none;} /* ----- IDS ----- */ .alone { margin-left:13px; } #container { min-height: 100%; width:960px; margin:0 auto; text-align:left; font-size:110%; line-height: normal; } * html #container{height: 100%; } #printHeader { display:none;} #header { height: 100px; position: relative; } #header .groupHome { margin-left:9px; float:left; width:88px; margin-top:3px;} #header #dealerDropDown {width:200px; height:18px; float:left; font-size:10px; margin-top:3px; text-align:center; background:#534d4e; color:#fff;} #header #logo { position: absolute; top: 28px; left: 13px; } #header #contactDetails { position: absolute; top: 32px; right: 45px; } #header #badge { position: absolute; top: 0px; right: 0px; } #franchiseFlash {width:584px; height:248px; position:relative; float:left; margin:-14px auto 0 50px;} #franchiseFlash .btnBackScroll {position:absolute; top:100px; left:-14px; } #franchiseFlash .btnNextScroll {position:absolute; top:100px; right:4px; } /* ----- LEFT COLUMN ----- */ #leftCol { float: left; width: 280px; } #leftCol .box {} #leftCol .usedCarSearch #frmUsedSearch a.advSearch {margin-top:-15px;} #leftCol .greenGuide { background:url(../images/layup/boxBgGreenGuide.png) no-repeat !important; } .usedCarSearch { width:270px; height:210px; margin:11px auto 0 47px; float:left;} .usedCarSearch #frmUsedSearch {margin-left:25px; margin-top:5px; } .usedCarSearch #frmUsedSearch select {margin-bottom:8px; height: 20px; } .usedCarSearch #frmUsedSearch #marqueDetailId {width:220px;} .usedCarSearch #frmUsedSearch #contractMake {width:220px;} .usedCarSearch #frmUsedSearch #model {width:220px;} .usedCarSearch #frmUsedSearch #contractModel {width:220px;} .usedCarSearch #frmUsedSearch #minPrice {width:105px; float:left; margin-right:10px;} .usedCarSearch #frmUsedSearch #maxPrice {width:105px; float:left;} .usedCarSearch #frmUsedSearch a {font-weight:normal; text-decoration:none; color:#fff;} .usedCarSearch #frmUsedSearch .usedSearchBtns input { padding: 15px 0px 0px 0px; float: left; width:96px; height:30px;} .usedCarSearch #frmUsedSearch .advSearch { display: block; float: right; margin-top: 22px; margin-right: 10px; display: inline; } .usedCarSearch #frmUsedBudgetSearch {margin-left:25px; margin-top:5px; } .usedCarSearch #frmUsedBudgetSearch .usedSearchBtns input { margin:8px 2px 0 0px;width:96px; height:30px;} .usedCarSearch #frmUsedBudgetSearch label { float: left; width: 120px !important; } .usedCarSearch #frmUsedBudgetSearch select {margin-bottom:8px; height: 20px; width:100px !important; } .usedCarSearch #frmUsedBudgetSearch input {margin-bottom:8px; height: 14px; width: 96px !important; } .usedCarSearch #frmUsedSizeSearch {margin-left:16px; margin-top:5px; } .usedCarSearch #frmUsedSizeSearch .usedSearchBtns input { margin:6px 2px 0 9px;width:96px; height:30px;} .usedCarSearch #frmUsedSizeSearch select {margin-bottom:8px; height: 20px; width:100px !important; } .usedCarSearch #frmUsedSizeSearch label { float: left; width: 120px !important; } .usedSearchBtns {width:233px; } .usedCarSearchInternal { width:280px; height:210px; margin:5px auto 10px 47px; float:left;} .usedCarSearchInternal {background:url(../images/layup/usedSearchInternalBg.gif) no-repeat;} .usedCarSearchInternal #modelSearch {display:block; float:left; width:135px; height:38px; background:url(../images/layup/spriteUsedSearchInternal.gif) left top no-repeat;} .usedCarSearchInternal #modelSearch:hover {display:block; float:left; width:135px; height:38px; background:url(../images/layup/spriteUsedSearchInternal.gif) left bottom no-repeat;} .usedCarSearchInternal #modelSearch.active {display:block; float:left; width:135px; height:38px; background:url(../images/layup/spriteUsedSearchInternal.gif) left bottom no-repeat;} .usedCarSearchInternal #budgetSearch {display:block; float:left; width:91px; height:38px; background:url(../images/layup/spriteUsedSearchInternal.gif) -85px top no-repeat;} .usedCarSearchInternal #budgetSearch:hover {display:block; float:left; width:91px; height:38px; background:url(../images/layup/spriteUsedSearchInternal.gif) -85px bottom no-repeat;} .usedCarSearchInternal #budgetSearch.active {display:block; float:left; width:91px; height:38px; background:url(../images/layup/spriteUsedSearchInternal.gif) -85px bottom no-repeat;} .usedCarSearchInternal #sizeSearch {display:block; float:left; width:135px; height:38px; background:url(../images/layup/spriteUsedSearchInternal.gif) -135px top no-repeat;} .usedCarSearchInternal #sizeSearch:hover {display:block; float:left; width:135px; height:38px; background:url(../images/layup/spriteUsedSearchInternal.gif) -135px bottom no-repeat;} .usedCarSearchInternal #sizeSearch.active {display:block; float:left; width:135px; height:38px; background:url(../images/layup/spriteUsedSearchInternal.gif) -135px bottom no-repeat;} .usedCarSearchInternal #frmUsedSearch, .usedCarSearchInternal #frmUsedSizeSearch {margin-left:25px; margin-top:5px; } .usedCarSearchInternal #frmUsedSearch #contractMake {width:220px;} .usedCarSearchInternal #frmUsedSearch #contractModel {width:220px;} .usedCarSearchInternal #frmUsedSearch a {font-weight:normal; text-decoration:none; color:#fff;} .usedCarSearchInternal #frmUsedSearch select {margin-bottom:8px; height: 20px;} .usedCarSearchInternal #frmUsedSearch #marqueDetailId {width:220px;} .usedCarSearchInternal #frmUsedSearch #model {width:220px;} .usedCarSearchInternal #frmUsedSearch #minPrice {width:105px; float:left; margin-right:10px;} .usedCarSearchInternal #frmUsedSearch #maxPrice {width:105px; float:left;} .usedCarSearchInternal #frmUsedSearch .usedSearchBtns input { padding: 15px 0px 0px 0px; float: left; width:96px; height:30px;} .usedCarSearchInternal #frmUsedSearch .advSearch { display: block; float: right; margin-top: 22px; margin-right: 10px; display: inline; } .usedCarSearchInternal #frmUsedBudgetSearch {margin-left:25px; margin-top:5px; } .usedCarSearchInternal #frmUsedBudgetSearch .usedSearchBtns input { margin:8px 2px 0 0px;width:96px; height:30px;} .usedCarSearchInternal #frmUsedBudgetSearch label { float: left; width: 120px !important; } .usedCarSearchInternal #frmUsedBudgetSearch select {margin-bottom:8px; height: 20px; width:100px !important; } .usedCarSearchInternal #frmUsedBudgetSearch input {margin-bottom:8px; height: 14px; width: 96px !important; } .usedCarSearchInternal #frmUsedSizeSearch {margin-left:16px; margin-top:5px; } .usedCarSearchInternal #frmUsedSizeSearch select {margin-bottom:8px; height: 20px; width:100px !important; } .usedCarSearchInternal #frmUsedSizeSearch label { float: left; width: 120px !important; } .usedCarSearchInternal #frmUsedSizeSearch .usedSearchBtns input { margin:6px 2px 0 9px;width:96px; height:30px;} #frmUsedSizeSearch #sizeOptions { width: 239px; height: 100px; background: url(../images/layup/carSizeBg.png) no-repeat; line-height: normal; } #frmUsedSizeSearch #sizeTitle { display: block; padding: 0px 0px 5px 9px; } #frmUsedSizeSearch #sizeOptions .radioOption { padding: 29px 0px 0px 0px; float: left; width: 79px; } #frmUsedSizeSearch #sizeOptions input { top: 2px; left: 2px; width: auto; } #carInsuranceQuotes { color: #FFFFFF; padding: 20px; } /* ----- ADVANCED CAR SEARCH ----- */ #advancedCarSearch {} #advancedCarSearch select { width:150px; margin-bottom:10px; } #searchForm .show div { float: left; margin: 0px 10px 10px 0px; } #searchForm .show div.clear { float: none; margin: 0px; } /* ----- NEWSLETTER UPDATES ----- */ .newsLetter { } .newsLetter {width:280px;display:block; text-decoration:none; text-transform:capitalize; font-weight:normal; float:left; color:#060606; margin-bottom:10px; background:url(../images/layup/stockUpdateBg.gif) no-repeat; } .newsLetter a {text-decoration:none; font-weight:normal; display:block; width:257px; padding:10px 0 0 23px; height:188px; } .newsLetter .title {width:180px;} .newsLetter .image{display:block; margin:15px auto;} .newsLetter .text { display:block; width:165px; font-size:11px; float:left;} .newsLetter .go {float:left; margin:5px auto 0 15px; display:block;} /* ----- STOCK UPDATES ----- */ .stockUpdates { } .stockUpdates {width:280px;display:block; text-decoration:none; text-transform:capitalize; font-weight:normal; float:left; color:#060606; margin-bottom:10px; background:url(../images/layup/stockUpdateBg.gif) no-repeat; } .stockUpdates a {text-decoration:none; font-weight:normal; display:block; width:257px; padding:10px 0 0 23px; height:188px; } .stockUpdates .title {width:180px;} .stockUpdates .image{display:block; margin:15px auto;} .stockUpdates .text { display:block; width:165px; font-size:11px; float:left;} .stockUpdates .go {float:left; margin:5px auto 0 15px; display:block;} /* ----- DEALER LOCATOR INTERNAL ----- */ .dealerLocator { width:280px; display:block; background:url(../images/layup/dealerLocatorInternalBg.gif) no-repeat; text-decoration:none; text-transform:capitalize; font-weight:normal; float:left; color:#060606; margin-bottom:10px; } .dealerLocator a {text-decoration:none; font-weight:normal; display:block; width:257px; padding:10px 0 0 23px; height:188px; } .dealerLocator .title {width:180px;} .dealerLocator .image{display:block; margin:15px auto;} .dealerLocator .text { display:block; width:165px; font-size:11px; float:left;} .dealerLocator .go {float:left; margin:5px auto 0 15px; display:block;} /* ----- CAR VALUATION ----- */ .carValuation { width:280px; display:block; background:url(../images/layup/valueMyCarBg.png) no-repeat; text-decoration:none; text-transform:capitalize; font-weight:normal; float:left; color:#060606; margin-bottom:10px; height: 146px; } .carValuation a { position: relative; text-decoration:none; font-weight:normal; display:block; width:257px; padding:10px 0 0 23px; height:135px; } .carValuation .title { width: 235px; height: 35px; } .carValuation .text { display:block; width:165px; font-size:11px; float:left;} /* ----- BOOK A SERVICE ----- */ .bookService {width:280px; display:block; text-decoration:none; text-transform:capitalize; font-weight:normal; float:left; color:#060606; margin-bottom:10px; } .bookService a {text-decoration:none; font-weight:normal; display:block; width:257px; padding:10px 0 0 23px; height:147px; } .bookService .title {width:180px; height: 38px; } .bookService .text { display:block; width:138px; font-size:11px; float:left;} /* ----- MY FAVOURITES ----- */ .myFavourites {width:257px; height:200px; display:block; text-decoration:none; background:url(../images/layup/seat/favouritesBg.gif) no-repeat; text-transform:capitalize; font-weight:normal; float:left; padding:10px 0 0 23px; color:#060606; } .myFavourites .title {width:180px;} .myFavourites #thumbContain {margin-top:15px; width:235px;} .myFavourites #thumbContain .favThumb {display:block; background:url(../images/layup/seat/favNoImage.jpg) no-repeat; width:60px; height:45px; position:relative; float:left; padding: 2px 0 0 2px; margin-right:23px; margin-bottom:6px;} .myFavourites #thumbContain .favThumb.last {margin-right:0;} .myFavourites #thumbContain .favThumb .favFrame {display:block; position:absolute; top:0px; left:0px; width:64px; width:49px;} .myFavourites .save {float:right; margin:6px 22px 0 auto; display:block;} .myFavourites .compare {float:right; margin:6px 15px 0 auto; display:block;} /* ----- GREEN GUIDE ----- */ .greenGuide {width:280px;display:block; text-decoration:none; background:url(../images/layup/greenGuideBg.gif) no-repeat; text-transform:capitalize; font-weight:normal; float:left; color:#060606; margin-bottom:10px; } .greenGuide a {text-decoration:none; font-weight:normal; display:block; width:257px; padding:10px 0 0 23px; height:198px; } .greenGuide .title {width:180px;} .greenGuide .image{display:block; margin:15px auto 10px;} .greenGuide .text { display:block; width:165px; font-size:11px; float:left; line-height:100%; } .greenGuide .go {float:left; margin:10px auto 0 15px; display:block;} /* ----- RIGHT COLUMN ----- */ #rightColTop { float: left; width: 680px; margin-top:6px; background:url(../images/layup/rightColTop.png) no-repeat; height:13px; border:none; } #rightColBottom { float: right; width: 680px; margin-top:0px; background:url(../images/layup/rightColBottom.png) no-repeat; height:23px; } #rightCol { float: left; width: 663px; background:#faf8f8; color:#333333; min-height:156px; } #rightColShadow{float:left; width:15px; height:154px; } #rightCol .padding {width:643px; float:left; background:url(../images/layup/seat/rightColDash.gif) top left no-repeat; height:auto; margin-bottom:10px; padding-top:20px; margin-left:10px;} #rightCol .paddingFull {width:663px; float:left; background:url(../images/layup/seat/rightColDash.gif) top left no-repeat; height:auto; margin-bottom:10px; padding-top:20px; } /* ----- CMS IMAGE ----- */ #cmsImage{ width:306px; height:239px; position:relative; float:right; padding:9px 0 0 12px; } .cmsFrame {width:318px; height:248px; position:absolute; top:0px; left:0px; background:url(../images/layup/frame296x222.gif) no-repeat;} /* ----- LIST ----- */ #list { width:641px; } .padding .sortContain {width:183px; height:29px; background:url(../images/layup/sortByBg.gif) no-repeat; float:right; margin-top:-19px; margin-bottom:8px;} .padding .sortContain .btn { float:left; margin-left:5px;} .padding .sortContain #sort {width:110px; margin-top:4px; margin-left:10px; float:right;} #list .listItem { width:641px; height:254px; display:block; font-size:11px; margin-bottom:10px; background:url(../images/layup/usedListBg.gif) no-repeat;} #list .listItem a.moreInfo { display: block; padding: 12px 0 0 10px; width:631px; height:165px; margin-bottom:8px;} #list .listItem .thumb { display: block; width:151px; height:115px; position:relative; float:right; margin-right:15px; margin-top:-10px; background:url(../images/layup/noImageNewStock151x113.gif) no-repeat; } #list .listItem .frame { display: block; width:151px; height:115px; position:absolute; top:0px; left:0px;} #list .listItem .location { background:url(../images/layup/locationBg.gif) top right no-repeat; } #list .listItem .title { display: block; width:400px; height:20px; font-size:11px; text-transform:uppercase; margin-bottom:25px; padding-left:15px; } #list .listItem .description { display: block; width:440px; height:30px; font-size:11px; float:left; font-weight:normal; color:#fff; margin-bottom:10px; padding:0 0 0 17px; } #list .listItem .location { display:block; width:280px; height:17px; padding:13px 0 0 17px; float:left; font-size:11px; color:#fff; margin-right:12px; } #list .listItem .price { display:block; width:100px; height:17px; padding-top:12px; float:left; font-size:11px; font-weight:bold; color:#fff; } #list .listItem .price .nowOnly {font-size:18px;} #list .listItem .btnMoreInfo { display: block; width:294px; height:30px; float:left; margin-top:10px; } #list .listItem a.insuranceInfo{ height:15px; width:620px; margin-bottom:2px; display:block;} #list .listItem .insurance { display:block; width:620px; height:15px; padding-left:10px; float:left; font-size:11px; font-weight:normal; color:#fff; } #list .listItem #financeInfo { display:block; width:630px; height:40px; } #list .listItem .finance { display:block; width:640px; float:left; font-size:11px; font-weight:normal; color:#fff; } #list .listItem .finance span { font-weight:bold; } #list .listItem .finance .financeDetails { display:block; width:630px; float:left; font-size:11px; font-weight:normal; color:#fff; } #list .listItem .finance .financeDetails table td {padding:0 30px 2px 0; height:12px; margin:0;} #usedCarListingAdjustFinance { margin: 0px 0px 10px 0px; height: 38px; width: 640px; background: #242424; } #usedCarListingAdjustFinance .adjustFinanceTitle { color: #fff; padding: 2px 8px 2px 8px; font-weight: bold; border-right: 1px solid #fff; } #usedCarListingAdjustFinance div { float:left; } #usedCarListingAdjustFinance form { padding-top: 9px; padding-bottom: 4px; width: 640px; } #usedCarListingAdjustFinance fieldset { display: block; width: 640px; } #usedCarListingAdjustFinance label { text-align: right; padding-right: 7px; padding-top: 3px; color: #fff; } #usedCarListingAdjustFinance select { height: 20px; } #usedCarListingAdjustFinance input { } #usedCarListingAdjustFinance #btnUpdate { width: 68px; height: 19px; position: relative; border: none !important; margin-right: 3px; } /* ----- BOX LIST ----- */ #boxList { width:641px; } #boxList .box { display:block; width:210px; height:199px; float:left; background:url(../images/layup/boxListBg.gif) no-repeat; margin-right:5px; margin-bottom:5px; } #boxList .box.last {margin-right:0;} #boxList .box a { display: block; width:200px; height:189px; padding:10px 0 0 10px; } #boxList .box .thumb { display: block; width:188px; height:141px; position:relative; margin-bottom:10px; background:url(../images/layup/noImage188x141.gif) no-repeat; } #boxList .box .thumb .frame { display: block; width:188px; height:141px; background:url(../images/layup/boxListFrame.gif) no-repeat; position:absolute; top:0px; left:0px; } #boxList .box .title { display: block; float:left; text-transform:uppercase; font-size:11px; width:120px; color:#060606; } #boxList .box .title .heading{ display: block; float:left; text-transform:uppercase; font-size:10px; width:120px; color:#060606; } #boxList .box .go {float:left; margin-left:11px; display:block;} /* ----- BOX LIST NEW CAR ----- */ #boxListNewCar {} #boxListNewCar .box { width:314px; margin:0 7px 7px 0; float:left; } #boxListNewCar .box a { font-weight:normal; text-decoration:none; display:block; } #boxListNewCar .box .model { width:142px; height:129px; background:url(../images/layup/newModelBg.jpg) no-repeat left top; float:left; display:block; } #boxListNewCar .box .model span { font-size:15px; color:#efefef; font-weight:bold; text-align:center; position:relative; top:50%; display:block; } #boxListNewCar .box .thumb { width:171px; border-top:1px solid #b5b5b5; border-right:1px solid #b5b5b5; float:right; display:block; } /* ----- OFFER TABS ----- */ #offerTabLinks { padding: 0; margin: 0px 0px 0px 3px; list-style: none; } #offerTabLinks li { float: left; height: 39px; } #offerTabLinks li#offerNew a { background:url(../images/layup/offersTab.gif) 0px 0px no-repeat; display: block; width: 212px; height: 39px; } #offerTabLinks li#offerNew a:hover, #offerTabLinks li#offerNew.active a { background:url(../images/layup/offersTab.gif) 0px -39px no-repeat; } #offerTabLinks li#offerUsed a { background:url(../images/layup/offersTab.gif) -212px 0px no-repeat; display: block; width: 207px; height: 39px; } #offerTabLinks li#offerUsed a:hover, #offerTabLinks li#offerUsed.active a { background:url(../images/layup/offersTab.gif) -212px -39px no-repeat; } #offerTabLinks li#offerContract a { background:url(../images/layup/offersTab.gif) -419px 0px no-repeat; display: block; width: 217px; height: 39px; } #offerTabLinks li#offerContract a:hover, #offerTabLinks li#offerContract.active a { background:url(../images/layup/offersTab.gif) -419px -39px no-repeat; } #offerTabLinks li span { display: none; } /* ----- DEALER LIST ----- */ #dealerList { position: relative; width: 640px; height: 546px; } #dealerList #dealerListImage { position: absolute; top: 0px; left: 0px; } #dealerList a { position: absolute; background: url(../images/layup/1x1transGif.gif); } #dealerList #vwBrid { width: 71px; height: 69px; top: 31px; left: 250px; } #dealerList #vwCommBrid { width:230px; height:69px; left:325px; top:31px; } #dealerList #audiBarn { width: 106px; height: 54px; top: 218px; left: 6px; } #dealerList #vwBarn { width: 82px; height: 54px; top: 218px; left: 113px; } #dealerList #vwCommBarn { width:190px; height:34px; top:274px; left:6px; } #dealerList #audiTaun { width: 94px; height: 69px; top: 195px; left: 246px; } #dealerList #seatTaun { width: 73px; height: 69px; top: 195px; left: 338px; } #dealerList #vwTaun { width: 79px; height: 69px; top: 195px; left: 410px; } #dealerList #vwcTaun { width: 245px; height: 43px; top: 265px; left: 246px; } #dealerList #audiPlym { width: 140px; height: 69px; top: 363px; left: 46px; } #dealerList #audiExet { width: 140px; height: 69px; top: 363px; left: 477px; } #dealerList #audiNewt { width: 140px; height: 69px; top: 460px; left: 455px; } /* ----- NEW CAR DETAILS ----- */ #newCarDetails{float:right; width:318px; height:auto; margin:0 auto 15px 15px;} #newCarImage { width:306px; height:239px; position:relative; float:right; padding:9px 0 0 12px; } .newCarFrame {width:318px; height:248px; position:absolute; top:0px; left:0px; background:url(../images/layup/frame296x222.gif) no-repeat;} .view{position:absolute; top:9px; right:10px; display:block;} #newCarSprite{width:318px; height:135px; float:right;} #newCarSprite #brochure a{width:153px; height:65px; float:left; display:block;} #newCarSprite #testDrive a{width:165px; height:65px; float:left; display:block;} #newCarSprite #site a{width:153px; height:70px; float:left; display:block;} #newCarSprite #download a{width:165px; height:70px; float:left; display:block;} #newCarSprite #brochure a{ background:url(../images/layup/spriteNewCarDetails.jpg) left top no-repeat; } #newCarSprite #brochure a:hover { background:url(../images/layup/spriteNewCarDetails.jpg) left -135px no-repeat; } #newCarSprite #testDrive a{ background:url(../images/layup/spriteNewCarDetails.jpg) right top no-repeat; } #newCarSprite #testDrive a:hover { background:url(../images/layup/spriteNewCarDetails.jpg) right -135px no-repeat; } #newCarSprite #site a{ background:url(../images/layup/spriteNewCarDetails.jpg) left -65px no-repeat; } #newCarSprite #site a:hover { background:url(../images/layup/spriteNewCarDetails.jpg) left -200px no-repeat; } #newCarSprite #download a{ background:url(../images/layup/spriteNewCarDetails.jpg) right -65px no-repeat; } #newCarSprite #download a:hover { background:url(../images/layup/spriteNewCarDetails.jpg) right -200px no-repeat; } #newCarButtons{ width:308px; padding-left:10px; height:auto; float:right; clear:right; } #newCarSprite #brochure a.inactive { background:url(../images/layup/spriteNewCarDetailsInactive.jpg) left top no-repeat; } #newCarSprite #brochure a.inactive:hover { background:url(../images/layup/spriteNewCarDetailsInactive.jpg) left top no-repeat; } #newCarSprite #testDrive a.inactive { background:url(../images/layup/spriteNewCarDetailsInactive.jpg) right top no-repeat; } #newCarSprite #testDrive a.inactive:hover { background:url(../images/layup/spriteNewCarDetailsInactive.jpg) right top no-repeat; } #newCarSprite #site a.inactive { background:url(../images/layup/spriteNewCarDetailsInactive.jpg) left -65px no-repeat; } #newCarSprite #site a.inactive:hover { background:url(../images/layup/spriteNewCarDetailsInactive.jpg) left -65px no-repeat; } #newCarSprite #download a.inactive { background:url(../images/layup/spriteNewCarDetailsInactive.jpg) right -65px no-repeat; } #newCarSprite #download a.inactive:hover { background:url(../images/layup/spriteNewCarDetailsInactive.jpg) right -65px no-repeat; } #fileList { width:170px; } #fileList a {color:#fff; text-decoration:none; } #fileList .top { width:170px; height:6px; background:url(../images/layup/fileListTop.gif) no-repeat; display:block; } #fileList .bottom { width:170px; height:6px; background:url(../images/layup/fileListBottom.gif) no-repeat; display:block; } #fileList .middle { background:#232020; width:155px; padding-left:15px; } #newCarDetail {} #newCarDetail h3 { width:auto; font-size:18px; font-weight:bold; padding:0 0 10px; } #newCarDetail #mainImg { margin:0 0 15px; padding:13px 11px; position:relative; float:left; } #newCarDetail #mainImg .frame { position:absolute; left:0; top:0; } #selectVar { margin:0 0 20px; } #selectVar select { width:260px; } #options { width:265px; float:right; } #options a.spriteLink { width:265px; height:28px; padding:0 0 5px; display:block; } #options a.spriteLink span { display:none; } #vehicleSelect { margin-bottom: 5px; } #vehicleSelect ul { margin: 0px; padding: 0px; list-style: none; } #vehicleSelect ul#vehicleVariant { display: block; width: 263px; position: relative; } #vehicleSelect ul#vehicleVariant li { width: 263px; float: left; } #vehicleSelect ul#vehicleVariant li ul { position: absolute; left: -999em; } #vehicleSelect ul#vehicleVariant li ul li { width: 240px; } #vehicleSelect ul#vehicleVariant li:hover ul, #vehicleSelect ul#vehicleVariant li.sfhover ul { position: absolute; left: auto; right: 0 !important; display: block; width: 240px; } #vehicleSelect ul#vehicleVariant li:hover ul li a, #vehicleSelect ul#vehicleVariant li.sfhover ul li a { display: block; width: 200px; padding: 8px 20px 11px 20px; } /* ----- USED CAR DETAIL ----- */ #usedCarInfo {width:626px; height:238px; padding: 15px 0 0 15px; background:url(../images/layup/usedCarInfoBg.gif) no-repeat;} #usedCarPhoto { float: left; position: relative; width:297px; height:223px; margin-right:8px; background:url(../images/layup/noImage297x223.gif) no-repeat; } #usedCarPhotoThumb { background:url(../images/layup/usedCarPhotoFrame.gif) no-repeat; width:297px; height:223px; position:absolute; top:0px; left:0px; } #usedCarPhoto .reduced {width:84px; height:84px; position:absolute; top:-6px; right:-7px;} #usedCarPhoto .enlarge { position: absolute; } #usedCarPhoto .special { position: absolute; } #printMap { display: none; } #usedCarThumbs { float: left; width:297px; height:94px; overflow: hidden; margin-left: 7px; position: relative; } #usedCarThumbs .btnBack { width:85px; height:64px; background:url(../images/layup/thumbnailViewerBack.png) no-repeat; float: left; position:absolute; display:block; top:0; left:0; z-index: 1; } #usedCarThumbs .btnNext { width:85px; height:64px; background:url(../images/layup/thumbnailViewerNext.png) no-repeat; position:absolute; display:block; top:0; right:0; z-index: 1; } #thumbnailSlider { width: 5000px; display:inline; } #thumbnailSlider .thumb { float: left; width: 94px; height:71px; position:relative; margin-right: 6px; } #thumbnailSlider .thumb .frame { display: block; position:absolute; top:0px; left:0px; background:url(../images/layup/usedCarPhotoThumbFrame.gif) no-repeat; } #thumbnailSlider .thumb a { display: block; width: 94px; height: 71px; cursor: pointer; } #usedCarThumbnails #thumbnailSlider { width:10000px; display:inline; } #usedCarThumbnails .thumb { width:83px; height:62px; border:1px #c4c6c6 solid; position:relative; margin:0 7px 0 0; display:block; float:left; } #usedCarThumbnails .thumb .end { margin:0; } #usedCarThumbnails .thumb .btnBack { width:85px; height:64px; background:url(../images/layup/thumbnailViewerBack.png) no-repeat; position:absolute; display:block; top:0; left:0; } #usedCarThumbnails .thumb .btnNext { width:85px; height:64px; background:url(../images/layup/thumbnailViewerNext.png) no-repeat; position:absolute; display:block; top:0; left:0; } #usedCarDetails { float:left; width:297px; font-weight:bold; color:#fff; margin-left: 15px; } #usedCarDetails .usedTitle { font-size:14px; text-transform:uppercase; height: 38px; } #usedCarDetails .usedPriceWas { font-size:18px; text-transform:uppercase; } #usedCarDetails .usedPriceNow { font-size:20px; text-transform:uppercase; padding-bottom: 20px; } #usedCarDetails .usedLocation { font-size:13px; height: 48px; } #usedCarDetails .usedLocationTitle { font-size: 12px; text-transform:uppercase; } #usedCarOptions {} #spriteUsedCar {width:641px; height:93px; margin-top:8px; } #spriteUsedCar #enquire a{height:93px; width:131px; display:block; float:left; } #spriteUsedCar #testDrive a{height:93px; width:129px; display:block; float:left; } #spriteUsedCar #print a{height:93px; width:131px; display:block; float:left; } #spriteUsedCar #send a{height:93px; width:127px; display:block; float:left; } #spriteUsedCar #save a{height:93px; width:123px; display:block; float:left; } #usedVehicleDetails #carDetails a{ height:35px; width:110px; display:block; } #usedVehicleDetails #spec a{ height:35px; width:131px; display:block; } #usedVehicleDetails #warrenty a{ height:35px; width:147px; display:block; } #usedVehicleDetails { background:url(../images/layup/domtabBg.jpg) no-repeat; } #spriteUsedCar #enquire a{ background:url(../images/layup/spriteUsedCar.gif) no-repeat left top;} #spriteUsedCar #enquire a:hover{ background:url(../images/layup/spriteUsedCar.gif) no-repeat left bottom;} #spriteUsedCar #testDrive a{ background:url(../images/layup/spriteUsedCar.gif) no-repeat -131px top;} #spriteUsedCar #testDrive a:hover{ background:url(../images/layup/spriteUsedCar.gif) no-repeat -131px bottom ;} #spriteUsedCar #print a{ background:url(../images/layup/spriteUsedCar.gif) no-repeat -260px top;} #spriteUsedCar #print a:hover{ background:url(../images/layup/spriteUsedCar.gif) no-repeat -260px bottom;} #spriteUsedCar #send a{ background:url(../images/layup/spriteUsedCar.gif) no-repeat -391px top;} #spriteUsedCar #send a:hover{ background:url(../images/layup/spriteUsedCar.gif) no-repeat -391px bottom;} #spriteUsedCar #save a{ background:url(../images/layup/spriteUsedCar.gif) no-repeat -517px top;} #spriteUsedCar #save a:hover{ background:url(../images/layup/spriteUsedCar.gif) no-repeat -517px bottom;} #usedVehicleDetails #carDetails a{ background: url(../images/layup/spriteDomtabCarDetails.gif) left -70px; } #usedVehicleDetails #carDetails a:hover{ background: url(../images/layup/spriteDomtabCarDetails.gif) left -35px; } #usedVehicleDetails #carDetails.active a{ background: url(../images/layup/spriteDomtabCarDetails.gif) left top; } #usedVehicleDetails #spec a{ background: url(../images/layup/spriteDomtabCarDetails.gif) -110px -70px; } #usedVehicleDetails #spec a:hover{ background: url(../images/layup/spriteDomtabCarDetails.gif) -110px -35px; } #usedVehicleDetails #spec.active a{ background: url(../images/layup/spriteDomtabCarDetails.gif) -110px top; } #usedVehicleDetails #warrenty a{ background: url(../images/layup/spriteDomtabCarDetails.gif) -241px -70px; } #usedVehicleDetails #warrenty a:hover{ background: url(../images/layup/spriteDomtabCarDetails.gif) -241px -35px; } #usedVehicleDetails #warrenty.active a{ background: url(../images/layup/spriteDomtabCarDetails.gif) -241px top; } #finance { background:url(../images/layup/financeDomtabBG.gif) no-repeat left bottom #292929;} #finance #financeTab a {background:url(../images/layup/spriteFinance.gif) no-repeat left -37px; } #finance #financeTab a:hover {background:url(../images/layup/spriteFinance.gif) no-repeat left bottom; } #finance #financeTab.active a {background:url(../images/layup/spriteFinance.gif) no-repeat left top; } #finance #insurance a{ background:url(../images/layup/spriteFinance.gif) no-repeat right -37px; } #finance #insurance a:hover{ background:url(../images/layup/spriteFinance.gif) no-repeat right bottom; } #finance #insurance.active a{ background:url(../images/layup/spriteFinance.gif) no-repeat right top} #valueContain {width:244px; float:right;} #usedVehicleDetails .trAlt { background:#000; } /*----- CODEWEAVERS -----*/ #finance { width:641px; float:left;} #finance #financeTab a{ height:37px; width:144px; display:block; } #finance #insurance a{ height:37px; width:497px; display:block; } #finance #btnContain {width:103px; float:left;} #finance #cwFinanceOptions {height: 50px; width:470px; margin-left:28px; float:left; font-size:11px; font-weight:bold;} #finance #cwFinanceOptions div {float:left; width:110px;} #finance #cwFinanceOptions #TotalDeposit{ width:73px; } #finance #cwCarInsuranceForm { color:#FFF; padding:20px; } #finance #cwCarInsuranceForm div { margin:0 0 10px; } #finance #cwCarInsuranceForm label { color:#FFF; } #hirePurchaseContain {width:641px; height:auto; color:#fff; margin-bottom:15px; background:url(../images/layup/hireBgRepeat.gif) repeat-y;} #hirePurchaseContain #top { width:641px; height:31px; padding:37px 0 0 0; font-size:11px; background:url(../images/layup/hireTop.gif) no-repeat; position: relative; } #hirePurchaseContain #top a#linkHP { display: block; position: absolute; width: 213px; height: 67px; top: 0px; left: 0px; background: url(../images/layup/ie6LinkFix.gif); } #hirePurchaseContain #top a#linkLP { display: block; position: absolute; width: 212px; height: 67px; top: 0px; left: 214px; background: url(../images/layup/ie6LinkFix.gif); } #hirePurchaseContain #top a#linkPCP { display: block; position: absolute; width: 213px; height: 67px; top: 0px; left: 427px; background: url(../images/layup/ie6LinkFix.gif); } #hirePurchaseContain .columnTitle { width:195px; height:30px; font-size:11px; float:left; padding:0 8px; color:#fff; } #hirePurchaseContain .hireColumn { width:195px; float:left; padding:8px; color:#fff; } #hirePurchaseContain .hireColumn .applyBtn { margin:10px auto; } #hirePurchaseContain .hireColumn table {width:195px; margin:0 auto;} #hirePurchaseContain .hireColumn td {padding-bottom:3px;} #hirePurchaseContain #bottom { width:634px; height:72px; padding:10px 0 0 10px; line-height:17px; background:url(../images/layup/hireBottom.gif) no-repeat; } #hirePurchaseContain #bottom .bottomText {width:460px; float:left; } #hirePurchaseContain #bottom .apr {float:left; font-size:15px; font-weight:bold; margin:18px 0 0 18px;} /*----- CODEWEAVERS END -----*/ #relatedVehicles { width:641px; } #relatedVehicles .box { display:block; width:173px; height:181px; float:left; background:url(../images/layup/relatedCarsBg.gif) no-repeat; margin-right:0px; margin-bottom:5px; } #relatedVehicles .box.first {margin-left:-9px;} #relatedVehicles .box.last {margin-right:5px;} #relatedVehicles .box a { display: block; width:164px; height:176px; padding:10px 0 0 16px; } #relatedVehicles .box .thumb { display: block; width:149px; height:112px; position:relative; margin-bottom:10px; background:url(../images/layup/noImage149x112.gif); } #relatedVehicles .box .thumb .frame { display: block; width:149px; height:112px; background:url(../images/layup/relatedCarsFrame.gif) no-repeat; position:absolute; top:0px; left:0px; } #relatedVehicles .box .title { display: block; float:left; text-transform:uppercase; color:#060606; font-size:11px; width:80px; font-weight:bold; } #relatedVehicles .box .title .heading{ display: block; float:left; text-transform:uppercase; font-size:9px; width:80px; margin-top:5px; color:#060606; } #relatedVehicles .box .go {float:left; margin-left:11px; display:block;} /* ----- CONTACT ----- */ #mapContain { width:646px; height:319px; padding:20px 0 0 17px; background:url(../images/layup/mapBg.gif) no-repeat; } #mapContain h1 { width: auto; } #map{ width:306px; float:left; margin-top:15px; margin-right:10px; margin-bottom:5px; height: 232px; } #locationImage{ width:306px; float:left; margin-top:15px; margin-bottom:5px; } #mapContain .mapBorder {display:block; border:4px solid #d4d1cf;} #mapContain #directions {width:150px; margin-right:10px;} #contactHoursContain {width:649px; height:357px; float:left; padding:12px 0 0 13px; font-size:11px; color:#000; background:url(../images/layup/contactDetailsBg.gif) no-repeat;} #contactHoursContain #details { width:285px; height:200px; float:left; margin-right:25px; padding-left:10px; padding-right:10px;} #contactHoursContain #details h1 {margin-bottom:25px;} #contactHoursContain #details .heading {font-weight:bold; text-transform:uppercase; width:285px; margin:0; padding:0;} #contactHoursContain #details .headingSmall {font-weight:bold; text-transform:uppercase; width:120px; float:left;} #contactHoursContain #details .half {width:120px; float:left;} #contactHoursContain #businessHours { width:285px; height:200px; float:left; padding-left:10px; padding-right:10px;} #contactHoursContain #businessHours h1 {margin-bottom:25px;} #contactHoursContain #businessHours .heading {font-weight:bold; text-transform:uppercase; width:285px; margin:0; padding:0;} .dealerItem {width:641px; height:150px; margin-bottom:20px; text-decoration:none;} .dealerItem a {width:641px; height:150px; display:block; text-decoration:none;} .dealerItem .dealerImage { display:block; width:200px; height:150px; float:left; background:url(../images/layup/noImage200x150.gif) no-repeat; margin-right:20px;} .dealerItem .location { display:block; text-decoration:none; float:left; font-size:11px; font-weight:bold; text-transform:uppercase; width:400px; padding-bottom:5px;} .dealerItem .address { display:block; text-decoration:none; float:left; font-size:11px; font-weight:normal; width:400px; padding-bottom:5px;} .dealerItem .phone { display:block; text-decoration:none; float:left; font-size:11px; font-weight:normal; width:400px ;padding-bottom:5px; } .dealerItem .email { display:block; text-decoration:none; float:left; font-size:11px; font-weight:normal; width:400px; padding-bottom:5px;} /* ----- FAVOURITES ----- */ #viewFavourites { border-collapse: separate; } #viewFavourites thead th { background: #dbdbdb; padding: 2px 5px 2px 5px; } #viewFavourites td { background: #efefef; padding: 2px 5px 2px 5px; } #viewFavourites td.noBg { background: none; } /* ----- TOOL TIPS ----- */ a.info { font-weight:normal; text-decoration:none !important; color: #FFFFFF !important; } a.info:hover { position:relative; z-index:25; } a.info span { color:#000000 !important; display:none; font-weight:normal !important; text-decoration:none !important; } a.info:hover span { background:#FFFFFF; border:1px solid #333333; color:#000000; display:block !important; left:0; padding: 10px; position:absolute; text-align: justify; text-decoration:none !important; top:20px; width:16em; 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; } .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;} .franchiseBold {color:#db002a;} /* ----- HEADINGS & PARAGRAPHS ----- */ h1, h2, h3, h4, h5, h6 { margin:0; padding:0 0 10px 0; font-size:100%; font-weight:bold; width:250px;} h1{ font-size:15px; font-weight:bold; color:#fff; padding:0;} h2 {font-size:12px; font-weight:bold; color:#333333; width:300px; float:left;} h3{ font-size:15px; font-weight:bold; color:#000; padding:0;} .title{ display:block; font-size:15px; font-weight:bold; color:#fff; padding:0;} p { padding:0 0 5px 0; margin:0; } .bold {font-weight:bold;} /* ----- PRIMARY HOME NAV (only on homepage for group and franchise) ----*/ #primaryHomeNav li a:hover span { text-decoration: none; background:url(../images/layup/navLeftBg.gif) no-repeat left top;} #primaryHomeNav li a:hover { display: block; float: left; text-decoration: none; background:url(../images/layup/navRightBg.gif) right top no-repeat; } #primaryHomeNav li { background:url(../images/layup/navDivider.gif) no-repeat top right;} /* ----- TOP NAVIGATION ----- */ #primaryNav { width:931px; height:61px; padding:0; clear:both; margin:12px auto 0 auto; background:url(../images/layup/primaryNavBg.jpg) repeat-x; } #primaryNav ul { list-style: none; margin: 0; padding: 0; } #primaryNav li { float: left; padding-right: 1px; background:url(../images/layup/primaryNavDivider.gif) no-repeat top right; } #primaryNav li.last {background:none; padding:0;} #primaryNav li.last a span { padding:12px 48px 17px 48px !important;} #primaryNav li a { float: left; color:#fff; text-decoration: none; font-weight:bold; } #primaryNav li a span { display: block; padding: 12px 50px 17px 50px;} #primaryNav li a:hover span { text-decoration: none; } #primaryNav li a:hover { display: block; float: left; text-decoration: none; background:url(../images/layup/primaryNavBgHover.jpg) repeat-x; } /* ----- SECONDARY NAVIGATION ----- */ #secondaryNav {} #secondaryNav ul { list-style: none; margin: 0; padding: 0; } #secondaryNav li { } #secondaryNav li a { text-decoration: none; } /* ----- 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: 17px; background:url(../images/layup/breadCrumbBgLeft.gif) no-repeat left; margin-left:8px; color:#fff; font-weight:bold; padding:4px 0 0 25px; float:left; min-width:120px; margin-bottom:5px; } #breadcrumbs a { font-weight: normal; text-transform:uppercase; text-decoration: none; color:#fff; padding:3px 5px 0px 0px; font-weight:bold; height:19px; } #breadcrumbs .crumbDivider { display:block; text-decoration: none; float: left; padding:2px 5px 4px 0px; font-weight:bold; } .end {float:left; height:21px; width:10px; display:block;} #breadcrumbs .btnBack { float: right; padding: 0px; } .end{ background:url(../images/layup/breadCrumbBgRight.gif) no-repeat right; } .pagination { float: right; margin:0; height:10px; display:block; font-weight:normal; } .pagination ul {margin:0 10px 0 0; padding:0;} .pagination li {float:left; list-style:none;} .pagination a { padding: 0px 4px 0px 4px; text-decoration: none; font-weight:normal } .pagination a:hover { text-decoration: none; background:#a80000; color:#FFFFFF; font-weight:bold; } .pagination .active { text-decoration: none; background:#a80000; color:#FFFFFF; } .pagination span { display: block; float: left; padding: 0px 2px 0px 2px; } .pagination li .nextPrev { font-weight:bold;} /* ----- FOOTER ----- */ #footer { height:148px; font-size:110%; margin-top:-148px;} #footer .padding { width:960px; margin: 0 auto; height:148px; } #footer .padding #footerInfo { width:693px; height:85px; padding-top:7px; float:left;} #footer .padding #footerInfo .logo {float:left; margin-left:5px; } #footer .padding #footerInfo .content {float:left; height:78px; padding-top:7px; text-align:left; } #footer a { font-weight:normal; text-decoration:none; } #footer a:hover { text-decoration:underline; } #footer .padding .backTop {display:block; width:126px; height:21px; background:url(../images/layup/backTop.gif) no-repeat; float:left; font-size:14px; font-weight:bold; text-transform:uppercase; margin-bottom:13px; margin-top:3px; text-align:left; padding:6px;} #footer .padding .backTop a {text-decoration:none; font-weight:bold; } #footer #footerBadge { width:101px; height:84px; float:right;} #footer #footerBadge { width:91px; height:74px; float:right; padding:10px 0 0 10px;} #footerInternal { height:148px; font-size:110%; margin-top:-148px; background:url(../images/layup/footerInternalBg.gif) repeat-x;} #footerInternal .padding { width:935px; margin: 0 auto; height:148px; } #footerInternal .padding #footerInfo { width:693px; height:85px; padding-top:7px; float:left; background:url(../images/layup/footerInfoBg.gif) no-repeat;} #footerInternal .padding #footerInfo .logo {float:left; margin-left:5px; } #footerInternal .padding #footerInfo .content {float:left; height:78px; padding-top:7px; text-align:left; color:#fff; } #footerInternal a { font-weight:normal; text-decoration:none; color:#fff; } #footerInternal a:hover { text-decoration:underline; } #footerInternal .padding .backTop {display:block; width:126px; height:21px; background:url(../images/layup/backTopInternal.gif) no-repeat; float:left; font-size:14px; font-weight:bold; text-transform:uppercase; margin-bottom:13px; margin-top:3px; text-align:left; padding:6px;} #footerInternal .padding .backTop a {text-decoration:none; font-weight:bold; } #footerInternal #footerBadge { width:91px; height:74px; float:right; padding:10px 0 0 10px;} /* ----- GLOBAL ----- */ img { display:block; border: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; } legend { padding:0; margin:0; display:none; } label { display:block; width:260px; float:left; } input, textarea { width:200px; font-size:11px !important;} .required { color:#9a0000;} .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:55px; height:18px; border:none;} /* ----- Prototype Validation ----- */ input.disabled { border: 1px solid #F2F2F2; background-color: #F2F2F2; } input.validation-failed, textarea.validation-failed, select.validation-failed { border: 1px solid red; 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: #000; 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;}