/* ===== This file contains the eCommerce specific styles ===== */

/* ===== Basic Element Styles ===== */
BODY  { background: #7e2d0d; margin: 0 }
#container  { background-color: #d7cba2; background-image: url(stretch.gif); margin: 30px auto 0; padding: 0; width: 950px } 

FORM {
margin: 0px;
}
UL {
margin-top: 0; 
margin-bottom: 0;
}

.endcolumns {
clear: both;
visibility: hidden;
}  


/* ===== Header Styles ===== */
#ecom-header    { background-color: #ffffff; background-position: 0 0; position: relative; width: 950px; height: 145px; voice-family: inherit   }
#ecom-header #left     { background-repeat: no-repeat; position: absolute; top: 0; right: 0; left: 0; height: 145px }
#ecom-header #middle   { text-align: center; padding: 0; width: auto }
#ecom-header #right    { text-align: right; margin: 0; padding: 0; position: absolute; top: 0; right: 0; height: 145px }
img { display: inline }

#welcome-message {
padding-right: 10px;
padding-left: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-decoration: none;
color: #000000;
}
#welcome-message a {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-decoration: none;
color: #000099;
}
#welcome-message a:hover {
color: black;
text-decoration: underline;
}
#company-name {
margin: 0px;
font-size: 12pt;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
color: #000099;
white-space: nowrap;
}
#company-subtitle {
margin: 0px;
font-size: 6pt;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #330099;
white-space: nowrap;
}

#microcart {
font-size: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
text-decoration: none;
color: black;
}
#microcart a {
text-decoration: none;
color: #000099;
}
#microcart a:hover {
color: black;
text-decoration: underline;
}
#microcart .disabled {
color: #666666;
}
/* ===== Header-Bar Styles ===== */
#ecom-header-bar  { background: #463c32; text-align: center; padding-top: 10px; padding-bottom: 10px; padding-left: 255px; height: 14px; overflow: visible }
#ecom-header-bar ul   { font-size: 10px; font-family: "Trebuchet MS"; background-image: none; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; letter-spacing: 2px; list-style: none; display: block; margin: 0; padding: 0; overflow: visible; vertical-align: middle }
#ecom-header-bar ul #current { color: #fff; font-size: 12px; font-family: "Trebuchet MS"; background-image: none; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; letter-spacing: 2px; list-style: none; display: block; margin: 0; padding: 0; overflow: visible; vertical-align: middle }
#ecom-header-bar ul li { padding: 0 8px; height: 14px }
#ecom-header-bar ul#left-links li  { float: left; border-right: 2px solid #5c5146 }
#ecom-header-bar ul#left-links li.end { float: left; border-right: 2px none }
#ecom-header-bar ul#right-links li { float: right; border-left: 1px solid #ffffff }
#ecom-header-bar ul#right-links li.start { float: right; border-left: 1px none }
#ecom-header-bar ul li a  { color: #988b7d; font-size: 12px; font-family: "Trebuchet MS"; text-decoration: none }
#ecom-header-bar ul li a:hover  { color: #fdfcfb; text-decoration: none }
.login-register { font-style: italic; text-decoration: none }
/* ===== Layout/Formatting Styles ===== */
/* NOTE: using a combination of a float left/right for the side bars AND 
  wide margins for the center to get 2 desired effects: 1. be able to end
  columns and put the footer at the bottom of the page and 2. not have the
  center column expand to full width below the columns.
  
  The downside to this is that in some browsers we can't effectively use floats
  within divs in the main column.
*/

/* ecom-mainarea wraps what is below the header including the divs for left, main, right columns as applicable */
#ecom-mainarea { position: relative; width: auto; /* height: 450px */ height: auto; /* margin-top: -10px */ }
#ecom-mainarea .left  { background-color: #d7cba2; padding: 30px; width: 290px; height: auto; float: left; voice-family: inherit  }
#ecom-mainarea .right { background: #867c5a; text-align: center; margin-right: auto; margin-left: auto; padding-top: 30px; padding-bottom: 30px; width: 600px; height: 100%; float: right }
.content .left { }
#ecom-mainarea .center, #ecom-mainarea .leftonly, #ecom-mainarea .rightonly, #ecom-mainarea .nocolumns  { background: #fff; text-align: left; margin-top: 0px; vertical-align: top; }
#ecom-mainarea .center  { width: 540px ;padding: 30px; background-color: #867c5a; voice-family: inherit; float: right; min-height: 300px; }
#ecom-mainarea .leftonly {
margin-left: 160px;
voice-family: "\"}\"";
voice-family: inherit;
margin-left: 161px; 
}
#ecom-mainarea .rightonly {
margin-right: 210px;
voice-family: "\"}\"";
voice-family: inherit;
margin-right: 211px;
}

