html, body
{
    width: 100%;
}
html, body, div
{
    margin: 0;
    padding: 0;
}
body 
{
    background: #fff url(../images/back.jpg) center top no-repeat;
    font-family: Arial, Sans-Serif;
    font-size: 10pt;
    color: #555;
}
form
{
    display: inline;
}
#greenBar div.navi {display: none;}
div.container
{
    margin: 0 auto 15px auto;
    padding: 0;
    width: 994px;
}
h1
{
    margin: 7px 0 0 50px;
    padding: 0;
    width: 341px;
    height: 59px;
    text-indent: -5000px;
    background: url(../images/logo.gif) left top no-repeat;
}
h1 a
{
    display: block;
    height: 100%;
    width: 100%;
}

ul.topnav
{
    float: right;
    list-style: none;
    margin: 5px 30px 0 0;
    padding: 0;
}
    ul.topnav li
    {
        display: inline;
        margin: 0;
        padding: 0 0 0 8px;
        font-size: 9pt;
    }
        ul.topnav li a
        {
            color: #666;
            text-decoration: none;
        }
        ul.topnav li a:hover
        {
            text-decoration: underline;
        }

div.bar-top
{
    background: url(../images/back-top-blue.png) left bottom no-repeat;
    height: 24px;
}
    div.bar-top ul.tabs
    {
        list-style: none;
        margin: 0;
        padding: 0 29px 0 0;
        float: right;
    }
    div.bar-top ul.tabs li
    {
        margin: 0 0 0 3px;
        padding: 0;
        float: left;
        width: 112px;
        height: 24px;
    }
        div.bar-top ul.tabs li.aboutus a
        {
            background-image: url(../images/tab-aboutus-off.png);
        }
	        div.bar-top ul.tabs li.aboutus a.on
	        {
	            background-image: url(../images/tab-aboutus-on.png);
	        }
        div.bar-top ul.tabs li.treatments a
        {
            background-image: url(../images/tab-treatments-off.png);
        }
	        div.bar-top ul.tabs li.treatments a.on
	        {
	            background-image: url(../images/tab-treatments-on.png);
	        }
        div.bar-top ul.tabs li.store a
        {
            background-image: url(../images/tab-onlinestore-off.png);
        }
	        div.bar-top ul.tabs li.store a.on
	        {
	            background-image: url(../images/tab-onlinestore-on.png);
	        }
        div.bar-top ul.tabs li a
        {
            text-indent: -5000px;
            display: block;
            height: 100%;
            width: 100%;
            background-position: left bottom;
            background-repeat: no-repeat;
        }
        div.bar-top ul.tabs li a:hover
        {
            background-position: left top;
        }

div.bar-mid
{
    width: 994px;
    background: url(../images/back-mid-blue.png) left top repeat-y;
}
div.bar-main
{
    background: url(../images/back-main-blue.png) left top no-repeat;
}
div.bar-bot
{
    background: url(../images/back-bot-blue.png) left bottom no-repeat;
    min-height: 178px;
}


h2.store
{
    display: block;
    margin: 0;
    padding: 19px 0 0 48px;
    width: 84px;
    height: 25px;
    text-indent: -5000px;
    background: url(../images/bar-store-blue.png) 48px 19px no-repeat;
    float: left;
}

ul.departments
{
    float: left;
    margin: 0;
    padding: 0 0 0 52px;
    list-style: none;
    display: block;
    height: 58px;
    background: url(../images/depts-line.png) 50px top no-repeat;
}
    ul.departments li
    {
        float: left;
        margin: 0;
        padding: 0;
        display: block;
    }
    ul.departments li a
    {
        display: block;
        width: 130px;
        height: 58px;
        background: left top no-repeat;
        text-indent: -5000px;
    }
    ul.departments li a:hover
    {
        background-position: left bottom;
    }
    ul.departments li.dept1 a.selected { background-image: url(../images/dept1-on.png); }
    ul.departments li.dept2 a.selected { background-image: url(../images/dept2-on.png); }
    ul.departments li.dept3 a.selected { background-image: url(../images/dept3-on.png); }
    ul.departments li.dept4 a.selected { background-image: url(../images/dept4-on.png); }
    ul.departments li.dept5 a.selected { background-image: url(../images/dept5-on.png); }
    ul.departments li.dept6 a.selected { background-image: url(../images/dept6-on.png); }
    ul.departments li.dept1 a { background-image: url(../images/dept1-off.png); }
    ul.departments li.dept2 a { background-image: url(../images/dept2-off.png); }
    ul.departments li.dept3 a { background-image: url(../images/dept3-off.png); }
    ul.departments li.dept4 a { background-image: url(../images/dept4-off.png); }
    ul.departments li.dept5 a { background-image: url(../images/dept5-off.png); }
    ul.departments li.dept6 a { background-image: url(../images/dept6-off.png); }


