body {
	margin: 0 auto;
	text-align: left;
	background-color: #ECF3FB; /* Change background color here */
	background-image: url(images/background.jpg);
	background-repeat: repeat-x;
}

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: 780px;
	background-color: #fff;
	border: solid 0px #0033CC;
}

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

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

/*************** 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: #ffffFF;
	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;
}
#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: 0px 0px;
	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: #6666FF;
	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: 180px; /* Space on bottom */
	margin-top: 5px;
	margin-right: 0px;
	margin-bottom: 15px;
	margin-left: 0px;
}
.VertMenuBox {
	background-color: #DCE8F5; 
}
.VertMenuBorder {
	background-color: #DCE8F5;
}
.VertMenuTitle {
	background-color: #e5ebefe; 
	color: #b4151a; 
	font: bold 12px 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: 11px;
	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: 100%; /* IE fix */
	margin: 4px 0px; /* Space on top and bottom */
	color: #336699;
}
.DialogBox {
	background-color: #ffffff;
	padding-right: 5px;
	padding-left: 5px;
}
.DialogBorder {
	background-color: #ffffff;
}
.DialogTitle {
	font: bold 14px tahoma;
	color: #336699;
	padding-left: 18px;
}

/**
 * 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: #566F85; 
	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: 13px 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 {
	padding: 2px 10px;
	display: block;
	height: 14px;
	font: bold 11px tahoma, verdana, sans-serif;
	text-align: right;
	background-color: #efefef;
	border: dotted 1px #999;
	margin-top: 2px;
	margin-right: 2px;
	margin-bottom: 2px;
}
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 {
	padding: 2px 10px;
	display: block;
	height: 14px;
	color: #000;
	font: bold 11px tahoma, verdana, sans-serif;
	text-align: left;
	background-color: #efefef;
	border: dotted 1px #999;
	margin-top: 2px;
	margin-right: 2px;
	margin-bottom: 2px;
}
div.SearchBy span {
	width: 20px;
	height: 14px;
	clear: none;
	padding: 6px;
	white-space: nowrap;
}
div.SearchBy span a {
	color: #0000;
	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: #336699; 
	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 #566F85;
    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: #DCE8F5; 
}
.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;
}

.chromestyle{
	width: 100%;
	font-weight: normal;
	color: #FFE391;
	font-size: 11px;
	text-transform: uppercase;
	background-position: center top;
	padding-top: 0px;
	background-image: url(images/GWRC_21b.jpg);
	height: 38px;
	background-repeat: no-repeat;
}

.chromestyle:after{ /*Add margin between menu and rest of content in Firefox*/
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

.chromestyle ul{
	border: thin none #BBB;
	width: 100%;
	background: repeat-x center center;
	margin: 0;
	text-align: center;
	vertical-align: middle;
	line-height: 21px;
	padding-top: 9px;
	padding-right: 0;
	padding-bottom: 0px;
	padding-left: 0px;
}

.chromestyle ul li{
	display: inline;
}

.chromestyle ul li a{
color: #FFE391;
padding: 4px 7px;
margin: 0;
text-decoration: none;
border-right: 0px solid #DADADA;
}

.chromestyle ul li a:hover{
background: url(../newtide_02.jpg) repeat-x center center; /*THEME CHANGE HERE*/
}

.chromestyle ul li a[rel]:after{ /*HTML to indicate drop down link*/
content: "";
/*content: " " url(downimage.gif); /*uncomment this line to use an image instead*/
}


/* ######### Style for Drop Down Menu ######### */

.dropmenudiv{
	position:absolute;
	font:normal 11px/16px Verdana;
	z-index:100;
	width: 200px;
	visibility: hidden;





filter: progid:DXImageTransform.Microsoft.Shadow(color=#CACACA,direction=135,strength=4); /*Add Shadow in IE. Remove if desired*/
	border-top: 1px none #FFFFFF;
	border-right: 1px none #FFFFFF;
	border-bottom: 0 none #FFFFFF;
	border-left: 1px none #FFFFFF;
	background-image: url(../images/ddbg3b.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	padding-bottom: 12px;
}


.dropmenudiv a{
	width: auto;
	display: block;
	text-indent: 10px;
	border-bottom: 0px solid #F3F2F2;
	padding: 2px 0;
	text-decoration: none;
	font-weight: normal;
	color: #FFE391;
	top: 5px;
}

* html .dropmenudiv a{ /*IE only hack*/
width: 100%;
}

.dropmenudiv a:hover{
	color: #FFFFFF;
}