/* CSS Document */

body {
	margin: 0;
	padding: 0;
	color: #000000;
	font-family: Arial, Helvetica, sans-serif normal;
	font-size: 12px;
	background:  #fbefda url(../images/container_bg.gif) repeat-y;

}


.header {
	width: 810px;
	height: 256px;
	margin: 0;
	padding: 0;
	background: #e7f9c6 url(../images/header.jpg) no-repeat; 
}

/* The container class creates a minimum-size container for content so that just in case 
   of small articles. */
   
.container {
	height: 825px;
}

/* Content classes */

.content{
	padding: 0;
	width: 507px;
	margin: 0 5px 0 295px;
	background: url(../images/main_bg.jpg)
}

.content p {
	padding: 5px 17px 10px 25px;
	margin: 0;
	line-height: 22px
	
}

.content span {
	margin: 0 0 0 6px;
	padding: 0;
}

.content ul {
	padding: 0;
	margin: 0;
	list-style: none;
	line-height: 22px

}

.content li {
	margin: 10px 10px 5px 35px;
	padding: 0 0 3px 15px;
	background: url(../images/bullet.gif) no-repeat 
	
}

/* This class will get changed a lot in terms of pics */
.content_image {
	clear: both;
	width: 176px;
	height: 156px;
    float: left;
	margin: 0 7px 0 5px;
	padding: 0;
	background: url(../images/lady_milk.gif)
}

/* Quote classes */

.quote {
	width: 175px;
	background: url(../images/quotes.gif) no-repeat;
	float: right;
	margin: 0 15px 0 8px;
	_margin: 0 10px 0 5px;
	padding: 10px;
	line-height: 
}

.quote h1 {
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 22px;
	font-weight: bold;
	line-height: 35px;
	margin: 0;
	padding: 0;
	color: #463a02
}

.quote p {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: italic;
	font-weight: normal;
	color: #333333;
	padding: 0;
	text-align: right;
	margin: 5px
}

/* Classes for FAQ */

.content .question {
	padding: 0;
	margin:12px 17px 0 22px;
	background: url(../images/q.gif)
}

.content .answer {
	padding: 0;
	margin:0 17px 10px 22px;
}


.content .faq_list {
	padding: 0;
	margin: 0;

}

.content .question_list {
	padding:0;
	margin: 0;
	list-style-type: none; 
	margin-top: 12px;
	padding-left: 25px;
	padding-right: 10px;
	margin-left: 15px;
	background:  url(../images/q.gif) no-repeat;
	font-size: 14px;
	font-weight: bold;
	color: #8e7643
}

.content .answer_list {
	padding:0;
	margin: 0;
	margin-bottom: 7px;
	list-style-type: none; 
	padding-left: 25px;
	padding-right: 10px;
	margin-left: 15px;
	background:  url(../images/a.gif) no-repeat;
}

.content h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: bold;
	color: #855612;
	margin: 0 0 0 25px;
	padding:0;
	padding-top: 10px	
}

.content h3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-weight: normal;
	color: #ff740b;
	margin: 0 0 0 25px;
	padding:0;
	padding-top: 10px
}

.content a {
	padding-left: 15px
}

.content a:link, .content a:active, .content a:visited {
	color: #333333;
	text-decoration: none;
}

.content a:hover {
	color: #333333;
	text-decoration: underline;
}

/* Hack on the padding of image. for IE6...which sucks bigtime */
html > body .content_image {
	margin: 0 7px 0 9px;
}


.top_image {
	width: 507px;
	height: 6px;
	background: url(../images/main_top.jpg) no-repeat bottom;
	margin: 5px 5px 0 295px;
	padding: 0

}

.bot_image {
	margin: 0 5px 5px 295px;
	padding: 0;
	width: 507px;
	height: 9px;
	background: url(../images/main_bottom.jpg) no-repeat;
}

/* Grey text */

.greyd {
	color: #555555;
	font-style: italic; 
}


/* START of NAVIGATION AREA */

/* 
	The background here acts as a back up just in case the height of the 
	side background extends to more than the menu background. 
	Just an act of safety.
 */
 
 
.nav_area {
	margin: 0;
	padding: 0;
	position: absolute;
	top: 254px;
	left: 19px;
	width: 270px;
	background: url(../images/nav_strip.jpg);
	
}

.nav {
	position: relative;
	height: 748px;
	margin: 0;
	padding: 0;
	padding-top: 75px;
	background: url(../images/navbg.jpg) no-repeat;
	
}

