/* ====================================================================
GENERAL STYLING
-------------------------------------------------------------------- */
/* border:nones are for NN4 */
html { margin: 0px; padding: 0px; }
body
	{
			margin:10px auto ;
			padding: 0px;
			width:950px;

		/*	background-image: url(images/bg.jpg);*/
	}
div { margin: 0px; padding: 0px; }
p {padding: 0px; margin: 0px;}
.clear { clear: both;} /* CSS HACK: only for NN4, so now use Caio hack to cleanse palette */
/*/*/ .clear { display: none; } /* */
/* box-wrap is only needed if you want to set a background color for the columns, put a border round the content block or fix the content width */

a{
	text-decoration:none;

}

.box-wrap
	{
			width:950px;
			margin:0px auto ;
	}
.box-inner-wrap
	{
	/*background-image: url(images/ordered_bg_left.gif);
	background-repeat: repeat-y;
	background-position: 25% 0px;
	*/
				margin:0px auto ;
	}
.box-header
	{
		color:#CCCCCC;
		margin: 0px;
		padding: 0;
		border: none;
		background:url(images/header.jpg) no-repeat top  left;
		height:278px;
		z-index:0;

		
		
	}
.inner-box
{
  color:#E4E9ED;
		margin: 0px;
		padding: 0;
		border: none;
	    background:#E4E9ED;
		height:493px;
		width:677px;
		z-index:0;
}

h1 { margin: 0px; }
h2
	{
	font-size: 1em;
	margin: 0px 0px 0.5em 0px;
	padding: 0.25em;
	} 
.box-footer
	{
			clear: both;
			
			margin:0 auto;
			text-align:center;
			padding:2px;
			

		font:10px verdana;
		text-transform: capitalize;
		color: #000066;
	}
.box-footer a
{
	font:10px verdana;
	text-transform: capitalize;
		color: #000066;

}	
/* ====================================================================
COLUMNS LAYOUT
-------------------------------------------------------------------- */
.columns-float
	{
	float: left;
	width: 100%;

	}
.column-one
	{
	float: right;
	margin:0 0px 0 0px;
	width:680px;

	}
.column-two {
	width: 209px;
	float:left;
}

/* CSS HACK: Caio hide from NN4 since NN4's float model is all wrong */
/*/*/
.column-three {
	float:right;
	margin:0 10px 0 0px;
	width: 203px;
	

}
/* */
.column-one-content, .column-two-content, .column-three-content
	{
	margin:0;
	padding:0;
	}

/* CSS HACK:  position:relative needed by IE6 otherwise the header and col 2 don't show up on initial rendering - they're there but you have to minimise the window or switch to another app and back to see the full effect. But IE5(pc) doesn't like it. And nor does NN4.
NB. the use of pos:rel has to go way beyond skin-deep - any nested element that needs a background colour appears to require to be be relatively positioned */ 
/*/*/
.box-wrap, .columns-float, .column-one, .column-two, .column-three, h2
	{ p\osition: relative; }
/* */


/**************** menu coding *****************/
#menu_top
{
	height:29px;
	width:254px;
	background:url(images/menu_top.gif) no-repeat left top;
}
#menu_bottom
{
	height:30px;
	width:254px;
	background:url(images/menu_bottom.gif) no-repeat left top;
}
#menu {
	width: 233px;
	padding:0px 0 0px 0px;
	margin:0 0 0 0px;
 	
}

#menu ul {
	list-style-type: none;
	margin: 0;
	padding: 0;
	font:12px verdana;
}
#menu li {
	margin:0;
	padding:0;
	position: relative;
	
}

#menu a, #menu h2 {
	font:12px verdana;
	display: block;

	margin: 0;
	padding:6px 0 6px 15px;
}

#menu h2 {
	display: block;
	margin: 0;
	padding: 0 0 0 5px;
	font:12px verdana;
	text-transform: capitalize;
	color: #FBB807;
	background-color:#FBB807;
}

