@charset "UTF-8";
/* -----------------------------------------------------
1.0 UNIVERSAL RESETS
2.0 LAYOUT OR PAGE STRUCTURE
3.0 GENERIC CLASSES
4.0 HEADER AND SEARCH
5.0 NAVIGATION
6.0 PAGE ELEMENTS
7.0 PAGE SPECIFIC STYLES
8.0 FOOTER
10.0 ERROR MESSAGES
12.0 SITEMAP
/*
*********************************************
1.0 UNIVERSAL RESETS: SEE RESET.CSS
*/
ul { margin: 0; padding: 0; list-style: none; }
ul li { margin: 0; padding: 0; }
a { color: #002d62; text-decoration: none; }
a:hover { text-decoration: underline; }
.hidethis
{ display: none; }
/*
**********************************************
2.0 LAYOUT OR PAGE STRUCTURE
*/
* { font: 11px arial, helvatica, sans-serif; }
body { margin: 20px 0; font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #222; }
#wrapper { width: 980px; margin: 0 auto; padding: 0; }
#content-wrapper { background: url(../images/bg_main.png) repeat-y left; }
#left-column { float: left; display: inline; width: 200px; margin-top: -2px; }
/* #content { margin-left: 200px; } */
#content { display:inline; float:left; width:780px; margin-top: -2px;}
#content-top-bar { padding: 5px 0; background: #D1D5D4; height: 15px; }
ul.page-actions { float: right; display: inline; }
ul.page-actions li { display: inline; float: left; border-left: solid 1px #013; padding: 0 5px 0 10px; }
ul.page-actions li.first { border-left: none; }
ul.page-actions li a { display: block; color: #002d62; text-decoration: none; }
ul.page-actions li a:hover { text-decoration: underline; }
button.play { background: url(../images/play_small.png) no-repeat 50% 50%; border: none; width: 20px; height: 20px; cursor: pointer; }
#footer { width: 980px; margin: auto; }
/*
************************************************
3.0 GENERIC CLASSES
*/
/* 3.1 RE-RESET COMMONLY USED ELEMENTS AND GENERIC CLASSES
-------------------------------------------------------------------*/
p { margin: 10px 0; }
h1 { font-size: 18px; margin: 5px 0; color: #002d62; }
h2 { font-size: 18px; margin: 5px 0; color: #002d62; }
h3 { font-size: 22px; margin: 5px 0; }
h4 { font-size: 14px; margin: 20px 0; color: #002d62; }
table { border: none; margin: 0; padding: 0; width: 95%; }
table tr { margin: 0; padding: 0; }
table th { text-align: left; font-weight: normal; color: #002d62; }
table td { margin: 0; padding: 0; }
strong { font-weight: bold; }
.small { font-size: 10px !important; }
/* 3.1 FLOAT CLEAR (INCLUDING FIX FOR IE)
-------------------------------------------------------------------*/
.group:after { content: "."; display: block; height: 0 !important; clear: both; visibility: hidden;}
* html .group { height: 1% !important; }
*:first-child+html .group
{ min-height: 1px !important; }
/*
*************************************************
4.0 HEADER AND SEARCH
*/
/* 4.1 HEADER
-------------------------------------------------------------------*/
#header-top-bar { background: #EBEADC url(../images/bg_header_fr.png); padding: 7px 10px; width: 960px; margin: 0 auto; }
#header-top-bar ul.select{ display: none; }
#header { width: 980px; margin: 0 auto; color: #002d62; background: #EBEADC url(../images/bg_header_fr.png) no-repeat 0 -28px; height: 82px; position: relative; }
#header h1 { height:50px; left:10px; position:absolute; top:19px; width: 221px; }
#header h1 a { text-indent:-9999px; display: block; width:221px; height: 50px; }
#header form#sign-in { position: absolute; top: 0; right: 0; background: #fff; width: 190px; bottom: 0; padding: 3px 7px;}
#header form#sign-in a { font-weight: bold; color: #002d62; text-decoration: none; }
#header input { width: 100px; margin: 5px 0; display: block; font-size: 14px; }
#header input.active-placeholder
{ font-size: 12px; }
#header button { position: absolute; top: 32px; left: 115px; }
#header-info { float: right; display: inline; width: 210px; margin-right: 300px; padding: 0; text-align: right; }
#header-info div.phone-number
{ font-family:"Arial black", Arial; font-size:16px; font-weight: bold; color: #002d62; text-align: right; }
#header-info div.cart-info
{ float: right; font-size: 12px; padding-left: 35px; background: url(../images/icon_cart_header_de.png) no-repeat 0 50%; margin-top: 5px; }
#header-info div.cart-info div.cart-title
{ text-transform: uppercase; padding-right: 10px; }
#header-info div.cart-info div.cart-title a
{ text-decoration: none; color: #002d62; }
#header div#book { position: absolute; top: 5px; bottom: 0; width: 75px; right: 208px; text-align: center;}
/* LOGIN FORM
-------------------------------------------------------------------*/
#post-nav-form { font-size: 12px; float: left; width: 215px; padding: 5px; clear: left; background: #D2CFAC; }
#post-nav-form h3 { margin: 0; padding: 0; }
/*
*********************************************************
5.0 NAVIGATION
*/
/* 5.1 TOP NAVIGATION
-------------------------------------------------------------------*/
#primary-nav { margin: 0; padding: 0; list-style: none; height: 30px; background: #002d62; }
#primary-nav li { margin: 0; padding: 0; float: left; display: inline; text-transform: uppercase; }
#primary-nav li.hover { color: #333; background-color: #09f; }
#primary-nav li a { text-decoration: none; display: block; text-align: center; margin: 8px 0; padding: 2px 17px; font: bold 9px verdana,helvetica,arial,sans-serif; color: #fff; border-right: 1px solid #fff; }
#primary-nav li.last a { border: none; }
/* 5.2 LEFT NAVIGATION
-------------------------------------------------------------------*/
ul#left-navigation { }
ul#left-navigation div { background:#C5C6C8; border-bottom:2px solid #DDDDDD; color:#002D62; font-size:13px; font-weight:bold; padding:8px 5px; }
ul#left-navigation li.title { background: #c5c6c8; color: #002d62; font-size: 13px; font-weight: bold; padding: 8px; }
ul#left-navigation li.menu { position: relative; }
ul#left-navigation li.menu a { color: #002d62; display: block; padding: 5px; text-decoration: none; font-size: 11px;}
ul#left-navigation li.menu a.left-nav-item
{ color: #002d62; display: block; padding: 5px; padding-right: 15px; text-decoration: none; border-bottom: solid 1px #ccc; font: 11px Arial, Helvetica, sans-serif; background: #eee url(../images/arrow_li_menu.png) no-repeat 100% 50%; }
ul#left-navigation li.menu.hover a.left-nav-item
{ background: #002d62 url(../images/arrow_li_down.png) no-repeat 100% 50%; color: #FFF; }
/**********************************
- Sub menu
*/
ul#left-navigation li.menu div.sub-menu { position: absolute; top: 0; left: 200px; list-style: none; border: 10px solid #001E52; padding: 0; margin: 0; z-index: 999; display: none; width: 500px; background: #E6E3D1; }
ul#left-navigation li.menu ul { padding: 0; margin: 0; list-style: none; }
ul#left-navigation li.menu div.sub-menu div.sub-menu-title
{ font-size: 16px; color: #006; background: #D8DADB; padding: 5px 10px; }
/**********************************
- Primary options
*/
ul#left-navigation li.menu div.sub-menu ul.primary-options
{ background: #D8DADB; }
ul#left-navigation li.menu div.sub-menu ul.primary-options li a
{ background: url(../images/play_small.png) no-repeat 10px 50%; padding: 5px 5px 5px 35px; display: block; color: #000; font-size: 12px; font-weight: bold; }
ul#left-navigation li.menu div.sub-menu ul.primary-options li a.hover
{ text-decoration: underline; background-color: #001E52; color: #fff; }
/**********************************
- Secondary options
*/
ul#left-navigation li.menu div.sub-menu ul.secondary-options
{ padding: 10px 0; }
ul#left-navigation li.menu div.sub-menu ul.secondary-options li a
{ padding: 3px 10px; display: block; font-size: 12px; }
ul#left-navigation li.menu div.sub-menu ul.secondary-options li a.hover
{ text-decoration: underline; background-color: #069; color: #fff; }
/**********************************
- Column control
*/
ul#left-navigation li.menu div.sub-menu .col-1, ul#left-navigation li.menu div.sub-menu .col-2
{
float: left;
display: inline;
width: 50%;
}
#content .quarter-piece.post-nav div { font-size: 12px; }
/**********************************
- Left nav dropdown
*/
div.left-nav-item { background: #e0e1e2; color:#002D62; font-size:15px; font-weight:bold; padding:10px 5px; }
ul.left-nav-item-ul { background: #eee; }
ul.left-nav-item-ul li { position: relative; }
ul.left-nav-item-ul li a { padding: 5px 15px 5px 5px; font-size: 11px; display: block; text-decoration: none; color: #002d62; border-bottom: 1px solid #ccc; }
ul.left-nav-item-ul li a span { text-transform: lowercase; }
ul.left-nav-item-ul li a:hover, ul.left-nav-item-ul li:hover a
{ background-color: #002d62; color: #fff; }
ul#left-navigation a.has-menu.hover { color: #fff; }
ul.left-nav-item-ul li.has-menu { background: url(../images/arrow_li_menu.png) no-repeat 100% 50%; }
ul.left-nav-item-ul li.has-menu.hover { background-color: #013; background-image: url(../images/arrow_li_down.png); }
ul#left-navigation li a.hover { color: #fff; }
ul.left-nav-item-ul li.header { color: #013; font-weight: bold; padding: 5px; }
ul.left-nav-item-ul li.header.margined { margin-top: 30px; }
ul.left-nav-item-ul li.has-menu ul.sub-category { position: absolute; left: 200px; top: 0; width: 200px; z-index: 11; background: #eee; border: solid 1px #999; display: none; }
ul.left-nav-item-ul li.has-menu ul.sub-category a { color: #000; background: none; border-bottom: 1px solid #ccc; }
ul.left-nav-item-ul li ul.sub-category a:hover { color: #fff; background: #002d62; text-decoration: none;}
ul.left-nav-item-ul li.has-menu ul.sub-category li.hover a { text-decoration: underline; }
div.left-nav-dropdown { position: relative; }
div.left-nav-dropdown div { background: #c5c6c8 url(../images/play_small_down.png) no-repeat 98% 50%; color: #002d62; font-size: 13px;
padding: 8px 5px; font-weight: bold; cursor: pointer; border-bottom: 2px solid #ddd; }
div.left-nav-dropdown ul { position: absolute; top: 22px; left: 0; right: 0; display: none;
background: #eee; border: solid 1px #999; border-bottom: none; z-index: 10; }
div.left-nav-dropdown ul li a { padding: 5px; border-bottom: solid 1px #999; font-size: 11px; cursor: pointer; display: block; color: #002d62; text-decoration: none;}
div.left-nav-dropdown ul li.hover a { background: #002d62; color: #fff; }
/*
************************************************************
6.0 PAGE ELEMENTS
*/
/* 6.1 BREADCRUMBS
-------------------------------------------------------------------*/
#breadcrumbs { margin: 5px; height: 18px; margin-top: 10px; }
#breadcrumbs li { display: inline; float: left; padding: 0 15px 0 3px; background: url(../images/breadcrumb.png) no-repeat 100% 50%; font-size: 11px; font-weight: bold; }
#breadcrumbs li a { color: #002d62; text-decoration: none; font-size: 11px; }
#breadcrumbs li a:hover { text-decoration: underline; }
/* the class 'last' is assigned via jquery */
#breadcrumbs li.last { font-weight: bold; background-image: none;color: #002d62; }
/* 6.2 ROW
-------------------------------------------------------------------*/
div.row { border-top: solid 4px #002d62; position: relative; }
div.row h3.hubert-row-header
{ background: #002d62; color: #fff; padding: 0px 0 3px 5px; margin: 0; font: 22px "Arial Narrow", helvatica, sans-serif; border-bottom: 8px solid #ddd; text-transform: uppercase;}
div.row h3.hubert-row-header strong
{ font: bold 22px "Arial Narrow", helvatica, sans-serif; }
/* 6.4 SEGMENTED
-------------------------------------------------------------------*/
div.row ul.segmented { margin: 10px 0; height: 150px; padding: 10px 0; }
div.row ul.segmented li { float: left; display: inline; padding: 0 10px; margin: 0; width: 130px; }
div.row ul.segmented.v-bar li { border-left: solid 1px transparent; }
div.row ul.segmented.v-bar li.first
{ border-left: none; }
div.row ul.segmented li div.img { height: 130px; background-position: 50% 50%; background-repeat: no-repeat; }
div.row ul.segmented.flush { margin: 0; padding: 0; }
div.row ul.segmented.flush li { margin: 0; padding: 0; }
div.row ul.nopad { margin: 0; padding: 0; }
/* 6.5 CAROUSEL
-------------------------------------------------------------------*/
div.carousel-wrapper { position: relative; overflow: hidden; }
ul.carousel { position: absolute; top: 0; left: 0; z-index: 3; }
ul.carousel li { float: left; display: inline; }
/* Featered Row */
#featured-row { position: relative; background: #fff url(../images/bg_featured.png) repeat-y; }
#featured-row h3 { margin: 0px 10px; padding-top: 5px; color: #002d62; font: bold 16px "Arial Narrow", helvatica, sans-serif;}
#featured-row .carousel-prev { position: absolute; z-index: 4; top: 80px; left: 5px; cursor: pointer;
width: 19px; height: 19px; border: none; background: url(../images/carousel-buttons.png) no-repeat 0 0; }
#featured-row .carousel-next { position: absolute; z-index: 4; top: 80px; right: 5px; cursor: pointer;
width: 19px; height: 19px; border: none; background: url(../images/carousel-buttons.png) no-repeat -19px 0; }
#featured-row .carousel-prev.disabled { background-position: 0 -19px; }
#featured-row .carousel-next.disabled { background-position: -19px -19px; }
#featured-row div.carousel-wrapper { height: 175px; margin: auto; width: 700px; }
#featured-row ul.carousel li { float: left; display: inline; padding: 5px; height: 145px; text-align: center; color: #002d62; font-size: 12px; }
#featured-row ul.carousel li.first { border: 0; }
#featured-row ul.carousel li div { height: 125px; background-position: 50% 50%; background-repeat: no-repeat; width: 125px; background-color: #eee; border: 1px solid #ccc; margin: 5px auto;}
/* Main Row */
#huberts-wide-assortment-row h3 { font: bold 24px Arial, Helvatica; color: #b0c4e3; }
#huberts-wide-assortment-row h3 span { font-size: 24px; }
#huberts-wide-assortment-row p { font-size: 14px; width: 280px; color: #002d62; }
#huberts-wide-assortment-row .carousel-prev { position: absolute; z-index: 4; top: 70px; left: -10px; cursor: pointer;
width: 19px; height: 19px; border: none; background: url(../images/carousel-buttons.png) no-repeat 0 0; }
#huberts-wide-assortment-row .carousel-next { position: absolute; z-index: 4; top: 70px; right: -10px; cursor: pointer;
width: 19px; height: 19px; border: none; background: url(../images/carousel-buttons.png) no-repeat -19px 0; }
#huberts-wide-assortment-row .carousel-prev.disabled { background-position: 0 -19px; }
#featured-row .carousel-next.disabled { background-position: -19px -19px; }
#huberts-wide-assortment-row div.carousel-wrapper { height: 170px; margin: auto; }
#huberts-wide-assortment-row ul.carousel li { margin: 5px 4px; height: 130px; text-align: center; border-left: 2px solid #002d62; padding: 0 0 0 7px; }
#huberts-wide-assortment-row ul.carousel li.first { border: 0; }
#huberts-wide-assortment-row ul.carousel li div.img { height: 124px; width: 125px; background-position: 50% 50%; background-repeat: no-repeat; margin: auto; background-color: #eee; border: 1px solid #ccc; cursor: pointer; }
a.alle-link { color: #002d62; text-transform: uppercase; text-decoration: none; background: url(../images/arrow_li.png) no-repeat left center; padding-left: 14px; font-weight: bold; }
/* 6.6 MAIN PIC
-------------------------------------------------------------------*/
#main-pic { width: 780px; height: 267px; background: #eee url(../images/main-pic-1.png) no-repeat 50% 50%; }
/* 6.7 HIGHLIGHTS
-------------------------------------------------------------------*/
div.highlights { background: #ebe8db; padding: 10px; }
div.highlights h3 { margin: 0 10px 10px 10px; padding: 0; font-size: 14px; font-weight: bold; color: #002d62; }
div.highlights ul li { float: left; display: inline; width: 29%; }
div.highlights ul li.last { width: 42%; }
div.highlights ul li a { background: url(../images/play_small.png) no-repeat 10px 5px; padding: 5px 5px 5px 35px; display: block; color: #000; font-size: 12px; font-weight: bold; }
div.highlights ul.primary-options li a:hover
{ text-decoration: underline; }
div.highlights ul.primary-options { width: auto; margin: 0; padding: 0; }
div.highlights ul.primary-options li{ display: block; float: none; width: auto; margin: 0; }
div.highlights ul.primary-options li a
{ color: #002d62; text-decoration: none;}
div.highlights form { padding: 0 10px; vertical-align: 2px; }
div.highlights form label { display: inline-block; width: 103px; font-size: 11px; color: #002d62; }
div.highlights form input { width: 150px; vertical-align: 10px; }
div.highlights form button { vertical-align: 14px; }
/* 6.8 FORM
-------------------------------------------------------------------*/
form fieldset { border: none; margin: 0; padding: 0; }
form fieldset h4 { padding: 5px; font-size: 13px; font-weight: bold; margin: 0; text-align: right; }
form fieldset ul { list-style-type: none; margin: 0; padding: 0; }
form fieldset ul.form-section
{ float: left; width: 45%; }
form fieldset li { clear: left; padding: 5px 5px 5px 0; }
form fieldset ul.form-section li
{ clear: none; padding: 5px; }
form fieldset li label { color: #666; display: block; margin-bottom: 3px; margin-left: 0; }
form fieldset li label.error
{ color: #ff3300; }
form fieldset li span { }
form fieldset li span.reqd { color: #900; }
form fieldset li span.help { color: #999; font-size: 11px; display: block;}
form fieldset li span label { display: inline; color: #000; }
fieldset li input[type="text"], fieldset li input[type="file"], fieldset li input[type="password"], textarea, select
{ padding: 2px; border: 1px solid #bbb; font-size: 11px;}
select { padding: 1px; }
input.active-placeholder { color: #999; }
form fieldset li.actions { margin-top: 15px; }
/* Special Input fields */
fieldset li input.date { background: url(images/icon_calendar.gif) no-repeat 98% center; padding-right: 16px; width: 80px; }
fieldset li input.search { background: url(images/icon_search.gif) no-repeat 98% center; padding-right: 16px; width: 200px; }
div.form-actions { margin: 10px 0; }
/* SIDE LABEL FORM */
form fieldset ul.labelside { }
form fieldset ul.labelside li { clear: left; padding: 5px; }
form fieldset ul.labelside li label {color: #666; display: inline; float: left; margin-right: 5px; width: 150px; text-align: right; }
form fieldset ul.labelside li span { display: inline; float: left; }
form fieldset ul.labelside li span.help
{ color: #999; font-size: 11px; float: none;}
form fieldset li span label { display: inline; color: #000; float: none; width: auto; color: #000; }
form fieldset li.action span { margin-left: 155px; }
textarea.description { width: 300px; height: 60px; }
/* Clear Fix */
div#form-wrapper { float: left; display: inline; width: 700px; background: #fff; margin-top: 10px; }
/* 6.9 FORM ACTIONS
-------------------------------------------------------------------*/
a.orange-button { white-space: nowrap; text-decoration: none; display: inline-block; padding: 5px 30px 0 7px; margin: 3px 0; background: url(../images/orange-button-sprites.png) no-repeat 0 -25px; height: 20px; color: #fff; font-size: 11px; text-align: left; font-weight: bold; }
button.orange-button { border: none; white-space: nowrap; padding: 2px 30px 5px 10px; margin: 0; background: url(../images/orange-button-sprites.png) no-repeat 0 -50px; height: 26px; color: #fff; font-size: 11px; text-transform: uppercase; cursor: pointer; font-weight: bold; }
a.size-1 { width: 15px; background-position: 0 0; }
a.size-2 { width: 20px; background-position: 0 -25px; }
a.size-3 { width: 25px; background-position: 0 -50px; }
a.size-4 { width: 30px; background-position: 0 -75px; }
a.size-5 { width: 35px; background-position: 0 -100px; }
a.size-6 { width: 40px; background-position: 0 -125px; }
a.size-7 { width: 45px; background-position: 0 -150px; }
a.size-8 { width: 50px; background-position: 0 -175px; }
a.size-9 { width: 55px; background-position: 0 -200px; }
a.size-10 { width: 60px; background-position: 0 -225px; }
a.size-11 { width: 65px; background-position: 0 -250px; }
a.size-12 { width: 70px; background-position: 0 -275px; }
a.size-13 { width: 75px; background-position: 0 -300px; }
a.size-14 { width: 80px; background-position: 0 -325px; }
a.size-15 { width: 85px; background-position: 0 -350px; }
a.size-16 { width: 90px; background-position: 0 -375px; }
a.size-17 { width: 95px; background-position: 0 -400px; }
a.size-18 { width: 100px; background-position: 0 -425px; }
a.size-19 { width: 105px; background-position: 0 -450px; }
a.size-20 { width: 110px; background-position: 0 -475px; }
a.size-21 { width: 115px; background-position: 0 -500px; }
a.size-22 { width: 120px; background-position: 0 -525px; }
a.size-23 { width: 125px; background-position: 0 -550px; }
a.size-24 { width: 130px; background-position: 0 -575px; }
a.size-25 { width: 135px; background-position: 0 -600px; }
a.size-26 { width: 140px; background-position: 0 -625px; }
a.size-27 { width: 145px; background-position: 0 -650px; }
a.size-28 { width: 150px; background-position: 0 -675px; }
a.size-29 { width: 155px; background-position: 0 -700px; }
a.size-30 { width: 160px; background-position: 0 -725px; }
button.size-1 { width: 52px; background-position: 0 0; }
button.size-2 { width: 57px; background-position: 0 -25px; }
button.size-3 { width: 62px; background-position: 0 -50px; }
button.size-4 { width: 67px; background-position: 0 -75px; }
button.size-5 { width: 72px; background-position: 0 -100px; }
button.size-6 { width: 77px; background-position: 0 -125px; }
button.size-7 { width: 82px; background-position: 0 -150px; }
button.size-8 { width: 87px; background-position: 0 -175px; }
button.size-9 { width: 92px; background-position: 0 -200px; }
button.size-10 { width: 97px; background-position: 0 -225px;;}
button.size-11 { width: 102px; background-position: 0 -250px; }
button.size-12 { width: 107px; background-position: 0 -275px; }
button.size-13 { width: 112px; background-position: 0 -300px; }
button.size-14 { width: 117px; background-position: 0 -325px; }
button.size-15 { width: 122px; background-position: 0 -350px; }
button.size-16 { width: 127px; background-position: 0 -375px; }
button.size-17 { width: 132px; background-position: 0 -400px; }
button.size-18 { width: 137px; background-position: 0 -425px; }
button.size-19 { width: 142px; background-position: 0 -450px; }
button.size-20 { width: 147px; background-position: 0 -475px; }
button.size-21 { width: 152px; background-position: 0 -500px; }
button.size-22 { width: 157px; background-position: 0 -525px; }
button.size-23 { width: 162px; background-position: 0 -550px; }
button.size-24 { width: 167px; background-position: 0 -575px; }
button.size-25 { width: 172px; background-position: 0 -600px; }
button.size-26 { width: 177px; background-position: 0 -625px; }
button.size-27 { width: 182px; background-position: 0 -650px; }
button.size-28 { width: 187px; background-position: 0 -675px; }
button.size-29 { width: 192px; background-position: 0 -700px; }
button.size-30 { width: 197px; background-position: 0 -725px; }
/* 6.10 TABULAR DATA
-------------------------------------------------------------------*/
table.purchase-table { border: solid 1px #999; font-size: 12px; margin: 15px; }
table.purchase-table th { padding: 5px 10px; background: #ccc; text-align: left; font-weight: bold; white-space: nowrap; }
table.purchase-table td { padding: 5px 10px; border-top: solid 1px #ccc; }
table.purchase-table input.sub-total
{ width: 50px; cursor: pointer; }
table.purchase-table tr.color-chooser { display: none; }
table.purchase-table tr.color-chooser td { border-top: solid 1px #eee; }
table.purchase-table tr.color-chooser table { width: 100%; }
table.purchase-table tr.color-chooser input { width: 25px; text-align: right; }
table.purchase-table tr.color-chooser table tr td { border: none; padding: 0; text-align: center; width: 10%; }
div.color-box { display: inline-block; width: 10px; height: 10px; margin-bottom: -2px; border: solid 1px #ccc; }
div.color-box.red { background: #f00; }
div.color-box.orange { background: #f90; }
div.color-box.yellow { background: #ff0; }
div.color-box.green { background: #0F0; }
div.color-box.blue { background: #00F; }
div.color-box.violet { background: #F0F; }
div.color-box.gold { background: #cc3; }
div.color-box.grey { background: #ccc; }
div.color-box.black { background: #000; }
div.color-box.white { background: #fff; }
/* 6.11 QUICK FORMS
-------------------------------------------------------------------*/
#quick-search-form { padding: 10px; background: #dbd7bd; }
#quick-search-form ul li { height: 45px; }
#quick-search-form input { width: 150px; }
#quick-search-form label { display: block; font: bold 11px verdana, helvatica, sans-serif; color: #002d62; }
.active-placeholder { color: #999; }
#quick-order-form { padding: 10px; background: #ebe8da; border-top: solid 4px #002d62; }
#quick-order-form h3 { font-size: 12px; color: #002d62; font-weight: bold; }
#quick-order-form input { width: 85px; margin: 2px;}
#quick-order-form table th { padding-left: 2px; }
#quick-order-form td.action { text-align: right; padding: 4px; }
#quick-order-form td.action a.more
{ color: #002d62; text-decoration: none; display: inline-block; background: url(../images/arrow_li.png) no-repeat right center; padding-right: 14px; }
/*
*************************************************************
7.0 PAGE SPECIFIC STYLES
*/
/* 7.1 ACTION BUTTONS
------------------------------------------------------------*/
div.cart-buttons { text-align: right; padding-right: 20px; }
div.pre-large-img-trigger { text-align: center; font-size: 12px; }
div.pre-large-img-trigger img { margin-bottom: 10px; }
a.movie-clip { display: block; width: 202px; height: 20px; padding: 135px 0 0 0; margin: 10px 0; background: url(../images/icn-movie.png) no-repeat 50% 0; text-align: center; text-decoration: none; color: #002d62; font-size: 12px; }
a.click-for-larger { font-size: 12px; color: #002d62; display: block; padding: 0; text-align: center; margin-top: 5px; cursor: pointer; text-decoration: none; }
/* 7.2 DAY AND WEEK DEALS
------------------------------------------------------------*/
#content .deal { background-color: #D8DADB; background-position: 50% 50%; background-repeat: no-repeat; text-indent: -9999px; }
#content #deal-of-the-week { background-image: url(../images/deal_week.png); }
#content #deal-of-the-day { background-image: url(../images/deal_day.png); }
/* 7.3 HUBERT BRAND PRODUCTS
------------------------------------------------------------*/
#hubert-brand { background: url(../images/hubert_brand.png) no-repeat; width: 777px; height: 163px; float: left; display: inline; padding-top: 36px; }
#hubert-brand-products { background: url(../images/hubert_brand_products.png) no-repeat; width: 777px; height: 163px; display: block; text-indent: -9999px; }
#deal-row { height: 140px; }
/* 7.4 COLUMNS
------------------------------------------------------------*/
div.bi-col { display: inline; float: left; width: 353px; margin: 0; padding: 10px; vertical-align: top; }
div.bi-col p { font-size: 12px; }
div.bi-col p.small { font-size: 11px; margin: 0 10px; }
div.bi-col-wide { display: inline; float: left; width: 400px; margin: 0; padding: 10px 0; vertical-align: top; }
div.icons { margin-bottom: 5px; text-align: center; }
div.icons ul li img { vertical-align: bottom; }
/* 7.5 OVERLAY
------------------------------------------------------------*/
/* the overlayed element */
/* must be initially hidden */
/* place overlay on top of other elements using z-index */
.simple_overlay { display: none; z-index:10000; width: 576px; height: 446px; padding: 40px; background: url(../images/white_close.png) no-repeat; position: relative; }
/* close button positioned on upper right corner */
.simple_overlay .close { position: absolute; right: 9px; top: 8px; cursor: pointer; height: 35px; width: 35px; }
/* 7.6 TOOLTIP
------------------------------------------------------------*/
#tooltip { position: absolute; display: none; color: #fff; -webkit-box-shadow: rgb(0, 0, 0) 0px 0px 10px; border: 1px solid rgb(255, 255, 255); background-color: rgb(61, 116, 131); font-size: 11px; padding: 5px; text-align: center; width: 125px; }
/* 7.7 CATEGORIES - ROW
------------------------------------------------------------*/
div.categories { background: #DBD7BD; padding-left: 15px;border-top: 6px solid #002d62; }
div.categories ul { margin: 10px 0 0 0; padding: 10px 0; }
div.categories ul li { float: left; display: inline; width: 255px; }
div.categories h5 { margin: 0 0 5px 2px; }
div.categories h5 a { font-size: 14px; color: #002d62; text-decoration: none; }
div.categories h5 a:hover { text-decoration: underline; }
hr.segment-hr { width: 95%; margin: 0 4% 0 1%; border: solid 1px #013; }
div.categories ul div.img { width: 200px; height: 200px; margin-bottom: 10px; overflow: hidden; text-align: center; border: 1px solid #ccc; background: #fff; }
/* 7.8 DEPARTMENTS - ROW
------------------------------------------------------------*/
#departments-row h5 a { font: 20px "Arial Narrow"; text-decoration: none; display: block; height: 68px;}
#departments-row h5 a strong { font: bold 20px "Arial Narrow"; text-decoration: none; text-transform: uppercase; }
#departments-row a.link { display: block; color: #666; text-decoration: none; font-size: 11px; padding: 0 0 2px 0; color: #002d62; }
#departments-row h5.lt-brown a { color: #cd9d6d; }
#departments-row h5.lt-green a { color: #a8b137; }
#departments-row h5.lt-orange a { color: #fac476; }
#departments-row h5.lt-blue a { color: #6f97a6; }
#departments-row h5.lt-gray a { color: #7b747b; }
ul.departments li { float: left; display: inline; width: 135px; padding: 0 10px 10px 10px; }
ul.departments div.img { width: 125px; height: 125px; background: #fff; text-align: center; overflow: hidden; margin: 5px 0;}
#departments-row h6 { font-weight: bold; color: #002d62; margin: 0; min-height: 35px; }
#departments-row div.dept-links { min-height: 70px; }
#departments-row p { color: #002d62; height: 75px; margin-bottom: 0px; }
#departments-row a.alle-link { color: #6f97a6; }
/* 7.9 PRODUCTS - ROW
------------------------------------------------------------*/
div.products { background: #f3f2ea; padding: 0 15px; border-top:4px solid #002D62; }
div.products a { font-size: 12px; color: #002d62; text-decoration: none; }
div.products a:hover { text-decoration: underline; }
div.products ul { margin: 0 0 10px 0; padding: 20px 0 10px 0; border-top: 2px solid #dbd7bd; }
div.products ul.first { border: 0; }
div.products ul li { width: 230px; float: left; display: inline; padding: 0 10px; text-align: center; }
div.products ul li div.img { width: 200px; height: 200px; background-color: #eee; border: 1px solid #ccc; margin-bottom: 10px; background-repeat: no-repeat; text-align: center; overflow: hidden; }
div.products_xl { background: #f3f2ea; padding: 0 15px; border-top: 4px solid #002d62; }
div.products_xl ul { margin: 0 0 10px 0; padding: 20px 0 10px 0; border-top: 2px solid #dbd7bd;}
div.products_xl ul li { float: left; display: inline; width: 230px; padding: 0 10px; }
div.products_xl a { font-size: 12px; color: #002d62; text-decoration: none; }
div.products_xl h5 a:hover { text-decoration: underline; }
div.products_xl ul div.img { width: 200px; height: 200px; margin-bottom: 10px; overflow: hidden; text-align: center; border: 1px solid #ccc; background: #fff; }
/* 7.10 PAGINATION
------------------------------------------------------------*/
div.pagination { padding: 0 30px 10px 10px; }
div.pagination p.items { float: left; display: inline; width: 210px; font-size: 12px; color: #002d62; }
div.pagination p.pages { float: right; display: inline; width: 500px; text-align: right; }
div.pagination a { font-size: 11px; }
div.pagination a span { display: inline-block; width: 15px; height: 15px; color: #002d62; text-decoration: none; }
div.pagination a.current { font-weight: bold; text-align: center; }
div.pagination span.current { font-weight: bold;}
/* 7.11 DEALS
----------------------------------------------------------*/
div#deals { border-top: 4px solid #002D62; }
div#deals li { float: left; display: inline-block; }
div#deals li img
{ display: block; }
/* 7.12 CUSTOM SELECT BOX
------------------------------------------------------------*/
#header-top-bar div.select-wrapper { background: #09C; -webkit-border-radius: 5px; -moz-border-radius: 5px; font-size: 12px;
background: url(../images/select-box-arrows.png) no-repeat 100% 0; padding-right: 18px;
font-family: Arial, Helvetica, sans-serif; display: inline-block; border: solid 1px #666; position: relative; }
#header-top-bar div.select-wrapper div.select-value { padding: 3px 18px 3px 10px; background: url(../images/select-value-background.png) repeat-x;
-webkit-border-top-left-radius: 5px; -webkit-border-bottom-left-radius: 5px; -moz-border-radius-topleft: 5px;
-moz-border-radius-bottomleft: 5px; position: relative; }
#header-top-bar div.select-wrapper div.select-value.icn { padding-left: 25px; padding-right: 3px; }
#header-top-bar div.select-wrapper.focused { -webkit-box-shadow: 0 0 5px rgba(0,0,100,.75); }
#header-top-bar div.select-wrapper.focused ul { cursor: default; }
#header-top-bar div.select-wrapper ul { position: absolute; top: -2px; left: -2px; margin: 0; padding: 5px 0; list-style: none;
background: url(../images/select-box-options-bg.png); -webkit-border-radius: 5px; -moz-border-radius: 5px;
-webkit-box-shadow: 0 10px 15px rgba(0,0,0,.35); border: solid 1px #aaa; display: none; z-index: 16; }
#header-top-bar div.select-wrapper ul li { padding: 3px 10px 3px 20px; white-space: nowrap; position: relative; cursor: pointer; }
#header-top-bar div.select-wrapper ul li.icn { padding-left: 40px; }
#header-top-bar div.select-wrapper ul li.hover { background: url(../images/select-box-selected-option.png) repeat-x; color: #fff; }
#header-top-bar div.select-wrapper div.select-checkmark { position: absolute; top: 8px; left: 5px; width: 8px; height: 8px;
background: url(../images/select-checkmark.png) no-repeat; display: none; z-index: 17; }
#header-top-bar div.select-wrapper div.select-checkmark.hover { background-position: 0 -8px; }
#header-top-bar div.select-wrapper ul li div.icn { position: absolute; left: 20px; top: 1px; background-position: 50% 50%; background-repeat: no-repeat;
height: 16px; width: 16px; display: inline-block; }
#header-top-bar div.select-wrapper div.select-value div.icn { position: absolute; left: 5px; top: 1px; background-position: 50% 50%; background-repeat: no-repeat;
height: 16px; width: 16px; display: inline-block; }
div.select-dropsheet { position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 15; display: none; }
/* 7.13 MY ACCOUNT
-----------------------------------------------------------*/
h4.myacct, h4.myacct a { font-size: 12px; color: #002d62; text-decoration: none; font-weight: bold; }
table.cart-2 { border-collapse: collapse; margin-bottom: 10px; width: 100%; }
table.cart-2 th { font-weight: bold; font-size: 12px; color: #333; text-align: left; padding: 3px 5px; vertical-align: bottom; }
table.cart-2 td { color: #333; padding: 3px 5px; vertical-align: top; }
table.cart-2 td.price, table.cart-2 th.price
{ text-align: right; }
table.cart-2 td.qty, table.cart-2 th.qty
{ text-align: center; }
input.qty { width: 40px; }
table.cart-2 tfoot td { text-align: right; }
fieldset h5 { clear: both; background: #eee; color: #333; font-size: 12px; font-weight: bold; padding: 3px; margin-top: 10px; }
div.row fieldset ul li label { width: 30%; white-space: nowrap; color: #333; font-size: 12px;}
ul.form { margin-top: 10px; }
ul.list, ol.list { margin-left: 15px; list-style-type: disc; padding-left: 10px; }
ul.list li, ol.list li { padding: 0; margin: 0; line-height: 18px; }
ol.list { list-style-type: decimal; }
div.row table fieldset ul li label
{ width: 75px; color: #333; font-size: 11px; }
div.row table fieldset ul li label span
{ float: none; }
table.form { table-layout: fixed; width: 100%;}
table.form td { vertical-align: top; padding-left: 10px;}
table.form th { font-weight: bold; padding: 3px 10px; }
table.form tfoot td { text-align: right; }
table#latest-order { width: auto; }
div.home-links { float: right; display: inline; padding-top: 10px; }
/* 7.12 LOGIN
----------------------------------------------*/
p.important_info { color: #ff3300; }
/* 7.13 REGISTRATION
----------------------------------------------*/
div.steps { font-size: 14px; margin-bottom: 20px; }
div.steps a { display: inline-block; margin: 0 10px; font-size: 12px; }
div.steps a.first { margin-left: 0; }
div.steps a.current { font-weight: bold; }
div.steps a.done { background: url(../images/icon_checked.png) no-repeat left center; padding-left: 18px; }
/*
************************************************************
8.0 FOOTER
*/
#footer { font-size: 12px; clear: both; background: #f5f4ed; }
#verisign { background: url(../images/logo_verisign_secured.png) no-repeat 50% 50%; width: 112px; height: 57px; }
#footer h3 { color:#b5cde9 ; font-size: 14px; font-weight: bold; }
#footer ul li ul li { margin: 0; padding: 2px 0; }
#footer a { text-decoration: none; color: #002d62; font-size: 11px;}
#footer a:hover { text-decoration: underline; }
/*
************************************************************
9.0 POPUP
*/
#dropsheet { background: #333; position: fixed; _position: absolute; top: 0px; left: 0px; width: 100%; height: 100%; z-index: 2; }
.popup { position: fixed; _position: absolute; left: 0px; top: 0px; margin: 0px !important; background: url(../images/white_close.png) no-repeat; width: 606px; height: 496px; z-index: 3; display: none; padding: 0 0 30px 40px; }
.popup h3 { padding: 30px 40px 0 0; }
#popup-iframe { position: fixed; _position: absolute; left: 0px; top: 0px; background: #f00; z-index: 2; }
.popup .popup-closer { float: right; display: inline; width: 30px; height: 30px; margin-top: 10px; }
#popup-email-friend { z-index: 5; }
form#email-friend { display: block; margin-top: 20px; }
/*
************************************************************
10.0 ERROR MESSAGES
*/
dl.errors dt{
font-weight: bold;
padding: 0.5em;
}
dl.errors dd {
margin: 0.5em;
}
label.error,
p.error {
color: #FF5555;
}
td.ptth
{
font-weight:bold !important;
}
input.no-text-transform,
button.no-text-transform
{
text-transform: none;
}
/*
************************************************************
12.0 SITEMAP
*/
/******* sitemap *******/
#sitemap {
margin-right: 13px;
margin-top:26px;
padding:9px 0 6px 17px;
}
#sitemap h1 {
clear:both;
color:#B5CDE9;
font-size:1.3em;
font-weight: bold;
}
#sitemap h3 {
margin-bottom: 3px;
width: 247px;
font-size:1em;
}
#sitemap h3 a, #sitemap h3 a:link, #sitemap h3 a:visited { /* there's always a link within the */
padding: 0;
/* default background */
color: #000;
/* link is underlined */
}
#sitemap h3 a:hover, #sitemap h3 a:active, #sitemap h3 a:focus {
background:none repeat scroll 0 0 #CCCCCA;
color:#000000;
text-decoration:none;
}
#sitemap .offsettext {
text-indent: 15px;
}
#sitemap .offsetbox {
text-indent: 18px;
}
#sitemap p.breadcrumb {
color:#6989BA;
border-top:1px dotted #6989BA;
padding: 9px 0 6px 17px;
font-size:100%;
font-weight: bold;
margin-top: 26px;
}
#sitemap p.breadcrumbbody {
color:#C0C0C0;
border-bottom:1px dotted #6989BA;
padding: 0 0 6px 17px;
font-size:100%;
}
#sitemap p.breadcrumb a{
color:#6989BA;
font-weight: bold;
text-decoration:underline;
}
#sitemap div.layoutAlignment ul{
padding: 6px 18px;
}
#sitemap div.layoutAlignment div.layoutBox1, #sitemap div.layoutAlignment div.layoutBox2 {
width: 287px; /* each column */
}
div.layoutAlignment div.layoutBox1 {
float:left;
vertical-align:top;
}
div.layoutAlignment div.layoutBox2 {
display:table-cell;
vertical-align:top;
}
#sitemap .mainCategoryHead{
margin-left:1px;
font-weight:bold;
padding: 2px 0px 2px 17px;
border-bottom:1px dotted #000000;
border-top:1px dotted #000000;
margin-bottom:8px;
}
#sitemap .mainCategoryList li{
padding-bottom: 3px;
padding-left: 17px;
}
#sitemap .mainCategoryList a{
text-decoration: underline;
}
#sitemap .subCategory{
width: 100%;
}
#sitemap .subCategoryHead{
margin-top:20px;
margin-left:1px;
font-weight:bold;
padding: 2px 0px 2px 17px;
border-bottom:1px dotted #6989BA;
border-top:1px dotted #6989BA;
color:#6989BA;
}
#sitemap li.subCategoryList{
/*padding-bottom:6px;*/
}
#sitemap li.subAV li.subSubCategoryList{
border-top:1px dotted #6989BA;
padding-top:6px;
padding-bottom:6px;
}
#sitemap li.subSubCategoryList{
/*padding-top:6px;*/
padding-bottom:6px;
}
#sitemap li.subSubAV li.subSubSubCategoryList{
border-top:1px dotted #6989BA;
padding-bottom:6px;
padding-top:6px;
}
#sitemap li.subSubAV li.firstSubSubSubCategoryList{
padding-bottom:6px;
padding-top:6px;
}
#sitemap li.subSubSubCategoryList{
padding-bottom:6px;
}
#sitemap li.subSubSubSubCategoryList{
padding-bottom:6px;
}
#sitemap li.firstSubSubCategoryList{
padding-bottom:6px;
}
#sitemap ul.subCategoryList{
padding:8px 0 8px 17px;
border-bottom:1px dotted #6989BA;
}
#sitemap ul.subCategoryListSpace {
padding-bottom:0;
}
#sitemap ul.subSubCategoryList{
padding-left:200px;
margin-top:-1.2em;
}
#sitemap ul.subSubSubCategoryList{
margin-left:200px;
margin-top:-1.2em;
}
#sitemap ul.subSubSubSubCategoryList{
margin-left:200px;
margin-top:-1.2em;
}
#workingTemplate #sitemap .subCategory a{
font-weight:normal;
text-decoration: underline;
color: #6989BA;
font-size: 100%;
}
#sitemap .subCategoryX{
padding-left: 17px;
padding-top:6px;
padding-bottom:6px;
border-bottom:1px dotted #E81700;
}
#sitemap div.subCategory{
padding-top:0;
padding-bottom:6px;
}
#sitemap div.infoText {
padding:2px 0px 2px 17px;
}
#sitemap ul.productList{
padding-left: 17px;
padding-top:6px;
padding-bottom:6px;
border-bottom:1px dotted #6989BA;
}
/* linkList within #workingTemplate */
#workingTemplate ul.linkList { /* create bottom space at each
*/
padding-bottom: 8px; /* 8px + 5px at last = 13px like the default margin-bottom, margin-bottom doesn't work here */
}
#workingTemplate ul.linkList li { /* create bottom space at each */
margin-bottom: 5px;
}
div#workingTemplate {
display:inline;
float:left;
width: 978px;
min-height:588px;
border-bottom:1px solid #CCCCCA;
border-left:1px solid #CCCCCA;
border-right:1px solid #CCCCCA;
}