/* FreshFrog Media CSS for Foods Alive */

/*-------------- Layout --------------*/

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	background: #cecece;
	margin: 0;
	padding: 0;
}

#container {
	width: 800px;
	background-color: #ffffff;
	padding: 0em;
	border: 1px solid #CCCCCC;
	margin: auto;
	voice-family: "\"}\""; 
	voice-family:inherit;
}

html>body #container {
}

div, p, input, dl, dt, dd {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 13px;
	line-height: 1.8em;
	color: #4d4d4d;
	font-weight: normal;
}

p.recipe {
font-size: 12px;
line-height:1.2;
}

#header {
margin: 0;
width: 800px;
position: relative;
height: 90px;
}

#header h1 a {
	display: block;
	position: absolute;
	width: 203px;
	height: 90px;
	background: url(images/foodsalive_logo.gif) no-repeat;
	left: 18px;
	top: 0px;
}
#header h1 span, #header h2 {
	display: none;
}

#header_image {
	clear: both;
	width: 800px;
	height: 200px;
	background: url(images/header.jpg) no-repeat;
	overflow: hidden;
}

#header_image2 {
	clear: both;
	width: 800px;
	height: 200px;
	background: url(images/sunriderfamily.jpg) no-repeat;
	overflow: hidden;
}

#header_image3 {
	clear: both;
	width: 800px;
	height: 200px;
	background: url(images/header2.jpg) no-repeat;
	overflow: hidden;
}

#header_image4 {
	clear: both;
	width: 800px;
	height: 200px;
	background: url(images/product_header.jpg) no-repeat;
	overflow: hidden;
}

#header_image5 {
	clear: both;
	width: 800px;
	height: 200px;
	background: url(images/header_krackleez.jpg) no-repeat;
	overflow: hidden;
}

img.floatLeft {
	float: left;
	margin: 8px;
	border: solid 1px 000000;
}

img.floatLeft2 {
	float: left;
	margin: 8px;
}

img.floatRight { 
    float: right; 
    margin: 0px 6px;
	border: solid 1px 000000; 
}

img.floatRight2 { 
    float: right; 
    margin: 0px 6px;
}

/* Primary Navigation Tabs */
ul#topnav {
margin: 0px;
height: 86px;
}

ul#topnav li {
list-style: none ;
position: absolute ;
top: 0;
}

ul#topnav li,
ul#topnav li a:link,
ul#topnav li a:visited,
ul#topnav li a:active,
ul#topnav li a:hover {
display: block;
width: 98px;
height: 86px;
margin: 0px;
}
ul#topnav li span {
display: none;
}

ul#topnav #whoweare {
right: 392px;
background: url(images/aboutus_off.gif) no-repeat;
}
ul#topnav #products {
right: 294px;
background: url(images/products_off.gif) no-repeat;
}
ul#topnav #rawgourment {
right: 196px;
background: url(images/rawfood_off.gif) no-repeat;
}
ul#topnav #lunchandlearn {
right: 98px;
background: url(images/lunchandlearn_off.gif) no-repeat;
}
ul#topnav #recipes {
right: 0px;
background: url(images/recipes_off.gif) no-repeat;
}

ul#topnav #whoweare a:hover { background: url(images/aboutus_on.gif) no-repeat; }
ul#topnav #products a:hover { background: url(images/products_on.gif) no-repeat; }
ul#topnav #rawgourment a:hover { background: url(images/rawfood_on.gif) no-repeat; }
ul#topnav #lunchandlearn a:hover { background: url(images/lunchandlearn_on.gif) no-repeat; }
ul#topnav #recipes a:hover { background: url(images/recipes_on.gif) no-repeat; }

/* Headings */

h1 {
font-size: 18px;
color: #4ca201;
}

#sidebar h2 {
font-size: 14px;
}

h2 {
color: #4ca201;
font-size: 17px;
margin-top: 1.5em;
}