/* ====== eCommerce "Screenlet" Styles ====== */
#ecom-mainarea .screenlet  { background: #d7cba2; margin-bottom: 10px; padding-left: 20px; border: 0px; }
#ecom-mainarea .screenlet-header  { background: #d7cba2; padding: 1px 1px 1px 0 }
#ecom-mainarea .screenlet-body  { line-height: 2; background: #d7cba2; padding: 4px }

.boxhead  { color: #d7cba2; font-size: 8pt; font-family: Arial; font-weight: bold; text-decoration: none; margin: 0 0 5px; padding-bottom: 2px; /* border-bottom: 1px dotted black */ }

A.boxheadbutton {
font-family: Verdana, Arial, Helvetica, sans-serif;
margin: 0px;
font-size: 8pt;
font-weight: bold;
text-decoration: none;
color: #FFFFFF;
}

A.boxheadbutton:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
margin: 0px;
font-size: 8pt;
font-weight: bold;
text-decoration: none;
color: red;
}

/* Form layout styles to simulate a table-style layout */
#ecom-mainarea .form-row {
clear: both;
padding-top: 2px;
}
#ecom-mainarea .form-label {
float: left;
width: 180px;
text-align: right;
padding-top: 5px;
}
#ecom-mainarea .form-field {
float: left;
margin-left: 10px;
text-align: left;
} 

