/* FreshAirPro.com */ /* Resets */ * { margin:0; padding:0; } body { background:#3E8C97; font:12px/1.5 Arial, Helvetica, sans-serif; color:#044E6A; text-align:center; } img { border:0; vertical-align:top; } a { color:#0F7697; text-decoration:underline; } a:hover { color:#0497AD; text-decoration:underline; } a img { border:0;} :focus { outline:0; } p { padding: 0; margin-bottom: 1.5em; } .hide { display: none; } /* Headings */ h1, h2, h3, h4, h5, h6, .head { margin-bottom:.4em; line-height:1.2em; font-family: "trajan-pro-1","trajan-pro-2",serif; font-weight: normal; } h1 { font-size:2em; line-height:1; margin: 0 0 .5em 0; padding: 0; color: #0A6F91; } h2 { font-size:1.4em; } .sidebar h2, .block-blog-archives .block-title strong, .block-nav .block-title strong, .block-layered-nav .block-title strong, .block-viewed .block-title strong { font-size:1.4em; margin-bottom: .5em; background: transparent url(../images/interface/newsletter-bg-bottom.png) no-repeat bottom right; width: 236px; display: block; padding: 8px 12px 12px; color: #fff; line-height:1.2em; font-family: "trajan-pro-1","trajan-pro-2",serif; font-weight: normal; } h3 { font-size:1.2em; color: #3495AE; } h4 { font-size:1.05em; text-transform: uppercase; margin-bottom: 1em; } h5 { font-size:1.5em; text-transform: uppercase; } h6 { font-size:.95em; } .block-blog ul, .block-blog-archives ul { border-top: 1px dotted #B1E1E7; } .block-blog li, .block-blog-archives li { padding: 3px 10px; border-bottom: 1px dotted #B1E1E7; } .cat a, .block-blog a, .block-blog-archives a { text-transform: capitalize; } .cat em, .block-blog em, .block-blog-archives em { color: #5CC0CE; font-size: 80%; display: block; } /* Show/Hide WebFonts */ /*h1, h2, h3, h4, h5, h6, .head, .block-layered-nav .block-title strong, .block-viewed .block-title strong, .block-nav .block-content a, .header #cart_mini, .download strong, .pre_footer .newsletter_content .block-title strong { visibility: hidden; } .wf-active h1, .wf-active h2, .wf-active h3, .wf-active h4, .wf-active h5, .wf-active h6, .wf-active .head, .wf-active .block-layered-nav .block-title strong, .wf-active .block-viewed .block-title strong, .wf-active .block-nav .block-content a, .wf-active .header #cart_mini, .wf-active .download strong, .wf-active .pre_footer .newsletter_content .block-title strong { visibility: visible; }*/ /* Facebook/Twitter */ .facetweet { padding: 5px 0; } .facetweet:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .facetweet .btn_fb, .facetweet .btn_tweet { display: block; float: left; } /* Forms */ form { display:inline; } fieldset { border:0; } legend { display:none; } /* Table */ table { border:0; border-collapse:collapse; border-spacing:0; empty-cells:show; font-size:100%; } caption,th,td { vertical-align:top; text-align:left; font-weight:normal; } /* Content */ address { font-style:normal; } cite { font-style:normal; } q, blockquote { quotes:none; } q:before, q:after { content:''; } small,big { font-size:1em; } sup { font-size:1em; vertical-align:top; } /* Lists */ ul,ol { list-style:none; } /* Tools */ .nobr { white-space:nowrap !important; } .wrap { white-space:normal !important; } .a-left { text-align:left !important; } .a-center { text-align:center !important; } .a-right { text-align:right !important; } .v-top { vertical-align:top; } .v-middle { vertical-align:middle; } .f-left, .left { float:left !important; } .f-right, .right { float:right !important; } .f-none { float:none !important; } .f-fix { float:left; width:100%; } .no-display { display:none; } .no-margin { margin:0 !important; } .no-padding { padding:0 !important; } .no-bg { background:none !important; } /* Layout ================================================================================= */ .wrapper, .wrapper_left, .wrapper_right, .wrapper_front, .wrapper_special { width: 100%; position: relative; } .wrapper { background: #D7F0F3 url(../images/interface/pagebg_sky.png) repeat-x top center; min-width: 970px; } .wrapper_left { background: transparent url(../images/interface/pagebg_clouds_left.png) no-repeat -5% 20px; } .wrapper_right { background: transparent url(../images/interface/pagebg_clouds_right.png) no-repeat 105% 130px; } .wrapper_front { background: transparent url(../images/interface/pagebg_cloud_trans.png) no-repeat 75% 40px; padding-top: 60px; } .wrapper_special { background: transparent url(../images/interface/sunshine_bg.png) no-repeat center top; } .page { width:970px; margin:0 auto; padding-top: 10px; text-align:left; } .page-print { background:#fff; padding:20px; text-align:left; } .page-popup { padding:20px; text-align:left; background: #fff; } .rounded { background: transparent url(../images/interface/bg_light_round.png) no-repeat bottom center; height: 20px; overflow: hidden; } .rounded.dark { background-image: url(../images/interface/bg_dark_round.png); } .main { background: transparent url(../images/interface/bg_light_repeat.png); min-height: 300px; padding: 10px 0 20px 0; position: relative; } .main.dark { background-image: url(../images/interface/bg_dark_repeat.png); } /* Base Columns */ .col-left { float:left; width:230px; margin-left: 20px; } .col-main { float:left; width:680px; margin-left: 20px; } .col-right { float:right; width:230px; margin-right: 20px; } /* 1 Column Layout */ .col1-layout .col-main { float:none; width:auto; margin: 0 20px; } /* 2 Columns Layout */ .col2-left-layout .col-main { float:right; } .col2-right-layout .col-main {} /* 3 Columns Layout */ .col3-layout .col-main { width: 430px; } /* Content Columns */ .col2-set .col-1 { float:left; width:49%; } .col2-set .col-2 { float:right; width:49%; } .col2-set .narrow { width:33%; } .col2-set .wide { width:65%; } .col3-set .col-1 { float:left; width:32%; } .col3-set .col-2 { float:left; width:32%; margin-left:2%; } .col3-set .col-3 { float:right; width:32%; } .col4-set .col-1 { float:left; width:23.5%; } .col4-set .col-2 { float:left; width:23.5%; margin:0 2%; } .col4-set .col-3 { float:left; width:23.5%; } .col4-set .col-4 { float:right; width:23.5%; } /* ======================================================================================= */ /* Global Styles ========================================================================= */ /* Form Elements */ input,select,textarea,button { font:12px Arial, Helvetica, sans-serif; vertical-align:middle; color:#000; } input.input-text,select,textarea { background:#fff; border:1px solid #A6D3DD; } input.input-text,textarea { padding:2px; } select { padding:1px; } select option { padding-right:10px; } select.multiselect option {} textarea { overflow:auto; } input.radio { margin-right:3px; } input.checkbox { margin-right:3px; } input.qty { width:2.5em !important; } /*button.button::-moz-focus-inner { padding:0; border:0; } *//* FF Fix */ button.button { overflow:visible; width:auto; background:transparent url(../images/interface/buttonbg.png) no-repeat scroll center top; border:1px solid #066A8F; cursor:pointer; border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; /*-webkit-border-fit:lines;*/ } #review-buttons-container button.button, .checkout-types button.button { background-position: center bottom; border:1px solid #4A9520; } button.button span { display:block; margin:0; padding:0 12px 1px; font:bold 12px/16px Arial, Helvetica, sans-serif; text-align:center; white-space:nowrap; color:#fff; line-height: 1.6; } button.disabled {} button.disabled span {} /* Input & Textarea stretched for 100% */ .field-100 { border:1px solid #888; padding:2px; overflow:hidden; } .field-100 input.input-text, .field-100 textarea { float:left; width:100%; margin:0; padding:0; border:0; } /* Form Highlight */ /*input.input-text:focus,select:focus,textarea:focus {}*/ /*.highlight { background:#eee; }*/ .instruction { font-size: 90%; font-style: italic; color: #3395AE; } /* Form lists */ /* Grouped fields */ /*.form-list { width:535px; margin:0 auto; overflow:hidden; }*/ .form-list li { margin:0 0 8px; } .form-list label { float:left; color:#666; font-weight:bold; position:relative; z-index:0; } .form-list label.required {} .form-list label.required em { float:right; font-style:normal; color:#eb340a; position:absolute; top:0; right:-8px; } .form-list li.control label { float:none; } .form-list li.control input.radio, .form-list li.control input.checkbox { margin-right:6px; } .form-list li.control .input-box { clear:none; display:inline; width:auto; } /*.form-list li.fields { margin-right:-15px; }*/ .form-list .input-box { display:block; clear:both; width:260px; } .form-list .field { float:left; width:275px; } .form-list input.input-text { width:254px; } .form-list textarea { width:254px; height:10em; } .form-list select { width:260px; } .form-list li.wide .input-box { width:535px; } .form-list li.wide input.input-text { width:529px; } .form-list li.wide textarea { width:529px; } .form-list li.wide select { width:535px; } .form-list li.additional-row { border-top:1px solid #ccc; margin-top:10px; padding-top:7px; } .form-list li.additional-row .btn-remove { float:right; margin:5px 0 0; } .form-list .input-range input.input-text { width:74px; } /* Customer */ .form-list .customer-name-prefix .input-box, .form-list .customer-name-suffix .input-box, .form-list .customer-name-prefix-suffix .input-box, .form-list .customer-name-prefix-middlename .input-box, .form-list .customer-name-middlename-suffix .input-box, .form-list .customer-name-prefix-middlename-suffix .input-box { width:auto; } .form-list .name-prefix { width:65px; } .form-list .name-prefix select { width:55px; } .form-list .name-prefix input.input-text { width:49px; } .form-list .name-suffix { width:65px; } .form-list .name-suffix select { width:55px; } .form-list .name-suffix input.input-text { width:49px; } .form-list .name-middlename { width:70px; } .form-list .name-middlename input.input-text { width:49px; } .form-list .customer-name-prefix-middlename-suffix .name-firstname, .form-list .customer-name-prefix-middlename .name-firstname { width:140px; } .form-list .customer-name-prefix-middlename-suffix .name-firstname input.input-text, .form-list .customer-name-prefix-middlename .name-firstname input.input-text { width:124px; } .form-list .customer-name-prefix-middlename-suffix .name-lastname { width:205px; } .form-list .customer-name-prefix-middlename-suffix .name-lastname input.input-text { width:189px; } .form-list .customer-name-prefix-suffix .name-firstname { width:210px; } .form-list .customer-name-prefix-suffix .name-lastname { width:205px; } .form-list .customer-name-prefix-suffix .name-firstname input.input-text, .form-list .customer-name-prefix-suffix .name-lastname input.input-text { width:189px; } .form-list .customer-name-prefix-suffix .name-firstname { width:210px; } .form-list .customer-name-prefix-suffix .name-lastname { width:205px; } .form-list .customer-name-prefix-suffix .name-firstname input.input-text, .form-list .customer-name-prefix-suffix .name-lastname input.input-text { width:189px; } .form-list .customer-name-prefix .name-firstname, .form-list .customer-name-middlename .name-firstname { width:210px; } .form-list .customer-name-suffix .name-lastname, .form-list .customer-name-middlename .name-firstname, .form-list .customer-name-middlename-suffix .name-firstname, .form-list .customer-name-middlename-suffix .name-lastname { width:205px; } .form-list .customer-name-prefix .name-firstname input.input-text, .form-list .customer-name-suffix .name-lastname input.input-text, .form-list .customer-name-middlename .name-firstname input.input-text, .form-list .customer-name-middlename-suffix .name-firstname input.input-text, .form-list .customer-name-middlename-suffix .name-lastname input.input-text { width:189px; } .form-list .customer-dob .dob-month, .form-list .customer-dob .dob-day, .form-list .customer-dob .dob-year { float:left; width:85px; } .form-list .customer-dob input.input-text { display:block; width:74px; } .form-list .customer-dob label { font-size:10px; font-weight:normal; color:#888; } .form-list .customer-dob .dob-day, .form-list .customer-dob .dob-month { width:60px; } .form-list .customer-dob .dob-day input.input-text, .form-list .customer-dob .dob-month input.input-text { width:46px; } .form-list .customer-dob .dob-year { width:140px; } .form-list .customer-dob .dob-year input.input-text { width:134px; } .group-select {} .group-select li { margin:0 0 5px; } .group-select .input-box { float:left; width:260px; } .group-select input.input-text, .group-select textarea {width:510px; } .group-select select { width:516px; } .group-select .input-box input.input-text, .group-select .input-box textarea { width:250px; } .group-select .input-box select { width:256px; } .buttons-set { clear:both; margin:5px 0 0; padding:5px; } .buttons-set .back-link { float:left; } .buttons-set button.button { float:right; } .buttons-set2 { clear:both; margin:5px 0 0; padding:5px; border:1px solid #ddd; text-align:right; } .fieldset { border:1px solid #C2DCE3; padding:22px 25px 12px 33px; margin:28px 0; } .fieldset .legend { float:left; font-weight:bold; font-size:13px; border:1px solid #C2DCE3; background:#fff; color:#044E6A; margin:-33px 0 0 -10px; padding:0 8px; position:relative; } /* Form Validation */ .validation-advice { clear:both; min-height:13px; margin:3px 0 0; padding-left:17px; font-size:11px; font-weight:bold; line-height:13px; background:url(../images/validation_advice_bg.gif) 2px 0 no-repeat; color:#eb340a; } .validation-failed { border:1px dashed #eb340a !important; background:#faebe7 !important; } .validation-passed {} p.required { font-size:11px; text-align:right; color:#EB340A; } /* Expiration date and CVV number validation fix */ .v-fix { float:left; } .v-fix .validation-advice { display:block; width:12em; margin-right:-12em; position:relative; } /* Global Messages */ .success { color:#3d6611; font-weight:bold; } .error { color:#f00; font-weight:bold; } .notice { color:#ccc; } .messages, .messages ul, .fieldset ul { list-style:none !important; margin:0 !important; padding:0 !important; } .messages { width:100%; overflow:hidden; } .messages li { margin:0 0 10px; } .messages li li { margin:0 0 3px; } .error-msg, .success-msg, .note-msg, .notice-msg { border-style:solid !important; border-width:1px !important; background-position:10px 10px !important; background-repeat:no-repeat !important; min-height:24px !important; padding:8px 8px 8px 32px !important; font-size:10px !important; font-weight:bold !important; } .error-msg { border-color:#f16048; background-color:#faebe7; background-image:url(../images/error_msg_icon.gif); color:#df280a; } .success-msg { border-color:#446423; background-color:#eff5ea; background-image:url(../images/success_msg_icon.gif); color:#3d6611; } .note-msg, .notice-msg { border-color:#fcd344; background-color:#fafaec; background-image:url(../images/note_msg_icon.gif); color:#3d6611; } /* BreadCrumbs */ .breadcrumbs { color: #2B646C; } .breadcrumbs li, .breadcrumbs ul, .breadcrumbs strong { display:inline; } .breadcrumbs a { color: #2B646C; } .breadcrumbs.empty { height: 10px; visibility: hidden; } /* Page Heading */ .page-title { } .title-buttons { text-align:right; } .title-buttons h1, .title-buttons h2, .title-buttons h3, .title-buttons h4, .title-buttons h5, .title-buttons h6 { float:left; } /* Pager */ .pager { position: relative; margin: 0 5px 10px 5px; padding: 3px 10px; line-height: 2em; text-align:center; border: 1px solid #A6D3DD; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; background: url(../images/interface/diagbg.png); } .pager p { margin: 0; } .pager .amount { float:left; } .pager .limiter { float:right; } .pager .pages { margin: 0 135px; } .pager .pages ol { display:inline; } .pager .pages li { display:inline; } .pager .pages .current {} /* Sorter */ .sorter { float: right; } .sorter fieldset { } .sorter p { margin: 0; } .sorter .view-mode { float:left; } .sorter .sort-by { float:right; } .sorter .link-feed {} /* Data Table */ .data-table { width:100%; } .data-table th { padding:5px; border-top:1px solid #3E8C97; font-weight:bold; white-space:nowrap; } .data-table td { padding:5px; border-top:1px solid #3E8C97; } .data-table thead {} .data-table tbody {} .data-table tfoot {} .data-table tr.first {} .data-table tr.last {} .data-table tr.odd {} .data-table tr.even {} .data-table tbody.odd {} .data-table tbody.odd td {} .data-table tbody.even {} .data-table tbody.even td {} .data-table tbody.odd tr.border td, .data-table tbody.even tr.border td { border-bottom-width:1px; } .data-table th .tax-flag { white-space:nowrap; font-weight:normal; } .data-table td.label, .data-table th.label { font-weight:bold; } .data-table td.value {} /* Generic Info Box */ .info-box { background:#fff url(../images/bkg_block-title.gif) 0 0 repeat-x; border:1px solid #d0cbc1; padding:12px 15px; margin:0 0 15px; } .info-box h2 { font-weight:bold; font-size:13px; } .info-table th { font-weight:bold; padding:2px 15px 2px 0; } .info-table td { padding:2px 0; } /* Shopping cart total summary row expandable to details */ tr.summary-total { cursor:pointer; } tr.summary-total td {} tr.summary-total .summary-collapse { float:right; text-align:right; padding-left:20px; background:url(../images/bkg_collapse.gif) 0 5px no-repeat; cursor:pointer; } tr.show-details .summary-collapse { background-position:0 -52px; } tr.show-details td {} tr.summary-details td { font-size:11px; background-color:#dae1e4; color:#626465; } tr.summary-details-first td { border-top:1px solid #d2d8db; } tr.summary-details-excluded { font-style:italic; } /* Shopping cart tax info */ /*.cart-tax-info, .cart-price { padding-right:20px; }*/ .cart-tax-total { cursor:pointer; } .cart-tax-total { padding-right:20px; background:url(../images/bg_collapse.gif) 100% 4px no-repeat; cursor:pointer; } .cart-tax-total-expanded { background-position:100% -52px; } /* Lists Decoration */ li.odd {} li.even {} dt.odd, dd.odd {} dt.even, dd.even {} /* Class: std - styles for admin-controlled content */ .std .subtitle { padding:0; } .std ol.ol { list-style:decimal outside; padding-left:1.5em; } .std ul.disc { list-style:disc outside; padding-left:18px; margin:0 0 10px; } .std dl dt { font-weight:bold; } .std dl dd { margin:0 0 10px; } .std ul, .std ol, .std dl, .std p, .std address, .std blockquote { margin:0 0 1em; padding:0; } .std ul { list-style:disc outside; padding-left:1.5em; } .std ol { list-style:decimal outside; padding-left:1.5em; } .std ul ul { list-style-type:circle; } .std ul ul, .std ol ol, .std ul ol, .std ol ul { margin:.5em 0; } .std dt { font-weight:bold; } .std dd { padding:0 0 0 1.5em; } .std blockquote { font-style:italic; padding:0 0 0 1.5em; } .std address { font-style:normal; } .std b, .std strong { font-weight:bold; } .std i, .std em { font-style:italic; } /* Downloadable Content Links */ .downloads { margin: 0 0 10px 0; } .download { clear:left; font-size:14px; line-height:32px; margin-bottom:3px; } .download a { text-decoration: none; } .download strong { font-family: "trajan-pro-1","trajan-pro-2",serif; font-weight: normal; line-height: 1.4; color: #0F7697; } .download img { vertical-align: middle; margin-right: 8px; } .download span, .download a span, .download li, .download p { font-size: 12px; color: #999; } .download p { margin-bottom: .5em; } .sidebar .download { border: 1px solid #A6D3DD; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px; background: #fff; padding: 10px; } .sidebar .download { line-height: 1.2; } .sidebar .download .arrow { display: block; padding-left: 40px; background: transparent url(../images/interface/download_arrow.png) no-repeat left top; } .sidebar .download .info { padding-left: 40px; background: transparent url(../images/interface/info_icon.png) no-repeat left top; } .sidebar .download a span { display: block; color: #999; } .sidebar .download li { list-style: inside disc; padding: 0 0 5px 0; } /* Awards */ .award { width:100%;overflow:hidden;margin-bottom:1em; border-bottom: 1px solid #D6E5E7; } .award img { float:left;margin: 0 1em 1em 0; } .award p { margin-left: 110px; text-align: justify; } .awardshort .award p { margin-left: 60px; } /* Floating */ .alignleft { float: left; margin: 2px 8px 0 0; } .alignright { float: right; margin: 2px 0 0 8px; } /* Misc */ .link-rss { background:url(../images/icon_rss.gif) 0 1px no-repeat; padding-left:18px; white-space:nowrap; } /* Noscript Notice */ .noscript { border:1px solid #ddd; border-width:0 0 1px; background:#ffff90; font-size:12px; line-height:1.25; text-align:center; color:#2f2f2f; } .noscript .noscript-inner { width:1000px; margin:0 auto; padding:12px 0 12px; background:url(../images/i_notice.gif) 20px 50% no-repeat; } .noscript p { margin:0; } /* ======================================================================================= */ /* Header ================================================================================ */ body > .header_container { position: fixed; top: 0; left: 0; } .header_container { background-color: #fff; height: 60px; width: 100%; z-index: 10005; } .header_shadow { position: fixed; top: 60px; left: 0; background: transparent url(../images/interface/header_shadow.png) repeat-x top center; height: 4px; width: 100%; z-index: 10001; } .header { width: 970px; margin: 0 auto; position: relative; } .header #logo { display: block; width: 236px; height: 35px; background: url(../images/interface/freshair_logo_header.png) no-repeat 0 0; float: left; margin-top: 12px; } .header #logo img { display: none; } .header_action { float: right; height: 60px; width: 715px; } .header .customer_links { float: right; background: #5CC0CE; height: 60px; text-align: right; padding: 0 6px 0 12px; } .header .customer_links ul { padding-top: 3px; } .header .customer_links li { line-height: 13px; font-size: 10px; text-transform: uppercase; } .header .customer_links a { color: #fff; text-decoration: none; } .header #scanalert { position: absolute; top: 10px; right: 175px; } /*.header .form-search { text-align:center; } .header .form-search .search-autocomplete { z-index:999; } .header .form-search .search-autocomplete ul { border:1px solid #ddd; background-color:#fff; } .header .form-search .search-autocomplete li { padding:3px; border-bottom:1px solid #ddd; cursor:pointer; } .header .form-search .search-autocomplete li .amount { float:right; font-weight:bold; } .header .form-search .search-autocomplete li.selected {} .header .form-language { text-align:center; }*/ .header #cart_mini { display: block; float: right; background: #fff url(../images/interface/arrow_blue.png) no-repeat 0 44px; width: 60px; height: 60px; padding: 0; margin: 0; font-family: "trajan-pro-1","trajan-pro-2",serif; font-weight: normal; text-align: center; position: relative; } .header #cart_mini span, .header #cart_mini_buttons span { display: none; } .header #cart_mini a.miniqty { display: block; line-height: 1em; font-size: 34px; width: 60px; position: absolute; bottom: 5px; left: 0; text-decoration: none; } .header #cart_mini a.miniqty span { display: block; font-size: 10px; line-height: 12px; text-transform: uppercase; } .header #cart_mini_buttons { position: absolute; top: 60px; right: 0; text-align: left; overflow: hidden; height: 20px } .header #cart_mini_buttons a { display: block; height: 20px; text-indent: -9999px; float: right; margin-left: 5px; } .header #cart_mini_buttons a.mini_view { width: 32px; background: transparent url(../images/interface/view_down.png) no-repeat top center; } .header #cart_mini_buttons a.mini_checkout { width: 56px; background: transparent url(../images/interface/mini_checkout.png) no-repeat top center; } /* Front Page Flash BG */ .widget_container, .widget_container a { color: #5CC0CE; text-align: center; } .widget_container { height: 340px; background: transparent url(../images/interface/translogo_large.png) no-repeat center center; } /********** < Navigation */ #nav { position: relative; float: left; width: 530px; font-size:11px; padding: 0; margin: 10px 0 0 0; text-transform: uppercase; } /* All Levels */ #nav li { text-align:left; } #nav a, #nav a:hover { display:block; line-height:1.3em; text-decoration:none; } #nav span { display:block; cursor:pointer; white-space:nowrap; } #nav li ul span {white-space:normal; } #nav li li.parent {} /* 0 Level */ #nav li, #nav a { float:left; height: 20px; } #nav li a.active { color:#06678B; } #nav li { margin-right: 5px; } #nav li.nav-learn { margin-right: 1px; padding-left: 6px; background: transparent url(../images/interface/header-nav-buttons-divider.png) no-repeat top left; } #nav li.nav-support { margin-right: 0; } #nav a { background: transparent url(../images/interface/header-nav-buttons.png) no-repeat top left; text-indent: -9999px; width: 95px; } #nav li.nav-purifiers a { background-position: 0 0; } #nav li.nav-purifiers a:hover, #nav li.nav-purifiers a.active { background-position: 0 -20px; } #nav li.nav-hvac-filters a { background-position: -95px 0; } #nav li.nav-hvac-filters a:hover, #nav li.nav-hvac-filters a.active { background-position: -95px -20px; } #nav li.nav-eco-home a { background-position: -190px 0; } #nav li.nav-eco-home a:hover, #nav li.nav-eco-home a.active { background-position: -190px -20px; } #nav li.nav-testing a { background-position: -285px 0; width: 95px; } #nav li.nav-testing a:hover, #nav li.nav-testing a.active { background-position: -285px -20px; } #nav li.nav-learn a { background-position: -380px 0; width: 60px; } #nav li.nav-learn a:hover, #nav li.nav-learn a.active { background-position: -380px -20px; } #nav li.nav-support a { background-position: -440px 0; width: 60px; } #nav li.nav-support a:hover, #nav li.nav-support a.active { background-position: -440px -20px; } /* Brands */ #nav li.nav-iqair, #nav li.nav-blueair, #nav li.nav-austin-air, #nav li.nav-allerair, #nav li.nav-airgle, #nav li.nav-amaircare, #nav li.nav-coway, #nav li.nav-airfree, #nav li.nav-royal-pedic { position: absolute; top: 26px; height: 15px; margin: 0; } #nav li.nav-iqair { left: 0; background: url(../images/interface/shop-brands-arrow.png) no-repeat center left; width: 84px; } #nav li.nav-iqair a { margin-left: 48px; background-position: 0 -40px; width: 36px; height: 15px; } #nav li.nav-iqair a:hover, #nav li.nav-iqair a.active { background-position: 0 -55px; } #nav li.nav-blueair { left: 84px; width: 47px; } #nav li.nav-blueair a { background-position: -36px -40px; width: 47px; height: 15px; } #nav li.nav-blueair a:hover, #nav li.nav-blueair a.active { background-position: -36px -55px; } #nav li.nav-austin-air { left: 131px; width: 60px; } #nav li.nav-austin-air a { background-position: -83px -40px; width: 60px; height: 15px; } #nav li.nav-austin-air a:hover, #nav li.nav-austin-air a.active { background-position: -83px -55px; } #nav li.nav-allerair { left: 191px; width: 47px; } #nav li.nav-allerair a { background-position: -143px -40px; width: 47px; height: 15px; } #nav li.nav-allerair a:hover, #nav li.nav-allerair a.active { background-position: -143px -55px; } #nav li.nav-airgle { left: 238px; width: 41px; } #nav li.nav-airgle a { background-position: -190px -40px; width: 41px; height: 15px; } #nav li.nav-airgle a:hover, #nav li.nav-airgle a.active { background-position: -190px -55px; } #nav li.nav-airfree { left: 279px; width: 47px; } #nav li.nav-airfree a { background-position: -231px -40px; width: 47px; height: 15px; } #nav li.nav-airfree a:hover, #nav li.nav-airfree a.active { background-position: -231px -55px; } #nav li.nav-royal-pedic { left: 326px; width: 70px; } #nav li.nav-royal-pedic a { background-position: -278px -40px; width: 70px; height: 15px; } #nav li.nav-royal-pedic a:hover, #nav li.nav-royal-pedic a.active { background-position: -278px -55px; } /********** Navigation > */ /* ======================================================================================= */ /* Sidebar =============================================================================== */ .block { margin-bottom: 20px; } /*.block .block-title h2 { font-size:16px; font-weight:bold; line-height:1.5; }*/ .block h3 { font-size:14px; line-height:1.5; } .block .block-content { } .block .actions { text-align:right; } .block .actions a { float:left; } /* Block: Account */ .block-account { border-color:#bbb; } .block-account .block-title { background:#53A323; border:0; padding:3px 10px; } .block-account .block-title strong { font-size:13px; color:#fff; } .block-account .block-content { padding:7px 10px 7px; } .block-account .block-content li a { display:block; border-bottom:1px solid #C2DCE3; padding:3px 0; color:#044E6A; text-decoration:none !important; } .block-account .block-content li a:hover { color:#53A323; } .block-account .block-content li.last a { border-bottom:0; } .block-account .block-content li.current { border-bottom:1px solid #C2DCE3; padding:3px 0; color:#53A323; } .block-account .block-content li.current.last { border-bottom:0; } /* Block: Currency Switcher */ .block-currency {} .block-currency select { width:100%; border:1px solid #888; } /* Block: Layered Navigation */ .block-layered-nav.block { margin: 0; } .block-layered-nav h2 { text-transform: capitalize; } .block-layered-nav h3 { } .block-layered-nav dt { margin:0; padding: 0; font-size:1.4em; } .block-layered-nav dd { padding: 0 0 12px 0; } .block-layered-nav dd li { margin-bottom:.3em; line-height:1.3em; color: #77C3CD; } .block-layered-nav .label { font-weight:bold; padding-left: 8px; } .block-layered-nav ol.currently li { font-size: .9em; line-height: 20px; margin-bottom: 4px; height: 20px; overflow: hidden; width: 230px; background: transparent url(../images/interface/filter-left.png) no-repeat center center; } .block-layered-nav ol.currently li a { margin: 0; float: right; width: 20px; height: 20px; overflow: hidden; background: url(../images/interface/filter-right-x.png) no-repeat top left; text-indent: -9999px; } .block-layered-nav ol.currently li a:hover { background-position: bottom left; } .block-layered-nav ol.currently li a img { display: none; } .block-layered-nav .actions { margin-bottom: 10px; } .block-layered-nav .actions a { float: right; font-size: .9em; text-decoration: none; margin-right: 8px; } .block-layered-nav a { text-decoration: none; border-bottom: 1px dotted #77C3CD; } .block-layered-nav .active { font-weight: bold; } .block-nav .block-content li { display: block; height: 30px; margin-bottom: 3px; width: 230px; } .block-nav .block-content a { display: block; height: 23px; padding: 7px 0 0 25px; text-decoration: none; background: transparent url(../images/interface/right-menu-arrow.png) no-repeat 0 0; color: #fff; overflow: hidden; white-space: nowrap; font-family: "trajan-pro-1","trajan-pro-2",serif; font-weight: normal; } .block-nav .block-content a:hover { color: #fff; background-position: 0 -30px; text-decoration: none; } .block-nav .block-content a.active, .block-nav .block-content a.active:hover { color: #fff; background-position: 0 -60px; } /* Isolate Media & Download Links */ li.sidenav-learn-iqair-downloads, li.sidenav-iqair-iqair-replacement-filters, li.sidenav-blueair-blueair-replacement-filters, li.sidenav-austin-air-austin-air-replacement-filters, li.sidenav-allerair-allerair-replacement-filters { border-top: 1px dotted #B1D9E1; padding-top: 10px; margin-top: 10px; } /* Block: Cart */ .block-cart {} .block-cart .amount { font-size: 90%; line-height: 1.6; display: block; margin: 6px 0 12px 0; padding: 6px 0; font-weight: normal; border: 1px solid #49A2AF; border-left: none; border-right: none; } .block-cart .subtotal { } .mini-products-list li { padding:5px 0; } /*.mini-products-list .product-image { float:left; width:50px; padding:5px; border:1px solid #ddd; margin-right:-75px; } .mini-products-list .product-details { margin-left:75px; }*/ .mini-products-list .product-details h5 { font-size:1em; font-weight:bold; margin:0; } .mini-products-list .product-details .btn-remove { float:right; } /* Block: Wishlist */ .block-wishlist {} /* Block: Related */ .block-related h2 { margin-bottom: 0; } .block-related .note { margin: 0; background: #ffd; padding: 6px; line-height: 1.1; font-size: 90%; } .block-related li { padding: 10px 0 0 0; display: block; width: 100%; overflow: hi; background: transparent; border-bottom: 1px dotted #A6D3DD; } .block-related input.checkbox { float:right; } .block-related div.item { margin-right:20px; } .block-related strong a { text-decoration: none; font-size: 1.1em; line-height: 1.2; display: block; } .block-related .item .product-image { float: left; margin: 5px 5px 10px 0; border: 1px solid #A6D3DD; } .block-related p { margin: 0; } /* Block: Compare Products */ .block-compare {} .block-compare li { padding:5px 0; } /* Block: Viewed */ .block-viewed ol { list-style:decimal outside; padding-left:1.5em; margin:.5em 0; } .block-viewed ol p { margin: 0; } /* Block: Poll */ .block-poll {} .block-poll input.radio { float:left; margin:3px -18px 0 0; } .block-poll .label { display:block; margin-left:18px; } .block-poll .answer {} .block-poll .votes { font-weight:bold; } /* Block: Tags */ .block-tags ul, .block-tags li { display:inline; } /* Block: Subscribe */ .block-subscribe { text-align: left; padding: 0 10px; } .block-subscribe h2 { } /* Block: Reorder */ .block-reorder {} .block-reorder li { padding:5px 0; } .block-reorder input.checkbox { float:left; margin:3px -20px 0 0; } .block-reorder .label { display:block; margin-left:20px; } /* Block: Banner */ .block-banner {} .block-banner .block-content { text-align:center; } /* Block: Login */ .block-login .block-title strong { background-image:url(../images/i_ma-info.gif); } .block-login .block-content { padding:5px 10px; } .block-login label { font-weight:bold; color:#666; } .block-login input.input-text { display:block; width:167px; margin:3px 0; } .block-login .actions { background:none; padding:0; margin:3px 0 0; } .block-login .actions button.button span { border-color:#406a83; background:#618499; } /* Paypal */ .sidebar .paypal-logo { display:block; margin:10px 0; text-align:center; } .sidebar .paypal-logo a { float:none; } /* ======================================================================================= */ /* Category Page ========================================================================= */ .category-title { } .category-image { display:block; margin:0 auto; } .category-products {} /* View Type: Grid */ .products-grid { width:100%; } .products-grid tr.odd {} .products-grid tr.even { } .products-grid td { width:25%; padding: 0 5px 15px 5px; } .products-grid td.empty {} .products-grid .product-image { border: 1px solid #A6D3DD; display: block; border-bottom: none;} .products-grid .product-image img { border: 9px solid #fff; display: block; } .products-grid .price-label { display: none; } .products-grid h3.product-name { display: block; font-size: 1em; margin-bottom: 5px; font-weight: bold; line-height: 1.2; text-align: center; } .products-grid#new-products-list-table { width: 660px; } .products-grid#new-products-list-table td { width:25%; padding: 0 0 5px 5px; } .products-grid .product-details-link { background: #fff; padding-bottom: 9px; overflow: hidden; line-height: 1; border: 1px solid #A6D3DD; border-top: none; } .products-grid .product-details-link a.details-link { float: right; padding-right: 8px; } .products-grid .product-details-link .price-box { float: left; width: 60px; padding: 5px 0 0 8px; } .products-grid .product-details-link .price-box .old-price { color: #ccc; } .products-grid .product-details-link .price-box .special-price { color: #67C1CD; } /* View Type: List */ .products-list li.item { padding:5px; margin:0 0 5px; } .products-list .product-image { float:left; } .products-list .product-shop { float:right; width:320px; } /* Single Product Widget */ .single-product .product-image { border: 1px solid #A6D3DD; display: block; border-bottom: none;} .single-product .product-image img { border: 9px solid #fff; display: block; } .single-product .price-label { display: none; } .single-product h3.product-name { display: block; font-size: 1em; margin-bottom: 5px; font-weight: bold; line-height: 1.2; text-align: center; } .single-product .product-details-link { background: #fff; padding-bottom: 9px; overflow: hidden; line-height: 1; border: 1px solid #A6D3DD; border-top: none; } .single-product .product-details-link a.details-link { float: right; padding-right: 8px; } .single-product .product-details-link .price-box { float: left; width: 60px; padding: 5px 0 0 8px; } .single-product .product-details-link .price-box .old-price { color: #ccc; } .single-product .product-details-link .price-box .special-price { color: #67C1CD; } /* Rounded Product Grids */ .single-product .product-image, .single-product .product-image img, .products-grid .product-image, .products-grid .product-image img { border-radius-topleft: 8px; -moz-border-radius-topleft: 8px; -webkit-border-radius-topleft: 8px; border-radius-topright: 8px; -moz-border-radius-topright: 8px; -webkit-border-radius-topright: 8px; } .single-product .product-details-link, .products-grid .product-details-link { border-radius-bottomleft: 8px; -moz-border-radius-bottomleft: 8px; -webkit-border-radius-bottomleft: 8px; border-radius-bottomright: 8px; -moz-border-radius-bottomright: 8px; -webkit-border-radius-bottomright: 8px; } /* ======================================================================================= */ /* Product View ========================================================================== */ .product-view {} .product-essential {} .product-collateral {} /* Product Images */ .product-view .product-img-box { float:left; width:275px; } .product-view .product-img-box .main-view { height: 275px; background: url(../images/opc-ajax-loader.gif) no-repeat center center; } .product-view .product-img-box .product-image img, .product-view #product_video a img { display: block; background-color:#fff; border: 1px solid #ddd; padding: 9px; -moz-border-radius:4px; -webkit-border-radius:4px; } .product-view .product-img-box .product-image a:hover img, .product-view #product_video a:hover img { border-color: #A6D3DD; } .more-views { padding: 0; border-left: none; border-right: none; width: 100%; overflow: hidden; } .more-views ul { margin-left: -5px } .more-views li { float:left; margin: 5px 0 0 5px; } .more-views li img { display: block; background-color:#fff; padding: 2px; border: 1px solid #ddd; -moz-border-radius:4px; -webkit-border-radius:4px; } .more-views li a:hover img, .more-views li a.active img { border-color: #A6D3DD; } /* Product Shop */ .product-view .product-shop { float:right; width:385px; } .product-view .product-shop .availability { float: right; display: block; width: 175px; text-align: right; } .product-view .product-shop .special-price { font-size: 120%; border-bottom: 2px solid #A6D3DD; margin-bottom: 10px; padding-bottom: 10px; } .product-view .product-name {} .product-view .short-description { margin-bottom: 10px; } #product_video { margin: 20px 0; } /* Rating */ .ratings {} .ratings .amount {} .ratings .rating-links {} .ratings dt {} .ratings dd {} .rating-box { width:69px; height:13px; font-size:0; line-height:0; background:url(../images/bg_rating.gif) 0 0 repeat-x; position:relative; overflow:hidden; } .rating-box .rating { position:absolute; top:0; left:0; height:13px; background:url(../images/bg_rating.gif) 0 100% repeat-x; } /* Front Page Brands Display [DELETE] THIS NEXT UPDATE */ #brands_display { display: block; background: #EFF9FA url(../images/interface/brands_alpha.jpg) no-repeat top center; width: 969px; position: relative; margin: 0; padding: 0 0 0 1px; overflow: hidden; font-size: 90%; } #brands_display li { display: block; width: 138px; float: left; list-style: none; } #brands_display li a { display: block; height: 162px; overflow: hidden; text-indent: -9999px; } #brands_display li ul { margin: 0; padding: 0; } #brands_display li ul li { border-bottom: 1px solid #A6D3DD; margin: 0 4px; width: 130px; text-align: center; display: inline; } #brands_display li ul a { height: auto; text-indent: 0; padding: 5px 0; line-height: 1; text-decoration: none; } #brands_display li ul a:hover { text-decoration: underline; } /* Front Page Brands Slider Display */ #fresh-slider { position: relative; } #fresh-slider .scroller { width: 930px; height: 340px; overflow: hidden; margin: 0 20px; position: relative; clear: left; } #fresh-slider .scroller .content { width: 9999px; } #fresh-slider .scroller .panel { width:930px; height:340px; overflow:hidden; background: transparent url(../images/interface/slider_infobg.jpg) no-repeat top right; float: left; position: relative; } #fresh-slider .scroller .panel a.img { float: left; width: 680px; } #fresh-slider .scroller .panel .feature { float: right; margin: 40px 20px 0 0; width: 210px; color: #CFF4FF; text-align: left; font-size: 1em; font-family: "hypatia-sans-pro-1","hypatia-sans-pro-2",sans-serif; text-shadow: #355C6B 1px 1px 1px; font-weight: normal; } #fresh-slider .scroller .panel .feature strong { font-size: 2.5em; line-height: 1.5; color: #fff; display: block; margin-bottom: .2em; font-family: "trajan-pro-1","trajan-pro-2",serif; } #fresh-slider .scroller .panel .feature a { float: none; font-size: 1.1em; color: #EFF9FA; text-decoration: none; border-bottom: 1px solid #5D8B9B; } #fresh-slider .scroller .panel .feature a:hover { color: #fff; text-decoration: none; border-bottom: 1px solid #7FB4C6; } #fresh-slider .scroller .panel .feature p.jumpto { padding-top: 10px; font-family: "trajan-pro-1","trajan-pro-2",serif; } #fresh-slider .controls li.selected a.control { background: transparent url(../images/interface/brands_slidercontrol_over.jpg) no-repeat -1px 0px; outline: none; } #fresh-slider .controls li#tab-iqair.selected a.control { background-position: -139px 0px; } #fresh-slider .controls li#tab-blueair.selected a.control { background-position: -277px 0px; } #fresh-slider .controls li#tab-austin.selected a.control { background-position: -415px 0px; } #fresh-slider .controls li#tab-allerair.selected a.control { background-position: -553px 0px; } #fresh-slider .controls li#tab-airgle.selected a.control { background-position: -691px 0px; } #fresh-slider .controls li#tab-coway.selected a.control { background-position: -829px 0px; } #fresh-slider .controls { display: block; background: #EFF9FA url(../images/interface/brands_slidercontrol.jpg) no-repeat top center; width: 969px; position: relative; margin: 0; padding: 0 0 0 1px; overflow: hidden; font-size: 90%; color: #3E8C97; } #fresh-slider .controls li { display: block; width: 138px; float: left; list-style: none; } #fresh-slider .controls li a { display: block; height: 162px; overflow: hidden; text-indent: -9999px; } #fresh-slider .controls li ul { margin: 0; padding: 0; } #fresh-slider .controls li ul li { border-bottom: 1px solid #A6D3DD; margin: 0 4px; padding: 5px 0; width: 130px; text-align: center; display: inline; } #fresh-slider .controls li.selected ul li { border-bottom: 1px solid #355C6B; } #fresh-slider .controls li ul a { display: inline; height: auto; text-indent: 0; line-height: 1; text-decoration: underline; } #fresh-slider .controls li ul a:hover { text-decoration: underline; } /* Availability */ .availability { margin:0; } .availability span { font-weight:bold; } .availability.in-stock span {} .availability.out-of-stock span { color:#d83820; } .availability-only { margin:10px 0 7px; line-height:16px; background:url(../images/i_availability_only.gif) 0 50% no-repeat; padding-left:15px; } .availability-only span, .availability-only a { border-bottom:1px dashed #751d02; color:#000; cursor:help; } .availability-only a { background:url(../images/i_availability_only_arrow.gif) 100% 0 no-repeat; cursor:pointer; padding-right:15px; text-decoration:none; } .availability-only .expanded { background-position:100% -15px; } .availability-only strong { color:#be2c00; } .availability-only-details { margin:0 0 7px; } .availability-only-details th { background:#d2d6d9; font-size:10px; padding:0 8px; } .availability-only-details td { background:#ebf0f3; border-bottom:1px solid #fff; font-size:11px; padding:2px 8px 1px; } .availability-only-details tr.odd td.last { color:#d95e00; font-weight:bold; } .product-view .product-shop .availability { font-size:11px; } .product-view .product-shop .availability span { font-weight:normal; } /* Email to a Friend */ .email-friend { margin:0; } /* Alerts */ .alert-price { margin:0; font-size:11px; } .alert-stock { margin:0; font-size:11px; } /********** < Product Prices */ .price { white-space:nowrap !important; } .price-box {} .price-box p { margin: 0; } .price-box .price { font-weight:bold; } .price-box-bundle {} /* Regular price */ .regular-price {} .regular-price .price { font-weight:bold; } /* Old price */ .old-price { color: #A6D3DD; } .old-price .price-label { white-space:nowrap; } .old-price .price { font-weight:bold; text-decoration:line-through; } /* Special price */ .special-price { color: #55A624; } .special-price .price-label { font-weight:bold; white-space:nowrap; } .special-price .price { font-weight:bold; } /* Minimal price (as low as) */ .minimal-price {} .minimal-price .price-label { font-weight:bold; white-space:nowrap; } a.minimal-price-link { display:block; } a.minimal-price-link .label {} a.minimal-price-link .price { font-weight:normal; } /* Excluding tax */ .price-excluding-tax { display:block; } .price-excluding-tax .label { white-space:nowrap; } .price-excluding-tax .price { font-weight:normal; } /* Including tax */ .price-including-tax { display:block; } .price-including-tax .label { white-space:nowrap; } .price-including-tax .price { font-weight:bold; } /* FPT */ .weee { display:block; font-size:11px; color:#444; } .weee .price { font-size:11px; font-weight:normal; } /* Excl tax (for order tables) */ .price-excl-tax { display:block; } .price-excl-tax .label { display:block; white-space:nowrap; } .price-excl-tax .price { display:block; } /* Incl tax (for order tables) */ .price-incl-tax { display:block; } .price-incl-tax .label { display:block; white-space:nowrap; } .price-incl-tax .price { display:block; font-weight:bold; } /* Price range */ .price-from { margin:0; } .price-from .price-label { font-weight:bold; white-space:nowrap; } .price-to { margin:0; } .price-to .price-label { font-weight:bold; white-space:nowrap; } /* Price notice next to the options */ .price-notice { padding-left:10px; color:#999; } .price-notice .price { font-weight:bold; color:#2f2f2f; } /* Price as configured */ .price-as-configured { margin:0; } .price-as-configured .price-label { font-weight:bold; white-space:nowrap; } .price-box-bundle { padding:0 0 10px 0; } .price-box-bundle .price-box { margin:0 !important; padding:0 !important; } .price-box-bundle .price { color:#555; } /********** Product Prices > */ /* Tier Prices */ .tier-prices .price { font-weight:bold; } .tier-prices .benefit {} /* Add to Links */ .add-to-links { font-size: .9em; } .add-to-links li { display: inline; } /*.add-to-links .separator { display:none; }*/ /* Add to Cart */ .add-to-cart label { float:left; margin: 4px 5px 0 0; } .add-to-cart .qty { float:left; margin: 3px 0 0 0; } .add-to-cart button.button { float:left; margin-left:5px; } .add-to-cart .paypal-logo { clear:left; margin:0; padding:10px 0 0; text-align:right; } /* Add to Links + Add to Cart */ .add-to-box, .add-to-box-options { padding: 10px 0; margin: 0 0 10px 0; border: 3px solid #A6D3DD; border-left: none; border-right: none; border-bottom-width: 1px; overflow: hidden; } /*.add-to-box .add-to-cart, .add-to-box-options .product-options-bottom { float:left; } .add-to-box .or, .add-to-box-options .or { float:left; margin: 4px 10px 0 10px; } .add-to-box .add-to-links, .add-to-box-options .add-to-links { float:left; margin: 4px 0 0 0; }*/ /* Product Options */ .product-options { border-bottom: 1px solid #A6D3DD; padding-bottom: 10px; margin-bottom: 10px; overflow: hidden; } .product-options dt { float: left; width: 70px; } .product-options dt label { font-weight:bold; } .product-options dt .qty-holder { float:right; } .product-options dt .qty-holder label { vertical-align:middle; } .product-options dt .qty-disabled { background:none; border:0; padding:3px; color:#000; } .product-options dd { margin: 0 0 5px 80px; padding-bottom: 5px; border-bottom: 1px dotted #B1E1E7; } .product-options dl.last dd.last { margin-bottom: 0; padding-bottom: 0; border-bottom: none; } .product-options dd input.input-text { width:98%; } .product-options dd textarea { width:98%; height:8em; } .product-options dd select { /*width:100%;*/ } .product-options .options-list {} .product-options .options-list input.radio { float:left; margin:3px -18px 0 0; } .product-options .options-list input.checkbox { float:left; margin:3px -20px 0 0; } .product-options .options-list .label { display:block; margin-left:20px; } .product-options ul.validation-failed { padding:0 7px; } .product-options p.required { display: none; } /* Grouped Product */ .grouped-items {} /* Block: Description */ .product-view .description {} /* Block: Additional */ .product-view .additional {} /* Block: Upsell */ .product-view .up-sell {} .product-view .up-sell .products-grid td { width:25%; } /* Block: Tags */ .product-view .tags {} .product-view .tags .form-add-tags label { float:left; } .product-view .tags .form-add-tags .input-box { float:left; width:260px; margin:0 5px; } .product-view .tags .form-add-tags input.input-text { width:254px; } .product-view .tags .form-add-tags button.button { vertical-align:bottom; } .product-view .tags .form-add-tags p { clear:both; } /* Block: Reviews */ .product-view .reviews {} /* Block: Add Review */ .product-view .add-review {} .product-view .add-review .product-name span { font-weight:normal; } /* ======================================================================================= */ /* Content Styles ================================================================= */ h3.product-name { display: block; font-size:1.1em; font-weight:bold; line-height:1.4; margin: 5px 0; padding: 0; font-family: Arial, Helvetica, sans-serif; } h3.product-name a { text-decoration: none; } /* Product Tags */ .tags-list li { display:inline; } /* Advanced Search */ .search-summary {} /* CMS Home Page */ .cms-home .products-grid td { width:20%; } /* Sitemap */ .sitemap {} /* ======================================================================================= */ /* Product Review ======================================================================== */ .product-review {} .product-review .product-img-box { float:left; width:140px; } .product-review .product-img-box .product-image { display:block; border:1px solid #ddd; padding:1px; } .product-review .details { float:right; width:570px; } /* ======================================================================================= */ /* Shopping Cart ========================================================================= */ .cart .page-title { border-bottom:0; margin:0 0 12px; } .cart .page-title h1 { margin:10px 0 0; } /* Checkout Types */ .cart .page-title .checkout-types li { margin:0 0 5px; } .cart .title-buttons .checkout-types { float:right; } .cart .title-buttons .checkout-types li { float:left; margin:0 0 5px 5px; } /* Shopping Cart Table */ .cart-table th { padding:2px 10px; } .cart-table td { padding:10px; } .cart-table .product-name { font-weight:bold; margin:0 0 5px; color:#2f2f2f; } .cart-table .item-msg { margin:5px 0; font-size:11px; font-weight:bold; color:#df280a; } .cart-table tfoot td { padding:5px 10px; } .cart-table .btn-continue { float:left; } /* Shopping Cart Collateral boxes */ .cart .cart-collaterals { padding:25px 0 0; } .cart .cart-collaterals .col2-set { float:left; width:605px; } .cart .cart-collaterals .col2-set .col-2 { width:294px; } .cart .crosssell { border:1px solid #cec3b6; background:#fafaec; padding:12px 15px; } .cart .crosssell h2 { font-size:13px; font-weight:bold; } .cart .crosssell .product-image { float:left; width:75px; height:75px; border:1px solid #d0cdc9; } .cart .crosssell .product-details { margin-left:90px; } .cart .crosssell .product-name { font-weight:bold; } .cart .crosssell li.item { margin:12px 0; } .cart .crosssell .link-compare { font-weight:normal; } /* Discount Codes & Estimate Shipping and Tax Boxes */ .cart .discount, .cart .shipping { border:1px solid #3E8C97; background:#fff; padding:12px 15px; margin:0 0 18px; } .cart .discount .buttons-set, .cart .shipping .buttons-set { margin:10px 0 0; border:0; padding:0; text-align:left; } .cart .discount .buttons-set button.button, .cart .shipping .buttons-set button.button { float:none; margin:10px 0 0 0; } .cart .discount .input-box { margin:8px 0 0; width:260px; } .cart .discount input.input-text { width:254px; } /* Shopping Cart Totals */ .cart .totals { float:right; width:300px; background:#fff; border:1px solid #53A323; } .cart .totals table { width:100%; margin:7px 0; } .cart .totals td { padding:1px 15px 1px 7px; } .cart .totals tr.last td {} .cart .totals tfoot th { padding:5px 15px 5px 7px; } .cart .totals tfoot td { padding-top:5px; padding-bottom:5px; } .cart .totals tfoot th strong, .cart .totals tfoot td strong { font-size:15px; } .cart .totals .checkout-types { font-size:13px; padding:8px 15px 15px; text-align:right; } .cart .totals .checkout-types li { clear:both; margin:10px 0; } /* Options Tool Tip */ .item-options dt { font-weight:bold; font-style:italic; } .item-options dd { padding-left:10px; margin:0 0 6px; } .truncated { cursor:help; } .truncated a.dots { cursor:help; } .truncated a.details { cursor:help; } .truncated .truncated_full_value { position:relative; z-index:999; } .truncated .truncated_full_value dl { position:absolute; top:-99999em; left:-99999em; z-index:999; width:250px; padding:8px; border:1px solid #ddd; background-color:#3B5E6D; } .truncated .show dl { top:-20px; left:50%; } .col-left .truncated .show dl { left:15px; top:7px; } .col-right .truncated .show dl { left:-240px; top:7px; } /* ======================================================================================= */ /* Checkout ============================================================================== */ /* One Page Checkout */ .block-progress { border:0; margin:0; } .block-progress .block-title { background:none; border:0; padding:0; margin:0 0 5px; } .block-progress .block-title strong { font-size:13px; color:#0a263c; } .block-progress .block-content { background:none; } .block-progress dt { font-size:13px; font-weight:bold; line-height:1.35; background:#EFF9FA; border:1px solid #D7F0F3; margin:0 0 6px; padding:2px 8px; color:#B5D8DF; } .block-progress dd { background:#fff; border:1px solid #D7F0F3; border-top:0; padding:8px 13px; margin:0 0 6px; } .block-progress dt.complete { margin:0; background:#fff; color:#044E6A; } .block-progress dt.complete .separator { color:#B5D8DF; } .block-progress dd.complete {} .block-progress p { margin:0; } .opc .buttons-set { margin-top:0; padding-top:2em; } .opc .buttons-set p.required { margin:0; padding:0 0 10px; } .opc .buttons-set .back-link small { display:none; } .opc .buttons-set .back-link a {} .opc .buttons-set.disabled button.button { display:none; } .opc .buttons-set .please-wait { height:21px; line-height:21px; } .opc .ul { list-style:disc outside; padding-left:18px; } .opc { border-bottom:1px solid #EFF9FA; position:relative; } .opc li.section { border:1px solid #EFF9FA; border-bottom:0; } .opc .step-title { background-color:#3E8C97; padding:0 5px; text-align:right; color: #fff; } .opc .step-title .number { float:left; line-height: 28px; margin-right:5px; } .opc .step-title a { display: none; } .opc .step-title h2 { float:left; color: #fff; padding: 0; margin: 0; line-height: 28px; } .opc .allow .step-title { cursor:pointer; } .opc .active {} .opc .active .step-title { background-color:#47901F; cursor:default; } .opc .step { border-top:1px solid #EFF9FA; padding:10px; position:relative; } .opc .step .tool-tip { right:10px; } .opc .order-review {} #opc-login .buttons-set { border-top:0; } #opc-login h3 { font-size:13px; padding-bottom:2px; text-transform:uppercase; } #opc-login h4 { font-size:1em; font-weight:bold; margin:0; color:#2f2f2f; } #opc-shipping_method .buttons-set { border-top:0; } .opc .gift-messages-form { margin:0 -30px; background:#f6f1eb; border:1px solid #e9e4de; border-width:1px 0; padding:22px 24px 22px 30px; } .opc .gift-messages-form .inner-box { padding:5px; height:260px; overflow:auto; } #opc-review .step { border:0; padding:0; } #opc-review .product-name { font-weight:bold; color:#0a263c; } #opc-review .item-options { margin:5px 0 0; } #opc-review .buttons-set { padding:20px 30px; border:1px solid #47901F; } #opc-review .buttons-set p { margin:0; line-height:40px; } #opc-review .buttons-set .please-wait { height:40px; line-height:40px; } /* Multiple Addresses Checkout */ .checkout-progress { padding:0 50px; margin:10px 0; } .checkout-progress li { float:left; width:20%; border-top:5px solid #ccc; text-align:center; color:#ccc; } .checkout-progress li.active { border-top-color:#000; color:#000; } .multiple-checkout { position:relative; } .multiple-checkout .tool-tip { top:50%; margin-top:-120px; right:10px; } .multiple-checkout .grand-total { font-size:1.5em; text-align:right; } .multiple-checkout .grand-total big {} .multiple-checkout .grand-total .price {} /********** < Common Checkout Styles */ /* Shipping and Payment methods */ .sp-methods { margin:0 0 8px; } .sp-methods dt { margin:13px 0 5px; font-weight:bold; } .sp-methods dd {} .sp-methods dd li { margin:5px 0; } .sp-methods label { font-weight:bold; color:#666; } .sp-methods .price { font-weight:bold; } .sp-methods .form-list { padding-left:20px; } .sp-methods .form-list li { margin:0 0 8px; } .sp-methods select.month { width:154px; margin-right:10px; } .sp-methods select.year { width:96px; } .sp-methods input.cvv { width:3em !important; } .sp-methods .checkmo-list li { margin:0 0 5px; } .sp-methods .checkmo-list label { width:135px; padding-right:10px; text-align:right; } .sp-methods .checkmo-list address { float:left; } .sp-methods .centinel-logos a { margin-right:3px; } .sp-methods .centinel-logos img { vertical-align:middle; } .please-wait { float:right; } .please-wait img { vertical-align:middle; } .cvv-what-is-this { font-size:11px; cursor:help; margin-left:10px; } /* Tooltip */ .tool-tip { border:1px solid #ddd; background-color:#f6f6f6; padding:5px; position:absolute; z-index:9999; } .tool-tip .btn-close { text-align:right; } .tool-tip .tool-tip-content { padding:5px; } /* Gift Messages */ .add-gift-message {} .gift-message-form { border:1px solid #ddd; background-color:#f5f5f5; } .gift-message-form .inner-box { padding:5px; height:300px; overflow:auto; } .gift-message-form .gift-item {} .gift-message-link { display:block; background:url(../images/bg_collapse.gif) 0 4px no-repeat; padding-left:20px; } .gift-message-link.expanded { background-position:0 -53px; } .gift-message-row {} .gift-message-row .btn-close { float:right; } .gift-message dt strong { font-weight:bold; } /* Checkout Agreements */ .checkout-agreements li { margin:30px 0; } .checkout-agreements .agreement-content { overflow:auto; height:12em; padding:10px; background-color:#fbfaf6; border:1px solid #bbb6a5; } .checkout-agreements .agree { margin:0; padding:10px 0 10px 11px; } .checkout-agreements .agree input.checkbox { margin-right:6px; } .checkout-agreements .agree label { font-weight:bold; color:#666; } .opc .checkout-agreements { border:1px solid #d9dde3; border-width:0 1px; padding:5px 30px; } .opc .checkout-agreements li { margin:20px 0 0; } .opc .checkout-agreements .agreement-content { background-color:#fff; border-color:#e4e4e4; padding:5px; } .opc .checkout-agreements .agree { padding-left:6px; } /* Centinel */ .centinel {} .centinel .authentication { border:1px solid #ddd; background:#fff; } .centinel .authentication iframe { width:99%; height:400px; background:transparent !important; margin:0 !important; padding:0 !important; border:0 !important; } .opc .centinel { border:1px solid #bbb6a5; border-width:0 1px 1px; padding:10px 30px; } /********** Common Checkout Styles > */ /* ======================================================================================= */ /* Account Login/Create Pages ============================================================ */ .account-login {} .account-login .new-users {} .account-login .registered-users {} .account-create {} /* Account Login/Create Pages ============================================================ */ /* My Account ============================================================================= */ /********** < Dashboard */ .dashboard {} .dashboard .welcome-msg {} /* Block: Recent Orders */ .dashboard .recent-orders { margin:10px 0; } /* Block: Tags */ .dashboard .tags .number { float:left; margin-right:-20px; } .dashboard .tags .details { margin-left:20px; } /* Block: Reviews */ .dashboard .reviews {} /********** Dashboard > */ /* Order View */ .order-info { border:1px solid #ddd; padding:5px; } .order-info dt, .order-info dd, .order-info ul, .order-info li { display:inline; } .order-info .current { font-weight:bold; } .order-info li { margin:0 3px; } .order-date { margin:10px 0; } .order-info-box { background:#fff url(../images/bkg_block-title.gif) 0 0 repeat-x; border:1px solid #d0cbc1; padding:12px 15px; margin:0 0 15px; } .order-info-box h2 { font-weight:bold; font-size:13px; } .order-info-box .box-payment p { margin:0 0 3px; } .order-info-box .box-payment th { font-weight:bold; padding-right:7px; } .order-items { width:100%; overflow-x:auto; } .order-items h2, .order-items h3 { font-weight:bold; font-size:13px; } .order-items .product-name { font-size:1em !important; font-weight:bold !important; } .order-items .link-print { float:right; color:#1e7ec8; font-weight:normal; } .order-items p .link-print { float:none; } .order-gift-message { margin:15px 0; } .gift-message dt strong { color:#666; } .gift-message dd { margin:5px 0 0; font-size:13px; } .order-about { margin:15px 0; } .order-about dt { font-weight:bold; } .order-about dd { font-size:13px; margin:0 0 7px; } .tracking-table { margin:0 0 15px; } .tracking-table th { font-weight:bold; white-space:nowrap; } .tracking-table th, .tracking-table td { padding:1px 5px 0 0; } .tracking-table-popup { width:100%; } .tracking-table-popup th { font-weight:bold; white-space:nowrap; } .tracking-table-popup th, .tracking-table-popup td { padding:1px 8px; } /* Order Print Pages */ .page-print .print-head { margin:0 0 15px; } .page-print .print-head .logo { float:left; } .page-print .print-head address { float:left; margin-left:15px; } .page-print h1 { font-size:16px; font-weight:bold; } .page-print h2, .page-print h3 { font-size:13px; font-weight:bold; } .page-print h2.h2 { font-size:16px; font-weight:bold; } .page-print .order-date { padding:0 0 10px; margin:0 0 10px; } .page-print .col2-set { margin:0 0 10px; } /* Price Rewrites */ .page-print .gift-message-link { display:none; } .page-print .price-excl-tax, .page-print .price-incl-tax { display:block; white-space:nowrap; } .page-print .cart-price, .page-print .price-excl-tax .label, .page-print .price-incl-tax .label, .page-print .price-excl-tax .price, .page-print .price-incl-tax .price { display:inline; } /* My Wishlist */ .my-wishlist .data-table td { padding:10px; } .my-wishlist .product-image { display:block; width:113px; height:113px; margin:0 0 5px; } .my-wishlist textarea { display:block; width:97%; height:109px; } .my-wishlist .buttons-set { margin-top:2em; } .my-wishlist .buttons-set button.button { float:none; } .my-wishlist .buttons-set .btn-add span, .my-wishlist .buttons-set .btn-share span { border-color:#406a83; background:#618499; } #wishlist-table .add-to-links { white-space:nowrap; } /* My Tags */ .my-tag-edit { float:left; margin:0 0 10px; } .my-tag-edit .btn-remove { float:right; margin:5px 0 0 5px; } #my-tags-table { clear:both; } #my-tags-table td { padding:10px; } #my-tags-table .add-to-links { white-space:nowrap; } /* My Reviews */ #my-reviews-table td { padding:10px; } .product-review .product-img-box { float:left; width:140px; } .product-review .product-img-box .product-image { display:block; width:125px; height:125px; } .product-review .product-img-box .label { font-size:11px; margin:0 0 3px; } .product-review .product-img-box .ratings .rating-box { float:none; display:block; margin:0 0 3px; } .product-review .product-details { margin-left:150px; } .product-review .product-name { font-size:16px; font-weight:bold; margin:0 0 10px; } .product-review h3 { font-size:12px; margin:0 0 3px; color:#2f2f2f; } .product-review .ratings-table { margin:0 0 10px; } .product-review dt { font-weight:bold; } .product-review dd { font-size:13px; margin:5px 0 0; } /* Billing Agreements */ .billing-agreements .form-list li select { float:left; } .billing-agreements .form-list li button.button { float:left; margin-left:10px; } .billing-agreements .table-caption { font-weight:bold; font-size:13px; } /* ======================================================================================= */ .newsletter_standalone { overflow:hidden; border-top: 1px dotted #5CC0CE; padding: 10px; } .newsletter_standalone .block-title strong { font-size: 120%; text-transform: uppercase; } .newsletter_standalone .input-box { padding: 3px 0; } .newsletter_standalone .input-box input { width:200px; } .newsletter_standalone .actions { text-align: left; padding: 3px 0; } /* Fresh Air News */ .on, .when { font-style: italic; font-size: 90%; } .std p.details, p.details { padding: 10px 0; margin: 10px 0 50px 0; border: 1px dotted #B1E1E7; border-left: none; border-right: none; display: block; } .entry { margin-bottom: 10px; padding-bottom: 10px; border-bottom: 1px dotted #B1E1E7; } a.lnkbutton { border-radius: 6px; -moz-border-radius: 6px; -webkit-border-radius: 6px; background: #5CC0CE; padding: 6px 10px; text-decoration: none; float: left; color: #fff; font-weight: bold; } a.lnkbutton:hover { background: #67B630; color: #fff; } .catrow { clear: both; overflow: hidden; border-top: 1px solid #B1E1E7; margin-bottom: 20px; padding-top: 20px; } .cat { float: left; width: 320px; padding-right: 20px; } .news-landing {} .news-landing .featured { padding: 20px; border: 1px solid #B1E1E7; border-right-width: 2px; background: #fff; overflow: hidden; } .news-landing .featured .details { margin-bottom: 0; } /* Social Sidebar */ #social_block { margin-bottom: 10px } #social_block ul, #social_block li { margin: 0; padding: 0; list-style: none; } #social_block .latest_news { padding: 15px 0 10px 0; background: transparent url(../images/interface/heading_latest_news.png) no-repeat top center; } .latest_news .block-content { line-height: 1.4; padding: 0 20px; text-transform: capitalize; text-align: center; font-size: 80%; } #social_block .latest_news .block-content em { color: #5CC0CE; display: block; font-size: 90%; } #social_block .social { display: block; overflow: hidden; padding-top: 18px; background: transparent url(../images/interface/heading_stay_social.png) no-repeat top center; } #social_block .social li, #social_block .social li a { display: block; float: left; width: 42px; height: 42px; } #social_block .social li { margin: 0 10px 0 0; padding: 0; } #social_block .social li a { opacity: 0.75; text-indent: -9999px; background: transparent url(../images/interface/social_icons_gloss.png) no-repeat 0 0; } #social_block .social li a:hover, .social li a:active { opacity: 1; } #social_block .social li.fi-twitter a { background-position: 0 0; } #social_block .social li.fi-facebook a { background-position: -42px 0; } #social_block .social li.fi-blog a { background-position: -84px 0; } #social_block .social li.fi-contact a { background-position: -126px 0; } #social_block .social li.fi-twitter { margin-left: 16px; } #social_block .social li.fi-contact { margin: 0; } /* Footer ================================================================================ */ .pre_footer_container { width: 100%; background: #D7F0F3; position: relative; } .pre_footer { width: 990px; margin: 0 auto; background: transparent; } .pre_footer_content { margin-left: 10px; background: #EFF9FA; overflow: hidden; } .pre_footer .newsletter_content { background: transparent url(../images/interface/newsletter-bg-bottom.png) no-repeat bottom right; width: 260px; float: right; padding: 10px 0 16px 0; color: #fff; } .pre_footer .newsletter_content .block-title strong { font-size: 120%; font-family: "trajan-pro-1","trajan-pro-2",serif; font-weight: normal; } .pre_footer .newsletter_content .input-box { float:left; width:110px; padding-top: 3px; } .pre_footer .newsletter_content .input-box input { width:105px; } .pre_footer .newsletter_content .button { float: right; } .pre_footer .link_content { float: left; width: 695px; margin-left: 20px; padding: 0; } .footer_container { background: #3E8C97 url(../images/interface/pagebg_flow.png) repeat-x top center; width: 100%; } .footer { width: 970px; margin: 0 auto; padding: 80px 0 50px 0; text-align: left; color: #fff; background: transparent url(../images/interface/pagebg_flow_cont.png) no-repeat top center; } .footer a { color: #fff; } .footer a:hover { color: #96D4DD; } .footer h3 { color: #fff; font-size: 1.5em; font-weight: normal; margin-bottom: 10px; line-height: 1em; text-transform: uppercase; } .footer h4 { color: #96D4DD; font-size: 90%; font-weight: normal; line-height: 1em; text-transform: uppercase; margin: 0; } .footer p { text-align:left; } .footer address { text-align:left; } .footerlinks { float: left; width: 65%; } .footercats { font-size: 90%; line-height: 1.6; } /*.footercats ul li.level0 { float: left; width: 150px; } .footercats ul ul { float: left; width: 140px; margin-left: 8px; }*/ .footercats.simple ul, .footercats.simple li, .footerblock ul, .footerblock li { display: inline; padding: 0; margin: 0; text-transform: uppercase; } .footercats.simple li a { margin-right: 5px; color: #fff; text-decoration: none; } .footercats.simple li.level0 { display: block; margin-top: 6px; padding-top: 6px; font-weight: normal; border-top: 1px solid #49A2AF; } .footercats.simple li.level0.over a { color: #96D4DD; } .footercats.simple li.level0.over li a { color: #96D4DD; } .footercats.simple li.level1 { } .footercats.simple li.level1 a { color: #96D4DD; background: transparent; } .footercats.simple li.level1 a:hover { color: #fff !important; } .footercats.simple li.active a, .footercats.simple li.level1.active a { border-bottom: 1px solid #49A2AF; } .footercats.simple li.active li a { border: none; } .footercats.simple ul.level1 { display: none; } .footerblock { font-size: 90%; margin: 6px 0 0 0; padding: 6px 0; border: 1px solid #49A2AF; border-left: none; border-right: none; clear: both; } .footerblock a { text-decoration: none; margin-right: 5px; color: #fff; } .footerblock a:hover { color: #96D4DD; } .footer .legality { font-size: 85%; color:#5CAFBA; margin: 10px 0; clear: both; text-transform: uppercase; } .footer .legality a, .footer .legality a:hover { color:#5CAFBA; } .footer .footerinfo { float: right; width: 30%; } /* --lightview-- */ #lightview { position: absolute; top: 50%; left: 50%; height: 150px; width: 150px; margin: -75px 0 0 -75px; padding: 0; text-align: left; } /* The container that holds everything */ .lv_Container { position: relative; width: 100%; height: 100%; background: none; padding: 0; margin: 0; } .lv_Button { cursor: pointer; text-decoration: none; border: none; background: none; margin: 0; padding: 0; } /* The buttons on the side when you view a gallery */ .lv_Sides { position: absolute; top: 50%; left: 0; clear: both; width: 100%; padding: 0; margin: 0; } .lv_Sides * { padding: 0; margin: 0; } .lv_Sides li { list-style-type: none; position: relative; } .lv_PrevSide { float: left; } .lv_NextSide { float: right; } .lv_Sides .lv_Wrapper { width: 100%; height: 100%; cursor: pointer; } .lv_Sides .lv_Button { float: left; background: none; } /* The frames above and below the center, that hold the corners. It's recommended not to change anything here, a lot is done in javascript to build further upon this based on your settings. */ .lv_Frames { width: 100%; height: 100%; position: relative; padding: 0; margin: 0; } .lv_Frames li { list-style-type: none; margin: 0; padding: 0; } .lv_Frame { width: 100%; display: block; } .lv_Frame * { padding: 0; margin: 0; } .lv_FrameTop { position: absolute; left: 0; width: 100%; display: block; } .lv_FrameBottom { position: relative; float: left; clear: both; } .lv_Liquid { position: relative; float: left; width: 100%; overflow: hidden; clear: both; } .lv_Liquid .lv_Filler { position: absolute; height: 100%; width: 2px; top: 0; left: 50%; } .lv_Half { display: block; height: 100%; clear: both; line-height: 0px; } .lv_Half li { list-style-type: none; } .lv_Corner { float: left; position: relative; } .lv_CornerTr, .lv_CornerBr { float: right; } .lv_Fill { position: absolute; top: 0; width: 100%; height: 100%; } .lv_Half .lv_CornerWrapper { float: left; position: relative; width: 50%; height: 100%; overflow: hidden; } .lv_HalfRight .lv_CornerWrapper { float: right; } .lv_Corner { position: relative; } .lv_Corner canvas { position: relative; } .lv_HalfLeft .lv_Corner { float: left; } .lv_HalfRight .lv_Corner { position: relative; float: right; } /* To position content correctly in the center with correct rounded corner display we need a few wrappers. This is to get it right on all browsers. */ .lv_Center { position: relative; clear: both; height: 100%; overflow: hidden; background: none; padding: 0; margin: 0; } .lv_WrapUp { position: absolute; left: 0; height: 100%; width: 100%; overflow: hidden; padding: 0; margin: 0; } .lv_WrapDown { position: relative; height: 100%; width: 100%; overflow: hidden; padding: 0; margin: 0; } .lv_WrapCenter { position: relative; padding: 0; margin: 0; } /* The loading indicator */ .lv_Loading { position: absolute; top: 50%; left: 50%; } .lv_Loading .lv_Button { float: left; height: 100%; width: 100%; } .lv_MediaWrapper { position: relative; width: 100%; display: block; overflow: hidden; clear: both; padding: 0; margin: 0; } .lv_MediaWrapper img { position: relative; float: left; padding: 0; margin: 0; } /* The overlays on top of images that toggle the previous/next buttons */ .lv_PrevNext { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0; margin: 0; } .lv_PrevNext * { padding: 0; margin: 0; } .lv_PrevNext .lv_Button { position: relative; height: 100%; } .lv_PrevButton { float: left; } .lv_NextButton { float: right; } /* The bar that holds title, caption, imagenumber, slideshow and closebutton */ .lv_MenuBar { clear: both; position: relative; width: 100%; font: 11px Arial, Helvetica, sans-serif; color: #7a7a7a; padding: 0; margin: 0; text-align: left; } .lv_MenuBar * { padding: 0; margin: 0;} .lv_Close { position: relative; float: right; overflow: hidden; width: 100%; height: 100%; } .lv_Data { position: relative; float: left; padding-bottom: 3px; line-height: 13px; overflow: hidden; } /* simulates padding-left inside .lv_Data .lv_DataText div, .lv_ImgNumber div { margin-left: 3px; } */ .lv_Data li { list-style-type: none; float: left; margin-top: 3px; } .lv_DataText { width: 100%; } .lv_DataText .lv_Title { font-weight: bold; margin-bottom: 2px; } .lv_DataText .lv_Caption { clear: both; } .lv_Data .lv_ImgNumber { color: #a7a7a7; margin-right: 5px; margin-top: 5px; } .lv_Data .lv_innerPrevNext, .lv_Data .lv_Slideshow { position: relative; border-left: 1px solid #d7d7d7; padding: 0 5px; margin-top: 5px; vertical-align: middle; } .lv_Data .lv_Slideshow { padding-right: 0px; } .lv_Data .lv_innerPrevNext .lv_Button, .lv_Data .lv_Slideshow .lv_Button { /* play and stop */ float: left; background-position: center left; background-repeat: no-repeat; } /* the boxes that hold media or external content */ .lv_contentTop, .lv_contentBottom { position: relative; float: left; margin: 0; padding: 0; clear: both; } #lightview iframe { float: left; border: 0; clear: both; padding: 0; margin: 0; background: none; } /* The container that hold buttons above the view, currently only topclose */ .lv_topButtons { position: absolute; left: 0; width: 100%; overflow: hidden; margin: 0; padding: 0; } .lv_topcloseButtonImage { cursor: pointer; } /* The error/warning/download message that will appear when a required plugin is not installed. */ #lightviewError p { padding: 0 0 10px 0; } #lightviewError div { padding: 6px; font: 11px Arial, Helvetica, sans-serif; } #lightviewError .message { background: #fcb5b5; color: #dd1f1f; margin-bottom: 3px; } #lightviewError .type { font-weight: bold; } #lightviewError .pluginspage { background: #b5fcbd; color: #21be30; } #lightviewError a, #lightviewError a:hover, #lightviewError a:visited { color: #21be30; text-decoration: none; background: none; font-weight: bold; border-bottom: 1px solid #7de689; } #lightviewError p { margin-left: 0; padding: 0; } #lv_overlay { position: absolute; /* Opera will use fixed */ top: 0; left: 0; height: 100%; width: 100%; } /* navbar Adds a bar below the view that takes over the default Controller */ #lightviewController { position: fixed; bottom: 0; top: 0; left: 50%; margin: 0; padding: 0; color: #d2d2d2; font: 11px Arial, Helvetica, sans-serif; } * html body #lightviewController { /* IE6 */ position: absolute; top: auto; margin-top: expression( (-1 * this.offsetHeight / 2 + (document.documentElement ? document.documentElement.scrollTop : 0) + (Lightview.controllerOffset || 0)) + 'px'); } #lightviewController ul { display: block; height: 100%; float: left; margin: 0; padding: 0; position: relative; } .lv_controllerTop, .lv_controllerMiddle, .lv_controllerBottom { list-style-type: none; float: left; display: block; position: relative; clear: both; overflow: hidden; margin: 0; padding: 0; } .lv_controllerCenter { width: auto; float: left; } .lv_controllerCornerWrapper { position: absolute; width: 100%; height: 100%; margin: 0; padding: 0; } .lv_controllerCornerWrapperTopLeft, .lv_controllerCornerWrapperBottomLeft { top: 0; left: -100%;} .lv_controllerCornerWrapperTopRight, .lv_controllerCornerWrapperBottomRight { top: 0; left: 100%;} #lightviewController .lv_CornerWrapper { width: 100%; } #lightviewController .lv_Corner { float: left; } #lightviewController .lv_Corner { float: right; position: relative; } #lightviewController .lv_CornerTr, #lightviewController .lv_CornerBr { float: left; } .lv_controllerBetweenCorners { position: relative; height: 100%; overflow: hidden; } .lv_controllerMiddle { position: relative; height: 100%; float: left; } .lv_controllerCenter { float: left; width: auto;} .lv_controllerCenter li { list-style-type: none; float: left; display: inline; position: relative; clear: none; } .lv_controllerSetNumber { float: left; text-align: center; } #lightviewController .lv_Button { float: left; position: relative; height: 100%; clear: none; } .lv_controllerSetNumber { position: relative; height: 100%; padding-right: 3px; } .lv_controllerPrev, .lv_controllerNext, .lv_controllerSlideshow, .lv_controllerClose { float: left; position: relative; height: 100%; padding-left: 3px; } .lv_controllerPrev { border-left: 1px solid #3c3c3c; } #lightviewController .lv_controllerNext { padding-right: 3px; border-right: 1px solid #3c3c3c; } * html #lightview { /* IE6 */ position: absolute; margin-top: expression( (-1 * this.offsetHeight / 2 + (document.documentElement ? document.documentElement.scrollTop : 0) - (Lightview.controllerHeight || 0)) + 'px'); margin-left: expression( -1 * this.offsetWidth / 2 + (document.documentElement ? document.documentElement.scrollLeft : 0) + 'px'); } /* Always cover 100% of the screen in IE6 */ html #lv_overlay { position: absolute; height: expression(((window.Enumerable && window.Enumerable.max) ? [document.body.scrollHeight, document.documentElement.scrollHeight, document.body.offsetHeight, document.documentElement.clientHeight].max() : document.documentElement.scrollHeight) + 'px' ); width: expression(((window.Enumerable && window.Enumerable.max) ? [document.body.scrollWidth, document.documentElement.scrollWidth, document.body.offsetWidth, document.documentElement.clientHeight].max() : document.documentElement.scrollWidth) + 'px' ); } /******************** Clears ********************/ .clearer:after, .header:after, #nav:after, .main:after, .footer:after, .col-main:after, .col2-set:after, .col3-set:after, .col3-layout .product-options-bottom .price-box:after, .col4-set:after, .search-autocomplete li:after, .block-poll li:after, .block-related li:after, .block-related .item:after, .block .actions:after, .mini-products-list li:after, .title-buttons:after, .pager:after, .sorter:after, .ratings:after, .add-to-box:after, .add-to-cart:after, .product-essential:after, .products-list li.item:after, .product-view .product-img-box .more-views ul:after, .product-view .tags .form-add-tags:after, .product-options .options-list li:after, .product-options-bottom:after, .product-review:after, .cart:after, .opc .step-title:after, .checkout-progress:after, .field-100:after, .group-select li:after, .form-list li:after, .buttons-set:after, .buttons-set2:after, .page-print .print-head:after { display:block; content:"."; clear:both; font-size:0; line-height:0; height:0; overflow:hidden; } /* VideoJS Default Styles (http://videojs.com) Version 2.0.2 REQUIRED STYLES (be careful overriding) ================================================================================ */ /* Box containing video, controls, and download links. Will be set to the width of the video element through JS If you want to add some kind of frame or special positioning, use another containing element, not video-js-box. */ .video-js-box { text-align: left; position: relative; line-height: 0 !important; margin: 0; padding: 0 !important; border: none !important; } /* Video Element */ video.video-js { background-color: #000; position: relative; padding: 0; } .vjs-flash-fallback { display: block; } /* Poster Overlay Style */ .video-js-box img.vjs-poster { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 100%; margin: 0; padding: 0; cursor: pointer; } /* Subtiles Style */ .video-js-box .vjs-subtitles { color: #fff; font-size: 20px; text-align: center; position: absolute; bottom: 40px; left: 0; right: 0; } /* Fullscreen styles for main elements */ .video-js-box.vjs-fullscreen { position: fixed; left: 0; top: 0; right: 0; bottom: 0; overflow: hidden; z-index: 1000; } .video-js-box.vjs-fullscreen video.video-js, .video-js-box.vjs-fullscreen .vjs-flash-fallback { position: relative; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; } .video-js-box.vjs-fullscreen img.vjs-poster { z-index: 1001; } .video-js-box.vjs-fullscreen .vjs-spinner { z-index: 1001; } .video-js-box.vjs-fullscreen .vjs-controls { z-index: 1003; } .video-js-box.vjs-fullscreen .vjs-big-play-button { z-index: 1004; } .video-js-box.vjs-fullscreen .vjs-subtitles { z-index: 1004; } /* Styles Loaded Check */ .vjs-styles-check { height: 5px; position: absolute; } /* Controls Below Video */ .video-js-box.vjs-controls-below .vjs-controls { position: relative; opacity: 1; background-color: #000; } .video-js-box.vjs-controls-below .vjs-subtitles { bottom: 75px; } /* Account for height of controls below video */ /* DEFAULT SKIN (override in another file) ================================================================================ Using all CSS to draw the controls. Images could be used if desired. Instead of editing this file, I recommend creating your own skin CSS file to be included after this file, so you can upgrade to newer versions easier. */ /* Controls Layout Using absolute positioning to position controls */ .video-js-box .vjs-controls { position: absolute; margin: 0; opacity: 0.85; color: #fff; display: none; /* Start hidden */ left: 0; right: 0; /* 100% width of video-js-box */ width: 100%; bottom: 0px; /* Distance from the bottom of the box/video. Keep 0. Use height to add more bottom margin. */ height: 35px; /* Including any margin you want above or below control items */ padding: 0; /* Controls are absolutely position, so no padding necessary */ } .video-js-box .vjs-controls > div { /* Direct div children of control bar */ position: absolute; /* Use top, bottom, left, and right to specifically position the control. */ text-align: center; margin: 0; padding: 0; height: 25px; /* Default height of individual controls */ top: 5px; /* Top margin to put space between video and controls when controls are below */ /* CSS Background Gradients Using to give the aqua-ish look. */ /* Default */ background-color: #0B151A; /* Webkit */ background: #1F3744 -webkit-gradient(linear, left top, left bottom, from(#0B151A), to(#1F3744)) left 12px; /* Firefox */ background: #1F3744 -moz-linear-gradient(top, #0B151A, #1F3744) left 12px; /* CSS Curved Corners */ border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; /* CSS Shadows */ box-shadow: 1px 1px 2px #000; -webkit-box-shadow: 1px 1px 2px #000; -moz-box-shadow: 1px 1px 2px #000; } /* Placement of Control Items - Left side of pogress bar, use left & width - Rigth side of progress bar, use right & width - Expand with the video (like progress bar) use left & right */ .vjs-controls > div.vjs-play-control { left: 5px; width: 25px; } .vjs-controls > div.vjs-progress-control { left: 35px; right: 165px; } /* Using left & right so it expands with the width of the video */ .vjs-controls > div.vjs-time-control { width: 75px; right: 90px; } /* Time control and progress bar are combined to look like one */ .vjs-controls > div.vjs-volume-control { width: 50px; right: 35px; } .vjs-controls > div.vjs-fullscreen-control { width: 25px; right: 5px; } /* Removing curved corners on progress control and time control to join them. */ .vjs-controls > div.vjs-progress-control { border-top-right-radius: 0; -webkit-border-top-right-radius: 0; -moz-border-radius-topright: 0; border-bottom-right-radius: 0; -webkit-border-bottom-right-radius: 0; -moz-border-radius-bottomright: 0; } .vjs-controls > div.vjs-time-control { border-top-left-radius: 0; -webkit-border-top-left-radius: 0; -moz-border-radius-topleft: 0; border-bottom-left-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-bottomleft: 0; } /* Play/Pause -------------------------------------------------------------------------------- */ .vjs-play-control { cursor: pointer !important; } /* Play Icon */ .vjs-play-control span { display: block; font-size: 0; line-height: 0; } .vjs-paused .vjs-play-control span { width: 0; height: 0; margin: 8px 0 0 8px; /* Drawing the play triangle with borders - http://www.infimum.dk/HTML/slantinfo.html */ border-left: 10px solid #fff; /* Width & Color of play icon */ /* Height of play icon is total top & bottom border widths. Color is transparent. */ border-top: 5px solid rgba(0,0,0,0); border-bottom: 5px solid rgba(0,0,0,0); } .vjs-playing .vjs-play-control span { width: 3px; height: 10px; margin: 8px auto 0; /* Drawing the pause bars with borders */ border-top: 0px; border-left: 3px solid #fff; border-bottom: 0px; border-right: 3px solid #fff; } /* Progress -------------------------------------------------------------------------------- */ .vjs-progress-holder { /* Box containing play and load progresses */ position: relative; padding: 0; overflow:hidden; cursor: pointer !important; height: 9px; border: 1px solid #777; margin: 7px 1px 0 5px; /* Placement within the progress control item */ border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; } .vjs-progress-holder div { /* Progress Bars */ position: absolute; display: block; width: 0; height: 9px; margin: 0; padding: 0; border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; } .vjs-play-progress { /* CSS Gradient */ /* Default */ background: #fff; /* Webkit */ background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#777)); /* Firefox */ background: -moz-linear-gradient(top, #fff, #777); } .vjs-load-progress { opacity: 0.8; /* CSS Gradient */ /* Default */ background-color: #555; /* Webkit */ background: -webkit-gradient(linear, left top, left bottom, from(#555), to(#aaa)); /* Firefox */ background: -moz-linear-gradient(top, #555, #aaa); } /* Time Display -------------------------------------------------------------------------------- */ .vjs-controls .vjs-time-control { font-size: 10px; line-height: 1; font-weight: normal; font-family: Helvetica, Arial, sans-serif; } .vjs-controls .vjs-time-control span { line-height: 25px; /* Centering vertically */ } /* Volume -------------------------------------------------------------------------------- */ .vjs-volume-control { cursor: pointer !important; } .vjs-volume-control div { display: block; margin: 0 5px 0 5px; padding: 4px 0 0 0; } /* Drawing the volume icon using 6 span elements */ .vjs-volume-control div span { /* Individual volume bars */ float: left; padding: 0; margin: 0 2px 0 0; /* Space between */ width: 5px; height: 0px; /* Total height is height + bottom border */ border-bottom: 18px solid #555; /* Default (off) color and height of visible portion */ } .vjs-volume-control div span.vjs-volume-level-on { border-color: #fff; /* Volume on bar color */ } /* Creating differnt bar heights through height (transparent) and bottom border (visible). */ .vjs-volume-control div span:nth-child(1) { border-bottom-width: 2px; height: 16px; } .vjs-volume-control div span:nth-child(2) { border-bottom-width: 4px; height: 14px; } .vjs-volume-control div span:nth-child(3) { border-bottom-width: 7px; height: 11px; } .vjs-volume-control div span:nth-child(4) { border-bottom-width: 10px; height: 8px; } .vjs-volume-control div span:nth-child(5) { border-bottom-width: 14px; height: 4px; } .vjs-volume-control div span:nth-child(6) { margin-right: 0; } /* Fullscreen -------------------------------------------------------------------------------- */ .vjs-fullscreen-control { cursor: pointer !important; } .vjs-fullscreen-control div { padding: 0; text-align: left; vertical-align: top; cursor: pointer !important; margin: 5px 0 0 5px; /* Placement within the fullscreen control item */ width: 20px; height: 20px; } /* Drawing the fullscreen icon using 4 span elements */ .vjs-fullscreen-control div span { float: left; margin: 0; padding: 0; font-size: 0; line-height: 0; width: 0; text-align: left; vertical-align: top; } .vjs-fullscreen-control div span:nth-child(1) { /* Top-left triangle */ margin-right: 3px; /* Space between top-left and top-right */ margin-bottom: 3px; /* Space between top-left and bottom-left */ border-top: 6px solid #fff; /* Height and color */ border-right: 6px solid rgba(0,0,0,0); /* Width */ } .vjs-fullscreen-control div span:nth-child(2) { border-top: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); } .vjs-fullscreen-control div span:nth-child(3) { clear: both; margin: 0 3px 0 0; border-bottom: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); } .vjs-fullscreen-control div span:nth-child(4) { border-bottom: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); } /* Icon when video is in fullscreen mode */ .vjs-fullscreen .vjs-fullscreen-control div span:nth-child(1) { border: none; border-bottom: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); } .vjs-fullscreen .vjs-fullscreen-control div span:nth-child(2) { border: none; border-bottom: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); } .vjs-fullscreen .vjs-fullscreen-control div span:nth-child(3) { border: none; border-top: 6px solid #fff; border-left: 6px solid rgba(0,0,0,0); } .vjs-fullscreen .vjs-fullscreen-control div span:nth-child(4) { border: none; border-top: 6px solid #fff; border-right: 6px solid rgba(0,0,0,0); } /* Download Links - Used for browsers that don't support any video. ---------------------------------------------------------*/ .vjs-no-video { font-size: small; line-height: 1.5; } /* Big Play Button (at start) ---------------------------------------------------------*/ div.vjs-big-play-button { display: none; /* Start hidden */ z-index: 2; position: absolute; top: 50%; left: 50%; width: 80px; height: 80px; margin: -43px 0 0 -43px; text-align: center; vertical-align: center; cursor: pointer !important; border: 3px solid #fff; opacity: 0.9; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; /* CSS Background Gradients */ /* Default */ background-color: #0B151A; /* Webkit */ background: #1F3744 -webkit-gradient(linear, left top, left bottom, from(#0B151A), to(#1F3744)) left 40px; /* Firefox */ background: #1F3744 -moz-linear-gradient(top, #0B151A, #1F3744) left 40px; /* CSS Shadows */ box-shadow: 4px 4px 8px #000; -webkit-box-shadow: 4px 4px 8px #000; -moz-box-shadow: 4px 4px 8px #000; } div.vjs-big-play-button:hover { box-shadow: 0px 0px 80px #fff; -webkit-box-shadow: 0px 0px 80px #fff; -moz-box-shadow: 0px 0px 80px #fff; } div.vjs-big-play-button span { display: block; font-size: 0; line-height: 0; width: 0; height: 0; margin: 20px 0 0 23px; /* Drawing the play triangle with borders - http://www.infimum.dk/HTML/slantinfo.html */ border-left: 40px solid #fff; /* Width & Color of play icon */ /* Height of play icon is total top & bottom border widths. Color is transparent. */ border-top: 20px solid rgba(0,0,0,0); border-bottom: 20px solid rgba(0,0,0,0); } /* Spinner Styles ---------------------------------------------------------*/ /* CSS Spinners by Kilian Valkhof - http://kilianvalkhof.com/2010/css-xhtml/css3-loading-spinners-without-images/ */ .vjs-spinner { display: none; position: absolute; top: 50%; left: 50%; width: 100px; height: 100px; z-index: 1; margin: -50px 0 0 -50px; /* Scaling makes the circles look smoother. */ transform: scale(0.5); -webkit-transform:scale(0.5); -moz-transform:scale(0.5); } /* Spinner circles */ .vjs-spinner div { position:absolute; left: 40px; top: 40px; width: 20px; height: 20px; background: #fff; border-radius: 20px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border: 1px solid #ccc; /* Added border so can be visible on white backgrounds */ } /* Each circle */ .vjs-spinner div:nth-child(1) { opacity: 0.12; transform: rotate(000deg) translate(0, -40px) scale(0.1); -webkit-transform: rotate(000deg) translate(0, -40px) scale(0.1); -moz-transform: rotate(000deg) translate(0, -40px) scale(0.1); } .vjs-spinner div:nth-child(2) { opacity: 0.25; transform: rotate(045deg) translate(0, -40px) scale(0.2); -webkit-transform: rotate(045deg) translate(0, -40px) scale(0.2); -moz-transform: rotate(045deg) translate(0, -40px) scale(0.2); } .vjs-spinner div:nth-child(3) { opacity: 0.37; transform: rotate(090deg) translate(0, -40px) scale(0.4); -webkit-transform: rotate(090deg) translate(0, -40px) scale(0.4); -moz-transform: rotate(090deg) translate(0, -40px) scale(0.4); } .vjs-spinner div:nth-child(4) { opacity: 0.50; transform: rotate(135deg) translate(0, -40px) scale(0.6); -webkit-transform: rotate(135deg) translate(0, -40px) scale(0.6); -moz-transform: rotate(135deg) translate(0, -40px) scale(0.6); } .vjs-spinner div:nth-child(5) { opacity: 0.62; transform: rotate(180deg) translate(0, -40px) scale(0.8); -webkit-transform: rotate(180deg) translate(0, -40px) scale(0.8); -moz-transform: rotate(180deg) translate(0, -40px) scale(0.8); } .vjs-spinner div:nth-child(6) { opacity: 0.75; transform: rotate(225deg) translate(0, -40px) scale(1.0); -webkit-transform: rotate(225deg) translate(0, -40px) scale(1.0); -moz-transform: rotate(225deg) translate(0, -40px) scale(1.0); } .vjs-spinner div:nth-child(7) { opacity: 0.87; transform: rotate(270deg) translate(0, -40px) scale(1.1); -webkit-transform: rotate(270deg) translate(0, -40px) scale(1.1); -moz-transform: rotate(270deg) translate(0, -40px) scale(1.1); } .vjs-spinner div:nth-child(8) { opacity: 1.00; transform: rotate(315deg) translate(0, -40px) scale(1.3); -webkit-transform: rotate(315deg) translate(0, -40px) scale(1.3); -moz-transform: rotate(315deg) translate(0, -40px) scale(1.3); }