/* CSS Document */
/* Happy Human Colors 6-27-07
	
	MAIN
	Orange: #ff9900
	Green: #99cc00
	Dark Grey: #504a34
	Light Grey: #CCCCCC
	Light Light Grey: #f0efef
	Light Orange: #ffebd0
	Light Green: #dcdfc8
*/


body {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#999999;
	border-bottom: 10px;
	height: 100%;
	background-color: #f0efef;
}



a:link { text-decoration:underline; color:#225FB1; }

a:hover { text-decoration:none; }

a:visited { color:#500A96; }

#totalcontainer {
	position:absolute;
	width:780px;
	z-index:1;
	left: 10px;
	top: 15px;
	background-color: #f0efef;
	height:auto;
}

#hh_logo {
	position: relative;
	left: 18px;
	top: 2px;

}
#banner {
	position: relative;
	left: 292px;
	top: -124px;
	z-index: 1;
}

#tagline {
	position: relative;
	left: 245px;
	top: -22px;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 14px;
	z-index:2;

}

div#search {
	position: relative;
	left: 619px;
	top: -27px;
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-weight: normal;
	font-size: 10px;
	z-index:2;

}

div#subnav {
	position: relative;
	left: 680px;
	top: -30px;
	z-index:2;
	
	font-size: 9px;
}

#navcontainer {
	position:relative;
	left: 16px;
	top: -12px;
	width: 778px;
	border-top-style: solid;
	border-top-color: #CCCCCC;
	border-bottom-color: #CCCCCC;
	border-bottom-style: solid;
	border-bottom-width: thin;
	border-top-width: thin;
}



div#maincontent {
	position:relative;
	left:30px;
	top:10px;
	
	
}




div#navbar2 {height: 29px;width: 100%;background-color: #a4bc0c;top: 120px;left: 100px;border-color: #999999;}

div#navbar2 ul { margin: 0px; padding: 0px; font-family:  Arial, Helvetica, sans-serif;font-size: 12px;font-weight:bold; color: #FFFFFF;line-height: 30px;white-space: nowrap;}

div#navbar2 li {
	list-style-type: none;
	display: inline;

	padding: 7px 0px 7px 0px;
}



div#navbar2 li a { 
	text-decoration: none; 
	padding: 7px 7px 7px 7px; 
	margin: 0px 0px 0px 0px;
	color: #FFFFFF; 
	
	
	/*border-left-color:#FFFFFF;
	border-left-style:dotted;
	border-left-width:thin;*/

	border-right-color:#FFFFFF;
	border-right-style:solid;
	border-right-width:thin;

	}
	
	
	
div#navbar2 li a:link { color: #FFFFFF; }

div#navbar2 li a:visited { color: #FFFFFF; }

div#navbar2 li a:hover { 
	
	background-color: #ff9900; }


html { height: 90%; }

#page { position: relative; min-height: 100%; }

* html #page { height: 100%; }

div#footer {
	position: relative;
	width: 778px;
	height: 75px;
	left: -15px;
	top: 0px;
	border-color: #CCCCCC;
	border-style: solid;
	border-width: thin;
	font-size: 9px;
	background-color: #a4bc0c;
	color: #FFFFFF;
	font-weight: bold;
}

div#footer li { list-style-type: none; display: inline; }



/* set the image to use and establish the lower-right position */ 
.cssbox, .cssbox_body, .cssbox_head, .cssbox_head h2{ background: transparent url(images/rounded13.jpg) no-repeat bottom right} 

.cssbox{ /* intended total box width - padding-right(next) */
	width:780px!important; /* IE Win = width - padding */
	width: 320px; /* the gap on the right edge of the image (not content padding) */
	padding-right:15px;
	
} /* set the top-right image */ 

.cssbox_head{
	background-position:top right; /* pull the right image over on top of border */
	margin-right:-15px; /* right-image-gap + right-inside padding */
	padding-right:40px;
} /* set the top-left image */ 

.cssbox_head h2{ 
	background-position:top left; 
	margin:0; /* reset main site styles*/ 
	border:0; /* ditto */ /* padding-left = image gap + interior padding ... no padding-right */ 
	padding:25px 0 15px 40px; 
	height:auto !important; height:1%} /* IE Holly Hack */ /* set the lower-left corner image */ 

