p, ul, li, h1, h2, h3, h4, h5, h6, ol {margin:0px; padding:0px;}
td, th {vertical-align:top; text-align:left;}
.hide {display:none;}
a img {border:none;}


div.hr {
  height: 30px;
  background: url(../images/hr.gif) top left no-repeat;
}
div.hr hr {
  display: none;
} 


body {
	margin:0; padding:0;
	background:#000;
	font:66%/1.6 verdana, arial, helvetica,  sans-serif;
	color:#B2B2B2;
}

#wrapper {
	position:relative;
	width:976px;
	padding:0; margin: 50px auto 0px auto;
}


/* Header area
--------------------------------------- */

#header {
	position:absolute;
	top:0; left:0;
	width:976px; height:94px;  
	margin:0; padding:0; 
	background:url(../images/header.gif) top left no-repeat;
}

#logo {
	position:absolute;
	top:7px; left:24px;
	width:122px; height:48px;  
	margin:0; padding:0; 
	background:url(../images/header.gif) top left no-repeat;
}


#main_nav {
	position: absolute; 
	margin:0; padding:0;
	list-style-type: none;
	width:640px;
	top:24px; left:180px;
	z-index:10;
}

#nav {
	height: 22px;
	width:700px;
	background: url(../images/navigation.gif) no-repeat;
	margin:0; padding:0;
	position:relative;
}
#nav li {
	position: absolute;
	margin: 0; padding: 0;
	list-style: none;
	top: 0;
}
#nav a {
	height: 22px;
	display: block;
	text-indent: -9999px;
	text-decoration: none;
	outline: 0; 
	}
	
#sauces	{left: 0px; width: 100px;}
#recipes	{left: 110px; width: 100px;}
#where	{left: 220px; width: 100px;}
#store	{left: 330px; width: 50px;}
#story	{left: 390px; width: 80px;}
#media	{left: 480px; width: 60px;}
#faq	{left: 550px; width: 60px;}
#contact	{left: 620px; width: 90px;}


#sauces a.active, #sauces a:hover {background:  url(../images/navigation.gif) -0px -21px no-repeat;}
#recipes a.active, #recipes a:hover{background:  url(../images/navigation.gif) -110px -21px no-repeat;}
#where a.active, #where a:hover {background:  url(../images/navigation.gif) -220px -21px no-repeat;}
#store a.active, #store a:hover {background:  url(../images/navigation.gif) -330px -21px no-repeat;}
#story a.active, #story a:hover {background:  url(../images/navigation.gif) -390px -21px no-repeat;}
#media a.active, #media a:hover {background:  url(../images/navigation.gif) -480px -21px no-repeat;}
#faq a.active, #faq a:hover {background:  url(../images/navigation.gif) -550px -21px no-repeat;}
#contact a.active, #contact a:hover {background:  url(../images/navigation.gif) -620px -21px no-repeat;}



/* Main Content area
--------------------------------------- */

#main  {
	position:absolute;
	top:120px;
	left:30px;
	width:946px; 
	margin:0px; padding:0px; 
	z-index:1;
}

.story {background:url(../images/main/story.jpg) top right no-repeat;}
.contact {background:url(../images/main/contact.jpg) top right no-repeat;}
.where {background:url(../images/main/where.jpg) top right no-repeat;}
.faqs {background:url(../images/main/faqs.jpg) top right no-repeat;}

#home_content {
	float:left;
	padding:0 0 0 35px;
	width:825px; 
}

#content {
	float:left;
	padding:0 0 0 35px;
	width:525px; 
}
#content_narrow {
	float:left;
	padding:0 0 10px 35px;
	width:340px; 
}
#content_wide {
	float:left;
	padding:0 0 0px 35px;
	width:570px; 
}
#content_very_wide {
	float:left;
	padding:0 0 0px 35px;
	width:860px; 
}
#col1 {float:left; width:370px; padding:0;}
#col2 {float:left; width:370px; padding:0 0 0 30px;}

#sidebar {
	float:left;
	padding:35px 0 0 0px;
	width:340px; 
}


