﻿*{margin: 0px; padding: 0px;}

body{font-family: Arial, Helvetica, Sans-Serif; font-size: 12px; height: 100%; width: 100%; overflow: auto; color: #333;}
a, a:link, a:active, a:visited{outline: none; color: #EE2E24; text-decoration: none; font-weight: normal;}
a:hover{text-decoration: underline;}
img{border: none;}
h1{color: #6c904d; font-size: 24px; font-family: Times New Roman; font-weight: normal;}
h2{color: #6c904d; font-weight: normal; font-size: 16px;}
h3{color: #6c904d; font-weight: normal; font-size: 12px; padding-bottom: 3px;}

.button{position: relative; display: block; margin-top: 18px; width: 85px; background: #EE2E24; color: #FFF; font-size: 14px; font-weight: normal; text-align: center; height: 30px; cursor: pointer;}
.button .content{padding-top: 6px;}

.button-aspnet{position: relative; display: block; margin-top: 18px; width: 85px; background: #EE2E24; color: #FFF; font-size: 14px; font-weight: normal; text-align: center; height: 30px; cursor: pointer; border: 0;}
.button-aspnet:hover{background-color: #cb271f;}

.button-narrow-aspnet, .button-narrow-aspnet-home{position: relative; display: block; width: 75px; background: #EE2E24; color: #FFF; font-size: 14px; font-weight: normal; text-align: center; height: 25px; cursor: pointer; border: 0;}
.button-narrow-aspnet:hover, .button-narrow-aspnet-home:hover{background-color: #cb271f;}

.watermark-text{color: #999;}
.watermark-text-search{color: #999; height: 15px; border: 0; width: 135px; font-size: 10px; display: block; float: left;}
.watermark-text-off{color: #000;}

.watermark-text-regular-field{color: #999; font-style: italic; font-size: 11px; height: 16px; border: 1px solid #abadb3; height: 18px;}
.watermark-text-regular-field-off{color: #000; font-style: normal; font-size: 11px; height: 16px; border: 1px solid #abadb3; height: 18px;}

.textarea-default{border: 1px solid #abadb3;}
.textbox-default{border: 1px solid #abadb3; height: 18px;}
.textbox-error, .drop-down-error{background-color: #fedede; /*border: 1px solid #EE2E24; padding: 1px 0;*/}
.drop-down-error{border: 1px solid #999;}

.clear{clear: both;}

.media-share{position: absolute; display: block; width: 35px; top: -21px; left: 512px;}
.media-share .title{position: relative; display: block; text-transform: uppercase; color: #CCC; font-size: 11px; margin: 0 0 2px -1px;}
.media-share .icon{position: relative; display: block; width: 34px; margin: 0 0 2px 0;}

/*/////////////////FORMS///////////////////*/
.form-row{position: relative; display: block; min-height: 30px; margin-bottom: 12px;}
.form-row-narrow{position: relative; display: block; margin-bottom: 8px; overflow:hidden;}
.required-asterik, .error-message{color: #EE2E24;}
.error-message{display: none;}
.field-block{position: relative; display: block; float: left; margin-right: 5px;}
.field-block .text-label{position: relative; display: block; font-size: 11px; color: #666;}
.field-block .text-label .normal{position: relative; display: block; font-style: normal; color: #6c904d; font-size: 12px; padding-top: 2px;}
.field-block .input-element{position: relative; display: block;}

/*/////////////////BACKGROUNDS/////////////*/
.background{z-index: -1; position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.rollover-mappings{position: absolute; top: -10px; left: 0; width: 100%; height: 0px; z-index: 1000; }

/*/////////////////MAIN LAYOUT/////////////*/
#container{width: 968px; margin: 0 auto; z-index: 1000; position: relative; overflow:visible;}

.lightbox{position: absolute; display: none; top: 0; left: 0; width: 100%; height: 500px; text-align: center; background-color: #000; z-index: 1000000; opacity:0.6;filter:alpha(opacity=60);}

.lightbox-close-button{position: relative; display: none; cursor: pointer; width: 44px; height: 44px; z-index: 1000500;opacity:1.0;filter:alpha(opacity=100);}
.lightbox-content{position: relative; display: none; width: auto; background-color: #FFF; z-index: 1000500;opacity:1.0;filter:alpha(opacity=100);}

/*/////////////////HEADER LAYOUT///////////*/
#header{position: relative; margin: 0 auto; width: 968px; z-index: 99999; padding-top: 10px;}

#header .logo{float: left; display: block;}

#header .navigation{display: block; width: 441px; float: left; height: 30px; font-size: 13px; color: #FFF; background: url('/Images/Background-Navigation.png') no-repeat; margin: 37px 0 0 50px; z-index: 99999;}
#header .navigation ul {width: 441px; margin-left: 13px; margin-top: 1px;}
#header .navigation li{position: relative; float: left;}
#header .navigation ul li{display: block; height: 22px;}
#header .navigation ul li a, #header .navigation ul li a:visited, #header .navigation ul li a:link, #header .navigation ul li a:active{display: block; height: 10px; text-decoration: none; color: #FFF; padding: 6px 13px; margin-left: -2px; font-weight: normal;}
#header .navigation ul li a:hover, #header .navigation ul li a.selected{display: block; height: 10px; text-decoration: none; color: #ff8f23; background-color: #FFF; padding: 6px 13px; padding-bottom: 10px; margin-left: -2px; font-weight: normal;}
#header .navigation ul li img{display: block; vertical-align: middle; display: block; float: left; margin-top: 11px; margin-left: -2px;}

/* Hover Drop Down */
#header .navigation li ul {position: absolute; z-index: 99999; left: -999em; top: 24px; width: 151px; text-align: left; color: #ff8f23; z-index: 1000; padding: 4px 0 0 0; margin: -2px 0 0 -2px; background-image: url(/Images/Background-Nav-Hover-Bottom.png); background-position: left bottom; background-repeat: no-repeat;}

#header .navigation li:hover ul {left: auto; /*margin-left: 3px;*/ position: absolute;}
#header .navigation li ul li {float:none;}
#header .navigation li:hover ul ul, #navigation li.sfhover ul ul {left: -999em;}
#header .navigation li:hover ul, #navigation li li:hover ul, #navigation li.sfhover ul, #navigation li li.sfhover ul{left: auto;}
#header .navigation li:hover ul ul, #navigation li:hover ul ul ul, #navigation li.sfhover ul ul, #navigation li.sfhover ul ul ul {left: -999em;}
#header .navigation li:hover ul, #header .navigation li li:hover ul, #header .navigation li li li:hover ul, #header .navigation li.sfhover ul, #header .navigation li li.sfhover ul, #header .navigation li li li.sfhover ul{left: auto;}
#header .navigation ul li ul li:hover {}

#header .navigation ul li ul li a, #header .navigation ul li ul li a:visited, #header .navigation ul li ul li a:link, #header .navigation ul li ul li a:active{position: relative; display: block; color: #ff8f23; background-color: #FFF; width: 125px; height: 13px; padding: 4px 16px 8px 10px; margin: 2px 0 0 0;}
#header .navigation ul li ul li a:hover{background-color: #EE2E24; color: #FFF; height: 13px; padding: 4px 16px 8px 10px; margin: 2px 0 0 0;}

#header .navigation ul li ul li.last{margin: 0 0 8px 0; padding: 0;}

/* Header Utility */
#header .utility{display: block; width: 247px; float: left; height: 30px; background: url('/Images/Background-Utility.png') no-repeat; margin: 37px 0 0 10px; font-size: 10px; z-index: 3000;}
#header .utility ul {display: block; width: 247px; margin: 2px 0 0 12px; z-index: 3000;}
#header .utility li {position: relative; float: left; z-index: 3000;}
#header .utility ul li{display: block; height: 22px; z-index: 3000;}
#header .utility ul li a, #header .utility ul li a:visited, #header .utility ul li a:link, #header .utility ul li a:active{display: block; height: 10px; text-decoration: none; color: #FFF; padding: 6px 4px; font-weight: normal;}
#header .utility ul li a:hover{display: block; height: 10px; text-decoration: underline; color: #FFF; font-weight: normal;}
#header .utility ul li img{display: block; vertical-align: middle; display: block; float: left;}
#header .utility ul li a img{margin: 0; text-decoration: none;}
#header .utility ul li a:hover img{text-decoration: none;}

#header .utility .image-lead{float: left; margin-right: 4px;}

/*/////////////////SEARCH LAYOUT///////////*/
#search{display: block; position: absolute; height: 16px; top: 10px; left: 638px; font-size: 10px; z-index: 99999;}
#search .site-search{display: block; height: 16px; color: #FFF; float: left;}
#search .site-search .lead, #search .product-search{display: block; height: 16px; width: 38px; background-color: #ff8f23; padding: 2px 0 0 5px; float: left;}
#search .product-search.hover{background-color: #ff871f;}
#search .site-search .textbox{display: block; height: 16px; width: 155px; border: 1px solid #ff8f23; background-color: #FFF; float: left; padding-left: 3px;}
#search .site-search .textbox .icon{margin: 2px 3px 0 0; float: right; cursor: pointer;}
#search .error-tooltip{position: absolute; display: block; top: 18px; left: 50px; height: 30px; width: 150px; border: 1px solid #CCC; background-color: #FFF; font-size: 11px;}
/*#search .site-search .textbox input, #site-search-textbox{height: 15px; border: 0; width: 130px; font-size: 10px; display: block; float: left;}*/

#search .product-search{width: auto; color: #FFF; float: left; margin-left: 8px; cursor: pointer;}
#search .product-search .lead{display: block; float: left; margin: 0 5px 0 1px;}
#search .product-search .icon{display: block; float: left; margin: 1px 4px 0 0;}

.net-site-search-textbox{border: 1px solid #ff8ff23;}

/*/////////////////FOOTER/////////////////*/
#footer{position: fixed; bottom: 0; z-index: 99998; height: 30px; width: 100%; left: 0; background: #EE2E24; color: #FFF; font-size: 10px;}
#footer .footer-container{margin: 0 auto; width: 975px;  text-align: center; padding: 0 0 0 80px;}

/*TODO AFTER APPROVAL - Change display to block*/
#footer .facebook-share{display: block; float: left; padding: 8px 0 0 5px; cursor: pointer;}
#footer .facebook-share .icon{display: block; float: left; margin-right: 5px;}
#footer .facebook-share .content{display: block; float: left;}

/*TODO AFTER APPROVAL - Change 50px to 0*/
#footer .add-this-share{display: block; float: left; padding: 6px 0 0 0; cursor: pointer; margin-left: 12px; margin-top: 2px;}
#footer .copyright{display: block; float: left; padding: 8px 0 0 0;}

#footer .nav{position: relative; display: block; float: left; height: 30px; padding: 2px 0 0 5px; z-index: 600;}
#footer .nav ul{display: block; width: 420px;}
#footer .nav li{position: relative; float: left; list-style: none;}
#footer .nav ul li{display: block; height: 22px;}
#footer .nav ul li a, #footer .navigation ul li a:active, #footer .navigation ul li a:visited, #footer .navigation ul li a:link{display: block; height: 10px; text-decoration: none; color: #FFF; padding: 6px 8px; font-weight: normal;}
#footer .nav ul li a:hover{display: block; height: 10px; text-decoration: underline; color: #FFF; padding: 6px 8px;}
#footer .nav ul li img{display: block; vertical-align: middle; display: block; float: left; margin-top: 10px;}

/*/////////////////PRODUCT SEARCH/////////////*/
.lightbox-search-container{position: absolute; display: none; top: 245px; left: 680px;}
.product-search-content{position: relative; padding: 10px 15px 15px 13px; overflow: hidden;}
.product-search-content .label{position: relative; display: block; float: left; font-style: italic; font-size: 11px; padding-top: 10px;}
.product-search-content .zip-code-textbox{position: relative; display: block; float: left; padding-right: 10px;}
.product-search-content .zip-code-textbox input{width: 85px;}
.product-search-content .radius-select{position: relative; display: block; float: left;}
.product-search-content .radius-select select{}
.product-search-content .product-select{position: relative; display: block; float: left; padding-top: 10px;}
.product-search-content .product-select .asp-dropdown{width: 166px;}
.product-search-content .button{position: relative; display: block; margin-top: 18px; width: 85px; background: #EE2E24; color: #FFF; font-size: 14px; font-weight: normal; text-align: center; height: 30px; cursor: pointer;}
.product-search-content .button .content{padding-top: 6px;}
.product-search-content .submit{position: relative; display: block; margin-top: 18px;}

/*///////////////ACCORDION///////////////*/
.accordion, .accordion-multiple{}
.accordion .item, .accordion-multiple .item{position: relative; display: block; padding: 0 0 10px 0;}
.accordion .item .title, .accordion-multiple .item .title{position: relative; display: block; float: left;}
.accordion .item .title .lead, .accordion-multiple .item .title .lead{position: relative; display: inline-block; width: 10px; height: 18px; float: left; color: #EE2E24;}
.accordion .item .content-text, .accordion-multiple .item .content-text{position: relative; display: none; margin: 0; padding: 8px 25px 0 25px;}
.accordion .item .content-text.selected,  .accordion-multiple .item .content-text.selected{position: relative;}

/*//////////////NUTRITION LABELS////////*/
#data-nutrition-label{position: relative; display: block; width: 674px; height: 550px; background: #FFF; overflow: hidden;}
#data-nutrition-label .navigator{position: relative; display: block; height: 30px; text-transform: uppercase; float: right; margin: -2px 0 0 0;}
#data-nutrition-label .navigator .close{position: relative; display: block; float: left;}
#data-nutrition-label .navigator .learn-nav{position: relative; display: none; float: left; display: none;}
#data-nutrition-label .navigator .learn-nav .back{position: relative; float: left; margin: 0 10px 0 0;}
#data-nutrition-label .navigator .learn-nav .icon{position: relative; float: left; margin: 0 5px 0 0; width: 4px; height: 8px;}
#data-nutrition-label .navigator .learn-nav .divider{position: relative; float: left; height: 9px; border-left: 1px solid #EE2E24; margin: 3px 10px 0 0;}

#data-nutrition-label .slide-window{position: relative; display: block; width: 654px; height: 550px; overflow: hidden;}
#data-nutrition-label .slide-window .container{position: relative; display: block; width: 1500px; height: 550px;}

#data-nutrition-label .content{position: relative; display: block; overflow: hidden; margin: 10px; width: 654px; float: left;}
#data-nutrition-label .content .image{position: relative; display: block; float: left; margin: 4px 10px 10px 0;}
#data-nutrition-label .content .description{position: relative; display: block; float: left;}
#data-nutrition-label .content .description .ingredients{position: relative; display: block; margin: 10px 0 15px 0;}
#data-nutrition-label .content .description .learn{position: relative; display: block; margin: 5px 0 0 0; cursor: pointer;}
#data-nutrition-label .content .description .learn .icon{position: relative; display: block; float: left;}
#data-nutrition-label .content .description .learn .text{position: relative; display: block; float: left; margin: 0 5px 0 0;}     

#data-nutrition-label .how{position: relative; display: block; overflow: hidden; margin: 10px; width: 654px; float: left;}
#data-nutrition-label .how .image{position: relative; display: block; float: left; margin: 4px 10px 10px 0;}
#data-nutrition-label .how .description{position: relative; display: block; float: left; margin: 0 0 15px 9px;}
#data-nutrition-label .how .description .info{position: relative; display: block; width: 400px; margin: 10px 0 25px 0;}
#data-nutrition-label .how .description .selections{position: relative; display: block; width: 410px;}
/*#data-nutrition-label .how .description .selections a, #data-nutrition-label .how .description .selections a:link, #data-nutrition-label .how .description .selections a:visited, #data-nutrition-label .how .description .selections a:active{}
#data-nutrition-label .how .description .selections a:hover{text-decoration: none;}*/

#data-nutrition-label .how .image .overlay{position: absolute; display: block; top: 0; left: 1px; width: 211px; height: 401px; -ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=30)"; filter: alpha(opacity=30); -moz-opacity:0.3; -khtml-opacity: 0.3; opacity: 0.3;}
#data-nutrition-label .how .image .overlay .serving, #data-nutrition-label .how .image .overlay .calories, #data-nutrition-label .how .image .overlay .daily-value, 
    #data-nutrition-label .how .image .overlay .fats, #data-nutrition-label .how .image .overlay .sodium, #data-nutrition-label .how .image .overlay .carbs, 
    #data-nutrition-label .how .image .overlay .fiber, #data-nutrition-label .how .image .overlay .sugars, #data-nutrition-label .how .image .overlay .protein, 
    #data-nutrition-label .how .image .overlay .vitamins{position: relative; display: block; width: 209px; /*background-color: #ff8f23;*/ background-color: transparent; cursor: pointer;}
#data-nutrition-label .how .image .overlay .serving.selected, #data-nutrition-label .how .image .overlay .calories.selected, #data-nutrition-label .how .image .overlay .daily-value.selected, 
    #data-nutrition-label .how .image .overlay .fats.selected, #data-nutrition-label .how .image .overlay .sodium.selected, #data-nutrition-label .how .image .overlay .carbs.selected, 
    #data-nutrition-label .how .image .overlay .fiber.selected, #data-nutrition-label .how .image .overlay .sugars.selected, #data-nutrition-label .how .image .overlay .protein.selected, 
    #data-nutrition-label .how .image .overlay .vitamins.selected{background-color: #ff8f23;}
#data-nutrition-label .how .image .overlay .serving.clicked, #data-nutrition-label .how .image .overlay .calories.clicked, #data-nutrition-label .how .image .overlay .daily-value.clicked, 
    #data-nutrition-label .how .image .overlay .fats.clicked, #data-nutrition-label .how .image .overlay .sodium.clicked, #data-nutrition-label .how .image .overlay .carbs.clicked, 
    #data-nutrition-label .how .image .overlay .fiber.clicked, #data-nutrition-label .how .image .overlay .sugars.clicked, #data-nutrition-label .how .image .overlay .protein.clicked, 
    #data-nutrition-label .how .image .overlay .vitamins.clicked{background-color: #ff8f23;}
#data-nutrition-label .how .image .overlay .serving{height: 10px; margin: 55px 0 0 0;}
#data-nutrition-label .how .image .overlay .calories{height: 13px; margin: 28px 0 0 0;}
#data-nutrition-label .how .image .overlay .daily-value{height: 12px; margin: 4px 0 0 0;}
#data-nutrition-label .how .image .overlay .fats{height: 59px; margin: -1px 0 0 0;}
#data-nutrition-label .how .image .overlay .sodium{height: 13px; margin: 11px 0 0 0;}
#data-nutrition-label .how .image .overlay .carbs{height: 13px; margin: -1px 0 0 0;}
#data-nutrition-label .how .image .overlay .fiber{height: 12px; margin: -1px 0 0 0;}
#data-nutrition-label .how .image .overlay .sugars{height: 13px; margin: -1px 0 0 0;}
#data-nutrition-label .how .image .overlay .protein{height: 13px; margin: -1px 0 0 0;}
#data-nutrition-label .how .image .overlay .vitamins{height: 63px; margin: 7px 0 0 0;}

/* Firefox 3.6 Fix Rollover Mappings */
.rollover-mappings-hidden{position: absolute; visibility: collapse; top: -10px; left: 0; width: 100%; height: 0px; z-index: 10000;}
.rollover-mappings-hidden .grampa-hidden, .rollover-mappings-hidden .rolls-hidden, .rollover-mappings-hidden .best-bread-hidden, .rollover-mappings-hidden .dutch-country-hidden, .rollover-mappings-hidden .stro-white-hidden{position: absolute; visibility: collapse;}
.rollover-mappings-hidden .grampa-hidden{top: 180px; left: 910px;}
.rollover-mappings-hidden .rolls-hidden{top: 368px; left: 683px;}
.rollover-mappings-hidden .best-bread-hidden{top: 675px; left: 425px;}
.rollover-mappings-hidden .dutch-country-hidden{top: 650px; left: 675px;}
.rollover-mappings-hidden .stro-white-hidden{top: 600px; left: 915px;}
        
.rollover-mappings-hidden .rollover-content-hidden .grampa-hidden, .rollover-mappings-hidden .rollover-content-hidden .rolls-hidden, .rollover-mappings-hidden .rollover-content-hidden .best-bread-hidden, .rollover-mappings-hidden .rollover-content-hidden .dutch-country-hidden, .rollover-mappings-hidden .rollover-content-hidden .stro-white-hidden{position: absolute; visibility: collapse;}
.rollover-mappings-hidden .rollover-content-hidden .grampa-hidden{top: 150px; left: 850px;}
.rollover-mappings-hidden .rollover-content-hidden .rolls-hidden{top: 300px; left: 450px;}
.rollover-mappings-hidden .rollover-content-hidden .best-bread-hidden{top: 560px; left: 225px;}
.rollover-mappings-hidden .rollover-content-hidden .dutch-country-hidden{top: 555px; left: 475px;}
.rollover-mappings-hidden .rollover-content-hidden .stro-white-hidden{top: 515px; left: 875px;}


/*Intro footer related-----------------------------------------------------------------------*/
#introFooter { position: fixed; width: 100%; bottom: 0px; height: 100px; background-color: White; text-align:center; display:none; z-index: 100000; }
#introLogo { position: relative; margin: -55px auto 8px auto; display:none; }
#introFooter .textHolder { float: left; display:none; }
#introFooter h1 { position: relative; font-family: Arial; display:inline; left:0px; font-weight: lighter;}
#textHolder1 { width: 51%; }
#textHolder2 { width: 49%; }
#introText1 { color: #FF8F23; float: right; margin-right: 5px; font-weight: normal;}
#introText2 { float: left; margin-left: 5px; font-weight: normal;}

#spinner 
{
    position: fixed; width: 32px; height: 32px; top: 50%; left: 50%; background-color: White;
    display:none;
}

