/* CONTENTS

    GENERAL
    - color glossary
    - general

    MY ACCOUNT
    - my account/dealer menu (shopcustadmin.asp)
    - my account login, regular or forced
    - general my account page, like update password or join mailing list

    SHOP
    - product page (main.asp, common, main_util.asp, main_template*.asp), 
    includes page header, brands table, category table, page navigation and more

    ADMIN
    - admin login (al.asp)
    - price sheet results
    - typical admin page, like news

    UNIDENTIFIED STUFF
    for possible deletion

*/

/**
* GENERAL
***/

/* color glossary 

    FRONT-END:
        red (in header menu): #b60f17
        red (page title text): #dd0c17
        white (background): #ffffff
        almost-black (text): #333333
        lighter-grey (links): #666666;
        darker-grey (link hover): #333333;

    STORE AND ADMIN:
        darker grey (header background): #c9c9c9
        black (header text): #000000
        lighter grey (data background): #f0f0f0
        black (data text): #000000
        lighter-grey (links): #666666;
        darker-grey (link hover): #333333;
        red (errors): #dd0c17 (same as ErrorFontStart in shop$colors.asp)

*/

/* general */
#shopcontent hr 
{
    margin: 0px 25px;
    background-color: Transparent;
    color: #333333;
}

.shopInfoMsg
{
    margin: 80px 20px;
    font-weight: bold;
    text-align: center;
}
.shopInfoMsg a { font-weight: normal; }

