html, body
{
    margin: 0 0 60px;
    padding: 0;
}
body
{
    font: 12px Arial, Helvetica, sans-serif;
    color: #52291e;
    background-color: #E1E1E1;
}
h1, h2, h3, h4, h5
{
    margin: 1em 0;
}
h1{font: bold 22px Arial, Helvetica, sans-serif;}
h2
{
    font: 18px Arial, Helvetica, sans-serif;
    text-transform: uppercase;
    letter-spacing: -1px;
    color: #9E780D;
}
h3
{
    font: bold 14px Arial, Helvetica, sans-serif;
    padding: 0 0 3px;
    margin: 0 0 .3em;
    color: #9E780D;
    background: url(../images/dotted_line.gif) repeat-x 0 100%;
}
h4
{
    font: bold 12px Arial, Helvetica, sans-serif;
    color: #000;
    margin: 0 0 .3em;
}
p
{
    margin: 0 0 1em;
    line-height: 1.5em;
}
a,
a:link{color: #1F5AA4;}
a:visited{color: #1F5AA4;}
a:hover{color: #1F5AA4; text-decoration: underline;}
a:active{color: #000;}
a img{border: none;}
ul
{
    list-style-type: square;
    margin-top: 0;
}
ul li,
ol li{line-height: 1.5em;}
form{margin: 0;}
fieldset
{
    padding: 12px;
    border: 1px solid #C3C3C3;
    margin: 0 0 1em;
}
legend{font-weight: bold;}
hr
{
    height: 1px;
    border: none;
    background-color: #ccc;
    color: #ccc;
}
/* ~~~ === POSITIONING SELECTORS =============================================== ~~~ */
#wrapper
{
    width:910px;
    background: url(../images/wrapper_bg.gif) repeat-y 0 0;
    margin: 5px auto;
}
#body{margin: 0 5px;}
#masthead
{
    position: relative;
    height: 116px;
    background: url(../images/masthead_bg.gif) no-repeat 0 0;
}
    #masthead h1
    {
        position: absolute;
        top: 36px;
        left: 0196px;
        margin: 0;
        font: bold 32px/1em Arial, Helvetica, sans-serif;
        color: #000;
    }
    #masthead h1 span
    {
        display: block;
        margin-left: 18px;
    }

/* ~~~ === MAIN NAVIGATION ======================================================= ~~~ */
#menu
{
    height: 48px;
    background: url(../images/menu_bg.gif) repeat-x 0 0;
}
    #menu img{float: left;}
    #menu ul
    {
        list-style-type: none;
        margin: 0;
        padding: 0;
        width: 712px;
        height: 48px;
        float: left;
        border-left: 1px solid #fff;
     }
     #menu li{float: left;}
     #menu li a
     {
        display: block;
        float: left;
        height: 43px;
        background: url(../images/link_bg.gif) no-repeat 100% 0;
        text-align: center;
        font: bold 12px/43px Arial, Helvetica, sans-serif;
        color: #000;
        text-decoration: none;
        padding: 7px 11px 0;
     }
     #menu li.active a,
     #menu a:hover{background-position: 0 -48px;}

/* ~~~ === SUB NAVIGATION ================================================= ~~~ */
#subMenu
{
    list-style-type: none;
    margin: 0 0 1em;
    padding: 0;
}
#subMenu ul
{
    list-style-type: none;
    margin: 0;
    padding: 0;
}
#subMenu a
{
    width: 163px;
    display: block;
    color: #9E780D;
    text-decoration: none;
    font-size: 11px;
    font-weight: bold;
    padding: 0 0 0 24px;
    line-height: 24px;
}
#subMenu ul a
{
    width: 151px;
    padding: 0 0 0 36px;
    font-weight: normal;
}
#subMenu li.active a
{
    color: #000;
    font-weight: bold;
}
#subMenu li.active li.active a{color: #000;}
#subMenu li.active ul a
{
    font-weight: normal;
    color: #9E780D;
}
#subMenu li a:hover
{
    background-color: #FFCC00;
    color: #fff;
    font-weight: bold;
}
#subMenu li.active ul a:hover,
#subMenu ul a:hover
{
    font-weight: normal;
    color: #fff;
}
#content{clear: both;}

/* ~~~ === LEFT COLUMN ====================================================== ~~~ */
#leftcol
{
    width: 187px;
    float: left;
    margin-top: 22px;
}
    #leftcol h3
    {
        color: #4D4D4D;
        padding: 0 0 0 22px;
        background-image: none;
    }
    #productCategories
    {
        list-style-type: none;
        margin: 0 0 1em 22px;
        padding: 0;
    }
    #productCategories li{line-height: 26px;}
    #productCategories a
    {
        text-decoration: none;
        color: #000;
        font-weight: bold;
    }
#productSearch h3
{
    background-color: #FFCC00;
    line-height: 22px;
    color: #000;
    margin: 0;
}
#productSearch p{margin: 1em 22px; text-align: right;}
#productSearch .input{width: 138px;}
/* ~~ === SHOPPING CART ================================================= ~~~ */
#shopping_cart
{
    margin: 12px;
    font-size: 11px;
}

/* ~~~ === MAIN CONTENT ================================================== ~~~ */
#midcol
{
    width: 712px;
    float: left;
}
#midcol div.copy{margin: 12px 24px 24px;}

#footer
{
    clear: both;
    height: 32px;
    background: url(../images/footer_bg.gif) no-repeat 0 100%;
    font-size: 11px;
}
    #footer ul
    {
        list-style-type: none;
        margin: 0 5px 0 193px;
        padding: 0;
        height: 22px;
        background-color: #FFCC00;
    }
    #footer li{float:left;}
    #footer a
    {
        display: block;
        float: left;
        line-height: 22px;
        color: #4D4D4D;
        text-decoration: none;
        padding: 0 10px;
    }
    #footer a:hover{color: #000;}

/* ~~~ === PRODUCT LISTINGS =============================================== ~~~ */
#product_listing dl
{
    width: 25%;
    float: left;
    margin: 1em 0;
}
#product_listing dl{text-align: center;}
#product_listing dl a img
{
    border: 1px solid #C2AC80;
    padding: 6px;
    background-color: #fff;
}
#product_listing dl a:hover img{border: 1px solid #9E780D;}
#product_listing dd
{
    margin: 0;
    text-align: center;
    font-size: 11px;
    height: 1%;
}
/* ~~~ === PRODUCT DETAIL ================================================= ~~~ */
dl.productDetail
{
    margin: 0;
    padding: 0 0 1em;
}
dl.productDetail dt
{
    width: 226px;
    float: left;
    padding-bottom: 1em;
}
dl.productDetail dd
{
    margin: 0 0 0 226px;
    height: 1%;
}
dl.productDetail dt img
{
    border: 1px solid #C2AC80;
    padding: 6px;
    background-color: #fff;
}
div.product_items{clear: both;}
div.product_items dl
{
    width: 25%;
    float: left;
    margin: 0 0 1em;
}
div.product_items dd{margin: 0;}
div.product_items dd.purchaseLink
{
    margin: 4px 0;
    text-align: center;
    padding: 2px 4px 0 0;
}
div.product_items dd.purchaseLink a
{
    display: block;
    font-weight: bold;
    background-color: #FFCC00;
    padding: 4px;
    color: #000;
    border: 1px solid #C2AC80;
}
div.product_items dd.purchaseLink a:hover
{
    text-decoration: none;
    border: 1px solid #565555;
}
/* ~~~ === NEWS PAGES ====================================================== ~~~ */
div.newsItems h3{background-image: none;}
div.newsItems h3 a:hover{text-decoration: none;}
div.newsItem p.date,
div.newsItems p.date
{
    margin: 0 0 .3em;
    font: italic 11px Georgia, "Times New Roman", Times, serif;
}
div.newsItems hr{margin: 0 0 2em;}
div.newsItem h2{margin: 0 0 .3em;}
div.newsItem p.date{margin: 0 0 1em;}
div.article
{
    padding: 0 0 10px;
    border-bottom: 1px solid #ccc;
    margin-bottom: 10px;
}

/* ~~~ === SEARCH RESULTS ================================================== ~~~ */
#searchResults dl
{
    padding: 0 0 1em;
    margin: 0 0 1em;
    background: url(../images/dotted_line.gif) repeat-x 0 100%;
}
#searchResults dt
{
    font-size: 16px;
    font-weight: bold;
}
#searchResults dd{margin: 0;}
#searchResults dt b,
#searchResults dd b
{
    background-color: #FFFF66;
    color: #000;
    font-style: italic;
}
#searchKeywords{font-weight: bold;}


/* ~~~ === PAGINATION =========================================================== ~~~ */
a.pagination_group
{
    background: url(../images/icons/pagination_left.gif) no-repeat 0 50%;
    text-decoration: none;
    padding: 1px 0 1px 6px;
    color: #9E780D;
}
a.pagination_group span
{
    background: url(../images/icons/pagination_right.gif) no-repeat 100% 50%;
    padding: 1px 6px 1px 0;
}

a.pagination_last{color: #52291e;}
a.pagination_active{font-weight: bold;}
a.pagination_first{padding: 1px 8px 1px 0; color: #52291e;}
a.pagination_next{padding: 1px 0 1px 8px; color: #52291e;}
a.pagination_previous{padding: 1px 8px 1px 0; color: #52291e;}


/* ~~~ === TABLES ================================================================================== ~~~ */
table.borderedTable
{
    border-collapse: collapse;
    border: 1px solid #9E780D;
    margin: 0 0 1em;
    background-color: #ebebeb;
}
table.borderedTable thead th
{
    background-color: #ccc;
    text-align: left;
    padding: 4px 8px;
}
table.borderedTable tbody th
{
    font: bold 11px Arial, Helvetica, sans-serif;
    padding: 4px 8px;
    border: 1px solid #9E780D;
    background-color: #E1E1E1;
}
table.borderedTable tbody td
{
    padding: 4px 8px;
    border: 1px solid #9E780D;
    font-size: 11px;
}
.rowBold{font-weight:bold}
table.borderedTable{width: 100%;}

/* ~~~ === FORMS ============================================================ ~~~ */
.isEmail,
.input
{
    font: 11px Arial, Helvetica, sans-serif;
    border-width: 2px;
    border-style: solid;
    border-color: #7C7C7C #C3C3C3 #DDDDDD #C3C3C3;
}
.invalid
{
    border-width: 2px;
    border-style: solid;
    border-color: #835C56 #CA9D96 #E5CCC7 #CA9D96;
    background-color: #F8DCD7;
}
.button
{
    font: bold 12px Arial, Helvetica, sans-serif;
}
table.formtable thead th
{
    font-size: 16px;
    text-align: left;
    padding: 12px 0;
}
table.formtable tbody th
{
    padding: 2px 0;
    text-align: right;
}
table.formtable tbody td{padding: 2px 4px;}
table.formtable tfoot td{padding: 6px 4px 12px;}
table.formtable tbody td span,
table.formtable tbody td input{vertical-align: middle;}
#login
{
    background-color: #565555;
    color:#fff;
    padding: 12px 0;
    text-align: center;
}
#login table.formtable thead th{color: #D6A331;}
#login table{margin: 0 0 0 12px; text-align: left;}
#login p
{
    margin: 0 12px;
    font-size: 11px;
}
#login a{color: #fff;}



/* ~~~ === CHECKOUT FORMS ========================================================================== ~~~ */
#formCheckout fieldset
{
    padding: 2em;
    background: url(../images/form_bg.gif) repeat-x 0 100%;
}
#formCheckout fieldset legend
{
    text-transform: uppercase;
    color: #9E780D;
}
#formCheckout fieldset table.formtable{}

table.tableOrderDetail
{
    width: 100%;
    border-collapse: collapse;
}
table.tableOrderDetail thead th
{
    text-align: left;
    padding: 4px;
    border-bottom: 1px solid #ccc;
}
table.tableOrderDetail tbody td{padding: 1px 4px;}
table.tableOrderDetail tbody td.padTop{padding-top: 8px;}
#orderDetail td{border-bottom: 1px solid #ccc; padding: 2px 4px;}

/* ~~~ === INFORMATION PAGES ======================================================================== ~~~ */
dl.infoItem
{
    margin: 0 0  12px;
    padding: 0 0  12px;
    border-bottom: 1px dotted #ccc;
}
dl.infoItem dt
{
    font: bold 16px Arial, Helvetica, sans-serif;
    margin: 0 0 4px;
}
dl.infoItem dd
{
    margin: 0;
}


/* ~~~ === SITEMAP ================================================================================== ~~~ */
#sitemap{margin: 28px 14px;}
#sitemap h3
{
    background: url(../images/icons/base.gif) no-repeat 2px 0;
    margin: 4px 0 0 16px;
    padding:0 0 5px 18px;
    font: bold 12px Arial, Helvetica, sans-serif;
}
ul.sitemap
{
    list-style-type: none;
    margin: 0 16px 16px;
    padding: 0;
    background: url(../images/icons/line.gif) repeat-y;
}
ul.sitemap
{
    list-style-type: none;
    margin: 0 16px 16px;
    padding: 0;
    background: url(../images/icons/line.gif) repeat-y;
}
ul.sitemap ul
{
    list-style-type: none;
    margin: 0 0 0 8px;
    padding: 0;
    background: url(../images/icons/line.gif) repeat-y;
}
ul.sitemap li
{
    line-height: 20px;
    padding-left: 7px;
    position: relative;
}
ul.sitemap a,
ul.sitemap li.lastchild li a
{
    background: url(../images/icons/page.gif) no-repeat 0 50%;
    padding: 4px 0 4px 26px;
}
.lastchild{background-color: #fff;}
li.lastchild a,
ul.sitemap li.lastchild li.lastchild a{background: #fff url(../images/icons/page_bottom.gif) no-repeat 0 0;}

/* ~~~ === CLASSES ============================== ~~~ */
.center{text-align: center;}
.right{text-align: right;}
.clear{clear: both;}
div.captionImageLeft,
div.captionImageRight
{
    font-size: .9em;
    color: #888;
}
div.captionImageLeft
{
    float: left;
    margin: 4px 12px 4px 0;
}
div.captionImageRight
{
    float: right;
    margin: 4px 0 4px 12px;
}
.img-left
{
    float: left;
    margin: 0 12px 4px 0;
}
.img-right
{
    float: right;
    margin: 0 0 4px 12px;
}
.border-none{border: none;}
.border-thin{border: 1px solid #C2AC80;}
.border-thick{border: 2px solid #C2AC80;}