h3 {
font-size: 15px;
color:#cc9900;
}

h4 {
font-size: 15px;
color:#cc9900;
margin-top: 1.5em;
}

h5 {
font-size: 14px;
color:#cc0000;
font-weight: normal;
}

#sidebar h2, #main-content h2.page-title, #main-content h2.recipe {
color: #4ca201 !important;
background: url(images/title_line.gif) bottom left repeat-x;
padding-bottom: .4em;
font-weight: normal;
letter-spacing: .05em;
}

h2.page-title {
font-size: 18px;
}

#main-content h2.page-title {
	margin-top: 1em;
	text-align: center;
}

#main-content h2.recipe {
text-align:right;
}



/*-------------- Link Classes --------------*/
a:link {
color: #4d75a1;
text-decoration: none;
}
a:visited, a:active {
color: #8ba5c2;
text-decoration: none;
}
a:hover {
color: #8ba5c2;
text-decoration: underline;
}
a img {
border: none;
background: none;
}


/*-------------- Sidebar Navigation / Links --------------*/

#sidebar {
width: 226px;
float: left;
margin-left: 20px;
padding-bottom: 20px;
}
#sidebar h2 {
margin-top: 30px;
}

#sidebar li {
list-style-type: none;
margin-left: 0;
line-height: 1.2em;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
color: #1a4e86;
font-weight: bold;
}

#sidebar a {
display: block;
margin-top: 3px;
font-weight: bold;
text-decoration: none;
color: #1a4e86;
padding: 4px 7px 4px 12px;
background: #f5f5f5 url(images/link_plus_off.gif) 7px 9px no-repeat;
}

#sidebar li a.active {
background: #c5eca2
}
#sidebar li a:hover, #sidebar li a:active, #sidebar li a.active:hover, #sidebar li a.active:active {
background: #ade07f
}


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

#main {
margin: 0em;
position: relative;
padding-top: 10px;
background-color: #fff;
}

#main-content {
float: left;
width: 500px;
margin-left: 30px;
padding-bottom: 20px;
}

#main-content ul.col {
width: 160px;
margin-left: 0;
}

#main-content ul.col li {
margin-top: 0em;
margin-left: 0;
line-height: 1.1em;
}

/*-------------- Footer --------------*/

#footer {
clear: both;
margin-left: auto;
margin-right: auto;
width: 800px;
height: 120px;
position:relative;
}

#footer div {
margin-top: 0px;
}
#footer p {
font-size: 11px;
line-height: 1.5em;
color: #666;
}

#footer strong {
color: #4d4d4d;
}
#footer #contact_info p {
	float: left;
	position: absolute;
	/*top: -2px;*/
font-size: 11px;
	line-height: 1.4em;
	width: 251px;
}

#footer #contact_bc {
padding-left: 18px;
background: url(images/icon_contact.gif) 0px 2px no-repeat;
left: 263px;
}

#footer #contact_sunrider {
padding-left: 113px;
background: url(images/sunrider.gif) 0px 2px no-repeat;
left: 473px;
}

/* Footer Links */
#footer_links a:link {
color: #4d4d4d;
font-weight: bold;
text-decoration: none;
}
#footer_links a:visited, #footer_links a:active {
color: #666;
font-weight: bold;
text-decoration: none;
}
#footer_links a:hover {
color: #fff;
background-color: #ef8732;
text-decoration: none;
}


/*-------------- Miscellaneous / Classes --------------*/

div.spacer {
	clear: both;
}
.cent {
	text-align: center;
}
.green {
	color: #FFF;
}
#container #main #main-content table .green .green p strong {
	color: #FFF;
	font-size: 18px;
}
.yellowlink {
	color: #FF0;
}
#container #main #main-content table .green .green p strong .yellowlink {
	color: #FF0;
}
#container #main #main-content table .green th {
	font-size: 16px;
}
#container #main #main-content .style10 .col {
	font-size: 15px;
	color: #cc9900;
}