/*

STYLESHEET FOR
v1
Last Updated:	2010.11.30
Author: 		Bill Kracke
Author URL: 	http://billkracke.com
Twitter:		@BillKracke 

*/


/* ***  RESET  *** */
	/* html5doctor.com Reset Stylesheet | v1.6.1  | Richard Clark - http://richclarkdesign.com */

	html, body, div, span, object, iframe,
	h1, h2, h3, h4, h5, h6, p, blockquote, pre,
	abbr, address, cite, code,
	del, dfn, em, img, ins, kbd, q, samp,
	small, strong, sub, sup, var,
	b, i,
	dl, dt, dd, ol, ul, li,
	fieldset, form, label, legend,
	table, caption, tbody, tfoot, thead, tr, th, td,
	article, aside, canvas, details, figcaption, figure, 
	footer, header, hgroup, menu, nav, section, summary,
	time, mark, audio, video {
		margin:0;
		padding:0;
		border:0;
		outline:0;
		font-size:100%;
		background:transparent;
	}
	
	html { overflow-y: scroll; }
	
	body { line-height:1; }

	article,aside,details,figcaption,figure,
	footer,header,hgroup,menu,nav,section { display:block; }

	nav ul { list-style:none; }

	blockquote, q { quotes:none; }

	blockquote:before, blockquote:after,
	q:before, q:after { content:''; content:none; }

	a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }

	del { text-decoration: line-through; }

	abbr[title], dfn[title] { border-bottom:1px dotted; cursor:help; }

	table { border-collapse:collapse; border-spacing:0; }

	/* change border colour to suit your needs */
	hr {
		display:block;
		height:1px;
		border:0;   
		border-top:1px solid #cccccc;
		margin:1em 0;
		padding:0;
	}

	input, select { vertical-align:middle; }

	/* ***  END RESET  *** */


/* *** TYPOGRAPHY *** */

/* BASELINE -- 20PX */

body {
	font-family: Calibri,"Trebuchet MS", Arial, sans-serif;
	font-size: 15px;
	line-height: 20px;
	font-weight:normal;
	color: #111;
	background-color: #fff;
	}
h1,h2,h3,h4,h5 {
	font-family: "Arial Black", Arial, sans-serif; 
	font-weight:bold;
	color: #657bb6;
	}

	
p { font-size: 1em; line-height: 1.33333; margin-bottom:1.33333em;}



h1 { font-size: 3.0em; line-height:1.33333; padding: .44444em 0;}
h2, .content h1{ font-size: 2.0em; line-height:1;margin-bottom:0.66667em;  }
h3 { font-size: 1.5em; line-height:1.33333;}
h4 { font-size: 1.2em; line-height: 1.11111;}
input { font-size: .99em; }
small, .small { font-size: 0.8em; line-height:1.25em; }



/* *** BASIC LAYOUT - FLUID *** */
.container {
	background: #fff;
	width: 881px;
	margin: 20px auto;
	}

#header {
	background-color:#657bb6;
	vertical-align:top;
	margin:0;
	display:block;
	border: 3px solid #657BB6;
	border-width: 3px 3px 0;
}
	.page-title {
		color: #eeb21f;
		font-weight:normal;
		font-family: Georgia, Cambria, "Times New Roman", Times, serif;
		text-transform:uppercase;
		letter-spacing: -.025em;
		word-spacing: .25em;
		text-align:center;
		padding: .44444em 0;
		margin-bottom:-.5em;
		padding-top: .15em;
		font-size:3.0em;
		line-height:1.33333;
		}
	.page-title span {
		font-size: 1.15em;
	}
	.tagline {
		color:#fff;
		font-size: 1.4em;
		font-weight:bold;
		display:block;
		text-align:center;
		padding-bottom: 1em;
	}

#main {
	display:block;
	border: 3px solid #657BB6;
	border-width: 0 3px 3px;
	position:relative;
	overflow:hidden;
	width:875px;
	}

.content {
	display:block;
	padding:20px 40px;
	vertical-align:top;
	width:795px;
}	
	
	
.index .content {
	width: 412px;
	float:left; 
	display:block;
	padding:20px 30px;
	vertical-align:top;
}