.ErrorMessage { color: #dd0c17; } /* same as ErrorFontStart */


/*****
* MY ACCOUNT
*   also used for admin->configuration (shopa_config.asp, etc.)
*****/

/* my account/dealer menu (shopcustadmin.asp) */
.AdminMenuTable 
{
    width: 60%;
	font-size: inherit;
    border: solid 1px #000000;
}
.AdminMenuTable th
{
	padding: 3px 5px 3px 5px;
	text-align: center;
	background-color: #C9C9C9;
	color: #000000;
    border-bottom: solid 1px #000000;
}
.AdminMenuTable td
{
	padding: 3px 5px 3px 5px;
	text-align: left;
	background-color: #f0f0f0;
	color: #000000;
}

/* my account login (regular or forced) */
.TableDefLogin
{
    font-size: inherit;
    width: 30%;
	background-color: #f0f0f0; /* matches xTableRowColor */
	color: #000000;
    border: solid 1px #000000;
}
.TableDefLogin td
{
	padding: 3px 5px 3px 5px;
}

/* general my account page, like update password or join mailing list 
*     also used for some admin pages, like homepage specials and bulk e-mila utility
*     also used during shopping, on enter-address page
*/
.TableDef
{
    font-size: inherit;
	background-color: #000000;
    border: solid 1px #000000;
}
.TableDef th
{
	padding: 3px 5px 3px 5px;
	font-weight: bold;
	background-color: #c9c9c9;
	color: #000000;
    border-bottom: solid 1px #000000;
}
.TableDef tr
{
    vertical-align: middle;
}
.TableDef td
{
	padding: 3px 5px 3px 5px;
    font-size: inherit;
	text-align: left;
    vertical-align: middle;
	background-color: #f0f0f0;
	color: #000000;
}
.TableColumn
{
    font-size: inherit;
	text-align: left;
	color: #000000;
}

/*****
* SHOP
*****/

/* product page (main.asp, common, util_main.asp, util_template*.asp)
* (page title, brands table, specials table, category table, product table, page navigation) 
*/

.ProdPageTitle /* indicates if page contains brand, category, search results */
{
    clear: both;
    padding-left: 3px;
    margin: 10px 20px 0px 20px;
    font-weight: bold;
    font-size: 18px;
	line-height: 1.3em;
    color: #333333;
}
.BrandTitle /* brand portion of ProdPageTitle */
{
    color: #dd0c17;
}
.allbrands, .allbrands a /* "see all brands", "see all products for this brand" */
{
    font-size: 14px;
    font-weight: bold;
    color: #dd0c17;
}
#shopcontent .allbrands a:hover 
{ 
    color: #333333; 
    text-decoration: none; 
}
.shopByLabel /* labels: by brand, by category, specials */
{
    font-size: 14px;
    line-height: 1.5em;
    font-weight: bolder;
	color: #dd0c17;
}

.ShopTable
{
    clear: both;
    width: 100%;
    font-size: inherit;
}

.BrandTable
{
    width: 175px;
    font-size: inherit;
    background-color: #000000;
    color: #ffffff;
    border: solid 12px #000000;
}
.BrandTable td
{
	padding: 3px 18px;
	text-align: left;
    background: #000000 url(../layoutimages/homeBrandBullet.gif) no-repeat 0px -2px;
}
.BrandTable td a { color: #ffffff; text-decoration: none; }
.BrandTable td a:hover { color: #999999; text-decoration: underline; }
td.BrandHighlight a, td.BrandHighlight a:hover { color: #dd0c17; text-decoration: none; }

.SpecialsTable
{
    width: 100%;
    font-size: inherit;
	background-color: #f0f0f0;
	color: #000000;
    border: solid 3px #c9c9c9;
}
.SpecialsTable td
{
    width: 20%;
	padding: 10px 5px 5px 5px;
	vertical-align: top;
	text-align: left;
}
.specialtitle 
{
    display: block;
    padding: 3px;
    line-height: 1.3em;
	font-weight: bold;
	background-color: #c9c9c9;
	color: #000000;
    border: solid 3px #b60f17;
}
.specialimage 
{ 
    display: block; 
    margin: 3px 0px; 
    width: 100%;
    text-align: center;
}
.specialname { font-weight: bold; }
.specialtext { }
.specialmore { padding: 3px 0px; }
.specialmore a 
{ 
    padding: 0px 0px 0px 20px;
    font-weight: bold;
    background: transparent url(../layoutimages/prodBullet.jpg) no-repeat 0px 3px;
}

.CategoryTable
{
    width: 100%;
    font-size: inherit;
}
.CategoryTable td
{
	padding: 10px 5px 10px 5px;
	text-align: center;
	background-color: #ffffff;
	color: #000000;
    border: solid 1px #000000;
}

.ProductTable 
{ 
    font-size: inherit;
	background-color: #f0f0f0;
	color: #000000;
}
.ProductTable td 
{
    padding: 10px;
    border: solid 1px #000000;
}
.ProductTable img 
{
    border: solid 1px #c9c9c9;
}
.ProductName, a:link.ProductName
{   
    font-weight: bold;
    font-size: 14px;
}
.ProductRetail 
{   
    font-size: 11px;
    font-style: italic;
}
.ProductPrice 
{   
    font-size: 12px;
}
.ProductUOM
{   
    font-size: 10px;
}
td.XSell 
{
    background-color: #f0f0f0;
    color: #000000;
}

/***
* ADMIN
***/

/* admin login (al.asp) */
.AdminTable 
{
    font-size: inherit;
    width: 300px;
    text-align: left;
    border: solid 1px black;
}
.AdminTable th
{
	padding: 3px 5px 3px 5px;
    background-color: #c9c9c9;
    color: #000000;
    border-bottom: solid 1px black;
}
.AdminTable td
{
	padding: 3px 5px 3px 5px;
	text-align: left;
	background-color: #f0f0f0;
	color: #000000;
}

/* price sheets admin, bulk update admin */
#priceSheetResults, #bulkUpdate
{
    text-align: left;
    margin: 10px 40px; 
}

/* typical admin page, like news */
/* four parts: EditDisplayHeader, DisplayHeaderMenu, ReportTable, PageNavTable */
.EditDisplayHeader 
{
	border: solid 1px #000000;
}
.EditDisplayHeader th, .EditDisplayHeader th b
{
	padding: 3px 5px 3px 5px;
	text-align: center;
    background-color: #c9c9c9;
    color: #000000;
    border-bottom: solid 1px black;
}
.EditDisplayHeader td, .EditDisplayHeader td b
{
	padding: 3px 5px 3px 5px;
	background-color: #f0f0f0;
	color: #000000;
}
.EditDisplayFooter td, .EditDisplayFooter td b {}

.DisplayHeaderMenu 
{
	border: solid 1px #000000;
}
.DisplayHeaderMenu td, .DisplayHeaderMenu td b
{
	padding: 3px 5px 3px 5px;
	background-color: #f0f0f0;
	color: #000000;
}

.ReportTable /* also used by my account->review previuos orders */
{
    font-size: inherit;
	border: solid 1px #000000;
}
.ReportTable th, .ReportTable th b
{
	padding: 3px 5px 3px 5px;
	font-weight: bold;
    background-color: #c9c9c9;
    color: #000000;
    border-bottom: solid 1px #000000;
}
.ReportTable td, .ReportTable td b
{
	padding: 3px 5px 0px 5px;
    text-align: left;
	background-color: #f0f0f0;
	color: #000000;
}

.PageNavTable {}
#shopcontent .PageNavTable td, #shopcontent .PageNavTable td b
{
	padding: 3px 5px 3px 5px;
    font-weight: normal;
	color: #333333;
}
#shopcontent .PageNavTable td a
{
	padding: 3px 5px 3px 5px;
}

/* excel downloads */
#excelDownloadMenuContent 
{
    padding: 30px;
    width: 100%;
    text-align: left;
}
#excelDownloadMenuContent table.MenuGroup
{
    margin-left: 0px;
    margin-right: 0px;
    width: 90%;
}
#excelDownloadMenuContent input.excelDLButton
{
    display: inline-block;
    margin: 2px 3px 0px 0px;
    padding: 0px;
    font-weight: bold;
    text-decoration: underline;
    text-align: left;
    overflow: visible;
    color: #666666;
    background: transparent;
    border: none;
    cursor: pointer;
}