/* Page Structure*/

@import url("content.css");

/* TOC

1: - Main Page Structure

2: - Main Content Area + Colour Coding

3: - Main Navigation


*/


/* 1-:-------- Main Page Structure ------------ */

	html, body, form, object {
		margin:0;
		padding:0;
	}

	body {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 12px;
		line-height: 130%;
		color: #666;
		background:url(../images/elements/header-bg.jpg) center top repeat-x;
		}
		
	#wrapper {
		width: 960px;
		margin: 0px auto;
		padding: 0;
		position:relative;
	}
		
	#header {
		width:965px;
		height:148px;
		padding:0;
		float:left;
		position:relative;
		z-index:2;
	}

	#content {
		width:965px;
		margin:0;
		padding:10px 0 60px 0;
		float:left;
		position:relative;
	}
	
	#footer {
		background:url(../images/elements/footer-bg.gif) left top repeat-x;
		padding:30px 0 0 120px;
		margin:0;
		height:40px;
		width:875px;
		float:left;
	}

		
/* 2-:-------- Main Content Area + Colour Coding ------------ */
	
	.mainContent {
		width:965px;
		clear:left;
		float:left;
	}
	
	.halfCol {
		width:495px;
		float:left;
	}
	
	.emailerCol {
		float:left;
		width:575px;
	}
	
	.rightCol {
		width:470px;
		float:left;
	}
	
	.twothirds {
		width:300px;
		float:left;
	}
	
	.onethird {
		width:160px;
		float:right;
	}
	
	.addMargin {
		margin-right:10px;
	}

	
	.email h1, .email h3, .email a { color: #c81827; }
	.home #slideshow h2 { background-position:left -184px; }
	.home #slideshowPager a { background-color:#84141e; } 
	.home #slideshowPager li.active a { color:#84141e; } 

	
	.healthyEating h1, .healthyEating h3, .healthyEating h4 a, .healthyEating a .title, .healthyEating .arrowLink span { color:#92951a; }
	.newArticles .healthyEating span.section { background-color:#92951a; }
	.healthyEating h4 a:hover { color:#5d5f0f; }
	.healthyEating #slideshowPager a { background-color:#606212; } 
	.healthyEating #slideshowPager li.active a { color:#606212; } 
	.healthyEating .panelContent { background-color:#e9ead1; }
	.healthyEating .arrowLink { background-position:right -350px; }
	.healthyEating .arrowLink:hover { background-position:right -375px; }
	
	.cookingWithKids h1, .cookingWithKids h3, .cookingWithKids h4 a, .cookingWithKids a .title, .cookingWithKids .arrowLink span { color:#e17600; }
	.newArticles .cookingWithKids span.section { background-color:#e17600; }
	.cookingWithKids #slideshow h2, .cookingWithKids .hero h2 { background-position:left -46px; }
	.cookingWithKids h4 a:hover { color:#be6502; }
	.cookingWithKids #slideshowPager a { background-color:#9d5606; } 
	.cookingWithKids #slideshowPager li.active a { color:#9d5606; } 
	.cookingWithKids .panelContent { background-color:#f9e4cc; }
	.cookingWithKids .arrowLink { background-position:right -400px; }
	.cookingWithKids .arrowLink:hover { background-position:right -425px; }
	.cookingWithKids .panelHeader {	background-position:left -200px; }
	.cookingWithKids .button { background-position:right -44px; }
	.cookingWithKids .button span { background-position:left -44px; }
	.cookingWithKids .button:hover { background-position:right -66px; }
	.cookingWithKids .button:hover span { background-position:left -66px; }
	
	
	.cookingTips h1, .cookingTips h3, .cookingTips .panelHeader h3, .cookingTips h4 a, .relatedPanel #relCookingTipsPanel h4 a, .cookingTips .arrowLink span { color:#438008; }
	.cookingTips #slideshow h2, .cookingTips .hero h2 { background-position:left -138px; }
	.cookingTips h4 a:hover, .relatedPanel #relCookingTipsPanel h4 a:hover { color:#406a19; }
	.cookingTips #slideshowPager a { background-color:#883107; } 
	.cookingTips #slideshowPager li.active a { color:#883107; } 
	.cookingTips .panelContent { background-color:#fff; }
	.cookingTips .arrowLink { background-position:right -150px; }
	.cookingTips .arrowLink:hover { background-position:right -175px; }
	.cookingTips .panelHeader {	background-position:left -200px; }
	.cookingTips .halfCol .panelHeader, .halfCol .cookingTips .panelHeader { background-position:left 0px; }
	.cookingTips .halfCol .panelContent, .halfCol .cookingTips .panelContent { background:transparent url(../images/elements/cooking-tips-panel-bg.jpg) left top no-repeat; padding-bottom:10px; }
	.cookingTips .button { background-position:right -132px; }
	.cookingTips .button span { background-position:left -132px; }
	.cookingTips .button:hover { background-position:right -154px; }
	.cookingTips .button:hover span { background-position:left -154px; }
	
	.ourFood h1, .ourFood h3, .ourFood h4 a, .relatedPanel #relArticlesPanel h4 a, .ourFood a .title, .ourFood .arrowLink span, .ourFood .article a { color:#cc4402; }
	.newArticles .ourFood span.section { background-color:#cc4402; }
	.ourFood #slideshow h2, .ourFood .hero h2 { background-position:left -138px; }
	.ourFood h4 a:hover, .relatedPanel #relArticlesPanel h4 a:hover { color:#a63600; }
	.ourFood #slideshowPager a { background-color:#883107; } 
	.ourFood #slideshowPager li.active a { color:#883107; } 
	.ourFood .panelContent { background-color:#faece5; }
	.ourFood .arrowLink { background-position:right -250px; }
	.ourFood .arrowLink:hover { background-position:right -275px; }
	.ourFood .panelHeader {	background-position:left -200px; }
	.ourFood .button { background-position:right -132px; }
	.ourFood .button span { background-position:left -132px; }
	.ourFood .button:hover { background-position:right -154px; }
	.ourFood .button:hover span { background-position:left -154px; }
	
	.glossary h1, .glossary h3, .glossary h4 a, .glossary a .title, .glossary .arrowLink span { color:#434dbc; }
	.glossary #slideshow h2, .glossary .hero h2 { background-position:left -230px; }
	.glossary h4 a:hover { color:#a63600; }
	.glossary #slideshowPager a { background-color:#883107; } 
	.glossary #slideshowPager li.active a { color:#883107; } 
	.glossary .halfCol .panelHeader { background-position:left -300px; }
	.glossary .panelContent { background-color:#edeefa; }
	.glossary .arrowLink { background-position:right -250px; }
	.glossary .arrowLink:hover { background-position:right -275px; }
	.glossary .panelHeader {	background-position:left -200px; }
	
	.blog h1, .blog h3, .blog h4 a, .blog a, .blog .arrowLink span, .blog .articleInfo a, .articlePagination ul li a { color:#1db3b3; }
	.blog #slideshow h2, .blog .hero h2 { background-position:left -92px; }
	.blog h4 a:hover, .blog .articleInfo a:hover, .articlePagination ul li a:hover  { color:#098f8f; }
	.blog #slideshowPager a { background-color:#098f8f; } 
	.blog #slideshowPager li.active a { color:#098f8f; } 
	.blog .panelContent { background-color:#eafdfd; }
	.blog .arrowLink { background-position:right -450px; }
	.blog .arrowLink:hover { background-position:right -475px; }
	.blog .panelHeader {	background-position:left -400px; }
	.blog .lightPanel .panelHeader {	background-position:left -300px; }
	.blog .lightPanel .panelHeader h3 { color:#0facac; }
	.blog .lightPanel .panelContent, .home .blog .panelContent { background-color:#c7f1f1; }
	.blog .lightPanel .panelContent .articlePreview:hover, .blog .panelContent .articlePreview:hover  { background-color:#effefe; cursor:pointer; border-color:#1DB3B3 ! important; }
	.blog .button { background-position:right -88px; }
	.blog .button span { background-position:left -88px; }
	.blog .button:hover { background-position:right -110px; }
	.blog .button:hover span { background-position:left -110px; }
	
	.newInStore h1, .newInStore h3, .newInStore h4 a, .newInStorePanel .arrowLink span, .newInStorePanel .articleItem .articleInfo a, .newInStorePanel h4 a { color:#2e8c92; }
	
	.newInStorePanel .articlePreview { border:solid 1px #fff; }
	
	.newInStorePanel h4 a:hover, .newInStorePanel .articleItem .articleInfo a:hover  { color:#166e74; }
	.newArticles .newInStore span.section { background-color:#2E8C92; }	
	.newInStorePanel .panelContent { background-color:#d5e8e9; }
	.newInStorePanel .arrowLink { background-position:right -200px; }
	.newInStorePanel .arrowLink:hover { background-position:right -225px; }
	.newInStorePanel .panelHeader {	background-position:left -600px; }
	.newInStorePanel li:hover {border:solid 1px #166e74 ! important;cursor:pointer;}
	.newArticles .newInStore span.title {color:#2E8C92;}
	
	.recipes h1, .recipes h3, .recipes h4 a, .recipes h4, .recipes a .title, .recipes .arrowLink span, .recipeDetail a { color:#712d92; }
	.recipes h4 a:hover { color:#470c64; }
	.recipes .panelContent { background-color:#f3ebf7; }
	.recipes .arrowLink { background-position:right -400px; }
	.recipes .arrowLink:hover { background-position:right -425px; }
	.recipes .panelHeader {	background-position:left -500px; }
	.recipes .button { background-position:right -44px; }
	.recipes .button span { background-position:left -44px; }
	.recipes .button:hover { background-position:right -66px; }
	.recipes .button:hover span { background-position:left -66px; }
	
	
	.recipePanel .panelHeader {	background-position:left -100px; }
	.recipePanel .panelHeader h3, .recipePanel h4 a, .relatedPanel #relRecipesPanel h4 a, .newRecipes h3, .newRecipes h4 a, .newRecipes .articleItem span.title, .recipePopupHolder span.title, .calendarPopupHolder span.title { color:#6e2b8e; }
	.recipePanel h4 a:hover, .relatedPanel #relRecipesPanel h4 a:hover { color:#4b1266; }
	.recipePanel .panelContent { background-color:#f3ebf7 !important; }
	.recipePanel .panelContent .articlePreview:hover { background-color:#fbf6fd; cursor:pointer; }
	.recipePanel .panelHeader .arrowLink { background-position:right -300px; }
	.recipePanel .panelHeader .arrowLink:hover { background-position:right -325px; }
	.recipePanel .panelHeader .arrowLink span { color:#6e2b8e; }
	.recipePanel .thumbListing li .thumbCaption { background: url(../images/elements/recipes-caption-trans.png) repeat 0 0; }
	.recipePanel .thumbListing li a:hover .thumbCaption { background:#bb76d1 none; } 
	.halfCol .recipePanel .panelContent { background:transparent url(../images/elements/recipe-panel-bg.jpg) left top no-repeat !important; padding-bottom:10px; }
	
	
	.recipeFinder .panelHeader { background-position:left -500px; }
	.recipeFinder .panelContent { background:#EFF8FD url(../images/elements/recipeFinder-bg.jpg) left bottom no-repeat !important; position:relative; }
	
	.article a:hover { text-decoration:underline; }
	

	
	

/* 2-:-------- Main Navigation ------------ */	
	
	.mainNav {
		position:absolute;
		top:114px;
		left:-3px;
		width:915px;
		margin:0;
		height:34px;
		display:block;
	}
	
	.mainNav li {
		float:left;
		height:34px;
		margin:0 1px 0 0;
	}
	
	.mainNav li a {
		display:block;
		height:34px;
		text-indent:-10000px;
		background: transparent url(../images/elements/main-nav.gif) left top no-repeat;
	}
	
	.mainNav li a:hover {
		cursor:pointer;
	}
	
	.mainNav li a.navHome {	width:65px; background-position:0 0;	}
	.mainNav li a.navRecipes { width:83px; background-position:-65px 0; }
	.mainNav li a.navCookingTips { width:114px; background-position:-148px 0; }
	.mainNav li a.navOurFood { width:88px;  background-position:-261px 0; }
	.mainNav li a.navCookingWithKids { width:146px;  background-position:-349px 0; }
	.mainNav li a.navHealthyEating { width:124px;  background-position:-495px 0; }
	.mainNav li a.navNewInStore { width:115px; background-position:-619px 0; }
	.mainNav li a.navBlogs { width:70px; background-position:-734px 0; }
	.mainNav li a.navGlossary { width:90px; background-position:-804px 0; }
	
	.mainNav li a.navHome:hover { background-position:0 -34px;	}
	.mainNav li a.navRecipes:hover { background-position:-65px -34px; }
	.mainNav li a.navCookingTips:hover { background-position:-148px -34px; }
	.mainNav li a.navOurFood:hover {  background-position:-261px -34px; }
	.mainNav li a.navCookingWithKids:hover {  background-position:-349px -34px; }
	.mainNav li a.navHealthyEating:hover { background-position:-495px -34px; }
	.mainNav li a.navNewInStore:hover { background-position:-619px -34px; }
	.mainNav li a.navBlogs:hover { background-position:-734px -34px; }
	.mainNav li a.navGlossary:hover { background-position:-804px -34px; }
	
	.mainNav li.active a.navHome { background-position:0 -68px;	}
	.mainNav li.active a.navRecipes { background-position:-65px -68px; }
	.mainNav li.active a.navCookingTips { background-position:-148px -68px; }
	.mainNav li.active a.navOurFood {  background-position:-261px -68px; }
	.mainNav li.active a.navCookingWithKids {  background-position:-349px -68px; }
	.mainNav li.active a.navHealthyEating { background-position:-495px -68px; }
	.mainNav li.active a.navNewInStore { background-position:-619px -68px; }
	.mainNav li.active a.navBlogs { background-position:-734px -68px; }
	.mainNav li.active a.navGlossary { background-position:-804px -68px; }

	
		/* Zoltan's stylesheet - To be merged into main CSS at the end of the day init */



.flashContainer {margin:-9px 0 0 -7px;}
	
.recipes #slideshow h2 {
	background:url(../images/elements/slideshow-title-bg.png) repeat-x left -276px;
	}
.recipes #slideshowPager li.active a {
	color:#702C91 ! important;
	}

.recipes h1, .recipes h3, .recipes h4 a, .recipes a .title, .recipes .arrowLink span , .recipes .halfCol .panel .panelHeader h3  { color:#702C91; }
.newArticles .recipes span.section { background-color:#cc4402; }
.recipes h4 a:hover { color:#a63600; } 
.recipes .halfCol .panelHeader {
	background:url(../images/elements/big-panel-header.jpg) no-repeat 0 -97px;
	}
	
.recipes .thumbListing li .thumbCaption {
background:url("../images/elements/recipes-caption-trans.png") repeat scroll 0 0 transparent;
}
.recipes .thumbListing li a:hover .thumbCaption {	
	background:#702C91;
	}
	
.healthyEating .articleInfo a, .healthyEating .articlePagination ul li a {
	color:#92951A;
	}
.articlePagination ul li.active a {
	color:#333;
	}
.articlePagination {
	margin:1px 0 7px;
	width:484px;
	}
.listingPage .articleItem img {
	width:95px;
	}

.listingPage .articleItem .articlePreview {	
	margin-left:105px;
	}
.articleListing.recipePanel .thumbListing {
	width:480px;
	}
	
.articleListing.recipePanel .thumbListing li {
	margin-right:9px;
	}
.recipes .articlePagination ul li a {
	color:#692987;
	}
.recipes .articlePagination ul li.active a {
	color:#333;
	}
	
.recipePanel .panelContent .articlePreview {
	margin:0;
	}
	
.previewListing li {
	margin-bottom:10px;
	border:solid 1px white;
	display:block;
	overflow:hidden;
	}
.previewListing li:hover {
	border:solid 1px #D1A3E0;
	}
.previewListing li .articlePreview {
	width:auto;
	}
.previewListing li ul.recipeInfo {	
	margin:0;
	}
.previewListing li ul.recipeInfo li, .previewListing li ul.recipeInfo li:hover, li.starRating , li.starRating:hover {	
	border:0;
	}
.previewListing li ul.recipeInfo li {
	margin:0;
	}
	
	
.newInStore #slideshow h2, .hero h2 {
	background:url("../images/elements/slideshow-title-bg.png") repeat-x scroll left -322px;
	}
.newInStore #slideshowPager li a {
	background:#266A6E;
	}
.newInStore #slideshowPager li.active a {
	color:#266A6E;
	background:#fff;
	}
.newInStore .halfCol .panelHeader {
	background:url("../images/elements/big-panel-header.jpg") no-repeat scroll left -200px transparent;
	}
.newInStore .halfCol .panel .panelHeader h3  {
	color:#2E8C92;
	}
.newInStore .thumbListing li .thumbCaption {
	background:url("../images/elements/new-caption-trans.png") repeat 0 0;
	}
.newInStore .thumbListing li .thumbCaption:hover, .newInStore .thumbListing li a:hover .thumbCaption {
	background-color:#266A6E;
	background-image:none;
	}
.cookingWithKids .thumbListing li .thumbCaption {
	background:url("../images/elements/cooking-with-kids-trans.png") repeat 0 0;
	}
.cookingWithKids.thumbListing li .thumbCaption:hover, .cookingWithKids .thumbListing li a:hover .thumbCaption {
	background-color:#E17600 ! important;
	background-image:none;
	}
.ourFood .thumbListing li .thumbCaption {
	background:url("../images/elements/our-food-trans.png") repeat 0 0;
	}
.ourFood .thumbListing li .thumbCaption:hover, .ourFood .thumbListing li a:hover .thumbCaption {
	background-color:#CC4402;
	background-image:none;
	}
.healthyEating .thumbListing li .thumbCaption {
	background:url("../images/elements/healthy-eating-trans.png") repeat 0 0;
	}
.healthyEating .thumbListing li .thumbCaption:hover, .healthyEating .thumbListing li a:hover .thumbCaption {
	background-color:#92951A ! important;
	background-image:none;
	}
	
.fullWidth {
	width:800px;
	float:left;
	}
.fullWidth .thumbListing {
	width:771px;
	border-top:solid 1px #ccc;
	border-bottom:solid 1px #ccc;
	padding:10px 0;
	margin:0 10px 10px 0;
	
	}	
.fullWidth .articlePagination {
	width:400px;
	float:right;
	margin:0 24px 5px 0;
	}
	
.glossary .halfCol .panelHeader {
	background-position:left -397px;	
	}
.glossary .halfCol .panelHeader h3 {	
	color:#434DBC;
	}
.glossary .thumbListing li .thumbCaption {
	background:url("../images/elements/glossary-caption-trans.png") repeat scroll 0 0 transparent;
	}
.glossary .thumbListing li .thumbCaption:hover, .glossary .thumbListing li a:hover .thumbCaption {
	background-color:#434DBC;
	background-image:none;
	}
.glossary #slideshowPager a {
	background-color:#363D8E;
	}
.glossary #slideshowPager li.active a {
	color:#434DBC;
	}

.cookingTips .articlePagination ul li a {
	color:#438008;
	}
.cookingTips .articlePagination ul li.active a, .cookingTips .articlePagination ul li a:hover  {
color:#333;
}

.articleListing .recipeInfo li {
	float:none;
	margin:0 0 10px 0;
	padding:0 15px 0 20px;
	border:0;
	color:#666;
	}
.articleListing .recipeInfo .starRating {
	background-image:none;
	margin-left:-20px;
	}
.articleListing  .recipeInfo li.recipeServes {
	background-position:1px -75px;
	}
.articleListing  .recipeInfo li.recipeTakes {
	background-position:1px -50px;
	}
.articleListing  .recipeInfo li.recipeCosts {
	background-position:1px -25px;
	}
.recipes .articleListing {
	border: 0;
	width:490px;
	overflow:hidden;
	border-top: solid 1px #EBEBEB;
	}
.recipes .articleListing .articleItem {
	border:0;
	border-bottom:solid 1px #EBEBEB;
	overflow:visible;
	padding:15px 0 0 15px;
	height:143px;
	margin:0;
	}
.recipes .articleListing .articleItem:hover {
	background:url(../images/elements/recipes-search-item.gif) no-repeat 0 0;
	border-bottom:solid 1px white;
	}
.recipes .articleListing a:hover {
	color:#333;
	}
table.gsc-search-box  {
	background:url(../images/elements/search-lozenge.gif) no-repeat scroll 0 0 transparent;
	margin-left:-5px;
	width:490px;
	height:100px;
	}
	
table.gsc-search-box td {
	vertical-align:middle;
	}	
td.gsc-search-button {
	width:1%;
	}
td.gsc-clear-button  {
	width:41px;
	}
table.gsc-search-box td.gsc-input {
	height:77px;
	padding-left:30px;
	padding-right:2px;
	}
.gsc-input {
	width:360px;
	}
.gsc-branding {
	display:none;
	}
	
.twitterBlogPanel .panelContent {
	padding-top:13px;
	}
.twitterBlogPanel .articlePreview {
	margin:0 4px;
	}
.twitterBlogPanel .articlePreview:hover {
	background-color:#fff ! important;
	cursor:normal;
	}
.twitterBlogPanel .dateTwitter {
	margin:0 0 13px 4px;
	padding:2px 0 0 35px;
	height:20px;
	background:url(../images/elements/twitter-bg.gif) no-repeat 0 0;
	float:left;
	width:239px;
	font-size:11px;
	}
.recipeFinder h3 {
	color:#fff ! important;
	}
#flashContainer:focus, #flashContainer:hover, #flashContainer:active, #flashContainer object:focus, #flashContainer object:active, #flashContainer object:hover  {
	outline:0;
	}
	
.articlePreview .landscapeThumb img {
	margin-top:-10px;
	}