/********************************************************************************************** CSS on Sails Title: Whiter Teeth Author: XHTMLized (http://www.xhtmlized.com/) Date: March 2010 *********************************************************************************************** 1. BASE 1.1 Reset 1.2 Accessibility Navigation & Hide 1.3 Clearfix 1.4 Default Styles 2. LAYOUT 2.1 Structure 2.2 Header 2.2.1 Logo 2.2.2 User Tools 2.2.3 Navigation 2.2.4 Site Tools 2.3 Content 2.3.1 Text Styling 2.3.2 Boxes & Wrappers 2.4 Sidebar 2.4.1 Side Navigation 2.4.2 Live Chat 2.4.3 Newsletter 2.4.4 Caution 2.5 Footer 3. INDIVIDUAL PAGES 3.1 Homepage 3.2 Products index (products) 3.3 Product page (products_featured) 3.4 Kits page (whitening_kits) 3.5 Whiter Smile (whiter_smile) 3.6 Product Comparison 3.7 Forum 4. PLUGINS 4.1 jScrollpane 4.2 jScrollHorizontalpane ***************************************************************/ /* 1. BASE ----------------------------------------------------------------------------------------------- ===============================================================================================*/ /* 1.1 Reset -----------------------------------------------------------------------------------------------*/ html, body, div, span, object, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, samp, small, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; background: transparent; } q { quotes: none; } q:before, q:after { content: ""; content: none; } a, ins, del { text-decoration: none; } table { border-collapse: collapse; border-spacing: 0; } th, td { vertical-align: top; } th { text-align: left; } /* 1.2 Accessibility Navigation & Hide -----------------------------------------------------------------------------------------------*/ ol#accessibility-nav, .hide { position: absolute; top: -999em; left: -999em; height: 1px; width: 1px; } /* 1.3 Clearfix -----------------------------------------------------------------------------------------------*/ .clearfix:after, #wrapper:after, #offers ul:after, #sidenavigation ul.menu:after, #content .box:after, #content .twocol:after, #content .twocol2:after, #content ul.product-rows li:after, #content .two-col-row-wrap:after, #content .standout_offers:after, #content .rating-wrap:after, #content .three-col-row-wrap:after, #content ul.features li dl:after, #content ul.features2 li dl:after, #content .product-specifications:after, #content ul.product-upgrade-rows li:after, #content .product-categories:after, #forum ul.topiclist dl:after, #forum .post:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } /* 1.4 Default Styles -----------------------------------------------------------------------------------------------*/ body { background: #fff; color: #333; font-family: Helvetica, "Helvetica LT", Arial, "Helvetica Neue", Verdana, sans-serif; font-size:75%; line-height:1.3em; text-align: center; } hr { display: none; } strong { } em { font-style: italic; } del { text-decoration: line-through; } th { font-weight: normal; } address, cite, dfn { font-style: normal; } li { list-style: none; } abbr, acronym { border-bottom: 1px dotted #999; cursor: help; } input, textarea, select { font-family: "Arial", "Helvetica", sans-serif; } a { color: #000; text-decoration: underline; } a:hover { color: #0067b5; text-decoration:underline;; } a span {cursor:pointer;} /* 2. SITE-WIDE LAYOUT ----------------------------------------------------------------------------------------------- ===============================================================================================*/ /* 2.1 Structure -----------------------------------------------------------------------------------------------*/ .container { width: 950px; position: relative; margin: 0 auto; text-align: left; } #header {padding-bottom:10px;overflow:hidden; background:#b3e4ff url(../images/bg_header.jpg) 50% 0 no-repeat;} #header .container {height:181px;border-bottom:1px solid #dcdcdc; background:url(../images/bg_header.jpg) 50% 0 no-repeat;} #wrapper {background:#FFF url(../images/bg_wrapper.gif) 0 0 repeat-x;} #wrapper .container {width:950px;overflow:hidden;} #content { width: 710px; float: right; } #sidebar { width: 230px; float: left; } #offers {background:#e8f5d4 url(../images/dot_white.gif) 0 0 repeat-x;border-top:1px solid #d5f9c5;} #offers .container {background:#e8f5d4 url(../images/dot_white.gif) 0 0 repeat-x;border-top:1px solid #d5f9c5;margin-top:-1px;} #footer {background:#00467b url(../images/bg_footer.jpg) 50% 0 no-repeat;} #footer .container {background:#00467b url(../images/bg_footer.jpg) 50% 0 no-repeat;} /* 2.2 Header -----------------------------------------------------------------------------------------------*/ #header {} /* 2.2.1 Logo -----------------------------------------------*/ #header .site-name {position:absolute;top:1px;left:12px;width:310px;height:100px; background:transparent url(../images/logo.png) 0 0 no-repeat;text-indent:-999em; text-align:} /* 2.2.2 User Tools -----------------------------------------------*/ #usertools {float:right;padding-top:10px;line-height:41px;margin:0 0 50px 0;width: 215px;} #usertools .menu {float:left;margin-right:60px;} #usertools .menu li {float:left;} #usertools .menu a {float:left;line-height:41px;padding:0 10px;color:#000;} #usertools .menu a:hover {} #usertools .usermenu {float:left;margin-right:20px;} #usertools .usermenu a {float:left;color:#000;padding:0 5px;} #usertools .usermenu span {float:left;} #usertools .usermenu a:hover {text-decoration:none;} #usertools .cart {float:right;padding-right:5px; background:url(../images/bg_cart-right.gif) 100% 0 no-repeat;height:41px;} #usertools .cart .inner { width: 60px; float: left; padding:0 2px 0 15px; background:transparent url(../images/bg_cart-left.gif) 0 0 no-repeat;} #usertools .cart span {float:left;padding:0 5px;margin:0 10px 0 0;} #usertools .cart a {float:right;padding:0 5px;color:#000; display: block;} #usertools .cart a:hover {text-decoration:none;} /* 2.2.3 Navigation -----------------------------------------------*/ #navigation {clear:both;float:left;width:709px;height:69px;background:#0068b7 url(../images/bg_navigation.png) 0 0 no-repeat;padding:0 0 0 0;position:relative;} #navigation ul {padding:6px 0 0 8px;height:63px;} #navigation ul li {float:left;} #navigation ul a { display:block;color:#fff;font-size:1.1667em;padding:0 6px 0 0;height:33px;background-position:100% 0;background-repeat:no-repeat; text-decoration:none;} #navigation ul a span {display:block;padding:0 4px 6px 10px;line-height:27px;background-position:0 0;background-repeat:no-repeat;} #navigation ul a:hover span {text-decoration:underline;} #navigation ul ul {position:absolute;top:39px;left:-999em;height:30px;padding:0;} #navigation ul ul li {} #navigation ul ul li a {font-size:1em;padding:0 10px;line-height:30px;height:30px;} #navigation ul ul li a span {} #navigation ul ul li a:hover {text-decoration:underline;} /* Active State */ .nav-01 #navigation ul li.nav-01 a, .nav-01 #navigation ul li.nav-01 a:hover, .nav-02 #navigation ul li.nav-02 a, .nav-02 #navigation ul li.nav-02 a:hover, .nav-03 #navigation ul li.nav-03 a, .nav-03 #navigation ul li.nav-03 a:hover, .nav-04 #navigation ul li.nav-04 a, .nav-04 #navigation ul li.nav-04 a:hover, .nav-05 #navigation ul li.nav-05 a, .nav-05 #navigation ul li.nav-05 a:hover, .nav-06 #navigation ul li.nav-06 a, .nav-06 #navigation ul li.nav-06 a:hover, .nav-07 #navigation ul li.nav-07 a, .nav-07 #navigation ul li.nav-07 a:hover {background-color:#00467b;background-image:url(../images/bg_navc-r.gif); text-decoration:none;cursor:default;} .nav-01 #navigation ul li.nav-01 a span, .nav-01 #navigation ul li.nav-01 a:hover span, .nav-02 #navigation ul li.nav-02 a span, .nav-02 #navigation ul li.nav-02 a:hover span, .nav-03 #navigation ul li.nav-03 a span, .nav-03 #navigation ul li.nav-03 a:hover span, .nav-04 #navigation ul li.nav-04 a span, .nav-04 #navigation ul li.nav-04 a:hover span, .nav-05 #navigation ul li.nav-05 a span, .nav-05 #navigation ul li.nav-05 a:hover span, .nav-06 #navigation ul li.nav-06 a span, .nav-06 #navigation ul li.nav-06 a:hover span, .nav-07 #navigation ul li.nav-07 a span, .nav-07 #navigation ul li.nav-07 a:hover span {background-image:url(../images/bg_navc-l.gif);text-decoration:none;} .nav-01 #navigation ul li.nav-01 ul, .nav-02 #navigation ul li.nav-02 ul, .nav-03 #navigation ul li.nav-03 ul, .nav-04 #navigation ul li.nav-04 ul, .nav-05 #navigation ul li.nav-05 ul, .nav-06 #navigation ul li.nav-06 ul, .nav-07 #navigation ul li.nav-07 ul{left:8px; width: 700px; } .nav-01 #navigation ul li.nav-01 ul a, .nav-01 #navigation ul li.nav-01 ul a:hover, .nav-02 #navigation ul li.nav-02 ul a, .nav-02 #navigation ul li.nav-02 ul a:hover, .nav-03 #navigation ul li.nav-03 ul a, .nav-03 #navigation ul li.nav-03 ul a:hover, .nav-04 #navigation ul li.nav-04 ul a, .nav-04 #navigation ul li.nav-04 ul a:hover, .nav-05 #navigation ul li.nav-05 ul a, .nav-05 #navigation ul li.nav-05 ul a:hover, .nav-06 #navigation ul li.nav-06 ul a, .nav-06 #navigation ul li.nav-06 ul a:hover, .nav-07 #navigation ul li.nav-07 ul a, .nav-07 #navigation ul li.nav-07 ul a:hover {background-image:none;background-color:transparent;cursor:pointer;} .nav-01 #navigation ul li.nav-01 ul a:hover, .nav-02 #navigation ul li.nav-02 ul a:hover, .nav-03 #navigation ul li.nav-03 ul a:hover, .nav-04 #navigation ul li.nav-04 ul a:hover, .nav-05 #navigation ul li.nav-05 ul a:hover, .nav-06 #navigation ul li.nav-06 ul a:hover, .nav-07 #navigation ul li.nav-07 ul a:hover {text-decoration:underline;} .nav-01 #navigation ul li.nav-01 ul li.current a, .nav-01 #navigation ul li.nav-01 ul li.current a:hover, .nav-02 #navigation ul li.nav-02 ul li.current a, .nav-02 #navigation ul li.nav-02 ul li.current a:hover, .nav-03 #navigation ul li.nav-03 ul li.current a, .nav-03 #navigation ul li.nav-03 ul li.current a:hover, .nav-04 #navigation ul li.nav-04 ul li.current a, .nav-04 #navigation ul li.nav-04 ul li.current a:hover, .nav-05 #navigation ul li.nav-05 ul li.current a, .nav-05 #navigation ul li.nav-05 ul li.current a:hover, .nav-06 #navigation ul li.nav-06 ul li.current a, .nav-06 #navigation ul li.nav-06 ul li.current a:hover, .nav-07 #navigation ul li.nav-07 ul li.current a, .nav-07 #navigation ul li.nav-07 ul li.current a:hover {cursor:default;} /* 2.2.4 Site Tools -----------------------------------------------*/ #sitetools {position:relative;float:right;width:223px;height:61px; background:#0068b7 url(../images/bg_sitetools.gif) 0 0 no-repeat;padding:8px 0 0 18px;} /* Search Form */ #cse-search-box {width:221px;height:24px;margin:0 0 7px 0;padding:0 0 0 2px; overflow: hidden;} #cse-search-box fieldset {} #cse-search-box label {position:absolute;visibility:hidden;} #cse-search-box input.text { float:left;width:170px;height:16px;padding:4px 5px !important;border-right:1px solid #a1cee5 !important; border-top:none !important; border-bottom:none !important; border-left:none !important; color:#727272 !important; background:#FFF url(../images/bg_search.gif) 0 0 no-repeat !important;outline:none;} #cse-search-box input.text:focus {color:#000 !important;} #cse-search-box input.buttonimg {float:left;} /* Price Guarantee */ #price_guarantee {height:30px;background-position:70px 4px;background-image:url(../images/bg_price-guarantee.png);background-repeat:no-repeat;} #price_guarantee a {display:block;height:30px;} #price_guarantee a strong {float:left;display:block;width:61px;height:28px;background:url(../images/txt_best-price-guarantee.gif) 0 5px no-repeat;text-indent:-999em;margin:0 87px 0 0;} #price_guarantee a span {float:left; height:28px; width:62px; background:url(../images/txt_learn-more.gif) 0 17px no-repeat;text-indent:-999em;} /* 2.3 Content -----------------------------------------------------------------------------------------------*/ #content {line-height:1.16em;padding-bottom:18px;} /* 2.3.1 Text Styling -----------------------------------------------*/ #content h1 {font-size: 1.5em;line-height:1.22em;text-transform:uppercase;font-weight:normal;} /* 18 / 22 */ #content h2 {font-size: 1.33em;line-height:1.125em;text-transform:uppercase;} /* 16 / 18 */ #content h2 em {font-size:0.75em;font-style:normal;font-weight:normal;} #content h3 {font-size: 1.25em;line-height:1.2em;} /* 15 / 18 */ #content h4 {font-size: 1.16em;line-height:1.28em;} /* 14 / 18 */ #content h5 {font-size: 1.08em;line-height:1.38em;} /* 13 / 18 */ #content h6 {font-size: 1em;line-height:1.5em; text-transform:uppercase; font-weight:normal;} #content p {margin:0 0 8px 0;line-height:1.25em;} #content p.footnote {clear:both;font-size: 0.91em;line-height:1.18em;} /* Lists */ #content ul {margin:0 0 12px 0;} #content ul li {padding:2px 0 2px 12px;line-height:1.25em;background-image:url(../images/arr-green-right.gif);background-position:0 5px;background-repeat:no-repeat;} /* Reseting lists */ #content ul.top, #content ul.product-rows, #content ul.news-short, #content ul.product-order-rows, #content ul.package-list, #content ul.features, #content ul.features2, #content ul.product-upgrade-rows, #content .product-categories #content #forum ul {margin:0;} #content ul.top li, #content ul.product-rows li, #content ul.news-short li, #content ul.product-order-rows li, #content ul.package-list li, #content ul.features li, #content ul.features2 li, #content ul.product-upgrade-rows li, #content .product-categories li, #content #forum ul li {padding:0;background-image:none;background-position:0 0;} #content hr {display:block;height:1px;border:none;background-color:#dcdcdc;clear:both;margin:18px 0;} #content a.button {float:right;padding:0 10px 0 0;height:25px;line-height:25px;font-size:0.91em;font-weight:bold;text-transform:uppercase;background-repeat:no-repeat;background-position:100% -25px; text-decoration:none;} #content a.button:hover {text-decoration:none;background-position:100% 0px;} #content a.button span { display: block; padding:0 0 0 10px;background-repeat:no-repeat;background-position:0 -25px;} #content a.button:hover span {background-position:0 0px;} #content a.button-blue {background-color:#0067b5;color:#fff;} #content a.button-blue:hover {background-color:#00467b;} #content a.button-blue, #content a.button-blue span {background-image:url(../images/bg_but-blue.gif);} #content a.button-green {background-color:#42b50f;color:#fff;} #content a.button-green:hover {background-color:#00467b;} #content a.button-green, #content a.button-green span {background-image:url(../images/bg_but-green.gif);} #content a.button-gray {background-color:#cacaca;color:#000;} #content a.button-gray:hover {background-color:#e6e6e6;} #content a.button-gray, #content a.button-gray span {background-image:url(../images/bg_but-grey.gif);} /* 2.3.2 Boxes & Wrappers -----------------------------------------------*/ #content .twocol {margin:0 0 18px 0; background:url(../images/dot.gif) 475px 0 repeat-y; width: 100%; overflow: hidden; position: relative;} #content .twocol .main-col {float:left;width:470px;} #content .twocol .secondary-col {float:right;width:230px;} #content .twocol2 {margin:0 0 18px 0; background:url(../images/dot.gif) 455px 0 repeat-y; width: 100%; overflow: hidden;} #content .twocol2 .main-col {float:left;width:450px;} #content .twocol2 .secondary-col {float:right;width:250px;} #content .nobg {background-image:none;} #content .box {position:relative;margin:0 0 18px 0; width: 100%; overflow: hidden;} #content .box .box-details {padding:0 12px; } #content .box .box-details p {font-size: 1.04em;line-height:1.38em; clear: both;} #content .box .box-details ul li {font-size: 1.04em;line-height:1.15em;} #content .box .box-botright {position:absolute;bottom:-19px;right:10px; width: 192px; height: 132px;} #content .box .box-botright span.img-rounded{ display: block; width: 192px; height: 132px; position: relative; bottom: 0;} #content .two-col-row-wrap { width: 686px; overflow: hidden; margin:0 12px 18px;background-image:url(../images/dot.gif);background-repeat:repeat-y;background-position:50% 0;} #content .two-col-row-wrap .col {width:329px; position: relative; } #content .three-col-row-wrap {width: 686px; overflow:hidden; margin:0 12px 18px;background-image:url(../images/bg_three-col.gif);background-repeat:repeat-y;background-position:0 0;} #content .three-col-row-wrap .col { float: left; width:202px;margin:0 40px 0 0;} #content .three-col-row-wrap .col-last {float: right; margin:0;} .col-left {float: left;} .col-right {float: right;} /* Scrollable */ #content .scrollable {overflow:auto;margin:0 0 18px 0;} /* hztmp #content #scroll_news-short {height:234px;} #content #scroll_home-features {height:414px;} */ /* Heading wrappers */ #content .heading {position:relative;height:34px;padding:0 0 0 12px;margin:0 0 18px 0;background-position:0 0;background-repeat:no-repeat;} #content .heading h2 {line-height:18px;height:18px;padding:8px 12px 8px 0;background-position:100% 0;background-repeat:no-repeat;} #content .heading .exclusive {position:absolute;top:-2px;right:0;width:124px;height:45px;background-image:url(../images/bg_exclusive.gif);background-repeat:no-repeat;background-position:0 0;} #content .heading-lightblue .exclusive {background-image:url(../images/bg_exclusive-light.gif);} #content .heading-blue {background-color:#0067b5;} #content .heading-blue, #content .heading-blue h2 {background-image:url(../images/bg_heading-blue.gif);color:#fff;} #content .heading-blue a {color:#fff;} #content .heading-lightblue {background-color:#e5f6ff;} #content .heading-lightblue, #content .heading-lightblue h2 {background-image:url(../images/bg_heading-lightblue.gif);color:#00508d;} #content .heading-lightblue a {color:#00508d;} #content .heading-green {background-color:#42b50f;} #content .heading-green, #content .heading-green h2 {background-image:url(../images/bg_heading-green.gif);color:#fff;} #content .heading-green a {color:#fff;} #content .heading-gray {background-color:#e6e6e6;} #content .heading-gray, #content .heading-gray h2 {background-image:url(../images/bg_heading-gray.gif);color:#000;} #content .heading-gray a {color:#000;} /* Rounded corners for images */ #content .img-rounded {float:left;position:relative;} #content .box-botright .img-rounded {margin:0;} #content .img-fullwidth {margin:0 0 12px 0;} #content .img-rounded img {float:left;border:1px solid #dcdcdc;} #content .img-rounded span {width:6px;height:6px;background-repeat:no-repeat;background-position:0 0;background-color:transparent;} #content .img-rounded span.nw {position:absolute;top:0;left:0;background-image:url(../images/mask-nw.png);} #content .img-rounded span.ne {position:absolute;top:0;right:0;background-image:url(../images/mask-ne.png);} #content .img-rounded span.se {position:absolute;bottom:0;right:0;background-image:url(../images/mask-se.png);} #content .img-rounded span.sw {position:absolute;bottom:0;left:0;background-image:url(../images/mask-sw.png);} #content .img-rounded .badge {position:absolute;bottom:-10px;right:-12px;width:45px;height:45px;background-position:50% 50%;background-repeat:no-repeat;} #content .img-rounded .badge-free {background-image:url(../images/badge-free.png);} #content .img-rounded-highlight img {border-color:#b9e6ff;} #content .img-rounded-highlight span.nw {background-image:url(../images/mask-nw-h.png);} #content .img-rounded-highlight span.ne {background-image:url(../images/mask-ne-h.png);} #content .img-rounded-highlight span.se {background-image:url(../images/mask-se-h.png);} #content .img-rounded-highlight span.sw {background-image:url(../images/mask-sw-h.png);} #content .img-rounded-link img {border-color:#004d87;} #content .img-rounded-link span.nw {background-image:url(../images/mask-nw-l.png);} #content .img-rounded-link span.ne {background-image:url(../images/mask-ne-l.png);} #content .img-rounded-link span.se {background-image:url(../images/mask-se-l.png);} #content .img-rounded-link span.sw {background-image:url(../images/mask-sw-l.png);} /* Rating - static */ #content .rating-wrap {margin:10px 0;} #content .rating-wrap strong {float:left;font-weight:normal;font-size: 0.91em;line-height:15px;margin:0 10px 0 0;} #content .rating-wrap .rating {float:left;height:15px;width:75px; background:url(../images/star-off.gif) 0 0 repeat-x;} #content .rating-wrap .rating .stars {float:left;height:15px; background:url(../images/star-on.gif) 0 0 repeat-x;} #content .rating-wrap .rating .stars-1 {width:15px;} #content .rating-wrap .rating .stars-2 {width:30px;} #content .rating-wrap .rating .stars-3 {width:45px;} #content .rating-wrap .rating .stars-4 {width:60px;} #content .rating-wrap .rating .stars-5 {width:75px;} /* Prominent text */ #content .prominent {margin:18px 0;padding:0 12px;} #content .prominent h1 {margin:0 0 18px 0;} #content .prominent p { font-size: 1.12em; line-height:1.28em; margin:0 0 18px 0; } /* Standout Offers */ #content .standout_offers {width:710px;} #content .standout_offers .offer {float:right;width:350px;position:relative;} #content .standout_offers .offer:first-child, #content .standout_offers .first-child {float:left;} #content .standout_offers .offer p.footnote {padding:0 0 0 28px;margin:0;} #content .standout_offers .offer a.badged {margin:0 0 3px 0;} #content a.badged {position:relative;float:left;width:350px;height:46px; background:#c3eaff url(../images/bg_badged.png) 0 0 no-repeat;} #content a.badged span.free, #content a.badged span.save {position:absolute;top:22px;left:31px;width:42px;height:19px;background-repeat:no-repeat;background-position:50% 50%;text-align:left;text-indent:-999em;} #content a.badged span.free {background-image:url(../images/txt_free.gif);} #content a.badged span.save {background-image:url(../images/txt_save.gif);} #content a.badged strong {position:absolute;top:20px;left:93px;width:240px;height:18px;background-position:0 0;background-repeat:no-repeat;text-align:left;text-indent:-999em;} #content a.badged strong.toothpaste {background-image:url(../images/txt_drcollinswtoothpaste.gif);} #content a.badged strong.discount20 {background-image:url(../images/txt_upto20onquantitiesof3.gif);} /* Breadcrumbs */ #content .breadcrumbs {background:#e6e6e6 url(../images/bg_breadcrumbs.gif) 0 0 no-repeat;height:34px;margin:0 0 18px 0;} #content .breadcrumbs ul {padding:0 0 0 6px;margin:0;} #content .breadcrumbs ul li {float:left;padding:0;background-image:url(../images/bg_breadcrumbs-sep.gif);background-position:100% 50%;} #content .breadcrumbs ul li.current {background-image:none;} #content .breadcrumbs ul a { display: block; padding:0 12px;line-height:34px;font-size:1.16em;color:#000;text-decoration:underline;} #content .breadcrumbs ul a:hover {color:#0067b5;} #content .breadcrumbs ul li.current a, #content .breadcrumbs ul li.current a:hover {color:#0067b5; text-decoration:none; cursor:default;} /* 2.4 Sidebar -----------------------------------------------------------------------------------------------*/ #sidebar {} /* 2.4.1 Side Navigation -----------------------------------------------*/ #sidenavigation {width: 230px;overflow:hidden;background:#f5f5f5 url(../images/bg_sidenavigation-bot.gif) 0 100% no-repeat;padding:0 0 10px 0;margin:0 0 20px 0;} #sidenavigation h3 {font-size: 1.33em; line-height:1.25em;font-weight:normal; text-transform:uppercase; color:#fff;padding:6px 10px 6px 20px; margin:0 0 1px 0; background:#3e9d0a url(../images/bg_sidenavigation-head.gif) 0 0 no-repeat;} /* Menu */ #sidenavigation ul.menu { } #sidenavigation ul.menu li {} #sidenavigation ul.menu a {display:block;font-size: 1.1667em; line-height:1.28em; padding:6px 10px 6px 20px;color:#333;border-top:1px solid #dadada; text-decoration:none;} #sidenavigation ul.menu a:hover {text-decoration:underline; color:#3e9e0a;background-color:#fff;} #sidenavigation ul.menu li.current a, #sidenavigation ul.menu li.current a:hover {} #sidenavigation ul#shop_categories {padding-bottom:10px;border-bottom:2px solid #dadada;margin:0 0 10px 0; } #sidenavigation ul#special_products li:first-child a, #sidenavigation ul#special_products li.first-child a {border-top:none;} /* 2.4.2 Live Chat -----------------------------------------------*/ #livechat {cleat:both;width: 230px;overflow:hidden;} #livechat a {background:#0067b5 url(../images/bg_livechat.gif) 0 0 no-repeat;display:block;color:#fff;padding:15px 0 0 61px;margin:0 0 20px 0;height:61px; text-decoration:none;} #livechat a:hover {text-decoration:none;} #livechat a strong {display:block;font-size:1.83em;line-height:1.09em; text-transform:uppercase;font-weight:normal; letter-spacing:-1px;} #livechat a span {display:block;font-size: 1.25em;line-height:1.46em;} /* 2.4.3 Newsletter -----------------------------------------------*/ #newsletter {background:#c2e080 url(../images/bg_newsletter.png) 0 0 no-repeat;margin:0 0 20px 0;padding:13px 0 0 61px;height:66px;width: 161px;overflow:hidden;} #newsletter h5 {font-size:1.83em;line-height:1.09em; text-transform:uppercase;font-weight:normal; color:#333; letter-spacing:-1px; margin:0 0 10px 0;} #newsletter form {} #newsletter fieldset {} #newsletter label {position:absolute;visibility:hidden;} #newsletter input.text {float:left;width:114px;padding:5px 4px 5px 8px;color:#666;border:none;margin:0 1px 0 0; background:transparent url(../images/bg_newsletter-input.gif) 0 0 no-repeat;outline:none;} #newsletter input.text:focus {color:#000 ;} #newsletter input.butotnimg {} /* 2.4.4 Caution -----------------------------------------------*/ #caution {margin:0 0 20px 0;width: 230px;overflow:hidden;} #caution a {display:block;padding:11px 0 0 57px;height:126px;background:#ff581f url(../images/bg_caution.png) 0 0 no-repeat;color:#fff; text-decoration:none;} #caution a:hover {text-decoration:none;;} #caution a span {display:block;font-size: 1.25em;line-height:1.2em;margin:0 0 18px 0;} #caution a strong {font-size: 1.5em;line-height:1.22em;font-weight:bold; text-transform:uppercase;} /* 2.5 Footer -----------------------------------------------------------------------------------------------*/ #footer {color:#fff;} #footer .container {padding:20px 0;} #footer a {color:#fff;} /* Offers */ #offers {} #offers .container {} #offers ul {width:957px;margin-right:-7px;} #offers ul li {float:left;width:232px;height:118px; background:#f4faea url(../images/bg_offer.gif) 0 0 no-repeat;margin:0 7px 0 0;} #offers ul a {display:block;width:117px;height:91px;background-repeat:no-repeat;background-position:14px 18px;padding:27px 0 10px 105px;color:#000; text-decoration:none;} #offers ul a:hover {text-decoration:none;color:#42B50F;} #offers ul a strong {display:block;font-size: 1.5em;line-height:1.16em;font-weight:bold; text-transform:uppercase;margin:0 0 2px 0;} #offers ul a span {display:block;line-height:1.16em; text-transform:uppercase;font-weight:bold;} #offers ul #free_gift a {background-image:url(../images/ico/free_gift.png);} #offers ul #best_price a {background-image:url(../images/ico/best_price.png);} #offers ul #bulk_discounts a {background-image:url(../images/ico/bulk_discounts.png);} #offers ul #loyalty_bonus a {background-image:url(../images/ico/loyalty_bonus.png);padding-left:122px;width:100px;} /* Menu */ #footer .menu {float:left;width:715px;position:relative;left:-5px;} #footer .menu li {float:left;} #footer .menu a { display: inline-block; line-height:0px;padding:0 0px; text-decoration:none;} #footer .menu a:hover {text-decoration:underline;} #footer .menu li:first-child a, #footer .menu li.first-child a {background-image:none;} #footer .menu a:hover {} /* Social */ #footer .social {float:right;width:230px;line-height:30px;} #footer .social span {float:left;padding:0 10px 0 0;} #footer .social ul {} #footer .social ul li {float:left;} #footer .social ul li a {float:left;width:32px;height:30px;background-position:center center;background-repeat:no-repeat;background-color:transparent;text-indent:-999em;} #footer .social .facebook a {background-image:url(../images/ico/facebook.gif);} #footer .social .twitter a {background-image:url(../images/ico/twitter.gif);} /* Copyright */ #footer .copyright {clear:both;padding:30px 0;line-height:30px;} /* 3. INDIVIDUAL PAGES ----------------------------------------------------------------------------------------------- ===============================================================================================*/ /* 3.1 Homepage -----------------------------------------------------------------------------------------------*/ /* Top */ #content ul.top li {text-transform:uppercase;padding:3px 12px 3px 12px;line-height:1.33em;} /* Product-rows */ #content ul.product-rows li {clear:both;padding:0 12px 3px 12px;border-bottom:1px solid #dcdcdc;margin:0 0 12px 0;} #content ul.product-rows li .img-rounded {margin:0 12px 0 0;} #content ul.product-rows li .decription {margin:0 0 0 104px;} /* News-short */ #content ul.news-short li {padding:0 0 0 12px;margin:0 0 8px 0;} #content ul.news-short li span.date {display:block; text-transform:uppercase; line-height:1.33em;} #content ul.news-short li p {font-size: 0.91em;line-height:1.18em;} /* Product Featured Specials */ #content .product-featured-specials {} #content .product-featured-specials .img-rounded {margin:0 12px 8px 0;} #content .product-featured-specials .description {margin:0 0 8px 164px;} #content .product-featured-specials .description h6 {font-weight:bold;margin:0 0 8px 0;} #content .product-featured-specials .price {float:left;clear:left;padding:0 0 0 10px;line-height:25px;} #content .product-featured-specials .price strong {color:#db331c;} /* United Headings */ #content #united_headings {background-image:url(../images/bg_heading-blue.gif);background-position:0 0;background-repeat:no-repeat;} #content #united_headings .heading-blue {background-color:transparent;} #content #united_headings .heading-blue, #content #united_headings .heading-blue h2 {background-image:none;} /* 3.2 Products index (products) -----------------------------------------------------------------------------------------------*/ /* Product Best Seller */ #content .product-best-seller {} #content .product-best-seller .img-rounded {margin:0 0 18px 0; } #content .product-best-seller h4 {clear:both;} #content .product-best-seller .description {min-height:91px;} * html #content .product-best-seller .description {height:91px;} #content .product-best-seller p {} #content .product-best-seller .price {} #content .product-best-seller .price .list {display:block;color:#999;line-height:1.5em;} #content .product-best-seller .price .sale {font-size: 1.16em;line-height:1.28em;color:#e31d08;} #content .product-best-seller .rating-wrap {margin:18px 0 28px;} #content .product-best-seller .button-gray {float:left;} /* Product Teaser */ #content .product-teaser { width: 329px; overflow: hidden; } #content .product-teaser .img-rounded {margin-bottom:5px; width: 152px; float: left;} #content .product-teaser .description {width: 165px; float: right;} #content .product-teaser .description h6 {font-weight:bold;margin:0;} #content .product-teaser .price { padding:0 0 0 5px;line-height:18px;margin:0 0 10px 0;width:324px; overflow: hidden; border-bottom: 1px solid yellow; clear: both;} #content .product-teaser .price span.list {display:block;color:#999;} #content .product-teaser .price span.sale {display:block;color:#db331c;} #content .product-teaser .price span.sale strong {font-size:1.08em;} #content .product-teaser .button-blue {float:left;} #content .product-teaser .button-gray {float:right;} #content .product-teaser .product-teaser-detail{ width: 100%; overflow: hidden; } #content .product-teaser .wrapper-button{ width: 100%; overflow: hidden; } /* 3.3 Product page (products_featured) -----------------------------------------------------------------------------------------------*/ /* Product details */ #content .product-details {padding:0 12px;} #content .product-specifications {margin:0 0 12px 0; width: 100%; overflow: hidden;} #content .product-specifications .img-rounded {margin:0 12px 0 0;} #content .product-specifications .features {float:left;} #content .product-details .description h6 {text-transform:uppercase;font-weight:bold;margin:0 0 8px 0;} #content .product-details .description p {line-height:1.5em;} #content ul.features {width:400px;} #content ul.features li {padding:0 0 9px 0;} #content ul.features li.odd {background-image:url(../images/bg_features.gif);background-position:0 100%;background-repeat:no-repeat;} #content ul.features li.odd dl {background-image:url(../images/bg_features.gif);background-position:0 0;background-repeat:no-repeat;} #content ul.features li dl {padding:9px 20px 0 20px;line-height:18px; width: 432px; overflow: hidden;} #content ul.features li dl dt {float:left;width:202px;margin:0 0px 0 0;} #content ul.features li dl dd {float:left;width:200px;} #rounded-corner { font-family: Arial, Helvetica, sans-serif; font-size: 12px; margin: 0px; width: 680px; text-align: left; border-collapse: collapse; } #rounded-corner thead th.rounded-company { background: #E5F6FF url('table-images/left.png') left -1px no-repeat; } #rounded-corner thead th.rounded-q4 { background: #E5F6FF url('table-images/right.png') right -1px no-repeat; } #rounded-corner th { padding: 8px; font-weight: normal; font-size: 13px; color: #039; background: #E5F6FF; } #rounded-corner td { padding: 8px; background: #F7FCFF; border-top: 1px solid #fff; color: #669; } #rounded-corner tfoot td.rounded-foot-left { background: #F7FCFF url('table-images/botleft.png') left bottom no-repeat; } #rounded-corner tfoot td.rounded-foot-right { background: #F7FCFF url('table-images/botright.png') right bottom no-repeat; } #rounded-corner tbody tr:hover td { background: #E5F6FF; } /* Product-order-rows */ #content ul.product-order-rows li {clear:both;padding:0 12px 0 12px;margin:0 0 12px 0;} #content ul.product-order-rows li .img-rounded {margin:0 12px 0 0;} #content ul.product-order-rows li .description {margin:0 0 0 164px;} #content ul.product-order-rows li .description h4 {margin:0 0 15px 0;} #content ul.product-order-rows li .price {clear:left;color:#DB331C;padding:5px 0 0 5px;margin:0 0 8px 0;} #content ul.product-order-rows li .button {float:left;} /* Product Upgrade */ #content .product-upgrade {} #content .product-upgrade .img-rounded {margin:0 12px 0 0;} #content .product-upgrade .description {margin:0 0 0 164px;} #content .product-upgrade .description h4 {text-transform:uppercase;margin:0 0 15px 0;} #content .product-upgrade .description p {line-height:1.25em;} #content .product-upgrade .button-blue {float:left;clear:left;} #content .product-upgrade .price {float:left;clear:left;color:#db331c;padding:5px 0 0 5px;margin:0 0 8px 0;} #content .product-upgrade .price strong {display:block;} /* Package Items */ #content .package-items {padding:0 12px;} #content .package-items h5 {/* color:#004f8b; */} #content .package-items p {margin:0 0 18px 0;line-height:1.5em;} /* Kit contents */ #content .kit-components {padding:0 12px;} #content .kit-components h5 {margin:0 0 18px 0;} #content ul.package-list {padding:0 0 0 8px;} #content ul.package-list li {padding:0 0 0 12px;margin:0 0 0 0;background-image:url(../images/arr-green-right.gif);background-position:0 5px;font-size: 1em;line-height:1.5em;} #content ul.package-list li .type {display:block;padding:0 0 0 20px;} /* RatePint Reviews */ #content .ratepoint-reviews {padding:0 11px 0 12px;} /* 3.4 Kits page (whitening_kits) -----------------------------------------------------------------------------------------------*/ /* Product Categories */ #content .product-categories { padding:0 0 0 0px; margin:0 0 10px 0; width: 698px; overflow: hidden; height: 378px; position: relative; background-color: #F9F9FF; } #content .product-categories ul{ margin: 0; padding: 0;} #content .box .product-categories {margin-bottom:0;} #content .product-categories ul li {float:left;width:224px; overflow: hidden;} #content .product-categories ul li a { display:block; text-decoration:none; padding:10px 0 0; text-align: left; } #content .product-categories ul li .img-rounded {margin-left:21px; width: 72px; position: relative;padding:0 0 0 0;} #content .product-categories ul li strong {display:block;clear:both;text-align:center;line-height:1.5em;padding:10px 0 10px 0;} /* Product Upgrade - Rows */ #content ul.product-upgrade-rows {} #content ul.product-upgrade-rows li {padding:18px 0 0 0;border-top:1px solid #dcdcdc;margin:18px 0 0 0;} #content ul.product-upgrade-rows li .img-rounded {margin:0 18px 12px 0;} #content ul.product-upgrade-rows li .description {margin:0 0 8px 140px;} #content ul.product-upgrade-rows li h4 {} #content ul.product-upgrade-rows li .price {line-height:18px;margin:0 0 8px 0;} #content ul.product-upgrade-rows li .price .sale {display:block;color:#ec2109;} #content ul.product-upgrade-rows li .price .sale strong {font-size: 1.08em;} #content ul.product-upgrade-rows li .price .list {display:block;color:#999;} #content ul.product-upgrade-rows li p {line-height:1.5em;} #content ul.product-upgrade-rows li .button-blue {float:left;clear:left;} /* 3.5 Whiter Smile (whiter_smile) -----------------------------------------------------------------------------------------------*/ /* Guide */ #content .guide {margin:18px 0;} #content .guide h4 {padding:0 12px;margin:0 0 12px 0;} #content .guide table {width:100%;} #content .guide table th {padding:12px 6px;background-color:#f5f5f5;font-size: 1.08em;line-height:1.38em;} #content .guide table td {padding:8px 6px;line-height:1.5em;} #content .guide table th:first-child, #content .guide table td:first-child {padding-left:12px;} #content .guide table tr.odd td {background-color:#d9f1ff;} #content .main-col .guide {margin-right:6px;} #content .secondary-col .guide {margin-left:6px;} /* Advantages */ #content .advantages {padding:0 12px;} #content .advantages h4 {margin:0 0 18px 0;} /* Ratepoint Reviews */ #content .ratepoint_review {padding:0 12px;} /* Caution */ #content .caution {color:#d0271b; text-transform:uppercase;} #content .caution p {font-size: 0.91em;line-height:1.36em;} #content .caution a {color:#004b83; text-decoration:none;} #content .caution a:hover {text-decoration:underline;} /* Limited Offer */ #content .limited-offer {padding:0 12px;} #content .limited-offer .img-rounded {margin:0 12px 0 0;} #content .limited-offer .description {margin:0 0 0 134px;} #content .limited-offer h2 {color:#d2291b;margin:0 0 12px 0;} #content .limited-offer p {font-size: 1.08em;line-height:1.38em;} /* Product - detailed */ #content .product-detailed {padding:0 12px;} #content .product-detailed .img-rounded {margin:0 12px 8px 0;} #content .product-detailed .price {float:left;clear:left;padding:0 0 0 5px;width:147px;} #content .product-detailed .price .list {display:block;color:#999;} #content .product-detailed .price .sale {display:block;color:#ec2109;} #content .product-detailed .price .sale strong {font-size: 1.08em;} #content .product-detailed .description {margin:0 0 12px 164px;} #content .product-detailed .description h4 {margin:0 0 12px 0;} #content .product-detailed .button-blue {float:left;} /* 3.6 Product Comparison -----------------------------------------------------------------------------------------------*/ /* Paralel products */ #content .products-paralel {border-top:1px solid #dcdcdc;margin:18px 0;} #content .products-paralel table {} #content .products-paralel table th {padding:12px;line-height:1.5em;border-bottom:1px solid #fff;border-top:1px solid #fff;background-color:#f9f9f9;font-weight:bold;} #content .products-paralel table td {padding:12px;} #content .products-paralel table td p {line-height:1.25em;} #content .products-paralel table td span {display:block;line-height:1.25em;} #content .products-paralel table td {background-color:#fcfcfc;} #content .products-paralel table td.odd {background-color:#fff;} #content .products-paralel table td.description {background-color:#f9f9f9;} #content .products-paralel table .n1 td {background-color:#f0f8fc;} #content .products-paralel table .n1 td .img-rounded span.nw {background-image:url(../images/mask-nw-f0f8fc.png);} #content .products-paralel table .n1 td .img-rounded span.ne {background-image:url(../images/mask-ne-f0f8fc.png);} #content .products-paralel table .n1 td .img-rounded span.sw {background-image:url(../images/mask-sw-f0f8fc.png);} #content .products-paralel table .n1 td .img-rounded span.se {background-image:url(../images/mask-se-f0f8fc.png);} #content .products-paralel table .n1 td.odd {background-color:#e5f5ff;} #content .products-paralel table .n2 td.description {background-color:#e0eff9;} #content .products-paralel table a.product-image {width:114px; text-decoration:none;} #content .products-paralel table a.product-image:hover {} #content .products-paralel table a.product-image .img-rounded {margin-left:11px;display:inline;} #content .products-paralel table a.product-image strong {clear:both;display:block;line-height:1.25em;text-align:center;font-weight:normal; text-decoration:underline; padding:10px 0 0 0;} #content .products-paralel table .price .sale {color:#d62e1b;} /* Products Comparison */ #content .products-comparison {border-top:1px solid #dcdcdc;padding-top:1px;} /* Left "row-heads" */ #content .products-comparison .rowheads {float:left;width:132px;} #content .products-comparison .rowheads table {} #content .products-comparison .rowheads table th {} #content .products-comparison .rowheads table th span {display:block;height:142px;} #content .products-comparison .rowheads table td {padding:12px 6px;border-top:1px solid #f5f5f5;} #content .products-comparison .rowheads table tr.odd td {background-color:#f9f9f9;} #content .products-comparison .rowheads table tr.last td {border-top:1px solid #ebebeb;border-bottom:1px solid #ebebeb;} #content .products-comparison .rowheads table td span {display:block;height:30px;line-height:15px;} /* Right - scrollable comparison table */ #content .products-comparison .horizscrollable-wrapper {float:left;width:578px;background-image:url(../images/bg_horizscroll.gif);background-repeat:no-repeat;background-position:100% 100%;} #content .products-comparison .horizscrollable {width:578px;} #content .products-comparison .comparison {float:left;} #content .products-comparison .comparison table {} #content .products-comparison .comparison table th {padding:0 6px;} #content .products-comparison .comparison table th.odd {background-color:#e5f5ff;} #content .products-comparison .comparison table td {padding:12px 6px;border-top:1px solid #f5f5f5;background-color:#fff;} #content .products-comparison .comparison table tr.odd td {background-color:#f9f9f9;} #content .products-comparison .comparison table td.odd {background-color:#e5f5ff;} #content .products-comparison .comparison table tr.odd td.odd {background-color:#f2f6f9;} #content .products-comparison .comparison table tr.last td, #content .products-comparison .comparison table tr.last td.odd {border-top:1px solid #ebebeb;border-bottom:1px solid #ebebeb;} #content .products-comparison .comparison a.product-image {display:block;height:124px;width:116px;padding:18px 0 0 0;} #content .products-comparison .comparison a.product-image .img-rounded {margin-left:12px;display:inline;} #content .products-comparison .comparison a.product-image strong {clear:both;display:block;text-align:center;font-weight:normal;padding:10px 0 0;} #content .products-comparison .comparison table td span {display:block;width:116px;height:30px;line-height:15px;text-align:center;} #content .products-comparison .comparison table td .price .sale {color:#d62e1b;} #content .products-comparison .comparison table td .price .sale strong {display:block;} /* 3.7 Forum -----------------------------------------------------------------------------------------------*/ #forum {} /* Search form */ #forum #searchbox { width: 100%; overflow: hidden;} #forum #searchbox fieldset {height:24px;} #forum #searchbox fieldset form {float:right; width: 471px;} #forum #searchbox fieldset form label {float:left;font-size:1em;line-height:24px;text-transform:uppercase; color:#3a2f14; font-weight:bold;padding:0 8px 0 0; width: 200px; text-align: right;} #forum #searchbox fieldset input {float:left;} #forum #searchbox fieldset input#q {width:224px; border:none;padding:4px;background-image:url(../images/bg_input-search.gif);background-position:0 0;background-repeat:no-repeat;} /* Generic styles */ #forum h2 {margin:0 10px 8px 10px; text-transform:none;} #forum h2 a {text-decoration:none;} #forum a.forumtitle, #forum a.topictitle {font-size: 1.08em;font-weight:bold;} #forum dfn {position:absolute;left:-999em;} /* Topic List */ #forum .forabg {background-color:#f8f8f8;margin:0 0 18px 0;} #forum .forumbg {background-color:#fbfbfb;margin:0 0 18px 0;} #forum .bg1 {background-color:#f8f8f8;} #forum .bg2 {background-color:#f5fcff;} #forum ul.topiclist {margin:0;} #forum ul.topiclist li {border-bottom:1px solid #fff;line-height:1.5em;} #forum ul.topiclist li.header {background-color:#cce1f0;font-weight:bold;color:#000;} #forum ul.topiclist dl{ width: 100%; overflow: hidden;} #forum ul.topiclist dt {float:left;padding:6px 10px;border-right:1px solid #fff;width:350px;} #forum ul.forums li {min-height:48px;} #forum ul.forums dt {width:310px;padding-left:50px;background-position:10px 9px;background-repeat:no-repeat;background-image:url(../images/ico-forum.gif);min-height:36px;} #forum ul.topiclist dd {float:left;padding:6px 10px;border-right:1px solid #fff;} #forum ul.topiclist dd.topics {width:80px;font-weight:bold;} #forum ul.topiclist dd.posts, #forum ul.topiclist dd.views {width:50px;font-weight:bold;} #forum ul.topiclist dd.lastpost {width:147px;border-right:none;font-weight:bold;} /* Detail */ #forum .post {border-bottom:1px solid #fff;clear:both;padding:0 0 10px 0;} #forum .post .postbody {margin-left:120px;padding-top:29px;position:relative;} #forum .post .content {line-height:1.33em;padding:10px 10px 0 0;} #forum .post p.author {position:absolute;top:0;left:-120px;width:690px;background-color:#cce1f0;font-weight:bold;line-height:1.5em;padding:5px 10px;border-bottom:1px solid #fff;} #forum .post .postprofile {float:left;width:100px;padding:0 0 10px 10px;margin:40px 10px 0 0;} #forum .post .postprofile dt {margin:0 0 10px 0;line-height:1.5em;} /* Forum breadcrumbs */ #forum ul.navlinks {height:18px;margin:18px 10px 18px 2px;} #forum ul.navlinks li a {float:left;font-size: 1.16em;line-height:1.28em;padding:0 8px;} #forum ul.navlinks li a:first-child {font-weight:bold;} #forum ul.navlinks li strong {float:left;text-align:left;text-indent:-999em;background-image:url(../images/bg_forum-nav-sep.gif);background-position:50% 50%;background-repeat:no-repeat;width:8px;height:18px;} /* Pagination */ #forum .pagination {display:inline;margin:18px 10px;color:#3a2f14;font-weight:bold;line-height:25px;} #forum .pagination a {color:#3a2f14; text-decoration:none; padding:0 0 0 6px;} #forum .pagination a:hover {color:#0067b5;} #forum .pagination a.next {padding:0 26px 0 4px;margin-left:8px;background-image:url(../images/ico/next.gif);background-position:100% 50%;background-repeat:no-repeat;} #forum .pagination span {margin:0 8px 0 0; line-height:18px;} #forum .pagination span span {margin:0 2px 0 0;} /* 4. PLUGINS ----------------------------------------------------------------------------------------------- ===============================================================================================*/ /* 4.1 jScrollpane -----------------------------------------------------------------------------------------------*/ .jScrollPaneContainer{position:relative; overflow:hidden; z-index:1; margin:0 0 18px 0;} .jScrollPaneTrack{position:absolute; cursor:pointer; right:0; top:0; height:100%; background:#fff} .jScrollPaneDrag{position:absolute; background:#cacaca; cursor:pointer; overflow:hidden} .jScrollPaneDragTop{position:absolute; top:0; left:0; height:5px; width:100%; overflow:hidden; background:url(../images/scroll-top.gif) 0 0 no-repeat;} .jScrollPaneDragBottom{position:absolute; bottom:0; left:0; height:5px; overflow:hidden; background:url(../images/scroll-bottom.gif) 0 0 no-repeat;} a.jScrollArrowUp{display:block; position:absolute; z-index:1; top:0; right:0; text-indent:-2000px; overflow:hidden; height:15px; background-image:url(../images/arrow-up.gif);background-repeat:no-repeat;background-position:0 0;} a.jScrollArrowUp:hover{} a.jScrollArrowDown{display:block; position:absolute; z-index:1; bottom:0; right:0; text-indent:-2000px; overflow:hidden; height:15px; background-image:url(../images/arrow-down.gif);background-repeat:no-repeat;background-position:0 100%;} a.jScrollArrowDown:hover{} a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover{} /* 4.2 jScrollHorizontalpane -----------------------------------------------------------------------------------------------*/ .horizscrollable-wrapper {} .horizscrollable-wrapper .jScrollPaneContainer{position:relative; overflow:hidden; z-index:1; padding-bottom:29px;margin:0;} .horizscrollable-wrapper .jScrollPaneTrack{position:absolute; cursor:pointer; left:0; bottom:10px; top:auto; right:auto; width:100%; background:#f5f5f5} .horizscrollable-wrapper .jScrollIntervalTrack{position:absolute} .horizscrollable-wrapper .jScrollPaneDrag{position:absolute; background:#cacaca; cursor:pointer; overflow:hidden} .horizscrollable-wrapper .jScrollPaneDragLeft{position:absolute; bottom:0; left:0; overflow:hidden; background-image:url(../images/scroll-left.gif);background-position:0 0;background-repeat:no-repeat;width:10px;} .horizscrollable-wrapper .jScrollPaneDragRight{position:absolute; bottom:0; right:0; overflow:hidden; background-image:url(../images/scroll-right.gif);background-position:100% 0;background-repeat:no-repeat;width:10px;} .horizscrollable-wrapper a.jScrollArrowLeft{display:block; position:absolute; z-index:1; bottom:10px; left:0; text-indent:-2000px !important; overflow:hidden; height:11px; width:15px; background-image:url(../images/arrow-left.gif);background-repeat:no-repeat;background-position:0 0;} .horizscrollable-wrapper a.jScrollArrowLeft:hover{/*background-color:#f60; */} .horizscrollable-wrapper a.jScrollArrowRight{display:block; position:absolute; z-index:1; bottom:10px; right:1px; text-indent:-2000px !important; overflow:hidden; background-image:url(../images/arrow-right.gif);background-repeat:no-repeat;background-position:100% 0; height:11px; width:15px;} .horizscrollable-wrapper a.jScrollArrowRight:hover{/*background-color:#f60; */} .horizscrollable-wrapper a.jScrollActiveArrowButton, .horizscrollable-wrapper a.jScrollActiveArrowButton:hover{/*background-color:#f00; */}