/**********************************************************************

    Master CSS for Co-op Food

    Imports generic stylesheets.

    Name                Date                Action
    Oliver Reece        08/10/2008          Created
	Paul Gruffydd		16/10/2008			Modified
	Paul Gruffydd		16/04/2009			Modified

**********************************************************************/

/* Headings
----------------------------------------------------------------------*/

#homePage h2, #homePage h3 {
	position:relative;
	color:#4B8014;/*#676e00*/
	font-weight:bold;
	font-family:"Arial Narrow", Arial, sans-serif;
	z-index:100;
	}
#homePage h2 {
	font-size:1.5em;
	}
#homePage h3 {
	font-size:1.4em;
	}
.txtSml {
	font-size:0.8em;
	}
.txtXL {
	font-size:1.8em;
	}
.offScreenTxt {
	float:left;
	text-indent:-1000em;
	}
	
 /* Colours
 ---------------------------------------------------------------------*/

.red {
	color:red;
	}
.darkRed {
	color:#C35C53;
	}
.darkGreen {
	color:#57967B;
	}
.blueNavy {
	color:#56718F;
	}
.paleGreen {
	color:#86B34C;
	}
.white {
	color:#fff;
	}

/* Background Images
----------------------------------------------------------------------*/

#homePage .strawBerry p, #homePage .bottleWater p, #homePage .emailStamp p {
	width:118px;
	}

	
/* Containers
----------------------------------------------------------------------*/

#homePageBg {	
	position:relative;
	width:944px;
	height:498px;
	/*border-bottom:1px solid red;*/
	}
#homePageBg .homepageBgImg {	
	position:absolute;
	z-index:1;
	}
*.homepageBgImg img {	
	border:3px solid red;
	}
       
       
#localStores .contentWide, #campaignPage .contentWide, #whatshot .contentWide, #ethical .contentWide {
      float:left;
      width:749px;
      }

.FlashAdBox,.AdBox {
	border: 0px !important;
}

.content554 .FlashAdBox {
	margin-top: 20px;
}
	
/* Right Panels
----------------------------------------------------------------------*/

#homePage div#rgtContainer {
	position:absolute;
	top:0;
	right:0;
	width:291px;
	margin:18px 0 5px 0;
	z-index:50;
	}
	
#homePage .rgtBox {	
	margin-bottom:8px;
	width:291px;
	height:148px;
	background:url(/Resources/Images/Food/bgTransparent.png) no-repeat left top;
	}

* html #homePage .rgtBox { 	
	margin-top:-1px;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/Resources/Images/Food/bgTransparent.png', sizingMethod='scale');
	filter:alpha(opacity=70);
}	

* html #homePage div#locationFinder {
       position:relative;
       /* for ie6 */
       filter:alpha(opacity=100);
       /* CSS3 standard */
       opacity:1.00;
       z-index:10;
       }
	
#homePage div.rgtBox img, #homePage div.rgtBox p {
	position:relative;
	z-index:100;
	}
#homePage div.rgtBox .inner {
	float:left;
	width:126px;
	padding:0px 10px;
	}
#homePage div#locationFinder {
    background:url(/Resources/Images/Food/newBgLocation.jpg) no-repeat right top;
    }
#homePage div#locationFinder h2 {
    color:#fff;
    }
#homePage div#locationFinder .inner {
	width:196px;
	}

	
/* Home Page Quad Panels
----------------------------------------------------------------------*/

#homePage #quadBox {
	float:left;
	width:924px;
	margin:10px 0 0 0;
	padding:15px 0 0 20px;
	background:url(/Resources/Images/Food/hpBgQuad.jpg) repeat-x left top;
	}
#homePage div.quad {
	float:left;
	width:213px;	
	height:228px;
	margin-right:16px;
	border-right:1px solid #ccc;
	}
#homePage div.noBorder {
	border:none;
	}

/* Forms
---------------------------------------------------------------------*/

.btnSubmitDetails, #homePage .btnVote, #homePage .btnSumbitAddress {
       border:none;
       }