p {margin:4px 0 10px 0; padding:0; font-size:1em;}
h2 {margin:4px 0 10px 0; padding:0; font-size:1em; color:#FFF;}
h3 {margin:4px 0 2px 0; padding:0; font-size:1em; color:#FFF;}
a {color:#00BFAB;}
a:hover {color:#B2B2B2;}
.border {border:2px solid #4C4C4C;}
.border_slim {border:1px solid #4C4C4C;}

.more_link {text-align:right; padding:5px 0 0 0;}
.more_link a {display:block; width:46px; height:16px; margin:5px 0 0 55px; padding:0; background:url(../images/more.gif) top left no-repeat;}
.more_link a:hover {background:url(../images/more.gif) -0px -16px no-repeat;}

.previous_link {padding:5px 0 0 0;}
.previous_link a {display:block; width:65px; height:16px; margin:5px 0 0 0; padding:0; background:url(../images/previous.gif) top left no-repeat;}
.previous_link a:hover {background:url(../images/previous.gif) -0px -16px no-repeat;}


/* Titles
-------------------------------------------------------*/
#story_title {width:146px; height:18px; padding-bottom:20px; background:url(../images/titles/story.gif) top left no-repeat;}
#recipe_title {width:143px; height:18px; padding-bottom:20px; background:url(../images/titles/recipes.gif) top left no-repeat;}
#contact_title {width:146px; height:18px; padding-bottom:20px; background:url(../images/titles/contact.gif) top left no-repeat;}
#where_title {width:162px; height:18px; padding-bottom:20px; background:url(../images/titles/where.gif) top left no-repeat;}
#faq_title {width:334px; height:18px; padding-bottom:20px; background:url(../images/titles/faq.gif) top left no-repeat;}
#media_title {width:162px; height:18px; padding-bottom:20px; background:url(../images/titles/media.gif) top left no-repeat;}
#praise_title {width:79px; height:18px; padding-bottom:20px; background:url(../images/titles/praise.gif) top left no-repeat;}
#articles_title {width:45px; height:10px; padding-bottom:10px; background:url(../images/titles/articles.gif) top left no-repeat;}
#e-feature_title {width:69px; height:9px; padding-bottom:10px; background:url(../images/titles/features.gif) top left no-repeat;}
#tv_title {width:80px; height:10px; padding-bottom:10px; background:url(../images/titles/tv.gif) top left no-repeat;}
#video_title {width:80px; height:10px; padding-bottom:10px; background:url(../images/titles/video.gif) top left no-repeat;}
#community_title {width:80px; height:10px; padding-bottom:10px; background:url(../images/titles/community.gif) top left no-repeat;}
#photos_title {width:212px; height:18px; padding-bottom:20px; background:url(../images/titles/photos.gif) top left no-repeat;}
#privacy_title {width:166px; height:18px; padding-bottom:20px; background:url(../images/titles/privacy.gif) top left no-repeat;}

#tartare_title {width:419px; height:60px; background:url(../images/titles/tartare.gif) top left no-repeat;}
#ceviche_title {width:419px; height:60px; background:url(../images/titles/ceviche.gif) top left no-repeat;}
#coconut_title {width:419px; height:60px; background:url(../images/titles/coconut.gif) top left no-repeat;}
#fishmongers_title {width:419px; height:60px; background:url(../images/titles/fishmongers.gif) top left no-repeat;}
#lemon_title {width:419px; height:60px; background:url(../images/titles/lemon.gif) top left no-repeat;}
#miso_title {width:419px; height:75px; background:url(../images/titles/miso.gif) top left no-repeat;}
#maple_title {width:419px; height:75px; background:url(../images/titles/maple.gif) top left no-repeat;}
#sesame_title {width:419px; height:60px; background:url(../images/titles/sesame.gif) top left no-repeat;}
#swingin_title {width:419px; height:60px; background:url(../images/titles/swingin.gif) top left no-repeat;}
#thai_title {width:419px; height:60px;  background:url(../images/titles/thai.gif) top left no-repeat;}

/* Rollovers on home page 
---------------------------------------------------------------*/
#rollover {
	float:left;
	width:824px; height:128px; 
	background:url(../images/sauces_rollover.jpg) bottom right no-repeat;
	padding-top:35px;
}
#rollover ul {
	list-style-type:none;
	width:480px; height:125px;
	float:right;
	
}
#rollover ul li  {
	float: left;
	padding:0; margin:0;
	
}
#rollover ul li a {
	display:block; 
	width:45px; height:125px;
	padding:0 1px;
}

/* Sauces
-------------------------------------*/

#sauce_content {
	float:right;
	width: 419px;
	padding:20px 40px 20px 0;
}

#sauce_content p {
	padding:0px 40px 10px 0;
}


