/*----------------------------------------------- A HotHouse Interactive Production Toyota Copyright 2010 ----------------------------------------------- */ /*----------------------------------------------- Generic styles ----------------------------------------------- */ /* Page templates */ #main{background: #fff url(../images/bg-main.gif) 0 0 repeat-x; color: #434650;} #main #main-content #section-a {background: #fff url(../images/bg-main.gif) 0 0 repeat-x;} #main #main-content #section-b{background-color: #fff;} #main #main-content #content {background: none;} .template-b #main-content {background: url(../images/bg-template-b-main-content.gif) 0 0 repeat-y;} .template-c #main-content {background: url(../images/bg-template-c-main-content.gif) 0 0 repeat-y;} .template-d #main-content {background: url(../images/bg-template-d-main-content.gif) 0 0 repeat-y;} /* Headers */ #main h2{background: none; color: #3a526f;} #main h2.border{border-bottom: 5px solid #7e95b3;} #main h3, div.glossary-popup h3 {background: none; border: none; color: #181a21;} #main h4{color: #181a21;} /* Homepage */ .homepage #page-container{background: #fff url(../images/bg-page-homepage.gif) 0 0 repeat-x; color: #434650;} .homepage #main{background: transparent url(../images/bg-main-homepage.jpg) 50% 0 no-repeat;} .homepage #main #main-content #section-a{background: #fff url(../images/bg-section-a-homepage.gif) 0 0 repeat-x;} .homepage #main #main-content #content{padding-bottom: 30px;} .homepage #main #main-content #section-b{background: none;} /* Homepage Gallery*/ .homepage-gallery #page-container{background: #fff url(../images/bg-page-homepage-gallery.gif) 0 0 repeat-x;} .homepage-gallery #main{background: transparent url(../images/bg-main-homepage-gallery.jpg) 50% 0 no-repeat;} .homepage-gallery #main #main-content #section-a{background: #fff url(../images/bg-section-a-homepage-gallery.gif) 0 0 repeat-x;} .homepage-gallery #main #main-content #content{padding-bottom: 0;} /* Feature links */ #main .feature-link a{color: #fff; text-shadow: #616a6b 1px 1px 1px;} #main .link-a{background: url(../images/bg-feature-link-a.gif) 0 0 no-repeat;} #main .link-b{background: url(../images/bg-feature-link-b.gif) 0 0 no-repeat;} #main .link-c{background: url(../images/bg-feature-link-c.gif) 0 0 no-repeat;} /* Cancel */ #main .link-d{background: url(../images/bg-feature-link-d.gif) 0 0 no-repeat;} /* Next */ #main .link-e{background: url(../images/bg-feature-link-e.gif) 0 0 no-repeat;} /* Next */ /* More links */ #main a.more-link{color: #ee2b33; background: url(../images/bullet-red-arrow.gif) top right no-repeat;} /*Dealer for Personalisation*/ #personalisation input#personalisationSubmit { background: url(../images/btn-personalisation-save.gif) 0 0 no-repeat;} /*----------------------------------------------- Colours & demos ----------------------------------------------- */ #main .page-header{border-bottom: 5px solid #7e95b3;} #chart .intro{color: #434650;} #chart table{color: #434650; border: 2px solid #fff;} #chart table td{border: 1px solid #e5e5e5;} #chart table th{border: 1px solid #e5e5e5;} #chart .info .trim{background: #fff; border: 1px solid #e5e5e5;} #chart .info .trim p{color: #181a21;} #chart .info .trim p a{color: #ee2b33;} #chart .info .color-sample{background: url(../images/bg-color-samples.gif) 0 0 no-repeat;} #chart .info .color-sample img{background-color: #fff;} #chart .trim .trim-sample{background: url(../images/bg-trim-samples.gif) 0 0 no-repeat;} #chart .trim .trim-sample img{background-color: #fff;} .colours #main .gallery .vehicle-selection {padding-top: 20px;} /*----------------------------------------------- Generic Galleries ----------------------------------------------- */ /* Tabs */ #main ul.tabs li{background-color: #d3dde9;} #main ul.tabs li span{background: url(../images/bg-gallery-tabs-left.gif) top left no-repeat;} #main ul.tabs li span a{background: url(../images/bg-gallery-tabs-right.gif) top right no-repeat; color: #181a21;} #main ul.tabs li.current{background: #3a526f url(../images/bg-gallery-tabs-current.gif) top left repeat-x;} #main ul.tabs li.current span{background: url(../images/bg-gallery-tabs-left-current.gif) top left no-repeat;} #main ul.tabs li.current span a{background: url(../images/bg-gallery-tabs-right-current.gif) top right no-repeat; color: #fff;} /* Item navigation controls */ #main .gallery .controls .previous{background: url(../images/bg-gallery-controls-previous.gif) 10px 225px no-repeat} #main .gallery .controls .next{background: url(../images/bg-gallery-controls-next.gif) 10px 225px no-repeat;} /* Viewer */ #main .gallery .viewer{border-top: 5px solid #7e95b3;} #main .gallery .text-box{color: #434650;} #main .gallery .media-box{border-right: 1px solid #e5e5e5;} #main .gallery .media-box .info{background: #f3f8fd url(../images/bg-gallery-info.gif) 0 0 no-repeat;} #main .gallery .media-box .info a{color: #ee2b33;} #main .gallery .media-box .info ul.icon-links li {} #main .gallery .media-box .info ul.icon-links li span {background: url(../images/bg-icon-links-border.gif) no-repeat right top transparent;} #main .gallery .media-box .info ul.icon-links li.noborder span {background: none transparent;} #main .gallery .media-box .info ul.icon-links li.toyota {background: url(../images/bg-module-pricemycar.png) 0 2px no-repeat;} #main .gallery .media-box .info ul.icon-links li.manual {background: url(../images/bg-module-document.png) 0 2px no-repeat;} #main .gallery .media-box .info ul.icon-links li.video {background: url(../images/bg-module-steeringwheel.png) 0 2px no-repeat;} #main .gallery .media-box .info .genuine{border-left: 1px solid #c7ccd1;} #main .gallery .media-box .info .genuine a{background: url(../images/bg-gallery-genuine.gif) left bottom no-repeat;} #main .gallery .applicability .closed a{background: url(../images/bg-gallery-applicability-view.gif) 0 0 no-repeat;} #main .gallery .applicability .opened{border: 1px solid #dedede; background-color: #fff;} #main .gallery .applicability .opened p{color: #181a21;} #main .gallery .applicability .opened ul li{color: #434650;} #main .gallery .applicability .opened a{background: url(../images/bg-gallery-applicability-hide.gif) 0 0 no-repeat;} #main .gallery .figure-box{background: url(../images/bg-gallery-figure.gif) top right repeat-y;} #main .gallery .figure-box h3{color: #3a526f;} #main .gallery .figure-box p{color: #181a21;} #main .gallery .disclaimers a.disclaimer-controls {color: #ee2b33;} #main .gallery .disclaimers .closed a.disclaimer-controls {background: url(../images/bg-gallery-disclaimers-view.gif) 0 0 no-repeat;} #main .gallery .disclaimers .opened {border: 1px solid #e5e5e5; background-color: #fff;} #main .gallery .disclaimers .opened p {color: #181a21;} #main .gallery .disclaimers .opened ul li {color: #434650;} #main .gallery .disclaimers .opened a.disclaimer-controls {background: url(../images/bg-gallery-disclaimers-hide.gif) 0 0 no-repeat;} #main .gallery .accordion-box h4{background: url(../images/bg-gallery-accordion-header.gif) 0 0 no-repeat; color: #fff; text-shadow: #616a6b 1px 1px 1px;} #main .gallery .accordion-box h4.ui-state-active{background-position: 0 -45px;} /* Category Tabs */ #main .gallery ul.tabs{border-bottom: 5px solid #7e95b3;} /* Categories */ #main .gallery .list .item{border-right: 1px solid #e5e5e5;} #main .gallery .list .item h4{color: #3a526f;} #main .gallery .list .item h4 a{color: #3a526f;} #main .gallery .list .item p{color: #434650;} #main .gallery .list .current h4{color: #6f8aad;} #main .gallery .list .current h4 a{color: #6f8aad;} #main .gallery .list .current p{color: #6f8aad;} #main .gallery .list .noborder{border-right: none;} /*----------------------------------------------- Media gallery ----------------------------------------------- */ .media-gallery #main .gallery .viewer{background: url(../images/bg-gallery-viewer.gif) 0 0 repeat-y; border-bottom: 5px solid #7e95b3;} .media-gallery #main .gallery .media-box{border-right: none;} .media-gallery #main .gallery .figure-box{background: none;} .media-gallery #main .gallery .controls .previous{background-position: 33px 208px;} .media-gallery #main .gallery .controls .next{background-position: 48px 208px;} .media-gallery #main .gallery .list .item{height: 250px;} .media-gallery #main .gallery #mg_15cmpir7u_1-tab-1-block .item{height: 303px;} /*----------------------------------------------- Homepage gallery ----------------------------------------------- */ .homepage #main .gallery .viewer{border: none; height: 539px;} .homepage #main .gallery .media-box{border: none; height: 539px;} /*.homepage #main .gallery #yaris-block{background: url(/static/images/yaris-media-gallery-block-960x539.jpg) 0 0 no-repeat;}*/ .homepage #main .gallery .list .item{border: none;} .homepage #main .gallery .list .item .link{background: url(../images/bg-homepage-gallery-item.gif) 0 18px no-repeat;} .homepage #main .gallery .list .item h4 a{color: #fff; text-shadow: #7c94b1 1px 1px 1px;} .homepage #main .gallery .list .current .link{background: url(../images/bg-homepage-gallery-item-current.gif) 0 0 no-repeat;} /*----------------------------------------------- Colours gallery ----------------------------------------------- */ .colours #main .gallery .viewer{background: url(../images/bg-gallery-viewer.gif) 0 0 repeat-y; border-bottom: 5px solid #7e95b3; border-top: none;} .colours #main .gallery .media-box{border-right: none;} .colours #main .gallery .media-box .slideshow-controls ul li{background: url(../images/bg-colours-gallery-slideshow-thumbnails.png) 0 0 no-repeat;}/* ie6 */ .colours #main .gallery .media-box .slideshow-controls ul li.current{background: url(../images/bg-colours-gallery-slideshow-thumbnails-current.png) 0 0 no-repeat;}/* ie6 */ .colours #main .gallery .vehicle-selection ul.tabs{border-bottom: none;} .colours #main .gallery .trim-selection .all-link{color: #ee2b33;} .colours #main .gallery ul.trims li p{color: #181a21;} .colours #main .gallery ul.trims li .trim-sample{background: url(../images/bg-trim-samples.gif) 0 0 no-repeat;} .colours #main .gallery ul.trims li .trim-sample img{background-color: #fff;} .colours #main .gallery ul.trims li.current .trim-sample{background: url(../images/bg-trim-samples-current.gif) 0 0 no-repeat;} .colours #main .gallery ul.trims li.current p{color: #577091;} /*----------------------------------------------- Share and Download page ----------------------------------------------- */ #main .share-and-download ul.tabs li {background: url('../images/bg-gallery-tabs-left.gif') no-repeat left top transparent;} #main .share-and-download ul.tabs li span {background: url('../images/bg-gallery-tabs-right.gif') no-repeat right top transparent;} #main .share-and-download ul.tabs li span a {background: url('../images/bg-icon-download-tab.gif') no-repeat 68px 11px #d3dde9;} #main .share-and-download .vehicle-image {background: url("../images/bg-colours-download-vehicle-image.gif") no-repeat scroll bottom right transparent;} #main .share-and-download h2 {color: #3a526f; border-bottom: 5px solid #7e95b3;} #main .share-and-download h3 {color: #3a526f;} /*----------------------------------------------- Pricing ----------------------------------------------- */ /* Layout */ #pricing .options .item{border-bottom: 1px solid #e5e5e5;} #pricing .options .item h3{color: #3a526f;} /* Personalisation */ #pricing #personalDetails p{color: #434650;} #pricing #personalDetails p strong{color: #181a21;} #pricing #personalDetails p a{color: #ee2b33;} #pricing #personalDetails label{color: #020d16;} #pricing #personalDetails label.radio-label{color: #666666;} #pricing #personalDetails label.current{color: #577091;} #pricing #personalDetails input#UserDetailsLocation{border: 1px solid #e5e5e5; color: #434650;} #pricing #personalDetails input#UserDetailsSubmit{background: url(../images/btn-pricing-get-prices.gif) 0 0 no-repeat; border: none; color: #8bb4e6;} #pricing #personalDetails ul.auto-complete{background-color: #fff; border: 1px solid #abadb3;} #pricing #personalDetails ul.auto-complete li.hover{background-color: #f3f3f3;} #pricing #personalDetails ul.auto-complete li.current{background:#4884c0; color:#fff} /* Options */ #pricing ul.radio li.current label{color: #577091;} #pricing #colourType li .color-sample{background: url(../images/bg-color-samples.gif) 0 0 no-repeat;} #pricing #colourType li.hover .color-sample {background: url(../images/bg-color-samples-hover.gif) 0 0 no-repeat;} #pricing #colourType li.current .color-sample {background: url(../images/bg-color-samples-current.gif) 0 0 no-repeat;} #pricing #colourType li .color-sample img{background-color: #fff;} /* Response */ #pricing .response{background: url(../images/bg-pricing-response.gif) bottom left no-repeat;} #pricing .response .offer{background: url(../images/bg-special-offer.gif) 140px 125px no-repeat;} #pricing .response .info .price-type{color: #434650;} #pricing .response .info .price{color: #181a21;} #pricing .response .info .special-offer .price-type{color: #cb2026;} #pricing .response .info .special-offer .price{color: #cb2026;} #pricing .response .info ul li{background: url(../images/bullet-list.gif) 0 6px no-repeat; color: #181a21;} #pricing .response .loading{color: #181a21;} #pricing .response .error{color: #181a21;} /*----------------------------------------------- Range overview ----------------------------------------------- */ #top-controls .text .hint{color: #434650; background-color: #fff; border: 1px solid #dedede;} #top-controls #compare-activate p{color: #3a526f;} #top-controls #compare-start h4{color: #3a526f;} #top-controls strong{color: #25282e;} #bottom-controls .text .hint{color: #434650; background-color: #fff; border: 1px solid #dedede;} #range {background: url(../images/bg-range.gif) 0 0 repeat-y;} #range .range-column{width: 320px;} #range ul.list li.item{width: 300px; height: 359px; margin: 5px 0;} /*#range{background: url(../images/bg-range.gif) 0 0 repeat-y;} #range .range-column-1{width: 720px;} #range .range-column-2{width: 240px;} #range ul.list li.item {width: 220px; height: 360px;}*/ #range ul.list li.item .info{color: #434650;} #range ul.list li.item .info ul li{background: url(../images/bullet-list.gif) 0 6px no-repeat;} #range ul.list li.item .special-offer{background: url(../images/bg-special-offer-small.gif) 120px 8px no-repeat;} #range ul.list li.item .compare h4{color: #3a526f;} #range ul.list li.item .compare ul li{background: none;}/* clear */ #range ul.list li.item .compare ul li.selected{background: url(../images/bg-range-compare.gif) 0 0 no-repeat; color: #ffffff; text-shadow:1px 1px 1px #616A6B;} #range ul.list li.item .compare ul li.selected label strong{color: #ffffff;} #range ul.list li.item .compare ul li label strong{color: #25282e;} /*----------------------------------------------- Specifications ----------------------------------------------- */ /* Generic */ .specifications h2 {color: #181a21;} .specifications .grade-nav {border-bottom: 5px solid #7e95b3;} .specifications .grade-nav ul.grade-tab li {background: url(../images/bg-specifications-grade-nav-left.gif) 0 0 no-repeat;} .specifications .grade-nav ul.grade-tab li.active {background-image: url(../images/bg-specifications-grade-nav-left-hover.gif);} .specifications .grade-nav ul.grade-tab li a {color: #181a21; text-shadow: 0 1px #b6bdc4; background: url(../images/bg-specifications-grade-nav-right.gif) 100% 0 no-repeat;} .specifications .grade-nav ul.grade-tab li.active a {color: #ffffff; text-shadow: 0 1px #6687b0; background-image: url(../images/bg-specifications-grade-nav-right-hover.gif);} .specifications .grade-pricing {} .specifications .grade-pricing p {color: #181a21;} .specifications .grade-pricing p.offer {color: #cb2026; background: url(../images/bg-special-offer.gif) 120px 10px no-repeat;} .specifications .grade-pricing p.offer a {color: #cb2026; background: url(../images/bullet-red-arrow.gif) 85px 0 no-repeat;} .specifications .grade-pricing p.offer .disclaimer {color: #181a21;} .specifications .grade-specifications {color: #434650;} .specifications .grade-key {color: #434650; background: url(../images/bg-specifications-key-b.gif) 0 0 no-repeat;} .grade-specifications .toolbar {background: url(../images/bg-specifications-toolbar.gif) 0 0 no-repeat;} .grade-specifications .toolbar .close-all {color: #181a21; background-image: url(../images/bg-specifications-collaspe-icons.gif); background-repeat: no-repeat; background-position: 10px 0px;} .grade-specifications .toolbar .expand-all {color: #181a21; background-image: url(../images/bg-specifications-collaspe-icons.gif); background-repeat: no-repeat; background-position: 10px -39px;} .specification-group .heading {background: url(../images/bg-specifications-group-heading.gif) 0 0 no-repeat;} #main .specification-group .heading h3 {color: #ffffff; text-shadow: 0 1px #6687b0;} .specification-group .list ul.even {background: #f3f8fd;} .specification-group .list ul.odd {background: #ffffff;} .specification-group .list span.even {background: #f3f8fd;} .specification-group .list span.odd {background: #ffffff;} #main .expanded .heading h3 {background-image: url(../images/bg-specifications-collaspe-icons.gif); background-repeat: no-repeat; background-position: 10px -78px;} #main .collapsed .heading h3 {background-image: url(../images/bg-specifications-collaspe-icons.gif); background-repeat: no-repeat; background-position: 10px -117px;} /* Grade Comparison dropdown */ .specifications .grade-comparison.open-comparison-content span {background: url("../images/bg-grade-comparison-title.gif") 0 0 no-repeat;} .specifications .grade-comparison span a {color: #000; background: url(../images/bg-toolbox-controls.gif) 194px 11px no-repeat;} .specifications .grade-comparison.open-comparison-content span a {background-position: 194px -19px;} .specifications .grade-comparison .content {background: #fff url("../images/bg-grade-comparison-top.gif") top left no-repeat; border-right: 1px solid #e5e5e5; border-left: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5;} .specifications .grade-comparison .content #range .have-you-considered ul.list{background: url(../images/bg-range.gif) 0 0 repeat-y;} .specifications .grade-comparison .content #range .have-you-considered ul.list li.item{height: 413px;} /*----------------------------------------------- Compare Grades ----------------------------------------------- */ .compare-grades .grade-specifications .toolbar {background: url(../images/bg-compare-toolbar.gif) 0 0 no-repeat;} .compare-grades .specification-group .heading {background:url("../images/bg-compare-group-heading.gif") no-repeat scroll 0 0 transparent;} .compare-grades .selected-grades .grade {border-left: 1px solid #E5E5E5; height: 398px;} .compare-grades .selected-grades .grade h3 {height: 34px;} .compare-grades .grade-key {background: url(../images/bg-specifications-key-a.gif) 0 0 no-repeat;} /*----------------------------------------------- Features ----------------------------------------------- */ #main .articles h2 {border: none; color: #3a526f;} #main .articles h2.border {border-bottom: 4px solid #7e95b3;} #main .articles h3 {background: none; color: #3a526f;} #main .articles h3.border, div.glossary-popup h3.border {border-bottom: 4px solid #7e95b3;} .articles .section {color: #434650;} .articles .image-title {color: #7b7d84;} .articles .enlarge-button {background: url(../images/bg-button-enlarge.gif) 0 17px no-repeat;} .articles ul li {background: url(../images/bullet-articles-list.gif) 0 7px no-repeat;} .articles ul.large li {background: url('../images/bullet-red-arrow.gif') 0 4px no-repeat; color: #434650;} .articles .highlighted {background-color: #689ad3; color: #fff;} .articles .highlighted .image-title{background-color: #fff; color: #7b7d84;} /*----------------------------------------------- Navigation ----------------------------------------------- */ /* Top menu */ #main-content #section-a .top-menu ul li span a{color: #000; text-shadow: #fff 1px 1px 1px;} #main-content #section-a .top-menu ul li.current{background: url(../images/bg-top-menu-left-current.gif) top left no-repeat;} #main-content #section-a .top-menu ul li.current span{background: url(../images/bg-top-menu-right-current.gif) top right no-repeat;} #main-content #section-a .top-menu ul li.current span a{background: url(../images/bg-top-menu-current.gif) 0 0 repeat-x; color: #fff; text-shadow: #376291 1px 1px 1px;} /* Left menu */ #main-content #sidebar-a .left-menu ul li a {color: #666666; border-bottom: 1px solid #e5e5e5;} #main-content #sidebar-a .left-menu ul li a:hover {color: #577091;} #main-content #sidebar-a .left-menu ul li.active a{color: #577091;} #main-content #sidebar-a .left-menu ul li.current {background: url("../images/bg-side-menu-top.gif") 0 0 no-repeat transparent;} #main-content #sidebar-a .left-menu ul li.current a{color: #fff; background: url("../images/bg-side-menu-bottom.gif") no-repeat bottom left transparent; text-shadow: 0 1px #605846; border: none;} #main-content #sidebar-a .left-menu ul li.current a:hover{color: #fff;} #main-content #sidebar-a .left-menu ul li ul li {border-top: 1px dotted #cccccc; background: none;} #main-content #sidebar-a .left-menu ul li ul li a{background: url("../images/bg-side-menu-inner-top.gif") no-repeat 0 0!important;} #main-content #sidebar-a .left-menu ul li ul li a span{text-shadow: none; color: #666666;} #main-content #sidebar-a .left-menu ul li ul li a:hover {background-position: 0 -63px;} #main-content #sidebar-a .left-menu ul li ul li a:hover span{color: #577091;} #main-content #sidebar-a .left-menu ul li ul li.current {border: none;} #main-content #sidebar-a .left-menu ul li ul li.current a{background: url("../images/bg-side-menu-inner-top.gif") no-repeat 0 -126px #92abcb !important;} #main-content #sidebar-a .left-menu ul li ul li.current a span, #main-content #sidebar-a .left-menu ul li ul li.current a:hover span{color: #fff; text-shadow: 0 1px #6687B0; background: url("../images/bg-side-menu-inner-bottom.gif") no-repeat left bottom;} /*----------------------------------------------- Promo modules ----------------------------------------------- */ /* Special offer promo module */ .homepage #main-content #special-offer.module {background: url(../images/bg-module-special-offer.gif) 0 bottom no-repeat; border: none; color: #181a21;} #special-offer.module .content .great-offer {background: url(../images/bg-special-offer.png) 120px 25px no-repeat;} #special-offer.module .content .great-offer .price{color: #ee2b33;} #special-offer.module .content .details {color: #ff0000;} #special-offer.module .content ul {color: #434650;} #special-offer.module .content ul li {background: url(../images/bg-module-special-offer-tick.gif) 0 4px no-repeat;} /* Special offer promo module on sidebars */ .template-d #special-offer.module .content .details {font-size: 11px; padding: 0 0 10px;} .template-d #special-offer.module .more-link {margin: 0 !important;} /* Personalisation */ #user-details.module h2 {color: #181a21;} #user-details.module p{color: #434650;} #user-details.module p strong{color: #181a21;} #user-details.module p a{color: #ed1c24;} #user-details.module p span.highlighted {color: #ed1c24;} #user-details.module label{color: #020d16;} #user-details.module label.radio-label{color: #666666;} #user-details.module label.current, #personalisation label.current {color: #699bd8;} #user-details.module input#UserDetailsLocation{border: 1px solid #e5e5e5; color: #434650;} #user-details.module input#UserDetailsSubmit{background: url(../images/btn-personalisation-show.gif) 0 0 no-repeat; border: none; color: #8bb4e6;} #user-details.module input#UserDetailsDealersSubmit{background: url(../images/btn-personalisation-save.gif) 0 0 no-repeat; color: #8bb4e6;} #user-details.module ul.auto-complete{background-color: #fff; border: 1px solid #abadb3;} #user-details.module ul.auto-complete li.hover{background-color: #f3f3f3;} #user-details.module ul.auto-complete li.current{background:#4884c0; color:#fff} /*----------------------------------------------- 404 Pages ----------------------------------------------- */ .page-404 ul.suggestions li {background:url("../images/bullet-red-arrow.gif") no-repeat scroll 0 4px transparent; color:#434650;} .page-404 #range ul.list li.item {height: 250px;}