/*HTML #homePage .btnSumbitAddress {
                MARGIN: 0px 0px -10px 5px; 
}*/
#homePage .btnSumbitAddress {
       position:relative;
       top:-20px;
       left:160px;
       background:url(/Resources/Images/Food/btnFindUsNew.jpg) no-repeat left top;
       width: 73px;
       height: 24px;
       }
* html #homePage .btnSumbitAddress {
       MARGIN:0 0 0 5px; 
       TOP: -18px; 
}
#homePage .addressBox input
{
height:22px;
}
#homePage input.btnSumbitAddress {
	top: -25px;
	height: 26px;
}

.btnSubmitDetails {
       background:url(/Resources/Images/Food/btnSubmitDetails.jpg) no-repeat left top; 
       width: 99px;
       height: 30px;
	   font-size: 1px;
	   color: #356C07;
	   line-height: 40px;
       }
#homePage .btnVote {
       background:url(/Resources/Images/Food/btnCastVote.jpg) no-repeat left top;
       }

#homePage #frmVote label {
	display:none;
	}
#homePage .cta, .newsPanel .cta {
	float:left;
	clear:both;
	width:auto !important;
	padding:0;
	font-size:1.15em;
	font-weight:bold;/**/
	font-family:"Arial Narrow", Arial, sans-serif;
	/*background:url(/Resources/Images/Food/hpBgCTA.gif) no-repeat right 5px;*/
	}
#homePage .cta a, .newsPanel .cta a, #localStores .cta a, #ethical .cta a, .newsPanel .cta a, .quad .cta a {
	background:transparent url(/Resources/Images/Food/hpBgCTA.gif) no-repeat right;
	padding-right: 15px;
	color: #676e00;
	text-decoration: none;
	font-weight: bold;
}
#localStores .cta a:hover, #ethical .cta a:hover, .newsPanel .cta a:hover {
	background:url(/Resources/Images/Food/hpBgCTA.gif) no-repeat right;
	}
.rowOffer .cta {
	font-family:"Arial Narrow", Arial, sans-serif;
	font-size:1.2em;
	font-weight:bold;
	}
.rowOffer .cta a {
	color:#fff;
	padding:0 14px 0 0;
	text-decoration:none;
	background:url(/Resources/Images/Food/whatsHotBgCTA.gif) no-repeat right 4px;
	}
.rowOffer .cta a:hover {
	color:#fff;
	background-color:transparent;
	}	
	
#enterAddress {
	display:block;
	width:145px;
	}


/* Scroll Panels
---------------------------------------------------------------------*/

.homebgitm {
	position: absolute;
	z-index: 5;
}

#scrollContainerBox {
	overflow: hidden;
	overflow-x: auto;
	position: relative;
	width: 519px !important;
}

#scrollContainerBox ol {
	display: block;
	position:relative;
	left: 0px;
}

#scrollContainer {
	position:absolute;
	left:36px;
	top:355px;
	z-index:60;
	width: 590px;
	}
#scrollContainerBox {
	float:left;
	}
#scrollContainerBox li {
	float:left;
	position: relative;
	}

li.third p {
	font-size:1.1em;
	font-weight:bold;
	font-family:"Arial Narrow", Arial, sans-serif;
	position:absolute;
	text-align:left;
	width: 170px;
	padding:3px 0 5px 0;
	background:url(/Resources/Images/Food/bgThirdTransparent.png) left top;
	z-index:10;
	margin-left: 3px;
	}

* html li.third p {	
	position:absolute;
	width:170px;
	filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/Resources/Images/Food/bgThirdTransparent.png', sizingMethod='scale');
	filter:alpha(opacity=80);	
	z-index:10;
		float:left;

	}
	
li.third p a {
	background:url(/Resources/Images/Food/hpBgCTASml.gif) no-repeat 4px 6px;
	display: block;
	}

li.third p a {
	color:#676e00 !important;
	padding:0 0 0 16px;
	text-decoration:none;
	}
.third img {
	border:3px solid white;
	border-top:4px solid white;
	border-bottom:4px solid white;
	width: 170px;
	}
#scrollContainerBox ol {
	margin:0;
	padding:0;
	}
#scrollContainerBox li {
	display:inline-block;
	margin-left: -3px;
	}

