* { margin: 0; padding: 0; border: none; }
#print_preview_header { display: none; }
body { font-family: "Lucida Grande" , Verdana, Arial, Helvetica, sans-serif; font-size: 12px; /* Resets 1em to 10px */ color: #333333; text-align: center; background: #DEDEDE; }
img { border: 0; }
button, input, textarea, select { font-family: "Lucida Grande" , Verdana, Arial, Helvetica, sans-serif; }
input, textarea, select { border: 1px solid #DDDDDD; padding: 0.3em; }
.checkbox input { background: none; } 
a { text-decoration: none; }
a:focus { outline: 0; }
a:hover { text-decoration: underline; }
p { margin: 0.8em 0; padding: 0; }
h1, h2, h3, h4, h5, h6 { margin: 0.8em 0; padding: 0; font-weight: bold; }
h1 { font-size: 2em; }
h2 { font-size: 1.4em; margin-top: 1.8em; }
h3 { font-size: 1.2em; }
table { width: 100%; border-collapse: collapse; }
table th { border-bottom: 1px solid #ccc; padding: 0.5em; text-align: left; }
ul, ol { margin: 0; padding: 0 0 0 20px; }

/* =generic */
html, body { height: 100%; }
body { font-family: "Georgia", Verdana, Arial, Helvetica, sans-serif; color: #811212; background: url(/Content/Img/backgrounds/body-bg.gif) top left repeat-x; } /* Overwrite reset */
.flavour { background: none; }
p {	font-size: 1.2em; margin: 0 0 0.8em 0; }
p.last { margin: 0; }
a { font-family: "Georgia", Verdana, Arial, Helvetica, sans-serif; color: #811212; text-decoration: underline; }
.container { width: 980px; min-width: 980px; margin: 0 auto; z-index: 1; text-align: left; }
input, textarea, select { border: 1px solid #8F8062; padding: 0pt; }

#top-left { position: absolute; top: 0; left: 0; background: url(/Content/Img/backgrounds/top-left-bg.jpg) top left no-repeat; width: 160px; height: 517px; z-index: 2; }
#top-right { position: absolute; top: 0; right: 0; background: url(/Content/Img/backgrounds/top-right-bg.jpg) top right no-repeat; width: 160px; height: 517px; z-index: 3; }
#bot-left { position: absolute; bottom: 0; left: 0; background: url(/Content/Img/backgrounds/bottom-left-bg.jpg) top left no-repeat; width: 482px; height: 270px; }
#bot-right { position: absolute; bottom: 0; right: 0; background: url(/Content/Img/backgrounds/bottom-right-bg.jpg) top right no-repeat; width: 482px; height: 270px; }

/* =header */
#header { background: url(/Content/Img/backgrounds/header-bg.jpg) top left repeat; min-width: 980px; position: relative; width: 100%; }
#header .container { height: 104px; position: relative; text-align: center; z-index: 100; }
#logo { position: absolute; top: 0; left: 80px; background: url(/Content/Img/backgrounds/greggs.gif) top left no-repeat; text-indent: -9999em; width: 80px; height: 116px; z-index: 999; }

/* =nav */
#nav { background: url(/Content/Img/backgrounds/page-bg.gif) top left repeat; }
#nav .container { background: url(/Content/Img/backgrounds/page-bg.gif); height: 31px; }
#nav ul { list-style: none; margin: 0 auto; width: 472px; }
#nav ul li { display: inline; line-height: 31px; height: 31px; }
#nav ul li a { float: left; text-indent: -9999em; display: block; height: 30px; line-height: 30px; background: url(/Content/Img/backgrounds/nav-li-bg.gif) no-repeat; }
#nav ul li#manifesto a { background-position: 10px -35px; width: 85px; }
#nav ul li#manifesto a:hover { background-position: 10px 1px; }
#nav ul li#steps a { background-position: -75px -35px; width: 70px; }
#nav ul li#steps a:hover { background-position: -75px 1px; }
#nav ul li#flavourscope a { background-position: -145px -35px; width: 116px; }
#nav ul li#flavourscope a:hover { background-position: -145px 1px; }
#nav ul li#tips a { background-position: -261px -35px; width: 106px; }
#nav ul li#tips a:hover { background-position: -261px 1px; }
#nav ul li#feedback a { background-position: -367px -35px; width: 89px; }
#nav ul li#feedback a:hover { background-position: -367px 1px; }

/* =page */
#page { background: #FAFCF6; min-height: 381px; }
#page .container { background: #FAFCF6; }
#page .container #content { width: 705px; margin: 0 auto; position: relative; min-height: 300px; height: auto !important; height: 400px; z-index: 3; }
		
/* =hints and tips */
#hints-tips { background:url(/Content/Img/backgrounds/hints-tips.gif) 0px 100px no-repeat; min-height: 550px; height: auto !important; height: 498px; }
#hints-tips #heading { padding-left: 240px; float: left; display: inline; }
#hints-text { float: left; clear: both; width: 313px; text-align: center; }
#hints-text p { padding-left: 80px; padding-top: 120px; }

/* more tips */
#more-tips #heading { padding-left: 240px; float: left; display: inline; margin-bottom: 21px; margin-top: 12px; }
#more-tips-list { clear: both; text-align: center; width: 100%; height: auto; }
#more-tips #back-to-top { width: 100%; text-align: center; clear: both; padding-top: 24px; }
#more-tips #more-tips-list .archived-tip { width: 100%; float: left; margin-top: 13px; }
#more-tips #more-tips-list .left { float: left; }
#more-tips #more-tips-list .right { float: right; }
#more-tips #more-tips-list p { width: 398px; text-align: center; }

/* hints */
#taste { background: url(/Content/Img/hintstips/taste.gif) top left no-repeat; position: absolute; bottom: 92px; bottom: expression('40px'); left: 60px; height: 36px; width: 67px; text-indent: -9999em; cursor: pointer; }
#taste.hover { background: url(/Content/Img/hintstips/taste-h.gif) 0px -4px no-repeat; width: 99px; height: 86px; bottom: 66px; bottom: expression('16px'); left: 55px; }
#smell { background: url(/Content/Img/hintstips/smell.gif) top left no-repeat; position: absolute; bottom: 127px; bottom: expression('70px'); left: 260px; height: 41px; width: 63px; text-indent: -9999em; cursor: pointer; }
#smell.hover { background: url(/Content/Img/hintstips/smell-h.gif) 0px -4px no-repeat; width: 92px; height: 90px; bottom: 90px; bottom: expression('38px'); left: 250px; }
#play { background: url(/Content/Img/hintstips/play.gif) top left no-repeat; position: absolute; top: 245px; left: 340px; height: 45px; width: 63px; text-indent: -9999em; cursor: pointer; }
#play.hover { background: url(/Content/Img/hintstips/play-h.gif) 0px -4px no-repeat; width: 92px; height: 90px; top: 230px; left: 325px; }
#feel { background: url(/Content/Img/hintstips/feel.gif) top left no-repeat; position: absolute; top: 170px; left: 245px; height: 41px; width: 63px; text-indent: -9999em; cursor: pointer; }
#feel.hover { background: url(/Content/Img/hintstips/feel-h.gif) 0px -4px no-repeat; width: 92px; height: 90px; top: 150px; left: 235px; }
#look { background: url(/Content/Img/hintstips/look.gif) top left no-repeat; position: absolute; top: 120px; left: 55px; height: 41px; width: 63px; text-indent: -9999em; cursor: pointer; }
#look.hover { background: url(/Content/Img/hintstips/look-h.gif) 0px -4px no-repeat; width: 92px; height: 90px; top: 100px; left: 40px; }
#hear { background: url(/Content/Img/hintstips/hear.gif) top left no-repeat; position: absolute; top: 285px; left: -20px; height: 43px; width: 74px; text-indent: -9999em; cursor: pointer; }
#hear.hover { background: url(/Content/Img/hintstips/hear-h.gif) 0px -4px no-repeat; width: 92px; height: 90px; top: 260px; left: -25px; }
dl#hints dd { display: none; }
/* tips */
#alisons-tips { float: left; position: absolute; top: 98px; left: 415px; }
#alisons-tips p { text-align: center; width: 256px; }
#alisons-tips .prev { background: url(/Content/Img/hintstips/prev.gif) top left no-repeat; margin-right: 15px; }
#alisons-tips .next { background: url(/Content/Img/hintstips/next.gif) top left no-repeat; }
#alisons-tips .prev, #alisons-tips .next { width: 10px; height: 12px; }
#alisons-tips .prev:hover, #alisons-tips .next:hover { cursor: pointer; }
#alisons-tips #tip, #bio { left: 105px; position: absolute; top: 150px; }
#hints-tips #bio, #hints-tips #blurb { display: none; margin: 0; }
#hints-tips #blurb, #hints-tips #buttons { float: left; padding-top: 20px; width: 280px; } 
#hints-tips #buttons { height: 20px; margin-bottom: 26px; }
#hints-tips #blurb { height: 125px; overflow: hidden; margin-top: 10px; margin-left: 15px; }

/* carousel */
#hints-tips .carousel-case { height: 125px; overflow: hidden; margin-top: 10px; }
.js #hints-tips .carousel-case { margin-left: 15px; }
#hints-tips .carousel-case li  { list-style-type: none; height: 125px; }
#hints-tips button { display: none; }
/* js on*/
.js #hints-tips button { display: inline; }
.js .carousel-case li { height: 65px; width: 256px; }
/* =signup */
#signup #heading { padding-left: 70px; float: left; display: inline; }
#signup #blurb { float: left; width: 380px; padding-top: 20px; padding-left: 11px; }
#signup form { clear: both; }
#signup #col1, #signup #col2 { float: left; width: 352px; }
#signup #col2 { margin-top: -10px; }
#signup form fieldset { padding-left: 55px; height: 65px; }
#signup form select { color: #7C7F5B; font-family: "Georgia", Verdana, Arial, Helvetica, sans-serif; font-size: 10px; width: 280px; }
#signup #q1 { background: url(/Content/Img/signup/1.gif) top left no-repeat; padding-top: 8px; }
#signup #q2 { background: url(/Content/Img/signup/2.gif) 7px 0px no-repeat; padding-top: 23px; height: 85px; }
#signup #q2 span, #signup #q6 span { color: #7C7F5B; font-size: 10px; margin-right: 10px; }
#signup #q2 input { border: none; margin-right: 5px; }
#signup #q3 { background: url(/Content/Img/signup/3.gif) top left no-repeat; padding-top: 15px; }
#signup #q4 { background: url(/Content/Img/signup/4.gif) top left no-repeat; padding-top: 22px; height: 67px; }
#signup #q5 { background: url(/Content/Img/signup/5.gif) left top no-repeat; padding-top: 10px; height: 160px; }
#signup #q6 { background: url(/Content/Img/signup/6.gif) top left no-repeat; padding-top: 10px; height: 130px; }
#signup #q6 p { margin: 5px 0pt; }
#signup #q6 input { margin-right: 10px; width: 278px; }
#signup #q6 p input { border: none; width: 20px;  }
#opt-in-box { float: left; width: 20px; }
#signup #submit-set { float: right; padding: 0pt 50px 0pt 0pt; }
		
/* =confirmation page*/
#confirmation-text { height: 120px; width: 500px; text-align: center; margin: 0 auto; }
		
/* =manifesto */
#manifest #heading { padding-left: 264px; float: left; display: inline; }
#manifest #blurb { clear: left; width: 500px; line-height: 2; margin: 0 auto; text-align: center; }
		
/* =4steps */
#foursteps { background: url(/Content/Img/foursteps/steps.gif) 40px 25px no-repeat; height: 338px; position: relative; height: 400px; }
#foursteps #heading { padding-left: 140px; float: left; display: inline; }
#foursteps #blurb { float: left; width: 280px; margin-top: 34px; margin-left: 6px; }
#foursteps p span { font-weight: bold; }
#foursteps div p { width: 320px; }
#foursteps #one { background: url(/Content/Img/foursteps/1.gif) -17px -87px no-repeat; padding: 10px 0pt 0pt 35px; position: absolute; top: 168px; left: 16px; }
#foursteps #one.hover { background: url(/Content/Img/foursteps/1.gif) 1px 11px no-repeat; padding: 37px 0pt 0pt 52px; position: absolute; top: 141px; left: -1px; }
#foursteps #two { background: url(/Content/Img/foursteps/2.gif) -18px -88px no-repeat; padding: 11px 0pt 0pt 35px; position: absolute; top: 130px; left: 450px; }
#foursteps #two.hover { background: url(/Content/Img/foursteps/2.gif) 2px 8px no-repeat; padding: 32px 0pt 0pt 55px; position: absolute; top: 109px; left: 430px; }
#foursteps #two p { width: 200px; }
#foursteps #three { background: url(/Content/Img/foursteps/3.gif) -18px -88px no-repeat; padding: 11px 0pt 0pt 35px; position: absolute; top: 253px; left: 350px; }
#foursteps #three.hover { background: url(/Content/Img/foursteps/3.gif) 0px 10px no-repeat; padding: 32px 0pt 0pt 53px; position: absolute; top: 232px; left: 332px; }
#foursteps #four { background: url(/Content/Img/foursteps/4.gif) -18px -87px no-repeat; padding: 11px 0pt 0pt 35px; position: absolute; bottom: 16px; left: 126px; }
#foursteps #four.hover { background: url(/Content/Img/foursteps/4.gif) -3px 8px no-repeat; padding: 34px 0pt 0pt 49px; position: absolute; bottom: 16px; left: 112px; }

/* =flavourscope */
#nonflashcontent { text-align:center; }
.flavourscope { height: 100%; }
.flavourscope .container #content { text-align: center; }

/* =footer */
#footer { background: url(/Content/Img/backgrounds/footer-bg.jpg) bottom left repeat-x; position: relative; min-width: 980px; z-index: 5; height: 275px; }
#footer .container { height: auto; position: relative; z-index: 2; padding-top: 30px; }
#footer #footer-cont { position: relative; z-index: 1; }
#footer #links { list-style: none; margin: 0pt auto; width: 320px; position: relative; z-index: 1000; padding-top: 20px; }
#footer #links li { display: inline; margin-right: 5px; color:#F4D0A0; font-weight: bold; }
.js.flash #footer #links { top: -100px; }
#footer #links li a { margin-right: 5px; color: #f4d0a0; font-weight: normal; }
#footer #links li a:hover { color: #ffffff; }
#herbs { margin:10px auto 0pt; background: url(/Content/Img/backgrounds/herbs.gif) top left no-repeat; width: 155px; height: 134px; z-index: 300; }
.js #herbs { margin: 0pt auto; }

/* =opt out */
.optout { height: 320px; text-align: center; }

/* =terms and conditions */

/* =clearfix */
.clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.clearfix { display: inline-block; }
html[xmlns] .clearfix { display: block; }
* html .clearfix { height: 1%; }

#submit_image { background-image: url('/Content/Img/signup/submit.gif'); height: 42px; width: 112px; background-color: Transparent; border: none; cursor: pointer; }
#confirmation_button { background-image: url('/Content/Img/optout/confirm.gif'); height: 65px; width: 132px; background-color: Transparent; border: none; cursor: pointer; }
#cancel_button { background-image: url('/Content/Img/optout/cancel.gif'); height: 65px; width: 132px; background-color: Transparent; border: none; cursor: pointer; }
#continue_button { background-image: url('/Content/Img/optout/continue.gif'); height: 65px; width: 132px; background-color: Transparent; border: none; cursor: pointer; }ss