/*------------------------------------------------------------------ [Model Brochure Stylesheet] Theme Name: Devan Infiniti Version: 1.0 Last Change: 6/19/2012 - DMH [Table of Contents] 1. Columns 2. Model Header 3. Model Content [Notes] -------------------------------------------------------------------*/ /* 1. COLUMNS */ body {background:url('body_model_bg.png') repeat-x left 125px transparent;} #columns {padding:17px 0 15px 0; margin:0 auto; background:url('column_bg.png') repeat-x center 13px transparent;} .one_column #column_1 {margin:0 6px; width:960px;} /* 2. MODEL HEADER */ #model-header {margin:0 0 17px 0; width:960px; height:403px; position:relative; overflow:visible; z-index:3;} #model-header h1 {padding:0 0 10px 0; width:658px; position:absolute; top:36px; left:24px; z-index:2; font-family:Arial, Helvetica, sans-serif; font-size:20px; font-weight:normal; letter-spacing:2px; color:#fff; text-shadow:1px 1px 3px #333;} #model-header h1.dark {color:#000; text-shadow:none;} #model-header h1 span.remove {display:none;} #model-header h1 span.sub-title {padding:10px 0 0 0; display:block; font-size:30px; font-weight:bold; font-style:italic; letter-spacing:normal;} /* model image */ #model-header-image {position:absolute; top:0; left:0; z-index:1;} /* overlay */ #model-header-overlay {width:233px; position:absolute; top:14px; right:26px; z-index:2;} /* Model Nav */ #model-nav {margin:0 0 20px 63px; position:relative; z-index:3;} #model-nav-btn {padding:4px 24px 4px 0; width:146px; display:block; position:relative; font-family:Arial, Helvetica, sans-serif; font-weight:bold; font-size:0.625em; color:#fff; letter-spacing:1px; text-align:right; text-shadow:1px 1px 3px #333;} #model-nav-btn span {width:25px; height:21px; position:absolute; top:3px; right:-3px; display:block; overflow:hidden; text-indent:-5000px; text-align:left; background:url("model-nav-sprite.png") no-repeat -496px -31px ;} #model-nav-btn:hover {color:#b5b9ff;} #model-nav-btn.down {color:#b5b9ff;} #model-nav-btn.down span {height:16px; background-position:-218px -5px;} #model-nav.dark #model-nav-btn, #model-nav.dark #model-nav-btn.down {color:#000; text-shadow:none;} #model-nav.dark #model-nav-btn:hover, #model-nav.dark #model-nav-btn.down:hover {color:#b5b9ff; text-shadow:none;} #model-nav-options {padding:0 0 8px 0; width:247px; position:absolute; display:none; top:19px; right:-7px; z-index:3; background:url("model-nav-sprite.png") no-repeat -247px bottom;} #model-nav-options ul {padding:20px 0 12px 28px; margin:0; width:219px; background:url("model-nav-sprite.png") no-repeat 0 -21px;} #model-nav-options ul li {padding:0; margin:0; list-style:none;} #model-nav-options ul li, #model-nav-options ul li a {width:203px;} #model-nav-options ul li a {display:block; font-family:Arial, Helvetica, sans-serif; font-size:0.687em; color:#989898;} #model-nav-options ul li a:hover {color:#fff;} #model-nav-options ul li a:active {color:#b5b9ff;} /* box style 01 */ #model-header-overlay .box-style-01{width:233px; position:relative; background:url("model-header-overlay-box-style-01-bg.png") no-repeat;} #model-header-overlay .box-style-01 .bottom {width:233px; height:9px; position:absolute; clear:both; bottom:-9px; left:0; background:url("model-header-overlay-box-style-01-bg.png") no-repeat -233px -241px;} /* price layout */ #model-header-overlay .price-layout {padding:20px 0 0 20px; color:#fff;} #model-header-overlay .price-layout .price {padding:8px 8px 7px 0;display:inline; float:left; font-family:Arial, Helvetica, sans-serif; font-size:2.375em; font-weight:bold; letter-spacing:-2px;} #model-header-overlay .price-layout .price .dollar {padding:3px 0 4px 0; margin:-6px 2px 0 0; float:left; font-size:0.684em;} #model-header-overlay .price-layout .text {padding:3px 0 0 0; width:57px; float:left; font-family:Verdana, Geneva, sans-serif; font-size:0.687em; letter-spacing:0; line-height:11px;} #model-header-overlay .price-layout .text span {display:block;} /* Request Price */ #request-price {margin:7px 0 0 8px; width:217px; height:48px; overflow:hidden; display:block; text-indent:-5000px; background:url("model-request-price-btn.png") no-repeat;} #request-price:hover {background-position:-217px 0;} #request-price:active {background-position:-434px 0;} /* Shopping Tools */ #shopping-tools {margin:25px 0 0 0; position:relative;} #shopping-tools-btn {padding:8px 0 0 19px; height:29px; display:block; font-family:Arial, Helvetica, sans-serif; font-weight:bold; font-size:0.875em; color:#fff; letter-spacing:1px; background:url("model-shopping-tools-btn.png") no-repeat;} #shopping-tools-btn:hover {background-position:-233px 0;} #shopping-tools-btn:active, #shopping-tools-btn.down {padding:9px 0 0 20px; height:28px; background-position:-466px 0;} #shopping-tools-options {padding:27px 0 0 30px; margin:0; width:577px; height:131px; position:absolute; top:32px; right:-20px; display:none; background:url("model-shopping-tools-options-bg.png") no-repeat;} #shopping-tools-options div {width:189px; float:left;} #shopping-tools-options h2 {padding:0 0 0 1px; margin:0; font-family:Arial, Helvetica, sans-serif; color:#383838; text-shadow:1px 1px 3px #999;} #shopping-tools-options ul, #shopping-tools-options ul li {padding:0; margin:0;} #shopping-tools-options ul {padding:9px 0 0 0;} #shopping-tools-options ul li {list-style:none; width:54px;} #shopping-tools-options ul li a {padding:4px 0 4px 33px; margin:0 0 3px 0; width:156px; display:block; font-family:Arial, Helvetica, sans-serif; font-size:0.75em; color:#7b7b7b; font-weight:bold; background:url("model-shopping-tools-icon-sprite-bg.png") no-repeat -3px -4px;} #shopping-tools-options ul li a:hover {color:#0d0095;} #shopping-tools-options a#tool-request-price {background-position:-3px -4px;} #shopping-tools-options a#tool-request-price:hover {background-position:-271px -4px;} #shopping-tools-options a#tool-incentives-offers {background-position:-3px -36px;} #shopping-tools-options a#tool-incentives-offers:hover {background-position:-271px -36px;} #shopping-tools-options a#tool-test-drive {background-position:-3px -68px;} #shopping-tools-options a#tool-test-drive:hover {background-position:-271px -68px;} #shopping-tools-options a#tool-browse-new {background-position:-3px -100px;} #shopping-tools-options a#tool-browse-new:hover {background-position:-271px -100px;} #shopping-tools-options a#tool-browse-used {background-position:-3px -132px;} #shopping-tools-options a#tool-browse-used:hover {background-position:-271px -132px;} #shopping-tools-options a#tool-browse-certified {background-position:-3px -164px;} #shopping-tools-options a#tool-browse-certified:hover {background-position:-271px -164px;} #shopping-tools-options a#tool-apply-credit {background-position:-3px -196px;} #shopping-tools-options a#tool-apply-credit:hover {background-position:-271px -196px;} #shopping-tools-options a#tool-trade-in-value {background-position:-3px -228px;} #shopping-tools-options a#tool-trade-in-value:hover {background-position:-271px -228px;} #shopping-tools-options a#tool-calculator {background-position:-3px -260px;} #shopping-tools-options a#tool-calculator:hover {background-position:-271px -260px;} /* MPG */ ul#mpg-data {padding:0 0 0 29px; margin:13px 0 0 0; width:204px; height:48px; overflow:hidden;} ul#mpg-data li {padding:9px 0 0 0; margin:0 7px 0 0; width:54px; height:39px; float:left; display:block; list-style:none; background:url("model-header-mpg-sprite.png") no-repeat;} ul#mpg-data li.mpg {padding:0; height:48px;} ul#mpg-data li.hwy {margin:0;} ul#mpg-data li, ul#mpg-data li h2 { font-family:Arial, Helvetica, sans-serif; font-weight:bold; font-size:22px; color:#fff; text-align:center; text-transform:lowercase;} ul#mpg-data li span, ul#mpg-data li h2 {display:block; line-height:15px; font-size:11px; font-weight:normal;} ul#mpg-data li h2 {margin:0; padding:27px 0 6px 0; width:54px; background:url("model-header-mpg-sprite.png") no-repeat -54px 0;} /* 3. MODEL CONTENT */ #model-content {padding:11px 0 13px 0; background:none; position:relative; z-index:2;} /* box style 01 */ #model-content .box-style-01 {margin:0 auto 13px auto; width:908px; position:relative; background:url("model-content-box-bg.png") repeat-x #181818; border:1px solid #000; border-bottom:1px solid #333;} #model-content .box-style-01 .bottom {display:none;} /* model features */ #model-content #model-features {padding:10px 0 10px 29px; width:879px;} #model-content #model-features h2 {padding:7px 0 8px 0; margin:0; font-family:Arial, Helvetica, sans-serif; color:#fff; font-size:1.125em;} ul#model-features-list, ul#model-features-list li {padding:0; margin:0;} ul#model-features-list li {margin:0 21px 0 0; width:122px; float:left; list-style:none;} ul#model-features-list li img {width:120px; height:76px; display:block; border:1px solid #000;} ul#model-features-list li p {padding:5px 0 0 0; font-family:Arial, Helvetica, sans-serif; color:#c9c9c9; font-size:0.687em; line-height:13px;} /* model banners */ #model-banners {padding:2px 0 0 19px;} /* model banners - brochure download/request */ #model-brochure, #model-request-brochure {width:307px; height:141px; position:relative; float:left; background:url("model-banners-brochure-btn.png") no-repeat;} body.js #model-brochure, body.js #model-request-brochure {cursor:pointer;} #model-brochure h3, #model-request-brochure h3 {position:absolute; top:27px; left:34px; font-family:Arial, Helvetica, sans-serif; font-size:1.375em; color:#fff;} #model-brochure h3 strong, #model-request-brochure h3 strong {font-size:0.818em; display:block;} #model-brochure h3 strong.small, #model-request-brochure h3 strong.small {font-size:0.727em;} #model-brochure a, #model-request-brochure a {display:block; position:absolute; top:97px; left:70px; font-family:Arial, Helvetica, sans-serif; font-size:0.687em; color:#fff;} #model-brochure a:hover, #model-request-brochure a:hover {color:#ffacac;} /* model banners - featured request offer */ #model-request-offer {width:307px; height:141px; position:relative; float:left; font-family:Arial, Helvetica, sans-serif; text-align:center; background:url("model-request-offer-sprite.png") no-repeat #fff;} body.js #model-request-offer {cursor:pointer;} #model-request-offer h3 {padding:19px 0 0 0; font-size:0.75em; color:#39387a; text-transform:uppercase; letter-spacing:2px; text-shadow:0 1px 3px #7d7c7c;} #model-request-offer h4 {padding:7px 0; margin:0; font-size:2em; color:#545252; letter-spacing:-1px;} #model-request-offer h4.small {padding:7px 0; font-size:1.625em;} #model-request-offer p { font-size:0.625em; color:#545252; font-style:italic; text-transform:uppercase; letter-spacing:2px;} #model-request-offer a {width:152px; height:22px; display:block; position:absolute; top:102px; left:78px; overflow:hidden; text-indent:-5000px; background:url("model-request-offer-sprite.png") no-repeat right top;} #model-request-offer a:hover {background-position:right -29px;} #model-request-offer a:active {background-position:right -58px;} /* model banners - featured offer */ #model-featured-offer {width:307px; height:141px; position:relative; float:left; background:url("model-featured-offer-sprite.png") no-repeat #fff;} #model-featured-offer h3 {width:294px; position:absolute; top:9px; left:7px; font-family:Arial, Helvetica, sans-serif; font-size:0.75em; color:#fff; text-transform:uppercase; text-align:center; text-shadow:1px 1px 3px #333;} #model-featured-offer h4 {width:147px; position:absolute; top:40px; left:7px; font-family:Arial, Helvetica, sans-serif; font-size:0.625em; color:#747272; text-transform:uppercase; text-align:center; line-height:17px;} #model-featured-offer span {display:block; font-family:Verdana, Arial, Helvetica, sans-serif; color:#545252; text-transform:none;} #model-featured-offer span.model {font-size:1.8em;} #model-featured-offer span.trim {font-size:1.2em; line-height:18px;} /* model banners - featured offer - price all */ #model-featured-offer p.payment span.price strong, #model-featured-offer p.payment span.price strong span.dollar, #model-featured-offer p.buy span.price strong, #model-featured-offer p.buy span.price strong span.dollar, #model-featured-offer p.apr, #model-featured-offer p.apr span, #model-featured-offer p.payment-buy span.payment strong, #model-featured-offer p.payment-buy span.buy strong { font-family:Arial, Helvetica, sans-serif; color:#363755; text-shadow:1px 1px 3px #999;} /* model banners - featured offer - price payment */ #model-featured-offer p.payment {width:147px; position:absolute; top:42px; right:7px; text-align:center; line-height:normal;} #model-featured-offer p.payment span.price {display:block; position:relative;} #model-featured-offer p.payment span.price strong {padding:0 0 0 12px; position:relative; font-size:2.5em; letter-spacing:-1px; line-height:38px;} #model-featured-offer p.payment span.price strong span.dollar {padding:0; position:absolute; top:-1px; left:0; font-size:0.65em;} #model-featured-offer p.payment span.text {display:block; font-family:Arial, Helvetica, sans-serif; font-size:0.562em; color:#747272; text-transform:uppercase; text-align:center;} /* model banners - featured offer - price buy */ #model-featured-offer p.buy {width:147px; position:absolute; top:46px; right:7px; text-align:center; line-height:normal;} #model-featured-offer p.buy span.price {display:block; position:relative;} #model-featured-offer p.buy span.price strong {padding:0 0 0 12px; position:relative; font-size:2.25em; letter-spacing:-1px; line-height:38px;} #model-featured-offer p.buy span.price strong span.dollar {padding:0; position:absolute; top:-1px; left:0; font-size:0.65em;} /* model banners - featured offer - price apr */ #model-featured-offer p.payment-buy {width:127px; position:absolute; top:42px; right:7px; line-height:normal;} #model-featured-offer p.payment-buy span.payment strong, #model-featured-offer p.payment-buy span.buy strong {padding:0 0 2px 0; font-size:1.5em; font-weight:bold; line-height:22px;} #model-featured-offer p.payment-buy span.payment strong {float:left;} #model-featured-offer p.payment-buy span.buy strong {line-height:22px; display:block; clear:both;} #model-featured-offer p.payment-buy span.payment span.text {padding:2px 0 0 4px; width:64px; float:left; display:block; font-family:Arial, Helvetica, sans-serif; font-size:0.562em; color:#747272; text-transform:uppercase; text-align:left; line-height:9px;} /* model banners - featured offer - price apr */ #model-featured-offer p.apr {width:147px; position:absolute; top:32px; right:7px; line-height:normal;} #model-featured-offer p.apr strong {width:76px; float:left; display:block; font-size:3.75em; text-align:right;} #model-featured-offer p.apr span.percent {padding:17px 0 6px 0; width:60px; float:left; display:block; font-size:1.625em; text-align:left; line-height:12px;} #model-featured-offer p.apr span.apr {width:60px; float:left; display:block; font-size:0.75em; text-align:left; line-height:11px; font-weight:bold;} #model-featured-offer .small p.apr {right:-10px;} #model-featured-offer .small p.apr strong {padding-top:1px; font-size:3.0em;} #model-featured-offer .smaller p.apr {right:-16px;} #model-featured-offer .smaller p.apr strong {padding-top:5px; font-size:2.5em;} #model-featured-offer a {width:152px; height:22px; display:block; position:absolute; top:104px; left:78px; overflow:hidden; text-indent:-5000px; background:url("model-featured-offer-sprite.png") no-repeat right top;} #model-featured-offer a:hover {background-position:right -29px;} #model-featured-offer a:active {background-position:right -58px;} /* model banners - model banner slider */ #model-banner-slider {position:relative; float:left;} #model-banner-slider, #model-banner-slider .overlay {width:307px; height:141px;} #model-banner-slider ul, #model-banner-slider ul li {padding:0; margin:0;} #model-banner-slider ul {margin:7px 0 0 7px; overflow:hidden;} #model-banner-slider ul li {list-style:none;} #model-banner-slider ul, #model-banner-slider ul li, #model-banner-slider ul li img, #model-banner-slider .sidebar_banner {width:294px; height:127px;} #model-banner-slider .mask-top, #model-banner-slider .mask-right, #model-banner-slider .mask-left, #model-banner-slider .mask-btm {position:absolute; z-index:20; background:url("model-banner-slider-overlay.png") no-repeat;} #model-banner-slider .mask-top {width:298px; height:5px; top:6px; left:5px; background-position:-4px -6px;} #model-banner-slider .mask-right {width:2px; height:121px; top:11px; left:301px; background-position:-300px -11px;} #model-banner-slider .mask-left {width:2px; height:121px; top:11px; left:5px; background-position:-4px -11px;} #model-banner-slider .mask-btm {width:298px; height:5px; top:132px; left:5px; background-position:-4px -132px;} #banner-slide-nav {padding:4px 0 0 0; margin:0 0 0 40%; width:50px; height:8px; text-align:center;} #banner-slide-nav a {margin:0 5px 0 0; width:8px; height:8px; display:block; float:left; overflow:hidden; left:50%; text-indent:-5000px; background:url("model-banner-slider-nav.png") no-repeat -3px -2px;} #banner-slide-nav a:hover, #banner-slide-nav a.activeSlide {background-position:-17px -2px;} /* 3A. MODEL ADDITIONAL CONTENT */ #model-add-content, #model-add-content-inner {width:908px;} #model-add-content {padding:0 32px 30px 32px; margin:0 auto;} #model-add-content-inner {overflow:hidden; border-top:2px solid #666;}