﻿/*  First let's reset all of the browser defaults so we have a clean slate */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0}
table{border-collapse:collapse;border-spacing:0}
fieldset,img{border:0}
address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:normal}
ol,ul{list-style:none}
caption,th{text-align:left}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal}
q:before,q:after{content:'';}
abbr,acronym{border:0;}
a{text-decoration: none}
/*  Common styles */
span.more{border:1px solid white;background-color:#178A35;float:left;clear:left;display:block;padding:0.2em 0.5em}
span.moredark{border:1px solid #51A768;background-color:#175935;float:left;clear:left;display:block;padding:0.2em 0.5em}
span.morelight{border:1px solid #51A768;background-color:#CCE420;float:left;clear:left;display:block;padding:0.2em 0.5em}
span.go{background:url('/images/go.png') no-repeat right bottom;float:left;display:block;padding:0.3em 0.2em;margin-left:0.3em}
span.goborder{border-left:1px solid #51A768;border-top:1px solid #51A768;background:url('/images/go-border.png') no-repeat right bottom;float:left;display:block;padding:0.2em;margin-left:0.3em}
span.more a, span.moredark a{color:#FFF}
span.morelight a{color:#178A35}
span.go a, span.goborder a{color:#178A35;font-weight:bold}
/*  Page layout 
    we're going to use ems for layout to enable better text-size scaling in pre-FF3/IE7 browsers */
body{text-align:center;font-size:62.5%;font-family:Tahoma, Verdana, Arial, Sans-Serif;background:#FFF url('/images/background.png') repeat-x top center}
div#wrapper{position:relative;text-align:left;width:850px;margin:0 auto}
div#headerInner{width:850px;height:12.5em;background:url('/images/header.png') no-repeat top center}
div#content{width:850px;position:relative;padding-bottom:1em}
div#footer{width:850px;height:2.7em;border-top:1px solid #C2C2C2;background:url('/images/footer.png') repeat-x bottom center;padding-top:0.5em;margin-bottom:20px}
/*  Header styles
    Hide the h1 tag but leave its display attribute as-is for SEO */
div#headerInner h1{position:absolute;left:-999em}
div#menu{margin-top:8.5em;float:right;width:64em}
div#menu ul{text-align:left;list-style:none;margin:0;padding:0;border-bottom:1px solid #C2C2C2;height:3em}
div#menu ul li{float:left;padding:11px 11px 5px 20px;background:url('/images/menu-bullet.png') no-repeat left 10px;}

div#menu ul li a{font-size:1.1em;color:white}
/*  Footer styles */
div#footer p{float:left;color:#595959;padding-top:1em}
div#footer ul.left{text-align:left;padding-top:1em}
div#footer ul.left li, div#footer div.right ul li{float:left;display:inline;padding:0 0 0 15px;margin:0 10px;background:url('/images/footer-bullet.png') no-repeat center left}
div#footer ul.left li a{color:#178A35;font-weight:bold}
div#footer div.right{float:right;text-align:left;background:url('/images/footer-right.png') no-repeat right -2px;height:35px;width:20em}
div#footer div.right ul{text-align:left;margin-top:1em}
div#footer div.right ul li a{color:#595959}
/*  Content styles */
div#content div#left{margin-left:20px;height:44em;overflow:hidden}
div#content div#left .rightimage{float:right;padding-left:10px;margin-left:10px;border-left:1px solid #C2C2C2}
div#content div#left .rightimage #divProductImage{width:484px;height:440px}
div#content div#left .rightimage #divProductImage p{margin:0;padding:20px}
em{font-style:italic}
strong{font-weight:bold}
/*  Typography */
div#left h2{font-size:1.8em;color:#178A35;font-weight:bold;padding-top:0.7em}
div#left h3{font-size:1.5em;color:#178A35;font-weight:bold;padding-top:0.9em}
div#left p, div#left ul{font-size:1.1em;margin-top:1.5em}
div#left ul{list-style-type:disc;padding-left:1.3em}
div#left ul ul{font-size:1em;margin:0}
div#left ul.productlist li{line-height:2em}
div#left ul.productrangelinks{list-style-type:none;margin-top:2.2em;padding:0}
div#left ul.productrangelinks li{background:url('/images/productrangelinks-bullet.png') center left no-repeat;margin-bottom:1.2em}
div#left ul.productrangelinks li a{display:block;border:1px solid #178A35;width:280px;padding:5px;margin-left:26px;color:#FFF;font-weight:bold}
div#left ul.productrangelinks li.ref a{background-color:#CCE420;color:#175935}
div#left ul.productrangelinks li.nat a{background-color:#899719}
div#left ul.productrangelinks li.ess a{background-color:#178A35}
div#left ul.productrangelinks li.org a{background-color:#175935}
div#left ul.productrangelinks li.orgref a{background-color:#1b3426}
div#left a.link{color:#7C7C7C;text-decoration:underline}
div#left a.link:hover{text-decoration:none}
div#left p.linkback{float:right;display:inline;padding:5px 10px 5px 20px;margin:13px -10px 0 0;background:url('/images/menu-bullet.png') no-repeat center left;border-bottom:1px solid #C2C2C2}
div#left p.linkback a{color:#7C7C7C}
div#left span.label{color:#178A35;font-weight:bold}
div#left ul.productsandserviceslinks{list-style-type:none;margin-top:2.2em;padding:0}
div#left ul.productsandserviceslinks li{background:url('/images/productsandserviceslinks-of.png') top right no-repeat;height:4em;width:290px}
div#left ul.productsandserviceslinks li:hover{background-image:url('/images/productsandserviceslinks-on.png')}
div#left ul.productsandserviceslinks li a{display:block;border:1px solid #178A35;width:174px;padding:6px 0;color:#FFF;font-weight:bold;background:#178A35 url('/images/productsandserviceslinks-bg.png') repeat-y center right;text-indent:5px}
div#left ul.productsandserviceslinks li a:hover{background:#175935}


/*----------------------------------------------------------------------*/
/*                                    CHANGES                           */
/*----------------------------------------------------------------------*/
body{background:url('/images/BGTile.jpg') top left repeat-x;}
#wrapper{background:white;}
#Wings{background:url("/images/water.jpg") no-repeat scroll center top transparent;margin:0 auto;width:100%;}

div#header{height:130px;background:url('/images/yellowGradient.jpg') top left repeat-x;}
div#wrapper{width:850px;}
div#footer{margin-bottom:0px;height:40px;width:848px;}
div#menuEnd{background:url('/images/menuEnd.png') top left no-repeat;float:left;height:36px;width:9px;}
div#menuBody{background:url('/images/menuTile.png') top left repeat-x;float:left;height:35px;}
div#menu{width:642px}
div#content{background:url('/images/yellowGradient.jpg') top left repeat-x;position:relative;width:100%;}
/*div#menu ul li:hover{background-image:url('/images/menu-bullet-on.png')}*/

.HPcol2{position:relative;}
.HPcol3{position:relative;}
#LeftColumn .col1 p{font-size:12px;}
#LeftColumn .fairtrade{font-size:11px;width:200px;height:45px;position:relative;left:85px;}
#LeftColumn .organic{font-size:11px;height:45px;left:85px;position:relative;top:40px;width:200px;margin-top:0px;}

#LeftColumn .fairtrade a{line-height:15px;margin-left:5px;position:absolute;text-indent:23px;bottom:0px;color:#178A35;background:transparent url(/images/ClickForMoreButton.png) no-repeat left center}

#LeftColumn .organic a{line-height:15px;margin-left:5px;position:absolute;text-indent:23px;bottom:0px;color:#178A35;background:transparent url(/images/ClickForMoreButton.png) no-repeat left center}

.qualityPromise{line-height:15px;margin-left:15px;position:absolute;text-indent:23px;bottom:8px;color:#178A35;background:transparent url(/images/ClickForMoreButton.png) no-repeat left center}

.quickFind{line-height:15px;margin-left:15px;position:absolute;text-indent:23px;bottom:8px;color:#178A35;background:transparent url(/images/ClickForMoreButton.png) no-repeat left center}

#LeftColumn .organic .organicRefined{background:none;left:-72px;top:10px;}

.bottomTile{width:30px;height:30px;float:left;margin-right:5px}
.bottomFairTrade{}
.bottomBacpop{}