.feature1 {
	background: #e7f9c6 url(../images/recipe_bg.jpg); 
	margin: 10px 2px 0 150px;
	width: 165px;
	float: left;
	height: 313px;
}

.feature1 p {
	margin: 55px 10px 7px 15px
}

.recipePic {
	height: 113px;
	background: url(../images/berries.jpg) no-repeat;
}

html > body .feature1 {
	margin: 10px 2px 0 295px;

}

.arrow {
	margin-left: 95px;
	font-size: 11px;
}

.arrow a:link, .arrow a:active, .arrow a:visited {
	color: #FF0000;
	text-decoration: none;
}

.arrow a:hover {
	text-decoration: underline;
	color: #ff4200

}

.arrow img {
	border: none
}

.feature2 {
	background: #e7f9c6 url(../images/question_bg.jpg);
	margin: 15px 0 40px 633px;
	width: 165px;
	height: 313px;
	_margin: 15px 0 40px 0;
}

.feature2 p {
	margin: 55px 10px 7px 12px;
}

.questionPic {
	height: 113px;
	background: url(../images/question.jpg) no-repeat;
}



.feature3 {
	background: #e7f9c6 url(../images/food_bg.jpg);
	margin: 10px 2px 0 2px;
	width: 165px;
	float: left;
	height: 313px;
}

.feature3 p {
	margin: 55px 10px 7px 15px;
}

.foodPic {
	height: 113px;
	background: url(../images/vegies.jpg) no-repeat;
}


.menu {
	margin-top: 0;
	width: 252px;
	height: 366px;
	background: url(../images/menu.jpg) no-repeat;
}



.menuitems {
	width: 175px;
	padding-top: 23px;
	*padding-top: 33px; /* only IE7 and IE6 can read this property */
	_padding-top: 30px
}


.menuitems ul {
}

.menuitems li {
	list-style: none;
	padding: 0;
	margin:0;
	height: 32px
}

.menuitems li a:hover {
	border-bottom: #fa7204  dotted 2px
}

html > .menuitems li {
	
}

.menuitems a:link, .menuitems a:visited, .menuitems a:active {
	border: none;
}

.menuitems img {
	border: none;
}

/* Footer classes */

.footer {
	padding: 0;
	margin: 0;
	width: 810px;
	height: 92px;
	background: url(../images/footer_bg.jpg) no-repeat;
	clear: both;
	margin-top: 0;
	color: #a1dd70;
	/*padding-top: 100px*/
}

.footer ul {
	color: #a1dd70;
	padding-top: 45px;
	padding-bottom: 0;
	margin-bottom: 0
}

.footer li {
	display: inline;
	
}

.footer p {
	margin: 0;
	padding: 0;
	margin-left: 40px;
	padding-top: 65px

}

.footer a:link, .footer a:active, .footer a:visited {
	color: #a1dd70;
	text-decoration: none
}

.footer a:hover {
	color: #a5f763;
	text-decoration:underline;
}

/* Newsletter classes */

.newsletter {

}

.newsletter ul {

}

.newsletter li {
	background: url(../images/acrobat_icon.gif) no-repeat;
	padding-left: 8px
}

/* Recipe of the month classes */

.ingredients {
	width: 150px;
	margin: 20px;
	padding: 10px;
	border-bottom: #CC6600 dashed 1px;
	border-top: #CC6600 dashed 1px;
}

.ingredients h1 {
	padding: 0;
	margin: 0;
	color: #FF6600;
	font: Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-size: 14px;
}

.ingredients ul{
	padding: 0;
	margin: 5px 5px 3px 10px;
	
}

.ingredients li{
	list-style: none;
	background: none;
	padding: 0;
	margin: 0
}

.emphasis {
	font-weight: bold;
	color: #855C21;
}

/* Food of the month */

.foodmonth {
	clear: both;
	width: 176px;
	height: 156px;
    float: left;
	margin: 0 7px 0 5px;
	padding: 0;
	background: url(../images/asparagus_pic.gif)
}

/* form classes (contact.asp or contact.html) */
.message {

}
form div {
	clear: left;
	margin: 0 0 0 25px;
	padding: 0;
	padding-top: 3px
}

form div label {
	float: left;
	width: 100px;
	
}

fieldset {
	width: 350px;
	border: #FF6600 solid 1px;
	margin-left: 20px;
	padding: 10px;
}

.submit {
	border: #FF3300 solid 1px;
	background: #FF9900;
	color: #FFFFFF;
	font-weight: bold;

}

.submit:hover {
	background: #FF6600;
}