﻿/*


    Sun and Fork
    Black: #000000
    Blue: #005F80
    Yellow: #E0C627
    White: #FFFFFF

    Angled Headers - Light Yellow: #ECDE6D
    Footer Units - #E0C627
*/



/* Allergen Spplement Control */

.allergenHeaderRow{display:none;}

/*This class is overridden by a style in the code behind to set width when different numbers of allergens are active.*/
/*#allergenSuppHeader .headerItem {display:block;float:right;background-color:#AA0B16;width:60px;height:149px;border-right:solid 1px #ffffff;margin:50px 0 0 0;}*/

#allergenHeadSpacer{width:900px;height:197px;}

#allergenSuppContainer{position:relative;width:900px;}
#allergenSuppContainer .catHead{font-size:18px; line-height:18px; color:#000000; font-weight:bold;font-style:italic; text-transform:uppercase;margin:0 0 0 50px;}
#allergenSuppContainer .catSubHead{font-size:10px; color:#909090; font-weight:normal; font-style:italic; margin: 0 0 0 50px;}

#allergenSuppHeader{float:right; display:inline-block;z-index:1000;margin:0 0 0 0;width:620px;height:200px;}

.allergenSuppTable{width:900px;border-collapse:collapse;margin:5px 0 20px 20px;color:#636260;font-size:12px;}
.allergenSuppTable td{padding:5px 5px 5px 5px;margin:0 0 0 0;border-right:dashed 1px #D9D9D9;}
.allergenSuppTable .itemName{float:left;display:inline-block;}
.allergenSuppTable .itemDesc {margin:0 0 0 10px;font-size:11px; line-height:12px; font-style:italic; color:#909090;float:right; display:inline-block;margin:5px 10px 4px; text-align:right; width:50%;}
.allergenSuppTable .oddRow{background-color:#E9E9E9;border-bottom: solid 1px #E9E9E9;}
.allergenSuppTable .evenRow {border-bottom: solid 1px #E9E9E9;}
.allergenSuppTable .itemCell {text-align:left;padding:5px 5px 5px 15px;width:200px;}
.allergenSuppTable .valueCell {text-align:center;width:2.31em;}
.allergenSuppTable .valueCellRight {text-align:center;width:40px;}

/*Header*/
#allergenGuideHeader{position:relative;margin-left:99px;height:200px;width:600px;}

#allergenSuppHeaderContainer{background-image: url('../Images/nutr_supp_header_bg.jpg');position:fixed; left:0; top:0; z-index:1000;width:920px;}
#clientLogoHeader{width:300px;height:197px;float:left;display:inline-block;z-index:1000;}
#printIcon{height:35px;width:200px;padding:15px 0 0 20px;}
#printIcon a{text-decoration:none; font-size:22px; color:#0670CD;}
.nutrSuppLogo{margin:0 0 0 50px;}
#nutrGuide{width:100%; text-align:center;font-size:18px; font-weight:bold; color:#636260;margin:10px 0 0 0;}
#allergenHeadSpacer{width:900px;height:197px;}
#gradientSpacer{width:920px;height:20px;background: linear-gradient(#E9E9E9, #FFFFFF); margin:0 0 20px 0;}

/*Angled titles*/
.titleA12 {color:#000000; background-color:#ECDE6D; font-size:12px; font-weight:bold; transform: rotate(75deg); white-space:nowrap; position:absolute;top:28px;left:-225px; width:240px; height:20px;text-align:right; padding:13px 15px 15px 0;}
.titleA11 {color:#000000; background-color:#ECDE6D; font-size:12px; font-weight:bold; transform: rotate(75deg); white-space:nowrap; position:absolute;top:28px;left:-174px; width:240px; height:20px;text-align:right; padding:13px 15px 15px 0;}
.titleA10{color:#000000; background-color:#ECDE6D; font-size:12px; font-weight:bold; transform: rotate(75deg); white-space:nowrap; position:absolute;top:28px;left:-122px; width:240px; height:20px;text-align:right; padding:14px 15px 13px 0;}
.titleA09{ color:#000000; background-color:#ECDE6D; font-size:12px; font-weight:bold; transform: rotate(75deg); white-space:nowrap; position:absolute;top:28px;left:-72px; width:241px; height:20px;text-align:right; padding:13px 15px 14px 0;}
.titleA08{ color:#000000; background-color:#ECDE6D; font-size:12px; font-weight:bold; transform: rotate(75deg); white-space:nowrap; position:absolute;top:28px;left:-21px; width:240px; height:20px;text-align:right; padding:13px 15px 15px 0;}
.titleA07{ color:#000000; background-color:#ECDE6D; font-size:12px; font-weight:bold; transform: rotate(75deg); white-space:nowrap; position:absolute;top:28px;left:31px; width:240px; height:20px;text-align:right; padding:14px 15px 13px 0;}
.titleA06{ color:#000000; background-color:#ECDE6D; font-size:12px; font-weight:bold; transform: rotate(75deg); white-space:nowrap; position:absolute;top:28px;left:82px; width:240px; height:20px;text-align:right; padding:13px 15px 14px 0;}
.titleA05{ color:#000000; background-color:#ECDE6D; font-size:12px; font-weight:bold; transform: rotate(75deg); white-space:nowrap; position:absolute;top:28px;left:133px; width:240px; height:20px;text-align:right; padding:14px 15px 12px 0;}
.titleA04{ color:#000000; background-color:#ECDE6D; font-size:12px; font-weight:bold; transform: rotate(75deg); white-space:nowrap; position:absolute;top:28px;left:183px; width:240px; height:20px;text-align:right; padding:13px 15px 15px 0;}
.titleA03{ color:#000000; background-color:#ECDE6D; font-size:12px; font-weight:bold; transform: rotate(75deg); white-space:nowrap; position:absolute;top:28px;left:235px; width:240px; height:20px;text-align:right; padding:13px 15px 14px 0;}
.titleA02{ color:#000000; background-color:#ECDE6D; font-size:12px; font-weight:bold; transform: rotate(75deg); white-space:nowrap; position:absolute;top:28px;left:287px; width:240px; height:20px;text-align:right; padding:14px 15px 13px 0;}
.titleA01{ color:#000000; background-color:#ECDE6D; font-size:12px; font-weight:bold; transform: rotate(75deg); white-space:nowrap; position:absolute;top:28px;left:338px; width:240px; height:20px;text-align:right; padding:14px 15px 13px 0;}

/*Units*/
.titleA12Foot {font-size:11px; text-align:center; width:4.48em; height:30px; color:#000000; background-color:#E0C627; position:absolute;top:168px;left:-91px; z-index:20;}
.titleA11Foot {font-size:11px; text-align:center; width:4.48em; height:30px; color:#000000; background-color:#E0C627; position:absolute;top:168px;left:-39px; z-index:20;}
.titleA10Foot {font-size:11px; text-align:center; width:4.48em; height:30px; color:#000000; background-color:#E0C627; position:absolute;top:168px;left:12px; z-index:20;}
.titleA09Foot {font-size:11px; text-align:center; width:4.48em; height:30px; color:#000000; background-color:#E0C627; position:absolute;top:168px;left:63px; z-index:20;}
.titleA08Foot {font-size:11px; text-align:center; width:4.48em; height:30px; color:#000000; background-color:#E0C627; position:absolute;top:168px;left:114px; z-index:20;}
.titleA07Foot {font-size:11px; text-align:center; width:4.48em; height:30px; color:#000000; background-color:#E0C627; position:absolute;top:168px;left:165px; z-index:20;}
.titleA06Foot {font-size:11px; text-align:center; width:4.48em; height:30px; color:#000000; background-color:#E0C627; position:absolute;top:168px;left:216px; z-index:20;}
.titleA05Foot {font-size:11px; text-align:center; width:4.48em; height:30px; color:#000000; background-color:#E0C627; position:absolute;top:168px;left:267px; z-index:20;}
.titleA04Foot {font-size:11px; text-align:center; width:4.48em; height:30px; color:#000000; background-color:#E0C627; position:absolute;top:168px;left:318px; z-index:20;}
.titleA03Foot {font-size:11px; text-align:center; width:4.48em; height:30px; color:#000000; background-color:#E0C627; position:absolute;top:168px;left:369px; z-index:20;}
.titleA02Foot {font-size:11px; text-align:center; width:4.48em; height:30px; color:#000000; background-color:#E0C627; position:absolute;top:168px;left:421px; z-index:20;}
.titleA01Foot {font-size:11px; text-align:center; width:4.48em; height:30px; color:#000000; background-color:#E0C627; position:absolute;top:168px;left:472px; z-index:20;}

/*Disclaimer*/
#nutrSuppDisclaimer {width:900px;font-size:12px; line-height:14px;margin:20px 0 50px 20px;color:#636260;}