/* normalize.css 2012-03-11T12:53 UTC - http://github.com/necolas/normalize.css */ /* ============================================================================= HTML5 display definitions ========================================================================== */ /* * Corrects block display not defined in IE6/7/8/9 & FF3 */ article, aside, details, figcaption, figure, footer, header, hgroup, nav, section, summary { display: block; } /* * Corrects inline-block display not defined in IE6/7/8/9 & FF3 */ audio, canvas, video { display: inline-block; display: inline; zoom: 1; } /* * Prevents modern browsers from displaying 'audio' without controls * Remove excess height in iOS5 devices */ audio:not([controls]) { display: none; height: 0; } /* * Addresses styling for 'hidden' attribute not present in IE7/8/9, FF3, S4 * Known issue: no IE6 support */ [hidden] { display: none; } /* ============================================================================= Base ========================================================================== */ /* * 1. Corrects text resizing oddly in IE6/7 when body font-size is set using em units * http://clagnut.com/blog/348/#c790 * 2. Prevents iOS text size adjust after orientation change, without disabling user zoom * www.456bereastreet.com/archive/201012/controlling_text_size_in_safari_for_ios_without_disabling_user_zoom/ */ html { font-size: 100%; /* 1 */ -webkit-text-size-adjust: 100%; /* 2 */ -ms-text-size-adjust: 100%; /* 2 */ } /* * Addresses font-family inconsistency between 'textarea' and other form elements. */ html, button, input, select, textarea { font-family: sans-serif; } /* * Addresses margins handled incorrectly in IE6/7 */ body { margin: 0; } /* ============================================================================= Links ========================================================================== */ /* * Addresses outline displayed oddly in Chrome */ a:focus { outline: thin dotted; } /* * Improves readability when focused and also mouse hovered in all browsers * people.opera.com/patrickl/experiments/keyboard/test */ a:hover, a:active { outline: 0; } /* ============================================================================= Typography ========================================================================== */ /* * Addresses font sizes and margins set differently in IE6/7 * Addresses font sizes within 'section' and 'article' in FF4+, Chrome, S5 */ /* h1 { margin: 0.67em 0; } h2 { margin: 0.83em 0; } h3 { margin: 1em 0; } h4 { margin: 1.33em 0; } h5 { margin: 1.67em 0; } h6 { margin: 2.33em 0; }*/ h1, h2, h3, h4, h5, h6 { margin: 0; font-weight: normal; } h1 { line-height: 1; } /* * Addresses margins set differently in IE6/7 */ p, pre { margin: 1em 0; } small { font-size: 75%; } /* * Prevents sub and sup affecting line-height in all browsers * gist.github.com/413930 */ sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; } sup { top: -0.5em; } sub { bottom: -0.25em; } /* ============================================================================= Lists ========================================================================== */ /* * Addresses margins set differently in IE6/7 */ dl, menu, ol, ul { margin: 0; } dd { margin: 0 0 0 40px; } /* * Addresses paddings set differently in IE6/7 */ menu, ol, ul { padding: 0; } /* * Corrects list images handled incorrectly in IE7 */ ul, ol { list-style: none; list-style-image: none; } /* ============================================================================= Embedded content ========================================================================== */ /* * 1. Removes border when inside 'a' element in IE6/7/8/9, FF3 * 2. Improves image quality when scaled in IE7 * code.flickr.com/blog/2008/11/12/on-ui-quality-the-little-things-client-side-image-resizing/ */ img { border: 0; /* 1 */ -ms-interpolation-mode: bicubic; /* 2 */ } /* ============================================================================= Figures ========================================================================== */ /* * Addresses margin not present in IE6/7/8/9, S5, O11 */ figure { margin: 0; } /* ============================================================================= Forms ========================================================================== */ /* * Corrects margin displayed oddly in IE6/7 */ form { margin: 0; } /* * Define consistent border, margin, and padding */ fieldset { border: 0; margin: 0; padding: 0; } /* * 1. Corrects color not being inherited in IE6/7/8/9 * 2. Corrects text not wrapping in FF3 * 3. Corrects alignment displayed oddly in IE6/7 */ legend { border: 0; /* 1 */ padding: 0; white-space: normal; /* 2 */ margin: 0; } /* * 1. Corrects font size not being inherited in all browsers * 2. Addresses margins set differently in IE6/7, FF3+, S5, Chrome * 3. Improves appearance and consistency in all browsers */ button, input, select, textarea { font-size: 100%; /* 1 */ margin: 0; /* 2 */ vertical-align: baseline; /* 3 */ vertical-align: middle; /* 3 */ } /* * Addresses FF3/4 setting line-height on 'input' using !important in the UA stylesheet */ button, input { line-height: normal; /* 1 */ } /* * 1. Improves usability and consistency of cursor style between image-type 'input' and others * 2. Corrects inability to style clickable 'input' types in iOS * 3. Removes inner spacing in IE7 without affecting normal text inputs * Known issue: inner spacing remains in IE6 */ button, input[type="button"], input[type="reset"], input[type="submit"] { cursor: pointer; /* 1 */ -webkit-appearance: button; /* 2 */ overflow: visible; /* 3 */ } /* * Re-set default cursor for disabled elements */ button[disabled], input[disabled] { cursor: default; } /* * 1. Addresses box sizing set to content-box in IE8/9 * 2. Removes excess padding in IE8/9 * 3. Removes excess padding in IE7 Known issue: excess padding remains in IE6 */ /* * 1. Addresses appearance set to searchfield in S5, Chrome * 2. Addresses box-sizing set to border-box in S5, Chrome (include -moz to future-proof) */ input[type="search"] { -webkit-appearance: textfield; /* 1 */ -moz-box-sizing: content-box; -webkit-box-sizing: content-box; /* 2 */ box-sizing: content-box; } /* * Removes inner padding and search cancel button in S5, Chrome on OS X */ input[type="search"]::-webkit-search-decoration, input[type="search"]::-webkit-search-cancel-button { -webkit-appearance: none; } /* * Removes inner padding and border in FF3+ * www.sitepen.com/blog/2008/05/14/the-devils-in-the-details-fixing-dojos-toolbar-buttons/ */ button::-moz-focus-inner, input::-moz-focus-inner { border: 0; padding: 0; } /* * 1. Removes default vertical scrollbar in IE6/7/8/9 * 2. Improves readability and alignment in all browsers */ textarea { overflow: auto; /* 1 */ vertical-align: top; /* 2 */ } /* ============================================================================= Tables ========================================================================== */ /* * Remove most spacing between table cells */ table { border-collapse: collapse; border-spacing: 0; } /* Nissan Style Guide Colours */ /* Grid >> 12 Columns ----------------------------------------------------------------------------------------------------*/ /* Icon Fonts */ /* Gradients */ .common-text-link, ul.links a:hover:after, ol.links a:hover:after, a.std-link:hover:after, a.header-link:hover:after, .text-link-down:after, .text-link-up:after, .no-touch #mainFooter div.header a:hover:after, #top-nav .topics a:hover:after, #top-nav .topics a:visited:hover:after, #top-nav .topics .active:hover:after, .accordionV2 header.acc-header a:after, .accordionV2 header.acc-header.open a:after, #main .lrg-promo a:hover span:after, #main .med-promo a:hover span:after, #main .small-promo a:hover span:after { font-family: "icons"; margin: 0 0 0 3px; } /* Nissan Style Guide Colours */ /* Grid >> 12 Columns ----------------------------------------------------------------------------------------------------*/ /* Icon Fonts */ /* Gradients */ .common-text-link, ul.links a:hover:after, ol.links a:hover:after, a.std-link:hover:after, a.header-link:hover:after, .text-link-down:after, .text-link-up:after, .no-touch #mainFooter div.header a:hover:after, #top-nav .topics a:hover:after, #top-nav .topics a:visited:hover:after, #top-nav .topics .active:hover:after, .accordionV2 header.acc-header a:after, .accordionV2 header.acc-header.open a:after, #main .lrg-promo a:hover span:after, #main .med-promo a:hover span:after, #main .small-promo a:hover span:after { font-family: "icons"; margin: 0 0 0 3px; } @font-face { font-family: 'icons'; src: url("http://www.nissan.co.za/assets/Shared/Local Market/dist/fonts/icons.eot"); src: url("http://www.nissan.co.za/assets/Shared/Local Market/dist/fonts/icons.eot?#iefix") format("embedded-opentype"), url("http://www.nissan.co.za/assets/Shared/Local Market/dist/fonts/icons.svg#icons") format("svg"), url("http://www.nissan.co.za/assets/Shared/Local Market/dist/fonts/icons.woff") format("woff"), url("http://www.nissan.co.za/assets/Shared/Local Market/dist/fonts/icons.ttf") format("truetype"); font-weight: normal; font-style: normal; } @font-face { font-family: 'iconsDL'; src: url("http://www.nissan.co.za/assets/Shared/content/dist/fonts/icons.eot"); src: url("http://www.nissan.co.za/assets/Shared/content/dist/fonts/icons.eot?#iefix") format("embedded-opentype"), url("http://www.nissan.co.za/assets/Shared/content/dist/fonts/icons.svg#icons") format("svg"), url("http://www.nissan.co.za/assets/Shared/content/dist/fonts/icons.woff") format("woff"), url("http://www.nissan.co.za/assets/Shared/content/dist/fonts/icons.ttf") format("truetype"); font-weight: normal; font-style: normal; } /* @font-face { font-family: "FontAwesome"; src: url($fontsPath + '/fontawesome-webfont.eot'); src: url($fontsPath + '/fontawesome-webfont.eot?#iefix') format('eot'), url($fontsPath + '/fontawesome-webfont.woff') format('woff'), url($fontsPath + '/fontawesome-webfont.ttf') format('truetype'), url($fontsPath + '/fontawesome-webfont.svg#FontAwesome') format('svg'); font-weight: normal; font-style: normal; }*/ /* Use the following CSS code if you want to use data attributes for inserting your icons */ /*[data-icon]:before { font-family: 'icons'; content: attr(data-icon); speak: none; font-weight: normal; -webkit-font-smoothing: antialiased; } [class^="icon-"]:before, [class*=" icon-"]:before { font-family: 'icons'; font-style: normal; speak: none; font-weight: normal; -webkit-font-smoothing: antialiased; } .icon-arrow-right:before { content: "\2192"; } */ .icon { font-family: 'icons'; font-style: normal; speak: none; font-weight: normal; -webkit-font-smoothing: antialiased; } .icon-search:before { content: "\f002"; } .icon-pin:before { content: "\f0f0"; } .icon-grid:before { content: "\f0f1"; } .icon-globe:before { content: "\f0ac"; } .icon-fb:before { content: "\f082"; } .icon-up:before { content: "\f077"; } .icon-left:before { content: "\f053"; } .icon-down:before { content: "\f078"; } .icon-right:before { content: "\f054"; } html { overflow-y: scroll; } html, body { height: 100%; /*overflow: auto; */ margin: 0; -webkit-overflow-scrolling: touch; } #buffer.home { height: 10px; z-index: -1; position: relative; top: -10px; } #buffer.home .grid_12 { height: 20px; } #buffer.home .container, #buffer.home #vlp-versions header h2, #vlp-versions header #buffer.home h2, #buffer.home #vlp-versions header .price-range, #vlp-versions header #buffer.home .price-range, #buffer.home .vlp-features header, .vlp-features #buffer.home header, #buffer.home .vlp-features .feature-item .collapsible, .vlp-features .feature-item #buffer.home .collapsible, #buffer.home .vlp-features-overlay .article-container header, .vlp-features-overlay .article-container #buffer.home header, #buffer.home .vlp-features-overlay article p, .vlp-features-overlay article #buffer.home p, #buffer.home .vlp-features-overlay .sidebar .item strong, .vlp-features-overlay .sidebar .item #buffer.home strong, #buffer.home .vlp-features-overlay .sidebar .item p, .vlp-features-overlay .sidebar .item #buffer.home p, #buffer.home #vlp-hero header, #vlp-hero #buffer.home header, #buffer.home #vlp-hero .colour-picker strong, #vlp-hero .colour-picker #buffer.home strong, #buffer.home #vlp-hero .stats, #vlp-hero #buffer.home .stats, #buffer.home .vlp-next-steps { margin: 0 20px; } #buffer.home .grid_12 { background: #F9F9F9; } .touch #buffer.home .container, .touch #buffer.home #vlp-versions header h2, #vlp-versions header .touch #buffer.home h2, .touch #buffer.home #vlp-versions header .price-range, #vlp-versions header .touch #buffer.home .price-range, .touch #buffer.home .vlp-features header, .vlp-features .touch #buffer.home header, .touch #buffer.home .vlp-features .feature-item .collapsible, .vlp-features .feature-item .touch #buffer.home .collapsible, .touch #buffer.home .vlp-features-overlay .article-container header, .vlp-features-overlay .article-container .touch #buffer.home header, .touch #buffer.home .vlp-features-overlay article p, .vlp-features-overlay article .touch #buffer.home p, .touch #buffer.home .vlp-features-overlay .sidebar .item strong, .vlp-features-overlay .sidebar .item .touch #buffer.home strong, .touch #buffer.home .vlp-features-overlay .sidebar .item p, .vlp-features-overlay .sidebar .item .touch #buffer.home p, .touch #buffer.home #vlp-hero header, #vlp-hero .touch #buffer.home header, .touch #buffer.home #vlp-hero .colour-picker strong, #vlp-hero .colour-picker .touch #buffer.home strong, .touch #buffer.home #vlp-hero .stats, #vlp-hero .touch #buffer.home .stats, .touch #buffer.home .vlp-next-steps, .touch #buffer.home .grid_12 { width: 100%; margin: 0; } .cutoff { display: none; } #ie-6 { background: #eeeeee; border-bottom: #343434 1px solid; padding: 20px; margin-bottom: 20px; display: none; } #main.noTopMargin, .js #main.noTopMargin { margin-top: 0; } #main, #buffer { margin: 0 auto; } a { color: #c71444; } h1, h2, h3 { text-transform: uppercase; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; line-height: 1em; } #main h1 { color: #343434; font-size: 40px; font-size: 4rem; padding-bottom: 10px; } #main h2, .h2 { font-size: 18px; font-size: 1.8rem; color: #4c4c4c; padding-bottom: 20px; } #main h2 span, .h2 span { display: block; font-size: 14px; font-size: 1.4rem; font-family: Verdana, Geneva, sans-serif; text-transform: none; } h3, .h3, #vlp-versions header .price-range { font-size: 13px; font-size: 1.3rem; color: #8a8a8a; padding-bottom: 10px; } .headerImage img { width: 100%; } html { height: 100%; } body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; font-size: 14px; font-size: 1.4rem; color: #666666; height: 100%; } .android body { text-rendering: auto; } html, body { height: 100%; } #MainForm, #root-wrapper { position: relative; min-height: 100%; } #main, #buffer { max-width: 960px; } .container, #vlp-versions header h2, #vlp-versions header .price-range, .vlp-features header, .vlp-features .feature-item .collapsible, .vlp-features-overlay .article-container header, .vlp-features-overlay article p, .vlp-features-overlay .sidebar .item strong, .vlp-features-overlay .sidebar .item p, #vlp-hero header, #vlp-hero .colour-picker strong, #vlp-hero .stats, .vlp-next-steps { width: 95.625%; margin-left: 2.1875%; margin-right: 2.1875%; overflow: hidden; } .container-grid12 { width: 94.345%; margin-left: 2.8275%; margin-right: 2.8275%; overflow: hidden; } a { text-decoration: none; } a:hover { color: #c71444; } .left { float: left; } .right { float: right; } hr { border: 0; border-bottom: 1px dotted #c1c1c1; margin: 20px 0; clear: both; } hr.thick { border: 2px solid #c1c1c1; } #main hr.divider-1, #main hr.divider-2, #main hr.divider-3, #main hr.divider-4 { margin-top: 10px; } #main hr.divider-1 { border-bottom: 4px solid #c71444; padding-bottom: 10px; margin-bottom: 20px; } #main hr.divider-2 { border-bottom: 2px solid #c71444; padding-bottom: 20px; margin-bottom: 20px; } #main hr.divider-3 { border-bottom: 1px dashed #c1c1c1; padding-bottom: 20px; margin-bottom: 20px; } #main hr.divider-4 { border-bottom: 1px solid #DDD; padding-bottom: 15px; margin-bottom: 15px; } /* Generic Margins */ .noMarginTop { margin-top: 0; } .marginBottom { margin-bottom: 20px; } .marginTop { margin-top: 20px; } .marginLeft { margin-left: 20px; } /* Generic Paddings */ .paddingBottom { padding-bottom: 20px; } /* Clear */ .clear { clear: both; } .hidden { overflow: hidden; } .clearfix, #main, #buffer, #top-nav, #top-nav .tools #tools, #top-nav .tools-drawer .quick-search, .vlp-features-overlay .overlay-content { /* for IE */ zoom: 1; } .clearfix:before, #main:before, #buffer:before, #top-nav:before, #top-nav .tools #tools:before, #top-nav .tools-drawer .quick-search:before, .vlp-features-overlay .overlay-content:before, .clearfix:after, #main:after, #buffer:after, #top-nav:after, #top-nav .tools #tools:after, #top-nav .tools-drawer .quick-search:after, .vlp-features-overlay .overlay-content:after { content: ""; display: table; } .clearfix:after, #main:after, #buffer:after, #top-nav:after, #top-nav .tools #tools:after, #top-nav .tools-drawer .quick-search:after, .vlp-features-overlay .overlay-content:after { clear: both; } /* Dividers */ .divider-right { border-right: 1px dotted #c1c1c1; } .divider-top { border-top: 1px dotted #c1c1c1; } .divider-bottom, .note ul, section .accordion article, .accessory { border-bottom: 1px dotted #c1c1c1; } .divider-left { border-left: 1px dotted #c1c1c1; } .divider-inset-right { background: url("../images/divider-inset.gif") repeat-y right; padding-right: 20px; margin-right: 20px; } .divider-inset-left { background: url("../images/divider-inset.gif") repeat-y left; padding-left: 20px; margin-left: 20px; } #main .divider-1 { border-bottom: 4px solid #c71444; padding-bottom: 10px; margin-bottom: 20px; } #main .divider-2 { border-bottom: 2px solid #c71444; padding-bottom: 20px; margin-bottom: 20px; } #main .divider-2-thin { border-bottom: 1px solid #c71444; padding-bottom: 20px; margin-bottom: 20px; } #main .divider-3 { border-bottom: 1px dashed #c1c1c1; padding-bottom: 20px; margin-bottom: 20px; } .bottomPadding { padding-bottom: 20px; } .topPadding { padding-top: 20px; } /* paragraphs styles*/ .note { font-size: 13px; font-size: 1.3rem; } .note ul { margin-bottom: 30px; } .note ul, .note ul li { list-style-type: disc; list-style-position: inside; } .tableNote ul { margin-bottom: 30px; } .tableNote ul li { font-size: 14px; font-size: 1.4rem; list-style-type: disc; list-style-position: inside; color: #343434; } /* buttons */ .button { font-family: "NissanAGMediumRegular", Verdana, Geneva, sans-serif; height: 30px; text-transform: uppercase; display: inline-block; margin-top: 20px; margin-bottom: 20px; font-size: 12px; font-size: 1.2rem; padding: 0; } .button a { padding: 0 20px; line-height: 30px; display: block; height: 30px; color: white; } .button .print { padding-right: 47px; } .button.noMarginTop { margin-top: 0; } .button.primary, .button.twoLines { background: #c71444; } .button.primary .print, .button.twoLines .print { background: url("../images/print.png") no-repeat right -23px; } .button.primary:hover, .button.twoLines:hover { background: #A9113A; } .button.secondary { background: #666666; } .button.secondary .print { background: url("../images/print.png") no-repeat right -23px; } .button.secondary:hover { background: #575757; } .button.tertiary { background: #eeeeee; background: #E1E1E1; background-image: -webkit-gradient(linear, left top, left bottom, from(#eeeeee), to(#e1e1e1)); background-image: -webkit-linear-gradient(#eeeeee 0%, #e1e1e1 100%); background-image: -moz-linear-gradient(#eeeeee 0%, #e1e1e1 100%); background-image: -o-linear-gradient(top, #eeeeee 0%, #e1e1e1 100%); /* Opera 11.10+ */ background-image: -ms-linear-gradient(top, #eeeeee 0%, #e1e1e1 100%); /* IE10+ */ background-image: linear-gradient(top, #eeeeee 0%, #e1e1e1 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#eeeeee', endColorStr='#e1e1e1',GradientType=0); } .button.tertiary a { color: #4c4c4c; } .button.tertiary .print { background: url("../images/print.png") no-repeat right 5px; } .button.inactive { background: #c1c1c1; } .button.inactive a { cursor: default; } .button.inactive:hover { background: #c1c1c1; } ul.links, ol.links { padding: 0; } ul.links a, ol.links a { color: #c71444; font-size: 11px; font-size: 1.1rem; color: #666666; } ul.links a:hover, ol.links a:hover { color: #c71444; } ul.links a:hover span, ol.links a:hover span { text-decoration: underline; } ul.links a:hover:after, ol.links a:hover:after { content: "\2192"; font-size: 8px; font-size: 0.8rem; line-height: 10px; line-height: 1rem; color: #c71444; font-weight: normal; } ul.links a:hover span, ol.links a:hover span { text-decoration: underline; } ul.links a:hover:after, ol.links a:hover:after { text-decoration: none; } a.std-link { color: #c71444; font-size: 11px; font-size: 1.1rem; } a.std-link:hover { color: #c71444; } a.std-link:hover span { text-decoration: underline; } a.std-link:hover:after { content: "\2192"; font-size: 8px; font-size: 0.8rem; line-height: 10px; line-height: 1rem; color: #c71444; font-weight: normal; } a.header-link { font-size: 18px; font-size: 1.8rem; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; color: #8a8a8a; text-transform: uppercase; } a.header-link:hover { color: #c71444; -moz-transition: none !important; -webkit-transition: none !important; -o-transition: color 0 ease-in !important; transition: none !important; } a.header-link:hover:after { content: "\2192"; font-size: 15px; font-size: 1.5rem; line-height: 10px; line-height: 1rem; color: #c71444; font-weight: normal; } .text-link-down:after { content: "\2193"; } .text-link-up:after { content: "\2191"; } .pagination { display: none; } .pagination.topPadding { padding-top: 10px; } .pagination .button { border: 1px solid #999999; font-size: 14px; font-size: 1.4rem; margin-top: 10px; margin-right: 5px; height: 20px; } .pagination .button a { line-height: 20px; padding: 20px 10px; display: inline; } .pagination span { padding: 0 5px; margin-right: 5px; } .pagination div.button + div.button { margin-left: 0; margin-right: 5px; } div.button + div.button { margin: 10px 0 0 10px; } h1 + .button { margin-top: 0; margin-bottom: 20px; } article + .back { background: none; } /* * speech-bubble css * uses any element * just add the speechBubble class to it * and it should all work nicely */ .speechBubble::after { border-color: #810A1A transparent; border-style: solid; border-width: 10px 10px 0; bottom: -10px; content: " "; display: block; left: 50px; position: absolute; width: 0; } .speechBubble { font-family: Verdana, Geneva, sans-serif; color: white; font-size: 20px; font-size: 2rem; background: #c71444; background-image: -webkit-gradient(linear, left top, left bottom, from(#c21329), to(#810a1a)); background-image: -webkit-linear-gradient(#c21329 0%, #810a1a 100%); background-image: -moz-linear-gradient(#c21329 0%, #810a1a 100%); background-image: -o-linear-gradient(top, #c21329 0%, #810a1a 100%); /* Opera 11.10+ */ background-image: -ms-linear-gradient(top, #c21329 0%, #810a1a 100%); /* IE10+ */ background-image: linear-gradient(top, #c21329 0%, #810a1a 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#c21329', endColorStr='#810a1a',GradientType=0); margin: 10px 0 10px; padding: 5px 5px 0 5px; position: relative; border: 1px solid #be3e4e; width: 33%; text-align: center; -webkit-box-shadow: 3px 3px 2px 3px rgba(127, 127, 127, 0.5); box-shadow: 3px 3px 2px 3px rgba(127, 127, 127, 0.5); } /* * Carousel * */ .carousel { width: 100%; height: 100%; } #swipeview-slider > div { position: relative; display: -webkit-box; -webkit-box-orient: vertical; -webkit-box-pack: center; -webkit-box-align: center; overflow: hidden; } #swipeview-slider span { -webkit-box-sizing: border-box; box-sizing: border-box; display: block; text-align: center; } .loader { display: none; height: 100px; background: url("../images/loader.gif") no-repeat center; position: relative; } span.date, span.category { color: #4c4c4c; text-transform: uppercase; } #main .vjs-default-skin .vjs-big-play-button { display: block; /* Start hidden */ z-index: 2; position: absolute; top: 50%; left: 50%; width: 6em; height: 6em; margin: -3em 0 0 -3em; text-align: center; vertical-align: center; cursor: pointer !important; border: none; -webkit-border-radius: 28px; -moz-border-radius: 28px; border-radius: 28px; background-color: #555555; background: -moz-linear-gradient(#555555 0%, black 100%); background: -webkit-gradient(#555555 0%, black 100%); background: -webkit-linear-gradient(#555555 0%, black 100%); background: -o-linear-gradient(#555555 0%, black 100%); background: -ms-linear-gradient(#555555 0%, black 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#555555', endColorstr='#000000',GradientType=0 ); background: linear-gradient(#555555 0%, black 100%); /* CSS Shadows */ -webkit-box-shadow: 0 5px 19px #000; -moz-box-shadow: 0 5px 19px #000; box-shadow: 0 5px 19px #000; } #main .vjs-default-skin .vjs-big-play-button span { margin: -19px 0 0 -13px; } body.vjs-full-window #rootWrapper > header, body.vjs-full-window #buffer { display: none !important; } body.vjs-full-window #mainFooter { display: none; } body.vjs-full-window #showroomModel section, body.vjs-full-window #showroomModel footer, body.vjs-full-window #showroomModel #buffer, body.vjs-full-window #showroomModel #modelSubNav { display: none !important; } body.vjs-full-window #showroomModel section#gallery { display: block !important; } body.vjs-full-window #showroomModel section#gallery .diagonalCutTop, body.vjs-full-window #showroomModel section#gallery .diagonalCutBottom, body.vjs-full-window #showroomModel section#gallery .carouselIndicators, body.vjs-full-window #showroomModel section#gallery .carouselButtons { display: none; } body.vjs-full-window .video-js { display: block !important; max-width: none!important; max-height: none!important; } /* body.vjs-full-screen{ header{ display: none !important; } #swipeview-slider, .carousel, .carouselItem, #gallery, .carouselVideo, #rootWrapper{ position: static !important; } .video-js{ top: 0 !important; left: 0 !important; position: absolute !important; margin-left: -300px !important; video{ position: absolute !important; top: 0 !important; left: 0 !important; } } } */ .disable-animation { -moz-transition: none !important; -webkit-transition: none !important; -o-transition: color 0 ease-in !important; transition: none !important; } .editMode { clear: both; border: 2px solid #be3e4e; background-color: #EEEEEE; margin: 20px; margin-top: 40px; } .editMode label { display: block; text-transform: uppercase; font-weight: bold; } .editMode div { padding: 15px; margin: 2px; width: 50%; } .noScript { text-align: center; margin: 90px 0 10px; position: fixed; width: 100%; z-index: 49; } html { font: 50%/2 Verdana, Geneva, sans-serif; } html:lang(th) { font: 60%/2.1 Verdana, Geneva, sans-serif; } /* Variable Grid System (Fluid Version). Learn more ~ http://www.spry-soft.com/grids/ Based on 960 Grid System - http://960.gs/ & 960 Fluid - http://www.designinfluences.com/ Licensed under GPL and MIT. */ /* Mobile Customisations */ .grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 { width: auto; } .common-footer-divider, #mainFooter div.header, #mainFooter .related { border-top: 1px solid #D4D4D4; } .no-touch #mainFooter div.header a:hover:after, .no-touch #mainFooter div.header a:hover { color: #c71444; } .no-touch #mainFooter div.header.acc-header a:hover:after { line-height: 35px; line-height: 3.5rem; content: "\2193"; } .no-touch #mainFooter div.header.acc-header.open a:hover:after { content: "\2191"; } .no-touch #mainFooter div.header.acc-header a:hover:after { color: #c71444; } .no-touch #mainFooter div.header a:hover:after { content: "\2192"; font-size: 15px; font-size: 1.5rem; line-height: 10px; line-height: 1rem; color: #c71444; font-weight: normal; } .no-touch #mainFooter .related .language-options.open .hide-language { color: #c71444; } .no-touch #mainFooter .related a:hover { color: #c71444; } .no-touch #mainFooter .related .related-links:hover { color: #c71444; } #mainFooter { position: relative; margin-top: 40px; color: #666666; position: relative; } #mainFooter.pushFooter { position: absolute; bottom: 0; width: 100%; } #mainFooter.pushFooter .footerBlocks > .wrapper { margin-top: 0; } #mainFooter .container, #mainFooter #vlp-versions header h2, #vlp-versions header #mainFooter h2, #mainFooter #vlp-versions header .price-range, #vlp-versions header #mainFooter .price-range, #mainFooter .vlp-features header, .vlp-features #mainFooter header, #mainFooter .vlp-features .feature-item .collapsible, .vlp-features .feature-item #mainFooter .collapsible, #mainFooter .vlp-features-overlay .article-container header, .vlp-features-overlay .article-container #mainFooter header, #mainFooter .vlp-features-overlay article p, .vlp-features-overlay article #mainFooter p, #mainFooter .vlp-features-overlay .sidebar .item strong, .vlp-features-overlay .sidebar .item #mainFooter strong, #mainFooter .vlp-features-overlay .sidebar .item p, .vlp-features-overlay .sidebar .item #mainFooter p, #mainFooter #vlp-hero header, #vlp-hero #mainFooter header, #mainFooter #vlp-hero .colour-picker strong, #vlp-hero .colour-picker #mainFooter strong, #mainFooter #vlp-hero .stats, #vlp-hero #mainFooter .stats, #mainFooter .vlp-next-steps { margin: 0; width: auto; } #mainFooter div.header { padding: 10px 20px; } #mainFooter div.header a { color: #8a8a8a; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; font-size: 18px; font-size: 1.8rem; text-transform: uppercase; padding-right: 0; } #mainFooter div.header.acc-header a:after { color: #8a8a8a; } #mainFooter div.header.acc-header.open a { color: #c71444; } #mainFooter div.header.acc-header.open a:after { color: #c71444; } #mainFooter article { width: 100%; } #mainFooter ul.links { padding-bottom: 10px; } #mainFooter ul.links a { line-height: 25px; line-height: 2.5rem; } #mainFooter a .container, #mainFooter a #vlp-versions header h2, #vlp-versions header #mainFooter a h2, #mainFooter a #vlp-versions header .price-range, #vlp-versions header #mainFooter a .price-range, #mainFooter a .vlp-features header, .vlp-features #mainFooter a header, #mainFooter a .vlp-features .feature-item .collapsible, .vlp-features .feature-item #mainFooter a .collapsible, #mainFooter a .vlp-features-overlay .article-container header, .vlp-features-overlay .article-container #mainFooter a header, #mainFooter a .vlp-features-overlay article p, .vlp-features-overlay article #mainFooter a p, #mainFooter a .vlp-features-overlay .sidebar .item strong, .vlp-features-overlay .sidebar .item #mainFooter a strong, #mainFooter a .vlp-features-overlay .sidebar .item p, .vlp-features-overlay .sidebar .item #mainFooter a p, #mainFooter a #vlp-hero header, #vlp-hero #mainFooter a header, #mainFooter a #vlp-hero .colour-picker strong, #vlp-hero .colour-picker #mainFooter a strong, #mainFooter a #vlp-hero .stats, #vlp-hero #mainFooter a .stats, #mainFooter a .vlp-next-steps { position: relative; } #mainFooter .gen-text-links a { font-size: 1.55556rem; font-size: 14px; } #mainFooter .footerBlocks > .wrapper { max-width: 960px; margin: 0 auto; } #mainFooter .footerBlocks a { display: block; } #mainFooter .menu { display: none; } #mainFooter .related { width: 100%; font-family: "NissanAGMediumRegular", Verdana, Geneva, sans-serif; font-size: 12px; font-size: 1.2rem; text-transform: uppercase; } #mainFooter .related a { color: #343434; } #mainFooter .related > .wrapper { max-width: 960px; margin: 0 auto; } #mainFooter .related .left, #mainFooter .related .right { float: none; width: auto; display: block; } #mainFooter .related .related-links span { display: none; } #mainFooter .related .related-links span.icon { display: inline; } #mainFooter .related .related-links li { border-bottom: 1px dashed #D4D4D4; } #mainFooter .related .related-links a { display: block; margin: 0 20px; padding: 10px 0; } #mainFooter .related .related-links a.facebook { margin: 0; padding: 10px 20px; } #mainFooter .related .related-links a.facebook { padding-left: 44px; position: relative; } #mainFooter .related .related-links a.facebook:before { content: "\f082"; font-family: "icons"; position: absolute; top: 2px; left: 20px; font-size: 23px; font-size: 2.3rem; } #mainFooter .footerBlocks ul { clear: both; overflow: hidden; width: 100%; } #mainFooter .footerBlocks ul > li:first-child { padding-left: 0; } #mainFooter .show-language, #mainFooter .select-language { display: none; } #mainFooter .hide-language { display: block; } #mainFooter .selected-language, #mainFooter .hide-language div { padding-left: 25px; position: relative; } #mainFooter .selected-language:before, #mainFooter .hide-language div:before { content: "\f0ac"; font-family: "icons"; position: absolute; left: 0; font-size: 25px; font-size: 2.5rem; } #mainFooter .selected-language:before { top: -12px; } #mainFooter .hide-language div:before { top: -10px; } #mainFooter .language-options { padding: 10px 20px; } #mainFooter .language-options ul { overflow: hidden; -webkit-transition: height 0.35s ease; -moz-transition: height 0.35s ease; -ms-transition: height 0.35s ease; transition: height 0.35s ease; } #mainFooter .language-options li { padding: 10px 0 0 25px; } #mainFooter .language-options li a { display: block; } #mainFooter .language-options.open ul { height: auto; } #mainFooter .language-options.open > a { color: #c71444; } #mainFooter .language-options.open .current-language { display: none; } #mainFooter .language-options.open .select-language { display: inline; } #mainFooter .language-options.open .text-link-down:after { content: "\2191"; } #mainFooter .language-options .text-link-down:after { float: right; } #mainFooter .language-options span.selected { display: inline-block; color: black; } #mainFooter .language-options span.selected:after { font-family: 'icons'; font-style: normal; speak: none; font-weight: normal; -webkit-font-smoothing: antialiased; content: "\2713"; padding-left: 5px; } .btn-sub-nav { border: 0; background: white; padding: 5px 2px; position: relative; top: -2px; } .btn-sub-nav .icon-bar { background: #414141; display: block; height: 3px; margin-bottom: 2px; width: 21px; -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; -webkit-transition: background 0.1s ease-in-out; -moz-transition: background 0.1s ease-in-out; -ms-transition: background 0.1s ease-in-out; transition: background 0.1s ease-in-out; } .no-touch #top-nav .tools-menu .btn-sub-nav:hover .icon-bar { background: #c71444; } #top-nav { position: static; z-index: 3; } #top-nav img { width: 100%; } #top-nav input { background: white; height: 20px; width: auto; -webkit-border-radius: 1px; -moz-border-radius: 1px; border-radius: 1px; } #top-nav input[type=text]:focus, #top-nav textarea:focus { outline-width: 0; } #top-nav .banner .topContainer { display: none; } #top-nav .tools { border-bottom: 1px solid #e4e4e4; margin-bottom: 10px; } #top-nav .tools .container, #top-nav .tools #vlp-versions header h2, #vlp-versions header #top-nav .tools h2, #top-nav .tools #vlp-versions header .price-range, #vlp-versions header #top-nav .tools .price-range, #top-nav .tools .vlp-features header, .vlp-features #top-nav .tools header, #top-nav .tools .vlp-features .feature-item .collapsible, .vlp-features .feature-item #top-nav .tools .collapsible, #top-nav .tools .vlp-features-overlay .article-container header, .vlp-features-overlay .article-container #top-nav .tools header, #top-nav .tools .vlp-features-overlay article p, .vlp-features-overlay article #top-nav .tools p, #top-nav .tools .vlp-features-overlay .sidebar .item strong, .vlp-features-overlay .sidebar .item #top-nav .tools strong, #top-nav .tools .vlp-features-overlay .sidebar .item p, .vlp-features-overlay .sidebar .item #top-nav .tools p, #top-nav .tools #vlp-hero header, #vlp-hero #top-nav .tools header, #top-nav .tools #vlp-hero .colour-picker strong, #vlp-hero .colour-picker #top-nav .tools strong, #top-nav .tools #vlp-hero .stats, #vlp-hero #top-nav .tools .stats, #top-nav .tools .vlp-next-steps { overflow: visible; margin: 0; width: auto; } #top-nav .tools-menu { display: inline-block; float: right; overflow: hidden; text-transform: uppercase; } #top-nav .tools-menu a, #top-nav .tools-menu a:visited { color: #4c4c4c; font-family: "NissanAGMediumRegular", Verdana, Geneva, sans-serif; font-size: 1.33333rem; font-size: 12px; line-height: 23px; line-height: 2.55556rem; } #top-nav .tools-menu li { border-left: 1px solid #e4e4e4; float: left; padding: 15px 10px; height: 21px; font-family: "NissanAGBoldRegular",Verdana,Geneva,sans-serif; font-weight: bold; color: #c71444; font-size: 18px; text-transform: uppercase; } #top-nav .tools-menu li.open a { color: #c71444; } #top-nav .tools-menu .find-a-dealer, #top-nav .tools-menu .request-a-brochure, #top-nav .tools-menu .quick-search { display: none; } #top-nav .tools-menu .search .small-title { background: transparent; cursor: pointer; display: block; height: 23px; position: relative; width: 25px; line-height: 40px; } #top-nav .tools-menu .search .small-title:before { color: #4b4b4b; content: "\f002"; font-family: "iconsDL"; font-size: 24px; position: absolute; top: -9px; } #top-nav .tools-menu .search .small-title span { display: none; } #top-nav .tools-menu .search.open .small-title:before { color: #c71444; } #top-nav .tools-menu .sub-nav-toggle.open .icon-bar { background: #c71444; } #top-nav .quick-search { background: white; } #top-nav .quick-search input, #top-nav .quick-search button { border: 0; } #top-nav .btn-search { font-family: "iconsDL"; background: transparent; color: #c1c1c1; height: 21px; margin: 0; padding: 0; position: relative; width: 21px; font-size: 26px; font-size: 2.6rem; line-height: 18px; line-height: 1.8rem; } #top-nav .focus .btn-search { color: white; background-image: -webkit-gradient(linear, left top, left bottom, from(#b41126), to(#880b1c)); background-image: -webkit-linear-gradient(#b41126 0%, #880b1c 100%); background-image: -moz-linear-gradient(#b41126 0%, #880b1c 100%); background-image: -o-linear-gradient(top, #b41126 0%, #880b1c 100%); /* Opera 11.10+ */ background-image: -ms-linear-gradient(top, #b41126 0%, #880b1c 100%); /* IE10+ */ background-image: linear-gradient(top, #b41126 0%, #880b1c 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#b41126', endColorStr='#880b1c',GradientType=0); } #top-nav .tools-drawer header { display: none; } #top-nav .tools-drawer .menu { background: #4c4c4c; overflow: hidden; text-align: center; -webkit-box-shadow: inset 0 0 20px -3px rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 0 0 20px -3px rgba(0, 0, 0, 0.5); box-shadow: inset 0 0 20px -3px rgba(0, 0, 0, 0.5); -webkit-transition: height 0.6s cubic-bezier(0, 0, 0.25, 1); -moz-transition: height 0.6s cubic-bezier(0, 0, 0.25, 1); -ms-transition: height 0.6s cubic-bezier(0, 0, 0.25, 1); transition: height 0.6s cubic-bezier(0, 0, 0.25, 1); height: 0; } #top-nav .tools-drawer .menu.disable-anim { -moz-transition: none !important; -webkit-transition: none !important; -o-transition: color 0 ease-in !important; transition: none !important; } #top-nav .tools-drawer .quick-search { height: 30px; margin: 20px auto; width: 90%; line-height: 28px; line-height: 3.11111rem; } #top-nav .tools-drawer .quick-search input { height: 25px; width: 85%; } #top-nav .tools-drawer .btn-search { float: right; margin: 0; height: 30px; width: 30px; } #top-nav .tools-drawer .btn-search:before { font-size: 26px; line-height: 38px; } #top-nav header.small-title { display: none; } #top-nav #mobile-logo { float: left; margin-left: 20px; margin-bottom: -10px; } #top-nav #mobile-logo a { background: url("../images/nav/mobile-logo.png") no-repeat top left; display: block; height: 61px; width: 170px; text-indent: -9999999px; } #top-nav #sub-nav { overflow: hidden; margin-top: 10px; height: 0; } #top-nav #sub-nav.open { overflow: visible; -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1); box-shadow: 0 3px 5px rgba(0, 0, 0, 0.1); height: auto; } #top-nav #sub-nav-list { display: block; overflow: visible; -webkit-transition: height 0.6s cubic-bezier(0, 0, 0.25, 1); -moz-transition: height 0.6s cubic-bezier(0, 0, 0.25, 1); -ms-transition: height 0.6s cubic-bezier(0, 0, 0.25, 1); transition: height 0.6s cubic-bezier(0, 0, 0.25, 1); } #top-nav #sub-nav-list .container, #top-nav #sub-nav-list #vlp-versions header h2, #vlp-versions header #top-nav #sub-nav-list h2, #top-nav #sub-nav-list #vlp-versions header .price-range, #vlp-versions header #top-nav #sub-nav-list .price-range, #top-nav #sub-nav-list .vlp-features header, .vlp-features #top-nav #sub-nav-list header, #top-nav #sub-nav-list .vlp-features .feature-item .collapsible, .vlp-features .feature-item #top-nav #sub-nav-list .collapsible, #top-nav #sub-nav-list .vlp-features-overlay .article-container header, .vlp-features-overlay .article-container #top-nav #sub-nav-list header, #top-nav #sub-nav-list .vlp-features-overlay article p, .vlp-features-overlay article #top-nav #sub-nav-list p, #top-nav #sub-nav-list .vlp-features-overlay .sidebar .item strong, .vlp-features-overlay .sidebar .item #top-nav #sub-nav-list strong, #top-nav #sub-nav-list .vlp-features-overlay .sidebar .item p, .vlp-features-overlay .sidebar .item #top-nav #sub-nav-list p, #top-nav #sub-nav-list #vlp-hero header, #vlp-hero #top-nav #sub-nav-list header, #top-nav #sub-nav-list #vlp-hero .colour-picker strong, #vlp-hero .colour-picker #top-nav #sub-nav-list strong, #top-nav #sub-nav-list #vlp-hero .stats, #vlp-hero #top-nav #sub-nav-list .stats, #top-nav #sub-nav-list .vlp-next-steps { margin: 0; width: 100%; } #top-nav #sub-nav-list li:first-child { padding-top: 5px; } #top-nav #sub-nav-list li:first-child .acc-header { border-top: 0; } #top-nav #sub-nav-list .sub-nav-footer li:first-child { padding-top: 0; } #top-nav #sub-nav-list .acc-header { color: black; padding-right: 0; padding: 0; } #top-nav #sub-nav-list .acc-header.open { color: #c71444; } #top-nav #sub-nav-list .menu { overflow: hidden; } #top-nav #sub-nav-list .menu.open { padding-bottom: 15px; border-top: 1px solid #D4D4D4; } #top-nav #sub-nav-list #vehicles-menu .menu.open { padding-bottom: 0; } #top-nav #sub-nav-list h1 { cursor: pointer; font-size: 1.55556rem; font-size: 14px; line-height: 18px; line-height: 2rem; -webkit-transition: color 0.2s ease-in-out; -moz-transition: color 0.2s ease-in-out; -ms-transition: color 0.2s ease-in-out; transition: color 0.2s ease-in-out; padding: 12px 20px; } #top-nav #sub-nav-list h1:after { color: #c1c1c1; content: "\2193"; font-family: "icons"; float: right; } #top-nav #sub-nav-list .open h1:after { color: #c71444; content: "\2191"; } #top-nav #sub-nav-list .menu { color: #8a8a8a; padding: 0 20px; font-size: 1.55556rem; font-size: 14px; line-height: 16.8px; line-height: 1.86667rem; background-image: -webkit-gradient(linear, left top, left bottom, from(#f0f0f0), to(white)); background-image: -webkit-linear-gradient(#f0f0f0 0%, white 100%); background-image: -moz-linear-gradient(#f0f0f0 0%, white 100%); background-image: -o-linear-gradient(top, #f0f0f0 0%, white 100%); /* Opera 11.10+ */ background-image: -ms-linear-gradient(top, #f0f0f0 0%, white 100%); /* IE10+ */ background-image: linear-gradient(top, #f0f0f0 0%, white 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f0f0f0', endColorStr='white',GradientType=0); } #top-nav #sub-nav-list .menu header { margin: 0 0 15px; } #top-nav #sub-nav-list .menu header h2 { color: #4c4c4c; text-transform: uppercase; font-size: 2.44444rem; font-size: 22px; line-height: 26px; line-height: 2.88889rem; } #top-nav #sub-nav-list .menu .offers { color: #343434; display: block; border: 1px dashed #c5c5c5; border-width: 1px 0; margin: 0 14px 25px 0; padding: 9px 0; position: relative; text-transform: uppercase; font-family: "NissanAGMediumRegular", Verdana, Geneva, sans-serif; } #top-nav #sub-nav-list .menu .offers:hover { color: #c71444; } #top-nav #sub-nav-list .menu .offers:hover:after { font-family: "icons"; margin-left: 5px; font-size: 10px; font-size: 1rem; content: "\2192"; line-height: 10px; line-height: 1rem; } #top-nav #range-menu-list { display: none; } #top-nav #range-cars { margin: 20px -20px 10px; overflow-x: scroll; overflow-y: hidden; position: relative; white-space: nowrap; -webkit-overflow-scrolling: touch; } #top-nav #range-cars li { display: inline-block; padding: 15px 0; vertical-align: top; width: 210px; white-space: normal; } #top-nav #range-cars li > a { display: block; } #top-nav #range-cars li .car-title, #top-nav #range-cars li .car-price { color: #8a8a8a; } #top-nav #range-cars li.active .car-title { color: #4c4c4c; } #top-nav #range-cars .car-wrapper { margin-left: 10px; /*img { @include image-crisp-edge(); }*/ } #top-nav #range-cars .car-title, #top-nav #range-cars .car-price { display: block; margin: 0 5%; text-transform: uppercase; } #top-nav #range-cars .car-title { color: #c1c1c1; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; letter-spacing: -0.06em; font-size: 2.66667rem; font-size: 24px; line-height: 24px; line-height: 2.66667rem; } #top-nav #range-cars .car-price { font-family: "NissanAGMediumRegular", Verdana, Geneva, sans-serif; letter-spacing: -0.06em; font-size: 1.88889rem; font-size: 17px; line-height: 17px; line-height: 1.88889rem; } #top-nav #range-cars .car-price em { color: #c71444; font-style: normal; } #top-nav .topics { margin-left: 13px; } #top-nav .topics > div:first-child { padding-top: 30px; } #top-nav .topics li { margin: 0 0 25px; } #top-nav .topics li:last-child { margin-bottom: 10px; } #top-nav .topics a, #top-nav .topics a:visited, #top-nav .topics .active { margin-right: 15px; padding-bottom: 15px; position: relative; color: #c71444; font-size: 12px; font-size: 1.2rem; font-size: 1.44444rem; font-size: 13px; color: #666666; } #top-nav .topics a:hover, #top-nav .topics a:visited:hover, #top-nav .topics .active:hover { color: #c71444; } #top-nav .topics a:hover span, #top-nav .topics a:visited:hover span, #top-nav .topics .active:hover span { text-decoration: underline; } #top-nav .topics a:hover:after, #top-nav .topics a:visited:hover:after, #top-nav .topics .active:hover:after { content: "\2192"; font-size: 9px; font-size: 0.9rem; line-height: 10px; line-height: 1rem; color: #c71444; font-weight: normal; } #top-nav .topics a:hover, #top-nav .topics .active, #top-nav .topics .active:visited { color: #c71444; } #top-nav .topics a:hover, #top-nav .topics .active:hover { margin-right: 0; } #top-nav .topics .link-list { border-bottom: 1px dotted #e4e4e4; padding-bottom: 5px; margin-bottom: 10px; } #top-nav .topics .link-list.no-sep { border-bottom: none; } #top-nav .promo-box { display: none; } #top-nav .sub-nav-footer { background: white; border-top: 4px solid #c71444; bottom: 0; left: 0; display: none; position: fixed; width: 100%; z-index: 999; -webkit-box-shadow: 0 -4px 2px 0 rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 -4px 2px 0 rgba(0, 0, 0, 0.1); box-shadow: 0 -4px 2px 0 rgba(0, 0, 0, 0.1); } #top-nav .sub-nav-footer.open { display: block; } #top-nav .sub-nav-footer li { border-bottom: 1px solid #e4e4e4; padding: 0 20px; } #top-nav .sub-nav-footer a, #top-nav .sub-nav-footer a:visited { color: #4c4c4c; display: inline-block; font-family: "NissanAGMediumRegular", Verdana, Geneva, sans-serif; letter-spacing: -0.5px; position: relative; text-transform: uppercase; font-size: 1.55556rem; font-size: 14px; line-height: 40px; line-height: 4.44444rem; } .box { background: #f0f0f0; height: 300px; margin-bottom: 40px; margin-top: 40px; } body.hide-content { background: #f5f5f5; } body.hide-content #main, body.hide-content #mainFooter { display: none; } body.hide-content #root-wrapper { padding-bottom: 100px; } body.hide-content #top-nav { background: white; } @media screen and (-webkit-min-device-pixel-ratio: 2), screen and (max-moz-device-pixel-ratio: 2) { #top-nav #mobile-logo a { background: url("../images/nav/mobile-logo-retina.png") no-repeat top left; background-size: 149px 60px; } } @media screen and (max-width: 640px) { .no-overflowscrolling.appleios #top-nav #range-cars, .no-overflowscrolling.android #top-nav #range-cars { overflow: visible; white-space: normal; -webkit-overflow-scrolling: auto; } .no-overflowscrolling.appleios #top-nav #range-cars li, .no-overflowscrolling.android #top-nav #range-cars li { display: block; margin: 0 auto; } } .no-positionfixed #top-nav .sub-nav-footer { position: static; -webkit-box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.5); -moz-box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.5); box-shadow: 0 5px 5px -3px rgba(0, 0, 0, 0.5); } /*sideNav.css for ipad and mobile */ #sidenavLayout { margin-top: 10px; } #sidenav { display: none; font-size: 13px; font-size: 1.3rem; color: #8a8a8a; padding-bottom: 10px; } .grid_9 #sidenav { padding: 10px 0; display: block; } .grid_9 #sidenav li { border-bottom: 1px dotted #c1c1c1; } .grid_9 #sidenav li a { color: #4c4c4c; padding: 7px 0; display: block; line-height: 1.3em; } .grid_9 #sidenav li.selected a { color: #c71444; } /* Stylised Checkboxes */ .tickbox { height: 24px; width: 24px; display: inline-block; vertical-align: middle; margin-right: 10px; background: url("../images/form-sprite-m.png") no-repeat 0 0; } .tickbox.checked { background-position: 0 -25px; } /* Input text boxes */ input { padding: 0 2px; height: 30px; text-indent: 5px; zoom: 1; width: 233px; border: 1px solid #c1c1c1; font-size: 13px; position: relative; background: none; -webkit-appearance: none; border-radius: 0; } .optionalPlaceholder { position: absolute; display: block; width: 228px; height: 30px; padding-right: 5px; line-height: 30px; z-index: 0; text-align: right; font-style: italic; color: #8a8a8a; display: block; font-size: 13px; } .hideOptional .optionalPlaceholder { display: none !important; } input[type='checkbox'] { width: auto; } .errorMsg { color: #c71444; display: none; margin: 0; padding: 0; } label { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } /* Drop Downs */ div.dropDown { position: relative; } div.dropDown .overlay { background: url("../images/dropdown.gif") no-repeat right 13px white; height: 30px; line-height: 30px; text-indent: 5px; border: 1px solid #c1c1c1; padding-right: 27px; padding-left: 2px; overflow: hidden; } div.dropDown select { opacity: 0; filter: alpha(opacity=0); width: 100%; height: 30px; position: absolute; top: 0; left: 0; } div.dropDown select.focus { border: 1px solid red; } div.dropDown.errorOutline .overlay { border: 1px solid #c71444; } .carModels .altHeading { display: none; } .carModels header.hidden { display: none; } .carModels img { width: 100%; } .carModels.carPreselected .mainHeading { display: none; } .carModels.carPreselected .altHeading { display: block; } .carSelectorWrapper { clear: both; overflow-x: scroll; overflow-y: hidden; -webkit-overflow-scrolling: touch; } .carSelectorWrapper h3 { line-height: 15px; } .carSelectorWrapper.carPreselected .carSelect { display: none; } .carSelectorWrapper.carPreselected .carSelect.selected { display: inline-block; cursor: default; /* .wrapper:after{ #selectBrochureForm &{ background-image: none; } } */ } .carSelectorWrapper.carPreselected .carSelect.selected.ready:hover .wrapper:after { background-position: 0 0; } ul.carSelector { white-space: nowrap; -moz-opacity: 0; -webkit-opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=0); opacity: 0; position: relative; } ul.carSelector .carSelect { cursor: pointer; position: relative; } ul.carSelector .carSelect .selectedState, .no-touch ul.carSelector .carSelect:hover .wrapper:after, .no-touch ul.carSelector .carSelect:hover .wrapper i, ul.carSelector .carSelect.selected .wrapper:after, ul.carSelector .carSelect.selected .wrapper i { content: ""; display: block; width: 32px; height: 32px; position: absolute; top: 12px; left: 10px; background: url("../images/selected-states.png") no-repeat top left; z-index: 1; } .no-touch ul.carSelector .carSelect:hover .car-title { color: black; } ul.carSelector .carSelect.selected .car-title { color: black; } .no-touch ul.carSelector .carSelect.noHover .wrapper:after, .no-touch ul.carSelector .carSelect.disabled:hover .wrapper:after, .no-touch ul.carSelector .carSelect.noHover .wrapper i, .no-touch ul.carSelector .carSelect.disabled:hover .wrapper i { background: none !important; } .no-touch ul.carSelector .carSelect.noHover .car-title, .no-touch ul.carSelector .carSelect.disabled:hover .car-title { color: #8a8a8a !important; } ul.carSelector .carSelect.disabled { cursor: default; -moz-opacity: 0.5; -webkit-opacity: 0.5; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=50); opacity: 0.5; } .no-touch ul.carSelector .carSelect.ready:hover .wrapper:after, .no-touch ul.carSelector .carSelect.ready:hover .wrapper i { background-position: 0 -32px; } ul.carSelector li { display: inline-block; padding: 15px 0; vertical-align: top; width: 210px; white-space: normal; } ul.carSelector li > a { display: block; } ul.carSelector li .car-title, ul.carSelector li .car-price { display: block; margin: 0 25px; text-transform: uppercase; color: #8a8a8a; } ul.carSelector li .car-title { font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; letter-spacing: -0.06em; font-size: 28px; line-height: 28px; } ul.carSelector li .car-price { font-family: "NissanAGMediumRegular", Verdana, Geneva, sans-serif; letter-spacing: -0.06em; font-size: 12px; font-size: 1.2rem; line-height: 15px; line-height: 1.5rem; } ul.carSelector li .car-price em { color: #c71444; font-style: normal; } ul.carSelector .brochures { display: none; } /* Inside Form container */ .formInput { font-size: 13px; } .formInput label { display: none; } .formInput .inputContainer { float: left; } .formInput input { z-index: 1; } .formInput .checkboxContainer { width: 239px; } .formInput .checkboxContainer strong { display: block; font-weight: normal; margin-bottom: 15px; } .formInput .checkboxContainer li { float: left; width: 50%; overflow: hidden; margin-bottom: 15px; } .formInput .checkboxContainer label { display: inline; width: auto; } .formInput .indicator { float: left; width: 19px; height: 16px; margin-left: 15px; margin-top: 7px; display: none; } .formInput .error .errorMsg { display: block; } .formInput .error .indicator { display: block; background: url("../images/form-sprite-m.png") no-repeat 0 -67px; } .formInput .valid .indicator { display: block; background: url("../images/form-sprite-m.png") no-repeat 0 -50px; } .formInput .noIndicator .indicator { display: none !important; } .formInput input ::-webkit-input-placeholder { /* WebKit browsers */ color: #666666; } .formInput input :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #666666; } .formInput input ::-moz-placeholder { /* Mozilla Firefox 19+ */ color: #666666; } .formInput input :-ms-input-placeholder { /* Internet Explorer 10+ */ color: #666666; } .requestForm { clear: both; } .requestForm input, .requestForm .tickbox { float: left; } .requestForm fieldset > div { overflow: hidden; padding-bottom: 15px; clear: both; position: relative; } .requestForm .contactOptions, .requestForm .dealerListing { padding-top: 20px; overflow: hidden; clear: both; } .requestForm .contactOptions .title, .requestForm .dealerListing .title { padding-bottom: 10px; } .requestForm .contactOptions label, .requestForm .dealerListing label { line-height: 25px; padding-right: 5px; } .requestForm .contactOptions header, .requestForm .dealerListing header { padding-bottom: 10px; display: block; border: none; } .requestForm .contactTimes fieldset > div { overflow: visible; clear: none; } .requestForm .contactTimes .selections > div { overflow: hidden; margin-bottom: 5px; } .requestForm .formInput { display: block; overflow: hidden; clear: both; position: relative; } .requestForm .formInput input { color: #666666; } .requestForm .formInput .inactiveOverlay { position: absolute; width: 100%; height: 100%; top: 0; left: 0; background-color: white; z-index: 9; -moz-opacity: 0.5; -webkit-opacity: 0.5; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=50); opacity: 0.5; } .requestForm .formInput.active .inactiveOverlay { display: none; } .requestForm.active .inactiveOverlay { display: none; } #selectBrochureForm > section, #testDriveForm > section { clear: both; } #selectBrochureForm > section.active, #testDriveForm > section.active { display: block; } #selectBrochureForm .addSecond, #selectBrochureForm .chooseDealer, #testDriveForm .addSecond, #testDriveForm .chooseDealer { font-size: 13px; margin: 10px 0 0 3px; min-height: 30px; display: none; } #selectBrochureForm .addSecond.show a, #selectBrochureForm .chooseDealer.show a, #testDriveForm .addSecond.show a, #testDriveForm .chooseDealer.show a { display: block; } #selectBrochureForm .addSecond, #testDriveForm .addSecond { margin-left: 25px; } #selectBrochureForm #Submit, #testDriveForm #Submit { display: none; } #selectBrochureForm .dropDownContainer, #testDriveForm .dropDownContainer { width: 239px; float: left; } #selectBrochureForm section.thanks, #testDriveForm section.thanks { font-size: 11px; line-height: 18px; } #selectBrochureForm section.thanks p, #testDriveForm section.thanks p { margin-top: 0; } #selectBrochureForm section.thanks .confirmation, #testDriveForm section.thanks .confirmation { border-bottom: 1px dotted #ccc; margin-bottom: 20px; padding-bottom: 20px; } #selectBrochureForm section.thanks .confirmation p strong, #testDriveForm section.thanks .confirmation p strong { display: block; font-weight: bold; } #selectBrochureForm section.thanks .confirmation p strong, #testDriveForm section.thanks .confirmation p strong { margin-bottom: 20px; } #selectBrochureForm section.thanks .confirmation h4, #testDriveForm section.thanks .confirmation h4 { font-weight: bold; } #selectBrochureForm section.thanks .confirmation strong, #testDriveForm section.thanks .confirmation strong { display: block; padding-bottom: 10px; } #selectBrochureForm section.thanks .confirmation address, #testDriveForm section.thanks .confirmation address { font-style: normal; word-wrap: break-word; } #selectBrochureForm section.thanks .confirmation address span, #testDriveForm section.thanks .confirmation address span { display: block; } #selectBrochureForm section.thanks #whatsNext li, #testDriveForm section.thanks #whatsNext li { margin-bottom: 20px; } #selectBrochureForm section.thanks #whatsNext li img, #testDriveForm section.thanks #whatsNext li img { width: 100%; } #selectBrochureForm section.thanks #whatsNext li strong, #selectBrochureForm section.thanks #whatsNext li span, #testDriveForm section.thanks #whatsNext li strong, #testDriveForm section.thanks #whatsNext li span { display: block; text-transform: uppercase; } #selectBrochureForm section.thanks #whatsNext li strong, #testDriveForm section.thanks #whatsNext li strong { color: black; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; font-size: 15px; font-weight: normal; line-height: 1em; padding-bottom: 2px; color: #4c4c4c; } #selectBrochureForm section.thanks #whatsNext li span, #testDriveForm section.thanks #whatsNext li span { text-transform: uppercase; color: #8a8a8a; font-size: 12px; line-height: 13px; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; } #testDriveForm { /* Find a dealer customisations */ } #testDriveForm .hide { display: none; } #testDriveForm .formInput { margin-left: 25px; } #testDriveForm > section { margin-bottom: 40px; } #testDriveForm > section:last-child { margin-bottom: 0; } #testDriveForm header { position: relative; } #testDriveForm header h3.numbered { font-size: 14px; line-height: 14px; height: 40px; padding-top: 20px; letter-spacing: -1px; } #testDriveForm header h3.numbered b { float: left; font-weight: bold; font-size: 36px; height: 40px; margin-top: 7px; margin-right: 5px; } #testDriveForm header h3.numbered span { float: left; height: 40px; } #testDriveForm header h3.numbered.alt { display: none; } #testDriveForm header i { display: block; position: absolute; right: 10px; top: 30px; width: 9px; height: 7px; background: url("../images/form-sprite-m.png") no-repeat 0 -95px; } #testDriveForm header.active i { background-position: 0 -87px; } #testDriveForm section.active h3 { color: #c71444; } #testDriveForm section.active h3.alt { color: #8a8a8a; } #testDriveForm .carModels header { border-top: none; } #testDriveForm .collapsed { height: 0; } #testDriveForm .collapsible { height: 0; overflow: hidden; } #testDriveForm .active .collapsible, #testDriveForm .selected .collapsible { height: auto; } #testDriveForm .selected header h3 { display: none; } #testDriveForm .selected header h3.alt { display: block; } #testDriveForm .always-on header h3 { display: block; } #testDriveForm .navigationButtons { display: none; } #testDriveForm .dealerMap { height: 170px; } #testDriveForm .dealerContact { height: 240px; } #testDriveForm .dealerContact .wrapper { padding-top: 10px; } #testDriveForm .dealerSelected .findADealerSearch, #testDriveForm .dealerSelected .navigationButtons, #testDriveForm .dealerSelected .dealer, #testDriveForm .dealerSelected .dealer .primary, #testDriveForm .dealerSelected .dealer .button.twoLines, #testDriveForm .dealerSelected .pagination, #testDriveForm .dealerSelected .totalResults { display: none !important; } #testDriveForm .dealerSelected .dealerContact { height: 185px; } #testDriveForm .dealerSelected .selected { display: block !important; } #testDriveForm .dealerPreselected .dealer { display: block !important; } #testDriveForm .buttons { margin-top: 20px; border-top: 1px dotted #ccc; } #testDriveForm #findADealerForm, #testDriveForm .carModels { border-bottom: 1px dotted #ccc; } #testDriveForm .current-selected-dealer { width: 70%; margin-left: 25px; } #testDriveForm .current-selected-dealer header { font-weight: bold; } #selectBrochureForm > header { padding-bottom: 15px; } #selectBrochureForm .brochuresSelected { display: none; line-height: 14px; padding-bottom: 10px; } #selectBrochureForm .brochuresSelected.active { display: block; } #selectBrochureForm .brochuresSelected h3 { padding-bottom: 0; line-height: 14px; display: inline; margin-right: 3px; } #selectBrochureForm .brochuresSelected ul { display: inline; } #selectBrochureForm .brochuresSelected li { font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; color: #c71444; font-size: 13px; line-height: 14px; text-transform: uppercase; display: inline; margin-right: 5px; white-space: nowrap; } header.carName { font-size: 14px; font-size: 1.4rem; font-weight: bold; text-transform: uppercase; color: #c71444; display: inline; padding-right: 10px; } #findADealerForm { overflow: hidden; clear: both; } #findADealerForm > div { clear: both; } #findADealerForm .zExpert span.tickbox { margin-left: 0; } #findADealerForm #dealerCode { display: none; } #findADealerForm .cityDropdown { margin-top: 20px; margin-bottom: 20px; } .findADealerSearch { overflow: hidden; } .findADealerSearch .zExpert { padding-top: 5px; } .findADealerSearch .inactive { color: #999999; } .findADealerSearch div.overlay.error { display: block; padding-left: 0; border: 1px solid #c71444; color: inherit; } .filters { background: black; margin: 0 0.64% 20px 0.64%; clear: both; color: white; overflow: hidden; } .filters .wrapper { margin-top: 1px; border-top: 1px solid #999999; padding: 18px 0 10px 0; overflow: hidden; } /* Grid Customisations */ #selectBrochureForm .grid_2, #testDriveForm .grid_2 { width: 48.69281046%; } /* RichContentBlock styles if needed */ .richContentBlock ol, .richContentBlock ul { padding-left: 40px; } .richContentBlock ul li { list-style-type: none; padding-bottom: 4px; background: url(data:image/gif;base64,R0lGODlhBQAFAIAAAMcURAAAACH/C1hNUCBEYXRhWE1QPD94cGFja2V0IGJlZ2luPSLvu78iIGlkPSJXNU0wTXBDZWhpSHpyZVN6TlRjemtjOWQiPz4gPHg6eG1wbWV0YSB4bWxuczp4PSJhZG9iZTpuczptZXRhLyIgeDp4bXB0az0iQWRvYmUgWE1QIENvcmUgNS4wLWMwNjAgNjEuMTM0Nzc3LCAyMDEwLzAyLzEyLTE3OjMyOjAwICAgICAgICAiPiA8cmRmOlJERiB4bWxuczpyZGY9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkvMDIvMjItcmRmLXN5bnRheC1ucyMiPiA8cmRmOkRlc2NyaXB0aW9uIHJkZjphYm91dD0iIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtbG5zOnhtcE1NPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvbW0vIiB4bWxuczpzdFJlZj0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL3NUeXBlL1Jlc291cmNlUmVmIyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IFdpbmRvd3MiIHhtcE1NOkluc3RhbmNlSUQ9InhtcC5paWQ6MzVFQTVBMTYyNEY3MTFFMkEzNzlGMjYwQzI1MTg5MDYiIHhtcE1NOkRvY3VtZW50SUQ9InhtcC5kaWQ6MzVFQTVBMTcyNEY3MTFFMkEzNzlGMjYwQzI1MTg5MDYiPiA8eG1wTU06RGVyaXZlZEZyb20gc3RSZWY6aW5zdGFuY2VJRD0ieG1wLmlpZDozNUVBNUExNDI0RjcxMUUyQTM3OUYyNjBDMjUxODkwNiIgc3RSZWY6ZG9jdW1lbnRJRD0ieG1wLmRpZDozNUVBNUExNTI0RjcxMUUyQTM3OUYyNjBDMjUxODkwNiIvPiA8L3JkZjpEZXNjcmlwdGlvbj4gPC9yZGY6UkRGPiA8L3g6eG1wbWV0YT4gPD94cGFja2V0IGVuZD0iciI/PgH//v38+/r5+Pf29fTz8vHw7+7t7Ovq6ejn5uXk4+Lh4N/e3dzb2tnY19bV1NPS0dDPzs3My8rJyMfGxcTDwsHAv769vLu6ubi3trW0s7KxsK+urayrqqmop6alpKOioaCfnp2cm5qZmJeWlZSTkpGQj46NjIuKiYiHhoWEg4KBgH9+fXx7enl4d3Z1dHNycXBvbm1sa2ppaGdmZWRjYmFgX15dXFtaWVhXVlVUU1JRUE9OTUxLSklIR0ZFRENCQUA/Pj08Ozo5ODc2NTQzMjEwLy4tLCsqKSgnJiUkIyIhIB8eHRwbGhkYFxYVFBMSERAPDg0MCwoJCAcGBQQDAgEAACH5BAAAAAAALAAAAAAFAAUAAAIEhI+pWAA7) no-repeat left 8px; padding-left: 15px; } .richContentBlock .videoPlayer { max-width: 640px; max-height: 360px; overflow: hidden; } section .accordion { padding-bottom: 0; } section .accordion article { padding: 10px 0 10px 0; overflow: hidden; } section .accordion article .textButton { padding-top: 6px; } section .accordion article .left { padding-top: 10px; width: 70%; } section .accordion article header { font-weight: bold; color: #666666; padding-bottom: 0; overflow: hidden; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } section .accordion article header span { display: block; font-weight: normal; color: #666666; } section .accordion article header a { font-weight: normal; } section .accordion article header .close { display: none; } section .accordion article header:after { color: #c1c1c1; content: "\2193"; font-family: "icons"; margin-left: 6px; position: relative; top: 10px; float: right; font-size: 14px; font-size: 1.4rem; font-weight: normal; float: right; } section .accordion article header.open { color: #c71444; } section .accordion article header.open:after { content: "\2191"; color: #c71444; } section .accordion div.expand { overflow: hidden; height: 0; -webkit-transition: height 0.5s ease-in-out; -moz-transition: height 0.5s ease-in-out; -ms-transition: height 0.5s ease-in-out; transition: height 0.5s ease-in-out; } section .accordion div.expand.disable-anim { -moz-transition: none !important; -webkit-transition: none !important; -o-transition: color 0 ease-in !important; transition: none !important; } section .accordion div.expand .wrapper { padding-top: 10px; } section .accordion div.expand img { width: 100%; height: auto; } section .accordion h3 { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; cursor: pointer; background-position: -20px 7px; } section .accordion ol li { list-style: decimal; } section .opened h3 { background-position: 0 -13px; } section div.expand.openHidden { position: absolute; opacity: 0; height: auto; } section.accordion + h2 { margin-top: 45px; } .accordionV2 .acc-header { padding: 12px 20px; border-top: 1px solid #D4D4D4; } .accordionV2 .menu { padding: 0 20px; } .accordionV2 header.acc-header a { -webkit-transition: color 0.2s ease-in-out; -moz-transition: color 0.2s ease-in-out; -ms-transition: color 0.2s ease-in-out; transition: color 0.2s ease-in-out; } .accordionV2 header.acc-header a:after { content: "\2193"; } .accordionV2 header.acc-header a:after { float: right; color: #c1c1c1; } .accordionV2 .acc-header.open, .accordionV2 header.acc-header.open, .accordionV2 header.acc-header.open a { color: #c71444; } .accordionV2 header.acc-header.open a:after { content: "\2191"; } .accordionV2 header.acc-header.open a:after { float: right; color: #c71444; } .accordionV2 .menu { overflow: hidden; -webkit-transition: height 0.35s ease; -moz-transition: height 0.35s ease; -ms-transition: height 0.35s ease; transition: height 0.35s ease; } .accordionV2 .menu.disable-anim { -moz-transition: none !important; -webkit-transition: none !important; -o-transition: color 0 ease-in !important; transition: none !important; } .accordionV2 .android .menu { -webkit-transform: none; -moz-transform: none; -ms-transform: none; transform: none; } /* Accessories styles */ button + .accessory { display: table-caption; } .accessory figcaption { font-size: 13px; font-size: 1.3rem; color: #8a8a8a; padding-bottom: 10px; color: #666666; padding-bottom: 0; } .accessory .textButton { padding-top: 1px; padding-bottom: 2px; } .accessory article { border: none!important; } .accessory .accessory-container { padding-left: 0; margin-left: 0; overflow: hidden; } .accessory .accessory-container img { width: 100%; } .accessory .accessory-container .grid_6 img { max-width: 576px; width: 100%; } .accessory .accessory-container figcaption span { color: #999999; } /* Mobile only * put here so that we don't have to reset it later as the responsive design for these tables * is very hard to reset */ /* tables layouts medium and Small tables */ #scrollTable { overflow-y: hidden; overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 30px 0; } table { display: block; width: 100%; border-collapse: separate; line-height: 1.2em; -webkit-overflow-scrolling: touch; /* property for the ipad scrolling */ } table td { border-right: 1px solid #c1c1c1; border-left: 1px solid white; padding: 5px; } table .evenRow td, table .evenRow th { background-color: #eeeeee; border-top: 1px solid #eeeeee; border-bottom: 1px solid #eeeeee; } table th { border-right: 1px solid #999999; text-transform: uppercase; padding: 4px; } table thead { font-size: 12px; font-size: 1.2rem; padding-bottom: 10px; } table thead th { border-right: 1px solid #999999; background-color: #c71444; color: white; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; font-weight: normal; clear: none; text-align: left; } table thead th.spanHeaderRow { text-align: center; border-top: 1px solid #eeeeee; border-right: 1px solid #eeeeee; background-color: #c1c1c1; color: black; } table thead tr + tr th { text-align: center; padding-bottom: 10px; font-size: 10px; font-size: 1rem; max-width: 53px; padding: 3px; } table tbody th { text-align: left; color: #4c4c4c; font-family: Verdana, Geneva, sans-serif; min-height: 44px; height: 20px; padding-bottom: 10px; min-width: 90px; font-size: 11px; font-size: 1.1rem; font-weight: normal; text-transform: none; border-left: 1px solid #c1c1c1; border-right: 1px solid #c1c1c1; } table tbody td { text-align: center; font-size: 11px; font-size: 1.1rem; color: #4c4c4c; } table tbody tr.totals { border-collapse: separate; padding-bottom: 0; font-family: Verdana, Geneva, sans-serif; border-right: 1px solid #eeeeee; } table tbody tr.totals.last th, table tbody tr.totals.last td { border-bottom: 1px solid #c1c1c1; } table tbody tr.totals.totalsFirst th, table tbody tr.totals.totalsFirst td { border-top: 1px solid #c1c1c1; } table tbody tr.totals td { padding-bottom: 0; font-family: Verdana, Geneva, sans-serif; } table tbody tr.totals th { font-size: 11px; font-size: 1.1rem; font-weight: bold; text-align: right; margin: 10px; } /* this table is only used on one page and has different * layout/presentation from the 'normal pages' */ table.simpleTable { border: none; border-collapse: separate; width: 100%; position: relative; -webkit-overflow-scrolling: touch; /* property for the ipad scrolling */ } table.simpleTable thead { padding: 0; display: block; } table.simpleTable thead th { background-color: #c1c1c1; color: black; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; padding: 5px; font-size: 14px; font-size: 1.4rem; line-height: 1.3em; } table.simpleTable thead th:first-child { border-left: 1px solid #eeeeee; border-right: 1px solid #eeeeee; border-bottom: 1px solid #c1c1c1; border-top: 1px solid #eeeeee; height: 20px; } table.simpleTable thead th:first-child + th + th { border-right: 1px solid #c1c1c1; border-left: 1px solid #eeeeee; border-bottom: 1px solid #c1c1c1; border-top: 1px solid #eeeeee; height: 20px; } table.simpleTable thead th:first-child + th { background-color: #c71444; color: white; } table.simpleTable th, table.simpleTable td { width: 135px; min-width: 135px; padding: 5px; height: 23px; font-weight: normal; text-align: left; } table.simpleTable th { height: 33px; } table.simpleTable tbody { display: block; } table.simpleTable tbody th { border-right: 1px solid #c1c1c1; border-left: 1px solid white; text-transform: uppercase; height: 33px; } table.simpleTable tbody td { min-height: 33px; border-right: 1px solid #c1c1c1; border-left: 1px solid white; } table.simpleTable tbody tr:first-child { border-bottom: 0; } table.simpleTable tbody tr.totals th { background: none; font-weight: bold; } table.simpleTable tbody tr.totals td { font-size: 14px; font-size: 1.4rem; } table.simpleTable tbody td:first-child + td { font-weight: bold; font-size: 14px; font-size: 1.4rem; } table.simpleTable th:first-child + th { border-top: #c1c1c1 1px solid; border-bottom: #c1c1c1 1px solid; } table.simpleTable tbody tr.totals td { font-weight: bold; font-size: 14px; font-size: 1.4rem; } table.simpleTable tbody tr.totals th { border-bottom: 1px solid #c1c1c1; padding-bottom: 10px; } table.simpleTable tbody tr.totals + tr.totals th { display: hidden; border-top: none; border-bottom: 1px solid #999999; } table.simpleTable tbody tr.totals td:first-child + td + td { border-bottom: 1px solid #999999; background: #ACADAC; background-image: -webkit-gradient(linear, left top, left bottom, from(white), to(#acadac)); background-image: -webkit-linear-gradient(white 0%, #acadac 100%); background-image: -moz-linear-gradient(white 0%, #acadac 100%); background-image: -o-linear-gradient(top, white 0%, #acadac 100%); /* Opera 11.10+ */ background-image: -ms-linear-gradient(top, white 0%, #acadac 100%); /* IE10+ */ background-image: linear-gradient(top, white 0%, #acadac 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='white', endColorStr='#acadac',GradientType=0); color: #4c4c4c; font-weight: bold; border-right: 1px solid #999999; border-left: 1px solid #999999; } /* aftersales top level template * car model selector * used in * Parts Price Comparison home * Accessories home * Maintenance Costs home */ .modelSelector.grid_3 { width: 48.69281046%; float: left; } .modelSelector article { background-image: none; } .modelSelector figure { position: relative; } .modelSelector figure + .speechBubble { margin-top: -40px; } .modelSelector figcaption { color: #c71444; font-size: 13px; font-size: 1.3rem; font-weight: bold; } .modelSelector figcaption span { height: auto; background-color: #c71444; /* for older browsers */ background: #c71444; background-image: -webkit-gradient(linear, left top, left bottom, from(#c21329), to(#810a1a)); background-image: -webkit-linear-gradient(#c21329 0%, #810a1a 100%); background-image: -moz-linear-gradient(#c21329 0%, #810a1a 100%); background-image: -o-linear-gradient(top, #c21329 0%, #810a1a 100%); /* Opera 11.10+ */ background-image: -ms-linear-gradient(top, #c21329 0%, #810a1a 100%); /* IE10+ */ background-image: linear-gradient(top, #c21329 0%, #810a1a 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#c21329', endColorStr='#810a1a',GradientType=0); color: white; padding: 2px; } .modelSelector figcaption span a { color: white; } .modelSelector .speechBubble { height: 33px; white-space: nowrap; top: -166px; right: 0; position: relative; background: #8c171f url("../images/transparent.gif") top left no-repeat; -moz-opacity: 0.95; -khtml-opacity: 0.95; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=95)"; filter: alpha(opacity=95); opacity: .95; width: 50%; } .modelSelector .speechBubble a { color: white; } .modelSelector .open { display: block; } .modelSelector .closed { display: none; } .dealers .totalResults { display: none; text-align: left; width: 100%; margin-top: -10px; padding-top: 0; padding-bottom: 10px; } .dealers .grid_6 { float: left; width: 48.69281046%; } .dealers .grid_9 { float: left; width: 100%; } .dealers .grid_3 { float: left; width: 100%; } .dealerListing { clear: both; } article.dealer { overflow: hidden; clear: both; margin-bottom: 20px; } article.dealer header { background: #666; background-image: -webkit-gradient(linear, left top, left bottom, from(#999999), to(#666666)); background-image: -webkit-linear-gradient(#999999 0%, #666666 100%); background-image: -moz-linear-gradient(#999999 0%, #666666 100%); background-image: -o-linear-gradient(top, #999999 0%, #666666 100%); /* Opera 11.10+ */ background-image: -ms-linear-gradient(top, #999999 0%, #666666 100%); /* IE10+ */ background-image: linear-gradient(top, #999999 0%, #666666 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#999999', endColorStr='#666666',GradientType=0); font-size: 13px; font-size: 1.3rem; overflow: hidden; font-family: Verdana, Geneva, sans-serif; color: white; text-transform: uppercase; } article.dealer header div { margin-left: 20px; line-height: 2em; } article.dealer header span { font-family: Verdana, Geneva, sans-serif; } article.dealer header .dealerName { float: left; } article.dealer header .zExpert { background: url("../images/global-sprite.png") no-repeat 0 -280px; text-indent: -9999999px; padding: 0; height: 30px; margin: 6px 0 0 0; min-width: 100px; float: right; } article.dealer .dealerContact, article.dealer .dealerMap { height: 270px; background: #F0F0F0; background-image: -webkit-gradient(linear, left top, left bottom, from(white), to(#f0f0f0)); background-image: -webkit-linear-gradient(white 0%, #f0f0f0 100%); background-image: -moz-linear-gradient(white 0%, #f0f0f0 100%); background-image: -o-linear-gradient(top, white 0%, #f0f0f0 100%); /* Opera 11.10+ */ background-image: -ms-linear-gradient(top, white 0%, #f0f0f0 100%); /* IE10+ */ background-image: linear-gradient(top, white 0%, #f0f0f0 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='white', endColorStr='#f0f0f0',GradientType=0); } article.dealer .dealerContact .wrapper { padding: 20px 0 0 20px; height: inherit; } article.dealer .dealerContact .wrapper div:first-child { padding-top: 0; } article.dealer .dealerContact strong { text-transform: uppercase; width: 80px; padding-top: 10px; display: inline-block; } article.dealer .dealerContact span { display: inline-block; vertical-align: text-top; } article.dealer .dealerMap .wrapper { height: 100%; width: 100%; } article.dealer .dealerMap .map { height: 100%; width: 100%; } .mediumTile .wrapper { margin-bottom: 50px; } .mediumTile h4 { line-height: 1em; padding-bottom: 10px; } .mediumTile .button { margin: 10px 0; } .mediumTile img { width: 100%; } .smallTile { clear: both; overflow: hidden; position: relative; } .smallTile .moreInfo { padding-left: 10px; padding-bottom: 1.5em; } .smallTile h4 { line-height: 1em; } .smallTile img { width: 99%; padding: 1px; background: black; } .smallTile a.textLink { position: absolute; bottom: 0; } .smallTile .grid_2 { width: 15.35948%; float: left; } .smallTile .grid_7 { width: 82.35947712%; float: left; } .mediumImage header { overflow: hidden; cursor: pointer; padding-top: 3px; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .mediumImage header.empty { cursor: default; } .mediumImage header .textButton { display: none; padding-top: 3px; } .mediumImage header .textButton a { padding-top: 3px; } .mediumImage img { width: 100%; } #offerListing { clear: both; overflow: hidden; } #offerListing .zeroResults { display: none; } #offerDetails .button.tertiary { margin-bottom: 20px; } .twoCol { overflow: hidden; clear: both; } .twoCol .divider-left { border: none; } .twoCol .marginLeft { margin-left: 0; } .threeCol .wrapper { padding-top: 20px; } .threeCol strong { display: block; padding-top: 20px; } #articleListing .topArticles { overflow: hidden; clear: both; } #articleListing .mediumTile a { color: #666666; } #articleListing .mediumTile .textButton { color: #c71444; } #articleListing .mediumTile h4 { padding-bottom: 0; } #articleListing .mediumTile div.meta { padding-bottom: 20px; } #articleListing .mediumTile div.meta span { color: #c71444; } #articleListing .mediumTile div.details { line-height: 1.5em; height: 4.5em; overflow: hidden; } #articleListing .mediumTile h3 { padding-bottom: 0; } #articleListing .mediumTile .meta, #articleListing .mediumTile .details { font-size: 14px; font-size: 1.4rem; } #articleListing section { overflow: hidden; clear: both; } .smallArticle strong { display: block; } #articleDetails .grid_6 .wrapper { border-right: 2px solid #EEE; padding-right: 10px; } #articleDetails .meta { padding-top: 20px; } .no-touch #main #hero { width: 95.625%; margin-left: 2.1875%; margin-right: 2.1875%; overflow: hidden; } .no-touch #main #hero section .next, .no-touch #main #hero section .prev { font-size: 25px; font-size: 2.5rem; line-height: 170px; line-height: 17rem; -moz-opacity: 0; -webkit-opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=0); opacity: 0; -webkit-transition: opacity 0.2s ease-out; -moz-transition: opacity 0.2s ease-out; -ms-transition: opacity 0.2s ease-out; transition: opacity 0.2s ease-out; display: block; height: 170px; width: 37px; position: absolute; color: #4c4c4c; top: 69px; text-align: center; } .no-touch #main #hero section .next span, .no-touch #main #hero section .prev span { display: block; cursor: pointer; background: #c1c1c1; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .no-touch #main #hero section .next:hover, .no-touch #main #hero section .prev:hover { -moz-opacity: 0.5; -webkit-opacity: 0.5; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=50); opacity: 0.5; } .no-touch #main #hero section .panelWrapper { margin-right: 1.3%; } .no-touch #main #hero section .next { right: 0; padding-left: 25%; } .no-touch #main #hero section .prev { left: 0; } #main #hero { margin: 0; } #main #hero section { font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; text-transform: uppercase; position: relative; } #main #hero section .next, #main #hero section .prev { display: none; } #main #hero section .panelWrapper { background: #F9F9F9; height: 100%; } #main #hero section .panelWrapper header { position: relative; top: 2px; } #main #hero section article em { font-style: normal; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; } #main #hero section article .intro { font-family: "NissanAGMediumRegular", Verdana, Geneva, sans-serif; } #main #hero section article .details, #main #hero section article .hero-img { width: auto; } #main #hero section article .details { padding-left: 20px; } #main #hero section article .details .wrapper { width: 80%; } #main #hero section article .details ul { overflow: hidden; } #main #hero section article .hero-img img { width: 100%; } #main #hero section article .intro { font-size: 14px; font-size: 1.4rem; line-height: 15px; line-height: 1.5rem; color: #666666; padding-bottom: 5px; } #main #hero section article header, #main #hero section article h1, #main #hero section article .price, #main #hero section article .terms { font-size: 34px; font-size: 3.4rem; line-height: 20px; line-height: 2rem; color: black; display: inline; } #main #hero section article .button { margin-top: 6px; margin-bottom: 0; } #main #hero section article.offer ul { font-size: 14px; font-size: 1.4rem; } #main #hero section article.offer ul li:first-child { border-bottom: 1px dashed #c1c1c1; } #main #hero section article.offer footer { text-transform: none; display: none; font-family: Verdana, Geneva, sans-serif; width: 70%; margin-left: 3px; } #main #hero section article.offer footer.mobile { padding-left: 20px; display: block; padding-bottom: 30px; } #main #hero section article.generic li { float: left; margin-right: 15px; } #main .lrg-promo, #main .med-promo, #main .small-promo { font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; line-height: 14px; line-height: 1.4rem; } #main .lrg-promo header, #main .lrg-promo a, #main .med-promo header, #main .med-promo a, #main .small-promo header, #main .small-promo a { text-transform: uppercase; display: block; } #main .lrg-promo header, #main .med-promo header, #main .small-promo header { line-height: 20px; line-height: 2rem; margin-bottom: 3px; color: #343434; } #main .lrg-promo a, #main .med-promo a, #main .small-promo a { font-size: 12px; font-size: 1.2rem; color: #8a8a8a; } #main .lrg-promo a:hover span, #main .med-promo a:hover span, #main .small-promo a:hover span { color: #c71444; } #main .lrg-promo a:hover span:after, #main .med-promo a:hover span:after, #main .small-promo a:hover span:after { content: "\2192"; font-size: 9px; font-size: 0.9rem; line-height: 10px; line-height: 1rem; color: #c71444; font-weight: normal; } #main .lrg-promo header, #main .med-promo header { font-size: 20px; font-size: 2rem; padding-top: 0; } #main .small-promo header { font-size: 15px; font-size: 1.5rem; } #main .med-promos { overflow: hidden; } #main .med-promos .grid_3 { margin-left: 0; margin-right: 0; } #main .med-promos .grid_3:first-child { margin-right: 1.7%; margin-left: 0.625%; } #main .lrg-promo a { padding-bottom: 8px; } #main .lrg-promo header { padding-top: 0; } #main .lrg-promo, #main .med-promo, #main section.latest { border-bottom: 1px solid #DDD; padding-bottom: 15px; margin-bottom: 15px; padding-bottom: 0; } #main .med-promo { width: 48.69281046%; float: left; } #main .med-promo a { padding-bottom: 8px; } #main .med-promo .mediumWrapper div { padding-top: 2px; line-height: 15px; line-height: 1.5rem; } #main .small-promo { width: auto; margin: 0; clear: both; padding-bottom: 12px; overflow: hidden; } #main .small-promo img { width: 48.69281046%; float: left; margin: 0 0.64%; } #main .small-promo .smallWrapper { float: left; width: 48.69281046%; } #main .small-promo .smallWrapper header, #main .small-promo .smallWrapper div { padding-left: 10px; line-height: 15px; line-height: 1.5rem; } #main .small-promo .smallWrapper header { padding-bottom: 3px; line-height: 17px; line-height: 1.7rem; } #main h2.grid_12, #main .lrg-promo, #main .med-promo { margin-left: 0.64%; margin-right: 0.64%; } #main .spotlight { padding-top: 10px; } #main h2 { color: #343434; font-size: 30px; font-size: 3rem; } #main .spotlight h2, #main .latest h2 { border-bottom: 1px dashed #c1c1c1; } /*#main { margin: 20px auto 0; padding-bottom: ($footerSmallHeight + $footerGapAbove)*1px; }*/ /* reduce height for hr in mobile */ hr.tall { margin-top: 10px; margin-bottom: 10px; } /* Headers */ h1 span { margin-left: 1px; } #main h2, .h2 { padding-bottom: 10px; margin-bottom: 10px; margin-top: 10px; } .textButton a { height: 14px; display: block; } /* header image padding on article pages */ .headerImage img { margin: 10px 0 15px; } .container, #vlp-versions header h2, #vlp-versions header .price-range, .vlp-features header, .vlp-features .feature-item .collapsible, .vlp-features-overlay .article-container header, .vlp-features-overlay article p, .vlp-features-overlay .sidebar .item strong, .vlp-features-overlay .sidebar .item p, #vlp-hero header, #vlp-hero .colour-picker strong, #vlp-hero .stats, .vlp-next-steps { width: auto; margin: 0 20px; } #search-results article { border-bottom: 1px dashed #c1c1c1; padding-bottom: 20px; margin-bottom: 20px; } #search-results h3 { padding-bottom: 2px; } #search-results .category { padding-top: 1px; font-size: 10px; font-size: 1rem; color: #999999; } #search-results .category span { font-weight: bold; } #search-results .category span.icon { font-size: 8px; font-size: 0.8rem; } #search-results .loader { height: 50px; width: 50px; margin: 0 auto; display: none; } #main h2 span.num-results { display: inline; } .ns-carousel { position: relative; overflow: hidden; } .ns-carousel .ns-carousel-wrp { position: absolute; left: 0; top: 0; } .hero img, .small-promo img, .med-promo img, .lrg-promo img { width: 100%; } html:lang(th) section.social .s-provider header { font-weight: bold; font-size: 9px; font-size: 0.9rem; } section.social { border-top: 1px solid #DDD; border-bottom: 1px solid #DDD; background: #F9F9F9; margin-top: 15px; } section.social .s-provider { padding-top: 15px; border-bottom: 1px dashed #c1c1c1; padding-bottom: 20px; margin-bottom: 20px; padding-bottom: 15px; margin-bottom: 0; } section.social .s-provider:last-child { border-bottom: none; } section.social .s-provider img { width: 100%; } section.social .s-provider .s-wrapper { position: relative; } section.social .s-provider header, section.social .s-provider .s-action { position: absolute; } section.social .s-provider header { top: -3px; left: 0; text-transform: uppercase; color: #8a8a8a; font-size: 13px; font-size: 1.3rem; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; } section.social .s-provider .s-action { bottom: -3px; left: 0; } section.social .s-provider .details { width: 82.35947712%; margin: 0 0 0 50px; height: 40px; position: relative; } section.social .twitter .s-action { bottom: -4px; } section.social .facebook header { top: -2px; } section.social .facebook .s-action { bottom: -1px; } section.social .google header { top: -2px; } section.social .google .s-action { bottom: -4px; } section.social a .social-button { height: 18px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; -webkit-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); -moz-text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5); border: 1px solid #ccc; background-image: -webkit-gradient(linear, left top, left bottom, from(white), to(#dedede)); background-image: -webkit-linear-gradient(white 0%, #dedede 100%); background-image: -moz-linear-gradient(white 0%, #dedede 100%); background-image: -o-linear-gradient(top, white 0%, #dedede 100%); /* Opera 11.10+ */ background-image: -ms-linear-gradient(top, white 0%, #dedede 100%); /* IE10+ */ background-image: linear-gradient(top, white 0%, #dedede 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='white', endColorStr='#dedede',GradientType=0); margin-bottom: 6px; } section.social a .social-button span { display: block; padding: 0 3px 0 21px; white-space: nowrap; color: #333; font-weight: bold; background: url("../images/share/plus.png") no-repeat 4px 4px; margin-top: -2px; } section.social a:hover .social-button { background-image: -webkit-gradient(linear, left top, left bottom, from(#f8f8f8), to(#d9d9d9)); background-image: -webkit-linear-gradient(#f8f8f8 0%, #d9d9d9 100%); background-image: -moz-linear-gradient(#f8f8f8 0%, #d9d9d9 100%); background-image: -o-linear-gradient(top, #f8f8f8 0%, #d9d9d9 100%); /* Opera 11.10+ */ background-image: -ms-linear-gradient(top, #f8f8f8 0%, #d9d9d9 100%); /* IE10+ */ background-image: linear-gradient(top, #f8f8f8 0%, #d9d9d9 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#f8f8f8', endColorStr='#d9d9d9',GradientType=0); } section.social a:active .social-button { background-color: #efefef; -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.1); box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.1); } section.social .logo { height: 40px; width: 40px; float: left; } @media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) { section.social a .social-button span { background: url("../images/share/plus-2x.png") no-repeat 4px 5px; background-size: 13px 13px; padding-top: 1px; margin-top: -2px; } } .touch .carouselV2 .panel { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } .carouselV2 { overflow: visible; white-space: nowrap; position: relative; top: 0; left: 0; -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } .carouselV2.ready { -webkit-transition: all 500ms cubic-bezier(0, 0, 0.25, 1); -moz-transition: all 500ms cubic-bezier(0, 0, 0.25, 1); -ms-transition: all 500ms cubic-bezier(0, 0, 0.25, 1); transition: all 500ms cubic-bezier(0, 0, 0.25, 1); } .carouselV2.disable { -moz-transition: none !important; -webkit-transition: none !important; -o-transition: color 0 ease-in !important; transition: none !important; } .carouselV2 .panel { overflow: hidden; display: inline-block; white-space: normal; height: 100%; float: left; -webkit-touch-callout: none; } .carouselV2 .panel .panelWrapper { overflow: hidden; } .bullet-pagination { position: relative; top: -35px; margin: 0 auto; } .bullet-pagination a { color: #d6d6d6; } .bullet-pagination a:hover { color: #c71444; } .bullet-pagination ul { display: inline-block; overflow: hidden; font-size: 13px; font-size: 1.3rem; } .bullet-pagination li { float: left; padding: 10px 5px; width: 13px; } .bullet-pagination li.active a { color: #c71444; } /* When new site style is implemented, this needs to be looked at to match */ .overlayActive { position: fixed; } .overlayActive .pulsarOverlay { overflow-y: scroll; } #pulsarCampaign { margin-left: 0; margin-right: 0; width: 100%; font-size: 14px; font-size: 1.4rem; line-height: 1.4em; } #pulsarCampaign .backgroundWrapper { background: url("../images/campaigns/pulsar/bg_tile.jpg") repeat-y top center; } #pulsarCampaign .lockupBackground { display: none; } #pulsarCampaign .container, #pulsarCampaign #vlp-versions header h2, #vlp-versions header #pulsarCampaign h2, #pulsarCampaign #vlp-versions header .price-range, #vlp-versions header #pulsarCampaign .price-range, #pulsarCampaign .vlp-features header, .vlp-features #pulsarCampaign header, #pulsarCampaign .vlp-features .feature-item .collapsible, .vlp-features .feature-item #pulsarCampaign .collapsible, #pulsarCampaign .vlp-features-overlay .article-container header, .vlp-features-overlay .article-container #pulsarCampaign header, #pulsarCampaign .vlp-features-overlay article p, .vlp-features-overlay article #pulsarCampaign p, #pulsarCampaign .vlp-features-overlay .sidebar .item strong, .vlp-features-overlay .sidebar .item #pulsarCampaign strong, #pulsarCampaign .vlp-features-overlay .sidebar .item p, .vlp-features-overlay .sidebar .item #pulsarCampaign p, #pulsarCampaign #vlp-hero header, #vlp-hero #pulsarCampaign header, #pulsarCampaign #vlp-hero .colour-picker strong, #vlp-hero .colour-picker #pulsarCampaign strong, #pulsarCampaign #vlp-hero .stats, #vlp-hero #pulsarCampaign .stats, #pulsarCampaign .vlp-next-steps { overflow: hidden; padding-bottom: 50px; } #pulsarCampaign .lockup { padding-top: 13px; } #pulsarCampaign .lockup .copy { margin-bottom: 20px; } #pulsarCampaign .lockup .copy h3 { margin-bottom: 0; padding-bottom: 0; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; font-size: 1.2em; color: #c71444; } #pulsarCampaign .lockup .copy h2 { margin-top: 0; padding-bottom: 0; color: black; font-size: 3em; line-height: 0.9em; border-bottom: none; } #pulsarCampaign .lockup .ctas li { display: inline; } #pulsarCampaign .lockup .ctas li a { background: url("../images/campaigns/pulsar/cta_arrow.png") no-repeat center right; padding-top: 2px; padding-right: 15px; margin-bottom: 10px; display: inline-block; } #pulsarCampaign .lockup .ctas li:first-child { padding-right: 10px; margin-right: 9px; border-right: 1px solid #999999; } #pulsarCampaign .lockup .ctas a { font-family: Verdana, Geneva, sans-serif; text-transform: uppercase; } #pulsarCampaign .lockup .floaties li { float: left; margin-right: 10px; margin-bottom: 10px; } #pulsarCampaign .lockup .floaties li img { width: 90px; height: 90px; } #pulsarCampaign .lockup .floaties .win { cursor: pointer; } #pulsarCampaign .lockup .hero, #pulsarCampaign .lockup .heroReflect { top: -30px; position: relative; pointer-events: none; } #pulsarCampaign .lockup .hero img, #pulsarCampaign .lockup .heroReflect img { width: 100%; height: auto; pointer-events: none; } #pulsarCampaign .lockup .hero { margin-top: -100%; z-index: 2; } #pulsarCampaign .lockup .heroReflect img { opacity: 0; } #pulsarCampaign .lockup .heroReflect img.visible { opacity: 1; } #pulsarCampaign #instafeed { min-height: 1000px; margin-top: -120px; } #pulsarCampaign .instafilters { position: fixed; z-index: 20; width: 100%; margin-left: -2.1875%; background-color: #eeeeee; top: 0; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; color: #343434; text-transform: uppercase; opacity: 1; -webkit-transition: top 800ms ease-in-out, opacity 800ms ease-in-out; -moz-transition: top 800ms ease-in-out, opacity 800ms ease-in-out; -ms-transition: top 800ms ease-in-out, opacity 800ms ease-in-out; transition: top 800ms ease-in-out, opacity 800ms ease-in-out; } #pulsarCampaign .instafilters.hidden { top: -45px; opacity: 0; } #pulsarCampaign .instafilters.active.hidden { top: -250px; } #pulsarCampaign .instafilters span { display: block; cursor: pointer; font-size: 20px; padding: 16px 36px 10px; } #pulsarCampaign .instafilters span i { float: right; width: 16px; height: 11px; margin-top: 2px; background: url("../images/campaigns/pulsar/filters_arrow.png") no-repeat 0 0; } #pulsarCampaign .instafilters ul { font-size: 13px; padding: 0 36px; } #pulsarCampaign .instafilters ul li { height: 0; overflow: hidden; -webkit-transition: height 300ms ease-in-out; -moz-transition: height 300ms ease-in-out; -ms-transition: height 300ms ease-in-out; transition: height 300ms ease-in-out; } #pulsarCampaign .instafilters ul li a { display: block; border-top: 1px dashed #999999; color: #343434; padding: 10px 0; } #pulsarCampaign .instafilters ul li.active a { color: #c71444; } #pulsarCampaign .instafilters ul .search { height: 0; } #pulsarCampaign .instafilters ul .search input { margin-top: 16px; background: white url("../images/campaigns/pulsar/search.gif") no-repeat 99% center; width: 98%; height: 26px; font-family: Verdana, Geneva, sans-serif; font-size: 11px; padding: 0; outline: none; } #pulsarCampaign .instafilters ul .search input.loading { background-image: url("../images/campaigns/pulsar/search_l.gif"); background-position: 98% center; } #pulsarCampaign .instafilters ul .search .noResults { opacity: 0; font-size: 11px; font-family: Verdana, Geneva, sans-serif; text-transform: none; padding-left: 7px; padding-top: 5px; padding-bottom: 5px; -webkit-transition: opacity 300ms ease-in-out; -moz-transition: opacity 300ms ease-in-out; -ms-transition: opacity 300ms ease-in-out; transition: opacity 300ms ease-in-out; } #pulsarCampaign .instafilters ul .search .noResults.active { opacity: 1; } #pulsarCampaign .instafilters.active li { height: 0; } #pulsarCampaign .instafilters.active .search { height: 0; } #pulsarCampaign .instafilters.active li { height: 40px; } #pulsarCampaign .instafilters.active .search { border-top: 3px dotted #c71444; height: 76px; } #pulsarCampaign .instablocks { -webkit-transition: opacity 400ms ease-in-out; -moz-transition: opacity 400ms ease-in-out; -ms-transition: opacity 400ms ease-in-out; transition: opacity 400ms ease-in-out; } #pulsarCampaign .loading { height: 100px; background: url("../images/campaigns/pulsar/loading.gif") no-repeat center center; width: 100%; clear: both; } #pulsarCampaign .instafooter { font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; text-transform: uppercase; } #pulsarCampaign .instafooter .roof { display: none; } #pulsarCampaign .instafooter .sticky { position: fixed; width: 100%; bottom: 0; left: 0; height: 50px; background: black; background: rgba(0, 0, 0, 0.94); opacity: 1; -webkit-transition: bottom 800ms ease-in-out, opacity 800ms ease-in-out; -moz-transition: bottom 800ms ease-in-out, opacity 800ms ease-in-out; -ms-transition: bottom 800ms ease-in-out, opacity 800ms ease-in-out; transition: bottom 800ms ease-in-out, opacity 800ms ease-in-out; } #pulsarCampaign .instafooter .sticky.hidden { bottom: -71px; opacity: 0; } #pulsarCampaign .instafooter .sticky .container, #pulsarCampaign .instafooter .sticky #vlp-versions header h2, #vlp-versions header #pulsarCampaign .instafooter .sticky h2, #pulsarCampaign .instafooter .sticky #vlp-versions header .price-range, #vlp-versions header #pulsarCampaign .instafooter .sticky .price-range, #pulsarCampaign .instafooter .sticky .vlp-features header, .vlp-features #pulsarCampaign .instafooter .sticky header, #pulsarCampaign .instafooter .sticky .vlp-features .feature-item .collapsible, .vlp-features .feature-item #pulsarCampaign .instafooter .sticky .collapsible, #pulsarCampaign .instafooter .sticky .vlp-features-overlay .article-container header, .vlp-features-overlay .article-container #pulsarCampaign .instafooter .sticky header, #pulsarCampaign .instafooter .sticky .vlp-features-overlay article p, .vlp-features-overlay article #pulsarCampaign .instafooter .sticky p, #pulsarCampaign .instafooter .sticky .vlp-features-overlay .sidebar .item strong, .vlp-features-overlay .sidebar .item #pulsarCampaign .instafooter .sticky strong, #pulsarCampaign .instafooter .sticky .vlp-features-overlay .sidebar .item p, .vlp-features-overlay .sidebar .item #pulsarCampaign .instafooter .sticky p, #pulsarCampaign .instafooter .sticky #vlp-hero header, #vlp-hero #pulsarCampaign .instafooter .sticky header, #pulsarCampaign .instafooter .sticky #vlp-hero .colour-picker strong, #vlp-hero .colour-picker #pulsarCampaign .instafooter .sticky strong, #pulsarCampaign .instafooter .sticky #vlp-hero .stats, #vlp-hero #pulsarCampaign .instafooter .sticky .stats, #pulsarCampaign .instafooter .sticky .vlp-next-steps { width: 95.625%; max-width: 960px; margin: 0 auto; padding: 10px 0; } #pulsarCampaign .instafooter h2, #pulsarCampaign .instafooter strong { font-size: 13px; color: white; text-transform: uppercase; } #pulsarCampaign .instafooter strong { margin-right: 4px; } #pulsarCampaign .instafooter h2 { margin: 0; padding: 0; margin-bottom: 4px; border-bottom: none; } #pulsarCampaign .instafooter h3 { display: none; } #pulsarCampaign .instafooter .schedule li { display: none; } #pulsarCampaign .instafooter .schedule li:first-child { display: inline-block; } #pulsarCampaign .instafooter .schedule .viewAll { display: block; position: absolute; right: 0; top: 10px; right: 10px; } #pulsarCampaign .instafooter .schedule .viewAll .button { margin: 0; background: #666666; background-image: none; filter: none; } #pulsarCampaign .photo { text-align: center; opacity: 1; -webkit-transition: opacity 400ms ease-in-out; -moz-transition: opacity 400ms ease-in-out; -ms-transition: opacity 400ms ease-in-out; transition: opacity 400ms ease-in-out; position: relative; width: 306px; height: 306px; margin: 0 auto 20px; } #pulsarCampaign .photo .ribbon { position: absolute; width: 97px; height: 101px; top: -13px; left: 15px; } #pulsarCampaign .photo img { display: block; } #pulsarCampaign .photo.blank { opacity: 0; } #pulsarCampaign .photo .media-bar { position: absolute; background: #343434; background: rgba(52, 52, 52, 0.95); height: 42px; width: 100%; bottom: 0; left: 0; overflow: hidden; color: white; font-size: 11px; } #pulsarCampaign .photo .media-bar li { float: left; height: 42px; } #pulsarCampaign .photo .user { width: 179px; text-align: left; padding-left: 20px; padding-top: 10px; display: block; border-top: 1px solid #1c1d1e; } #pulsarCampaign .photo .likes { width: 52px; border: 1px solid #1c1d1e; border-bottom: none; } #pulsarCampaign .photo .likes i { display: block; background: url("../images/campaigns/pulsar/instaicons.png") no-repeat 0 -51px; width: 18px; height: 16px; margin-left: 18px; margin-top: 4px; } #pulsarCampaign .photo .comments { width: 52px; border-top: 1px solid #1c1d1e; border-right: none; } #pulsarCampaign .photo .comments i { display: block; background: url("../images/campaigns/pulsar/instaicons.png") no-repeat -18px -51px; width: 18px; height: 16px; margin-left: 18px; margin-top: 4px; } /* Overlay */ .pulsarOverlay { position: fixed; background-color: white; background-color: rgba(255, 255, 255, 0.9); width: 100%; height: 100%; top: 0; left: 0; z-index: 500; display: none; overflow-y: hidden; opacity: 0; } .pulsarOverlay.active { display: block; -webkit-transition: opacity 800ms ease-in-out; -moz-transition: opacity 800ms ease-in-out; -ms-transition: opacity 800ms ease-in-out; transition: opacity 800ms ease-in-out; } .pulsarOverlay.active .overlayContent { opacity: 1; } .pulsarOverlay.active.fade { opacity: 1; } .pulsarOverlay p { font-size: 14px; line-height: 1.5em; } .pulsarOverlay h2, .pulsarOverlay h3 { color: #c71444; text-transform: uppercase; font-size: 16px; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; padding: 0; line-height: 1.2em; } .pulsarOverlay h3 { color: black; } .pulsarOverlay .overlayContent { opacity: 0; width: 90%; margin: 5% auto 0; max-width: 800px; background-color: white; -webkit-box-shadow: 11px 11px 30px rgba(0, 0, 0, 0.18); -moz-box-shadow: 11px 11px 30px rgba(0, 0, 0, 0.18); box-shadow: 11px 11px 30px rgba(0, 0, 0, 0.18); -webkit-transition: opacity 300ms ease-in-out; -moz-transition: opacity 300ms ease-in-out; -ms-transition: opacity 300ms ease-in-out; transition: opacity 300ms ease-in-out; } .pulsarOverlay header { background-color: #4c4c4c; position: relative; } .pulsarOverlay header h1 { color: white; font-size: 20px; line-height: 40px; text-align: center; } .pulsarOverlay header .overlayClose { position: absolute; right: 10px; top: 12px; text-indent: -9999999px; width: 16px; height: 16px; background: url("../images/campaigns/pulsar/instaicons.png") no-repeat 0 -69px; } .pulsarOverlay .overlayBlock { border: 1px solid #c1c1c1; border-top: none; } .pulsarOverlay .overlayBlock img { width: 100%; height: auto; } .pulsarOverlay .overlayBlock div { word-wrap: break-word; padding: 20px 20px 15px; } .pulsarOverlay .overlayTextBlock { padding: 20px; background-color: #eeeeee; } .pulsarOverlay .overlayTextBlock h2 { color: black; font-size: 14px; } .pulsarOverlay .ribbonPlaceholder { display: none; } /* VLP */ .button.twoLines, .button.twoLines + button.twoLines { display: block; margin: 10px 0; } .button.twoLines { font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; position: relative; height: 47px; } .button.twoLines a { height: auto; font-size: 21px; font-size: 2.1rem; line-height: 21px; line-height: 2.1rem; padding: 10px 60px 10px 20px; position: relative; z-index: 1; } .button.twoLines span, .button.twoLines small { display: block; font-family: "NissanAGMediumRegular", Verdana, Geneva, sans-serif; font-size: 14px; font-size: 1.4rem; line-height: 14px; line-height: 1.4rem; } .button.twoLines a:after { content: "\2192"; font-family: "icons"; position: absolute; right: 13px; top: 0; color: white; line-height: 47px; font-size: 28px; z-index: 3; } .buttons-get-brochures { height: 47px; overflow: hidden; } .buttons-get-brochures .reveal { position: relative; z-index: 2; min-width: 167px; -webkit-transition: left ease-in-out 300ms; -moz-transition: left ease-in-out 300ms; -ms-transition: left ease-in-out 300ms; transition: left ease-in-out 300ms; } .buttons-get-brochures .options { height: 47px; width: 280px; position: relative; top: -47px; z-index: 1; background-color: #c71444; -webkit-transition: width ease-in-out 300ms; -moz-transition: width ease-in-out 300ms; -ms-transition: width ease-in-out 300ms; transition: width ease-in-out 300ms; -moz-opacity: 0; -webkit-opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=0); opacity: 0; } .buttons-get-brochures .options li { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; float: left; width: 130px; border-right: 1px solid white; } .buttons-get-brochures .options li.close { width: 20px; } .buttons-get-brochures .options li.close a { line-height: 47px; font-size: 10px; } .buttons-get-brochures .options .button { float: none; margin:-10px 0 0 0;; display: block; height: 47px; width: 100%; text-align: left; position: relative; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; } .buttons-get-brochures .options .button a { margin: 0 5px; padding: 0 5px; height: 47px; line-height: 13px; white-space: nowrap; font-size: 14px; padding: 10px 60px 10px 10px; } .buttons-get-brochures .options .button a small, .buttons-get-brochures .options .button a span { display: block; font-family: "NissanAGMediumRegular", Verdana, Geneva, sans-serif; font-size: 11px; } .buttons-get-brochures .options .button:after { content: "\2192"; font-family: "icons"; position: absolute; right: 9px; top: 0; color: white; line-height: 47px; font-size: 18px; z-index: 0; pointer-events: none; } .buttons-get-brochures .options li.close .button { text-align: center; } .buttons-get-brochures .options li.close .button a { padding: 0; } .buttons-get-brochures .options li.close .button:after { display: none; } #main .vlp-dl #dealer-locator legend { padding-top: 10px; } #vlp-versions { position: relative; margin-top: 20px; margin-bottom: 15px; /* .button.twoLines { margin: 18px 0 10px 0; }*/ } #vlp-versions .version-panels { width: 100%; margin-bottom: 25px; } #vlp-versions .collapsible { height: 0; overflow: hidden; margin: 0 20px; -webkit-transition: height 500ms ease-in-out; -moz-transition: height 500ms ease-in-out; -ms-transition: height 500ms ease-in-out; transition: height 500ms ease-in-out; } #vlp-versions .collapsible.expanded { padding-bottom: 15px; } #vlp-versions .expanded { height: auto; } #vlp-versions header { /* .available{ color: $NissanRed; @include font-size(15); @include line-height(45); cursor: pointer; &:after { color: $NissanGrey5; @include icon-down(); font-family: $iconFont; margin-left: 6px; position: relative; top: 1px; float: right; @include font-size(28); font-weight: normal; float:right; } &.expanded { color: $NissanRed; &:after { @include icon-up(); color: $NissanRed; } } } */ } #vlp-versions header h2 { padding-bottom: 0; margin-bottom: 0; border-bottom: none; } #vlp-versions header .price-range { font-size: 20px; font-size: 2rem; line-height: 20px; line-height: 2rem; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; } #vlp-versions header .available { background-color: white; cursor: pointer; text-transform: uppercase; border-top: 1px solid #c1c1c1; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; padding-left: 20px; font-size: 14px; font-size: 1.4rem; line-height: 45px; line-height: 4.5rem; } #vlp-versions header .available:after { color: #c1c1c1; content: "\2193"; font-family: "icons"; margin-left: 6px; position: relative; top: 1px; float: right; padding-right: 20px; font-size: 14px; font-size: 1.4rem; font-weight: normal; float: right; } #vlp-versions header .available.expanded { border-bottom: none; } #vlp-versions header .available.expanded:after { color: #c71444; content: "\2191"; } #vlp-versions header .links { display: none; } #vlp-versions .links { font-size: 15px; font-size: 1.5rem; line-height: 15px; line-height: 1.5rem; margin-top: 15px; margin-bottom: 25px; } #vlp-versions .links a { display: block; color: black; font-family: "NissanAGMediumRegular", Verdana, Geneva, sans-serif; text-transform: uppercase; padding-left: 30px; padding-top: 5px; height: 18px; margin-bottom: 5px; background: url("../images/vlp/versions-icons.png") no-repeat 0 0; } #vlp-versions .links a:hover { color: #c71444; } #vlp-versions .links a.finance-link { margin-bottom: 10px; } #vlp-versions .links a.tech-link { background-position: 0 -29px; } #vlp-versions .version-item { background-color: #eeeeee; padding: 20px; margin-bottom: 10px; } #vlp-versions .version-item .title { text-transform: uppercase; overflow: hidden; padding-bottom: 7px; color: #343434; } #vlp-versions .version-item .title strong { font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; font-size: 40px; font-size: 4rem; line-height: 35px; line-height: 3.5rem; letter-spacing: -1px; float: left; clear: left; font-weight: normal; } #vlp-versions .version-item .title small { font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; font-size: 13px; font-size: 1.3rem; line-height: 13px; line-height: 1.3rem; letter-spacing: -1px; float: left; padding-left: 5px; padding-top: 2px; } #vlp-versions .version-item .title small span { display: block; } #vlp-versions .version-item .title .price { color: #c71444; font-size: 30px; font-size: 3rem; line-height: 30px; line-height: 3rem; letter-spacing: -1px; font-weight: normal; } #vlp-versions .version-item .stats { padding: 12px 0; border-top: 1px dashed #c1c1c1; overflow: hidden; text-transform: uppercase; font-size: 15px; font-size: 1.5rem; line-height: 18px; line-height: 1.8rem; } #vlp-versions .version-item .stats b { color: #343434; } #vlp-versions .version-item .stats li { float: left; width: 50%; } #vlp-versions .version-item .stats li:nth-child(odd) { clear: left; } #vlp-versions .version-item .blocklist { border-top: 1px dashed #c1c1c1; padding: 12px 0 0; font-size: 15px; font-size: 1.5rem; } #vlp-versions .version-item .blocklist ul { list-style-type: square; color: #c71444; padding-left: 15px; } #vlp-versions .version-item .blocklist li span { color: black; } #vlp-versions .version-item .view-version.expanded { display: none; } #vlp-versions .dottedDivider { height: 0; border-bottom: 1px dashed #c1c1c1; margin: 0 10px; } #vlp-versions .bullet-pagination, #vlp-versions .next, #vlp-versions .prev { display: none; } .vlp-features { margin-bottom: 15px; position: static; } #main .vlp-features header h2 { border-bottom: none; } .vlp-features .gallery-container { position: relative; border-bottom: 1px dashed #c1c1c1; margin: 0; overflow: hidden; } .vlp-features .gallery-container .gallery .panel img { width: 100%; height: auto; display: block; } .vlp-features .gallery-container .gallery .galleryVideo { background-color: black; position: relative; cursor: pointer; } .vlp-features .gallery-container .gallery .galleryVideo img { -webkit-transition: opacity 500ms ease-in-out; -moz-transition: opacity 500ms ease-in-out; -ms-transition: opacity 500ms ease-in-out; transition: opacity 500ms ease-in-out; } .vlp-features .gallery-container .gallery .galleryVideo .videoContainer, .vlp-features .gallery-container .gallery .galleryVideo span { height: 100%; } .vlp-features .gallery-container .gallery .galleryVideo:before { background: url("../images/vlp/gallery-play.png") no-repeat center center; content: ""; position: absolute; width: 95px; height: 95px; top: 50%; left: 50%; margin-left: -47px; margin-top: -47px; opacity: 1; } .vlp-features .gallery-container .gallery .galleryVideo.playing:before { -moz-opacity: 0; -webkit-opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=0); opacity: 0; pointer-events: none; } .vlp-features .gallery-container .bullet-pagination { display: block; top: 0; opacity: 1; height: 35px; overflow: hidden; } .vlp-features .gallery-container .bullet-pagination li { padding: 5px 1px; } .vlp-features .collapsible { height: auto; overflow: hidden; -webkit-transition: height 500ms ease-in-out; -moz-transition: height 500ms ease-in-out; -ms-transition: height 500ms ease-in-out; transition: height 500ms ease-in-out; } .vlp-features .collapsible.expanded { height: auto; } .vlp-features .expand-section { color: #c71444; font-size: 15px; font-size: 1.5rem; line-height: 45px; line-height: 4.5rem; cursor: pointer; display: block; height: 37px; overflow: hidden; background-color: #ffffff; margin: 0 10px; display: none; -webkit-transition: height 500ms ease-in-out; -moz-transition: height 500ms ease-in-out; -ms-transition: height 500ms ease-in-out; transition: height 500ms ease-in-out; } .vlp-features .expand-section:after { color: #c1c1c1; content: "\2193"; font-family: "icons"; margin-left: 6px; position: relative; top: 1px; float: right; font-size: 28px; font-size: 2.8rem; font-weight: normal; float: right; } .vlp-features .expand-section.expanded { height: 0; border-bottom: none; } .vlp-features header h2 { padding-bottom: 0; margin-bottom: 0; border-bottom: none; } .vlp-features header h2.expanded { cursor: pointer; } .vlp-features header h2.expanded:before { color: #c71444; content: "\2191"; font-family: "icons"; margin-left: 6px; position: relative; top: 1px; float: right; font-size: 28px; font-size: 2.8rem; font-weight: normal; float: right; } .vlp-features header .links { display: none; } .vlp-features .feature-panels { position: relative; } .vlp-features .feature-panels-container { margin-bottom: 25px; } .vlp-features .feature-item a { color: #666666; } .vlp-features .feature-item .collapsible { background-color: #eeeeee; height: 0; } .vlp-features .feature-item .collapsible > img { width: 100%; height: auto; } .vlp-features .feature-item .collapsible:after { content: ""; display: block; height: 30px; background-color: white; } .vlp-features .feature-item .collapsible.expanded { height: auto; } .vlp-features .feature-item .feature-item-title { background-color: white; cursor: pointer; text-transform: uppercase; border-top: 1px solid #c1c1c1; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; padding-left: 20px; font-size: 14px; font-size: 1.4rem; line-height: 45px; line-height: 4.5rem; } .vlp-features .feature-item .feature-item-title:after { color: #c1c1c1; content: "\2193"; font-family: "icons"; margin-left: 6px; position: relative; top: 1px; float: right; padding-right: 20px; font-size: 14px; font-size: 1.4rem; font-weight: normal; float: right; } .vlp-features .feature-item .feature-item-title.expanded { border-bottom: none; } .vlp-features .feature-item .feature-item-title.expanded:after { color: #c71444; content: "\2191"; } .vlp-features .feature-item .feature-text { padding: 10px; font-size: 16px; font-size: 1.6rem; line-height: 22px; line-height: 2.2rem; } .vlp-features .feature-item .feature-text strong { font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; text-transform: uppercase; font-size: 24px; font-size: 2.4rem; line-height: 24px; line-height: 2.4rem; display: block; font-weight: normal; color: #343434; } .vlp-features .feature-item .feature-text p { margin-top: 5px; } .vlp-features .feature-item .link { color: #c71444; } .vlp-features .feature-item:first-child .feature-item-title { border-top: none; } .vlp-features .feature-item:last-child { border-bottom: 1px solid #c1c1c1; } .vlp-features .button.twoLines, .vlp-features .buttons-get-brochures { margin: 0 20px 10px 20px; } .vlp-features .button.twoLines .reveal, .vlp-features .buttons-get-brochures .reveal { margin-left: 0; margin-right: 0; } .vlp-features .bullet-pagination, .vlp-features .next, .vlp-features .prev { display: none; } .vlp-features .dottedDivider { height: 0; padding-bottom: 25px; border-bottom: 1px dashed #c1c1c1; margin: 0 10px; } .touch #main .vlp-features .next, .touch #main .vlp-features .prev { display: none; } .no-touch.csstransitions #main .vlp-features .gallery-container .gallery .galleryVideo:before { background-size: 100%; -webkit-transition: all 300ms; -moz-transition: all 300ms; -ms-transition: all 300ms; transition: all 300ms; } .no-touch.csstransitions #main .vlp-features .gallery-container .gallery .galleryVideo:hover:before { width: 110px; height: 110px; margin-left: -55px; margin-top: -55px; } .vlp-overlay { position: fixed; width: 100%; height: 100%; top: -100%; overflow: hidden; background-color: rgba(0, 0, 0, 0.8); z-index: 110; display: none; -webkit-transition: top 800ms ease-in-out; -moz-transition: top 800ms ease-in-out; -ms-transition: top 800ms ease-in-out; transition: top 800ms ease-in-out; } .vlp-overlay strong { font-weight: normal; } .vlp-overlay section > header { background-color: #4c4c4c; height: 20px; padding-top: 20px; padding-bottom: 20px; color: white; top: 0; left: 0; width: 100%; z-index: 30; } .vlp-overlay section > header .headerTextFont, .vlp-overlay section > header h2, .vlp-overlay section > header ul li.active { font-size: 15px; font-size: 1.5rem; line-height: 20px; line-height: 2rem; padding: 0 10px; margin: 0 5px; } .vlp-overlay section > header h2 { line-height: 22px; } .vlp-overlay section > header ul { text-align: center; display: block; height: 37px; margin-top: -37px; margin-left: 22px; margin-right: 22px; vertical-align: top; line-height: 35px; -webkit-transition: opacity 300ms ease-in-out; -moz-transition: opacity 300ms ease-in-out; -ms-transition: opacity 300ms ease-in-out; transition: opacity 300ms ease-in-out; } .vlp-overlay section > header ul li { display: none; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; text-transform: uppercase; } .vlp-overlay section > header ul li a { color: #c1c1c1; } .vlp-overlay section > header ul li.active, .vlp-overlay section > header ul li.nextFeature, .vlp-overlay section > header ul li.prevFeature { display: inline-block; } .vlp-overlay section > header ul li.prevFeature, .vlp-overlay section > header ul li.nextFeature { position: relative; cursor: pointer; } .vlp-overlay section > header ul li.prevFeature a, .vlp-overlay section > header ul li.nextFeature a { height: 20px; -moz-opacity: 0; -webkit-opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=0); opacity: 0; width: 100%; display: inline-block; } .vlp-overlay section > header ul li.prevFeature.hidden, .vlp-overlay section > header ul li.nextFeature.hidden { display: none; } .vlp-overlay section > header ul li.prevFeature:hover, .vlp-overlay section > header ul li.nextFeature:hover { color: #A9113A; } .vlp-overlay section > header ul li.prevFeature:before { content: "\2190"; font-family: 'icons'; font-style: normal; speak: none; font-weight: normal; -webkit-font-smoothing: antialiased; text-indent: 0; position: absolute; right: 0; top: 0; } .vlp-overlay section > header ul li.nextFeature:before { content: "\2192"; font-family: 'icons'; font-style: normal; speak: none; font-weight: normal; -webkit-font-smoothing: antialiased; text-indent: 0; position: absolute; left: 0; top: 0; } .vlp-overlay section > header ul li.nextFeature, .vlp-overlay section > header ul li.prevFeature { width: 20px; text-indent: -9998px; } .vlp-overlay section > header ul li.active { padding: 0; } .vlp-overlay section > header ul li.active a { color: white; } .vlp-overlay section > header ul li.hidden { overflow: visible; } .vlp-overlay section > header .overlay-close { float: right; width: 20px; height: 20px; line-height: 25px; color: white; overflow: hidden; } .vlp-overlay section > header .overlay-close:hover { color: #A9113A; } .vlp-overlay .overlay-loading { background: url("../images/loading.gif") no-repeat center center; width: 60px; height: 60px; position: absolute; top: 50%; left: 50%; margin-top: -30px; margin-right: -30px; margin-left: -30px; } .vlp-features-overlay { width: 100%; height: 100%; overflow: hidden; background-color: white; } .vlp-features-overlay > header { position: absolute; top: 0; left: 0; } .vlp-features-overlay .overlay-content { height: 100%; overflow-x: auto; margin-top: 60px; } .vlp-features-overlay .headline-image img, .vlp-features-overlay .article-image img { width: 100%; height: auto; display: block; } .vlp-features-overlay .article-container .headline-image { font-size: 13px; font-size: 1.3rem; } .vlp-features-overlay .article-container header { border-top: 16px solid #c71444; text-transform: uppercase; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; letter-spacing: -1px; padding-top: 20px; padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px #999999 dotted; } .vlp-features-overlay .article-container header small { font-size: 18px; font-size: 1.8rem; line-height: 18px; line-height: 1.8rem; color: #c71444; display: block; } .vlp-features-overlay .article-container header h1 { font-size: 28px; font-size: 2.8rem; line-height: 25px; line-height: 2.5rem; color: #343434; width: 50%; } .vlp-features-overlay article p.intro { font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; color: #4c4c4c; font-size: 16px; font-size: 1.6rem; line-height: 20px; line-height: 2rem; } .vlp-features-overlay article p { font-size: 14px; font-size: 1.4rem; line-height: 20px; line-height: 2rem; margin-top: 20px; margin-bottom: 20px; color: #666666; } .vlp-features-overlay .sidebars-w > ul { display: none; } .vlp-features-overlay .sidebar { max-height: 100%; width: 100%; } .vlp-features-overlay .sidebar.firstItem { bottom: 37px; } .vlp-features-overlay .sidebar.firstItem .side-feature-item-title.expanded { margin-top: 97px; } .vlp-features-overlay .sidebar header { display: none; } .vlp-features-overlay .sidebar .side-features { background-color: white; } .vlp-features-overlay .sidebar .side-feature-item-title { cursor: pointer; text-transform: uppercase; border-top: 1px solid #c1c1c1; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; padding-left: 20px; font-size: 14px; font-size: 1.4rem; line-height: 45px; line-height: 4.5rem; } .vlp-features-overlay .sidebar .side-feature-item-title:after { color: #c1c1c1; content: "\2193"; font-family: "icons"; margin-left: 6px; position: relative; top: 1px; float: right; padding-right: 20px; font-size: 14px; font-size: 1.4rem; font-weight: normal; float: right; } .vlp-features-overlay .sidebar .side-feature-item-title.expanded { border-bottom: none; } .vlp-features-overlay .sidebar .side-feature-item-title.expanded:after { color: #c71444; content: "\2191"; } .vlp-features-overlay .sidebar .side-feature-item-title:last-child { border-bottom: 1px solid #c1c1c1; } .vlp-features-overlay .sidebar .collapsible { height: 0; overflow: hidden; -webkit-transition: height 500ms ease-in-out; -moz-transition: height 500ms ease-in-out; -ms-transition: height 500ms ease-in-out; transition: height 500ms ease-in-out; } .vlp-features-overlay .sidebar .expanded { height: auto; } .vlp-features-overlay .sidebar .item img { display: block; width: 100%; height: auto; margin-bottom: 15px; } .vlp-features-overlay .sidebar .item strong, .vlp-features-overlay .sidebar .item p { display: block; } .vlp-features-overlay .sidebar .item strong { font-size: 18px; font-size: 1.8rem; line-height: 20px; line-height: 2rem; color: #343434; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; text-transform: uppercase; } .vlp-features-overlay .sidebar .item strong b { display: block; color: #8a8a8a; } .vlp-features-overlay .sidebar .item p { font-size: 16px; font-size: 1.6rem; line-height: 20px; line-height: 2rem; color: #8a8a8a; margin-top: 5px; padding-bottom: 20px; } .vlp-features-overlay .vlp-social { width: 22px; height: 22px; margin-left: 10px; background-color: #4c4c4c; } .vlp-features-overlay .vlp-social.open { z-index: 2; } .vlp-features-overlay .vlp-social .share-toggle, .vlp-features-overlay .vlp-social .sn a { width: 22px; height: 22px; margin: 0; } .vlp-features-overlay .vlp-social .share-toggle { font-size: 14px; line-height: 22px; } html.android .vlp-overlay { position: absolute; } #vlp-hero { position: relative; margin-top: 10px; } #vlp-hero header { margin-right: 15px; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; text-transform: uppercase; position: relative; z-index: 2; } #vlp-hero header .tout { font-size: 18px; font-size: 1.8rem; line-height: 18px; line-height: 1.8rem; font-weight: normal; color: #999999; display: block; letter-spacing: -1px; } #vlp-hero header h2 { font-size: 31px; line-height: 28px; font-weight: normal; letter-spacing: -2px; width: 100%; color: black; border: none; margin: 0; padding: 0; display: block; } #vlp-hero header h2.max, #vlp-hero header h2.normal { font-size: 31px; line-height: 24px; font-weight: normal; letter-spacing: -2px; width: 100%; color: black; border: none; margin: 0; padding: 0; display: block; } #vlp-hero header .price { font-size: 38px; font-size: 3.8rem; line-height: 30px; line-height: 3rem; color: #c71444; letter-spacing: -1px; margin-top: -8px; } #vlp-hero header .price.max, #vlp-hero header .price { font-size: 20px; font-size: 2rem; line-height: 16px; line-height: 1.6rem; color: #c71444; letter-spacing: -1px; margin-top: 1px; } #vlp-hero header .starting-price { font-size: 16px; font-size: 1.6rem; line-height: 13px; line-height: 1.3rem; color: #343434; margin-left: 5px; margin-top: -2px; letter-spacing: -1px; } #vlp-hero header .starting-price.max, #vlp-hero header .starting-price.normal { font-size: 16px; font-size: 1.6rem; line-height: 14px; line-height: 1.4rem; color: #343434; margin-left: 5px; margin-top: 2px; letter-spacing: -1px; } #vlp-hero header .starting-price span { display: block; } #vlp-hero .hero-image-container { background: url("../images/vlp/hero-stage-m.jpg") no-repeat center 70%; background-size: 100% 68px; } #vlp-hero .hero-image-container .hero-image img { width: 100%; -webkit-transition: opacity 500ms ease-in-out; -moz-transition: opacity 500ms ease-in-out; -ms-transition: opacity 500ms ease-in-out; transition: opacity 500ms ease-in-out; height: auto; } #vlp-hero #colour-palette-container { overflow: hidden; } #vlp-hero .colour-palette { white-space: nowrap; width: 100%; } #vlp-hero .colour-picker { clear: both; position: relative; } #vlp-hero .colour-picker strong { text-transform: uppercase; font-family: "NissanAGMediumRegular", Verdana, Geneva, sans-serif; font-weight: normal; display: block; font-size: 16px; font-size: 1.6rem; line-height: 20px; line-height: 2rem; color: #8a8a8a; margin-bottom: 15px; } #vlp-hero .colour-picker strong.hidden-small { display: none; } #vlp-hero .colour-picker li { display: inline-block; margin: 0; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; padding: 7px; } #vlp-hero .colour-picker li:first-child { margin-left: 20px; } #vlp-hero .colour-picker li:last-child { margin-right: 20px; } #vlp-hero .colour-picker li * { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } #vlp-hero .colour-picker li.active { border: 3px solid #c1c1c1; padding: 4px; } #vlp-hero .colour-picker li p { margin: 0; padding: 0; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; display: block; width: 38px; height: 38px; -webkit-box-shadow: inset 0 1px 1px 1px rgba(0, 0, 0, 0.4); -moz-box-shadow: inset 0 1px 1px 1px rgba(0, 0, 0, 0.4); box-shadow: inset 0 1px 1px 1px rgba(0, 0, 0, 0.4); cursor: pointer; } #vlp-hero .colour-picker li span { -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; /* IE9 SVG, needs conditional override of 'filter' to 'none' */ background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, black 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(255, 255, 255, 0)), color-stop(100%, black)); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, black 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(255, 255, 255, 0) 0%, black 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(255, 255, 255, 0) 0%, black 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, black 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#000000',GradientType=0 ); /* IE6-8 */ -moz-opacity: 0.4; -webkit-opacity: 0.4; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=40); opacity: 0.4; display: block; width: 38px; height: 38px; text-indent: -9998px; } #vlp-hero .colour-picker .next, #vlp-hero .colour-picker .prev, #vlp-hero .colour-picker .up, #vlp-hero .colour-picker .down { font-size: 16px; font-size: 1.6rem; -moz-opacity: 1; -webkit-opacity: 1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=100); opacity: 1; -webkit-transition: opacity 300ms ease-in-out; -moz-transition: opacity 300ms ease-in-out; -ms-transition: opacity 300ms ease-in-out; transition: opacity 300ms ease-in-out; display: block; position: absolute; color: #c1c1c1; text-align: center; } #vlp-hero .colour-picker .next span, #vlp-hero .colour-picker .prev span, #vlp-hero .colour-picker .up span, #vlp-hero .colour-picker .down span { display: block; cursor: pointer; background: #eeeeee; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; } #vlp-hero .colour-picker .prev, #vlp-hero .colour-picker .next { line-height: 70px; line-height: 7rem; height: 54px; top: 31px; width: 16px; } #vlp-hero .colour-picker .next { right: 0; } #vlp-hero .colour-picker .prev { left: 0; } #vlp-hero .colour-picker .up, #vlp-hero .colour-picker .down { display: none; } #vlp-hero .stats { clear: both; color: #8a8a8a; text-transform: uppercase; padding-top: 20px; margin-top: 20px; margin-bottom: 20px; margin-right: 10px; border-top: 1px dashed #8a8a8a; } #vlp-hero .stats ul { width: 280px; margin: 0 auto; } #vlp-hero .stats li { float: left; padding: 0; border-right: 1px dashed #8a8a8a; padding-left: 30px; height: 60px; width: 57px; margin-bottom: 10px; position: relative; margin-right: 8px; } #vlp-hero .stats li:last-child, #vlp-hero .stats li:nth-child(3n+3) { padding-right: 0; border-right: none; clear: right; margin-right: 0; } #vlp-hero .stats li i { position: absolute; left: 0; } #vlp-hero .stats .small { font-family: "NissanAGMediumRegular", Verdana, Geneva, sans-serif; font-size: 16px; font-size: 1.6rem; line-height: 16px; line-height: 1.6rem; display: block; } #vlp-hero .stats .medium { font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; font-size: 13px; line-height: 13px; display: block; } #vlp-hero .stats .large { font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; font-size: 24px; line-height: 25px; letter-spacing: -1px; display: block; } #vlp-hero .buttons-get-brochures, #vlp-hero .button.twoLines { display: none; } #vlp-hero .vlp-social { position: relative; z-index:1001; left: 20px; } #vlp-hero .vlp-social .share-toggle { background-color: #c71444; color: white; } #vlp-hero .vlp-social .share-toggle:hover { background-color: #A9113A; } #vlp-hero .stats li.emissions .medium { font-size: 10px; } #vlp-hero .dottedDivider { height: 0; padding-bottom: 25px; border-bottom: 1px dashed #c1c1c1; margin: 0 10px; } #vlp-hero .colour-anim-placeholder { position: absolute; height: 0; opacity: 0; overflow: hidden; -webkit-transition: opacity 300ms ease-in-out; -moz-transition: opacity 300ms ease-in-out; -ms-transition: opacity 300ms ease-in-out; transition: opacity 300ms ease-in-out; } #vlp-hero .colour-anim-placeholder img { width: 100%; height: auto; } .touch #vlp-hero .colour-picker .next, .touch #vlp-hero .colour-picker .prev, .touch #vlp-hero .colour-picker .up, .touch #vlp-hero .colour-picker .down { display: none; } #vlp-hero .stats.icons i { background-image: url("../images/vlp/stats-icons.png"); background-repeat: no-repeat; display: block; width: 26px; height: 26px; } #vlp-hero .stats.icons .bhp i { background-position: -5px -5px; } #vlp-hero .stats.icons .mpg i { background-position: -113px -5px; } #vlp-hero .stats.icons .zeroToSixty i { background-position: -77px -5px; } #vlp-hero .stats.icons .topSpeed i { background-position: -5px -41px; } #vlp-hero .stats.icons .torque i { background-position: -5px -113px; } #vlp-hero .stats.icons .roadTax i { background-position: -41px -41px; } #vlp-hero .stats.icons .emissions i { background-position: -5px -77px; } #vlp-hero .stats.icons .drive i { background-position: -41px -5px; } #vlp-hero .stats.icons .engineSize i { background-position: -77px -77px; } #vlp-hero .stats.icons .bootCapacity i { background-position: -113px -77px; } #vlp-hero .stats.icons .noOfSeats i { background-position: -77px -41px; } #vlp-hero .stats.icons .awards i { background-position: -41px -113px; } /* retina */ @media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2) { #vlp-hero .stats.icons i { background-image: url("../images/vlp/stats-icons%402x.png"); background-repeat: no-repeat; background-size: 124px; } #vlp-hero .stats.icons .bhp i { background-position: -2px -2px; } #vlp-hero .stats.icons .mpg i { background-position: -95px -2px; } #vlp-hero .stats.icons .zeroToSixty i { background-position: -64px -2px; } #vlp-hero .stats.icons .topSpeed i { background-position: -2px -33px; } #vlp-hero .stats.icons .torque i { background-position: -2px -95px; } #vlp-hero .stats.icons .roadTax i { background-position: -33px -33px; } #vlp-hero .stats.icons .emissions i { background-position: -2px -64px; } #vlp-hero .stats.icons .drive i { background-position: -33px -2px; } #vlp-hero .stats.icons .engineSize i { background-position: -64px -64px; } #vlp-hero .stats.icons .bootCapacity i { background-position: -95px -64px; } #vlp-hero .stats.icons .noOfSeats i { background-position: -64px -33px; } #vlp-hero .stats.icons .awards i { background-position: -33px -95px; } } /* Quick Fix remove stat icons for mobile as */ #vlp-hero .stats.icons i { display: none; } #vlp-hero .stats.icons ul { width: auto; height: auto; } #vlp-hero .stats.icons li { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; width: 33.33%; margin-bottom: 0; margin-right: 0; padding: 0 8px; height: auto; } .no-touch #vlp-hero .colour-picker li span:hover { -moz-opacity: 0.1; -webkit-opacity: 0.1; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=10); opacity: 0.1; } .vlp-nav .drawer { padding: 20px; display: block; clear: both; } .vlp-nav .drawer ul, .vlp-nav .drawer .selector { display: none; } .vlp-nav .top-title { display: none; overflow: hidden; } .vlp-nav.open .top-title { border-bottom: 1px solid #c1c1c1; } .vlp-nav .btn-sub-nav { background: none; } .vlp-nav .btn-sub-nav .icon-bar { background: white; } .vlp-nav .skipLink, .vlp-nav .model, .vlp-nav li { font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; font-size: 15px; font-size: 1.5rem; text-transform: uppercase; } .vlp-nav .skipLink, .vlp-nav .model { height: 50px; line-height: 50px; padding: 0 20px; color: white; } .vlp-nav .skipLink { float: right; border-left: 1px solid #c1c1c1; } .vlp-nav .model { width: 70%; float: left; } .vlp-nav li { padding: 5px 0; } .vlp-nav li a { color: #8a8a8a; } .vlp-nav li a:hover { color: white; } .vlp-nav li.selected a { color: white; } .vlp-nav li.up { display: none; } .vlp-nav .button, .vlp-nav div.button + div.button { display: block; margin: 10px 0; } .vlp-nav div.button { position: relative; height: 47px; } .vlp-nav div.button a { height: auto; font-size: 21px; font-size: 2.1rem; line-height: 21px; line-height: 2.1rem; padding: 10px 0 10px 20px; } .vlp-nav div.button span { display: block; font-size: 14px; font-size: 1.4rem; line-height: 14px; line-height: 1.4rem; } .vlp-nav .ctas { border-top: 1px dotted white; padding-top: 10px; margin-top: 10px; } .vlp-nav div.button:after { content: "\2192"; font-family: "icons"; position: absolute; right: 13px; top: 0; color: white; line-height: 47px; font-size: 28px; } .vlp-social { overflow: hidden; width: 44px; height: 44px; position: relative; -webkit-transition: width 0.5s; -moz-transition: width 0.5s; -ms-transition: width 0.5s; transition: width 0.5s; display: inline-block; } .vlp-social .share-toggle { background: white; color: #4c4c4c; text-align: center; font-size: 24px; line-height: 44px; height: 44px; width: 44px; display: block; position: absolute; top: 0; left: 0; text-align: center; } .vlp-social .share-toggle:hover { background-color: #A9113A; color: white; } .vlp-social .sn { display: inline-block; position: absolute; right: 0; top: 0; z-index: 0; white-space: nowrap; padding-left: 4px; } .vlp-social .sn a { width: 44px; height: 44px; margin-left: -3px; display: inline-block; position: relative; } .vlp-social .sn a:after { content: ""; position: absolute; top: 0; left: 0; display: block; width: 44px; height: 44px; background-color: black; -moz-opacity: 0; -webkit-opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=0); opacity: 0; } .vlp-social .sn a:hover:after { -moz-opacity: 0.2; -webkit-opacity: 0.2; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=20); opacity: 0.2; } .vlp-social .share-facebook { background: url("../images/share/facebook-lrg-alt.jpg") no-repeat; } .vlp-social .share-twitter { background: url("../images/share/twitter-lrg.png") no-repeat; } .vlp-social .share-google { background: url("../images/share/google-lrg-alt.jpg") no-repeat; } .vlp-social .share-youtube { background: url("../images/share/youtube-lrg-alt.jpg") no-repeat; } .vlp-social .share-facebook, .vlp-social .share-twitter, .vlp-social .share-google, .vlp-social .share-youtube { background-size: 100%; text-indent: -9998px; } .vlp-overlay .vlp-finance-overlay { display: none; } .vlp-overlay.finance .vlp-features-overlay { display: none; } .vlp-overlay.finance .vlp-finance-overlay { display: block; } .vlp-finance-calculator { display: none; } .vlp-finance-overlay { width: 100%; height: 100%; overflow: hidden; background-color: white; max-width: 1224px; margin: 0 auto; } .vlp-finance-overlay > header { background-color: #4c4c4c; height: 20px; padding-top: 20px; padding-bottom: 20px; color: white; top: 0; left: 0; width: 100%; z-index: 30; } .vlp-finance-overlay > header h2 { text-align: center; } .vlp-finance-overlay .overlay-close { margin-top: -22px; } .vlp-finance-overlay .content { height: 100%; overflow: auto; } .vlp-finance-overlay .content * { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); -webkit-backface-visibility: hidden; } .vlp-finance-overlay .content .wrapper.grid_12 { float: none; padding-top: 50px; padding-bottom: 50px; max-width: 1024px; margin: 0 auto; } .vlp-finance-overlay h3 { color: #c71444; font-size: 18px; font-size: 1.8rem; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; margin-bottom: 0; } .vlp-finance-overlay label { display: block; color: #666666; font-size: 11px; font-size: 1.1rem; } .vlp-finance-overlay label span { display: block; color: black; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; font-size: 14px; font-size: 1.4rem; } .vlp-finance-overlay .dropDown .overlay { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; padding-right: 30px; } .vlp-finance-overlay .inputContainer input { width: 100%;box-sizing:border-box; } .vlp-finance-overlay .makeYourSelection .wrapper { width: 90.9375%; margin-left: 4.53125%; margin-right: 4.53125%; padding-bottom: 15px; } .vlp-finance-overlay .makeYourSelection .wrapper > div { padding-top: 10px; overflow: hidden; } .vlp-finance-overlay .downpaymentContainer .inputContainer { display: none; } .vlp-finance-overlay .downpaymentContainer .downpaymentToggle li { display: inline; cursor: pointer; text-transform: uppercase; color: #666666; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; padding: 0 12px; background: url("../images/nav/showroom-page-nav-divider.png") no-repeat center right; } .vlp-finance-overlay .downpaymentContainer .downpaymentToggle li:first-child { padding-left: 0; } .vlp-finance-overlay .downpaymentContainer .downpaymentToggle li:last-child { background: none; } .vlp-finance-overlay .downpaymentContainer .downpaymentToggle li.percentage { color: #c71444; } .vlp-finance-overlay .downpaymentContainer .downpaymentToggle fieldset { padding: 0; margin: 10px 0; } .vlp-finance-overlay .downpaymentContainer .downpaymentToggle fieldset.radios { position: relative; overflow: visible; } .vlp-finance-overlay .downpaymentContainer .downpaymentToggle fieldset.radios label { line-height: 24px; cursor: pointer; position: relative; float: left; margin-right: 20px; padding-left: 30px; } .vlp-finance-overlay .downpaymentContainer .downpaymentToggle fieldset.radios label:before { background: #f9f9f9; float: left; position: absolute; top: 0; left: 24px; width: 100%; padding: 0 0 0 6px; text-align: left; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; } .vlp-finance-overlay .downpaymentContainer .downpaymentToggle fieldset.radios label:after { content: " "; display: block; width: 24px; height: 24px; z-index: 76; background: url(../images/icn-radio-m.png) no-repeat 0 0; position: absolute; top: 0; left: 0; } .vlp-finance-overlay .downpaymentContainer .downpaymentToggle fieldset.radios label.checked:after { background-position: -24px 0; } .vlp-finance-overlay .downpaymentContainer .downpaymentToggle fieldset.radios label input { width: 24px; height: 24px; padding: 0; z-index: 77; cursor: pointer; position: absolute; top: 0; left: 0; opacity: 0; } .vlp-finance-overlay .downpaymentContainer .downpaymentToggle input { width: auto; } .vlp-finance-overlay .downpaymentContainer .downpaymentToggle input[type="radio"] { -webkit-appearance: radio; } .vlp-finance-overlay .downpaymentContainer.userDownpaymentActive .inputContainer { display: block; } .vlp-finance-overlay .downpaymentContainer.userDownpaymentActive .dropDown { display: none; } .vlp-finance-overlay input { font-family: Verdana, Geneva, sans-serif; color: #666666; } .vlp-finance-overlay .grid_4 { width: 90.9375%; margin-left: 4.53125%; margin-right: 4.53125%; } .vlp-finance-overlay .result .wrapper { width: 90.9375%; margin-left: 4.53125%; margin-right: 4.53125%; border-top: 2px solid #999999; padding-top: 10px; } .vlp-finance-overlay .result .resultCurrency { font-style: normal; } .vlp-finance-overlay .result .repayments { font-family: Verdana, Geneva, sans-serif; text-transform: uppercase; display: block; margin-bottom: 20px; } .vlp-finance-overlay .result .repayments .repaymentsLabel { display: block; color: #c71444; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; line-height: 1.1em; } .vlp-finance-overlay .result .repayments #resultRepayments { display: block; font-size: 30px; font-size: 3rem; color: #b9b9b9; line-height: 1.5em; } .vlp-finance-overlay .result ul li { display: block; color: #666666; font-size: 11px; font-size: 1.1rem; border-bottom: 1px dotted #c1c1c1; padding: 8px 0; line-height: 1.1em; overflow: hidden; } .vlp-finance-overlay .result ul li strong { float: left; color: black; } .vlp-finance-overlay .result ul li span { float: right; font-family: "NissanAGBoldRegular", Verdana, Geneva, sans-serif; font-size: 14px; font-size: 1.4rem; color: #666666; max-width: 180px; text-align: right; line-height: 1.2em; } .vlp-next-steps { } .vlp-next-steps .button, .vlp-next-steps .button + .button { margin: 10px 0; } .vlp-next-steps .buttons-get-brochures { height: 57px; } .ie .menu { -webkit-transform: none; -moz-transform: none; -ms-transform: none; transform: none; } .ie #logo { width: 151px; } .ie header .grid_12 { position: static; } .ie table { zoom: 1; overflow-x: scroll; } .ie input { line-height: 30px; } .ie hr { background-color: white; color: white; } .ie #home4.vertical .c1 .init { height: 98.5%; } .ie #home4 figcaption { background: transparent; filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#70000000",endColorstr="#70000000"); zoom: 1; } .ie #mainFooter .footerBlocks > .wrapper { margin-top: 0; } .ie .lrg-promo header, .ie .lrg-promo div, .ie .med-promo header, .ie .med-promo div, .ie .small-promo header, .ie .small-promo div { background-color: white; } .ie #hero .panel header, .ie #hero .panel .intro, .ie #hero .panel em, .ie #hero .panel h1, .ie #hero .panel .price, .ie #hero .panel .terms, .ie #hero .panel ul { background-color: transparent; position: relative; } .ie #hero .panel .terms { font-size: 30px; } .ie nav.tabbed { height: auto !important; } .ie #showroomModel #awards .grid_2 { width: 16.35%; } .ie #showroomModel #awards ul li .wrapper { line-height: 1.1em; } .ie .vlp-features .panel > .feature-item:first-child + .feature-item + .feature-item + .feature-item { margin-right: 0; } .ie #navShowroomList li a:after { display: none !important; } .ie #navShowroomList li a i { background: url("../images/global-sprite.png") no-repeat -2px -146px; position: absolute; height: 13px; width: 8px; right: 15px; top: 9px; } .ie #navShowroomList li.selected a:after { display: none !important; } .ie #navShowroomList li.selected a i { background: url("../images/global-sprite.png") no-repeat -2px -98px; position: absolute; height: 33px; width: 12px; right: -11px; top: 0; } .ie-6 #ie-6 { display: block; } .ie-6 #root-wrapper { width: 1024px; margin: 0 auto; } .ie-6 .grid_9 { width: 70%; } .ie-6 .accordion .textButton { display: none; } .ie-6 .accordion .expand { height: auto !important; } .ie-6 .button.primary a, .ie-6 .button.twoLines a { color: #FFF !important; } .ie-6 header { overflow: visible; filter: none !important; filter: progid:DXImageTransform.Microsoft.gradient(startColorStr= #ffffff , endColorStr= #eeeeee ,GradientType=0); background-color: #EEE; height: 83px; border-bottom: 1px solid #C1C1C1; padding: 0; margin: 0; width: 100%; top: 0; left: 0; } .ie-6 header .wrapper { max-width: 1024px; margin: 0 auto; position: relative; z-index: 1; } .ie-6 header nav .positionWrapper ul li ul { display: none; left: 89px !important; width: 900px !important; top: 70px !important; filter: progid:DXImageTransform.Microsoft.gradient(startColorStr= #ffffff,endColorStr= #f0f0f0,GradientType=0); } .ie-6 header nav .positionWrapper ul li ul strong { color: #C71444; font-family: "NissanAGMediumRegular", Verdana; line-height: 1.5em; text-transform: uppercase; font-weight: normal; padding: 14px 28px 0; } .ie-6 header nav .positionWrapper ul li.active ul { display: block; position: absolute; top: 30px; left: -14px; right: auto; z-index: 10; width: 276px; } .ie-6 header nav .positionWrapper ul li.active ul li, .ie-6 header nav .positionWrapper ul li.active ul li.findADealer { background-image: none; width: 276px; height: 232px; } .ie-6 header nav .positionWrapper ul li.active ul li div, .ie-6 header nav .positionWrapper ul li.active ul li.findADealer div { padding: 20px; } .ie-6 header nav .positionWrapper ul li.active ul li p, .ie-6 header nav .positionWrapper ul li.active ul li.findADealer p { margin-top: 0; color: #666666; } .ie-6 .positionWrapper a { position: relative !important; } .ie-6 .positionWrapper a#logo { z-index: 999 !important; position: absolute !important; } .ie-6 ul#navFirstBlock { float: none !important; display: inline !important; } .ie-6 #navFirstBlock li { background: red; display: block; vertical-align: middle; text-transform: uppercase; float: left; font-size: 11px; font-size: 1.1rem; padding: 8px 13px 0 13px; margin: 0; color: #343434; text-decoration: none; background: url("../images/nav/nav_divider.png") no-repeat center right; height: 26px; width: auto; } .ie-6 #navFirstBlock * li { width: 204px; height: 100px; float: left; background: url("../images/nav/nav_level2_divider.png") no-repeat center right; padding: 0; padding-left: 30px; cursor: pointer; } .ie-6 #navFirstBlock * li #showroom ul { width: 643px; padding-bottom: 10px; margin-left: 15px; filter: progid:DXImageTransform.Microsoft.gradient(startColorStr= #ffffff , endColorStr= #f0f0f0 ,GradientType=0); width: 870px; max-width: none; margin-left: 10px; } .ie-6 #navFirstBlock * li a { display: block !important; } .ie-6 #navFirstBlock * li strong { color: #C71444; font-family: "NissanAGMediumRegular", Verdana; line-height: 1.5em; text-transform: uppercase; font-weight: normal; padding: 0; } .ie-6 #navSecondBlock { margin-left: 800px !important; display: inline !important; } .ie-6 #navSecondBlock #navLanguageSelector { position: absolute !important; top: 0 !important; right: 0 !important; } .ie-6 #navSecondBlock #navLanguageSelector #langCTA { display: block !important; } .ie-6 #navSecondBlock #navLanguageSelector ul { top: 0 !important; left: 0 !important; width: auto !important; height: auto !important; } .ie-6 #navSecondBlock #navLanguageSelector ul li { position: relative !important; display: inline !important; float: left !important; } .ie-6 #navSecondBlock #navLanguageSelector ul li div { filter: none !important; background: none; display: inline; } .ie-6 #navSecondBlock #navLanguageSelector ul li a { color: black !important; background: none !important; display: inline !important; } .ie-6 #navShowroomCarsWrapper { float: none; height: 400px; left: 0; top: 0; clear: both; z-index: 999; } .ie-6 #navShowroomCars { width: auto !important; left: 0 !important; top: 0 !important; } .ie-6 #navShowroomList { display: block; margin-top: 10px; width: 165px; float: left; cursor: default; } .ie-6 #navShowroomList .carsFilter { display: block !important; } .ie-6 #mainFooter { position: static !important; } .ie-6 #mainFooter .related { position: static !important; } .ie-6 #mainFooter .footerBlocks .wrapper { width: 1024px; margin: 0 auto; background: #000; } .ie-6 #mainFooter .footerBlocks .wrapper a { background: #000; } .ie-6 .facebook { background: url("../images/ie6-fb.gif") no-repeat !important; } .ie-6 nav.tabbed { height: auto !important; } .ie-6 #showroomModel .blurb p { width: 65% !important; } .ie-6 .diagonalCutBottom { display: none !important; } .ie-6 nav.tabbed { height: auto !important; } .ie-6 .articles .viewMore { display: none !important; } .ie-6 .articles .collapsible { height: auto !important; } .ie-6 .articles .collapsible .grid_4 { width: 20% !important; } .ie-6 .makeYourSelection .dropDown { padding: 20px; } .ie-6 #home4 figcaption { filter: none !important; } .ie-6 #home4 figcaption header { filter: none !important; background: black; } .ie-6 #home4 .panel figure, .ie-6 #home4 .panel figcaption, .ie-6 #home4 .panel img { position: relative; display: inline; } .ie-6 .requestForm label { width: auto; float: none; clear: both; } .ie-6 .requestForm #intentionToPurchase, .ie-6 .requestForm #salutation { position: relative; } .ie-6 .requestForm .findADealerSearch select, .ie-6 .requestForm .findADealerSearch .localDealers { position: relative; } .ie-6 .requestForm .findADealerSearch div { width: 100%; } .ie-6 .requestForm .findADealerSearch .dropDownContainer { clear: both !important; float: none !important; } .ie-6 input { height: 25px; } .ie-6 a { zoom: 1; } .ie-6 #selectBrochureForm .brochureForm input { width: auto; } .ie-6 #selectBrochureForm .brochureForm #emailAdd, .ie-6 #selectBrochureForm .brochureForm #phoneNum { display: block; zoom: 1; } .ie-6 #selectBrochureForm section, .ie-6 #testDriveForm section { display: none; overflow: hidden; clear: both; } .ie-6 #selectBrochureForm section.active, .ie-6 #testDriveForm section.active { display: block; } .ie-6 section.dealerListing { display: block !important; } .ie-6 .findADealerSearch #area, .ie-6 .findADealerSearch .city { float: none; position: relative; } .ie-6 .pagination .button { display: inline; float: left; } .ie-6 div.overlay { display: none; } .ie-6 select { filter: alpha(opacity=1); width: auto; height: 30px; display: block; } .ie-6 #helpMeChoose .gaugeface { background: url("../images/filter/guage-sprite.html") 0 0 no-repeat !important; position: static !important; } .ie-6 #helpMeChoose .gaugeface p { position: static !important; } .ie-6 #helpMeChoose .gaugeface .down { margin-top: 30px !important; } .ie-6 #helpMeChoose .filter { filter: none !important; } .ie-6 .vehicleDetails { overflow: visible !important; } .ie-6 .language-options li { position: relative; } .no-boxshadow #navFirstBlock .active > ul { border: 1px solid #eeeeee; border-top: none; } .ie-7 #sub-nav { font-size: 0; line-height: 0; } .ie-7 #sub-nav .menu { font-size: 0; line-height: 0; } .ie-7 #range-cars li { float: left; } .ie-7 h1 span { letter-spacing: 0; } .ie-7 #selectBrochureForm .tickbox, .ie-7 #testDriveForm .tickbox { vertical-align: baseline; } .ie-7 .button { zoom: 1; display: inline; } .ie-7 div.dropDown select { top: 11px; } .ie-7 table.simpleTable th, .ie-7 table.simpleTable td { width: auto; max-width: 240px; } .ie-7 .modelSelector figcaption span { z-index: 0; width: auto; height: auto; filter: progid:DXImageTransform.Microsoft.gradient(startColorStr="#C21329", endColorStr="#810A1A",GradientType=0); } .ie-7 input { line-height: 30px; } .ie-7 #top-nav .quick-search input { line-height: 20px; } .ie-7 #top-nav .quick-search button { height: 23px; } .ie-7 #navShowroomList li { zoom: 1 !important; } .ie-7 #navShowroomList li a { zoom: 1 !important; } .ie-7 #navShowroomList li.carsFilter a i { content: ""; background: url("../images/global-sprite.png") no-repeat -2px -146px; position: absolute; height: 13px; width: 8px; right: 15px; top: 9px; } .ie-7 #navShowroomList li.selected { filter: none !important; background: none !important; } .ie-7 #navShowroomList li.selected a { width: 216px; border: none !important; } .ie-7 #navShowroomList li.selected a i { background: url("../images/global-sprite.png") no-repeat -2px -98px; width: 12px; right: 0; top: 0; height: 35px; border-top: 1px solid #ffffff; background-color: #ffffff; } .ie-7 #home4.vertical .c1 { top: 0; left: 0; } .ie-7 #home4.vertical .c1 .clipC1 a { position: static; } .ie-7 #home4.vertical .c2a .tall { width: 47%; } .ie-7 #home4.vertical .c3b .wide { width: 48.9%; } .ie-7 #home4.vertical .c3b .smallContainer { width: 24.9%; } .ie-7 #home4.vertical .c3c .tallContainer { width: 24%; } .ie-7 #home4 figure { overflow: hidden; } .ie-7 #mainFooter .footerBlocks ul > li { width: 14.9%; } .ie-7 #mainFooter .footerBlocks ul > li ul li { width: auto; } .ie-7 #showroomModel #features .grid_4 { width: 31.8%; } .ie-7 #showroomModel #accessories .grid_3 { width: 23.6%; } .ie-7 #showroomModel .tabbed ul li { display: inline-block; display: inline; zoom: 1; } .ie-7 #showroomModel .viewMore { position: relative; z-index: 2; } .ie-7 #showroomModel .viewMore .textButton { display: inline-block; display: inline; zoom: 1; } .ie-7 #showroomModel .carousel .carouselIndicators li { display: inline-block; display: inline; zoom: 1; } .ie-7 #showroomModel #priceCalculator h1 { line-height: 1em; } .ie-7 #showroomModel .collapsible .grid_4, .ie-7 #showroomModel .collapsible .grid_3 { position: static; } table.simpleTable thead th { filter: none; } .ie-7 .scrollTable { overflow-y: hidden; padding-bottom: 10px; } .ie-7 #showroomModel #overview, .ie-8 #showroomModel #overview { padding-bottom: 45.8%; } .ie-7 #showroomModel .diagonalCutBottom, .ie-8 #showroomModel .diagonalCutBottom { background-position: left top; } .ie-7 #showroomModel #awards, .ie-8 #showroomModel #awards { margin-top: -6.44531%; } .ie-7 #mainFooter .footerBlocks > .wrapper, .ie-7 #mainFooter .related > .wrapper, .ie-8 #mainFooter .footerBlocks > .wrapper, .ie-8 #mainFooter .related > .wrapper { width: 1024px; } .ie-7 ul.carSelector .wrapper:after, .ie-8 ul.carSelector .wrapper:after { display: none !important; } .ie-7 ul.carSelector .carSelect.disabled, .ie-8 ul.carSelector .carSelect.disabled { filter: none !important; } .ie-7 ul.carSelector .carSelect.disabled b, .ie-8 ul.carSelector .carSelect.disabled b { display: block; width: 100%; height: 100%; padding-right: 10px; background: url("../images/trans.png") 0 0; position: absolute; top: 0; left: 0; } .ie-6 .restrict, .ie-6 #main, .ie-7 .restrict, .ie-7 #main, .ie-8 .restrict, .ie-8 #main { width: 1024px; } .ie-6 #buffer, .ie-7 #buffer, .ie-8 #buffer { height: 32px; max-width: 1024px; } .ie-6 #buffer.home, .ie-7 #buffer.home, .ie-8 #buffer.home { height: 0; } .ie-6 #top-nav .topics, .ie-7 #top-nav .topics, .ie-8 #top-nav .topics { display: block; } .ie-6 #top-nav .link-list, .ie-7 #top-nav .link-list, .ie-8 #top-nav .link-list { display: block; float: left; } .ie-6 #top-nav .promo-box, .ie-7 #top-nav .promo-box, .ie-8 #top-nav .promo-box { margin-top: 25px; } .ie-6 #top-nav .three-col .link-list, .ie-7 #top-nav .three-col .link-list, .ie-8 #top-nav .three-col .link-list { width: 29%; } .ie-6 #root-wrapper > .social, .ie-7 #root-wrapper > .social, .ie-8 #root-wrapper > .social { max-width: 1024px; margin: 0 auto; } .ie-6 #root-wrapper > .social .youtube .social-button, .ie-7 #root-wrapper > .social .youtube .social-button, .ie-8 #root-wrapper > .social .youtube .social-button { font-size: 11px; } .ie-6 #main #vlp-hero, .ie-7 #main #vlp-hero, .ie-8 #main #vlp-hero { margin-top: 103px; } .ie-6 #main #vlp-hero .hero-image-container, .ie-7 #main #vlp-hero .hero-image-container, .ie-8 #main #vlp-hero .hero-image-container { margin-top: 30px; } .ie-6 #main #vlp-hero .vlp-social, .ie-6 #main #vlp-hero .buttons-get-brochures, .ie-6 #main #vlp-hero .button-twoLines, .ie-7 #main #vlp-hero .vlp-social, .ie-7 #main #vlp-hero .buttons-get-brochures, .ie-7 #main #vlp-hero .button-twoLines, .ie-8 #main #vlp-hero .vlp-social, .ie-8 #main #vlp-hero .buttons-get-brochures, .ie-8 #main #vlp-hero .button-twoLines { top: 0; margin-bottom: 30px; } .ie-6 #main .vlp-features .feature-item, .ie-7 #main .vlp-features .feature-item, .ie-8 #main .vlp-features .feature-item { margin-right: 0; } .ie-6 #showroomModel #modelSubNav, .ie-7 #showroomModel #modelSubNav, .ie-8 #showroomModel #modelSubNav { position: relative; z-index: 2; left: 132px; width: auto; top: -40px; } .ie-6 #showroomModel #modelSubNav .overflowWrapper, .ie-7 #showroomModel #modelSubNav .overflowWrapper, .ie-8 #showroomModel #modelSubNav .overflowWrapper { margin: 0; } .ie-6 .noScript, .ie-7 .noScript, .ie-8 .noScript { background: black; color: white; display: block; left: 0; padding: 10px; position: relative; width: 100%; top: 0; z-index: 1000; } .ie-6 #top-nav .tools { position: relative; z-index: 5; } .ie-6 #top-nav #nav .open { display: block; } .ie-6 #top-nav #sub-nav-list { background: white; filter: none; margin-top: 20px; overflow: hidden; visibility: visible; } .ie-6 #top-nav #sub-nav-list .accordionV2 li { font-size: 0; line-height: 0; } .ie-6 #top-nav #sub-nav-list .accordionV2 li .menu { display: none; font-size: 11px; filter: none; line-height: 18px; } .ie-6 #top-nav #sub-nav-list .accordionV2 li .menu li { font-size: 11px; line-height: 18px; } .ie-6 #top-nav #sub-nav-list .accordionV2 li .menu.open { filter: none; } .ie-6 #top-nav #sub-nav-list .accordionV2 li .open { display: block; } .ie-6 #top-nav #sub-nav-list .accordionV2 li .acc-header { display: none; } .ie-6 #top-nav #range-cars li { display: block; float: left; } .ie-6 #top-nav #range-cars li.passenger { filter: none; } .ie-6 #top-nav .link-list header { height: auto; } .ie-6 #top-nav .topics { margin: 10px 0; } .ie-6 #showroomModel #modelSubNav { top: -10px; } .ie-6 #mainFooter .language-options { left: 0; margin-bottom: 0; padding: 10px; width: 200px; height: 60px; } .ie-8 .carSelect img { width: 100%; } .ie-8 .vlp-nav.stuck { margin-left: auto; width: 100%; } .ie-8 .vlp-nav.stuck .wrapper { margin-top: -1px; } .ie-8 .vlp-nav.stuck .drawer { margin-left: 260px; } .ie-8 #main { margin-top: 100px; } .ie-8 #vlp-hero .stats.icons, .ie-8 #vlp-hero .stats.noIcons { filter: none; } .ie-8 .colour-palette li p { position: relative; } .ie-8 .colour-palette li p:after { background: url("../images/ie8-colour-mask-off.png") 0 0 no-repeat; width: 52px; height: 52px; display: block; position: absolute; top: -7px; left: -7px; content: ""; } .ie-8 .colour-palette li.active p:after { background: url("../images/ie8-colour-mask.png") 0 0 no-repeat; } .ie-8 .colour-palette li.white p:after{ background:url("../images/ie8-colour-mask-off2.png") 0 0 no-repeat; width:52px; height:52px; display:block; position:absolute; top:-7px; left:-7px; content:"" } .ie-8 .vlp-overlay { background-color: black; } .ie-8 #vlp-versions .version-item { margin-right: 0; margin-left: 1.3%; } .ie-8 .vlp-features .gallery-container { position: relative; border-bottom: 1px dashed #c1c1c1; margin: 0 10px 0 0; overflow: hidden; } .ie-8 .vlp-features .galleryVideo, .ie-8 .videoCover { position: relative; } .ie-8 .vlp-features .galleryVideo:before, .ie-8 .videoCover:before { display: none; } .ie-8 .vlp-features .galleryVideo .after, .ie-8 .videoCover .after { display: block; background: url("../images/vlp/gallery-play.png") no-repeat center center; position: absolute; width: 95px; height: 95px; top: 50%; left: 50%; margin-left: -47px; margin-top: -47px; opacity: 1; } .ie-8 .vlp-features .galleryVideo.playing .after, .ie-8 .videoCover.playing .after { -moz-opacity: 0; -webkit-opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=0); opacity: 0; pointer-events: none; } .ie-8 .vlp-social .share-facebook { background: url("../images/share/facebook-alt-35.jpg") no-repeat; } .ie-8 .vlp-social .share-twitter { background: url("../images/share/twitter-alt-35.jpg") no-repeat; } .ie-8 .vlp-social .share-google { background: url("../images/share/google-alt-35.jpg") no-repeat; } .ie-8 .vlp-social .share-youtube { background: url("../images/share/youtube-alt-35.jpg") no-repeat; } .ie-8 .vlp-social .sn a { text-indent: 0; } .ie-8 .vlp-social .sn a span { text-indent: -9998px; } .ie-8 .vlp-social .sn a:after { display: none; } .ie-8 .vlp-social .sn a span { display: inline-block; width: 44px; height: 44px; background-color: black; -moz-opacity: 0; -webkit-opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=0); opacity: 0; } .ie-8 .vlp-social .sn a span:hover { -moz-opacity: 0.2; -webkit-opacity: 0.2; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=20); opacity: 0.2; } .ie-8 #vlp-hero .vlp-social .share-facebook { background: url("../images/share/facebook-alt-44.jpg") no-repeat; } .ie-8 #vlp-hero .vlp-social .share-twitter { background: url("../images/share/twitter.png") no-repeat; } .ie-8 #vlp-hero .vlp-social .share-google { background: url("../images/share/google-alt-44.jpg") no-repeat; } .ie-8 #vlp-hero .vlp-social .share-youtube { background: url("../images/share/youtube-alt-44.jpg") no-repeat; } .hero-image { position: relative; } .hint { background: url("../images/click-drag.png") no-repeat scroll left top rgba(0, 0, 0, 0); position:absolute; top:50%; left:50%; width:193px; height:47px; margin:-22px 0 0 -100px; text-indent: -9000px; z-index: 3; } .videoCover { background-color: black; position: relative; cursor: pointer; } .videoCover img { -webkit-transition: opacity 500ms ease-in-out; -moz-transition: opacity 500ms ease-in-out; -ms-transition: opacity 500ms ease-in-out; transition: opacity 500ms ease-in-out; } .videoCover:before { background: url("../images/gallery-play.png") no-repeat center center; content: " "; position: absolute; width: 95px; height: 95px; top: 50%; left: 50%; margin-left: -47px; margin-top: -47px; opacity: 1; background-size: 100%; -webkit-transition: all 300ms; -moz-transition: all 300ms; -ms-transition: all 300ms; transition: all 300ms; } .videoCover.playing:before { -moz-opacity: 0; -webkit-opacity: 0; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=${IEOpacity})"; filter: alpha(opacity=0); opacity: 0; pointer-events: none; } .videoCover:hover:before { width: 110px; height: 110px; margin-left: -55px; margin-top: -55px; } .ie-8 .videoCover:hover:before { width: 95px; height: 95px; margin-left: -47px; margin-top: -47px; } #vlp-versions .buttons-get-brochures{ height:57px; } #vlp-versions .options { margin-top:-10px; } @media screen and (max-width: 641px) { .buttons-get-brochures .options li{width:45%;} .buttons-get-brochures .options li.close{width:10%} #vlp-versions .buttons-get-brochures{ height:47px; } #vlp-versions .reveal { top:-10px; } } #circle360 .item02 { left: 50%; margin: -75px 0 0 -75px; position: absolute; top: 50%; z-index: 2; } #circle360 .item02 img { height: auto; margin-left: 25px; margin-top: 25px; width: 100px; } #circle360 .item03 { color: #fff; display: inline-block; width: 150px; } #circle360 .item03 { color: #fff; font-size: 24px; font-weight: normal; height: 150px; left: 50%; margin: -75px 0 0 -75px; position: absolute; text-align: center; top: 50%; width: 150px; z-index: 3; } #circle360 .item03 span span { display: block; font-size: 10px; position: static; } #circle360 .item03 span { left: 0; line-height: 1.2; position: absolute; text-align: center; top: 53px; width: 150px; } #vlp-hero header .starting-price{ display:block; } #vlp-hero header .starting-price span{ display:inline-block; } /*