/* Styles common to all calculator front end instances.  Client specific styles are located in the MasterPages/Styles folder for each site */



#overlay{ display: none;}

h2{ font-size: 14px;font-weight: normal;color: #58585A;margin: 2px;}
.wrapper{ margin: 0 0 20px 20px;width: 640px;vertical-align:top;position:relative;}

/*Container for top two sections to prevent wrapping*/
#selectionConfigContainer{width:639px;min-height:600px;display:inline-block;float:left;}

/*Menu item choice*/
#selectionContainer{width: 317px;height: 400px;background-color:#E9E9E9; float: left; margin: 5px 5px 0 0;}
#selectionControl{width: 317px;height: 370px;background-color:#E9E9E9;overflow: auto !important;float: left;margin: 0 5px 0 0;position: relative;}
#accordion .ui-accordion, #accordion .ui-accordion-content{overflow:hidden;}
.buildMeal{ max-width: 639px;height: 30px;font-size: 16px;font-weight: bold; text-align: center;color: #FFFFFF;background-color: #CFA75B;line-height: 30px; display:none;}

.calcHeader{width:639px;}
.calcHeader a{text-decoration:none;}

/*Allergen Filter*/
.allergen-arrow{color:#ffffff;font-size:14px;margin:0 0 0 5px;}
#allergenFilterContainer{color:#303436;width:639px;float:left;border-bottom:dotted 1px #CFA75B;margin:10px 0 0 0px; text-align:center;}
.allergenFilterItemContainer { text-align:left; white-space:nowrap; display:inline-block; float:left; margin-left:10px;}
.allergen-icon{font-size:12px;color:#EA4D19;margin:0 3px 0 0;}
#allergenHeaderIconDef{color:#303436; width:639px;text-align:center; float:left;margin: 10px 0 5px 0;}

#allergenFilterDisclaimerTitle{width:450px; text-align:left;color:#303436;font-size:20px; font-weight:bold;border-bottom:dashed 1px #58585A; float:left;margin:0 20px 0 20px;}
#allergenFilterDisclaimer{width:450px;color:#303436; font-size:10px;float:left; text-align:left;margin:0 20px 0 20px;}
#allergenFilterDisclaimerButtons{width:450px;text-align:center;}

.cancelButton{margin:15px 0 0 25px;font-size:11px; width:100px;height:20px;color:#ffffff;background-color:#303436;border:none;text-transform:uppercase;}
.allergenDisc{margin:5px 0 5px 0;}
.allergenInstruction{font-style:italic;font-size:12px;}

/*Selection Option Popup*/
#selectionWindowCloseButtonContainer{width:100%;text-align:center; }
#selectionOptionTitle{font-size:12px;color:#303436;margin:5px 0 0 5px;width:220px;font-weight:600;}
#selectionPopupContainer{margin:15px 5px 5px 0px; }
.selectionDropdown{font-size:11px;width:150px;margin:15px 0 10px 30px;}
#selectionWindowCloseButtonContainer{width:100%;text-align:center; }
#accordion { width: 300px;}
.headerContainer{width: 300px; text-align: center;margin: 0;padding: 0;}
.groupDivHidden{ display: none;}
.itemContainer{ width: 296px;height:25px; background-color: #ffffff; margin: 1px 0 0 0; padding: 3px 0 0 0; display: inline-block; float: left;}
.itemLinkContainer{ width: 265px;height:30px; float: left;}
.itemLinkInfoContainer{ width: 20px;float: left;padding: 5px 0 0 10px;font-size:16px;}
.itemContainer:hover{ background-color: #f1f1f1;}
.infoLink{ cursor: pointer;color: #303436; text-decoration:none;}
.infoLinkAllergen{ cursor: pointer;color: #ff0000;}

.groupItemTable{ border-collapse: collapse;}
.groupItemTable tr{margin:0 0 0 0;padding:0 0 0 0;}
.groupItemCell{ vertical-align: middle;text-align: center;width: 80px;height: 30px;padding: 0 5px 0 5px; margin:0 0 0 0;}
.groupContainer         {border-bottom: solid #A9A9A9 8px; padding: 0 0 0 0; margin: 10px 0 10px 7px; width: 90px;height:30px; font-size: 10px; background-color: #FFFFFF; border-radius: 8px; display: inline-block;float: left; line-height: 1.3; text-align: center; position:relative;} /*the appearance of a single group*/
.groupCustomizeContainer         {border-bottom: solid #A9A9A9 8px; border-left: solid #A9A9A9 1px; border-right: solid #A9A9A9 1px; border-top: solid #A9A9A9 1px; padding: 0 0 0 0; margin: 10px 0 10px 10px; width: 87px;height:30px; font-size: 10px; background-color: #FFFFFF; border-radius: 8px; display: inline-block;float: left; line-height: 1.3; text-align: center; position:relative;} /*the appearance of a single group*/
.groupCustomizeContainer .customize-circle{font-size:16px;color:#A9A9A9;position:absolute;top:-9px;left:-7px;}
.groupContainer a .groupContainer a:link, .groupContainer a:visited, .groupContainer a:active, .groupContainer a:hover {color:#303436;}
.groupLink{ text-decoration: none;}
.groupItemContainerSelected{width: 294px;border-bottom-right-radius: 8px;border-top-right-radius: 8px; background-color: white;display: inline-block;padding: 8px 0 8px 0;}
.groupItemCustomizeContainerSelected{width: 287px;border-radius: 8px; background-color: white;display: inline-block;padding: 8px 0 8px 0px;margin:0 0 0 10px;}
.groupItemContainer{ display: none;} /*contains checkboxes for items in the group*/
.groupItem         { width: 130px; color: #303436; margin-left: 10px;font-weight: normal; font-size: 10px; display: inline-block;float: left;}/*surrounds the checkbox*/

.groupArrow{ position: absolute;top: 32px;left: 42px;}
#customizeGroupTable{width:295px;border-collapse:collapse;margin:0 0 0 0;}
#customizeLineLeft {width:90px;padding:0 0 4px 10px;color:#A9A9A9;text-align:right;}

#customizeLineRight{width:90px;color:#A9A9A9; padding:0 0 4px 0;}
.allergenLabelPlaceholder{width:12px;display:inline-block;}

/*Selected item for configuration*/
#configControl{ width: 317px;height: 400px;background-color:#E9E9E9;float: left;margin: 5px 0 0 0;}
#configTop{ width: 315px;height: 348px;overflow: auto !important;}
.noSelectionDiv{ background-color: #a8a9ad;height: 7px;width: 300px; margin:0 0 0 5px;}

.configCalSummary{width:290px; background-color:#00ADEE; margin:0 0 0 5px;}
.configCalCountLabel{text-align:left;color:#ffffff;font-size:12px;margin:0 0 0 5px;}
.configCalCount{text-align:right;color:#ffffff;font-size:12px;font-style:italic;margin:0 5px 0 120px;}

.configItemHeader{ font-size: 10px;font-style: italic;color: #303436;margin: 0 0 0 5px; width: 285px;}
.configItemHeaderInfoLink{ margin: 0 0 0 8px;color: #303436; font-size:15px; line-height: 20px;text-decoration:none;}
.configItemHeaderIcon{vertical-align:middle;font-size:14px;}
.configItemRow{ background-color: #FFFFFF;width: 285px;height: 20px;margin: 0 0 0 5px;padding: 2px 0 0 5px; display: inline-block;float: left;border-bottom: solid 1px #E9E9E9;}
.configItem{ width: 230px;float: left;font-size: 13px;}

.configItemRemoveLink {margin: 0 0 0 10px;color: #303436; font-size:15px; line-height: 20px; text-decoration: none;}
.configItemInfoLink{ margin: 0 0 0 8px;color: #303436; font-size:15px; line-height: 20px;text-decoration:none;}

#configBottom{ width: 315px;height: 32px;}
#configBottomLeft{ width: 157px;height: 30px; float: left;}
#configBottomLeft a:link, #configBottomLeft a:visited, #configBottomLeft a:active {text-decoration:none;color:#3F3E40;}
#configBottomLeft a:hover{color:#58575A;}
#configBottomLeft .refreshConfigLink{font-size:23px; margin:0 0 0 10px;}
#configBottomLeft .removeConfigLink{font-size:27px; margin:0 0 0 10px;}

/*Nutrition Label - horizonal*/
#labelContainer{width: 639px; padding:20px 0 20px 0; margin:0 0 5px 0; display: inline-block; float:left;border: 1px solid #E9E9E9;border-radius:7px;}
.calTable{border-collapse: collapse; width:190px;}
#calSection {width:190px; height:190px; padding:0 0 0 10px; display:inline-block;float:left;}
.calTable .calTitleCell{height:40px;}
#labelSection{width:400px; height:200px; display:inline-block;float:left;}
#calTitle{font-size:14px;font-weight:bold;padding:0px 0px 6px 0px;vertical-align:bottom;color:#303436;}
#calValue{font-size:18px;font-weight:bold;padding:5px 0px 9px 5px;vertical-align:bottom;color:#303436;}

.footnote{font-size:10px;padding:10px 0 0 0;color:#303436;}

.nutrTable{font-size: 12px;border-collapse: collapse;color:#303436;}
.nutrTable th{font-weight:normal;}
.nutrTable td{padding:3px 3px 3px 3px;}
.nutrTable .thinLine{border-bottom:1px solid #E9E9E9;}

.nutrTable .amountPerMealHeader{width:150px;padding-bottom:0px;margin-bottom:0;}
.nutrTable .percDvHeader{width:50px;}
.nutrTable .bold{ font-weight: bold;}
.nutrTable .indent{margin:0 0 0 10px;}
.nutrTable .dv{text-align:right;}
.nutrTable .centerSpacer{width:50px;}
.nutrMain{width:430px;}
.nutrExtended{width:430px;}
.nutrTableLabelWidth{width:430px;}

#labelBottomContainer{width:610px;float:left;display:inline-block;}
#supplementLinkContainer{display:inline-block;float:left;min-width:175px;max-width:245px;height:45px;}
#nutrSuppContainer{width:110px;height:40px;border:solid #E9E9E9 1px; border-radius:3px;margin:0 0 10px 10px;float:left;display:inline-block;}
#nutrSuppContainer .nutrSuppText{color:#303436;font-size:14px;line-height:18px;font-style:italic;margin:2px 0 0 15px;float:left;display:inline-block;}


#allergenSuppContainer{width:110px;height:40px;border:solid #E9E9E9 1px; border-radius:3px;margin:0 0 10px 10px;float:left;display:inline-block;}
#allergenSuppContainer .allergenSuppText{color:#303436;font-size:14px;line-height:18px;font-style:italic;margin:2px 0 0 15px;float:left;display:inline-block;}

#infoLinkContainer{width:350px;margin:25px 0 0 0;padding:0 0 0 25px;}
#infoLinkContainer td a{color:#303436;text-decoration:none;font-size:14px;margin:0 10px 0 0;}
#infoDisplayContainer{width:620px;float:left;}
#infoDisplayContainer .linkSubText {font-size: 10px;line-height: 14px;margin:0 0 0 10px;}
.shareContainer{width:639px;height:45px;float:left;padding:0 0 50px 0;margin:5px 0 0 0;}
#shareMeal {width: 185px;height: 40px; margin: 15px 0 0 0;float:left;display:inline-block;}
#shareMeal img{margin:0 10px 0 0;}
#shareIcons{width:300px;float:left;display:inline-block;margin:10px 0 0 20px;}
#shareIcons .facebookIcon {font-size:36px;margin:0 15px 0 0;}
#shareIcons .twitterIcon{font-size:36px;margin:0 15px 0 0;}
#shareIcons .emailIcon{font-size:36px;margin:0 15px 0 0;}
#shareIcons .printIcon{font-size:36px;margin:0 15px 0 0;}
#shareIcons .facebookLink a:link, #shareIcons .facebookLink a:visited, #shareIcons .facebookLink a:active{color:#3b5998;}
#shareIcons .facebookLink a:hover{color:#303436;}
#shareIcons .twitterLink a:link, #shareIcons .twitterLink a:visited, #shareIcons .twitterLink a:active{color:#55acee;}
#shareIcons .twitterLink a:hover{color:#303436;}


.ingredientTitle{ font-weight: bold;font-size: 10px;line-height: 14px; margin: 10px 0 0 0;} /*class is hard coded for ingredient titles*/

/*Meal List*/
#mealControl{width: 639px; background-color:#ffffff;margin: 30px 15px 20px 0; float: left;}
#mealControlHeader{width:639px;height:28px;border-bottom: dashed 1px #A9A9A9;}
#mealControlCalCount{color:#00ADEE;font-size:16px;height:28px;float:left;display:inline-block;margin:0 0 0 20px;}
#viewFullMeal{float:right;}

#verticalText .vertical{color:#FFFFFF;font-size:90px;margin:0 0 0 -27px; padding:0 0 0 0;}
.noItemsDiv{ width: 400px; font-size: 16px; color: #303436; margin: 10px 0 0 140px;}

.mealItemIcon{ width: 170px; height:30px; float: right;}
.mealItemIcon a:link, .mealItemIcon a:hover, .mealItemIcon a:active, .mealItemIcon a:visited{text-decoration:none;color: #3F3E40;}

.removeItemIcon {padding:3px 10px 0 10px; border-right:solid #E9E9E9 1px;width:25px;display:inline-block;float:left;}
.cloneItemIcon {padding:2px 15px 0 20px; border-right:solid #E9E9E9 1px;width:25px;display:inline-block;float:left;}
.infoItemIcon {padding:3px 15px 0 20px;width:25px;display:inline-block;float:left;}

.mealItemTitle{ width: 460px;float: left;}
.mealItemTitleSelected{ width: 290px;float: left;}
.mealItemRow{font-size: 16px; background-color: #FFFFFF;color: #3F3E40; padding: 9px 0 0 0px;margin: 0 0 0 0; height: 30px; width: 639px; border-bottom:solid 1px #e9e9e9;}
.mealItemRowSelected, .mealItemRowSelectedNoArrow{font-size: 16px; background-color:#FFFFFF ; position: relative;color: #3F3E40;width: 468px;height: 30px; margin: 0 0 0 0; padding: 9px 0 0 10px; border-bottom: solid 1px #E9E9E9;border-right: solid 1px #E9E9E9;float: left;}

 /*css arrow styles for selected meal row*/
.mealItemRowSelected:after, .mealItemRowSelected:before {left: 100%;top: 50%;border: solid transparent;content: " ";height: 0;width: 0;position: absolute;pointer-events: none;}
.mealItemRowSelected:after {border-color: #3F3E40;border-color: rgba(13, 88, 64, 0);border-left-color: #3F3E40;border-width: 8px;margin-top: -8px;}
.mealItemRowSelected:before {border-color: #3F3E40;border-color: rgba(13, 88, 64, 0);border-left-color: #3F3E40;border-width: 7px;margin-top: -7px;}
/*end css arrow styles*/

.mealItemInfo{ width: 153px;height: 230px;background-color: #EEEEEE;color: #e9e9e9;float: left;margin: 0 0 0 9px;position: absolute;left: 477px;text-align: center;}
.mealItemInfoTable{ border-collapse: collapse;line-height: 12px; color:#303436;width: 130px;margin: 0 0 0 10px;}

.mealItemInfoTable td{ font-size: 10px; line-height: 14px;}
.mealItemInfoTable .nutritionItem{ text-align: left; border-bottom: solid #303436 1px;}
.mealItemInfoTable .nutritionValue{ text-align: right; border-bottom: solid #303436 1px; padding: 0 5px 0 0;}
.mealItemInfoTable .nutritionItemBottom { text-align: left; border-bottom: 0;}
.mealItemInfoTable .nutritionValueBottom { text-align: right; border-bottom: 0; padding: 0 5px 0 0;}
.mealItemInfo a{position:absolute; top:0px; left:135px;text-decoration:none;color:#3f3e40;font-size:16px;}

/*Nutrition Popup Styles*/
/*RadWindow borderless*/
.borderLessDialog .rwIcon{display:none;}
.borderLessDialog.RadWindow { border: none; padding: 0; }
.borderLessDialog.RadWindow .rwContent { border: none; border-radius:8px;}
.popupCloseButtonLink{position: absolute; right: 8px; top: 5px;}
.popupCloseButtonIcon{font-size:20px; color:#303436;margin:3px 0 0 0;}
#popupItemTitle{font-size:14px;color:#303436;margin:5px 0 0 5px;width:250px;}
#popupItemDisplayDescription{font-size:12px;line-height:14px;color:#303436;margin:0 0 0 5px;width:250px;}

.nutritionInfoTable{ font-size: 10px;line-height: 12px;border-collapse: collapse;width: 260px;margin:10px 0 0 5px;}
.nutritionInfoTable th{font-size: 11px;line-height: 11px;font-style: italic;text-align: center; color: #ffffff; background-color: #58585A;padding: 3px 0 3px 0;}
.nutritionInfoTable td{ text-align: left; vertical-align: middle;padding: 3px 2px 1px 2px;}
.nutritionInfoTable .oddRow{color: #303436; background-color: #E9E9E9;}
.nutritionInfoTable .evenRow{color: #303436; background-color: #FFFFFF;}
.nutritionInfoTable .allergenRow{color: #303436; background-color: #FFFFFF;}

.nutritionInfoTitle { font-size: 16px; font-weight: bold; width:250px;}
.continueToCustomizeContainer{position:absolute;top:275px;left:18px;}
.continueToCustomizeContainer a:link, .continueToCustomizeContainer a:visited, .continueToCustomizeContainer a:hover, .continueToCustomizeContainer a:active {font-size:12px;font-weight:600;text-decoration:none;color:#333333;}


/*Powered by Trabon footer*/
#poweredByContainer{text-align:right;width:639px;height:20px;display:inline-block;}
#poweredByLink{font-size:12px;margin:0 5px 5px 0;text-decoration:none;font-style:italic;color:#303436;}
#poweredByText{position:relative;top:-2px;}
.pwoeredByImage{margin:10px 0 0 3px;}

.wrapper .ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited { color: #FFFFFF; text-decoration: none; }

.wrapper .ui-helper-reset{ font-size: 13px;}

/*accordion icons*/
.wrapper .ui-accordion .ui-accordion-header .ui-accordion-header-icon { position: absolute; left: 250px; top: 50%; margin-top: -8px; }

.wrapper .ui-state-default .ui-icon{ background-image: url('images/icons/defaultIconTrans.png');}
.wrapper .ui-state-active .ui-icon{ background-image: url('images/icons/selectedIconTrans.png');}
.wrapper .ui-icon {width: 17px;height: 17px;}
.wrapper .ui-icon-triangle-1-e { background-position: 0 0;}
.wrapper .ui-icon-triangle-1-s { background-position: 0 0;}