/* CSS Document */

/* ##### SITE BASE ##### */
body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size:0.7em; margin-left:auto; margin-right:auto; width:760px; }
div#centre_site { width:760px; margin-left:auto; margin-right:auto; }
div#site_container{ float:left; width:758px; border:1px solid #999999; }
img { border:0px; }
a {
	color:#ef4a42;
	background-color:transparent;
	
	text-decoration:none;
}
a:hover { text-decoration:underline; }
form {
	padding:0px;
	margin:0px;
}
input,
textarea,
select { 
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:0.9em;
}
.green { color:#4CA25A; background-color:transparent; }
.red { color:#EF4A42; background-color:transparent; }
.gray { color:#666666; background-color:transparent; }




/* ##### HEADER ##### */
div#header {
	float:left;
	
	width:100%;	
}

div#header img#logo {
	float:left;
	margin:33px 0px 22px 19px;
}

div#header div#top_menu {
	float:right;
	margin:8px 8px 12px 0px;
}
div#header div#top_menu a {
	display:block;
	width:143px;
	height:16px;
	
	/* padding:4px 0px 0px 9px; */
	padding: 2px 0px 0px 9px;
	margin:0px 0px 1px 0px;
	
	color:#ffffff;
	background-color:#9c9c9c;
	
}
div#header div#top_menu a.selected {
	color:#ef4a42;
	background-color:#E1E1E1;
}

div#flags {
	width:156px;
	
	float:right;
	clear:right;
	
	margin:0px 8px 16px 0px;
}
* html div#flags { /* Solves some issues in IE6 with the flags layout */
	width:163px;
	position:relative;
	left:+2px;
}
div#flags a {
	display:block;
	float:left;
	margin:0px 0px 0px 5px;
}





/* ##### ORANGE RULE ##### */
/* Location: body > div#centre_site > div#site_container */
div#rule {
	float:left;
	
	width:190px;
	height:24px;
	
	color:#000000;
	background-color:#EF4a42;
}





/* ##### LEFT CHANNEL ##### */
/* Location: body > div#centre_site > div#site_container */
div#left_channel {
	float:left;
	
	width:158px;
	
	margin:0px 16px 20px 16px;
}
* html div#left_channel { margin-left:8px; }

div#left_channel div#crops {
	float:left;
	width:100%;
	
	margin:10px 0px 20px 0px;
}
* html div#left_channel div#crop p { margin-bottom:0px; padding-bottom:0px; }

div#left_channel div#left_menu {
	float:left;
	width:100%;
}

div#left_channel div#left_menu div.product_sub_groups {
	float:left;
	
	margin:0px 0px 1px 0px;
	padding:5px 0px 5px 0px;
	
	color:#000000;
	background-color:#e1e1e1;
}

div#left_channel div#left_menu a,
div#left_channel div#left_menu span {
	display:block;
	float:left;
	
	width:151px;
	height:16px;
	
	margin:0px 0px 1px 0px;
	padding:2px 0px 0px 7px;
	
	color:#ffffff;
	background-color:#666666;
	
	font-weight:bold;
}
div#left_channel div#left_menu a.product_group {
	color:#000000;
	background-color:#e1e1e1;

	font-weight:normal;
}
div#left_channel div#left_menu a.product_sub_group {
	width:141px;

	margin:0px;
	padding-left:17px;

	color:#000000;
	background-color:#e1e1e1;
	
	font-weight:normal
}
div#left_channel div#left_menu a.selected,
div#left_channel div#left_menu a:hover { 
	color:#ef4a42;

	text-decoration:none;
}

div#left_channel img#iso {
	margin-top:30px;
	float:right;
}





/* ##### CENTRE CHANNEL ##### */
/* Location: body > div#centre_site > div#site_container */
div#centre_channel {
	float:right;
	
	width:568px;
}

div#centre_channel div#content_header {
	float:left;
	
	width:567px;
	
	margin:0px 0px 1px 0px;
}
div#centre_channel div#content_header div#header_rule {
	float:left;
	
	width:411px;
	height:19px;
	
	padding:5px 15px 0px 0px;
	
	color:#ffffff;
	background-color:#ef4a42;
	
	text-align:right;	
}
div#centre_channel div#content_header div#header_content {
	float:left;
	
	width:245px;
	height:98px;
	
	padding:16px 30px 10px 20px;
	
	color:#666666;
	background-color:#E9E9E9;
	
	overflow:hidden;
}
div#centre_channel div#content_header div#header_content h1 {
	margin:0px;
	padding:0px;
	
	font-size:1.5em;
	font-weight:bold;
}

div#centre_channel div#print { 
	float:left;
	width:548px;
	height:22px;
	
	padding:7px 20px 0px 0px;
	
	color:#FFFFFF;
	background-color:#72b27d;
	
	text-align:right;
}