#menu a {

	margin: 0;

	font:12px verdana bold;
	font-weight:bold;
	color: #4F768E;
	text-decoration: none;
	text-transform: capitalize;
	height:20px;


}

#menu a:hover{
	color: #ffffff;
	background-color:#FBB807;
	
}


.row
{

}
.col
{
	display:block;
	text-align:center;
	font-weight:bold;
}

.story
{
	margin:0;
	padding:0;
	font:13px verdana;
}
.inner_top_bg
{
	margin:3px 0 0 0;
 	height:32px;
	background:url(images/inner_top_bg.jpg) no-repeat left top;
	border:0px;

}
.inner_bottom_bg
{
	height:32px;
	background:url(images/inner_bottom_bg.jpg) no-repeat left top;

}

#page_name
{
	position:absolute;
	color:#40442D;
	font:14px verdana bold;
	font-weight:bold;
	left:230px;
	top:220px;
	text-transform:capitalize;
	z-index:3;

}
.inner_text
{
	padding:0px 20px 5px 20px;
	width:580px;
	text-align:justify;
	color:#000000;
	background:#ECF0EF;
	font:12px verdana ;
}
.page_font
{
	text-align:justify;
	color:#FFFFFF;

}

.inner_text input
{
	border:1px groove #666666;
	height:15px;
	width:200px;
	padding:2px 5px 2px 5px;

}
.inner_text  textarea
{
	border:1px groove #666666;
	height:50px;
	width:200px;
	font:12px verdana ;
	padding:2px 5px 2px 5px;
	overflow:hidden;

}
#process
{
	position:absolute;
	width:208px;
	height:190px;
	background:url(images/process.gif) no-repeat left top;

	padding:160px 20px 0 25px ;

}
#products
{
	position:absolute;
	margin:0 0 0 208px;
	width:208px;
	height:190px;
	background:url(images/products.gif) no-repeat left top;
	padding:160px 20px 0 25px ;

}
#quality
{
	position:absolute;
	margin:0 0 0 415px;
	width:211px;
	height:190px;
	background:url(images/quality.gif) no-repeat left top;
	padding:160px 20px 0 25px ;

}
#process p , #products p  ,#quality p
{
width:170px;
font-size:12px;
text-align:justify;
color:#FFFF99;
}

#process a , #products a  ,#quality a
{

font-size:12px;
text-align:justify;
color:#00FF00;
}


.product_detail
{

	text-align:center;
	margin:10px 50px 0 0px; 
	text-transform:uppercase;
	font-weight:bold;
	font-size:18px;
	
}


#image_white_dehydrated_onion_kibbled img,
#image_white_dehydrated_onion_flakes img, 
#image_white_dehydrated_onion_minced img ,
#image_white_dehydrated_onion_chopped img , 
#image_white_dehydrated_onion_granules img ,
#image_white_dehydrated_onion_powder img ,
#image_red_dehydrated_onion_kibbled img ,
#image_red_dehydrated_onion_flakes img ,
#image_red_dehydrated_onion_minced img ,
#image_red_dehydrated_onion_chopped img ,
#image_red_dehydrated_onion_granules img ,
#image_red_dehydrated_onion_powder  img ,
#image_toasted_dehydrated_onion_kibbled img ,  
#image_toasted_dehydrated_onion_flakes img ,
#image_toasted_dehydrated_onion_minced img ,
#image_toasted_dehydrated_onion_chopped img ,
#image_toasted_dehydrated_onion_granules img ,
#image_toasted_dehydrated_onion_powder img
{
	width:220px;
	height:220px;
	border:2px  inset #FFFFFF;
}
#image_white_dehydrated_onion_kibbled ,
#image_white_dehydrated_onion_flakes , 
#image_white_dehydrated_onion_minced  ,
#image_white_dehydrated_onion_chopped  , 
#image_white_dehydrated_onion_granules  ,
#image_white_dehydrated_onion_powder  ,
#image_red_dehydrated_onion_kibbled  ,
#image_red_dehydrated_onion_flakes  ,
#image_red_dehydrated_onion_minced  ,
#image_red_dehydrated_onion_chopped  ,
#image_red_dehydrated_onion_granules  ,
#image_red_dehydrated_onion_powder   ,
#image_toasted_dehydrated_onion_kibbled  ,  
#image_toasted_dehydrated_onion_flakes  ,
#image_toasted_dehydrated_onion_minced  ,
#image_toasted_dehydrated_onion_chopped  ,
#image_toasted_dehydrated_onion_granules  ,
#image_toasted_dehydrated_onion_powder 
{
		margin:10px auto 0 40px;

}
				
