/* CSS Document */

body
	{
	background-color: #669933;
	background-image: url(images/barley_bkg.jpg);
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 13px;
	padding: 0px;
	margin: 0px;
	}

.border_left
	{
	border-left: #FFFFCC solid 2px;
	margin: 0px;
	}

	
.article_width
	{
	padding-right: 180px;
	}
	
.bkg_table
	{
	vertical-align: top;
	background-color: #ffffff;
	}
	
.bottom_links
	{
	vertical-align: top; 
	font-size: 15px;
	font-family: verdana, arial, sans-serif;
	font-variant: small-caps;
	}
	
.box
	{
	border: 15px;
	}
	
	
.button
	{
	font-family: verdana, arial, sans-serif;
	font-size: 19px;
	color: #FFFFCC;
	background-color: #739d8d;
	padding: 0px;
	margin: 0px;
	vertical-align: top;
	text-align: left;
	display: block; 
	line-height: 30px;
	text-indent: 10px;
	border: 0px;
	}
	
.example
	{
	font-family: verdana, arial, sans-serif;
	font-size: 12px;
	color: #009966;	
	padding: 0 15 0 15px;
	}

.float_right
	{
	float: right;
	margin: 8px 0px 15px 15px;
	}
	
.float_right_middle
	{
	float: right;
	margin: 8px 12px 15px 15px;
	}
	
.good_cause
	{
	vertical-align: top; 
	color: #0099CC;
	font-size: 12px;
	font-family: verdana, arial, sans-serif;
	margin-bottom: 10px;
	letter-spacing: .15cm;
	}

.green_text
	{
	color: #336600;
	font-family: verdana, arial, sans-serif;
	font-size: 14px;
	vertical-align: top;
	padding-left: 5px;
	padding-right: 10px;
	}
	