.hthird {
	display: none !important;
}

.flashbox {
	width: 526px;
	height: 296px;
	background: #000;
	position: absolute;
	top: 40px;
	left: 55px;
}

#campaignBgImg .flashbox {
	top: 25px;
	left: 100px;
}

.hid {
	display: none !important;
}	

/* Sub Nav
---------------------------------------------------------------------*/

.subNav {
	float:left;
	width:188px;
	margin:0 10px 0 0;
	}
.subNav ul {
	list-style-type:none;
	}
.subNav ul, .subNav li {
	padding:0;
	margin:0;
	/*border-bottom:1px solid red;*/
	} 
.subNav li.active span a {
	font-weight:bold;
	}
	
/* Level 1 - Important for ie6 */

* html .subNav ul li a {
	color:#4D7201;	
	margin:0px 0 0px 0; 
	}
* html .subNav ul li {

	border-bottom:1px solid #fff;/**/
	}
* html .subNav ul li.active span a {
	margin:0px 0 0px 0;
	}
* html .subNav ul li ul li.active span a {
	margin:0px 0 0px 0;
	}
* html .subNav ul li ul li ul li.active span a {
	margin:0px 0 0px 0;
	}
.subNav ul li a {
	display:block;
	color:#4D7201;
	margin:0px 0px;	
	padding:2px 0px 2px 12px;
	border-bottom:1px solid #E1EACF;
	text-decoration:none;
	background:#fff;
	}	
.subNav ul li a:hover {
	background:#E1EACF;
	}
	
/* Level 2 ) */
.subNav ul li ul li  {
	display:block;
	margin:0 0 0 7px;
	}
.subNav ul li ul li a {
	padding-left:18px;
	}
	
/* Section Index
---------------------------------------------------------------------*/

/*.leftColNav li a {
	display:block;
	color:#4D7201;
	}
.leftColNav li.active {
	font-weight:bold;
	}
.leftColNav li.lv2 {
	margin-left:10px;
	}*/

#sectionIndex .banner {
	display:block;
	height:275px;
	width:554px;
	background:#000 url(/Resources/Images/Food/siBannerRgt.gif) no-repeat right top;
	}

#sectionIndex .banner .inner{
	float:left;
	width:210px;
	padding:10px 20px;
	}
#sectionIndex .inner h1, #sectionIndex .inner p {
	float:none;
	color:#fff;
	}
#sectionIndex #quadBox {
	display:block;
	width:556px;
	margin:10px 0 0 0;
	}
#sectionIndex div.quad {
	float:left;
	width:138px;	
	border-right:1px solid #fff;
	}
#sectionIndex div.quad p {
	float:left;
	padding-top: 0px;
	padding-bottom: 10px;
	margin: 0px;
	}
#sectionIndex div.noBorder {
	border:none;
	}

#sectionIndex #greenBox {
	float:left;
	clear:both;
	width:554px;
	margin:20px 0 0 0;
	background:#95BD42;
	/*border:1px solid red;*/
	}

#sectionIndex #greenBox img {
	float:left;
	margin:0;
	padding:0;
	}
#sectionIndex #greenBox .inner {
	float:left;
	width:524px;
	min-height:193px;
	padding:5px 15px;
	background:url(/Resources/Images/Food/siGreenBg.jpg) repeat-x left top;
	}
*html #sectionIndex #greenBox .inner {	
	padding:0px 0 5px 10px;
	}
#sectionIndex #greenBox .inner h2 {
	float:left;
	clear:both;
	width:544px;
	color:#fff;
	font-size:1.4em;
	margin:0;
	padding:0 0 10px 0;
	}
#sectionIndex #greenBox .inner div.greenOuter {
	float:left;
	width:250px;
	margin:0 10px 10px 0;
	font-size:0.8em;
	color:#6B8120;
	background:#D4E5B3;
	/*border:1px solid red;*/
	}
#sectionIndex #greenBox .inner div.greenBoxTxt {
	float:left;
	width:130px;
	padding:5px 10px;
	}

#sectionIndex #greenBox .inner p {
	margin: 0px !important;
	padding: 0px;
	color:#6B8120;
}	
	