/* ===== Text/Label Styles ===== */
.tabletext, div.form-label, div.form-field    { color: #c7b897; font-size: 11px; font-family: "Trebuchet MS"; line-height: 2; text-decoration: none }
.contenttext  { color: #c7b897; font-size: 11px; font-family: "Trebuchet MS"; line-height: 2; text-decoration: none; letter-spacing: 1px; width: auto }
.redcontenttext { color: #7e2d0d; font-size: 12px; font-family: "Trebuchet MS"; line-height: 2; text-decoration: none; text-align: center; letter-spacing: 1px }
.breadcrumbs, div.form-label, div.form-field { font-size: 10px; font-family: Arial; text-decoration: none; padding-bottom: 2px; border-bottom: 1px dotted black }
A.tabletext:hover  { font-size: 10px; font-family: Arial; text-decoration: underline }
A.breadcrumbs:hover { font-size: 10px; font-family: Arial; text-decoration: underline }
.tablebuttontext  { color: #1e3c66; font-size: 10px; font-family: Arial }
DIV.tabletexthidden  { font-size: 10px; font-family: Arial; visibility: hidden }
.sidebartext { color: #5C5035; font-size: 11px; font-family: "Trebuchet MS"; line-height: 2; text-decoration: none }
.sidebartext h3 { text-align: center; color: #483F28 }
.sidebaroomph { color: #7e2d0d; font-size: 11px; font-family: "Trebuchet MS"; line-height: 2; text-align: center; }

.head1  { color: #970f00; font-size: 12pt; font-family: Arial; font-weight: bold; background-color: #c8cbcc; margin: -6px 0 0; padding-top: 2px; padding-bottom: 2px; padding-left: 3px; border-bottom: 1px dotted black }
h1  { color: #49422c; font-size: 14px; font-family: "Trebuchet MS"; font-weight: lighter; text-align: center; letter-spacing: 1pt; padding-bottom: 10px }
h2 { color: #70674a; font-size: 14px; font-family: "Trebuchet MS"; text-align: center; letter-spacing: 1pt }
h3  { color: #c7b686; font-size: 14px; font-family: "Trebuchet MS"; text-align: left; letter-spacing: 1pt; padding-left: 0 }
#center-head-body { color: #000; font-size: 8pt; font-family: Arial; background-color: #e1e1e1; margin: 0; padding-top: 4px; padding-bottom: 2px; padding-left: 3px; border-bottom: 1px dotted black }
.head2  { color: #000000; font-size: 10pt; font-family: Arial; font-weight: bold; margin: 0 }

.head3  { color: #000000; font-size: 8pt; font-family: Arial; font-weight: bold; margin: 0 }

.info  { color: #000000; font-size: 10px; font-family: Arial; font-style: normal; margin: 0 }

DIV.graybox  { font-size: 10px; font-family: Arial; font-weight: bold; background: #cccccc; text-align: center; margin: 2px auto; padding: 4px; width: auto; border: solid 1px #000000 }


.boxoutside  { background: #ffffff; padding: 0; border: solid 1px #999999 }

.boxtop {
background: #000099;
padding-top: 1px;
padding-bottom: 1px;
padding-right: 4px;
padding-left: 4px;
border-color: #999999;
border-style: solid;
border-width: 0px 0px 0px 0px;
}

.boxbottom {
background: #FFFFFF;
padding: 4px;
border-color: #999999;
border-style: solid;
border-width: 0px 0px 0px 0px;
}

.button {
border-style: outset; border-color: #9999CC; border-width: 2px;
background: #dddddd;
padding-right: 5px; padding-left: 5px;
}


.tableheadtext   { color: black; font-size: 10px; font-family: Arial; font-weight: bold; text-decoration: none }
.footer { float:left; clear:all; width:100%; color: #d7cba2; text-align: center; font-size: 10px; font-family: Arial; font-weight: bold; text-decoration: none; background-color: #7e2d0d; padding-top: 10px; padding-bottom: 10px; vertical-align: middle;}
.footer a { color: #d7cba2; text-decoration: none; }
.footer a:hover { color: #d7cba2; text-decoration: underline }
A.tableheadbutton  { color: black; font-size: 10px; font-family: Arial; font-weight: bold; text-decoration: none }
A.tableheadbutton:hover  { color: red; font-size: 10px; font-family: Arial; font-weight: bold; text-decoration: underline }

.browsecategorytext   { color: #000; font-size: 12px; font-family: "Trebuchet MS"; font-weight: bold; line-height: 2; text-decoration: none; letter-spacing: 1px; padding-top: 8px; padding-left: 50px }

A.browsecategorybutton   { color: #000; font-size: 12px; font-family: "Trebuchet MS"; font-weight: bold; text-decoration: none; vertical-align: 2px }
A.browsecategorybutton:hover   { color: #7e2d0d; text-decoration: none }
A.browsecategorybutton#current { color: #7e2d0d; text-decoration: none }
.browsecategorybuttondisabled   { color: #fff; font-size: 12px; font-family: "Trebuchet MS"; font-weight: bold; text-decoration: none; vertical-align: 2px }
A.buttontext, .buttontextdisabled   { font-size: 11px; font-family: "Trebuchet MS"; font-weight: bold; text-decoration: none; background-image: none; background-repeat: repeat; background-attachment: scroll; background-position: 0 0 }

A.buttontext   { color: #cbc09d }

A.buttontext:hover  { color: #fff; text-decoration: none }
A.categoryheadlinktext { color: #2b4699; font-size: 9px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; text-decoration: none }
A.categoryheadlinktext:hover { color: red; text-decoration: underline }
A.linktext { color: #cbc09d; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; text-decoration: none }
A.linktext:hover {
color: #cbc09d;
text-decoration: underline;
}
.buttontextdisabled  { color: #333333 }

.submenutextinfo {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-decoration: none;
color: white;
padding-left: 6px;
padding-right: 5px;
border-right: 1px solid #5886C6
}

.submenutext, A.submenutext, A.submenutext:visited {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-decoration: none;
color: yellow;
padding-left: 6px;
padding-right: 5px;
border-right: 1px solid #5886C6
}

A.submenutext:hover {
color: yellow;
text-decoration: underline;
}

.submenutextdisabled, A.submenutextdisabled {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-decoration: none;
color: #CCCCCC;
padding-left: 6px;
padding-right: 5px;
border-right: 1px solid #5886C6
}

A.submenutextdisabled:hover {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-decoration: underline;
color: yellow;
}

.submenutextinforight {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-decoration: none;
color: white;
padding-left: 6px;
}

.submenutextright, A.submenutextright {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-decoration: none;
color: yellow;
padding-left: 6px;
}

A.submenutextright:hover {
color: yellow;
text-decoration: underline;
}

.submenutextrightdisabled, A.submenutextrightdisabled {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-decoration: none;
color: #CCCCCC;
padding-left: 6px;
}

A.submenutextrightdisabled:hover {
text-decoration: underline;
color: yellow;
}

A.lightbuttontext {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-decoration: none;
color: yellow;
border: none;
}

A.lightbuttontext:hover {
color: yellow;
text-decoration: underline;
}

A.lightbuttontextsmall  { color: #2b4699; font-size: 9px; font-family: Arial; font-weight: bold; text-decoration: none; border: none }

A.lightbuttontextsmall:hover  { color: #970f00; text-decoration: underline }

.lightbuttontextdisabled {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-decoration: none;
color: #CCCCCC;
}

A.buttontextbig, .buttontextbigdisabled  { font-size: 12px; font-family: "Trebuchet MS"; font-weight: bold; text-decoration: none; background-image: none; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; margin: 0 2px 2px 0; padding-top: 0; padding-right: 4px; padding-bottom: 1px }
A.buttontextbig  { color: #7e2d0d }
.buttontextbigdisabled {
color: #CCCCCC;
}
A.buttontextbig:hover  { color: #fff; text-decoration: none }

A IMG.imageborder {
border-style: solid;
border-width: 1px;
border-color: #999999;
}
.subtextheader { color: #970f00; font-size: 9px; font-family: Arial; font-weight: bold; padding: 0 }
#subtext { font-size: 9px; text-align: left; padding: 15px 150px }
#prefooter { font-size: 9px; font-family: Arial; padding-right: 150px; padding-left: 150px }
/* ===== Other Header Styles ===== */


.headersmalltext {
font-size: 8pt; 
font-family: Verdana, Arial, Helvetica, sans-serif; 
font-weight: bold; 
color: black;
}
a.headersmalllink {
font-size: 8pt; 
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold; 
color: #000099; 
text-decoration: none;
}
a.headersmalllink:hover {
color: red;
}

/* ===== Misc/General Styles ===== */
HR.sepbar {
font-size: xx-small;
width: 100%;
height: 1px;
background: #999999;
border-width: 0px;
}

.errorMessage {
font-family: Verdana, Arial, Helvetica, sans-serif;
margin: 0px;
font-size: 8pt;
font-weight: bold;
color: red;
}

.eventMessage {
font-family: Verdana, Arial, Helvetica, sans-serif;
margin: 0px;
font-size: 8pt;
font-weight: bold;
color: #000099;
}

.ontab {
font-size: 8pt;
background: black;
padding: 2px;
border-style: inset;
border-width: 3px;
}

a.onlnk {
font-size: 8pt;
font-weight: bold;
color: #FFFFFF;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-decoration: none;
padding: 2px;
}

.offtab {
font-size: 10px;
background: #CCCCCC;
padding: 2px;
border-style: outset;
border-width: 3px;
}

a.offlnk {
font-size: 10px;
font-weight: bold;
color: #000099;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-decoration: none;
padding: 2px;
}

a.offlnk:hover {
color: red;
}

.areaheader {
font-size: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
color: #FFFFFF;
width: 100%;
background: black;
padding: 2px;
}

.edittable {
border-color: #000000 #000000 #003333;
border-style: solid;
border-top-width: thin;
border-right-width: thin;
border-bottom-width: thin;
border-left-width: thin
}

.editInputBox {
font-size: 8pt;
background: #FFFFFF;
font-family: Verdana, Arial, Helvetica, sans-serif;
background: white;
border: #999999 solid 1px;
margin: 2px;
}

.inputBox {
font-family: Verdana, Arial, Helvetica, sans-serif;
background: #FFFFFF;
font-size: 8pt;
background: white;
border: #999999 solid 1px;
margin: 2px;
}

.selectBox {
font-family: Verdana, Arial, Helvetica, sans-serif;
background: #FFFFFF;
font-size: 8pt;
background: white;
border: #999999 solid 1px;
margin: 2px;
}

.textAreaBox {
font-family: Verdana, Arial, Helvetica, sans-serif;
background: #FFFFFF;
font-size: 8pt;
background: white;
border: #999999 solid 1px;
margin: 2px;
}

.radioButton {
font-family: Verdana, Arial, Helvetica, sans-serif;
background: #FFFFFF;
font-size: 8pt;
}

.checkBox {
font-family: Verdana, Arial, Helvetica, sans-serif;
background: #FFFFFF;
font-size: 8pt;
}

.smallSubmit {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
font-weight: bold;
text-decoration: none;
color: #000099;
background: white;
border: #999999 solid 1px;
margin: 2px;
}

.mediumSubmit,.largeSubmit,.loginButton {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10pt;
font-weight: bold;
text-decoration: none;
color: #000099;
background: white;
border: #999999 solid 1px;
margin: 2px;
}

.smallSubmit:hover,.mediumSubmit:hover,.largeSubmit:hover,.loginButton:hover {
color: red;
text-decoration: underline;
}

.smallAltSubmit,.mediumAltSubmit,.largeAltSubmit {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
}

.basePrice {
font-size: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: black;
}

.normalPrice {
font-size: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: green;
}

.salePrice {
font-size: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: red;
}

.thumbnail
 { margin: 0 8px 15px; width: 160px; float: left }

/* ===== Product Summary Styles ===== */
.product-prevnext  { color: #cbc09d; text-align: right; margin-top: -33px }
.product-prevnext a { color: #cbc09d; text-decoration: none; }
.product-prevnext a:hover { color: #ffffff; text-decoration: none; }

/* .productsummary-container  { margin-top: 5px; margin-bottom: 5px; border-top: 1px solid #999 } */
.productsummary-container  { margin-top: 25px; margin-bottom: 5px; }
.productsummary     { margin: 0 10px 15px 0; padding-right: 5px; padding-left: 0; float: left }
.productsummary img  { width: 160px; height: 150px; border: 0 }
.productsummary .smallimage {
float: left;
/* position: absolute; top: 5px; left: 5px; */
margin: 0px 5px 5px 0px;
}
.productsummary .smallimage img  { height: 160px; border: solid 1px #ccc }
.productsummary .productbuy {
float: right;
width: 160px;
margin: 5px;
text-align: right;
}
.productsummary .productinfo  { color: #c7b897; font-size: 10px; font-family: "Trebuchet MS"; text-align: left; padding-top: 5px }
/* ===== Category Data Styles ===== */
.categorydata-container   { margin-top: 5px; margin-bottom: 5px }
/*.categorydata    { margin-top: 5px; padding: 5px 5px 5px 0 }*/
.categorydata .medimage   { margin: 5px 10px 0 0; padding-right: 10px; float: left }
.categorydata .medimage img   { width: 200px; height: 200px; float: left; border: solid 1px #ccc }
.categorydata .categoryinfo      { text-align: left; padding-top: 0; padding-right: 0; overflow: auto }
.categorydata .lowright  { text-align: right; margin: 10px 5px 5px 20px; width: 160px; float: right }
/* ===== Product Detail Styles ===== */
.detailsummary  { margin: 5px 15px 0 0; padding-left: 8px; float: left }
.detailsummary img { border: 0 }
.detailinfo  { text-align: left; padding-top: 5px; padding-bottom: 0; padding-left: 10px }

#productdetail { color: #cbc09d; }

#productdetail #download-files {
margin-top: 10px;
padding-top: 5px;
border-top: #999 solid 1px;
}

#productdetail #long-description   { margin: 0 8px 15px 15px; padding-left: 8px; float: left }

#productdetail #reviews {
margin-top: 10px;
padding-top: 5px;
border-top: #999 solid 1px;
}

#productdetail #associated-products {
margin-top: 10px;
padding-top: 5px;
border-top: #999 solid 1px;
}

A.bodylink, A.bodylink:visited {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-decoration: none;
color: #5C5035;
padding-left: 6px;
padding-right: 5px;
}

A.bodylink:hover{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
text-decoration: none;
color: #fff;
padding-left: 6px;
padding-right: 5px;
}

A.pdflink {
text-decoration: underline;
}

.headline img {
float: left;
margin: 0px 30px 30px 0px;
}

.headline h2 { 
color: #c7b897; 
font-size: 13px; 
font-family: "Trebuchet MS"; 
text-align: center; 
letter-spacing: 1pt 
}

A.headlinelink, A.headlinelink:visited {
font-family: "Trebuchet MS"
font-size: 13px;
font-weight: normal;
text-decoration: underline;
color: #c7b897; 
padding-left: 6px;
padding-right: 5px;
}

A.headlinelink:hover{
font-family: "Trebuchet MS";
font-size: 13px;
font-weight: normal;
text-decoration: underline;
color: #7e2d0d;
padding-left: 6px;
padding-right: 5px;
}

.sidebartext img {
float: left;
margin: 0px 30px 30px 0px;
}