div.maincontent
{
    margin: 0;
    padding: 12px 0 0 52px;
    float: left;
    width: 942px;
    min-height: 460px;
}

div.footer
{
    width: 994px;
    margin: 10px auto 20px auto;
    padding: 0;
    color: #999;
    font-size: 8pt;
    text-align: center;
}
    div.footer ul
    {
        list-style: none;
        margin: 0;
        padding: 0;
    }
    div.footer ul li
    {
        display: inline;
        margin: 0 5px;
    }
    div.footer a
    {
        color: #999;
    }
    div.footer a:hover
    {
        color: #666;
    }

div.col1
{
    margin: 0;
    padding: 10px 0;
    float: left;
    width: 700px;
}
div.col2
{
    margin: 0;
    padding: 2px 0 0 0;
    float: left;
    width: 212px;
}

/* Boxes */

div.box1
{
    background: #c4c5c7 url(../images/product-back-top.gif) left top repeat-x;
}

    div.box1 div.tl
    {
        background: url(../images/prod-border.gif) left top no-repeat;
        height: 100%;
    }
    div.box1 div.tr
    {
        background: url(../images/prod-border.gif) right top no-repeat;
    }
    div.box1 div.br
    {
        background: url(../images/prod-border.gif) right bottom no-repeat;
    }
    div.box1 div.bl
    {
        background: url(../images/prod-border.gif) left bottom no-repeat;
        padding: 2px;
    }

    
div.greenbox
{
    background: #6a8812 url(../images/greenbox-back.gif) left top repeat-x;
    margin-bottom: 5px;
}
    div.greenbox div.greenbox-tl
    {
        background: url(../images/greenbox-border.gif) left top no-repeat;
        height: 100%;
    }
    div.greenbox div.greenbox-tr
    {
        background: url(../images/greenbox-border.gif) right top no-repeat;
    }
    div.greenbox div.greenbox-br
    {
        background: url(../images/greenbox-border.gif) right bottom no-repeat;
    }
    div.greenbox div.greenbox-bl
    {
        background: url(../images/greenbox-border.gif) left bottom no-repeat;
        padding: 8px;
        min-height: 200px;
    }

    div.greenbox h5
    {
        color: #fff;
        margin: 0;
        padding: 0;
        font-size: 10pt;
    }
    div.greenbox h4.treatments
    {
        display: block;
        margin: 2px auto 8px auto;
        padding: 0;
        width: 78px;
        height: 13px;
        background: url(../images/greenbox-title_treatments.gif) left top no-repeat;
        text-indent: -5000px;
    }
    div.greenbox h4.related-treatments
    {
        display: block;
        margin: 2px auto 8px auto;
        padding: 0;
        width: 132px;
        height: 13px;
        background: url(../images/greenbox-title_related-treatments.gif) left top no-repeat;
        text-indent: -5000px;
    }
    div.greenbox a
    {
        color: #fff;
        text-decoration: none;
    }
    div.greenbox a img.treatment
    {
        margin: 0 auto 8px;
        border: 0;
        display: block;
        width: 164px;
    }
    div.greenbox a span.treatment
    {
        display: block;
        margin: 0 auto 8px;
        width: 164px;
        font-size: 9pt;
        font-weight: bold;
        color: #fff;
    }
        div.greenbox a:hover span.treatment
        {
            text-decoration: underline;
        }
    div.greenbox a span.treatment-desc
    {
        display: block;
        margin: 0 auto;
        width: 164px;
        font-size: 8pt;
        color: #fff;
    }
    