#sectionIndex #greenBox .inner div.greenOuter img {
	/*margin:-5px 0 -5px 0;*/
	}

.rightCol .rightColBox {
	float:left;
	clear:both;
	margin:0 0 10px 0;
	}

.rightCol div#locationFinder {
	height:275px;
	width:170px;
	background:url(/Resources/Images/Food/siBgLocation.gif) no-repeat left top;
	}
	
	
div.rgtBox h2 {
	font-family:"Arial Narrow", Arial, sans-serif;
	font-size:19px !important;
	}
.rowOffer h2 {
	font-family:"Arial Narrow", Arial, sans-serif;
	font-size:17px !important;
	}
div.rgtBox p, .rowOffer p {
	font-size:13px !important;
	}
.rowOffer p.cta {
	font-size:16px !important;
	}
div.rgtBox label {
	font-size:10px !important;
	}
.third p {
	font-size:14px !important;
	}
	
	
	
.rightCol div.rgtBox .inner {
	float:left;
	width:146px;
	padding:0px 10px;
	}
.rightCol div.rgtBox .addressBox, .rightCol div.rgtBox .addressBox input {
	margin:10px 0 0 0;
	}
.rightCol div.rgtBox .addressBox .txtSml {
	font-size:10px !important;
	margin:0px 0 0 0;
	}
.rightCol .btnSumbitAddress {
   margin:10px 0 0 0;
   border:none;
   background:url(/Resources/Images/Food/btnFindUsNew.jpg) no-repeat left top; 
   width: 73px;
   height: 24px; 
   }
div.rgtBox .inner a {
	color:#54770F;
}
	
/* Content Elements
----------------------------------------------------------------------*/

p.quoteRgt {
	float:right;
	}
p.quoteLft {
	float:left;
	}

p.quoteRgt, p.quoteLft {
  	width:170px;
	color:#fff;
	padding:15px 0 0 0;
	margin:5px 15px 10px 15px; 
 	background:#9BBE5A url(/Resources/Images/Food/quoleft.png) left top no-repeat;
	/*border:1px solid red;*/
	}
* html p.quoteRgt, * html p.quoteLft {
	margin:0 10px 0 7px;
	}
p.quoteRgt strong, p.quoteLft strong, p.quoteRgt b, p.quoteLft b {
	display:block;
	font-weight:normal;
	text-indent: 30px; 
	margin:-15px 0 0 0;
  	padding:15px 15px 20px 10px;
  	background:transparent url(/Resources/Images/Food/quoright.png) right bottom no-repeat;
	/*border:1px solid blue;*/
	}
	
p.quoteRgt strong a, p.quoteLft strong a
{
	color:#ffffff !important;
}


/*
------------------------------------------------------------------------------------*/

.whiteHeading {
	width:539px;
	padding:10px 0 20px 15px;
	margin:0;
	font-family:"Arial Narrow", Arial, Helvetica, sans-serif;
	color:#fff;
	background:#9BBE5A url(/Resources/Images/Food/roundGreenTopCorners.gif) no-repeat left top;
	}
	
.lrgGreenList {
	clear:both;
	width:514px;
	margin:0;
	padding:0 20px 30px 20px;	
	font-size:1.0em;
	color:#fff;
	background:#9BBE5A;
	border-bottom:3px solid #fff;
	}

.lrgGreenList .whiteHeading {
	margin-left: -20px;
	margin-right: -20px;
	margin-bottom: 0px;
}

.lrgGreenList ol, .lrgGreenList ul {
	margin: 0px;
	margin-left: 10px;
	padding:0 0 0px 0px;	
	
}

.lightGreenBg {
	clear:both;
	width:539px;
	margin:0;
	padding:10px 0 0px 15px;
	background:#BAD18B;
	color:#fff;
	}

.lrgGreenList a, .quoteRgt a, .quoteLft a {
	color: #fff;
}

.textXL {
	font-size:1.6em;
	}

.topleftfloatingimage {
	float: left;
	margin: 10px;
	margin-left: 0px;
}

.toprightfloatingimage {
	float: right;
	margin: 10px;
	margin-right: 0px;
}