h1.banner
	{
	font-size: 30px;
	color: #ffffff;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	}
	
h1.if
	{
	font-size: 29px;
	color: #009966;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin-top: 0px;
	padding-left: 10px;
	text-align: center;
	}
	
h1.johns
	{
	font-size: 23px;
	color: #739d8d;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	margin-top: 0px;
	text-align: center;
	}
	
h1.johns_middle_col
	{
	font-size: 23px;
	color: #009966;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	margin-top: 0px;
	text-align: center;
	}
	
h1.johns_left_col
	{
	font-size: 23px;
	color: #009966;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	margin-top: 0px;
	margin-right: 10px;
	border-top: 0px;
	text-align: center;
	}
	
h2.articles
	{
	font-size: 18px;
	color: #33CC66;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	}
	
h2.juice
	{
	font-size: 18px;
	color: #739d8d;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	padding: 0 5px 0 15px;
	font-style: italic;
	}	
	
h2.juice_left
	{
	font-size: 18px;
	color: #739d8d;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	padding: 0 10px 0 10px;
	font-style: italic;
	}	
	
h2.products
	{
	font-size: 18px;
	color: #33CC66;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	}
	
h2.products_page
	{
	font-size: 22px;
	color: #009966;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	margin-top: 0px;
	}
	
h2.who
	{
	font-size: 23px;
	color: #33CC66;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	}
	
h2.whole
	{
	font-size: 22px;
	color: #33CC66;
	letter-spacing: .25cm;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-weight: bold;
	font-variant: small-caps;
	padding-left: 10px;
	}
	
	
li.rightcolumn
	{ 
	font-size: 13px;
	padding-right: 5px;
	}

.line_0
	{
	line-height: 0%;
	}
		
.logo_img_margin
	{
	margin-top: 13px;
	margin-bottom: 10px;
	margin-right: 0px;
	margin-left: 0px;
	padding: 0px;
	}
	
.margin_top_0
	{
	margin-top: 0px;
	padding-top: 0px;	
	}
	
.margin_top_10
	{
	margin-top: 10px;
	padding-top: 0px;	
	}
	
.nav_padding
	{
	padding-left: 30px;	
	}
		
p
	{ 
	font-size: 14px;
	}	
	
.padding_15
	{
	padding: 15px;
	}
	
.padding_6_right
	{
	padding-right: 6px;
	}
		
.padding_10_sides
	{
	padding-left: 10px;
	padding-right: 10px;
	}
	
.padding_20_sides
	{
	padding-left: 20px;
	padding-right: 20px;
	}
	
.padding_60_sides
	{
	padding-left: 0px;
	padding-right: 90px;
	text-align: justify;
	}
	
.product_text
	{
	font-size: 18px;
	color: #000000;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	vertical-align: top;
	padding-left: 10px;
	}
	
.quote
	{
	font-size: 15px;
	color: #009999;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	padding-left: 5px;
	padding-right: 15px;
	}
	
.quote_att
	{
	font-size: 12px;
	color: #993333;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	padding-left: 5px;
	padding-right: 15px;
	text-align: right;
	}

.quote_att2
	{
	font-size: 12px;
	color:  #009966;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	padding-right: 25px;
	text-align: right;
	margin: 0px;
	}
	
.read_more
	{ 
	font-size: 13px;
	color: #009999;
	font-weight: bold;
	font-style: italic;
	}	
	
		
.rightcol
	{ 
	padding-left: 15px;
	padding-right: 5px;
	}
	
.rightcol_photo
	{ 
	margin-left: 17px;
	margin-top: 0px;
	}
	
.spacer
	{
	margin: 0px;
	padding: 0px;
	border: 0px;
	}
	
.testimonial
	{
	font-size: 16px;
	color: #739d8d;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	margin: 0px;
	padding-left: 5px;
	padding-right: 15px;
	}
	
.testimonial_att
	{
	font-size: 12px;
	color: #993333;
	font-family: Arial, Verdana, Helvetica, sans-serif;
	padding-left: 5px;
	padding-right: 15px;
	text-align: right;
	}
	
.yellow_bkg
	{
	vertical-align: top;
	background-color: #FFFFCC;
	padding: 10px  10px 10px 15px;
	margin: 0px;
	}
	
a:link
	{
	color: blue;
	text-decoration: underline;
	}
	
a:visited
	{
	color: blue;
	text-decoration: underline;
	}
	
	
a:hover
	{
	color: #339900;
	text-decoration: none;
	}
	
a.bottom_links:link
	{
	color: #009966;
	text-decoration: none;
	}
	
a.bottom_links:visited
	{
	color: #009966;
	text-decoration: none;
	}
	
a.bottom_links:hover
	{
	color: #00FF99;
	text-decoration: none;
	background-color: #006699;
	}
	
a.good_cause:link
	{
	color: #009966;
	text-decoration: none;
	}
	
a.good_cause:visited
	{
	color: #009966;
	text-decoration: none;
	}
	
a.good_cause:hover
	{
	color: #00FF99;
	text-decoration: none;
	background-color: #006699;
	}
	

	
td.button
	{
	padding: 0px;
	margin: 0px;
	}

a.button:link  
	{
	text-decoration: none;
	color: #FFFFCC;
	}

a.button:visited  
	{
	text-decoration: none;
	color: #FFFFCC;
	}

a.button:hover 
	{ 
	background-color: #33CC99;
	color: #efa;
	}	


/* Left side dropdown navigation menu */
	
.nav {
font-size: 19px;
margin: 0px;
}

/* remove all the bullets, borders and padding from the default list styling */
.nav ul {
padding: 0;
margin: 0;
list-style-type: none;
width: 150px;
}

/* style the list items */
.nav li {
background: #739d8d;

/* for IE7 */
float: left;
}



/* Background color for first level nav buttons that contain second level links  */
.nav li.first_plus {background-color: #739d8d;} 

/* get rid of the table  */
.nav table {position: absolute; border-collapse: collapse; top: 10; left: 0; z-index: 5; font-size: 16px;}

/* style the links */
.nav a, .nav a:visited {
display: block; 
text-decoration: none;
line-height: 30px;
width: 149px;
color: #FFFFCC;
text-indent: 10px;
border: 1px solid #ffffff;
border-width: 0 1px 1px 1px;
}

/* hack for IE5.5 */
* html .nav a, * html .nav a:visited {width: 150px; w\idth: 149px;}
/* style the link hover */
* html .nav a:hover {color: #efa; background-color: #33CC99; position: relative;}

.nav li:hover {position: relative;}

/* For accessibility of the top level nav when tabbing */
.nav a:active, .nav a:focus {color:#efa; background-color: #33CC99;}

/* retain the hover colors for each sublevel IE7 and Firefox etc */
.nav li:hover > a {color:#efa; background:#33CC99;}
 
/* hide the sub levels and give them a positon absolute so that they take up no room */
.nav li ul {
visibility: hidden;
position: absolute;
top: -30px;
/* set up the overlap (minus the overrun) */
left: 115px;
/* set up the overrun area */
padding: 30px;
/* this is for IE to make it interpret the overrrun padding */
background: transparent url(transparent.gif);
}

/* for browsers that understand this is all you need for the flyouts */
.nav li:hover > ul {visibility:visible;}


/* for IE5.5 and IE6 you need to style each level hover */





/* make the second level visible when hover on first level link */
.nav ul a:hover ul {
visibility:visible;
}