.tartare {background:url(../images/sauces/bg_tartare.jpg) 35px bottom  no-repeat;}
.ceviche {background:url(../images/sauces/bg_ceviche.jpg) 35px bottom  no-repeat;}
.swingin {background:url(../images/sauces/bg_swingin.jpg) 35px bottom  no-repeat;}
.maple {background:url(../images/sauces/bg_maple.jpg) 35px bottom  no-repeat;}
.lemon {background:url(../images/sauces/bg_lemon.jpg) 35px bottom  no-repeat;}
.miso {background:url(../images/sauces/bg_miso.jpg) 35px bottom  no-repeat;}
.thai {background:url(../images/sauces/bg_thai.jpg) 35px bottom  no-repeat;}
.coconut {background:url(../images/sauces/bg_coconut.jpg) 35px bottom  no-repeat;}
.sesame {background:url(../images/sauces/bg_sesame.jpg) 35px bottom  no-repeat;}
.fishmongers {background:url(../images/sauces/bg_fishmongers.jpg) 35px bottom  no-repeat;}
.intro {background:url(../images/make-simply.gif) bottom left  no-repeat;}
/* Footer
-------------------------------------------------------*/
#footer {
	clear:both;
	float:left;
	width:946px; 
	background:url(../images/footer_bg.gif) top no-repeat;
	margin:30px 0 0 0; padding:0 0 20px 0;
}
#footer_sauces {
	clear:both;
	float:left;
	width:946px; 
	background:url(../images/footer_bg.gif) top no-repeat;
	margin:0; padding:0 0 20px 0;
}
#footer p, #footer_sauces p {font-size:0.85em; padding:6px 0 0 35px;}
p.left {float:left; width:650px;}
p.right {float:right; width:88px;  margin-right:90px; margin-top:1px;}
p.right a {
	display:block;
	width:88px; height:22px;
	background:url(../images/blog.gif) top left no-repeat;
}
p.right a:hover {
	background:url(../images/blog.gif) bottom left no-repeat;
}

#footer a, #footer_sauces a {color:#B2B2B2; text-decoration:underline; padding:0 6px;}
#footer a:hover, ##footer_sauces a:hover {color:#00BFAB; text-decoration:none;}

/* Tables
----------------------------*/
.where_table {width:520px; padding:8px 0 0 0; color:#00BFAB; border-collapse:collapse; font-size:1em;}
.where_table td {border-bottom:1px solid #5E5E5E; padding:3px 20px 3px 0;}

.media_table td {padding: 0 13px 13px 0; font-size:0.9em;}
.where_table th {text-transform: uppercase; color:#FFF; padding:3px 20px 3px 0;}
.where_table th.title {border-top:1px solid #5E5E5E;}
.media_table td a {color:#878787;}

.downloads_table  {width:570px; border-collapse:collapse;}
.downloads_table td {padding: 0 13px 6px 0; width:101px;}
.downloads_table a {color:#878787;}




/* Recipe Table
----------------------------*/
#fancy_recipe_table {border-collapse:collapse; padding:0; margin:10px 0; }
#fancy_recipe_table td.odd, #fancy_recipe_table td.odd_last  {background:#1F1F1F; z-index:100;}

#fancy_recipe_table td.odd_blue {background:#1F1F1F url(../images/sauces/blue_odd.gif) no-repeat;}
#fancy_recipe_table td.even_blue {background:url(../images/sauces/blue.gif) no-repeat;}

#fancy_recipe_table td.odd_bright_blue {background:#1F1F1F url(../images/sauces/bright_blue_odd.gif) no-repeat;}
#fancy_recipe_table td.even_bright_blue {background:url(../images/sauces/bright_blue.gif) no-repeat;}

#fancy_recipe_table td.odd_orange {background:#1F1F1F url(../images/sauces/orange_odd.gif) no-repeat;}
#fancy_recipe_table td.even_orange {background:url(../images/sauces/orange.gif) no-repeat;}

#fancy_recipe_table td.odd_red {background:#1F1F1F url(../images/sauces/red_odd.gif) no-repeat;}
#fancy_recipe_table td.even_red {background:url(../images/sauces/red.gif) no-repeat;}

#fancy_recipe_table td.odd_tangerine {background:#1F1F1F url(../images/sauces/tangerine_odd.gif) no-repeat;}
#fancy_recipe_table td.even_tangerine {background:url(../images/sauces/tangerine.gif) no-repeat;}

#fancy_recipe_table td.odd_yellow {background:#1F1F1F url(../images/sauces/yellow_odd.gif) no-repeat;}
#fancy_recipe_table td.even_yellow {background:url(../images/sauces/yellow.gif) no-repeat;}

#fancy_recipe_table td.odd_green {background:#1F1F1F url(../images/sauces/lime_odd.gif) no-repeat;}
#fancy_recipe_table td.even_green {background:url(../images/sauces/lime.gif) no-repeat;}


#fancy_recipe_table td {border-bottom:1px solid #383838;}
#fancy_recipe_table td.last, #fancy_recipe_table td.odd_last, #fancy_recipe_table td.even_last  {border-bottom:0px solid #383838;}

#fancy_recipe_table td.title {border-bottom:0px solid #383838;}
#fancy_recipe_table td.odd, #fancy_recipe_table td.even  {width:62px;}