.contact_us
{
		color:#000000;
		font-family:verdana;
		font-size:13px;
		text-decoration:none;

}
.contact_us a
{
		color:#000000;
		font-family:verdana;
		font-size:13px;
		text-decoration:none;

}


.products {
			width: 200px;
			/*margin:10px 0 0 0px;*/
}

.red_onion
{
	position:absolute;
	margin:-146px 0 0 190px;
}
.white_onion
{



}
.toasted_onion
{
	position:absolute;
	margin:-146px 0 0 380px;


}
.products ul {
list-style: none;
margin: 0;
padding: 0;
background-color:#ECF0EF;

}

.products a, .products h2 {
font: bold 11px/16px arial, helvetica, sans-serif;
display: block;
height:16px;  
 margin: 0;
padding: 2px 3px 0 10px;


}

.products h2 {

color: #FFFFFF;
text-transform: uppercase;
margin:0 0 0 8px;
color: #FFFFFF;
background-color:#8CA19E;


}

.products a {
color: #54676E;
margin:0 0 0 8px;
background-color:#ECF0EF;

text-decoration: none;

 
}

.products a:hover {


color: #ECF0EF;
background: #54676E;
}

.products li {
position: relative;

}

#index_content
{
 text-align:left;
 margin:0  auto 0 0;
 width:430px;
}
.cnt
{
	margin:0px 0 0 0;
	padding:0  0 0 0 ;
	background:#E4E9EE;
	z-index:0;
}
.cnt_txt
{
	
	padding:5px 0px 0 5px;
	z-index:0;
	text-align:justify;
}
.cnt_tl
{
	height:45px;
	width:430px;
	margin:0px 0 0 0px;
	background:url(images/middle_top.jpg) no-repeat left top;
	z-index:2;

}

.cnt_bl
{
	height:45px;
	background:url(images/middle_botom.jpg) no-repeat left bottom;
	z-index:1;
}

#index_top
{
	margin:0px 0 0  auto;
	background:url(images/index_top.gif) no-repeat left top;
	height:150px;
}
#index_right
{
	
position:absolute;
left:440px;
top:150px;

	background:url(images/index_right.gif) no-repeat left top;
	height:372px;
	width:250px;
	

}


/*- Menu Tabs E--------------------------- */

    #tabsE {
	position:absolute;
      font-size:14px;
	  font-family:verdana;
	  font-weight:bold;
      line-height:normal;
	  margin:240px 0 0 300px;

      }
    #tabsE ul {
	margin:0;
	padding:0px;
	list-style:none;
      }
    #tabsE li {
      display:inline;
      margin:0;
      padding:0;
      }
    #tabsE a {
      float:left;
       margin:0;
      padding:0 0 0 4px;
      text-decoration:none;
      }
    #tabsE a span {
      float:left;
      display:block;
       padding:7px 10px 8px 10px;
      color:#FFF;
      }
    /* Commented Backslash Hack hides rule from IE5-Mac \*/
    #tabsE a span {float:none;}

    #tabsE a:hover span {
      color:#FFF;
      }
    #tabsE a:hover {
	color: #666666;
	background-color:#ECF0EF;
      }
    #tabsE a:hover span {
	  	background-color:#ECF0EF;
	color: #666666;
      }  
	
	#mainflash
	{
		position:absolute;
		margin:49px 0 0 269px;
		z-index:2;
	}