div#centre_channel div#content {
	/* This div is the div used to contain all content, it sets the width and 
	 * a gray border down the left hand side */
	float:left;
	
    width:567px;
	min-height:200px;
    
    border-left:1px solid #999999;
}

div#centre_channel div#two_channel_green {
	/* This style is used for when the content is displayed in two channels and the right channel
	should have a green background */
	float:left;
	
	width:567px;
	
	background-image:url(images/green_content_slice.jpg);
}

div#centre_channel div#single_channel {
	/* This style is used when the content should take up the whole available space.
	 * For example the about us page */
	float:left;
	
	width:531px;
	
	padding:20px 14px 15px 22px;
}

div#centre_channel div#left_content {
	float:left;
	
	width:245px;
	
	padding:16px 30px 10px 20px;
}

div#centre_channel div#right_content {
	float:left;
	
	width:222px;
	overflow:hidden;
	
	padding:16px 30px 10px 20px;
}

div#centre_channel h2 {
	padding:0px;
	margin:0px;
	
	color:#ef4a42;
	background-color:transparent;
	
	font-weight:normal;
	font-size:1.5em;
}

div#centre_channel div#breadcrumb {
	float:left;
	width:538px;
	padding:15px 0px 25px 22px;
}
div#centre_channel div#breadcrumb a {
	color:#4CA25A;
	background-color:#FFFFFF;
	
	font-weight:bold;
}





/* ##### FOOTER ##### */
/* Location: body > div#centre_site  */
div#footer {
	float:left;
	
	width:718px;
	height:18px;

	margin:5px 0px 20px 0px;
	padding:5px 20px 0px 20px;
	
	/* border:1px solid #999999; */
}
div#footer div#copyright {
	float:left;

	color:#666666;
	background-color:transparent;
}
div#footer div#contact_email { float:right; }





/* ###### PRODUCT PAGE ##### */
/* Location: body > div#centre_site > div#site_container > div#centre_channel > div#content */
/* These styles are only used on products.php */
div#product_list {
	/* This is the green area on the page that displays a list of anchors of the products on the page */
	float:left;
	width:526px;
	
	padding:15px 20px 20px 20px;
	
	color:#4CA25A;
	background-color:#E4F9E4;
}
div#product_list h2 {
	margin:0px 0px 10px 0px;
	padding:0px; 
	font-size:1.1em;
	color:#72B27D;
	font-weight:bold;
}
div#product_list table { line-height:1.6em; }
div#product_list a {
	color:#4CA25A;
	background-color:inherit;
	text-decoration:underline;
}
div#product_list a:hover {
	color:#EF4A42;
	background-color:inherit;
}

div#products {
	float:left;
	width:567px;
}

div#products div.product {
	/* This div will contain a product and its imgae in a row */
	float:left;
	
	width:535px;
	
	padding:0px 10px 19px 22px;
}

div#products div.product div.product_details {
	float:left;
	width:320px;
}

div#products div.product div.product_details_full {
	float:left;
	width:100%;
}

div#products div.product div.product_image {
	float:right;
	width:198px;
}
div#products div.product div.product_image img.product_image {
	border: 1px solid #999999;
}

div#products div.product div.product_image_footer {
	float:left;
	
	width:188px;
	height:17px;
	margin:1px 0px 0px 0px;
	padding:3px 0px 0px 10px;
	
	color:#EF4A42;
	background-color:#FAE8E3;
	
	font-size:0.9em;
}




/* ##### PRODUCT DETAILS ##### */
/* Location: body > div#centre_site > div#site_container > div#centre_channel > div#content */
/* These styles are only used on product_details.php */
div#two_channel_products,
div#single_channel_products {
	float:left;
	
	width:567px;
}

div#two_channel_products img#main_image,
div#single_channel_products img#main_image {
	float:left;
}

div#two_channel_products div#breadcrumb,
div#single_channel_products div#breadcrumb {
	width:350px;
}

div#two_channel_products div#details,
div#single_channel_products div#details {
	float:left;
	width:368px;
	padding:0px 10px 20px 22px;
}
div#single_channel_products div#details { width:534px; }

div#two_channel_products div#details h2,
div#single_channel_products div#details h2 {
	margin:0px 0px 10px 0px;
	
	font-size:1.2em;
	font-weight:bold;
}

div#two_channel_products div#thumbnails {
	float:right;
	
	width:134px;
	padding:10px 16px 20px 17px;
}
div#two_channel_products div#thumbnails img {
	border:1px solid #999999;
	cursor:pointer;
	margin-bottom:10px;
}
div#two_channel_products div#thumbnails img.selected{
	border:1px solid #EF4A42;
}