/*-- generic styles to 'zero out' display behaviors of generic elements --*/
body {
	color:#231f20;
	font-family: Georgia, serif; font-size: 11px; line-height:18px;
}
img {
	padding:0px; margin:0px; border:none;
	/* 'font' affects alt text displayed before picture loades */
	font-family: Arial, sans-serif; font-size: 9px; color:#939598;
}
div {
	padding:0px; margin:0px; border:none;
	position:relative; top:0px; left:0px; /*line-height:0px;*/
}

/*-- base and main positions used to center content --*/
#base{
	position:absolute; top:0px; left:50%; z-index:1;
}
#main {
	position:absolute; top:0px; left:-350px;
	width:700px; z-index:1; color:#231f20; 
}

	/*-- header contains logo and primary navigation --*/
	#header {
		position:absolute; top:0px; left:0px;
		width:700px; z-index:10;
	}
		#logoContainer {
			text-align:center; height:50px; width:700px;
			border-bottom: 1px solid #939598;		
		}
		#logo {
			padding: 24px 0px 0px 0px; 
		}
		
/*-- NAVIGATION STYLES: BEGIN --*/
	.navLinks a {
		font-size: 9px; line-height:13px;
		font-family: Arial, sans-serif;
		color:#939598; text-decoration:none;
	}
	.navLinks .current {
		font-size: 9px; line-height:13px;
		font-family: Arial, sans-serif;
		color:#d2232a; text-decoration:none;
	}
	.navLinks a:hover {
		color:#231f20; 
	}
	
	#nav {
		font-size: 9px; text-transform:uppercase; line-height:16px;
		font-family: Arial, sans-serif;
		text-align:center; letter-spacing: 0px; 
		z-index:10; padding-top:6px;
	}
	#nav a, #nav .current {
		margin: 0px 7px;
	}

	/*-- secondary navigation ( note: while 2nd nav overlays left column, it is NOT nested inside that column ) --*/
	#navSubContainer {
		position:absolute; top:95px; left:45px; z-index:10;
		background-color:#FFFFFF;
		background: url(../images/overlay.png);
		background-repeat:repeat;	
			/*	IE 6 needs this fix to show semi-transparent pngs;
				however, it also causes IE 7 to prompt you as to whether
				or not to allow scripted behaviors ... I chose to let the
				background be opaque in IE 6, which has fewer and fewer users.
				
			behavior: url(../styles/iepngfix.htc);	
			*/		
	}			
	#navSub {
		font-size: 9px; text-transform:uppercase; line-height:16px;
		padding: 8px 12px; letter-spacing:1px;
	}
	#navSub a, #navSub .current {
		display:block;
	}	
	
	/*-- tertiary navigation ( note: while 3rd nav overlays right column, it is NOT nested inside that column )  --*/
	#navSubSub {
		position:absolute; top:506px; left:380px; z-index:10; width:330px; text-align:center;
		font-size: 9px; letter-spacing:1px; line-height:15px; padding-top: 2px;
	}
	#navSubSub a, #navSubSub .current {
		margin: 6px 8px;
	}
	
	a.current, .current {
		color:#d2232a;
	}
	
/*-- END: NAVIGATION STYLES --*/


	/*-- grappos --*/
	
	#grappos {
		position:absolute; top:95px; /* left:0px;
		width:355px; height:460px; z-index:1; overflow:hidden; */
	}

	/*-- left column contains images --*/			
	#mainLeftColumn {
		position:absolute; top:95px; left:0px;
		width:355px; height:460px; z-index:1; overflow:hidden;
	}

		#imageContainer {
		}


	/*-- right column contains content --*/		
	#mainRightColumn {
		position:absolute; top:120px; left:380px;
		width:330px; height: 380px; overflow:auto;
		border-bottom: 1px solid #939598; z-index:1;
	}
		#textContainer {
			width:260px; position:relative; left:28px; color:#231f20;
			font-family: Georgia, serif; font-size: 11px; line-height:18px;
			/*border: 1px solid #939598; */
		}
			/*-- links within text area  --*/
			#textContainer a {
				text-decoration:none;/*text-decoration:underline;*/
				border-bottom: 1px solid #939598;
				color:#939598;
			}		
			#textContainer a:hover {
				border-bottom: 1px solid #ffffff;
				/*text-decoration:none;*/
				color:#231f20;
			}		
			
			/*-- styles for markup used within text area  --*/
			h1 {
				font-size: 22px; letter-spacing:1px; line-height:26px; font-weight:normal;
				margin:0px; padding: 0px 0px 7px 0px; clear:both; 
				font-family: Garamond, 'Adobe Garamond Pro', serif;
			}
			.subH1 {
				font-size: 16px; 
			}
			h2 {
				font-size: 14px; letter-spacing:1px; line-height:20px; font-weight:normal;
				margin:0px; padding: 3px 0px 0px 0px; clear:both; 
				font-family: Garamond, 'Adobe Garamond Pro', serif;
			}
			h2.big {
				font-size: 13px; letter-spacing:1px; line-height:20px; font-weight:normal;
				margin:0px; padding: 0px 0px 7px 0px; clear:both; 
				font-family: Georgia, serif;
			}
			h3 {
				font-size: 11px; letter-spacing:1px; line-height:18px; font-weight:bold;
				margin:0px; padding: 3px 0px 0px 0px; clear:both; 
				font-family: Georgia, serif;
			}
			p {
				font-size: 11px; line-height:18px;
				margin:0px; padding:0px 0px 7px 0px; clear:both;
			}
			ul { margin: 0px 0px 0px 10px;  padding:0px 0px 7px 10px; }
			ol { margin: 0px 0px 0px 10px;  padding:0px 0px 7px 10px; }
			
			/*-- used in recipes --*/
			.tagline {
				font-size: 11px; line-height:18px; display:block;letter-spacing:0px;
				margin:0px; padding:0px; clear:both; font-family: Georgia;
			}		

	/*-- footer contains navigation elements only --*/
	#footer {
		position:absolute; top:580px; left:0px;
		width:700px; height:30px; text-align:center;
		font-size: 8px; line-height: 14px;
		margin:0px; padding:0px;
		text-transform: uppercase;
		
	}
		#footer a, #footer .current {
			margin: 0px 13px; 
		}
		
#homeFooter {
		position:absolute; top:580px; left:0px;
		width:700px; height:30px; text-align:center;
		font-size: 8px; line-height: 14px;
		margin:0px; padding:0px;
		text-transform: uppercase;
		border-bottom: 1px solid #939598;
	}
		#homeFooter a, #homeFooter .current {
			margin: 0px 13px; 
		}
		
	#socialFooter {
		position:absolute; top:630px; left:0px;
		width:700px;
		font-size: 8px; line-height: 14px;
		margin:0px; padding:0px;
		text-transform: uppercase;
	}
	

/*------- MISCELLANEOUS ---------*/	
	
	/*-- viewItem class for "add to cart" links  --*/
	.viewItem {
		position:relative; top:-4px;
		float:right; clear:both;
		width:auto;
		font-size: 9px; text-transform:uppercase; 
		font-family: Arial, sans-serif; text-align:center;
		color:#939598;
		padding: 0px 4px 12px 4px; margin:0px;
	}
	
	#social a {
	text-decoration: none;
	border-bottom: 1px solid #ffffff;
	}