/* $Id: main.css,v 1.15 2005/02/05 06:20:55 christinaw Exp $ */

/* Merutea palette:
    #d0ddb9     watermelon (pale green for background)
    #e9f8cf     bright pale green (suggestion table background)
    #669966     green (hovers)
    #336633     deep green (heads)
    #cccccc     very light grey (options)
    #999999     light grey (borders)
    #777777     medium light grey (text)
    #666666     grey (text)
    #333333     dark grey
    #502441     deep grape (for heads)
    #CC6600     orange (foreign currencies)
    #ffffff     white
*/

/* First, the general text styling. */

body {
    background:#d0ddb9 url(/images/m_bkgda.gif) no-repeat fixed;
    margin:0;
    color:#666666;
    line-height:15px;
    text-align:center;
    font:x-small/11px Verdana, Arial, Sans-serif;
    /* Commented backslash hack for IE Mac, voice-family hack for IE PC, html for 2.0 standard. */
    voice-family: "\"}\""; voice-family:inherit;
    font-size:small;
}
html>body { font-size:small; }

h1, h2, h3, h4 { color: #502441; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; }
h1, h2, h5, h6 { padding: 10px 0px 0px 0px; }

h1 { font-size: 30px; }

h2 {
	font-size: 24px;
	line-height:24px;
}

h3 { font-size: 14px; }
h4 { font-size: 11px; }

h5, h6 { font-size: 18px; }	
h5 { color: #336633; }
h6 { color: #333333; }
	
#skuline {
	font-size: 11px;
	line-height:11px;
	text-align:left;
	color: #666666;
	font-weight: normal;
	text-transform: uppercase;
	padding: 10px 0px 0px 20px;
	margin-bottom: -10px;
}

p { font:12px Verdana, Arial, Helvetica, sans-serif; line-height: 15px; }

p,h1,h2,h3,h4,h5,h6 { margin:10px 10px 0px 20px; text-align:left; }
table { margin-left: 20px; }
td { font: 10px Arial, Helvetica, sans-serif; }

.bigexclusive { float:left; padding-right:10px; padding-bottom:10px; }
.dk { color:#333333; }
.blurb { font-size:12px; color: #336633; line-height: 15px; }
.copyright {text-align:center; }
.center {text-align:center; margin-left: 0px; }
.sidebar {color:#333333; font-size:10px; text-align:right; padding-right:10px; }
.pullquote { font-size:12px; color:#669966; line-height:18px; }
	
a:link { color:#666666; text-decoration:underline; }
a:visited { color:#333333; }
a:hover { color:#669966; text-decoration:none; }
/* a:active { color:#333333; } */

a.crumb:link { color:#669966; text-decoration:underline; }
a.crumb:visited { color:#336633; }
a.crumb:hover { color:#669966; text-decoration:none; }
/* a.crumb:active { color:#333333; } */


/* This is the outside container that centers everything, except for the text-align in
the body tag above that centers for IE5PC */

#containMe {
	position: relative;
	margin: 0 auto;
	width: 780px;
	text-align:center;
}

/* These are the main content divs for the 3col welcome and a 2col interior page 
with a left-nested element. */

#mainleft, #mainleftsmall, 
#maincenter, 
#mainright,
#main { padding:0px; float:left; }
#mainleft, #mainright { width:200px; }
#mainleftsmall {
	width:135px;
	margin-left:10px;
}
#maincenter { width: 380px; }
#main {
	width: 570px;
	border-left:1px solid #666666;
}
#main #nested, #main .nested {
	text-align:left;
	float:left;
	width:135px;
	margin: 0px 10px 10px 0px;
	padding-right:20px;	
}

#maincenter p { width:350px; }
#mainright #login { border:1px solid #336633; }
#login a { font-size:9px; }
#login a:link { text-decoration:none; }
#login a:hover{ color:#ffffff; text-decoration:underline; }

/* The first three IDs are for the itemDetail page.
The last two are for main content with a nested float. */

#productleft {
	width:200px;
	padding:0px;
	float:left; 
	}
#productcenter {
   	width: 168px;
	padding:0px;
	float:left;
	/* border-left:1px solid #666666; */
	}
#productright {
	width:402px;
	padding:0px;
	float:left;
	}

/* These are the classes for the elements of the item tables. */

.title { 
	color:#502441; 
	margin-left: 10px;
	}

.skumain { margin-left:10px; color:#666666; }

.flags { 
	margin:-4px 0px 0px 0px;
	float:right;
	width:18px;	
	}
	
.detailtitle {
	color: #666666; 
	font-weight:bold;
	margin-left:5px;
	font-size:11px;
	}
	
.weight {
	color: #666666; 
	font-weight:bold;
	margin-left:200px;
	}
	
.price {
	color: #666666; 
	font-weight:bold;
	margin-left:25px;
	}
	
.priceforeign { 
	color: #666666; 
	font-weight:bold; 
	margin-left:25px;
	font-size:11px; 
	color: #CC6600;
	}

.currencytag { color:#CC6600; }

/* These are the item tables that use the same elements for each build, the
exception being the title-only tables, which won't nest an 'exclusive' at the moment. */

#itemlist2, .itemlist2, .add_to_cart {
	margin:0px 0px 0px 20px;
	padding:4px 0px 5px 0px;
	border-top: 1px solid #999999;
	border-left: 1px solid #999999;
	border-right:1px solid #999999;
	background-color:#ffffff;
	text-align:left;
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	font-weight:bold;
}

#itemlist2 a:link, .itemlist2 a:link { color: #502441; text-decoration:none; }
#itemlist2 a:hover, .itemlist2 a:hover { text-decoration: underline; }
#itemlist2 a:visited, .itemlist2 a:visited {text-decoration: none; }

#itemlist2 .detailtitle a:link, .itemlist2 .detailtitle a:link { color: #666666; text-decoration: none; }
#itemlist2 .detailtitle a:hover, .itemlist2 .detailtitle a:hover { color: #669966; text-decoration: underline; }
	
#itemlist2 .description, .itemlist2 .description { margin: 5px 50px 0px 10px; font-family:Verdana, Arial, Helvetica, sans-serif; color: #666666; }
#itemlist2 .description a:link, .itemlist2 .description a:link { color: #669966; text-decoration: none; font-weight:bold; font-size:9px; }
#itemlist2 .description a:hover, .itemlist2 .description a:hover { color: #669966; text-decoration: underline; font-weight:bold; font-size:9px; }
#itemlist2 .description a:visited, .itemlist2 .description a:visited { color: #669966; text-decoration: underline; font-weight:bold; font-size:9px; }

.itemlist2 .description .skumain, #productright p .skumain { 
	margin-left:0px;
	font-size:10px;
	font-weight:bold;
    color:#777777;
}

#itemendshim { border-top:1px solid #999999; margin: 0px 0px 0px 20px; }

/*Styling for the Constant Contact emailer and Brewing Instructions
on the itemDetail pages. */

#magnifier {
	margin: 0px 0px 0px 20px;
	}
	
#embiggen {
	margin: 0px 0px 0px 20px;
	padding-bottom:2px;
	padding-top: 2px;
	}
#embiggen p { 
	margin: 0px 0px 0px 5px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	font-weight:bold;
	color: #669966;
	 }
	 	
#cc_options, 
.cc_options {
	margin: 0px 0px 0px 20px;
	border-bottom: 1px solid #999999;
	border-left: 1px solid #999999;
	border-right:1px solid #999999;
	background-color:#502441;
	padding-bottom:2px;
	padding-top: 2px;
	}
#cc_options a:link,
.cc_options a:link { color: #cccccc; text-decoration:none; margin-left:2px; }
#cc_options a:hover,
.cc_options a:hover { color:#cccccc; text-decoration: underline; }
#cc_options a:visited,
.cc_options a:visited {color:#cccccc; text-decoration: none; }
#cc_options p,
.cc_options p { 
	margin: 0px 0px 0px 5px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:10px;
	font-weight:bold;
	color:#cccccc;
	 }

#jump_menu,#sort_menu,#search_menu,#news_date_menu { 
	margin-top:10px;
	font-size: 10px; 
	text-align:left; 
 	margin-left: 0px; 
	voice-family: "\"}\"";
	voice-family: inherit;
	margin-left:20px;
	}
	
/*Styles for suggestion table include */

.q{
	color:#ffffff;
	font: 10px Verdana, Arial, Helvetica, sans-serif;
	padding:4px;
	margin-left: 10px;
	border-top:1px solid #666666;
	border-left: 1px solid #666666; 
	border-right:1px solid #666666; 
	background-color:#502441;
	}
.a {
	font: 10px Verdana, Arial, Helvetica, sans-serif;
	padding:4px; 
	margin-left:10px;
	border-top:1px solid #666666; 
	border-right:1px solid #666666; 
	background-color:#e9f8cf;
	}
#divider, .divider { border-top: 1px solid #666666; }