﻿/*-----------------------------------------------------------------------
// <copyright file="StyleSheet.css" company="Encore Systems LLC">
//     Copyright (c) Encore Systems LLC. All rights reserved.
// </copyright>
//-----------------------------------------------------------------------*/

/* reset */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, 
big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, 
center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td 
{ margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; }
ol, ul { list-style: none; }
blockquote, q {	quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }
table { border-collapse: collapse; border-spacing: 0; }

/* defaults */
body { line-height: 1; background-color: #A1A1A1; color: #333333; font-family: Arial; font-size: 10pt; }
h1 { color: #444444; font-family: Arial; font-size: 16pt; font-weight: bold; }
h2, h3 { color: #444444; font-family: Arial; font-size: 14pt; font-weight: bold; }
h4 { color: #333333; font-family: Arial; font-size: 12pt; font-weight: bold; }
h5, h6 { color: #333333; font-family: Arial; font-size: 10pt; font-weight: bold; }
a:link { text-decoration: underline; color: #333333; }
a:visited { text-decoration: underline; color: #333333; }
a:hover { text-decoration: underline; color: #7C6A54; }
a:active { text-decoration: underline; color: #333333; }

#searchBar
{
    float: left;
    height: 40px;
    width: 540px;
}

#searchBarLeft
{
    margin-left: 10px;
    float: left;
    height: 40px;
    width: 10px;
}

#searchBarMiddle
{
    height: 40px;
    padding-top: 8px;
    margin-left: 10px;
    margin-right: 20px;
}

#searchBarRight
{
    float: right;
    height: 40px;
    width: 20px;
}

.centered { margin: 0 auto; }
.clear { clear: both; }

.masterContent
{
    background-color: White;
    padding: 10px 0 10px 0;
}

.pageContent
{
    margin-left: 20px;
}

/* main header */
.mainHeader
{
    font-size: 8pt;
    font-weight: bold;
    line-height: 1.2em;
}

.mainHeader td
{
    vertical-align: middle;
}
.headerLink .free-shipping
{
    float: left; 
    color:#c28d4e; 
    /*
    font-weight: bold; 
    font-size: 13px;
    font-family: Times New Roman;
    */
}

.headerLink a
{
    text-decoration: none;
}

.headerLink a:link
{
    text-decoration: none;
}

.headerLink a:visted
{
    text-decoration: none;
}

.headerLink a:hover
{
    text-decoration: none;
}

.headerLink a:active
{
    text-decoration: none;
}

a.cartLink
{
    color: #7a5538;
    font-size: 12px;
}

a.cartLink:link
{
    text-decoration: none;
}

a.cartLink:visted
{
    text-decoration: none;
}

a.cartLink:hover
{
    text-decoration: none;
    color: #b78a60;
}

a.cartLink:active
{
    text-decoration: none;
}

/* main menu */
ul.mainMenu
{
    display: block;
    height: 30px;
}

ul.mainMenu li
{ 
    float: left;
    list-style: none;
}

/* header */
#headerBox
{
     width: 100%; 
     padding-top: 5px; 
     padding-bottom: 5px;
}

/* footer links */
div.footerLinks
{
    margin-top: 25px;
    text-align: center;
}
div.footerBox
{
    width: 625px;
    margin: 0 auto;
}

div.footerLinks a
{
    text-decoration: none;
}

ul.footerLinks li
{ 
    float: left;
    list-style: none;
    text-align: center;
    text-transform: uppercase;
    padding: 0 5px;
}

ul.footerLinks li a
{ 
    font-size: 11px;
    text-decoration: none;
}

.bannerContent
{
    width: 790px;
    height: 30px;
    overflow: hidden;
}

.bannerImage
{
    float: left;
    height: 30px;
}

.menuContent
{
    float: left;
    width: 140px;
    margin-right: 8px;
}

.mainContent
{
    float: left;
    width: 790px;
}

.imageContainer1
{
    position: relative;
    width: 790px;
    height: 500px;
}

.mainImage1
{
    position: absolute;
    top: 0;
    left: 0;
    width: 790px;
    height: 500px;
    background-repeat: no-repeat;
}

.imageContainer2
{
    position: relative;
    width: 790px;
    height: 400px;
}

.mainImage2
{
    position: absolute;
    top: 0;
    left: 0;
    width: 550px;
    height: 400px;
    background-repeat: no-repeat;
}

.topImage2
{
    position: absolute;
    top: 0;
    left: 550px;
    width: 240px;
    height: 200px;
    background-repeat: no-repeat;
}

.bottomImage2
{
    position: absolute;
    top: 200px;
    left: 550px;
    width: 240px;
    height: 200px;
    background-repeat: no-repeat;
}

.imageContainer3
{
    position: relative;
    width: 790px;
    height: 600px;
}

.mainImage3
{
    position: absolute;
    top: 0;
    left: 0;
    width: 550px;
    height: 600px;
    background-repeat: no-repeat;
}

.topImage3
{
    position: absolute;
    top: 0;
    left: 550px;
    width: 240px;
    height: 200px;
    background-repeat: no-repeat;
}

.middleImage3
{
    position: absolute;
    top: 200px;
    left: 550px;
    width: 240px;
    height: 200px;
    background-repeat: no-repeat;
}

.bottomImage3
{
    position: absolute;
    top: 400px;
    left: 550px;
    width: 240px;
    height: 200px;
    background-repeat: no-repeat;
}

.imageContainer4
{
    position: relative;
    width: 790px;
    height: 500px;
}

.mainImage4
{
    position: absolute;
    top: 0;
    left: 0;
    width: 480px;
    height: 500px;
    background-repeat: no-repeat;
}

.topImage4
{
    position: absolute;
    top: 0;
    left: 480px;
    width: 310px;
    height: 250px;
    background-repeat: no-repeat;
}

.bottomImage4
{
    position: absolute;
    top: 250px;
    left: 480px;
    width: 310px;
    min-height: 250px;
    background-repeat: no-repeat;
}

.imageContainer5
{
    position: relative;
    width: 790px;
    height: 600px;
}

.mainImage5
{
    position: absolute;
    top: 0;
    left: 0;
    width: 480px;
    height: 600px;
    background-repeat: no-repeat;
}

.topImage5
{
    position: absolute;
    top: 0;
    left: 480px;
    width: 310px;
    height: 200px;
    background-repeat: no-repeat;
}

.middleImage5
{
    position: absolute;
    top: 200px;
    left: 480px;
    width: 310px;
    height: 200px;
    background-repeat: no-repeat;
}

.bottomImage5
{
    position: absolute;
    top: 400px;
    left: 480px;
    width: 310px;
    height: 200px;
    background-repeat: no-repeat;
}

.imageContainer6
{
    position: relative;
    width: 790px;
    height: 600px;
}

.mainImage6
{
    position: absolute;
    top: 0;
    left: 0;
    width: 480px;
    height: 600px;
    background-repeat: no-repeat;
}

.topImage6
{
    position: absolute;
    top: 0;
    left: 480px;
    width: 310px;
    height: 150px;
    background-repeat: no-repeat;
}

.upperImage6
{
    position: absolute;
    top: 150px;
    left: 480px;
    width: 310px;
    height: 150px;
    background-repeat: no-repeat;
}

.lowerImage6
{
    position: absolute;
    top: 300px;
    left: 480px;
    width: 310px;
    height: 150px;
    background-repeat: no-repeat;
}

.bottomImage6
{
    position: absolute;
    top: 450px;
    left: 480px;
    width: 310px;
    height: 150px;
    background-repeat: no-repeat;
}

a.homeLink
{ 
    text-decoration: none;
    font-size: 10px;
}

.breadCrumbSeparator
{
    color: #888888;
    font-size: 11px;
    margin-left: 5px;
}

ul.filterBreadCrumb
{
    margin-top: 10px;
}

ul.filterBreadCrumb li
{ 
    float: left;
    list-style: none;
    text-transform: uppercase;
}

ul.filterBreadCrumb li a
{ 
    text-decoration: none;
    font-size: 11px;
}

ul.filterBreadCrumb li a:link
{ 
    text-decoration: none;
}

ul.filterBreadCrumb li a:visited
{ 
    text-decoration: none;
}

ul.filterBreadCrumb li a:hover
{ 
    text-decoration: none;
}

ul.filterBreadCrumb li a:active
{ 
    text-decoration: none;
}

/* column menu */
ul.categoryColumnMenu
{
    margin-bottom: 20px;
}

ul.categoryColumnMenu li
{
    font-size: 10px;
    text-transform: uppercase;
    margin-bottom: 10px;
}

ul.categoryColumnMenu li a
{
    text-decoration: none;
}

ul.categoryColumnMenu li a:link
{
    text-decoration: none;
}

ul.categoryColumnMenu li a:visited
{
    text-decoration: none;
}

ul.categoryColumnMenu li a:hover
{
    text-decoration: none;
}

ul.categoryColumnMenu li a:active
{
    text-decoration: none;
}

ul.filterColumnMenu
{
    margin-bottom: 20px;
}

ul.filterColumnMenu li
{ 
    list-style: none;
    text-transform: uppercase;
    margin-bottom: 10px;
}

ul.filterColumnMenu li a
{ 
    text-decoration: none;
    font-size: 10px;
}

ul.filterColumnMenu li a:link
{ 
    text-decoration: none;
}

ul.filterColumnMenu li a:visited
{ 
    text-decoration: none;
}

ul.filterColumnMenu li a:hover
{ 
    text-decoration: none;
}

ul.filterColumnMenu li a:active
{ 
    text-decoration: none;
}

ul.columnMenu
{
    margin-bottom: 20px;
}

ul.columnMenu li
{ 
    list-style: none;
    text-transform: uppercase;
    line-height: 0.8em;
    margin-bottom: 5px;
}

ul.columnMenu li a
{ 
    text-decoration: none;
    font-size: 10px;
}

ul.columnMenu li a:link
{ 
    text-decoration: none;
}

ul.columnMenu li a:visited
{ 
    text-decoration: none;
}

ul.columnMenu li a:hover
{ 
    text-decoration: none;
}

ul.columnMenu li a:active
{ 
    text-decoration: none;
}

ul.socialBar
{
    margin-top: 5px;
    float: right;
}

ul.socialBar li
{ 
    float: right;
    margin-left: 5px;
    list-style: none;
}

/* search bar */
ul.searchBar
{
}

ul.searchBar li
{ 
    float: left;
    list-style: none;
}

#searchBar
{
    float: left;
    height: 40px;
    width: 540px;
}

#searchBarLeft
{
    background-image: url(Images/SearchBar_01.gif);
    background-repeat: no-repeat;
}

#searchBarMiddle
{
    color: White;
    font-weight: bold;
    background-image: url(Images/SearchBar_02.gif);
    background-repeat: repeat-x;
}

#searchBarRight
{
    background-image: url(Images/SearchBar_04.gif);
    background-repeat: no-repeat;
}

#searchBarLeft
{
    margin-left: 10px;
    float: left;
    height: 40px;
    width: 10px;
}

#searchBarMiddle
{
    height: 40px;
    padding-top: 8px;
    margin-left: 10px;
    margin-right: 20px;
}

#searchBarRight
{
    float: right;
    height: 40px;
    width: 20px;
}

.goButton
{
    position: relative;
    top: 1px;
}

.salePrice
{
    color: #FFFF66;
}

.filterLabel
{
    font-family: "Century Gothic", "Arial Narrow", Arial, Verdana, sans-serif;
    text-transform: uppercase;
    font-size: 28px;
    letter-spacing: -1px;
    line-height: 1em;
    margin-bottom: 25px;
    color: #FFFFCC;
}

.productDisplay
{
    background-color: #787777;
    color: #FFFFCC;
    text-align: left;
    font-size: 11px;
    line-height: 1.2em;
    padding: 30px 30px 20px 30px;
}

.productDisplay a
{
    color: #FFFFCC;
    text-decoration: none;
}

.productDisplay a:link
{
    color: #FFFF66;
    text-decoration: none;
}

.productDisplay a:visted
{
    color: #FFFF66;
    text-decoration: none;
}

.productDisplay a:hover
{
    color: #FFFF66;
    text-decoration: none;
}

.productDisplay a:active
{
    color: #FFFF66;
    text-decoration: none;
}

.itemCell
{
    width: 120px; 
    vertical-align: middle;
}

.artistCell
{
    width: 155px; 
    vertical-align: middle;
}

.sortBox
{
    float: left;
    font-size: 12px;
}

.pagerViewAll
{
    position: absolute; 
    right: 25px; 
    top: -1px;
}

.pagerView20
{
    position: absolute; 
    right: -10px; 
    top: -2px;
}

.pagerNumberCurrent
{
    font-size: 13px;
    letter-spacing: 2px;
    font-weight: bold;
    color: #FFFF66;
    /*text-decoration: underline;*/
}
.pagerNumbers
{
    font-size: 12px;
    letter-spacing: 2px;
}
a.pagerNumbers:link
{
    color: #FFFFCC;
    text-decoration: none;
}
a.pagerNumbers:visited
{
    color: #FFFFCC;
    text-decoration: none;
}
a.pagerNumbers:hover
{
    color: #FFFF66;
    /*text-decoration: underline;*/
}
a.pagerNumbers:active
{
    color: #FFFF66;
    /*text-decoration: underline;*/
}
.pagerLeftButton
{
    position: absolute;
    bottom: -2px;
    left: -18px;
}
.pagerRightButton
{
    position: absolute;
    bottom: -2px;
    right: -18px;
}
.mainTextPanel
{
    clear: both;
    text-align: left;
    padding: 35px 0 10px 0;
    line-height: 1.25em;
}
.mainTextPanel h1
{
    font-size: 18pt;
    margin: 10px 0;
}
.mainTextPanel h2
{
}
.mainTextPanel h3
{
}
.mainTextPanel p
{
    margin: 7px 0;
}
.underlinedLink a:link
{
    text-decoration: underline;
    color: #333333;
}

.underlinedLink a:visited
{
    text-decoration: underline;
    color: #333333;
}

.underlinedLink a:hover
{
    text-decoration: underline;
    color: #7C6A54;
}

.underlinedLink a:active 
{
    text-decoration: underline;
    color: #333333;
}

.gridLink a:link
{
    font-size: small;
    font-weight: normal;
    text-decoration: none;
    color: #333333;
}

.gridLink a:visited
{
    font-size: small;
    font-weight: normal;
    text-decoration: none;
    color: #333333;
}

.gridLink a:hover
{
    font-size: small;
    font-weight: normal;
    text-decoration: none;
    color: #333333;
}

.gridLink a:active 
{
    font-size: small;
    font-weight: normal;
    text-decoration: none;
    color: #333333;
}

.justified
{
    text-align: justify;
}

.content
{
    background-color: White;
}

.artistColumn
{
    padding: 10px;
    background-color: #DFDBDB;
}

.categoryColumn
{
    padding: 10px;
    background-color: #DFDBDB;
}

.mainColumn
{
    padding: 10px;
    background-color: #DFDBDB;
}

.optionHeader
{
    font-weight: bold; 
    font-size: medium;
}

.cartHeader
{
    text-decoration: underline;
    font-weight: bold;
}

.cartText
{
    font-size: small;
}

.cartText td
{
    font-size: small;
}

.formTable
{
    border-collapse: collapse;
    background-color: #FFFFFF;
}

.formTable td
{
    border: solid 1px #C9C9C9;
    padding-left: 5px;
    padding-right: 5px;
    padding-top: 1px;
    padding-bottom: 1px;
}

.numeric
{
    text-align: right;
}

.readOnly
{
    background-color: #E2E0E1;
}

.readOnlyDiv
{
    background-color: #E2E0E1;
    padding: 5px;
    border: inset 2px;
    text-decoration: none;
    font-size: small;
    font-style: normal;
    font-variant: normal;
    font-weight: normal;
}

.wizard, 
.normal
{
    background-color: #FFFFFF;
    border: solid 1px #C9C9C9;
}

.wizard table, 
.wizardNoBorder table, 
.normal table,
.normalNoBorder table
{
    width: 100%;
    border-collapse: collapse;
}

.wizard table table th,
.normal th
{
    color: #5B554B;
    font-size: larger;
    background-color: #E2E0E1;
    padding-top: 3px;
    padding-bottom: 5px;
}

.wizard table table td,
.wizardNoBorder table table td,
.normal td,
.normalNoBorder td
{
    padding-top: 5px;
    padding-left: 10px;
    padding-right: 10px;
}

.wizard input[type="text"], input[type="password"], select
{
    width: 100%;
}

.wizardNoBorder input[type="text"], input[type="password"], select
{
    width: 100%;
}

.normal input[type="text"], input[type="password"], input[type="file"], select, textarea
{
    width: 100%;
}

.normalNoBorder input[type="text"], input[type="password"], input[type="file"], select, textarea
{
    width: 100%;
}

.normalHeader
{
    color: #5B554B;
    background-color: #E2E0E1;
    padding-top: 3px;
    padding-bottom: 5px;
    text-align: center;
}

.normalBottom
{
    border-bottom: solid 1px #C9C9C9;
}

.normalTop
{
    border-top: solid 1px #C9C9C9;
}

.normalRight
{
    border-right: solid 1px #C9C9C9;
}

.normalLeft
{
    border-left: solid 1px #C9C9C9;
}

.detailView input[type="text"], input[type="password"]
{
    width: 16em;
}

.detailView select
{
    width: 16.5em;
}


.gridPadding td
{
    padding: 3px 5px 3px 5px;
}

.showPointer
{
    cursor: pointer;
}

.artistTitle
{
    font-size: large;
}

.bold
{
    font-weight: bold;
}

.superLight
{
    color: #878686;
}

.superLight a:link
{
    text-decoration: none;
    color: #878686;
}

.superLight a:visited
{
    text-decoration: none;
    color: #878686;
}

.superLight a:hover
{
    text-decoration: none;
    color: #7C6A54;
}

.superLight a:active 
{
    text-decoration: none;
    color: #878686;
}

.extraLight
{
    color: #717070;
}

.extraLight a
{
    color: #717070;
}

.light
{
    color: #444444;
}

.light a
{
    color: #444444;
}

.dark
{
    color: #333333;
}

.xxsmall
{
    font-size: .65em;
}

.xsmall
{
    font-size: .75em;
}

.small
{
    font-size: 8pt;
}

.medium
{
    font-size: 10pt;
}

.large
{
    font-size: 12pt;
}

.xlarge
{
    font-size: 1.1em;
}

.xxlarge
{
    font-size: 1.3em;
}

.whiteLink a:link
{
    text-decoration: none;
    color: #E2E0E1;
}

.whiteLink a:visited
{
    text-decoration: none;
    color: #E2E0E1;
}

.whiteLink a:hover
{
    text-decoration: underline;
    color: #E2E0E1;
}

.whiteLink a:active 
{
    text-decoration: underline;
    color: #E2E0E1;
}

.buttonBorder a
{
    border: 2px solid Transparent;
}	

.buttonBorder a:hover
{
    border-left: 2px solid ButtonFace;
    border-top: 2px solid ButtonFace;
    border-right: 2px solid ButtonShadow;
    border-bottom: 2px solid ButtonShadow;
}	

.buttonBorder a:active
{
    border-left: 2px solid ButtonShadow;
    border-top: 2px solid ButtonShadow;
    border-right: 2px solid ButtonFace;
    border-bottom: 2px solid ButtonFace;
}	

.modalBackground 
{
    background-color: Gray;
    filter: alpha(opacity=50);
    opacity: 0.5;
}

.modalPopup 
{
    background-color: #FFFFFF;
    border: solid 1px #C9C9C9;
}

.calendarExtender div
{
    background-color: #E2E0E1;
    border: solid 1px #C9C9C9;
}

.calendarExtender div div
{
    border: 0;
}

.calendarExtender div td
{
    font-weight: normal;
    padding: 0;
}

.waterMark
{
    background-color: #F5F5F5;
}