.introduction {
	display: block;
	clear: both;
}

/* Local Stores
----------------------------------------------------------------------*/

#localStores .contentWide h2 {
	font-size: 2.0em;
	font-weight: normal;
	float: left;
	}

#localStores #virtual {
	float:left;
	width:473px;
	}
#localStores #info {
	float:left;
	margin:0 0 0 10px;
	width:263px;
	}
.corners {
	height:5px;
	}
#localStores .contentWide .inner {
	min-height:193px;
	padding:0px 15px;
	background:#F1F4EB;
	}

#localStores .contentWide a:hover {
	background: none;
	}
	

	
/* Campaigns
----------------------------------------------------------------------*/

#campaignBg { 
       position:relative;
       width:944px;
       height:498px;
       /*border-bottom:1px solid red;*/
       }

#campaignBg #campaignBgImg {	
	position:absolute;
	z-index:1;
	}

#campaignPage #scrollContainer {
	position:absolute;
	left:80px;
	top:335px;
	}


/* Ethical
----------------------------------------------------------------------*/

#ethical {

	}
#fiveBoxes {
	float:left;
	clear:both;
	width:750px;
	margin:10px 0  0 0;
	}
#fiveBoxes img {
	margin:0 0 10px 0;
	}
.fifth {
	float:left;
	width:138px;
	margin:0px 12px 10px 0;
	}
.ethicalBgImg {	
	position:absolute;
	z-index:20;
	}
.banner750 {
	position:relative;
	width:749px;
	height:275px;
	z-index:10;
	}
.banner750txt {
	position:absolute;
	width:500px;
	left:20px;
	top:15px;
	z-index:30;
	color:#fff;
	font-size:1.6em;
	font-weight:bold;
	font-family:"Arial Narrow", Arial, sans-serif;
	}

/* What's Hot
----------------------------------------------------------------------*/

.whatsHotBgImg {	
	position:absolute;
	z-index:20;
	}
#whatsHotBoxes {
	float:left;
	clear:both;
	width:750px;
	margin:10px 0  0 0;
	/*border-top:2px solid red;*/
	}
.rowOffer {
	float:left;
	width:440px;
	height:109px;
	margin:0 0 10px 0;
	background: url(/Resources/Images/Food/whatsHotRowBg.jpg) no-repeat left top;
	/*border-top:2px solid blue;*/
	}
.rowOffer h2 {
	font-family:"Arial Narrow", Arial, sans-serif;
	font-size:1.4em;
	margin:0;
	padding:5px 5px 8px 10px;
	color:#fff;
	}
.rowOffer p {
	color:#fff;
	padding:0 5px 8px 10px;
	}

.newsPanel {
	float:right; 
	width:300px; 
	height:200px; 
/*	border-top:2px solid green;
	border-bottom:2px solid green;*/
	}
.newsPanel h2 {
	font-size:1.3em;
	}
.newsPanel ul {
	padding:0;
	margin:5px 0;
	list-style-type:none;
	}
.newsPanel ul li {
	background:url(/Resources/Images/Food/whatsNewsSmlArw.gif) no-repeat left 3px;
	}
.newsPanel ul li {
	padding:0 0 0 14px
	}
.newsPanel .inner {
	float:left;
	width:272px;
	min-height:218px;
	margin:0;
	padding:0 14px;	
	background:#F1F4EB;
	}
.newsPanel .inner img {
	margin:7px 10px 5px 0;
	}

	
/* Contact Us
----------------------------------------------------------------------*/

#formBox {
	float:left;
	width:473px;
	margin:5px 0 0 0px;	
	}
#formBox .inner {
	float:left;
	width:443px;
	margin:0;
	padding:5px 0;
	}
#address {
	float:left;
	margin:5px 0 0 15px;
	padding:0;
	width:233px;
	}	
.frmgroup {
	float:left;
	clear:both;
	width:430px;
	margin:0;
	padding:3px 5px;
	}
.frmgroup input, .frmgroup select, .frmgroup textarea{
	width:225px;
	}
.frmlabel {
	float:left;
	width:125px;
	}
.btnContact {
	margin:5px 0 5px 130px;
	}