.cssbox_body{ 
	background-position:bottom left; 
	margin-right:25px; /* interior-padding right */ 
	padding:15px 0 15px 40px} /* mirror .cssbox_head right/left */ 
		
		
		
.box-header {
font-size:12px;
font-weight:bold;
color:#666666;
}		
.news-item{
	width:100%;
	padding: 3px 0px 5px 3px;


}
.news-item-color{
	width:99%;
	padding: 3px 0px 5px 3px;
	background-color:#F6FDE9;
	border-bottom-color: #CCCCCC;
	border-bottom-style: dotted;
	border-bottom-width: thin;
	border-top-color: #CCCCCC;
	border-top-style: dotted;
	border-top-width: thin;
}

#bottom_half_home {
	position:absolute;
	top:220px;
	left:0px;
	height:381px;
	width:100%;
	border-top: solid #CCCCCC 1px;
	color: #CCCCCC;
}

.home-product-box {
border-right:dotted #CCCCCC 1px;
color:#333333;
padding:0px 0px 0px 0px;
margin:0px 0px 0px 0px;
}

.homepage-box-title { color:#666666; font-size:16px; font-weight:bold; }

.sub-head-product {color:#FF6600;font-size:13px; font-weight:bold; font-style:italic;   }


#first-product-homepage {
position:relative;
top:5px;
left:0px;
height:220px;
width:240px;
}

#second-product-homepage {
position:relative;
top:-215px;
left:250px;
height:220px;
width:240px;
}

#offer-box-homepage {
position:relative;
top:-435px;
left:500px;
height:220px;
width:220px;
}





.product {
	width: 700px;
	height: 160px;
	border: solid #CCCCCC thin;
	padding: 20px 10px 10px 20px;
	margin-bottom: 20px;
}


.product-picture {
	width: 140px;
	height: 140px;
	background-color: #FFFFFF;
	border-right: dotted #CCCCCC thin;
	margin: 0px 15px 0px 0px;
}

.product-info {
	position: relative;
	left: 150px;
	top: -140px;
	height: 140px;
	width: 540px;


}

.product-name {
	color:#504a34;
	font-size:18px;
	font-weight:bold;
}


.product-description {
	color:#666666;
	font-size:11px;
	font-weight:normal;
	width: 350px;
	padding-right: 30px;
	border-right: dotted #CCCCCC thin;
	height: 150px;
}
.info {
	position: relative;
	left: 400px;
	top: -140px;
	height: 140px;
	width: 140px;
}

.price {
	color:#504a34;
	font-size:18px;
	font-weight:bold;
}


#basic_boost {
position:relative;
top:0px;
left:0px;


}
#rockin_morroccan {
position:relative;
top:0px;
left:0px;


}

.recipe-description {
	color:#666666;
	font-size:11px;
	font-weight:normal;
	width: 450px;
	padding-right: 30px;
	border-right: dotted #CCCCCC thin;
	height: 100%;
	border-left: dotted #CCCCCC thin;
	padding-left: 30px;
	top: -430px;
	left: 190px;
	position: relative;
}

.recipe-name {
	color:#504a34;
	font-size:18px;
	font-weight:bold;
}

h1 {
	color:#504a34;
	font-size:18px;
	font-weight:bold;
}

.recipe {
	width: 700px;
	height: 420px;
	border: solid #CCCCCC thin;
	padding: 20px 10px 10px 20px;
	margin-bottom: 20px;
}


.recipe-picture {
	width: 140px;
	height: 100%;
	background-color: #FFFFFF;
	margin: 0px 15px 0px 0px;
}

.recipe-info {
	position: relative;
	left: 150px;
	top: -355px;
	height: 140px;
	width: 540px;


}

.recipe-list {
	height: 400px;
	width: 500px;
	position: relative;
	top: -240px;
	left: 200px;
	padding: 0px 10px 0px 10px;
	border-left: dotted #CCCCCC thin;
	border-right: dotted #CCCCCC thin;
	
	
}


.recipe-list-picture{
	width: 160px;
	padding: 10px 10px 10px 10px;
	height: 210px;
	position: relative;
	top: 30px;
	left: 0px;




}
.subHeader {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	font-weight: bold;
	color: #504A34;
}