166 lines
9.9 KiB
CSS
166 lines
9.9 KiB
CSS
#results { display:none; }
|
|
|
|
#image { width:70%; margin:0 auto; display:block; }
|
|
#html { width:90%; height:400px; font-size:0.9em; font-family:Consolas,monospace; display:block; margin:0 auto; }
|
|
h3 { text-align:center; padding-bottom:0.8em; }
|
|
#modal-trigger { display:block; margin:1em auto; }
|
|
|
|
|
|
|
|
|
|
|
|
/* =============================================================================
|
|
Gallery ('Lightbox')
|
|
========================================================================== */
|
|
|
|
.gallery-hidden { display: none !important; }
|
|
|
|
#gallery-overlay {
|
|
width: 100%;
|
|
height: 100%;
|
|
background-color: #000;
|
|
position: fixed;
|
|
top: 0px;
|
|
left: 0px;
|
|
display: none;
|
|
zoom: 1;
|
|
filter: alpha(opacity=50);
|
|
-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
|
|
opacity: 0.5;
|
|
cursor: pointer;
|
|
z-index: 1010;
|
|
}
|
|
.hidden-main#gallery-overlay, .hidden-main#gallery-modal { display: none; filter: alpha(opacity=0); opacity: 0; }
|
|
#gallery-modal { width: 570px; height: 580px; background-color: #fff; position: relative; display: none; z-index: 1011; }
|
|
#gallery-modal h3 { padding: 25px 0px 0px 25px; height: 45px; border-bottom: 1px solid #dedede; background-color: #fafafa; display: block; margin: 0px; font: bold 21px/21px Arial, sans-serif; }
|
|
#gallery-modal .gallery-content { height: 445px; width: 570px; overflow: auto; padding-bottom: 25px; }
|
|
.lt-ie9 #gallery-modal .gallery-content { overflow-x: hidden; height: 455px; }
|
|
#gallery-modal .gallery-content #movideo-holder { width: 100%; height: 306px; }
|
|
#gallery-modal .gallery-content img.gallery-media { width: 100%; height: auto;}
|
|
/*.lt-ie8 #gallery-modal .gallery-content #movideo-holder, .lt-ie8 #gallery-modal .gallery-content img.gallery-media { width: 553px; }*/
|
|
#gallery-modal .gallery-content p { font: normal 15px/17px Arial, sans-serif; color: #707070; margin: 25px 25px 0px 25px;}
|
|
.gallery-content ul { font: normal 15px/17px Arial, sans-serif; color: #707070; margin: 0px 25px 0px 0px;}
|
|
#gallery-modal .gallery-footer { padding: 28px 90px 0px 0px; height: 47px; border-top: 1px solid #dedede; background-color: #fafafa; display: block; margin: 0px; text-align: right; font: normal 13px/13px Arial, sans-serif; color: #707070; }
|
|
#gallery-modal a.prev, #gallery-modal a.next { position: absolute; bottom: -5px; background: url(http://www.mazda.com.au/brochures/base-framework/img/gallery/btn-gallery-nav.png) no-repeat; width: 25px; height: 27px; display: block; border: none; outline: none; }
|
|
|
|
#gallery-modal a.prev { background-position: left 0px; right: 54px; }
|
|
#gallery-modal a.next { background-position: right 0px; right: 30px; }
|
|
#gallery-modal a.prev:hover { background-position: left 50%; }
|
|
#gallery-modal a.next:hover { background-position: right 50%; }
|
|
.ios #gallery-modal a.prev:hover { background-position: left 0px; }
|
|
.ios #gallery-modal a.next:hover { background-position: right 0px; }
|
|
#gallery-modal a.prev:active { background-position: left 100%; }
|
|
#gallery-modal a.next:active { background-position: right 100%; }
|
|
#gallery-modal a.prev.disabled, #gallery-modal a.next.disabled { filter: alpha(opacity=50); opacity: 0.5; cursor: default!important; }
|
|
#gallery-modal a.prev.disabled { background-position: left 0px;}
|
|
#gallery-modal a.next.disabled { background-position: right 0px;}
|
|
#gallery-modal a.prev.hide { display: none; }
|
|
#gallery-modal a.next.hide { display: none; }
|
|
#gallery-modal span.slash.hide { display: none; }
|
|
#gallery-modal a.close { position: absolute; top: -12px; right: -12px; background: url(http://www.mazda.com.au/brochures/base-framework/img/gallery/btn-gallery-close.png) center 0px no-repeat; width: 25px; height: 25px; display: block; opacity:1; }
|
|
#gallery-modal a.close:hover { background-position: 0px -25px; }
|
|
#gallery-modal a.close:active { background-position: 0px -50px; }
|
|
|
|
#gallery-modal .gallery-content .warranty { display: none; }
|
|
|
|
/** Lightbox Fullscreen Video Styling **/
|
|
.fullscreen#gallery-modal { width: 924px; height: 520px; background-color: #000;}
|
|
.fullscreen#gallery-modal#gallery-modal h3, .fullscreen#gallery-modal .gallery-footer, .fullscreen#gallery-modal a.prev, .fullscreen#gallery-modal a.next { position: relative; display: none; }
|
|
.fullscreen#gallery-modal .gallery-content { width: 924px; height: 520px; padding: 0px; margin: 0px; overflow: hidden;}
|
|
.fullscreen#gallery-modal a.close { top: 10px; right: -35px; }
|
|
.fullscreen#gallery-modal .gallery-content #movideo-holder, .lt-ie8 .fullscreen#gallery-modal .gallery-content #movideo-holder, .lt-ie8 .fullscreen#gallery-modal .gallery-content img.gallery-media { width: 924px; height: 520px; }
|
|
|
|
|
|
.mobile-phone .fullscreen#gallery-modal a.close { background: url(http://www.mazda.com.au/brochures/base-framework/img/buttons/icon_close_phone.png); width: 50px; height: 48px; display: block; right: -60px;}
|
|
|
|
|
|
/** Lightbox Spec Styling **/
|
|
#specs { display: none; }
|
|
.specs #specs { display: block; }
|
|
.specs-loading#gallery-modal,
|
|
.specs#gallery-modal { width: 781px; height: 600px; background-color: #262626;}
|
|
.specs#gallery-modal h3, .specs-loading#gallery-modal h3,
|
|
.specs#gallery-modal .gallery-content, .specs-loading#gallery-modal .gallery-content,
|
|
.specs#gallery-modal .gallery-footer, .specs-loading#gallery-modal .gallery-footer,
|
|
.specs#gallery-modal a.prev, .specs-loading#gallery-modal a.prev,
|
|
.specs#gallery-modal a.next, .specs-loading#gallery-modal a.next { position: relative; display: none; }
|
|
.specs#gallery-modal a.close, .specs-loading#gallery-modal a.close { top: 10px; right: 10px; }
|
|
.specs-loading #specs-loading { padding-top: 280px; color: white; text-align: center; font-weight: bold; }
|
|
|
|
/*.specs#gallery-modal table.table-headings, .specs#gallery-modal table.table-headings tr, .specs#gallery-modal table.table-headings th { height: 45px; }
|
|
.specs#gallery-modal table.table-headings tr th { width: 120px; }
|
|
.specs#gallery-modal table.table-headings tr th.tab-class { width: 185px;}*/
|
|
|
|
.specs#gallery-modal table tr td.empty { height: 16px;}
|
|
.specs#gallery-modal table tr th.smalllineheight { line-height: 15px;}
|
|
|
|
.specsoverflow { overflow: auto; width: 766px; height: 318px; background-color: #fff; }
|
|
|
|
|
|
/* =============================================================================
|
|
Specs Table
|
|
========================================================================== */
|
|
|
|
#specs {background:url(http://www.mazda.com.au/brochures/base-framework/img/specs/bg_specs.jpg) 0px 0px repeat-x #262626;}
|
|
|
|
#specifications-module {width:766px; margin: 0px auto; background:url(http://www.mazda.com.au/brochures/base-framework/img/specs/bg_specs.jpg) 0px 0px repeat-x #262626;}
|
|
#specifications-module .specifications-set { width: 766px; }
|
|
#specifications-module.fwd .specifications-set.fwd { display: block; }
|
|
#specifications-module.awd .specifications-set.awd { display: block; }
|
|
|
|
ul.tab-set { list-style-type: none; width:746px; margin: 30px auto; padding: 0px;}
|
|
ul.tab-set li { float: left; width:369px; margin-right:8px;}
|
|
ul.tab-set li.single { width: 738px; }
|
|
ul.tab-set li img {
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=20)";
|
|
filter: alpha(opacity=20);
|
|
opacity: .2;
|
|
|
|
-webkit-transition: all .5s ease;
|
|
-moz-transition: all .5s ease;
|
|
-o-transition: all .5s ease;
|
|
-ms-transition: all .5s ease;
|
|
transition: all .5s ease;
|
|
}
|
|
ul.tab-set li:hover img, ul.tab-set li.current img {
|
|
-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
|
|
filter: alpha(opacity=100);
|
|
opacity: 1;
|
|
}
|
|
|
|
ul.tab-set li.last {margin-right: 0px;}
|
|
ul.tab-set li a {width:369px; display: block; outline: none; border: 0;}
|
|
ul.tab-set li.single a {width:738px; }
|
|
ul.tab-set li a, ul.tab-set li a:focus, ul.tab-set li a:active { outline: none; }
|
|
ul.tab-set li a span {margin-top:7px; display: block; width: 369px; border-top:4px solid #999999; color: #999999; font:bold 14px/14px arial, helvetica, sans-serif; padding-top:5px;}
|
|
ul.tab-set li.single a span { width: 738px; }
|
|
ul.tab-set li.current a span { color: #0083d1; border-color: #0083d1; }
|
|
|
|
ul.table-tabs { list-style-type: none; margin: 0px; padding: 0px; width: 766px; }
|
|
ul.table-tabs li {float: left; margin-right: 1px; background:url(http://www.mazda.com.au/brochures/base-framework/img/specs/specstabletabsbgleft.jpg) 0px 0px no-repeat; height: 32px;}
|
|
ul.table-tabs li a {height: 32px; display: block; padding:0px 17px; background: url(http://www.mazda.com.au/brochures/base-framework/img/specs/specstabletabsbgright.jpg) top right no-repeat; color: #ffffff; font:13px/32px arial, helvetica, sans-serif;}
|
|
ul.table-tabs li.current {background:url(http://www.mazda.com.au/brochures/base-framework/img/specs/statstabletabsbgcurrentleft.jpg) 0px 0px no-repeat;}
|
|
ul.table-tabs li.current a {background: url(http://www.mazda.com.au/brochures/base-framework/img/specs/statstabletabsbgcurrentright.jpg) top right no-repeat;}
|
|
|
|
.specifications-set { display: none; }
|
|
.specifications-set table { width: 742px; background-color: #ffffff; display: none;}
|
|
.specifications-set table tr th {background-color:#ffffff; padding: 15px 10px; color: #000000; font:12px arial, helvetica, sans-serif; width:150px;margin: 1px;}
|
|
.specifications-set table tr th.stat { vertical-align: top; line-height: 1.3em; }
|
|
.specifications-set table tr.zebra {background-color: #eff6fc;}
|
|
.specifications-set table tr {background-color: #f7fbfe; font-size:12px;}
|
|
.specifications-set#awd table tr .tab-class {width: 190px;}
|
|
.two-col table tr .tab-class {width: 422px;}
|
|
.no-textshadow .two-col table.table-headings tr .tab-class {width: 400px;}
|
|
.no-textshadow .two-col table.table-headings tr .model-1 { }
|
|
.no-textshadow .two-col table.table-headings tr .model-2 { padding-right: 30px; }
|
|
.specifications-set table tr th.over-hang { width: 15px; }
|
|
.specifications-set table.table-headings { width: 766px;}
|
|
|
|
.specifications-set table tr th.tab-class {font-weight: bold; text-align: left;}
|
|
.specifications-set table tr td {margin: 1px; padding:5px 10px 5px 10px; color: #717171; }
|
|
.specifications-set table tr .stat {width: 130px; text-align: center;}
|
|
|
|
|
|
.specifications-set.fwd ul.table-tabs li a { }
|
|
.specifications-set.fwd ul.table-tabs li.current a { color: #fff; }
|
|
|