.sidebar {
	width:400px;
	float:left;
	display:block;
	background-color:#FFF;
	border-left:3px solid #657bb6;
	padding-bottom: 3000px;
	margin-bottom: -3000px;
	}
	.sidebar p {margin: 10px 20px;}
	/*.ie #main {display:block;}
	.ie .index .content, .ie .sidebar {display:inline;zoom:1;}*/
	
#footer {
	padding: 1em 5em 0;
	text-align:center;
	color: #555;
	}

/* *** NAVIGATION *** */
.nav {
	background-color: #657bb6;
}
.nav li {
	list-style:none;
	width:125px;
	height: 80px;
	float:left;
}

.nav a {
	display:block;
	text-align:center;
	font-weight:bold;
	text-decoration:none;
	height:35px;
	background: url('../img/css/menu-bg.png') top center no-repeat;
	color: #fff;
	padding-top:45px;
	text-transform:uppercase;
	font-size:16px;
	line-height:2;
	}
	
.nav a:hover {
	background: url('../img/css/menu-bg-hover.png') top center no-repeat;
}

.nav .lh1 { line-height:.9; }
	


/* *** CONTENT STYLES *** */

.content ol, .content ul {
	margin: 20px 40px;
}
	.quotes li {
		list-style:none;
		margin: 10px 0;
	}
	.ingredients li {
		list-style:none;
		}
.content td {vertical-align:top;}

.content blockquote {
	color: #ae7200;
	font-size: 1.3em;
	font-weight:bold;
	font-style:italic;
	line-height:1.2;
	margin: 0 20px 20px;
	}
	
.button {
	margin: 20px 0;
		-moz-box-shadow: 1px 1px 3px #666; /* FF3.5+ */
		-webkit-box-shadow: 1px 1px 3px #666; /* Saf3.0+, Chrome */
		box-shadow: 1px 1px 3px #666; /* Opera 10.5, IE 9 */
	color:#fff;
	background-color:#556ba6;
	padding: 5px 15px;
		-moz-border-radius: 5px; /* FF1+ */
		-webkit-border-radius: 5px; /* Saf3-4 */
        border-radius: 5px; /* Opera 10.5, IE 9, Saf5, Chrome  */
	text-decoration:none;
	font-weight:bold;
	font-size: 1em;
	position:relative;
	word-spacing: -.1em;
	}


.cookbook .content li {margin:20px 150px 20px 0;}

.product {overflow:hidden; margin-bottom: 20px; border-bottom: 1px solid #eee;zoom:1;}
	
	
	
	
.left { float:left; }
	p.left { text-align:left; float:none;}
	img.left {
		margin: 20px 20px 20px 0;
			-moz-box-shadow: 1px 1px 3px #666; /* FF3.5+ */
			-webkit-box-shadow: 1px 1px 3px #666; /* Saf3.0+, Chrome */
			box-shadow: 1px 1px 3px #666; /* Opera 10.5, IE 9 */
	}
	.product .left {margin: 20px 20px 20px 0;}
		
.right { float: right; }
	p.right { text-align:right; float:none;}
	img.right {
		margin: 20px 0 20px 20px;
		-moz-box-shadow: 1px 1px 3px #666; /* FF3.5+ */
		-webkit-box-shadow: 1px 1px 3px #666; /* Saf3.0+, Chrome */
		box-shadow: 1px 1px 3px #666; /* Opera 10.5, IE 9 */
	}

.top, img.top, .product .top {margin-top:0;}

.bigger {font-size:130%;}
.smaller {font-size:80%;}
	
/* >> The Magnificent CLEARFIX: Updated to prevent margin-collapsing on child elements << j.mp/bestclearfix */
.center {text-align: center;}
.clearfix:before, .clearfix:after {
  content: "\0020"; display: block; height: 0; visibility: hidden;	
} 

.clearfix:after { clear: both; }
/* Fix clearfix: blueprintcss.lighthouseapp.com/projects/15318/tickets/5-extra-margin-padding-bottom-of-page */
.clearfix { zoom: 1; }
