body {
    margin: 0px 0px;
    /*text-align: center;*/
    background-color: #fff; /* Change background color here */
}

body, p, div, th, td, p, input, select, textarea {
        font: 10px Verdana, Arial, Helvetica, Sans-serif; 
        color: #000;
}

#layout_frame { /* Centered, bordered, fixed width layout table */
    width: 766px;
    border: solid 1px #666;
    background-color: #d0ddec;
}

#left_column { /* the left (nav) column table cell 
    padding: 4px;*/
    background-color: #d0ddec;
}

#right_column { /* the right (content) column table cell */
    padding: 4px 10px;
    background-color: #d0ddec;
}

/*************** ANCHORS (LINKS)    ***********/

a:link      {color: #000; text-decoration: none;}
a:visited   {color: #000; text-decoration: none;}
a:hover     {color: #000; text-decoration: underline;}
a:active    {color: #000; text-decoration: none;}

/*************** GENERAL HEADINGS   ***********/

h1 {font-size: 15px;}
h2 {font-size: 13px;}
h3 {font-size: 12px;}

hr {color: #ddd; height: 1px;}

/**
 * HEADER: The rectangle usually containing top 
 * navigation bar, search box, or other elements
 * below the logo
 */

.HeadBox {
    background-color: #c10006;
    font: bold 11px tahoma;
}
.HeadBox td a {
    color: #fff; 
    font-weight: bold;
}
.SearchButton {
    color: #333; 
    font: bold 11px tahoma;
    height: 20px;
}
.NumberOfArticles {
    color: #000; 
    font: bold 10px tahoma;
}
.TopLabel {
    color: #fff; 
    font: bold 11px tahoma;
}
#SpeedBarHeaderCell {
    padding: 0px;
    background-color: #666;
}
#ContactInfoHeaderCell {
    padding: 3px 10px;
    font-weight: bold;
}
#LogoHeaderCell {
    padding: 0px;
}

/**
 * SPEEDBAR MENU: 
 * /customer/top_menu.tpl
 *
 * This is the top link bar
 */

ul.SpeedBar {
    margin: 0px 0px 0px 0px;
    padding: 4px 10px;
    display: block;
    list-style-type: none;
    white-space: nowrap;
}
ul.SpeedBar li {
    padding: 0px;
    float: right;
    white-space: nowrap;
}
ul.SpeedBar li a {
    padding: 4px 10px;
    display: block;
    background-color: #666;
    color: #fff;
    font: bold 11px tahoma;
    text-decoration: none;
    text-align: center;
}
ul.SpeedBar li a.Bordered {
    border-right: solid 2px #fff;
}
ul.SpeedBar li a:hover {
    color: yellow;
    text-decoration: none;
}
ul.SpeedBar li a:active, ul.SpeedBar li a:visited {
    color: #fff;
    text-decoration: none;
}

/**
 * HORIZONTAL MENU: 
 * Yet to find where this is used...
 */

.HorizMenuItems {
    font: bold 11px arial;
    color: #fff; text-decoration: none;
    padding-right: 10px;
    padding-left: 10px;
    border-left: solid 2px #999;
}
.HorizMenuItemsFirst {
    border-left: none;
}
.HorizMenuItems:link {
        COLOR: #fff; TEXT-DECORATION: none;
}
.HorizMenuItems:visited {
        COLOR: #fff; TEXT-DECORATION: none;
}
.HorizMenuItems:hover {
        COLOR: #fff; TEXT-DECORATION: underline;
}
.HorizMenuItems:active  {
        COLOR: #fff; TEXT-DECORATION: none;
}

/**
 * VERTICAL MENU: 
 * Left column boxes and lists (all TABLE based)
 */

.VertMenu { /* Surrounding Table Container */
    width: 195px;
    margin: 0px 0px 0px 0px; /* Space on bottom */
}
.VertMenuBox {
    background-color: #fff; 
}
.VertMenuBorder {
    background-color: #b2b2b3;
}
.VertMenuTitle {
    background-color: #e5ebefe; 
    color: #fff; 
    font: bold 11px Tahoma;
}
.VertMenuItems { /* This is an anchor tag */
    color: #373b3d; 
    text-decoration: none;
}
.VertMenuItems:link {
    color: #373b3d;
}
.VertMenuItems:visited {
    color: #373b3d;
}
.VertMenuItems:hover {
    color: #000;
}
.VertMenuItems:active  {
    color: #373b3d;
}
.VertMenuHr {
    color: #b2b2b3;
}
.CategoriesList { /* Vertical Menu Special to the List Items */
    font-size: 10px;
    display: block;
    margin: 2px 0px;
}
ol.MenuOrderedList {
    margin: 0px; 
    padding-left: 20px; 
    font-weight: bold;
}
ol.MenuOrderedList li {
    margin-bottom: 6px;
    border-bottom: dotted 1px #999;
    padding-bottom: 3px;
}
ol.MenuOrderedList li a {
    font-weight: normal;
}

/**
 * DIALOG: 
 * All "dialog boxes" in main content area
 * of application.
 * 
 * These are all TABLE-BASE LAYOUT!, so
 * see template in /{skin}/dialog.tpl for
 * more details on presentation aspects, 
 * including where to do background images
 */
 
.Dialog { /* Surrounding Table Container */
    width: 99.9%; /* IE fix */
    margin: 4px 0px; /* Space on top and bottom */
}
.DialogBox {
    background-color: #fff;
}
.DialogBorder {
    background-color: #999;
}
.DialogTitle {
    font: bold 11px tahoma; 
    color: #fff
}

/**
 * PRODUCT ELEMENTS: 
 * These classes appear in the product 
 * list view and product detail view, as
 * well as being sprinkled throughout some
 * parts of the shopping cart...
 */
.ProductRepeater { 
    /* Repeating Div on non-column 
        customer/main/products.tpl
    */
    margin: 10px 0px;
    padding: 10px 0px;
    text-align: center;
    border-bottom: dotted 1px #ccc;
}
.ProductTitle {
    color: #666; 
    font: bold 14px arial, tahoma; 
    margin-bottom: 6px;
}
.ProductTitleColumns {
    /* 
        Same as Product Title, but in 
        multi-column layout areas. 
    */
    color: #333; 
    font: bold 11px tahoma, arial, sans-serif; 
    margin-bottom: 10px;
    text-transform: uppercase;
    display: block;
}
.ProductDesc {
    color: #666; 
    font: 11px verdana, tahoma, Sans-serif;
    margin: 4px 0px;
}
.ProductDetailsTitle { 
    /* Actually, this is the title "bar" 
        with word "Details" in it 
        h1 tag */
    color: #666; 
    font: bold 11px tahoma;
    margin: 8px 0px;
}
.ProductDetailsTitlePrice {
    color: #cc0033; 
    font: bold 11px tahoma;
}
.ProductDetailsTitleRetailPrice {
    color: #000; 
    font: bold 11px tahoma;
}
.ProductDetails {
    color: #000;
}
.ProductPriceTitle {
    color: #000; 
    font: bold 11px tahoma;
}
.ProductPriceConverting {
    color: #000; 
    font: bold 11px tahoma;
}
.ProductPrice {
    color: #cc0033; 
    font: bold 11px tahoma;
}
.ProductPriceSmall {
    color: #cc0033; 
    font: bold 10px tahoma;
}
.MarketPrice {
    font-size: 11px;
}
.ItemsList {
    color: #006d2c; 
    font: bold 100% arial, tahoma ;
}

/**
 * BOTTOM: 
 * This is the rectangle the creates the footer of
 * the pages.
 */
.Bottom {
    background-color: #666; 
    padding: 4px;
}
.Bottom table td {
    color: #fff; 
    text-decoration: none; 
    font: bold 10px tahoma;
}
.Bottom a {
    color: #fff; 
    text-decoration: none; 
    font: bold 10px tahoma;
}

/**
 * CartShippingBox: 
 * This is the rectangle the surrounds shipping
 * options in the checkout process
 */
.CartShippingBox {
    background-color: #fcfff0;
    border: dotted 1px #999;
    padding: 4px;
    margin-bottom: 10px;
}
.CartShippingBoxSelected {
    background-color: #f0f8ff;
    color: #036;
    font-weight: bold;
    border-top: solid 1px #036;
    border-bottom: solid 1px #036;
}

/**
 * OrderConfirmationBox: 
 * This is the rectangle above the invoice
 * printout when order is submitted
 */
.OrderConfirmationBox {
    background-color: #fcfff0;
    margin-bottom: 10px;
    padding: 10px 20px;
    border: dotted 1px #666;
}
.OrderConfirmationBox p {
    color: #c30;
    font: 12px arial, tahoma, verdana, sans-serif;
}
.OrderConfirmationBox p.top {
    color: #c30;
    font: bold 14px arial, tahoma, verdana, sans-serif;
}

/**
 * BUTTON: 
 * This is the format of all non-graphical
 * buttons with text in them.  This css
 * class should be used in conjunction
 * with images bt1.gif and bt2.gif to create
 * the effect of a button.
 */
.Button {
    font: bold 11px tahoma;
    background-color: #c03;
    color: #fff;
    text-decoration: none;
}

/**
 * NAVIGATION PATH: 
 * This is the DIV that contains the location
 * links.
 */
.NavigationPath {
    text-align: left;
    margin: 2px 0px 6px 0px;
    padding: 0px 0px 5px 0px;
    color: #000; 
    font: 11px tahoma;
    border-bottom: dotted 1px #666;
}

.NavigationPath a {
    color: #666; 
    font: 11px tahoma;
    text-decoration: underline;
}

/**
 * NavigationPages: 
 * /customer/main/navigation.tpl
 *
 * This is little array of page images
 * used for paging between result sets
 *
 * The entire process of this has been
 * taken to list based instead of table
 * based layout
 */
div.NavigationPages {
    margin: 2px 0px;
    padding: 2px 10px;
    display: block;
    height: 14px;
    font: bold 11px tahoma, verdana, sans-serif;
    text-align: right;
    background-color: #f7f7f7;
    border: dotted 1px #999;
}
div.NavigationPages span {
    width: 20px;
    height: 14px;
    clear: none;
    padding: 6px;
    white-space: nowrap;
}
div.NavigationPages span a {
    color: #666;
    font: bold 11px tahoma, verdana, sans-serif;
    text-decoration: none;
}
div.NavigationPages span a img {
    border: none;
}
div.NavigationPages span a:hover {
    color: #999;
    text-decoration: none;
}

/**
 * SearchBy: 
 * /main/search_sort_by.tpl
 *
 * Div of sort elements
 */
div.SearchBy {
    margin: 2px 0px;
    padding: 2px 10px;
    display: block;
    height: 14px;
    font: bold 11px tahoma, verdana, sans-serif;
    text-align: left;
    background-color: #f7f7c7;
    border: dotted 1px #999;
}
div.SearchBy span {
    width: 20px;
    height: 14px;
    clear: none;
    padding: 6px;
    white-space: nowrap;
}
div.SearchBy span a {
    color: #666;
    font: bold 11px tahoma, verdana, sans-serif;
    text-decoration: underline;
}
div.SearchBy span a img {
    border: none;
}
 
/*************** MISCELLANEOUS ELEMENTS ***********/
.StandoutBox {
    padding: 10px 40px;
    border: dotted 1px #666;
    background-color: #ffc;
    color: #c30;
}
.RegButton {
    color: #333; 
    font: bold 11px tahoma;
    height: 20px;
}
.SmallNote {
    color: #888; 
    font: 9px Arial, Verdana, Helvetica, Sans-serif;
    text-decoration: none
}
.SmallNote:hover {
    text-decoration: none
}
.AnonCheckoutNote {
    padding: 10px 40px;
    border: dotted 1px #666;
    background-color: #ffc;
    color: #c30;
}
.Text {
    color: #000;
}
.AdminSmallMessage {
    color: #006d2c;
}
.AdminTitle {
    color: #006d2c; 
    font: bold 12px;
}
.Line {
    background-color: #006d2c;
}
.LineUnder {
    border-bottom: solid 1px #006d2c;
}
.FormButton {
    color: #081589; 
    font: bold 10px tahoma;
}
.CustomerMessage {
    COLOR: #006D2C; FONT: bold 10px;
}
.ErrorMessage {
    COLOR: #006D2C; FONT: bold 10px;
}
.Star {
    COLOR: #FF0000;
}
.HighLight {
        BACKGROUND-COLOR: #FFFFCC;
}
.SaveMoneyLabel {
    COLOR: #FFFFFF;
}
.TableHead {
    background-color: #ddd;
    height: 25px;
}
.TableHead th {
    font: bold 11px tahoma;
    color: #333;
    padding: 2px 5px;
    border-top: solid 1px #666;
    border-bottom: solid 1px #000;
}

.alternate {
    background-color: #f7f7f7;
}

.Tab {
        BACKGROUND-COLOR: #D6D7D9;
        FONT-WEIGHT: bold;
        TEXT-TRANSFORM: uppercase;
}
.CatMenuItemOff 
{
    BACKGROUND-COLOR: transparent;  /* like "VertMenuBox" */
    BORDER-RIGHT: none;             /* like "VertMenuBox" */
    BORDER-TOP: none;               /* like "VertMenuBox" */
    BORDER-LEFT: none;              /* like "VertMenuBox" */
    BORDER-BOTTOM: none;            /* like "VertMenuBox" */
    MARGIN-BOTTOM: 1px;
    MARGIN-TOP: 1px;
    MARGIN-LEFT: 1px; 
    MARGIN-RIGHT: 2px;
    CURSOR: hand;
}
.CatMenuItemOffExp
{
    BACKGROUND-COLOR: transparent;  /* like "VertMenuBox" */
    BORDER-RIGHT: none;             /* like "VertMenuBorder" */
    BORDER-TOP: none;               /* like "VertMenuBorder" */
    BORDER-LEFT: none;              /* like "VertMenuBorder" */
    BORDER-BOTTOM: none;            /* like "VertMenuBorder" */
    MARGIN-BOTTOM: 1px;
    MARGIN-TOP: 1px;
    MARGIN-LEFT: 1px;
    MARGIN-RIGHT: 2px;  
    CURSOR: hand;
}
.CatMenuItemOn 
{
    BACKGROUND-COLOR: #081589;              /* like "VertMenuTitle" */
    BORDER-RIGHT: #081589 1px solid;        /* like "VertMenuTitle" */
    BORDER-TOP: #081589 1px solid;          /* like "VertMenuTitle" */
    BORDER-LEFT: #081589 1px solid;         /* like "VertMenuTitle" */
    BORDER-BOTTOM: #081589 1px solid;       /* like "VertMenuTitle" */
    MARGIN-LEFT: 1px; 
    MARGIN-RIGHT: 2px; 
    CURSOR: hand;
}
.CatSubMenu
{
    BACKGROUND-COLOR: #D6D7D9;              /* like "VertMenuBox" */
    BORDER-RIGHT: #68C1FF 1px solid;        /* like "VertMenuBorder" */
    BORDER-TOP: #68C1FF 1px solid;          /* like "VertMenuBorder" */
    BORDER-LEFT: #68C1FF 1px solid;         /* like "VertMenuBorder" */
    BORDER-BOTTOM: #68C1FF 1px solid;       /* like "VertMenuBorder" */
    MARGIN-LEFT: 1px; 
    MARGIN-RIGHT: 2px; 
}
.CatMenuItem
{
    FONT-SIZE: 12px;
    FONT-FAMILY: Arial; 
    CURSOR: hand;
}
.CatMenuItem:link
{
    COLOR: #000;                         /* like "VertMenuItems" */
}
.CatMenuItem:visited
{
    COLOR: #000;                         /* like "VertMenuItems" */
}
.CatMenuItem:hover
{
    COLOR: #666;                         /* like "VertMenuTitle" */
}
.CatMenuItem:active
{
    COLOR: #000;                         /* like "VertMenuItems" */
}
.NavDialogTitle {
    font-size: 11px;
    font-weight: bold;
    color: #330000;
}   
.NavDialogBorder {
    background-color: #D6D7D9;
}
.NavDialogBox {
    background-color: #ffffff;
}
.SubHeader2 {
    COLOR: #666666;
    font-size: 11px;
    FONT-WEIGHT: bold;
}
.SubHeader2Line {
    BACKGROUND-COLOR: #CCCCCC;
}
.PopupHelpLink {
    FONT-SIZE: 9px;
    COLOR: #330000;
    TEXT-DECORATION: none;
}