@charset "UTF-8";
/* CSS Document - mag_structure.css */
@import url("../../css/global_custom.css");
.clear { clear:both; }

/* ////////// =H1 padding amend  */
h1 { padding-bottom:10px; }


.introduction {display:inline !important; clear:none;}


/* //////////  Width of content area excluding RHS */
.content { width:703px; }

/* //////////////=Width of RHS banner */
.banner170 { width:223px; } 

/* /////////// =Width of main content banner */


.content .banner749 { width:703px; }
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////


Width of .....?????

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



.content .height50 { width:703px; }
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////


Width of .....?????

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

.content .height65 { width:703px; }
.content554, .content410 { float:left; width:463px; margin:0 0px 0 0; }
.content554 .banner554, .content410 .banner410, .content410 .banner554, .content749 .banner554 { width:463px; height:auto; margin:0 0px 15px 0; }
.content .banner749 { float:left; width:703px; margin:0 0px 15px 0; padding: 0px 0px 0px 0px; }
.content .height50 { float:left; width:703px; height:50px; margin:0 0px 15px 0; }
.height65 { float:left; width:703px; height:50px; overflow:hidden; margin:0 0px 0px 0; }
.banner367 { float:left; width:367px; height:275px; margin:0 0 15px 0; }
.pressbanner367 { float:left; width:367px; height:auto; margin:0 0 15px 0; }
.banner472 { float:left; width:472px; height:275px; margin:0 0 15px 0; }
.banner544 a:hover, .banner367 a:hover, .banner749 a:hover, .banner472 a:hover, .banner262 a:hover { background:none !important; }
.banner262 { float:left; width:262px; height:275px; margin:0 0 15px 0; }
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////


LeftCol - Left hand side Navigation

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

