html {overflow-y:scroll;}
body {font:62.5% Verdana, Geneva, sans-serif; text-align:center; color:#474747}

/* COLOUR THEMES */
/* defaults */
#theme-orange {background:url("../images/bg-body-orange.jpg") repeat-x 0 0;}
#theme-orange #container {background:url("../images/bg-container-orange.jpg") no-repeat;}
#theme-orange #container-home {background:url("../images/bg-container-orange-home.jpg") no-repeat top center;}
#theme-orange .large, #theme-orange .medium {background:#ffffff url("../images/bg-main-orange.jpg") no-repeat top right;}
#theme-orange h1, #theme-orange h2, #theme-orange h3, #theme-orange h4 {color:#813700;}
	/* custom page background */
	#theme-orange .page-products {background:#ffffff url("../images/bg-main-products.jpg") no-repeat top left !important; height:330px; position:relative;}
	#theme-orange .page-products-powders {background:#ffffff url("../images/bg-orange-products-powders.jpg") no-repeat top left !important;}
	#theme-orange .page-products-capsules {background:#ffffff url("../images/bg-orange-products-capsules.jpg") no-repeat top left !important;}
	#theme-orange .page-products-fibresure {background:#ffffff url("../images/bg-orange-products-fibresure.jpg") no-repeat top left !important;}
	#theme-orange .page-products-where-to-buy {background:#ffffff url("../images/bg-orange-products-where-to-buy.jpg") no-repeat top left !important; height:650px;}
	#theme-orange .page-benefits {background:#ffffff url("../images/bg-orange-benefits.jpg") no-repeat top right !important; height:650px;}
	#theme-orange .page-metamucil-faq {background:#ffffff url("../images/bg-orange-metamucil-faq.jpg") no-repeat top right !important;}
	#theme-orange .page-fibresure-faq {background:#ffffff url("../images/bg-orange-fibresure-faq.jpg") no-repeat top right !important;}
	#theme-orange .page-fibre-toolkit {background:#ffffff url("../images/bg-orange-fibre-toolkit-main.jpg") no-repeat top right !important;}
	#theme-orange .page-fibre-toolkit-calculate {background:#ffffff url("../images/bg-orange-fibre-toolkit-calculate.jpg") no-repeat top right !important;}
	#theme-orange .page-fibre-toolkit-guide {background:#ffffff url("../images/bg-orange-fibre-toolkit-guide.jpg") no-repeat top right !important; height:620px}
	#theme-orange .page-whatsnew {background:none; background-color:#ffffff !important;}
	#theme-orange .page-whatsnew-recipes {background:#ffffff url('../images/bg-orange-whatsnew-recipes.jpg') no-repeat top left !important; }
/* defaults */
#theme-green {background:url("../images/bg-body-green.jpg") repeat-x 0 0;}
#theme-green #container {background:url("../images/bg-container-green.jpg") no-repeat;}
#theme-green #container-home {background:url("../images/bg-container-green-home.jpg") no-repeat top center;}
#theme-green .large, #theme-green .medium {background:#ffffff url("../images/bg-main-orange.jpg") no-repeat top right;}
#theme-green h1, #theme-green h2, #theme-green h3, #theme-green h4 {color:#813700;}
	/* custom page background */
	#theme-green .page-brightside-about {background:#ffffff url("../images/bg-brightside-about.jpg") no-repeat top right !important; }
	#theme-green .page-challenge-registration {background:#ffffff url("../images/bg-brightside-registration.jpg") no-repeat 260px 40px !important;}
	#theme-green .page-brightside-registration-confirmation {background:#ffffff url("../images/bg-brightside-registration-confirmation.jpg") no-repeat top right !important;}
	#theme-green .page-brightside-post-survey {background:#ffffff url("../images/bg-brightside-post-survey.jpg") no-repeat top right !important;}
	#theme-green .page-brightside-post-survey-thanks {background:#ffffff url("../images/bg-brightside-post-survey-thanks.jpg") no-repeat top right !important; height: 380px;}
	#theme-green .page-wheres-your-brightside {background:#ffffff url("../images/bg-brightside-wheres-your.jpg") no-repeat top left !important;}
/* LAYOUT */
.left {float:left; display:inline-block;}
.clear-floats {clear:left;}
#container {margin:0 auto; width:927px;}
#header {height:80px; margin:0 auto; position:relative; text-align:left; width:858px;}
#header .logo {float:left; padding:15px 0 0 30px; width:200px;}
#nav-global {height:31px; position:absolute; top:49px; left:355px; width:691px;}
#nav-global ul li {float:left; margin:0 1px 0 0;}
#page {margin:0 auto; text-align:left;}
div.page-no-border#page {padding:0; width:858px;}
div.page-border#page {background-color:#fff; padding:4px; width:850px;}
#flash {clear:left; height:305px; width:858px;}
#noflash {clear:left; position:relative;}
#noflash-benefits {position:absolute; top:183px; left:182px; height:25px; width:116px;}
#noflash-wheretobuy {position:absolute; top:0px; left:750px; height:27px; width:109px;}
#main {background-color:#ededed;}
#main-no-bg {background-color:#ffffff;}
#main .small {float:left; width:178px; margin:0; padding:0;}
#main .medium {background-color:#ffffff; float:left; width:485px; border-left:solid 4px #ffffff; border-right:solid 4px #ffffff; padding:30px 0 15px 0;}
#main .large {background-color:#ffffff; float:left; width:667px; border-right:solid 4px #ffffff; padding:0 0 15px 0;}
#main #sidebar {margin-top:34px;}
#main .col-item-first { padding:2px;}
#main .col-item {padding:2px;}
#main .col-item-last {padding:2px; border-bottom:none;}
#main .col-copy {padding:0 30px;}
#main .col-copy-alt {padding:0 15px;}
#main .col-copy ul li {margin:0 0 0 15px; list-style-image:url("../images/ul-li.gif");}
#main .col-copy ul li ul li {margin:0 0 0 15px; list-style-image:url("../images/ul-li.gif");}
#main .col-copy ol li {margin:0 0 0 17px; list-style-position:outside;}
#promos {height:185px;}
#promos h3, #promos img.promo-hero {margin:0 17px; display:inline-block;}
#promos p {width:175px; margin:0 17px; display:inline-block;}
#promo p.center {display:block; width:100%;}
#promos a.cta {position:absolute; left:18px; bottom:15px; width:100%;}
#promos .promo {background: url("../images/bg-promo.jpg") 0 0 no-repeat; float:left; height:179px; margin:0 6px 0 0; position:relative; width:210px;}
#promos .promo-last {background: url("../images/bg-promo.jpg") 0 0 no-repeat; float:left; height:179px; margin:0; position:relative; width:210px;}
#breadcrumbs {border:solid 1px #efefef; clear:left; height:23px; line-height:23px; display:block;}
#breadcrumbs ul {padding:0 15px;}
#breadcrumbs ul li {float:left;}
#footer {clear:both;}
#sub-nav {padding:14px;}
#sub-nav div {height:110px;}
.sub-category-first {border-right:dashed 1px #c9deba; float:left; margin:0px; padding:0 15px 0 0;}
.sub-category {border-right:dashed 1px #c9deba; float:left; padding:0 10px; }
.sub-category-last {float:left; margin:0px; padding:0 0 0 10px;}
#copyright {height:54px; margin:6px 0 0 0; padding-top:6px;}
#copyright p {display:block; width:100%;}
#copyright ul {display:block;}
#copyright ul li {display:inline;}
#sub-nav, #copyright {background-color:#f6f6f6;}

.snippet-side {margin:4px;}
.snippet-side a {display:inline-block; margin:0 0 5px 0; width:170px;}

/* GENERAL */
.tabbertab-float {display:inline-block; float:left; height:360px; overflow:hidden;}
.faq-tab {background-color:#ebebeb; border:solid 2px #ebebeb; padding:3px 5px; margin:0 0 5px 0;}
.faq-copy {padding:12px 3px;}
.faq-active {background-color:#ffffff; border:solid 2px #ff9600; margin:0 0 5px 0;}

table.col-table, table.row-table, table.stripe-table {width:100%; margin:0 0 1em 0;}
table.col-table {border-collapse:separate; border-spacing:3px 0; }
table.col-table th, table.row-table th, table.stripe-table tr.odd {background-color:#ebebeb;}
table.col-table th, table.col-table td, table.row-table th, table.row-table td {line-height:1.4em; padding:5px 10px;}
table.stripe-table th, table.stripe-table td {line-height:1.4em; padding:2px 10px;}
table.row-table th, table.row-table td {border-top:solid 1px #ebebeb; border-bottom:solid 1px #ebebeb;}
table.col-table td, table.row-table td, table.stripe-table td {vertical-align:top;}

#error { color:#AA0000; }

.link { border-bottom:1px solid #e0e0e0; height:30px; margin:0px 10px 15px 10px; }
.link a { float:right; }
.link input { float:right; }
.line { margin-bottom:5px; }
.underline { border-bottom:1px solid #e0e0e0; padding-bottom:5px; margin-bottom:15px; }

/* PRODUCTS */
#page-products-capsules {margin:112px 0 0 0;}
.page-products-capsules .intro {margin:0 0 0 155px;}
#page-products-fibresure {margin:132px 0 0 0;}
.page-products-fibresure .intro {margin:0 0 0 155px;}
#products-selector {position:relative; top:69px; left:241px; display:inline-block; width:369px;}
#products-selector img {display:block; float:left;}
#btn-where-to-buy {position:absolute; top:1px; right:1px;}

/* BENEFITS OF METAMUCIL */
#page-benefits {margin:240px 0 0 0;}

/* METAMUCIL FAQ */
#page-metamucil-faq {margin:135px 0 0 0;}

/* FIBRE TOOLKIT */
#page-fibre-toolkit {margin:150px 0 0 0;}
.page-fibre-toolkit .intro {width:270px;}
.page-fibre-toolkit-guide .intro {width:220px; }
#page-fibre-toolkit-guide {margin:95px 0 0 0;}
#page-fibre-toolkit .block { font-size:1.1em; height:100px; padding:0px 15px;}
#page-fibre-toolkit img { float:left; }
#dfm {margin:0 auto; width:458px; height:460px;}

ul.menuGuide{ height:20px; margin-bottom:10px;}
ul.menuGuide li { background-color:#EDEDED; float:left; display:block; font-weight:bold; margin-right:2px; padding:5px 10px;height:25px; text-align:center; vertical-align:middle;}
ul.menuGuide li a { color:#FFFFFF; text-decoration:none; height:20px; }
ul.menuGuide li.onFruit { background-color:#FFFFFF; border:2px solid #ffd800; padding:3px 10px; width:68px;}
ul.menuGuide li.fruit { background-color:#ffd800; width:68px;}
ul.menuGuide li.onVegetable { background-color:#FFFFFF; border:2px solid #85c73f; padding:3px 10px; width:100px;}
ul.menuGuide li.vegetable { background-color:#85c73f; width:100px;}
ul.menuGuide li.onGrain { background-color:#FFFFFF; border:2px solid #deb656; padding:3px 10px; width:110px;}
ul.menuGuide li.grain { background-color:#deb656; width:110px;}
ul.menuGuide li.onMetamucil { background-color:#FFFFFF; border:2px solid #ff9600; padding:3px 10px; width:85px; }
ul.menuGuide li.metamucil { background-color:#ff9600; width:85px;}

.page-fibre-toolkit-calculate .intro { margin:50px 0px 0px 150px;}
#page-fibre-toolkit-calculate {margin:100px 10px 0 10px;}
#page-fibre-toolkit-calculate .fibreCalculate .left { float:left; width:255px;}
#page-fibre-toolkit-calculate .fibreCalculate .left img{ float:left; margin-right:10px; }
#page-fibre-toolkit-calculate .fibreCalculate .right { background:#FFFFFF url('../images/fibretoolkit-calculatebox.gif') no-repeat top left; float:right; height:151px; padding:15px; width:142px; }
#page-fibre-toolkit-calculate .fibreCalculate .right span { display:block; font-size:120%; font-weight:bold; margin-bottom:10px; }
.recommendH {color:#fd670c;}

/* WHATSNEW */
#whatsnew .block { overflow:hidden; }
#whatsnew .block .left { float:left; width:150px; }
#whatsnew .block .right { float:right; width:300px; }
#whatsnew .block .leftSmall { float:left; width:80px; }
#whatsnew .block .rightSmall{ float:right; width:370px; }
#news .col-copy img { float:left; margin:0px 15px 5px 0px; }
#news .nav { border-top:1px solid #e0e0e0; margin:20px; padding:8px 2px; position:relative; }
#page-cycle {display:block; position:absolute; top:8px; right:5px;}
#recipe {margin:135px 0 0 0;}
#recipe .title { margin-top:10px; }
#recipe .title h2 { line-height:50px;}
#recipe .title img { float:left; margin-right:5px; }
#recipe .tdRight { width:100px; }

/* BRIGHTSIDE */
.page-wheres-your-brightside .intro {margin-right:160px}
#page-wheres-your-brightside {margin-top:100px}
.page-brightside-about .intro {margin:110px 160px 0 0; .margin:140px 200px 0 0;}
.page-brightside-about .pssst {margin:26px 200px 0 64px;}
#main .col-copy .start-challenge ul li {list-style:none; margin: 0;}
.page-brightside-about .plane { float: left; width: 143px; height: 129px; margin: 20px 0;}
.page-brightside-about .flights {float:right; width: 250px; height: 129px; padding: 20px 0; margin: 20px 0;}
.page-brightside-about .steps { margin: 80px 0 20px 0; overflow: hidden; }
.page-brightside-about .pssst p strong { color: #fc6c0b; font-size: 1.5em;}
.page-brightside-about .pssst p a { color: #458a0c; text-decoration: none; font-weight:bold;}

.page-brightside-registration-confirmation .intro {margin:0 200px 0 0; }
.registration-number { border:1px solid #e0e0e0; height:30px; margin:0px 10px 15px 10px;  text-align: center; font-size:2.2em; font-weight:bold; color:#F93}
#promos a.cta-brightside {position:absolute; left:18px; bottom:15px; width:100%;}
#theme-green .thanks { width: 400px; margin: 0px 200px 20px 300px; padding-top: 50px;}
#theme-green .where { width: 200px;  border:1px solid #e0e0e0; margin: 20px 200px 50px 300px; padding: 15px; }

#theme-green .post-survey-left { width: 45%; margin: 0 auto; padding-top: 10px; float: left;}
#theme-green .post-survey-left h2 { display: block; float: left; height: 30px;}
#theme-green .post-survey-right h2 { display: block; float: left; height: 30px;}
#theme-green .col-copy .post-survey-right ul li { list-style: none; margin: 0;}
#theme-green .col-copy .post-survey-left ul li { list-style: none; margin: 0;}
#theme-green .post-survey-right { width: 45%; margin: 0 auto; padding-top: 10px; float: right;}
#theme-green .post-survey-top { width: 100%; margin: 0 auto; padding-top: 30px;}

/* WHERE'S YOUR BRIGHTSIDE - Form */
#post-brightside {}
#post-brightside legend {margin-bottom:10px; .margin-left:-7px; font-weight:bold}
#post-brightside legend, #post-brightside label{font-size:1.1em}
#post-brightside label {display:block}
#post-brightside input {float:left}
#post-brightside input, #post-brightside textarea {width:100%; margin-bottom:10px;}
#post-brightside textarea {height:80px}
#post-brightside #submit {height:28px; width:181px}
input[type=text], select, textarea {border-style:solid; border-width:1px; border-color:#ccc;}
input:focus, select:focus, textarea:focus {border-color:#75a807;}
span.mandatory {color:#FF9600;}
fieldset.options div p {position:relative;}
fieldset.options div p label.error {float:right; display:inline; width:150px; text-align:right; font-size:11px !important}

/* WHERE'S YOUR BRIGHTSIDE - Comments */
.comment-post {background:#f3f2f2; margin-bottom:10px; padding:12px;}
.comment-title {color:#692700; font-size:1.2em; line-height:1.6em; font-weight:bold}
.comment-author p, .comment-comment p {padding-bottom:0.8em !important;}

/* AD */
.ad {display:block; margin:0 auto; }
.ad  img{ margin:0 auto 5px auto;}

/* NAVIGATION */
#nav-global ul li a:link, #nav-global ul li a:visited {color:#c44100; font-weight:bold; text-decoration:none; display:block;}
#nav-global ul li a:hover, #nav-global ul li a:active {color:#c44100; font-weight:bold; text-decoration:none; display:block;}
#nav-global ul li ul li a:link, #nav-global ul li ul li a:visited {color:#474747; font-weight:normal; text-decoration:none; display:block;}
#nav-global ul li ul li a:hover, #nav-global ul li ul li a:active {color:#f9812b; font-weight:normal; text-decoration:none; display:block;}
/* Theme Orange */
#theme-orange #main #sidebar a:link, #theme-orange #main #sidebar a:visited {color:#474747; text-decoration:none; display:block; padding:2px 2px 2px 20px;}
#theme-orange #main #sidebar a:hover, #theme-orange #main #sidebar a:active {color:#FF9600; text-decoration:none; background-color:#f3f2f2; display:block; padding:2px 2px 2px 20px;}
#theme-orange #main #sidebar .col-item a.selected, #theme-orange #main #sidebar .col-item-last a.selected {color:#813700; background-color:#f3f2f2; display:block; padding:2px 2px 2px 20px;}
#theme-orange #main #sidebar .col-item-first a:link, #theme-orange #main #sidebar .col-item-first a:visited {color:#813700; background-color:none !important; display:block; font-weight:bold; padding:2px 2px 2px 20px;}
#theme-orange #main #sidebar .col-item-first a:hover, #theme-orange #main #sidebar .col-item-first a:active {color:#FF9600; background-color:#f3f2f2; display:block; font-weight:bold; padding:2px 2px 2px 20px;}
/* Theme Green */
#theme-green #main #sidebar a:link, #theme-green #main #sidebar a:visited {color:#474747; text-decoration:none; display:block; padding:2px 2px 2px 20px;}
#theme-green #main #sidebar a:hover, #theme-green #main #sidebar a:active {color:#75a807; text-decoration:none; background-color:#f3f2f2; display:block; padding:2px 2px 2px 20px;}
#theme-green #main #sidebar .col-item a.selected, #theme-green #main #sidebar .col-item-last a.selected {color:#42750B; background-color:#f3f2f2; display:block; padding:2px 2px 2px 20px;}
#theme-green #main #sidebar .col-item-first a:link, #theme-green #main #sidebar .col-item-first a:visited {color:#42750B; background-color:none !important; display:block; font-weight:bold; padding:2px 2px 2px 20px;}
#theme-green #main #sidebar .col-item-first a:hover, #theme-green #main #sidebar .col-item-first a:active {color:#75a807; background-color:#f3f2f2; display:block; font-weight:bold; padding:2px 2px 2px 20px;}

a.copy-link:link, a.copy-link:visited {color:#474747; font-weight:bold; text-decoration:none;}
a.copy-link:hover, a.copy-link:active {color:#75a807; font-weight:bold; text-decoration:none;}
#whatsnew a:link, #whatsnew a:visited { color:#474747; text-decoration:none; }
#whatsnew a:hover, #whatsnew a:active { color:#75a807; text-decoration:none; }
#whatsnew h2 a:link, #whatsnew h2 a:visited { color:#813700; text-decoration:none; }
#whatsnew h2 a:hover, #whatsnew h2 a:active { color:#75a807; text-decoration:none; }
#recipe a:link, #recipe a:visited { color:#474747; text-decoration:none; }
#recipe a:hover, #recipe a:active { color:#75a807; text-decoration:none; }
.promo a:link, .promo a:visited, .promo-last a:link, .promo-last a:visited {color:#FF9600; font-weight:bold; text-decoration:none;}
.promo a:hover, .promo a:active, .promo-last a:hover, .promo-last a:active {color:#FF9600; font-weight:bold; text-decoration:underline;}
.promo p a:link, .promo p a:visited, .promo-last p a:link, .promo-last p a:visited {color:#5c5c5c; font-weight:normal; text-decoration:none;}
.promo p a:hover, .promo p a:active, .promo-last p a:hover, .promo-last p a:active {color:#5c5c5c; font-weight:normal; text-decoration:none;}
#breadcrumbs a:link, #breadcrumbs a:visited {color:#717171; text-decoration:none;}
#breadcrumbs a:hover, #breadcrumbs a:active {color:#000000; text-decoration:none;}
#breadcrumbs a.selected {color:#000000;}
#sub-nav h4 a:link, #sub-nav h4 a:visited {color:#505050; text-decoration:none;}
#sub-nav h4 a:hover, #sub-nav h4 a:active {color:#505050; text-decoration:underline;}
#copyright a:link, #copyright a:visited {color:#a9a9a9; text-decoration:none;}
#copyright a:hover, #copyright a:active {color:#a9a9a9; text-decoration:underline;}
.faq-tab .faq-title span {background:url("../images/faq-state-open.gif") top right no-repeat; color:#505050; text-decoration:none; cursor:pointer; display:block; font-size:1.1em; line-height:1.4em; padding:0 15px 0 0;}
.faq-title span.selected {background:url("../images/faq-state-close.gif") top right no-repeat; color:#692700 !important; text-decoration:none; cursor:pointer; display:block; padding:0 15px 0 0;}
.hide {display:none;}

/* TYPOGRAPHY */
h1 {font-size:1.8em; font-weight:bold; padding:0 0 1em 0;}
h2 {font-size:1.2em; font-weight:bold; padding:0 0 0.5em 0;}
h3 {font-size:1.2}
h4 {font-size:1.1em; font-weight:100; padding:0 0 1em 0;}
p.left {text-align:left;}
p.center {text-align:center;}
p.right {text-align:right;}
#main #sidebar .col-item-first, #main #sidebar .col-item, #main #sidebar .col-item-last {font-size:1.1em;}
#main .col-copy p, #main .col-copy-alt p {font-size:1.1em; line-height:1.4em; padding:0 0 1.2em 0;}
#main .col-copy ul, #main .col-copy ol {padding:0 0 1em 0;}
#main .col-copy ul li, #main .col-copy ol li {font-size:1.1em; line-height:1.4em; padding:0 0 0.3em 0;}
#main .col-copy ul li ul li {font-size:1em; padding:0.3em 0 0 0;}
#nav-global {font-size:1.1em; letter-spacing:-0.015em;}
#nav-global ul.sf-menu li ul li a {font-size:1em; font-weight:normal;}
#promos h3 {color:#75a807; font-size:1.6em;}
#promos p {color:#5c5c5c; font-size:1.1em; line-height:1.4em; padding-bottom:0.5em;}
#promos a {font-size:1.1em; line-height:1.5em;}
#promos p a {color:#5c5c5c; font-size:1em; line-height:1.4em; padding-bottom:0.5em;}
.tabbertab h3 {font-size:1.4em; font-weight:bold; padding:0 0 1em 0;}
.tabbertab h4 {font-size:1.2em; font-weight:bold; padding:0 0 0.4em 0;}
.tabbertab p {color:#474747; font-size:1.1em; line-height:1.5em; padding:0 0 1em 0;}
table.col-table th, table.col-table td, table.row-table th, table.row-table td, table.stripe-table td {font-size:1.1em; font-weight:normal;}
table.stripe-table th {color:#813700; font-weight:bold; font-size:1.1em;}
.title-recipe {font-weight:1.2em; font-weight:bold; color:#813700;}
#faq-tabs a {font-size:1.1em;}
#breadcrumbs a {font-size:1.1em; letter-spacing:-0.02em;}
#footer {color:#a9a9a9; font-size:1em; line-height:1.2em;}
#footer h4 {color:#505050; font-size:1.1em; letter-spacing:-0.02em; line-height:1.1em;}
#sub-nav p {}
ul.sub-link li {margin-bottom:0.4em;}
ul.sub-link li a:link, ul.sub-link li a:visited {color:#a9a9a9; text-decoration:none;}
ul.sub-link li a:hover, ul.sub-link li a:active {color:#a9a9a9; text-decoration:underline;}
#copyright {text-align:center;}
#copyright p, #copyright a {color:#a9a9a9; font-size:1em;}

#main a:link, #main a:visited {color:#000000; text-decoration:underline;}
#main a:hover, #main a:active {color:#000000; text-decoration:none;}
#sitemap h2 a:link, #sitemap h2 a:visited {color:#813700; text-decoration:none;}
#sitemap h2 a:hover, #sitemap h2 a:active {color:#813700; text-decoration:underline;}
#sitemap ul li a:link, #sitemap ul li a:visited {color:#000000; text-decoration:none;}
#sitemap ul li a:hover, #sitemap ul li a:active {color:#000000; text-decoration:underline;}