div.bluebox
{
    background: #597672 url(../images/bluebox-back.gif) left top repeat-x;
    margin-bottom: 5px;
}
    div.bluebox div.bluebox-tl
    {
        background: url(../images/bluebox-border.gif) left top no-repeat;
        height: 100%;
    }
    div.bluebox div.bluebox-tr
    {
        background: url(../images/bluebox-border.gif) right top no-repeat;
    }
    div.bluebox div.bluebox-br
    {
        background: url(../images/bluebox-border.gif) right bottom no-repeat;
    }
    div.bluebox div.bluebox-bl
    {
        background: url(../images/bluebox-border.gif) left bottom no-repeat;
        padding: 8px;
        min-height: 200px;
    }

    div.bluebox h5
    {
        color: #fff;
        margin: 0;
        padding: 0;
        font-size: 10pt;
    }
    div.bluebox h4.brands
    {
        display: block;
        margin: 2px auto 8px auto;
        padding: 0;
        width: 78px;
        height: 13px;
        background: url(../images/bluebox-title_brands.gif) left top no-repeat;
        text-indent: -5000px;
    }
    div.bluebox a
    {
        color: #fff;
        text-decoration: none;
    }
    div.bluebox a img.brand
    {
        margin: 0 auto;
        border: 0;
        display: block;
        width: 82px;
    }
    
div.redbox
{
    background: #e2021b url(../images/redbox-back.gif) left top repeat-x;
    margin-bottom: 5px;
}
    div.redbox div.redbox-tl
    {
        background: url(../images/redbox-border.gif) left top no-repeat;
    }
    div.redbox div.redbox-tr
    {
        background: url(../images/redbox-border.gif) right top no-repeat;
    }
    div.redbox div.redbox-br
    {
        background: url(../images/redbox-border.gif) right bottom no-repeat;
    }
    div.redbox div.redbox-bl
    {
        background: url(../images/redbox-border.gif) left bottom no-repeat;
    }

    div.redbox a.redbox-linkbutton
    {
        display: block;
        padding: 4px 20px;
        color: #fdd;
        text-decoration: none;
        font-weight: bold;
    }
    div.redbox a.redbox-linkbutton:hover
    {
        text-decoration: underline;
        color: #fff;
    }

/* Breadcrumb */

ul.breadcrumb
{
    list-style: none;
    margin: 0;
    padding: 0;
}
    ul.breadcrumb li
    {
        display: inline;
        padding: 0 2px 0 10px;
        background: url(../images/breadcrumb-bullet.gif) left 6px no-repeat;
    }
    ul.breadcrumb li:first-child
    {
        padding-left: 0;
        background: none;
    }
    ul.breadcrumb li a
    {
        color: #666;
        text-decoration: none;
    }
    ul.breadcrumb li a:hover
    {
        text-decoration: underline;
    }

ul.filters
{
    margin: 0;
    padding: 0;
    list-style: none;
}
    ul.filters li
    {
        margin: 0;
        padding: 0 10px 10px 2px;
        float: left;
        text-align: center;
    }
    ul.filters li.sort
    {
        float: right;
    }

/* Products */

ul.products
{
    clear: both;
    list-style: none;
    margin: 0;
    padding: 0;
}
    ul.products li
    {
        display: block;
        float: left;
        width: 228px;
        margin: 0 5px 8px 0;
        padding: 0;
    }

    ul.products li.newline
    {
        clear: both;
    }

    ul.products li a
    {
        color: #666;
        text-decoration: none;
        padding: 5px 0 2px 8px;
        display: block;
    }
    ul.products li a:hover
    {
        color: #666;
        text-decoration: underline;
    }
    ul.products li div.photo
    {
        background: #fff;
        margin: 5px;
    }
        ul.products li div.photo a
        {
            display: block;
            min-height: 143px;
        }

/* Product Detail */

div.product-detail
{
    width: 694px;
    float: left;
}
    div.product-detail div.box1 div.bl
    {
        min-height: 300px;
        padding: 8px;
    }
    
    div.product-detail div.product-header
    {
        float: left;
        padding-bottom: 4px;
    }
    div.product-detail div.product-action
    {
        margin-top: 10px;
        float: right;
    }
    div.product-detail div.product-description
    {
        float: left;
		clear: left;
        width: 230px;
        font-size: 10pt;
    }
        div.product-detail div.product-description p
        {
            margin: 0 0 10pt 0;
        }
        div.product-detail div.product-description p.product-intro
        {
            font-weight: bold;
        }
        div.product-detail div.product-description ul
        {
            margin: 0;
            padding-left: 15pt;
        }
    div.product-detail div.product-photos
    {
        float: right;
        width: 440px;
    }
        div.product-detail div.product-photos ul
        {
            list-style: none;
            margin: 0;
            padding: 0;
        }
            div.product-detail div.product-photos ul li
            {
                margin: 0;
                padding: 0 0 2px 5px;
                float: right;
            }
div.hr
{
    clear: both;
}