.leftCol, #leftCol { float:left; width:223px; margin: 0 17px 0 0px; }
.leftColNav ul { list-style:none; padding:0; margin:0px 0 0 0; }
.leftColNav li { padding:0px 0 0px 0px; margin:0 0 0 0; }
/* Depth rules for left nav */
.leftColNav li.depth0 { margin: 0px 0 0px 5px; }
.leftColNav li.depth1 { margin: 0px 0 0px 20px; }
.leftColNav li.depth2 { margin: 0px 0 0px 30px; }
.leftColNav li.depth3 { margin: 0px 0 0px 40px; }
.leftColNav li.depth4 { margin: 0px 0 0px 50px; }
.leftColNav li ul li { padding: 0 0 0 10px; margin:0 0 0 0px; border:none; }
.leftColNav a { display:block; margin:0 0 0 0px; padding:5px 0 5px 5px; text-decoration:none; }
.leftColNav .bold { background-color:#d6e9f4; font-weight:bold; padding:5px 0 5px 5px; }
.leftColNav a:hover { display:block; }
.leftColNav li ul { padding:0; margin:0; }
.leftColNav li ul li a:hover { width:96%; }
.leftColNav li { border-bottom:1px solid #eaeaea; }
/* nav - selected content area only

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


.depth0 a:hover { background-color:#d6e9f4; }
.depth1 a, .depth1 a:visited { font-weight:bold; }
.depth1 a:hover { font-weight:bold; }
.depth2 a, .depth2 a:visited { font-weight:bold; }
.depth2 a:hover { font-weight:bold; }
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////


Width of ADbox

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



.AdBox, .FlashAdBox { width:223px; }
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////


Width of right col

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

.rightCol, #rightCol { width:223px; }





.stafRightBanners { float:none; margin-right:auto; width:703px; }
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////









CALL TO ACTION AMENDS

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



.cta h3 { font-size:1.2em; padding:0px 10px 5px 10px; margin:0; }
.cta .description { padding:0 0px 5px 0px; }
.cta .inner { padding: 0px 5px 5px 5px; }
.cta .callToAction { text-decoration:none; font-weight:bold; padding:0px 6px 0px 0px; }
.cta .callToAction:hover { text-decoration:underline; }
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////


/* coloured panel 1 - default colour panel

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


.colourPanel1 { padding-top:5px; padding-bottom:5px; margin-bottom:10px; }
.colourPanel1 p { margin-left:10px; padding-right:10px; }
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////


/* coloured panel 2 - secondary colour panel, default colour blue

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


.colourPanel2 { padding-top:5px; padding-bottom:5px; margin-bottom:10px; background-color:#d6e9f4; }
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////


/* oneAndTwo - picture (width 224px) with text floated besides - to be used on landing pages

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


.oneAndTwo { padding-top:15px; }
.oneAndTwo img { float:left; margin-right:15px; }
.oneAndTwo h2 { font-family: "Arial Narrow"; font-size:2.125em; font-weight:normal; padding:0; margin:0; margin-top:10px; }
.oneAndTwo p { }
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////


/* bold text

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

.textHighlight { font-weight:bold; }
.content .extraBox { width:703 px; padding-top:10px; }
.content .roundedBox .innerBox .text { padding:10px 0 0 10px; width:232px; }
.content .roundedBox .innerBox { width:350px; float:left; }
.content554 .extraBox { width:463px; padding-top:10px; }
.content554 .roundedBox .innerBox { width:206px; float:left; }
.content554 .roundedBox .innerBox .text { padding:10px 0 0 10px; width:111px; }
.content749 .extraBox { width:703px; padding-top:10px; }
.content749 .roundedBox .innerBox .text { padding:10px 0 0 10px; width:232px; }
.content749 .roundedBox .innerBox { width:350px; float:left; }
.contentWide .roundedBox .innerBox .text { padding:10px 0 0 10px; width:330px; }
.contentWide .roundedBox .innerBox { width: 447px; float:left; }
.roundedBox .innerBox .image { float:right; width:75px; }
.roundedBox .innerBox .image img { float:right; width:75px; }
img.contentFloatRight { float:right; }
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////


RESET Quicklinks colour to masterbrand

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


.quickLinks h2 { color:#000066 }
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////


Introduction - bold text for intros - colour set within area stylesheet

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

.introduction { font-weight:bold; }
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////


Large text - takes on styling of H2

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

.textXL { font-family: "Arial Narrow"; font-size:2.125em; font-weight:normal; padding:0; margin:0; }
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////

Start of Magazine Navigation styling - Active link colour is set within colours documents

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

.magNav { margin-left:20px; margin-top:10px; width:964px; height:40px; }
.magNav ul { list-style: none; padding: 0; margin: 0; }
.magNav li { float: left; margin: 0 15px 0px 0px; border: 1px solid #eaeaea; vertical-align: middle; }
.magNav li a { font:Georgia, "Times New Roman", Times, serif; font-family:Georgia, "Times New Roman", Times, serif; font-size:1.2em; line-height: 1.2em; float: left; width: 143px; height: 28px; display: block; color: #cccccc; text-decoration: none; text-align: center; padding-top:9px; }
.magNav li a:hover { background-color:#FFFFFF; color:#737373; }
.magNav li.navLeisure a { color:#E65D06; }
.magNav li.navLeisure a:hover { background-color:#FF6600; color:#000066; }
.magNav li.navHealth a:hover { background-color:#208080; color:#FFFFFF; }
.magNav li.navHealth a { color:#05705E; }
.magNav li.navFood a { color:#3D7D00; }
.magNav li.navFood a:hover { background-color:#3D7D00; color:#FFFFFF; }
.magNav li.navLife a { color:#006b95; }
.magNav li.navLife a:hover { background-color:#006b95; color:#FFFFFF; }
.magNav li.navCo-opLife a { color:#000066; }
.magNav li.navCo-opLife a:hover { background-color:#000066; color:#FFFFFF; }
.magNav li.navInteract a { color:#cc0000; }
.magNav li.navInteract a:hover { background-color:#cc0000; color:#FFFFFF; }
.magNav li a.active { color:#FFFFFF; background-color:#ff843c; }
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////

Hide breadcrumbs

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


.CrumbTrail { display: none; visibility:hidden; }
/* ////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////////////////////////////////////

RHS find a store banner

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

.findaStore { width:223px; margin-bottom:1px; }
.findaStore .bottom { width:223px; height:10px; }
.findaStore .content { width:203px; padding:15px 10px 10px 10px; }
.findaStore h2 { margin:0 0 10px 0; padding:0; }
.findaStore .button { border:none; width:107px; height:32px; float:right; margin:20px 20px 0 0; cursor:pointer; }
.findaStore .input { margin:10px 0 0 0; width:140px; }
.findaStore label { font-size:0.7em; }
.addressBox input.noTopMargin { margin-top:0px; }
/* /////////////////////////////////

 EAT WELL CAMPAIGN CSS

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

.eatWellNav { padding-bottom:10px; } /* container to hold the nav */
.eatWellNav ul { margin:0; padding:0; list-style-type:none; float:right; width:280px; color:#999999; } /* IE styling for the nav links, non links are coloured grey */
.eatWellNav ul { margin:0; padding:0; list-style:none; float:right; width:280px; color:#999999; } /* FIREFOX styling for the nav links, non links are coloured grey */
.eatWellNav ul li { display:block; width:90px; float:left; text-align: center; } /* float the nav links nav links to the right of the container and center the text to image */
.eatWellNav ul a { display:block; width:90px; color:#000000; } /* styling for the nav links (text only) */
.eatWellNav ul a:hover { background:none; font-weight:bold; } /* override inherited background color and set to bold*/
.eatWellNav ul a:visited { color:#000000; } /* override inherited grey text color for visited links*/
.eatWellNav ul img { display:block; width:90px; } /* set images to block so text wraps beneath */
.descImg { float:left; } /* float the big image to the left of the nav links */
/* /////////////////////////////////

 END OF - EAT WELL CAMPAIGN CSS

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

/* Book Mark
----------------------------------------------------------------------*/

.bookMarkBox { clear:both; margin:20px 0 20px 0; height:50px; background:url(/Resources/Images/bgBookMarks.jpg) repeat-x left bottom; border:solid 1px #eaeaea; padding:10px; }
.bookMarkBox .bookmarkWith h4 { font-size:1em; }
.bookMarkboth { margin-left:auto; margin-right:auto; width:549px; }
.bookMarkleftOnly { margin-left:auto; width:703px; }
.bookMarkrightOnly { margin-right:auto; width:703px; }

/* end of boomarks
----------------------------------------------------------------------*/

.comments {
float:none !important;
left:auto;
margin-bottom:0;
margin-left:auto !important;
margin-right:auto !important;
margin-top:0;
position:relative;
right:auto;
width:554px !important;
}