@charset "utf-8";
/* Minimum screen size: 1150 * 590px */
:root{
	--txtcol:#333;
	--hcol:#0089bf; /* primary text/background highlight colour */
	--h2col:#005d80; /* primary background highlight colour */
	--h3col:#ff6600; /* secondary text/background highlight colour */
	--bgcol:#FFF;
	--bgcol2:#E9E9E9;
	--bgcol3: #FFE;	/* background highlight color for hovers */
	--bgcol4: #ecf6fd; /* alternate background color for multi-item containers */
}
*{cursor: default; -webkit-user-select: none; -moz-animation: none; }
::selection { background: #FF8; color:#444; }
	input::selection { background: var(--h3col); }
input:focus::-webkit-input-placeholder{color:#D9D9D9!important;}
*:focus { outline:none; }
[draggable=true]{ -khtml-user-drag:element; -webkit-user-drag:element; -khtml-user-select:none; -webkit-user-select:none; }
input[draggable=false]:focus, input[draggable=true]:focus{cursor:text!important; }
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {-webkit-appearance: none;margin: 0;}
input[type=number] {-moz-appearance:textfield;}
svg:not([viewBox]) {max-height:0px;}

html, body{height:100%; overflow:hidden;}
body{	font-family:Roboto, Arial, Helvetica, sans-serif; font-size:13px; color:#555; background:url(/media/back-watermark.png) no-repeat bottom center; }
body#index::before{ content:''; position:absolute; top:30px; left:0; right:0; height :40px; background-color:#EEE; }

body.rtlLanguage{direction: rtl;}
#loading{-webkit-transition: opacity 0.3s linear;}
	#loading p{margin-top:53vh; font-family:Roboto, Arial, Helvetica, sans-serif; color:#CCC!important; font-size:32px!important; text-align:center}
#wrapper{ position:absolute; top:30px; bottom:0px; left:0px; white-space:nowrap; backface-visibility: hidden; will-change:left; transition: left 1s cubic-bezier(0, 0, .16, 1); }
.noslide #wrapper{transition:none!important;}

h2{ font-size: 24px; letter-spacing: -0.5px; font-weight: 900; color:#444; }
	h2.greyback{padding:15px;}
h3{ text-transform: uppercase;  color: #666; font-weight: 900;}
h4{ font-size:16px; color:#444; margin-bottom:10px; }
h5 { text-transform: none; background-color: #EEE; padding:10px; font-size: 19px; font-weight:normal; margin:20px 0; display: block} /*Display block needed to override cores.css display table, in folders there is an h5 inside options > submenu which has column-count and column-gap properties set, a child with display table will lead to an browser error 5 in chrome*/
	h5.noBmargin{margin-bottom:0px; border-bottom-width:0}
	h5 em.fr{margin:0;}
	h5 .grey{color:#999;}

a.inlinelink{color:var(--hcol); border-bottom:dotted 1px var(--hcol); font-weight:bold; cursor:pointer}
	a.inlinelink:hover{color:#06F; border-bottom:dotted 1px #06F; font-weight:bold; cursor:pointer}
.lcaps{text-transform:lowercase !important}
.lcaps:first-letter {text-transform: uppercase;}

.em{font-style:italic;}
.size{width:300%!important;}
.fslash:after{content:'/';display:block; margin:0px 3px;}
.iblock{display: inline-block!important;}
li.shade{background-color:#696969; text-shadow:1px 1px 2px rgba(0,0,0,0.5); box-shadow:1px 1px 4px rgba(0,0,0,0.5);}
.visible{ visibility:visible!important;}
.noitalic{font-style: normal;}
.prefade{opacity:0!important;}
.ellipsis{text-overflow:ellipsis!important; overflow:hidden!important; white-space:nowrap!important;}
.flashing{color:var(--h3col); border-color:var(--h3col); transition:all 500ms; animation:blink 0.4s infinite linear;}
.show{ display:block!important;pointer-events:all; }
.enabled{pointer-events:all; color:var(--hcol); cursor:default; background:white; }
.allowOnclick{pointer-events:all!important}
.star:before{content:"★"; color:#AAA; font-size:13px;}
.alignCenter{margin:0 auto;}
.invisible{visibility:hidden!important; pointer-events:none;}
.minText{font-size:11px!important;}
.smallText{font-size:9px!important; letter-spacing:normal!important}
	.smallText.caps{font-size:9px!important; font-weight:bold;}
.medText{font-size:12px!important; vertical-align:middle}
.largeText,.headingText{font-size:16px!important;}
.td-food input.headingText{font-size:19px!important;border: solid 1px transparent;max-width: 418px;}
.monospace{font-family:Courier,monospace!important;}
.empQ{opacity:0.2; font-style:italic;}
.inline { display:inline-block!important; }

.bodyTxt{ padding:30px 50px; }
	.bodyTxt p{ margin:1em 0; line-height: 140%; }

.blue{ color:var(--hcol)!important; }
	.blueback:not(:hover){ background-color:var(--h2col)!important; }
	.darkblue{ background-color:var(--h2col)!important;}
.blueline { color:var(--hcol); border-bottom:solid 3px #EEE; cursor:pointer; line-height:100%; transition:color 200ms; padding:3px; transition:all 250ms }
	.blueline:hover, .hoverline:hover { color:var(--h3col); border-bottom:solid 3px currentColor; }
	.blueline * { pointer-events:none; }
	.txtlink:hover{color:var(--h3col);}
.orangeline{color:var(--h3col); border-bottom:dotted 1px var(--h3col); cursor:pointer;}
  .orangeline:hover{font-weight: bold;}
.red{color:#C00!important;}
	.red.back{ background-color:#FFE1E1;}
.orange, .h3col{color:var(--h3col)}
	.orangeback{ background-color:var(--h3col)!important;}
	.orange.back { background-color:#FFEDC5; }
	a.orangeback:hover{background-color:#fd802d!important }
	.orangeborder{ border-color: var(--h3col)!important; }
.green{color:#090;}
	.green.back{ background-color:#E5FFC5;}
.grey{}
	select.grey{color:#AAA!important;}
	a.grey:hover{color: var(--hcol)}
.darkGrey{color:#aaa!important;line-height:normal!important;}
	.greyback, .grey.back{background: #EEE;}
.whiteback:not(:hover){background:#FFF!important;}
.dgrey{color:#777;}
	.dgreyback{background:#555 !important; color:#FFF;}
	.dgreybackcolor{background-color:#555 !important;}
.yellow{color:var(--bgcol3);}
	.yellowback{background:var(--bgcol3);}


.auto-col{display: flex;justify-content: flex-end;padding-right: 15px;}/*AUG22 38531 new class for cols which content has to be aliged at the end*/
.threedots::after {content: '\2807'; font-size: 14px;}

.m-0 {margin: 0!important;}
.m-0_25 {margin: 0.25rem;}
.m-0_5 {margin: 0.5rem;}
.m-0_75 {margin: 0.75rem;}
.m-1 {margin: 1rem;}
.m-1_25 {margin: 1.25rem;}
.m-1_5 {margin: 1.5rem;}
.m-1_75 {margin: 1.75rem;}
.m-2 {margin: 2rem;}

.ml-0 {margin-inline-start: 0!important;}
.ml-0_25 {margin-inline-start: 0.25rem;}
.ml-0_5 {margin-inline-start: 0.5rem;}
.ml-0_75 {margin-inline-start: 0.75rem;}
.ml-1 {margin-inline-start: 1rem;}
.ml-1_25 {margin-inline-start: 1.25rem;}
.ml-1_5 {margin-inline-start: 1.5rem;}
.ml-1_75 {margin-inline-start: 1.75rem;}
.ml-2 {margin-inline-start: 2rem;}

.mr-0 {margin-inline-end: 0!important;}
.mr-0_25 {margin-inline-end: 0.25rem;}
.mr-0_5 {margin-inline-end: 0.5rem;}
.mr-0_75 {margin-inline-end: 0.75rem;}
.mr-1 {margin-inline-end: 1rem;}
.mr-1_25 {margin-inline-end: 1.25rem;}
.mr-1_5 {margin-inline-end: 1.5rem;}
.mr-1_75 {margin-inline-end: 1.75rem;}
.mr-2 {margin-inline-end: 2rem;}

.mt-0 {margin-block-start: 0!important;}
.mt-0_25 {margin-block-start: 0.25rem;}
.mt-0_5 {margin-block-start: 0.5rem;}
.mt-0_75 {margin-block-start: 0.75rem;}
.mt-1 {margin-block-start: 1rem;}
.mt-1_25 {margin-block-start: 1.25rem;}
.mt-1_5 {margin-block-start: 1.5rem;}
.mt-1_75 {margin-block-start: 1.75rem;}
.mt-2 {margin-block-start: 2rem;}

.mb-0 {margin-block-end: 0!important;}
.mb-0_25 {margin-block-end: 0.25rem;}
.mb-0_5 {margin-block-end: 0.5rem;}
.mb-0_75 {margin-block-end: 0.75rem;}
.mb-1 {margin-block-end: 1rem;}
.mb-1_25 {margin-block-end: 1.25rem;}
.mb-1_5 {margin-block-end: 1.5rem;}
.mb-1_75 {margin-block-end: 1.75rem;}
.mb-2 {margin-block-end: 2rem;}

.mx-0 {margin-inline: 0!important;}
.mx-0_25 {margin-inline: 0.25rem;}
.mx-0_5 {margin-inline: 0.5rem;}
.mx-0_75 {margin-inline: 0.75rem;}
.mx-1 {margin-inline: 1rem;}
.mx-1_25 {margin-inline: 1.25rem;}
.mx-1_5 {margin-inline: 1.5rem;}
.mx-1_75 {margin-inline: 1.75rem;}
.mx-2 {margin-inline: 2rem;}

.my-0 {margin-block: 0!important;}
.my-0_25 {margin-block: 0.25rem;}
.my-0_5 {margin-block: 0.5rem;}
.my-0_75 {margin-block: 0.75rem;}
.my-1 {margin-block: 1rem;}
.my-1_25 {margin-block: 1.25rem;}
.my-1_5 {margin-block: 1.5rem;}
.my-1_75 {margin-block: 1.75rem;}
.my-2 {margin-block: 2rem;}

.p-0 {padding: 0!important;}
.p-0_25 {padding: 0.25rem;}
.p-0_5 {padding: 0.5rem;}
.p-0_75 {padding: 0.75rem;}
.p-1 {padding: 1rem;}
.p-1_25 {padding: 1.25rem;}
.p-1_5 {padding: 1.5rem;}
.p-1_75 {padding: 1.75rem;}
.p-2 {padding: 2rem;}

.px-0 {padding-inline: 0!important;}
.px-0_25 {padding-inline: 0.25rem;}
.px-0_5 {padding-inline: 0.5rem;}
.px-0_75 {padding-inline: 0.75rem;}
.px-1 {padding-inline: 1rem;}
.px-1_25 {padding-inline: 1.25rem;}
.px-1_5 {padding-inline: 1.5rem;}
.px-1_75 {padding-inline: 1.75rem;}
.px-2 {padding-inline: 2rem;}

.py-0 {padding-block: 0!important;}
.py-0_25 {padding-block: 0.25rem;}
.py-0_5 {padding-block: 0.5rem;}
.py-0_75 {padding-block: 0.75rem;}
.py-1 {padding-block: 1rem;}
.py-1_25 {padding-block: 1.25rem;}
.py-1_5 {padding-block: 1.5rem;}
.py-1_75 {padding-block: 1.75rem;}
.py-2 {padding-block: 2rem;}

.pt-0 {padding-block-start: 0!important;}
.pt-0_25 {padding-block-start: 0.25rem;}
.pt-0_5 {padding-block-start: 0.5rem;}
.pt-0_75 {padding-block-start: 0.75rem;}
.pt-1 {padding-block-start: 1rem;}
.pt-1_25 {padding-block-start: 1.25rem;}
.pt-1_5 {padding-block-start: 1.5rem;}
.pt-1_75 {padding-block-start: 1.75rem;}
.pt-2 {padding-block-start: 2rem;}

.pb-0 {padding-block-end: 0!important;}
.pb-0_25 {padding-block-end: 0.25rem;}
.pb-0_5 {padding-block-end: 0.5rem;}
.pb-0_75 {padding-block-end: 0.75rem;}
.pb-1 {padding-block-end: 1rem;}
.pb-1_25 {padding-block-end: 1.25rem;}
.pb-1_5 {padding-block-end: 1.5rem;}
.pb-1_75 {padding-block-end: 1.75rem;}
.pb-2 {padding-block-end: 2rem;}

.pl-0 {padding-inline-start: 0!important;}
.pl-0_25 {padding-inline-start: 0.25rem;}
.pl-0_5 {padding-inline-start: 0.5rem;}
.pl-0_75 {padding-inline-start: 0.75rem;}
.pl-1 {padding-inline-start: 1rem;}
.pl-1_25 {padding-inline-start: 1.25rem;}
.pl-1_5 {padding-inline-start: 1.5rem;}
.pl-1_75 {padding-inline-start: 1.75rem;}
.pl-2 {padding-inline-start: 2rem;}

.pr-0 {padding-inline-end: 0!important;}
.pr-0_25 {padding-inline-end: 0.25rem;}
.pr-0_5 {padding-inline-end: 0.5rem;}
.pr-0_75 {padding-inline-end: 0.75rem;}
.pr-1 {padding-inline-end: 1rem;}
.pr-1_25 {padding-inline-end: 1.25rem;}
.pr-1_5 {padding-inline-end: 1.5rem;}
.pr-1_75 {padding-inline-end: 1.75rem;}
.pr-2 {padding-inline-end: 2rem;}

.space-between {justify-content: space-between;}
.space-around {justify-content: space-around;}
.space-evenly {justify-content: space-evenly;}
.gap-15{gap: 15px}
.flex-1{flex: 1;}
.grow-0 > * {flex-grow: 0;}
.items-center {align-items: center;}
.hflex > .col.truncate {white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}/*SEP22 42639 added truncate class setting overflow hidden to hide extra text, white-space nowrap to keep the text on the same line and text-overlow ellipsis to add the dots*/
.flex-icenter {align-items: center;}
.flex-istart {align-items: flex-start;}
.flex-iend {align-items: flex-end;}
.flex-jcenter {justify-content: center;}
.flex-jstart {justify-content: start;}
.flex-jend {justify-content: end;}
.flex-jbetween {justify-content: space-between;}
.gap-10 {gap: 10px}
.gap-5 {gap: 5px}
.gap-0 {gap: 0px}
.m-auto {margin: auto !important}
.no-flex-grow {flex-grow: 0;}
.inline-flex{display: inline-flex !important;}
.relative{position: relative !important;}
.flex-flow{flex-flow: wrap;}

.paneheader{padding:12px 20px 11px 20px; color:#FFF; background: #777; line-height:19px; height: 17px;}
.paneheader .largeText{text-shadow:1px 1px 1px rgba(0,0,0,0.1);}
.resetBtn{font-size: 20px!important;}
hr.invis{margin:0}

input{transition:background-color 300ms, border-color 300ms; font-family:Roboto, Arial, sans-serif}
	input:focus, input.enabled:focus, textarea:focus, select:focus:hover, input.focus,select:focus{ outline: none; background-color:#FFF!important; color:var(--h3col)!important; border-color:var(--h3col)!important; cursor: default!important;}
	input:selection{background:var(--h3col);}
input,textarea,.notesdiv *{ -webkit-user-select: text; cursor:text;}
	select{ -webkit-appearance: none; background: #FFF url(/media/back-select.gif) right center no-repeat; max-height:30px; height:30px; box-sizing:border-box; padding-right:12px!important; line-height: 100%; font-family:inherit;}
	select:hover{background-position:right -62px;}
	input,textarea{display:inline-block; padding:3px 5px; border:solid 1px #CCC; box-sizing:border-box; }
	textarea::placeholder{font-style: italic; color:#BBB;}
	form input.required{ border-color: var(--h3col)!important;}
	textarea{display:block; font-family: Roboto,Arial,sans-serif;}
	input[type="checkbox"], .form input[type="checkbox"]{ cursor:default; display:inline-block; width:15px!important; margin-right:10px; vertical-align:middle; padding:0px !important;}
	input[type="file"]{border:0; position: relative; height:34px; color: transparent!important;}
		input[type="file"]:after { content:'CHOOSE FILE...'; position:absolute; top:0; left:0; display:block; color:#FFF; background:var(--h2col); width:120px; border-radius:50px; text-align:center; font-weight:bold; font-size:10px; line-height:30px; }
		input[type="file"]:hover:after { background-color:var(--hcol);}
	input.half, select.half, textarea.half{width:50%!important;}
		#mp_monitorsSub input[type=checkbox],
		#remembermebox input[type=checkbox],
		#extendTrial input[type=checkbox],
		#additionalNutrient input[type=checkbox],#terms input[type=checkbox]{ display:inline-block!important; }
		#closepop{ position:absolute; top:70px; right:20px; background:#1b76bb; color:#FFF; font-size:12px; font-weight:bold; font-family:Arial; height:25px; width:25px; line-height:25px; border-radius:50%; }
		#mp_monitorsSub .delbtn{position:absolute; right: 0px; top: 0px;right:20px;}
		#mp_monitorsSub>div{min-width: 750px !important;column-count:4;overflow:auto;column-gap: 2px;padding-left:10px}
		#mp_monitorsSub.submenu .bluebtn{z-index: 1;bottom:-65px !important}
		.form input.inlineInput{width:40px!important; color:var(--hcol)!important; display:inline-block; float:none!important; font-weight:bold; text-align:center; padding:0!important; vertical-align:baseline; margin:-5px 3px; line-height:35px;}
				.form input.inlineInput.doubleWidth{width:80px!important}
			.form input.inlineInput.wide{width:160px!important}
			.form input.inlineInput.fr{ float: right!important}
			.form input.hiddenInput{ font-weight: bold;  color: #444; display: inline-block; width: 135px; margin: -6px 0px; font-size: inherit; border-color:transparent; background-color:transparent;}
		.form .greyback input {  width: 40px; font-weight: bold; text-align: center; display: inline-block;}
		input[type=checkbox]+label.letterCheck{ display: inline-block; width: 40px; border: 0; background-color: transparent; text-align: center;}
		input[type=checkbox]+label.letterCheck:before{content:attr(data-letter); width: 35px;  height: 35px; line-height:35px;}
		input[type="checkbox"] + label {font-size: 12px;line-height: 24px;}

		/* FANCY RADIOBUTTONS: */
		input[type=radio] { display:none!important;}
			input[type=radio]+label{ font-size:12px; line-height: 24px; border-radius: 50px;}
			input[type=radio]+label:hover{background:var(--bgcol3)}
			input[type=radio]+label:before {content:"\2714\FE0E\a0"; color:rgba(0,0,0,0.3); display: inline-block; width: 22px;  height: 22px; line-height:22px; vertical-align:middle;	margin-right: 8px; 	background-color:rgba(0,0,0,0.1); border-radius: 50%; transition:all 200ms; text-align:center; font-size:10px; font-weight: 900;}
			input[type=radio]+label.fr:before{ float:right; margin-left:8px; margin-right:5px;}
			input[type=radio]:checked + label:before { color:white;	background-color: var(--hcol);}
			input[type=radio]:checked:disabled + label:before{ color: #888;  background-color: #DDD; cursor:not-allowed}
			input[type=radio]:checked:disabled + label{color:#AAA; background:transparent; }

		/* FANCY INPUTS: */
		.form input[type=text].inlineInput.dateMinSize{width:98px!important}
		.form input[type=text].disabled{color: #888; background-color: #EEE; pointer-events: none; }

		/* TOGGLE SWITCHES: */
		.toggle.alwayson{background:var(--hcol)}
			.toggle.alwayson:after{border-color:var(--hcol);}

		.txtToggles{position:relative; display: inline-block; text-align: center; font-weight: bold; font-size: 10px; text-transform: uppercase;}
			.txtToggles>span{ position:absolute; margin-top: -12px; font-size: 8px; text-transform: uppercase; display: block; line-height: 14px; width: 100%; }
			.txtToggles.tabmenu a{ display: inline-block; padding:0 20px; line-height: 35px; color: rgba(0,0,0,0.3); background-color: rgba(0,0,0,0.1); }
			.txtToggles.tabmenu a:after{ display:none!important; }
			.txtToggles.tabmenu a.on{background-color: #005d80; color:#FFF;}
			.txtToggles a:first-of-type{ border-radius:50px 0 0 50px;}
			.txtToggles a:last-of-type{ border-radius: 0 50px 50px 0;}
		.txtToggles{position:relative; display: inline-block; text-align: center; font-weight: bold; font-size: 10px; text-transform: uppercase;}
			.txtToggles>span{ position:absolute; margin-top: -12px; font-size: 8px; text-transform: uppercase; display: block; line-height: 14px; width: 100%; }
			.txtToggles.tabmenu a{ display: inline-block; padding:0 20px; line-height: 35px; color: rgba(0,0,0,0.3); background-color: rgba(0,0,0,0.1); }
			.txtToggles.tabmenu a:after{ display:none!important; }
			.txtToggles.tabmenu a.on{background-color: #005d80; color:#FFF;}
			.txtToggles a:first-of-type{ border-radius:50px 0 0 50px;}
			.txtToggles a:last-of-type{ border-radius: 0 50px 50px 0;}

td,th{border-right:solid #EEE 1px; padding:5px 10px 5px 10px; cursor:default; box-sizing: border-box; overflow:hidden; vertical-align:middle; transition:background 200ms}
tr:hover td{background-color:var(--bgcol3); }
tr.sel td, tr.sel:hover td{background-color:var(--bgcol3);}

td input{width:100%; color: #333; border-radius: 8px;}
table{border-collapse:collapse;}
.inputIcon{padding-right:30px!important;}
#recTable .td-food input.inputIcon{pointer-events: none !important; z-index: 1; position: relative; border-radius: 0;text-overflow:ellipsis;white-space: nowrap;}/*//To make input field readonly in recipes//#66361*/
#recTable .td-food input.inputIcon.editable{pointer-events: all !important; padding-bottom: 32px;  margin-bottom: -22px; z-index:2}/*//To make input field editable in recipes//#66361*/
#recTable .disabled .grabber::before, #recTable .disabled .grabber::after {content: none !important;}

.twocol{position:relative;}
	.twocol .col{width:48%; display:inline-block; height:100%;}
	.twocol .col:nth-child(even){ margin-left:2%}
.btn.on{opacity: 1;}

/*DEPRECATED: use .btn instead */
a.bluebtn, a.greybtn, a.shadowbtn, a.lgreybtn, a.greenbtn, input.bluebtn{background-color:var(--h2col);padding:5px 10px;font-size:9px; text-transform:uppercase; border:solid 1px transparent;font-weight:900;color:#FFF;text-align:center;position:relative;display: inline-block; transition: background 200ms;font-style:normal;}
	a.greybtn{ background-color:#AAA; }
	a.shadowbtn{ background-color:#0003; }
	a.shadowbtn.clear{ background-color:transparent; }
	a.lgreybtn { background-color:#EEE; color:#555; text-shadow:none; box-shadow:none; }
	 a.whitebtn { color:rgb(51, 51, 51); padding:0px 25px; border:solid 2px #EEE; font-size:12px; font-weight:bold; text-align:center; position:relative; display:inline-block; transition:background 200ms, border-color 200ms; background:#FFF; line-height:30px; }
	a.bluebtn:active,a.greybtn:active, a.shadowbtn:active, a.lgreybtn:active, input.bluebtn:active{background-color:var(--hcol)!important; transition:background 150ms}
	a.bluebtn img{vertical-align:middle; height:15px;}
.mealplan a.whitebtn{z-index:0;}
#reportTable .flyoutbtn a.whitebtn{padding:5px;line-height: 100%;}
#reportTable .disabled{pointer-events: all;}
a.bluebtn:hover, a.greybtn:hover,input.bluebtn:hover{  color:#FFF; background-color: color-mix(in srgb, var(--h2col), #FFF 12%);}
	a.bluebtn.large,input.bluebtn.large{padding:8px 20px; font-size:10px; line-height:20px;}
a.greybtn:hover{ background-color: #444; }
a.shadowbtn:hover{ background-color: #0006; }
a.lgreybtn:hover{ background-color:var(--hcol); color: #FFF!important}
a.whitebtn:hover { background:#EEE; border-color:currentColor; color:var(--hcol); }
a.circlebtn{background-color:var(--h2col); color:#fff; text-align:center; border-radius:50%; width:40px!important; height:40px!important; line-height:40px; font-size:10px; position:absolute; display:inline-block; padding:0!important; transition:background 300ms}
	a.circlebtn b { position:absolute; margin-top:30px; color:var(--hcol); width:100%; left:0; }
	a.circlebtn.orangeback b{color: var(--h3col);}
	a.circlebtn.large{width:64px!important; height:64px!important; line-height:64px; font-weight:bold;}
	a.circlebtn:active{transform: scale(0.95);}
a.largebtn{ padding:0 30px; line-height:35px;}
a.xlargebtn { padding:0 40px; line-height:40px; }
.roundbtn.xxxsmall{line-height: 15px;width: 15px;height: 15px;}
/* END DEPRECATED */

.delbtn{float:right; width:20px; height:20px; text-align:center; line-height:16px; font-size:10px; font-family:Roboto, Arial, Helvetica, sans-serif; font-weight:bold; z-index: 1; position: relative; border:solid 2px #e5e5e5; border-radius:50px; text-transform: lowercase; transition:background 300ms, border-color 300ms}
.delbtn.large{ width:30px; height:30px; line-height:26px;}
.delbtn.noborder{ line-height:18px; }
.delbtn.noborder.large{ line-height:30px; }
	.delbtn:hover{ background-color:var(--h3col)!important; color:#FFF!important; border-color:var(--h3col);}
	.delbtn:active{background-color:color-mix(in srgb, var(--h3col) 90%, black 20%)!important; color:#FFF!important; border-color:var(--h3col); }

.imgbtn img{box-shadow: 0 1px 0 rgba(0, 0, 0, 0.1); display: inline-block; transition: box-shadow 300ms; border-radius: 4px;  margin:0!important; cursor: pointer;}
	.imgbtn img:hover{box-shadow:0 1px 3px rgba(0, 0, 0, 0.5); opacity: 0.9;}
	.imgbtn img:active{ transform:scale(0.98)}

.delRDA{ right: 6px; top: 6px;}
.frbtn{ float:right; transform: translateY(-25%); }

.binbtn{background:#EEE url(/media/icon20-bin-dark.gif) no-repeat center; width: 36px; height: 36px; line-height: 36px;border-radius: 50px; transition: background-color 300ms;}
	.binbtn:hover,.bellbtn:hover{background-color: #DDD;}

.bellbtn{ width: 36px; height: 36px; line-height: 36px;border-radius: 50px; background-color:#ddd; transition: background-color 300ms;opacity: 0.6; margin-right: 5px;}
	.bellbtn:before{ content:''; background:url(/media/svg/nutico/frag#bell) no-repeat center;  display:inline-block; width:16px; height:16px; background-size:contain; opacity:0.4;vertical-align:middle; margin-left:10px;}
	.bellbtn:hover{background-color: #ccc;opacity: 1;}
	.bellbtn.on{background-color: var(--h3col);opacity: 1;}
	.bellbtn.on::before{ filter: invert(100%) sepia(0%) saturate(6111%) hue-rotate(119deg) brightness(126%) contrast(90%);opacity:1;}
	.bellbtn.on:hover{background-color:#f80}

.additemBtn { text-align:center; background:rgba(0,0,0,0.1); line-height:28px; padding:0 20px 0 15px; cursor:pointer; transition:transform 200ms; font-size:10px; font-weight:bold; border-radius:50px; display:inline-block;text-transform: uppercase; z-index:1}
	.additemBtn b, .additemBtn strong { margin-right:3px; vertical-align:middle; width:16px; height:16px; line-height:16px; background:var(--h2col); color:#FFF; border-radius:50px; display:inline-block; transition:background 300ms; }
	.additemBtn:hover{ color:var(--hcol); background:#EEE; transform:scale(1.05); }
	.additemBtn:hover b{ color:#FFF; background-color:var(--h2col); }
	.additemBtn:focus b{ background-color:var(--h3col); }

.helpbtn{ float:right; display:inline-block;  text-align:center; width:18px!important; height:18px; line-height:19px!important; font-size:11px; font-family:Roboto, Arial, Helvetica, sans-serif; font-weight:bold; z-index:auto; position:relative; border-radius:50px; transition:background 300ms, border-color 300ms; margin:0 0 0 5px; background:#AAA; color:#FFF!important; margin: -11px; text-transform: none; cursor:default}
	.helpbtn.simpleDot{ width: 8px!important; height: 8px; border: 0; border-radius: 50px!important; cursor:pointer}
	.helpbtn:hover:not(.foodReqIcon),.helpbtn.on{background:var(--h3col); color:#FFF; border-color:var(--h3col);}

	#profiles .helpbtn span{width: fit-content!important;}
	.helpbtn:before{content:'?'; display:block; text-align:center;}
	.helpbtn.simpleDot:before {display:none}
	.helpbtn.info:before{content:'i'; font-family:serif; font-size:12px;}
	.helpbtn.error:before, .helpbtn.warning,.helpbtn.warning:before{content:'!'; font-size: 12px;}
	.helpbtn.orangeback{border-color: var(--h3col);}
	.helpbtn.orangeback:hover{ background: #f80!important; border-color: #ffa53f;}
	.helpbtn.warning:hover,.helpbtn.warning.on{ background-color:var(--hcol) }
	span.helpbtn.on:after { content:''; border-style:solid; border-width:0 6px 8px 6px; border-color:transparent transparent var(--h3col) transparent; position:absolute; bottom:-10px; left: 50%; transform: translate(-50%,0);}
	tr.opt.o2 .td-food span.helpbtn span, tr.opt.o2 .td-recipe span.helpbtn span{position: fixed;  color: rgb(238, 238, 238);font-weight: 500;font-size: 11px;padding: 15px;text-transform: none;}
	.helpbtn span { position:absolute; z-index:2; background:#444; color:#FFF; padding:20px; width:270px; letter-spacing: normal; max-height:0; transition:max-height 300ms, opacity 300ms; pointer-events:none; opacity:0; margin:9px 0 0 -240px; text-transform:none; font-weight:normal; font-size:12px; line-height:140%; box-shadow:1px 1px 5px #0005; white-space:normal; border-radius:15px; }
		.helpbtn.up span, .helpbtn.above span{ margin: -26px 0 0 -240px; transform: translate(0,-100%); z-index:0; }
		.helpbtn.alignL span, .helpbtn.right span{ left: 220px; }
		span.helpbtn.above.on:after{bottom: 17px; transform: translate(-50%,0) rotate(180deg);}
		.batch-log-all .helpbtn span{position:fixed;}

		.helpbtn span:after { content: 'x';	position: absolute; right: 11px; top: 6px; font-weight: bold; color: #AAA; font-size: 12px; }
		.helpbtn span:hover:after{color:#FFF;}
		.helpbtn.on span{ max-height:245px; pointer-events:all; opacity:1}
	.helpbtn.on.onHover:before{ content: '';padding: 20px 30px; display:inline-block; position:absolute;left: -30px; top: 7px; }

	.helpbtn.input-right{margin:-26px 10px;}
	.helpbtn.inline{float:none; margin: 0 3px;}
	.helpbtn a:hover{color: #f80!important;}
	.helpbtn a {color:var(--h3col); border-bottom:1px dotted; cursor:pointer; font-weight: bold;}
	.helpbtn p{ margin-top: 7px;}

	.spacer .helpbtn { margin:-4px -4px 0 -20px; }
	.giftbtn{ float:right; display:inline-block;  width:16px!important; height:16px; text-align:center; line-height:15px; font-size:10px; font-family:Roboto, Arial, Helvetica, sans-serif; font-weight:bold; color:#777; z-index:auto; position:relative; border:solid 2px #e5e5e5; border-radius:10px; transition:background 300ms, border-color 300ms; line-height:16px!important; background:var(--h3col); color:#FFF; text-transform: none;}
		.giftbtn svg{width: 12px; margin: 1px auto;}
		.giftbtn:hover{border-color: var(--h3col);}


/* a.roundbtn, button.roundbtn{padding:12px; width:20px; height:20px; border-radius: 50%; background-position:center; background-repeat:no-repeat; display:inline-block; padding:0!important; line-height:20px; text-align: center;}
	a.roundbtn.largebtn, button.roundbtn.largebtn{width:60px; height:60px; line-height:60px; padding:0; font-size:9px;}
	a.roundbtn.mediumbtn, button.roundbtn.mediumbtn{width:40px; height:40px; line-height:40px; padding:0; font-size:9px;}
	a.roundbtn.mediumSbtn, button.roundbtn.mediumSbtn{width:30px; height:30px; line-height:30px; padding:0; font-size:9px;}
	a.roundbtn.smallbtn, button.roundbtn.smallbtn{width:25px; height:25px; line-height:25px; padding:0; font-size:9px;} */
a.roundbtn.download{ background-image:url(/media/icon-download2.png);}

.gooCornerL, .gooCornerR{ position:relative; z-index:1 }
	.gooCornerL:not(.bottomOnly){ border-top-left-radius: 25%; }
	.gooCornerR:not(.bottomOnly){ border-top-right-radius: 25%; }
	.gooCornerL:before, .gooCornerR:after{ content:''; height:101%; aspect-ratio : 1 / 1; background:inherit; clip-path:url(#tabCorners); position:absolute; top:0; left:0; z-index: -1; transform:translateX(-35%); }
	.gooCornerR:after{ transform: rotateY(180deg) translateX(-35%); right:0; left: auto; }
	.gooCornerL.bottomOnly:before { margin-left: 1%; }
	.gooCornerR.bottomOnly:after { margin-right: 1%; }

.counter.multi:before { content:'x'; font-size:8px; margin:-3px 2px 0px -3px; display:inline-block; vertical-align:middle; }
.popBatchSearch .counter{position: relative;}

.liveLight{position:absolute; top:19px; line-height:100%; border-radius:10px; background-color:var(--h3col); width:7px; height:7px; border:solid 2px #FFF; margin-left:-17px;}

.foodphoto, .recipephoto, .cardphoto, .packphoto{ display:inline-block; background:#EEE no-repeat center url(https://www.nutritics.com/media/back-item.png); min-width:80px; min-height:80px; background-size:cover; }
	.foodphoto { background-image:url(https://www.nutritics.com/media/back-apple.png);}
	.outletphoto { background-image:url(https://www.nutritics.com/media/back-shop.png);}
	#pane-logSearch.recipes .foodphoto, .recipephoto{ background-image:url(https://www.nutritics.com/media/back-chef.png);}
	.linkWithTick{padding: 2px 15px 2px 25px ;font-weight: bold;}
	.linkWithTick:hover{background:#fff;cursor:pointer}
	#templateContent div.linkWithTick.on,#templateContent div.linkWithTick.on:hover{background:transparent;color:#000;}
	#templateContent div.linkWithTick{font-weight:normal;}


/*//////////////////////////////////////// POPUPS & MESSAGES ////////////////////////////////////////*/
.darkcover{position:absolute; top:0; bottom:0; right:0; left:0; z-index:7; background:url(/media/back-black66.png); transition: opacity 200ms linear;  opacity:0; border-top: solid 1px #444; pointer-events: none;}
.darkcover.on{opacity: 1; pointer-events: all;}
.popwindow{ padding:0; display: flex;  flex-direction: column; }
.popwindow:not(.pill):not(.round){ text-align:left; }
	.spacer.popupTitle{ position:absolute; top:0; left:50%; transform:translate(-50%,-50%); margin:0; padding:5px 20px;}
	.popwindow>h5 { margin:20px 30px; }
	.popwindow>.delbtn{ right: 0px; top:-5px; }
	.popwindow.hideCloseBtn .delbtn{display: none;}
	.popwindow .body { padding: 40px 10px 0; line-height:140%; overflow-y: auto;}
	.popwindow.nooverflow-y .body { overflow-y: initial; }
	.popwindow .pillform { margin: 15px 0 0; }
	.popwindow.pill{ border-radius: 110px!important; padding:10px 70px; }
		.popwindow.pill>.delbtn{ left: 80%; top: -20px; }
		.popwindow.pill .body { padding-top:30px;}
		.popwindow.pill .footer { margin:10px -3px; }
	.popwindow:not(.pill) .footer { position:sticky; padding:20px 20px; border-radius:25px; /* margin:15px -15px 0px; */ }
		.popwindow:not(.pill) .footer:after { content: ''; display: block; clear: both; }
		.popwindow:not(.pill) .footer.small{height:50px; padding: 5px 30px;}
		.popwindow:not(.pill) .footer.sticky{ margin:20px -30px -20px; bottom:-20px; }
	.popwindow.confirmBox{min-height:150px;}
	.popwindow.confirmBox .counter.small{position: relative;line-height:16px ;}
	.fullwidthPopNest{ margin: -20px -50px -35px;}
		.fullwidthPopNest .footer{ margin:0!important }

	/* .darkcover:not(.on) .popup{transition: transform 250ms; transform:scale(0.9);} */
	.popup .restoreBtn{ background-color:#ddd; border-radius:50%; width:25px; height:26px; right:36px; top:13px;}
	.popup .restoreBtn{ display: none;}
	.popup .restoreBtn.on{display: block;}
	#staySmall {position:absolute; bottom:0; right:0; width:200px; height:125px; margin-right:15px; margin-bottom:15px;z-index:7;display:none;}
		#staySmall.on{display:block}
		#staySmall .restoreBtn{right:12px; border-radius:50%; width:25px; height:25px; top:5px;background-size: 12px; }
		#staySmall .restoreBtn:hover{ background-color: var(--h3col); background-size: auto;}
		#staySmall .delbtn{color:#FFF;}
		#staySmall.on .restoreBtn{background-image: url(/media/icon-maximise.png);background-repeat: no-repeat;background-position:center;}

		.popup.small{width:200px!important; height:125px; overflow:hidden; margin-left:-215px!important; margin-top:-140px!important; left:100%; top:100%;}
		.popup.small .delbtn{margin: 7px 7px -50px 0px!important;}
		.popup.small h1,.popup.small h2,.popup.small p,.popup.small img{display:none;}
		.popup.small iframe,#staySmall iframe{ position:absolute; width:200px; height:125px; top:0; left:0px; border:none!important; }

	#popbox.hideCloseBtn .delbtn {display: none;}
	/*JUL22 8041 setted popup minimum height to prevent shrinking after adding something*/
	#popnest{ width:100%; max-height:calc(var(--scaled-height, 100vh) - 40px); overflow-y:auto; padding: 35px 50px; box-sizing: border-box;}
	#popnest #attachPreview .itemSummary .monitors{top: 60px;}
	#popnest #attachPreview .itemSummary~.footer{width: 100%;}
	#popnest #attachPreview .itemSummary~.footer .btn.fr{ top: -15px; right: -15px; }
	#popnest #popupcontent #attachPreview .itemSummary .resultDetail .monVals.monitors {margin : 0 }
	#popnest #popupcontent #attachPreview .itemSummary .resultDetail .monitors>span {height: 15px;}
	#popnest #popupcontent #editProgItemForm #progItemPreview #attached .itemSummary .resultDetail .monitors>span{ position :relative ; top :35px}
	#popnest #popupcontent #editProgItemForm #progItemPreview #attached .itemSummary .resultDetail .monVals.monitors {margin-left: 95px;}
	#popnest #popupcontent #editProgItemForm #progItemPreview #attached .itemSummary a.fr.editBTN{top: -25px}
	.portionsPanelContainer.on #popnest{padding-bottom: 0;}
	#popupcontent #attachPreview.multi{min-height: 300px;}/*SEP22 42009 moved min-height from popnest to attachPreview only if multi is enabled*/
		.widescreen.autoscale #popnest{max-height:calc(var(--scaled-height, 100vh) - 80px);overflow:auto} /*widescreens dont have enough height for this */
	.popup .firstHead{margin:-35px -50px 0px; padding:40px 50px 10px; border-radius:5px 5px 0 0; font-weight:bold;}
	#popupcontent h5:first-child, #popupcontent .popupbar+h5{ margin:-25px auto 20px; line-height:24px!important; width:100%; }
		#popupcontent .popupbar+h5 { margin-top:-5px; }
	#popupcontent h6:first-child,#popupcontent .popupbar {  box-sizing:border-box; z-index: 1; }
	#popupcontent svg:not([viewBox]) {display: none;}
	.popupfooter { background:#333; color:#FFF; margin:30px -50px -50px; min-height:60px; line-height:20px; padding:20px 10px 20px 20px; font-size:16px; box-sizing:border-box; }
		.popupfooter .fr{ margin-top:-8px;}
	#popupcontent .formfooter{ margin:0 -50px -65px; overflow:hidden; padding:25px 50px; }
		#popupcontent .formfooter.small{ padding:10px 50px; }
		#popupcontent .formfooter.sticky{  position:sticky; bottom:-35px; box-shadow:0 -1px 8px rgba(0,0,0,0.3); }
		#popbox.passworPolicy .poppane{	min-height:unset;	border-radius:80px; }
		.passworPolicy .delbtn{	margin:12px; }

	#poppane.small { width: 460px !important;}
		#poppane.small #popnest { min-height: unset; }

	.supplierPopup #popnest {padding:35px 30px;max-height:670px;}
	.supplierPopup .navbar a:not(:last-child)::after{content:'';display:inline-block;width:8px;height:2em;background:linear-gradient(to bottom right,transparent calc(50% - 2px),#EEE,transparent calc(50% + 2px));margin:0 -20px 0 13px;vertical-align:middle}
	.supplierPopup .navbarMore {margin-top:5px;}
	.supplierPopup .navbarMore a{float:left;margin:5px 15px;}
	.supplierPopup .navbarMore a:last-child{margin-top:10px;}
		.suppPopup .cardHeader {position:relative;}
		.suppPopup .cardHeader img { max-width:180px; max-height:100px; margin-top:-5px; }
		.suppPopup .cardBody {margin-top:10px;}
		.suppPopup .suppShield {position:absolute;top:-3px;left:0;}
		.suppPopup .suppShield .rule-shield, .suppPopup .suppDocs .rule-shield, .options .suppShield .rule-shield{width:30px;}
			.options .suppShield .rule-shield{ margin-left:-4px; }
		.suppPopup .suppShield .rule-letter, .suppPopup .suppDocs .rule-letter, .options .suppShield .rule-letter{font-size:16px; top:48%;}
			.options .suppShield .rule-letter{ top:57%; }
		.suppPopup .suppTitle {margin-left:25px;}
		.suppPopup .suppTitle div:first-child {min-height:44px;}
		.suppPopup .suppTitle div {margin-left:10px;}
		.suppPopup .suppTitle .em {font-size:24px;}
		.suppPopup .tablinks {width:295px;margin-left:30px;padding:9px;border-radius:50px;box-shadow: 0 0 20px rgba(0, 0, 0, 0.15);background-color:#FFF;border-color:transparent;}
		.suppPopup .tablinks span {margin:0 5px;}
		.suppPopup .tablinks span.on {color: #FFF;background: var(--hcol);padding: 3px 12px;border-radius: 50px;}
		.suppPopup .suppCard .blocklinks {width:260px;margin-top:15px !important;}
		.suppPopup .suppCard .tabProduct {position: relative;}
			.tabProduct .browseProducts {padding: 3px 15px !important;position: absolute;top:0;right:0;}
			.tabProduct .browseProducts:hover{color:#FFF !important;}
			.tabProduct .blockBtn {margin-bottom:25px;}
			.tabProduct .topCat {width:135px;margin:0 auto;display:block;}
			.tabProduct .btnCoo {padding: 0 25px;}
			.tabProduct #cooWrapper {margin-top:-35px;}
			.tabProduct #cooWrapper canvas {margin:0 auto;}
			.tabProduct #cooWrapper p.em {margin-top:-105px;}
			.tabProduct #cooWrapper .raised {float:left;}
			.tabProduct #cooWrapper #coo-legend-container {margin:-65px 35px 40px}
			.tabCompany .suppInfo {width:40%;min-height:50px;line-height:20px;}
			.tabCompany .suppContacts {width:27%;margin-left:4%;}
			.tabCompany .suppDocs {width:27%;margin-left:2%;}
			.tabCompany ul.suppList {height:400px;overflow-y:auto;}
			.tabCompany .suppContacts li {list-style:none;padding:10px;}
			.tabCompany .suppContacts li:first-child {border-top:3px solid #EEE;}
			.tabCompany .suppContacts li:not(:last-child) {border-bottom:3px solid #EEE;}
			.tabCompany .suppContacts li svg {margin:-5px 0 0 10px;}
			.tabCompany .suppContacts .btn {margin:0 auto; width:90px;}
			.tabCompany .suppDocs .btn {margin:0 auto; width:83%;}
			.tabCompany .suppDocs img, .tabCompany .suppDocs .rule-shield{width:30px;height:auto;margin-left:5px;}
			.tabCompany .suppDocs .vertical, .tabCompany .suppDocs .rule-shield{position:absolute;top:50%;transform:translateY(-50%);}
			.tabCompany .suppDocs p {margin-left:45px;}
			.tabCompany .suppDocs li {width:95%;align-items: center;display: flex;min-height: 45px;position:relative;list-style:none;background-color:#FFF;padding: 8px 10px;border: 3px solid #EEE;box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);border-radius: 10px;margin:0 0 10px 10px;}
			.tabCompany .suppDocs li.blank a {pointer-events: none;color:#AAA}
			.tabCompany .suppDocs li.disabled:before {content:"X";font-size: 16px;position:absolute;top:50%;transform:translateY(-50%);left: 20px;}
			.tabCompany .suppDocs li.disabled img {opacity:0;}
			.tabCompany .suppDocs li.expired img, .tabCompany .suppDocs li.blank img {opacity:0.3;}
			.tabCompany .suppDocs li.expired:before{position:absolute;top:50%;transform:translateY(-50%);left:-9px;content:"!";background-color:var(--h3col)!important;text-align:center;width:18px!important;height:18px;border-radius:50px;color:#FFF!important;font-size:12px;}
		.disabled #poppane.popup .delbtn.fr{ display: inline-block!important; }
	#feedback .popup{width:450px; height:510px; margin-top:-255px; margin-left:-225px; padding:0;}
	#feedback .popup iframe{width:100%; height:100%;}
	#feedback .bluebtn{position:absolute; z-index:11; left: 50%; top: 50%; margin-left: 177px; margin-top: -210px; border-right: 0; padding-left:10px; padding-right:10px;}
	#alertbox { z-index:9}
	/*JUL22 39539 center text in alerts and confirms*/
	#alertmsg, #confirmmsg{text-align:center;font-size: 23px; color:#999; font-style: italic; display:block; vertical-align:middle; line-height: 120%; margin-bottom:10px; -webkit-user-select: text; }
		#alertmsg{ max-height:50vh; overflow-y:auto; overflow-x:hidden; word-break:break-word;}
		#alertmsg *{-webkit-user-select: text; cursor:text;}
		#alertmsg .small, #confirmmsg .small{font-size:12px; color:#666; line-height:140%}
		#alertmsg a, #confirmbox a, #alertbox a{color:var(--hcol); cursor:pointer; font-weight:bold; }
		#alertmsg p{margin-bottom:10px; }
		#alertmsg pre { font-size:11px; font-weight:bold; font-style:normal; line-height:16px; white-space:pre-wrap; }
		#alertmsg h3 { margin:10px 0 0px; background:var(--h3col); color:#FFF; padding:0 6px; display:inline-block; line-height:16px; font-style:normal; }


	#confirmbox .popup, #alertbox .popup, #requestbox .popup{ border-bottom:solid 50px #DDD; padding-bottom:20px; clip-path: polygon(110% 0, 100% 110%, 4% 100%, 0 78%, -20px -45px); -webkit-clip-path:polygon(110% 0, 100% 110%, 4% 100%, 0 78%, -20px -45px);width: 452px;}
		#confirmbox a:not(.delbtn):not(.inline):not(.blueline), #alertbox a:not(.blueline), #requestbox a:not(.delbtn):not(.card):not(.blueline):not(.pillbtn){margin-bottom:-64px; padding:0 17px; line-height:47px;height:47px; margin-right:-14px;}
		input#userInput{width:80%;}
		/*dropdown popup styling*/
	.darkcover.on.drop{ background:none; }
	.on.drop #poppane.popup{ border-top:solid 5px #1e77bb; }
		.on.drop #poppane.popup::after { content:""; position:absolute; border-style:solid; display:block; width:0; top:-12px; bottom:auto; left:20px; border-width:0 6px 8px 6px; border-color:transparent transparent var(--h2col) transparent; }

	/* WHEN DELETING A FOOD OR RECIPE, CHECK USAGE */
	.confirmBox .checkFoodDelete{ max-height:300px; overflow-y:auto; margin-right:-50px; max-width: 80%; margin: auto;}
	.confirmBox .checkFoodDelete .spacer{ padding:0; line-height:19px; font-style: normal; text-align: left; margin-bottom: 10px;  margin-right:20px;}
	.confirmBox .checkFoodDelete .spacer span:not(span.counter){float:right; margin: 1px 45px 0 0;}
	.confirmBox .checkFoodDelete .spacer:before,.confirmBox .checkFoodDelete .spacer:after{display: none;}
			#confirmDetail { font-size:12px; font-style:normal; color:#444; font-weight:bold; margin-top:20px; border-top:solid 2px #EEE; padding-top:10px; }
			#confirmDetail input { font-weight:bold; color:var(--hcol); text-align: center;}
		.confirmBox .pdCostShipping input::placeholder {color:#aaa !important;opacity: 1 !important; text-transform: none;}
		.confirmBox .pdCostShipping .popup {z-index:3;}
		.confirmBox .pdCostShipping .popTitle {color: #999;font-size:22px;}
		.confirmBox .pdCostShipping .delbtn {right: -41px; top: -27px;}
		.confirmBox .pdCostShipping .pdCostBody {margin:25px 0 10px 0;}
		.confirmBox .pdCostShipping .pdCostBody label {display: inline-block;width: 40px;padding-top: 8px;font-style: normal;}
		.confirmBox .pdCostShipping .pdCostBody input {padding:10px 10px 10px 35px; margin-bottom:20px; width:90%;}
		.confirmBox .pdCostShipping .pdCostBody select {margin-top:5px;padding: 7px 15px;border-radius: 50px;background-color: #FFF!important;font-weight: bold;border: solid 2px #EEE;color: var(--hcol);width: 270px;font-size:12px;}
		.confirmBox .pdCostPacking .pdCostBody label {width: 110px;color:#555;}
		.confirmBox .pdCostPacking .pdCostBody input {width:80px; height:30px;margin-bottom:15px;padding:7px 0;margin-top:5px;}
		.confirmBox .pdCostPacking .pdCostBody div {width: 100%; display:block;margin-left: 20px;}
		.confirmBox .pdCostPacking .pdCostBody .eof {position:relative;height: 70px; font-style: normal;}
		.confirmBox .pdCostPacking .eof span.grey {display:block;padding-top:5px;}
		.confirmBox .pdCostPacking .pdCostBody .helpbtn {position: absolute;top: 200px;right: 100px;}
		.confirmBox .pdCostPacking .pdCostBody select:hover, .confirmBox .pdCostPacking .pdCostBody .helpbtn span:hover{cursor: default;}
		.confirmBox .pdCostShipping .pdCostBody .pdCostAddress {background: url(/media/icon-search.png) transparent no-repeat 10px;}
		.confirmBox .pdCostShipping .pdCostFooter span {margin:9px 0 0 15px;color:#555;}
		.confirmBox .pdCostShipping .pdCostFooter input {width:100px;background-color:#fff;height:30px;margin:6px 0 0 55px;line-height: 33px;}
		.confirmBox .pdCostShipping #confirmbtn1{right: 130px; min-width: 50px;}
		#pCostPanel #additionalCost .td-small input{padding: 0px 5px;}
		#pCostPanel #additionalCost td input::placeholder{font-size: 10px; text-transform: none; font-style: italic;}
		.pdCostBody>.helpbtn{margin:-27px}

	#activationBanner, .activationBanner{ position:fixed; z-index:5; background:var(--h3col); color:#FFF; bottom:0; left:50%; padding:0 50px; line-height:30px; transform:translateX(-50%); font-weight:bold; border-radius:50px 50px 0 0; white-space:nowrap; text-align: center;}
	#activationBanner a:hover{ color: var(--hcol); }
		#ajerror{font-size: 12px; line-height: 100%; display: block; margin-top: 10px; }
		.alertlist{ line-height:14px; margin-top:5px; max-height: 250px; overflow-y: auto;}
			.alertlist a { display:inline-block; font-size:14px; font-weight:normal!important; padding:3px 10px; margin-right:5px; text-overflow:ellipsis; width:120px; overflow-x:hidden; white-space:nowrap; }
			.alertlist a:hover{background:var(--bgcol3);}
		.popup a.savebtn{ color:#FFF!important; min-width:80px; padding:4px 14px; text-align:center; font-style:italic; line-height:22px; height:22px; position:absolute; bottom:14px; right:14px; font-size:10px}
		.popup a.savebtn:hover{color:var(--bgcol3);}
		#requestbox a.lgreybtn,
			#confirmbox a.lgreybtn,
			#emailbox a.lgreybtn{right:130px; min-width:50px; }
		#alertmsg b, #confirmmsg b{color:#444;}
		#confirmmsg .allergenicon {margin-top: 5px; width: 50px;}
			#confirmmsg .allergenicon span{ margin-bottom: -2px;}
		#confirmmsg .allergenFriendlyName {line-height: 9px; margin-top: 5px;}
		.confirmBox .checkFoodDelete .row{ color:#444; margin-right:20px; border-bottom:solid 1px transparent; line-height:35px; font-size:13px; font-weight:bold; font-style:normal; text-align:left; clear:both; transition:border-color 250ms;}
			.confirmBox .checkFoodDelete .row:hover{ border-color:#EEE;}
		.confirmBox .checkFoodDelete .ficon{ position:relative; top:-2px; line-height:16px; border-radius:50%; width:16px; height:16px; margin:0 8px -2px 4px ; font-size:10px; font-weight:900}
			.confirmBox .checkFoodDelete .log .ficon, .confirmBox .checkFoodDelete .menu .ficon, .confirmBox .checkFoodDelete .compare .ficon{ visibility:hidden }
			.confirmBox .checkFoodDelete .user:not(.card){margin-right:55px;float: right;}
			.confirmBox .checkFoodDelete .card{float: right; margin: -5px 0 11px;}
			.confirmBox .checkFoodDelete #text{margin-right: 20px;}
		#emailbox input{width:430px!important;}
		.popupbar { background:#333; color:#FFF; text-align: center; position:absolute; line-height:26px; font-weight:900; padding:0 30px; border-radius:50px; top:-14px; left:50%; transform:translateX(-50%); text-transform: uppercase; white-space:nowrap; font-size: 11px; }
		#requestbox a.delbtn, #confirmbox a.delbtn{ padding:0; line-height:24px; height:24px; width:24px; border-radius:50%; margin:-25px -40px; }
		.inlineResult{margin-top:8px; font-style:italic; font-size:11px; float:right; color:var(--hcol)}
		#requestval { font-size:16px; color:var(--hcol); line-height:40px; height:42px; width:420px; margin:10px auto; border:solid 2px #CCC; padding:0 10px; text-align:center; }
		#requestbox.darkcover{z-index:8;}
		#requestbox #cancelbtn,#confirmbox #confirmbtn1{background:#999;}
		#requestbox #cancelbtn:hover,#confirmbox #confirmbtn1:hover{background:#888;}

		#notify {position:fixed;top:0;transform: translateX(360px);bottom:0;width:345px;background:#454545;z-index:7;transition: transform 300ms;color: #FFF;padding: 0;box-sizing: border-box;display: flex;flex-direction: column;right: 0;}
			#notify .delbtn { position:absolute; right:6px; background:#005a7b; top:10px; text-align:center; z-index:11; border:0; width:22px; height:22px; line-height:22px; color:#FFF; }
			#notify.on{transform: translate(0);box-shadow: -2px 0 10px rgba(0,0,0,0.5);}
			#notify .tabmenu { min-height:fit-content; padding:5px 15px 5px 5px; }
			#notify .tabmenu #notifications-wrapper { display: flex; flex-wrap: wrap; }
			#notify .tabmenu #notifications-wrapper #showAllBtn {order: 1;}
			#notify .tab-content{display:flex; flex-direction:column}
			#notify .tab-content .top{order: -1}
				#notify .tabmenu a {padding: 7px 20px;border-radius: 50px;margin: 2px 1px; background: rgba(0 0 0 / 15%); flex-grow: 0; flex-shrink: 0;}
				#notify .tabmenu a.on { background: #FFF; color:var(--hcol)}
				#notify .tabmenu a:not(.on):hover { background: rgba(0 0 0 / 30%);}
				[id^=tab-notifications] .tab-content:empty:before{ content:"No Notifications"; padding:50px; display:block; text-align:center;font-size:20px; color:#999 }
				#notify .tabmenu a#tabbtn-notifications { padding:14px; border-radius:50px; margin:1px 3px 0 6px; background:rgb(255 255 255 / 15%); }
					#notify .tabmenu a#tabbtn-notifications.on { background:#FFF; }
					#notify .tabmenu a#tabbtn-notifications:not(.on):hover{background:rgb(255 255 255 / 30%);}
/* 			#notify h2{margin: 0px 0 -63px;position:relative;z-index:1;padding:20px 0;background: linear-gradient(0deg, rgba(69,69,69,0) 0%, rgba(69,69,69,1) 100%);text-shadow: 0 1px 7px rgba(0 0 0 / 30%); pointer-events: none;} */
			#notify .tab { background:none; flex-direction:column; flex-grow:1; overflow-y:auto; padding:0px 10px 20px; }
				#notify .tab.on {display: flex;}
				#notify .msg{box-sizing: border-box;margin-top: 10px;width: 100%;padding:10px 10px 10px 20px;border-radius: 3px;transition:background 350ms 250ms,  margin-left 400ms, opacity 300ms 150ms, filter 300ms;font-size: 14px;}
					#notify .msg:not(.read) { }
					#notify .msg.prefade{margin-left:-380px;}
					#notify .msg.read:not(:hover){ opacity:0.4; filter: grayscale(1)}
					#notify .msg.notification {border-radius:35px;padding:10px 30px;background: #666;font-size: 12px;display: flex;flex-direction: row-reverse; align-items: center;}
					#notify .msg.notification  .action-buttons-container{display: flex;flex-direction: column;justify-content: center;align-items: center;}
					#notify .msg.notification progress{width: 100%; accent-color: var(--h3col);}
					#notify .msg.notification progress + .progress-label{font-weight: bold; text-shadow: 0 1px 4px #0007; color: white; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 12px;}
					#notify .bluebtn.fr{margin: 5px -25px 0 10px;border-radius: 50px;}
					#notify .bluebtn.alignB{ margin-top:20px;}

				#notify .spacer { background:#555; margin:30px auto -2px!important; }
				#notify .tab-content {padding-bottom: 40px;}
				#notify .footer{ display: none;}

		#popupcontent :not(.itemSummary)>h1:not(.nicEdit-main h1):not(.nicEdit-options h1):not(.uploadBubble):not(.textblock h1) {  position:absolute; top:-20px; color:var(--bgcol3); background:#20699D; padding:10px 90px 10px 59px; font-size:18px; left:0; font-weight:bold; border-radius:50px; text-shadow:2px 0px 4px rgba(0,0,0,0.2); box-shadow:1px -1px 6px rgba(0,0,0,0.2); }
		#popupcontent p{ line-height: 150%; }
		#popupcontent .nicEdit-options{top:53px;}
		#popupcontent .nicEdit-panelContain{width: calc(100% + 30px)!important;}
		#popupcontent .nicEdit-head,
			#popupcontent .nicEdit-body,
			#popupcontent .nicEdit-main {width:100%!important}

	.phone #poppane{ width: 350px; border: solid #CCC; border-width: 40px 10px 60px; border-radius: 20px!important; box-sizing: content-box; }
	.phone .delbtn{ margin: -30px 0px -50px 0px!important; }

.contextMenu{position:absolute; z-index:7; background:#444; font-size: 11px; font-weight: 900; padding:0; box-shadow: 1px 2px 15px 0px #777777; min-width:100px; margin-top:3px; color: #FFF;  }
	.contextMenu.on{opacity: 1!important; pointer-events: all!important}
	.contextMenu>a:not(.delbtn), .contextMenu>b{display:block; padding: 10px 20px; color:#EEE; white-space:nowrap; transition:background 300ms; }
	#contextMenu a:hover, #contextMenu a.on, .contextMenu>b:hover, .contextMenu>b.on{ background-color:var(--h2col); color:#FFF; }
	#contextMenu a.active{ font-weight:bold; }
	.contextMenu a.bluebtn{color:#FFF; padding: 5px 20px;}
	.contextMenu span:not(.spinner){margin-top:0; left:20px; z-index: 3}
	.contextMenu.on.c-sortlog{ max-height: 557px!important;}

#contextMenu.wideIngCosts {max-width:320px !important;}
#contextMenu.contextMenu{  max-width: 0px; float: left; max-height: 0px; overflow:hidden; min-width:0px; pointer-events:none; border-radius: 15px;}
	#contextMenu.contextMenu.on { max-width: 200px; max-height:340px/* Matches 10 elements 46211*/; white-space:nowrap; transition: max-height 0.2s,max-width 0.2s;pointer-events:visible; z-index:10}
	#contextMenu.contextMenu a{ overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
	#contextMenu.contextMenu svg {padding-right: 5px;}

.contextMenu.whiteback{background:#FFF; box-shadow:0px 1px 10px #0007; border-top:solid 3px var(--hcol); opacity:0; pointer-events:none; margin-top:20px; transition:margin 300ms, opacity 300ms; color:#666}
	.contextMenu.whiteback.on{margin-top: 3px}
	.contextMenu.whiteback:before {position:absolute;content:"";margin:-11px 10px 0;border-style:solid;display:block;border-width:0 6px 8px 6px;border-color:transparent transparent var(--hcol) transparent;width:0; }

.contextMenu span.pdCosts { padding-left:10px; }

#msgpop { position:fixed; right:-505px; bottom:30px; transition:right 400ms; background-color:var(--h3col); color:white; border-radius:35px 0 0 35px; z-index:8; padding:10px 40px 10px 40px; font-size:13px; font-weight:bold; line-height:15px; max-width:360px; border:solid 3px #FFF; box-shadow:1px 1px 7px rgba(0,0,0,0.2); }
	#msgpop.in:before { content:'i'; position:absolute; width:46px; height:46px; line-height:46px; background:color-mix(in srgb, var(--h3col), #FFF 20%); border-radius:50%; border:solid 2px #FFF; text-align:center; font-size:30px; box-shadow:1px 1px 7px rgba(0,0,0,0.7); right:-25px; animation:swell 5s infinite; -moz-animation:swell 5s infinite; -webkit-animation:swell 1s infinite; -o-animation:swell 5s infinite; top:50%; margin-top:-25px; }
	#msgpop.in{right:30px;}
	#msgpop .link{ display:inline-block; cursor:pointer; color:whitesmoke; text-decoration:underline; text-transform:uppercase; margin-left:20px; }

/* TRIALER TIME LEFT */
#trialersLeftTime{ display:inline-block; float:right; text-transform:lowercase; margin-right:1px; }

/* Trial help - popup hints */
#msgflag { position:fixed; padding:0 35px; z-index:11; box-shadow:1px 1px 10px rgba(0,0,0,0.5); font-size:13px; color:#FFF; font-weight:bold; white-space:nowrap; opacity:0; transform:scale(0.8); transition:all 300ms; pointer-events:none; line-height:34px; border-radius:50px; }
#msgflag.on { opacity:1; background:var(--h3col); transform:scale(1); transition:scale 300ms,opacity 300ms, padding 500ms, opacity 300ms, margin 700ms; margin:25px 0px 25px 30px; pointer-events:all; }
	#msgflag>span { position:absolute; border-style:solid; border-width:0 18px 32px 0; border-color:transparent var(--h3col) transparent transparent; left:-16px; margin-top:-8px; }
	#msgflag:before { content:""; display:block; position:absolute; width:6px; height:6px; border-radius:50%; left:-28px; top:-30px; border:solid 2px #FFF; animation:bigswell 5s infinite; -moz-animation:bigswell 5s infinite; -webkit-animation:bigswell 1s infinite; background:color-mix(in srgb, var(--h3col), #FFF 15%); z-index:1; pointer-events:none; }
	div#msgflag:after { content:''; display:block; border:solid 1px var(--h3col); position:absolute; transform:rotate(62deg); width:57px; top:-3px; left:-41px; pointer-events:none; z-index:-1; border-radius:50px; }
	#msgflag:empty{opacity:0; transform:scale(0.8); margin-top:-10px; padding-left:0; padding-right:0; transition:all 300ms}
	#msgflag .delbtn { pointer-events:all; margin:7px -30px; background:#FFF!important; border:0; color:var(--h3col)!important}
	#msgflag p{margin: 0;}
		#msgflag.flip p{transform:rotateY(-180deg); display:inline-block;}
		#msgflag p a { color:var(--bgcol3);border-bottom:dotted 1px var(--bgcol3);padding:2px 5px;font-size:9px;text-transform:uppercase;vertical-align:middle;cursor: pointer;}
		#msgflag p a:hover{color:#FFF;border-bottom-color:#FFF;}
		#msgflag b{color:#FFC}

#helpInfo { position: fixed; left: 30px; bottom:12px; transition: left 400ms; background-color: var(--h2col); color: white; border-radius: 0px 35px 35px 0; z-index: 1; padding: 0px 60px 0px 40px; font-size: 13px; font-weight: bold; height: 35px; line-height: 35px; }
#helpInfo:empty{ left: -100px; }
#helpInfo:before {  content: '?'; position: absolute;   margin: -8px -60px; width: 45px; height: 45px; line-height: 45px; background: var(--hcol); border-radius: 50%; border: solid 2px #FFF; text-align: center; font-size: 30px; box-shadow: 1px 1px 7px rgba(0,0,0,0.7);}
.videosHead{ margin:0px 0 10px; font-weight:normal; letter-spacing:-1px; text-align:center; }
#helpInfo .yellow{border-bottom:dotted 1px var(--bgcol3); cursor:pointer;}
#helpInfo .delbtn{ right: -45px;  top: -26px; color: #FFF;}

#onboarding>div{position: fixed; width: 100%; top:calc(50% - 250px); font-size:15px; text-align: center;}
	#onboarding>div>.delbtn { width:30px; position:absolute; left:50%; margin:-13px 493px; height:30px; line-height:30px; background:#CCC; box-shadow:2px 1px 10px rgba(0,0,0,0.5); font-size:12px; }
	.obPanel { position:relative; display:inline-block; left:auto; margin:0 10px; width:330px; min-height:330px; border-radius:4px; vertical-align:top; border-bottom:solid 6px #CCC; background:#FFF top center no-repeat; padding:230px 50px 50px 50px; box-sizing:border-box; transition: all 300ms; }
	.obPanel.prefade{transform:scale(0.8); margin-top:30px}
	.obPanel:hover{border-bottom-color:var(--h3col);}
		.obPanel:nth-of-type(2) { margin-top:-25px; border-top:solid 6px var(--h2col); background-position:top; padding-bottom:110px; }
		.obPanel:nth-of-type(2) img{ position:absolute; top:143px; left:133px;}
		.obPanel h2{margin-bottom: 20px;font-weight: normal;}
		.obPanel p{margin:10px 0; color: #555}
#hubspot-messages-iframe-container{margin: 30px 0px;}
	.autoscale #hubspot-messages-iframe-container{margin: 40px -5px;}

/* SETTINGS POPUP:*/
#settingsbox>div { width:600px; position:fixed; top:10px; left:-600px; bottom:10px; box-shadow:0px 0 20px rgba(0,0,0,0.6); transition:left 400ms; border-radius:5px 40px 40px 5px; overflow:hidden;}
#settingsbox.on>div {left:0px;}
	#settingsbox>div>.delbtn { position: absolute; top: 20px; right: 30px;}
#settingsbox iframe { width:100%; height:100%;}
body#ifr-settings { padding:55px 30px 70px 150px; background:#FFF; overflow-y:auto; box-sizing:border-box; border:0;margin:0; height:calc(100% - 80px); }
#settingsmenu { background:#F9F9F9; position:fixed; top:0px; left:0; width:115px; height:100%; box-shadow:0 -5px 15px #EEE inset; }
	#settingsmenu a { position: relative }
		#settingsmenu a.on{ color:var(--hcol); border-radius: 0 15px 15px 0; margin-left: -10px; }
		#settingsmenu a span {  position:absolute; top:50%; transform:translateY(-50%); left:0; right:0; }
		#settingsmenu a.on span:after { content:""; position:absolute; right:-14px; top:50%; margin-top:-7px; border:solid 7px transparent; border-left-color:var(--h2col); }

#aboutmsg{display:block;  font-size:10px; color:#666; text-align: center; width: 400px; margin:10px 0 -10px}

.popup h2{ margin:0px 0 10px; }
	.popup h2 a:not(.hcol){color:#AAA; transition:color 200ms}
	.popup h2 a:hover{color:#444;}
	.popup h2 a:first-child{ margin-right:20px; }

	.settings_page{display:none; padding-bottom: 100px;}
	.settings_page.on{display:block;}
	.settings_page .additemBtn{ margin-top: 5px;}
	.settings_page h2{margin:0px 0px 20px 0px; }
	.settings_page label, .settings_page .label { box-sizing:border-box; padding:5px 0; /* padding:5px 15px; border-radius:50px; line-height: 140%; */ }
	.settings_page label:hover, .settings_page .label:hover{background:var(--bgcol3);}
	.settings_page #masterSettingsForm #label-shareFoodprint {padding: 15px 8px 1px 0px;}
	.settings_page #costOfGoodsOptions{display: grid; grid-template-columns: 1fr 1fr 1fr;}
		.settings_page .suppMiniForm .tableGroup {position:relative;}
		.settings_page .suppMiniForm .tableGroup:first-of-type {margin-top: 10px;}
		.settings_page .suppMiniForm .tableGroup .delbtn { position:absolute; right:5px; top:0px; opacity:0;}
		.settings_page .suppMiniForm .tableGroup:hover .delbtn {opacity:1;}
		.settings_page .suppMiniForm input[type="file"]:after {line-height:32px;}
		.settings_page .suppMiniForm .download {margin:0 auto;width:65px;}
		.settings_page .suppMiniForm .attachPanelForm {margin-bottom:20px;}
			.suppMiniForm .attachPanelForm .delbtn {position:absolute;right:5px;top:6px;}
				.suppMiniForm .attachPanelForm .sFileContainer {cursor: pointer;display:block;height:100px;margin-top: 30px;}
				.suppMiniForm .attachPanelForm .second {justify-content: center;}
				.suppMiniForm .pillform .droparrow:after {top:11.7px;}
				.suppMiniForm .attachPanelForm .sFileLabel {margin: 12px 0 5px 0}
				.suppMiniForm .attachPanelForm input {text-align:left;min-width:194px;}
				.suppMiniForm .attachPanelForm button.pillbtn {margin-top: 15px;}
				.suppMiniForm .attachPanelForm select {height:34px !important;line-height: 22px !important;}
		.settings_page .suppPreview {margin-top:5px;}
		.settings_page label.half{width:50%; vertical-align:top;}
		.settings_page.form input { padding:0 15px; color:var(--hcol); line-height:34px; }
		.settings_page.form .inlineInput{ margin:1px -2px; }
		.settings_page.form label .inlineInput{  margin:-11px 3px; }
		.settings_page input.large{font-size:14pt;}
		.settings_page.form input, .settings_page.form select, .settings_page.form textarea{ /* border-color:#CCC; width:100%; font-weight: bold; */ }
		.settings_page.form input:hover, .settings_page.form select:hover, .settings_page.form textarea:hover{border-color:#999;}
		.settings_page.form select { padding:0 15px; height:38px; line-height:34px; max-height:none; white-space:inherit; }
		.settings_page.form #companytype { white-space:nowrap; }
		.settings_page input.fr, .settings_page input.fl, .settings_page select.fr, .settings_page select.fl{margin-top:-10px;}
		.settings_page.form label input{padding-right: 22px;}
		.settings_page .lines label p{ display: inline-block; vertical-align: top;}
		.settings_page .lines label:has(.helpbtn) p{ max-width: calc(100% - 48px); }
	#settings_profile.settings_page.form.disabled label #forename ,#settings_profile.settings_page.form.disabled label #surname,#settings_profile.settings_page.form.disabled label #email {background: none;color: #0089bf !important; pointer-events: all; cursor: text;}
	#settings_profile .nicEdit-panelContain {padding:0 5px;}
	#settings_profile .nickEdit-desc {position: relative;}
	#settings_prefs.disabled, #settings_account.disabled {filter:none;opacity: 1;}
	#settings_prefs.disabled label:not(.aliasFor), #settings_account.disabled :not(.aliasFor):not(.aliasFor *):not(.version_info > span) {filter: grayscale(1);opacity: 0.6;}
	#settings_prefs .aliasFor, #settings_account .aliasFor, #settings_account .aliasFor *{pointer-events: all !important ; color: #555 !important;}
	#settings_prefs #notificationsOnLogin .helpbtn {margin-right: -20px;}
	#settings_account .aliasFor input {background: white !important;cursor: text !important;}
	#settings_account .aliasFor .CTAbtn {display: block; color: white !important;}
	/* 40812 changed selector as the ids now contain the type of source too
		#sources .default{ font-size:12px; margin-bottom:3px;}
		#sources strong{display:inline-block; width:60px; margin-right:5px; border-right:solid 1px #CCC;}
		changed with below
	*/
	.settings_page .azureADBtn{	display:inline-block; padding: 15px 20px; }
		.settings_page .azureADBtn.active{	background-color:azure; }
		.settings_page .azureADBtn img{	display:block; height:40px; margin:0 auto 3px auto; }
	.settings_page #feedbackfrm .helpbtn{float:none; margin-left: 10px;}

	p.label, label.inline{padding-top:10px;}
	label.inline input, label.inline select, label.inline textarea{display:inline; margin-left:10px; }

	.lines>p, .lines>label{padding:15px 0 15px 10px; border-top:solid 2px #FAFAFA; font-size:13px!important; transition: background 250ms;}
	.lines>p:hover, .lines>label:hover, input[type=checkbox]+label:hover{ background-color:rgba(0,0,0,0.03);}
		.lines>p:not(.half):last-child, .lines>label:not(.half):last-child{border-bottom:solid 2px #FAFAFA; margin-bottom:20px;}
		.lines p img{vertical-align:sub; margin-right:5px;}
		.lines .roundbtn{ transform: translateY(-25%); }

		#settings_account .lines a.version{ position: relative; top: 2px; font-weight: bold; }
		#settings_account .lines .version_info{ float: none; top: 5px; left: 15px; }

	#settings_outlet:not(.clinical) .tableName:before{ content:attr(data-css-content-table); }
	#settings_outlet.clinical .tableName:before{ content:attr(data-css-content-bed);}
	#settings_outlet.clinical.roomsMode .tableName:before{ content:attr(data-css-content-room);}
	#settings_outlet:not(.clinical) .tableName.plural:before{ content:attr(data-css-content-tables); }
	#settings_outlet.clinical .tableName.plural:before{ content:attr(data-css-content-beds);}
	#settings_outlet.clinical.roomsMode .tableName.plural:before{ content:attr(data-css-content-rooms);}
	#settings_outlet:not(.clinical) .areaName:before{ content:attr(data-css-content-area); }
	#settings_outlet.clinical .areaName:before{ content:attr(data-css-content-ward);}
	#settings_outlet.clinical.roomsMode .areaName:before{ content:attr(data-css-content-floor);}
	#settings_outlet:not(.clinical) .areaName.plural:before{ content:attr(data-css-content-areas); }
	#settings_outlet.clinical .areaName.plural:before{ content:attr(data-css-content-wards);}
	#settings_outlet.clinical.roomsMode .areaName.plural:before{ content:attr(data-css-content-floors);}
	#settings_outlet .flatpickr-day.selected{background: var(--hcol); border-color: var(--hcol)}

	#settings_outlet #menuPass{width: 212px!important;margin: 0 auto!important;display: flex;}
	#settings_outlet #menuPass input{width: 162px!important;margin-left: 24px!important;;}
	#settings_outlet div.multiSelect .select,#settings_feedback div.multiSelect .select{border: solid 2px #EEE;border-radius: 25px;top: 5px;font-family: Roboto, Arial, Helvetica, sans-serif;font-size: 13px;font-weight: 900;padding-left: 10px;height:40px;margin-top:5px}
	#settings_outlet div.multiSelect{width:50%;float:right;top:-8px}
	.metaBuilder{ white-space: nowrap; margin-bottom: 50px;}
	.metaBuilder:last-of-type{ margin-bottom: 100px}
	.metaBuilder input{ text-align: left;}
	.metaBuilder>.pillbtn{margin-top: 10px;}
		.metaBuilder .delbtn { margin-top:9px; opacity: 0; transition: opacity 300ms }
		.metaBuilder form:hover .delbtn{opacity: 1}
		.tableGroup { padding:10px 25px 25px; border:solid 3px #EEE; border-radius:50px; margin-top:30px; }
			.form-tableGroup { position:relative; background:#FFF; width:70%; margin:-30px auto 10px; border-radius:50px; border:solid 2px #DDD; }
			.form .form-tableGroup input{ background:transparent; border-color:transparent; margin-top: 0!important }
			.form-tableGroup .delbtn{margin:9px;}
			.tables{  white-space:normal; text-align:left; }
				.tables form { display:inline-block; width:45px; }
				.tables input.wide{display: none!important;}
				.tables .pillbtn{margin: 4px 0 0 5px;}
				.tables .delbtn { margin:-7px -2px 0px -18px; background:#FFF; }
	#banking{display: none;}
		input:checked+label+#banking{display: block;}

#selectClient{display: inline-block;position:unset; width:180px;pointer-events:all;}
	#selectClient .selectdrop img {filter:grayscale(1);-webkit-filter:grayscale(1); vertical-align: sub}
	#selectClient .selectdrop div:last-child{ text-transform:uppercase; font-size:10px; font-weight:bold; background:rgba(0,0,0,0.1); padding-left:35px;}
	#selectClient .selectdrop div:last-child:not(.progRun):hover{background-color: #FFF;}
	.select .selected img{vertical-align: middle; height: 16px; width: auto; margin: -2px 7px 0 10px;}

	#selectClient .selectdrop .circle.progRun { position:absolute; width:12px; height:12px; margin:0; padding:0; border-radius:50%; background-color:var(--h3col); display:inline-block; top:25px; left:16px; border:solid 1px #FFF; text-align:center; line-height:12px; }
		#selectClient .selectdrop .circle.progRun.ended { background-color: #AAA; }
		.progRun.circle:before { color: #FFF; text-align: center; font-size: 8px; }
			.progRun.circle.ended:before{ content: '▪'; font-size: 21px;}
			.progRun.circle.started:before{ content: '▶'; }

	#formfooter{ width: 100%; margin-top: 20px; text-align:center;}
	#formfooter td{border:none; border-right:solid #DDD 1px;}
	#formfooter tr:first-child td{border-bottom:solid #DDD 1px; text-align:left;}
	#formfooter tr td:last-child{border:none;}
	#formfooter tr td:nth-child(2){border-right:none;}
	#formfooter tr:hover td{background-color:transparent;}
	#formfooter select{ width: 100%!important;  border: solid 1px #e5e5e5;}
	#formfooter tr:first-child td:first-child:before{content:'Group records by';font-weight:bold;}
	#formfooter.recipe tr:first-child td:first-child:before{content:'Labelling Standard'}
	#formfooter #selectLabel,#formfooter.recipe select{display:none;}
	#formfooter.recipe{position:relative;}
	#formfooter.recipe #selectLabel, #formfooter.Foods #selectLabel { text-align:left; display:block; margin: -16px 0 20px -3px; }
	#formfooter.recipe #selectLabel .selected:hover, #formfooter.Foods #selectLabel .selected:hover { background:#eee; cursor:pointer; }

	#formfooter.MealsxDay .exportFormat,#formfooter.Day .exportFormat,#formfooter.Meal .exportFormat, #formfooter.Foods .exportFormat{display:none;}
	#formfooter.MealsxDay .subRecipes,#formfooter.Day .subRecipes,#formfooter.Meal .subRecipes, #formfooter.Foods .subRecipes{display:none;}
	#formfooter.MealsxDay .portionDetails,#formfooter.Day .portionDetails,#formfooter.Meal .portionDetails, #formfooter.Foods .portionDetails{display:none;}
	#formfooter.MealsxDay .extendFood,#formfooter.Day .extendFood,#formfooter.Meal .extendFood, #formfooter.recipe .extendFood{display:none;}
	#formfooter.MealsxDay .foodPortionDetail,#formfooter.Day .foodPortionDetail,#formfooter.Meal .foodPortionDetail, #formfooter.recipe .foodPortionDetail{display:none;}

	#formfooter .noConfigHidden #selectLabel .selectdrop {position: relative; bottom: 190px;}
	#formfooter.Foods #batchLogsMode{display:none;}
	#formfooter.Foods .expandRecipes{display:none;}
	/* #formfooter.recipe td.exportFormat + td span.helpbtn span{bottom: 109px;}
	#formfooter.Foods td.exportFormat + td span.helpbtn span{bottom: 65px;}
	#formfooter.Meal td.exportFormat + td span.helpbtn span, #formfooter.MealsxDay td.exportFormat + td span.helpbtn span,#formfooter.Day td.exportFormat + td span.helpbtn span{bottom: 35px;} */
	/* #formfooter.Foods .foodPortionDetail{padding-bottom: 20px;}*/
	#formfooter.Foods .extendFood {padding-top: 20px;}
	#batchImport + .footer #selectLabel{margin: -10px 0 -250px 90px;position: relative;float: inline-start;}
	#batchImport .footer #excelOptions:has(#customExcel:not(:checked)) div {display: none !important;}
	#formfooter.recipe td:nth-child(2){width:200px;text-align:left}
	#formfooter.recipe td:nth-child(3) > * {display:none;}
	/* #formfooter.recipe.pdf td:nth-child(2){width:200px;} */
	/* #formfooter.recipe.pdf td:nth-child(4) > *,#formfooter.recipe.qrcodes td:nth-child(4) > * {display:none;} */
	/* #formfooter.recipe.pdf td:nth-child(4) > *, #formfooter.recipe.qrcodes td:nth-child(4) > * {display:none;} */
	#formfooter.recipe.qrcodes td:nth-child(4) > * {display:none;}
	#formfooter.recipe.qrcodes td:nth-child(3) > * {display:inline-block;}
	#formfooter:not(table) .helpbtn span{position:fixed; margin-top:25px; }
	/* #formfooter span.helpbtn.on:after{position:fixed;bottom:42px;} *//**It disturbing the orrange up arrow possion*/
	#formfooter.recipe.pdf div.expandRecipes{display: none;}
	#formfooter.recipe.pdf div.portionDetails{display: none;}
	#formfooter.recipe.pdf td:first-child::before, #formfooter.recipe.pdf #selectLabel, #formfooter.recipe.qrcodes td:first-child::before, #formfooter.recipe.qrcodes #selectLabel{display:none;}
	#brandingForm,.supp_logo_form{background:right no-repeat; background-size:contain; height:80px; position:relative; margin:10px 0 35px; padding:20px;}
		.uploadBubble,#loadingicon{ font-size:20px; letter-spacing: -0.5px; padding:15px 30px 12px; border:dotted 3px #CCC; text-align:center; line-height:100%; background: rgba(255,255,255,0.5); line-height: 100%; border-radius: 50px; transition:background 300ms; cursor:pointer}
		#brandingForm:hover h1, .supp_logo_form:hover h1, .uploadBubble:hover{background:var(--bgcol3);}
		#brandingForm.on .uploadBubble, .supp_logo_form.on .uploadBubble{ display:none;}
		#brandingForm.on:hover .uploadBubble, .supp_logo_form.on:hover .uploadBubble{ display:block; color:#222; }
		.uploadBubble p{pointer-events:none;}
		#brandingForm input, .supp_logo_form input{cursor:pointer!important; position:absolute; top:0; left:0; right:0; bottom:0; cursor:default; background:#FFF; opacity:0.01; height:100px;}
		#loadingicon{ color:#333; display:none;}

		#outletLookup .circlebtn{ margin:7px -15px -40px; background-image:url(/media/icon-magnify.png); background-repeat:no-repeat; background-position:center; background-size:14px; position:static; clear: right;}
		.outletcard:not(:empty)+label{display:none;}
		.disabled .outletcard .delbtn, .disabled .outletcard a.blueline{display: inline-block!important; pointer-events: all;}
		div#autoCompleteDrop-outletAddr div{ padding-bottom:40px; background:#FFF url(/media/powered_by_google_on_white.png) no-repeat bottom 15px right 20px; }
		.outlet .outletphoto img { width:80px; border-radius: 50px; border:solid 4px #FFF; margin:-4px 5px -5px -4px; background:#FFF; position:relative; top:40px; transform:translateY(-50%); }
		#outletLookup label{position: relative;}
			#outletLookup label:before { content:'+ Attach an Outlet...'; display:block; text-transform:uppercase; padding:15px 30px 12px; border:dotted 3px #CCC; text-align:center; background:#FFF; line-height:100%; border-radius:50px; transition:background 300ms; cursor:pointer; position:absolute; z-index:2; width:230px; margin:70px 55px; font-weight:bold; font-size:10px; }
			#outletLookup label:hover:before{background:#EEE;}
			#outletLookup label:after { content:''; position:absolute; background:#FFF; z-index:1; width:120%; height:120px; top:0; margin-left:-30%; }
			#outletLookup label.on:before,#outletLookup label.on:after{display: none;}

/* BROWSER POPUP */
.darkcover#oldbrowser{top:0;}
#oldbrowser .popup{width:381px; margin-left:-200px; margin-top:-200px; padding-bottom:30px}
#browserlist a{display:block; padding:10px; float:left; font-size:10px; text-transform:uppercase; border:solid 1px #CCC; text-align:center; width:100px; height:130px; margin:15px 5px 0 0; cursor:pointer}
#browserlist a img{border:0; display:block; margin-bottom:5px; cursor:pointer}
#browserlist a:hover{border-color:#555;}

#attachGroups { background:#EEE; width:275px; position:absolute; box-sizing:border-box; top:0; left:0; bottom:0; padding:30px 0 0 35px; overflow-y: auto; overflow-x:hidden; border-radius: 30px 0 0 30px;}
	#attachGroups li{padding:7px; list-style:none; font-weight: bold;}
	#attachGroups li:has(.liveIndicator, .sharedIn, .sharedOut) {padding-left: 12px; position: relative;}
		#attachGroups li:hover{ color:#0089bf;}
		#attachGroups li.blueline{ display:inline-block}
	#attachGroups li.disabled{ color:#AAA; pointer-events:none; }
	#attachGroups .newGroup{position:initial; margin:5px 10px 20px}
	#attachGroups li ul{ max-height:0; display:block; overflow:hidden; transition:all 0.5s;}
	#attachGroups li.on ul{max-height:280px; overflow:auto;}
	#attachGroups li strong{pointer-events:none;}
	#attachGroups >ul >li .liveIndicator { position: absolute; left: 0; margin-top: 2px; }
	/*JUL22 8041 checkbox style for multi select popup*/
	#attachGroups .checkbox{display: flex; flex-direction: row; justify-content: flex-start; align-items: center;}
	/*JUL22 8041 added display flex for better spacing managing between elements in multiple selection*/
	#attachPreview { height:auto; min-height: 300px; margin:30px 0 30px 235px; }
		#attachPreview #macrotable table{width:100%; margin-bottom:0}
		#attachPreview h2{font-size:11px; text-transform:uppercase; font-weight:bold; margin:30px 0 0}
		#attachPreview .footer{position:absolute; bottom:0; background:#DDD; color:#FFF; height:50px; left:0; right:0;}

	/*JUL22 8041 use position relative on itemsummary elements to position the added remove button correctly and remove fixed height for elements like food that need more space*/
	.itemSummary { margin:5px 0; padding:10px; border-radius:50px; background:#EEE; position:relative; }
		.itemSummary .foodphoto, .itemSummary .recipephoto, .itemSummary .cardphoto{float:left; margin-right: 10px;}
	#attachPreview .itemSummary {border: 0; margin:0; padding:0; display: inline; background: transparent;}
		#attachPreview.multi{margin-top: 0;}
		#attachPreview.multi .itemSummary { width:49%; display:inline-block; vertical-align: top; border:solid 3px #EEE; border-radius:20px; padding:15px 20px; height:125px; box-sizing:border-box; margin:3px; }
			#attachPreview.multi .itemSummary:hover { border-color:#DDD }
			#attachPreview.multi .foodphoto, #attachPreview.multi .recipephoto{ width:50px; height:50px; border-radius:10px; margin:0 5px 0 0; }
			#attachPreview.multi .editBTN{margin:-58px -18px;}
			#attachPreview.multi .itemSummary h1{font-size: 17px; line-height: 100%;}
			#attachPreview.multi .itemSummary .largeText{font-size: 13px!important}
			#attachPreview.multi .itemSummary .lineabove { border-top:solid 2px #EEE; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
			#attachPreview.multi .itemSummary .delbtn { position:absolute; top:5px;  right:5px;z-index: 0 }
			#attachPreview .itemSummary .notesdiv{max-height:50px;}
	#attachPreview .labelBTN, #attachPreview .insertFoodBTN{display:none;}
	#attachPreview .editBTN{ margin-top: -25px; }
	#attachPreview .foodphoto, #attachPreview .recipephoto { width:200px; height:200px; margin:-20px 20px -20px 0; border-radius: 4px; }
	#attachPreview .foodcode{ left:255px; margin-top:15px}
	#attachPreview .resultDetail span:not(.ctype):not(.monVals){width: 120px;}
	#attachPreview[data-type='insights']{margin-top: 0;}
		#attachPreview .chartPreview { width:50%; float:left; margin:-1px -1px 0 0;}

	#labelThumbs { margin:35px 0 -40px; padding:10px; border-radius:3px; }
		#labelThumbs h3{margin-bottom:5px;}
		#labelThumbs a { display:inline-block; width:90px; height:90px; background:#DDD; overflow:hidden; padding:0; position:relative; border:solid 1px #DDD; margin-right:6px; border-radius: 50px; transition: all 300ms}
		#labelThumbs a .labelThumb{width: 75%; transform: rotate(10deg) translate(-65%, -25%);}
		#labelThumbs a:hover{border-color: #CCC; transform:scale(1.1); box-shadow: 1px 1px 5px #666}



/*//////////////////////////////////////// LOGIN PAGE: ////////////////////////////////////////*/
#login{position:fixed;top:0;right:0;left:0;bottom:0;z-index:50; background:#FFF; padding:50px; transition: opacity 0.4s linear; border-bottom: solid 6px var(--h3col);}
	#login:before { content:''; display:block; background:url(/media/svg/nutico/frag#logoicon) no-repeat bottom center; width:100%; height:100%; z-index:-1; position:absolute; top:0; left:0; background-size:1500px; opacity:0.03; background-position:50vw -50vh; }
	#loginform {position:absolute;top:50%;height:170px;margin-top: -150px;max-width:950px;left:50%;margin-left:-475px;padding-top:105px;background-clip:padding-box;min-width:860px;width:100%; white-space:nowrap;}
	#loginlogo{float: right; width: 235px; margin-top: -6px;}
	.loginTitle { width:140px; font-weight:600; color:#888; font-size:12px; display:block; float:left; margin-top:25px; }
	#loginbanner { position:absolute; bottom:15%; left:50%; margin-left:-360px; width:600px; text-align:center; color:var(--h3col); background:#FFF; padding:15px 50px; box-shadow:1px 1px 10px #999; border-radius:50px; font-size:15px; }
#loginfields{ display: inline-block; background: #FFF; border-radius: 50px 0 0 50px;}
	#login input { padding:0 30px 0 15px; font-size:18px; border:0; width:210px; vertical-align:middle; line-height: 60px; background:#FFF; border-right: 0; background-clip: text !important; transition:all 300ms}
	#login input:not(#rememberme){height: 60px;}
	#login input#uname, #login input#uname:focus{ border-radius:50px 0 0 50px; padding:0 0 0 30px; margin-left:-20px; width:250px; border-right:solid 3px #F9F9F9!important}
	#login .mfa input#uname { padding: 0; }
	#login input::-webkit-input-placeholder{ font-size:11px; color:#AAA;}
	#login input:hover{ position:relative; z-index:1}
	#login input:focus{ box-shadow: 0px 5px 30px rgb(0 0 0 / 20%) }

	#loginform .btn { padding:0px 15px 0 10px; vertical-align:middle; margin-left:-3px; line-height:58px; border-radius:4px 50px 50px 4px; transition:all 300ms; }
		#loginform .btn:hover { background:var(--hcol); padding:0px 10px 0 15px; margin-left:-1px; }
	#loginform #msg{font-style:italic;font-weight: bold;margin: 14px 170px;font-size: 12px;color: var(--h3col);width: 448px; white-space: normal;}
		#loginform #msg a{ margin-left:15px; line-height: 100%; white-space: nowrap;}
		#loginform #msg a.bluebtn{ padding: 8px 15px; border-radius: 50px; font-weight: bold;}
		#loginform.mfa #msg { margin:14px 200px; }
	#loginform #sub{ visibility:hidden; width:10px; height:2px;}

	#remembermebox{color:#999; border:0; width:200px; margin:-4px 0 0 5px; float:left; padding-bottom: 5px;}
		#remembermebox:hover{color:var(--h3col); }
		#remembermebox input{width:auto; margin-right:5px; padding:0px;}
	#logoutmsg:not(:empty) { margin-left:155px; color:var(--h3col); font-style:italic; font-weight:bold; font-size:12px; padding:4px 5px; width:438px; }
	#login input#resetaccount{width: 435px;}

	#loginOauth2 { margin:70px 0 0 215px; clear:both; width:340px; text-align:center; border-radius:50px; padding:2px; }
		#loginOauth2 .loginTitle { margin:0 6px 0 -27px; float:none; display:inline; }
		#login.resetAccount #loginOauth2{display: none;}
		#loginOauth2 a img{ width: 20px;vertical-align: middle; margin-right: 4px}

	#connectedWith, #login.resetAccount #connectedWith, #login.connectedWith #loginfields, #login.connectedWith  #loginOauth2{display: none}
		#login.connectedWith #connectedWith { display:inline-block; background-color:#F5F5F5; border-radius:50px; color:var(--hcol); padding:0 50px 0 10px; width:450px; font-weight:bold; line-height:60px; text-align:center; }
		#login.connectedWith a.bluebtn{ margin-left: -40px!important; margin-top: -4px;}
		#login.connectedWith a.delbtn{ margin:20px; transform:scale(1.1); }
		#login.connectedWith a.oauthBtn{ margin-left:20px; }
		#login.connectedWith #connectedWith a *{ cursor: pointer; }
		#login.connectedWith #connectedWith a img { width:20px; margin-right:5px; vertical-align:middle; }

	#loginform.changepass2{font-size:11px; text-align:center}
		#loginform.changepass2 h2 { color:var(--hcol); margin:-40px 0 15px 0; font-size:22px; width:800px; }
		#loginform.changepass2 input{width:150px; margin-right:10px;}
		#loginform.changepass2 .bluebtn{color:#FFF!important; margin:-1px 90px 0 -60px;}
		#loginform.changepass2 #msg { margin: 15px 0!important; width: 565px;}

	#loginform #loadingbar{position: absolute; left: 535px;}
	#login.simple{padding:0; }
	.simple #loginform { height:100%; position:static; margin:0; width:100%; max-width:none; padding-left:40px; padding-top:160px; box-sizing:border-box; padding-right:48px; border:0; border-left:solid 8px var(--h3col); }
	.alertBox .body:has(.logoutBtn) + .footer #yesBtn { visibility: hidden; }

	.eyebtn{ width: 20px; height: 20px;background: url('/media/svg/nutico/frag#eye'); opacity: 0.4}
	.eyebtn:hover{ opacity: 1; filter: invert(100%) brightness(0.2) sepia(1) hue-rotate(140deg) saturate(20);}
	.eyebtn.closed{background-image: url(/media/svg/nutico//frag#hidden);}
	#loginform .eyebtn{ position:relative; top: 20px; left: 430px; z-index:2; }
	#loginform.changepass2 .eyebtn{left:-418px;}
	#settings_account .eyebtn{ margin: 7px 60px 0 -50px;}
#pop{position: fixed; top: -400px; left: 50%; margin-left: -200px; margin-top: -200px; width: 400px; height: 400px; background: #FFF; border: solid 4px #1b76bb; border-radius: 200px; box-sizing: border-box; padding: 100px 50px; z-index:51; box-shadow: 3px 3px 6px rgba(0,0,0,0.5),0px 0px 0 20px rgba(0,0,0,0.1) inset; display:block; text-align:center;  font-family:HelveticaLTCondensedLightObl, roboto; font-size: 22px; color: #666;background: url(/media/back-gridfromtop.gif) top repeat-x #fff; transition:top 500ms; }
	#pop.on{top: 50%; }
	#pop h2{font-size: 24px; letter-spacing: -1px; color: #226fa9; font-family: HelveticaLTCondensedBlackObl,roboto; text-transform: uppercase;text-transform:uppercase; font-weight:900; font-style:italic;}
	#extendTrial .medText {font-family:Arial;}
	#pop .btns{margin-top:20px;}
	#pop p, #pop label, #pop .label{margin:12px 0; line-height:140%; display:block; }
	#pop label, #pop .label {font-family:Arial;}
	#pop label, #pop .label{margin:5px 0;}
	#pop input{border:solid 1px #DDD; background:#EEE; padding:8px 15px; margin-bottom:2px; vertical-align:middle; color:var(--hcol);}
	#pop input.orangebtn, .orangebtn{background: var(--h3col); border-radius:50px; display: inline-block; position: relative; font-size:14px; white-space: nowrap; color: #fff; text-transform: uppercase; border: 0; transition: background 300ms; padding:10px 20px; font-weight:bold; line-height:10px; cursor:pointer; font-family: HelveticaLTCondensedBlackObl, roboto; }
		.orangebtn.greyback{background-color: #666;}
		.orangebtn.greyback:after{border-color: transparent transparent transparent #666;}
	#pop input.orangebtn:hover, .orangebtn:hover{background:#ffa500; color:#FFF;}
	#pop input.orangebtn:after, .orangebtn:after{content: ""; border-style: solid; margin-top: 1px; border-width: 4px 0 4px 5px; right: 7px; border-color: transparent transparent transparent currentColor; position: absolute;   transition: border-color 300ms}
	.orangebtn.pillbtn:after{display: none;}
	#pop a.bluebtn{font-family:HelveticaLTCondensedBlackObl, roboto; font-size: 13px;}
	#payment-errors{ font-size: 12px; font-family: Arial; padding: 6px 10px; color: #CC0000; border: dotted 1px #CC0000; display: inline-block; margin:0; background: #FFF7F7;}
		#payment-errors:empty{display:none;}
	#acceptBtn.disabled{ pointer-events: none; background: #777; }
	  #acceptBtn.disabled:after { margin:-8px -5px; height:24px; width:24px; animation:rotate 0.8s infinite linear; border:2px solid #EC5E00; border-right-color:transparent; border-radius:50%; z-index:-1; border-top-color:transparent;}

/*//////////////////////////////////////// 2FA PAGE ////////////////////////////////////////*/
	.auth2fa #remembermebox { float: none; }
	.mfa #remembermebox { font-style: normal; margin: auto; width: 100%; }

/*//////////////////////////////////////// ANIMATIONS ////////////////////////////////////////*/
@keyframes rotate{
	0% { transform:rotate(0deg); }
	100% { transform:rotate(360deg); }
}
@keyframes blink{
	0% { opacity:1; }
	50% { opacity:0.5; }
	100% { opacity:1; }
}
@keyframes swell{
  from { transform:scale(1.15); }
  50%{ transform:scale(1); }
  to { transform:scale(1.15); }
}
@keyframes bigswell{
  from { transform:scale(2); }
  50%{ transform:scale(1); }
  to { transform:scale(2); }
}
@keyframes load8{ 0% { -webkit-transform:rotate(0deg); transform:rotate(0deg); }
 100% { -webkit-transform:rotate(360deg); transform:rotate(360deg); }
}
@keyframes searching{
	to { transform:rotate(1turn) translate(50%,50%) rotate(-1turn) translate(-50%,-50%) }
}
@keyframes soft-pulse {
	0% {
		opacity: 0.4;
		transform: translateY(2px);
		filter: blur(1px);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
		filter: blur(0);
	}
}

.fade-update {animation: soft-pulse 0.5s ease-out forwards;}
.loader,.loader:after { border-radius:50%; width:16px; height:16px; vertical-align:middle;} /*DEPRECATED; USE .spinner INSTEAD*/
.loader { margin:0px; font-size:10px; position:relative; text-indent:-9999em; border-top:5px solid rgba(255, 255, 255, 0.2); border-right:5px solid rgba(255, 255, 255, 0.2); border-bottom:5px solid rgba(255, 255, 255, 0.2); border-left:5px solid #ffffff; -webkit-transform:translateZ(0); -ms-transform:translateZ(0); transform:translateZ(0); -webkit-animation:load8 1.1s infinite linear; animation:load8 1.1s infinite linear; display:inline-block}
#msgpop .loader{margin:-2px 10px -2px -20px;}
.swell{ animation: swell 1s infinite}
.spin { animation:rotate 2s infinite;display: inline-block;}
.aiWait{ -webkit-animation: rotate 1.0s infinite linear; animation: rotate 1.0s infinite linear; transform-origin: 25px; transition:all 2s}
	#results-foodSearch .aiWait{ margin: 80px 100px; }
	.aiWait:before, .aiWait:after{ content:''; width:10px; height:10px; display:inline-block; background-color:currentColor; border-radius:50px; -webkit-animation:orbit 1.5s infinite ease-in-out; animation:orbit 1.5s infinite ease-in-out; margin:0px -16px; transition:all 1.5s}
	.aiWait:after{ bottom:0; -webkit-animation-delay:-0.5s; animation-delay:-0.5s; scale: 3; margin: 25px; }

/*//////////////////////////////////////// GENEIRC ICONS ////////////////////////////////////////*/
.icon:before{content:''; width:20px; height: 20px; background:no-repeat center; background-size: contain; display:inline-block; vertical-align:middle;}
	.icon-mobile:before{background-image:url(/media/svg/nutico/frag#mobile);}
	.icon-bin:before{background-image:url(/media/svg/icons/frag#bin)}
	.icon-white:before{filter:invert(100);}
	.icon-accessibity:before{background-image: url(/media/icons/userWay.png);}
	.icon-settings:before{background-image: url(/media/icon-settings2.gif);}
.icon.small:before{ width: 16px; height: 16px; }
.icon.xlarge:before{width: 30px;height: 30px;}

/*//////////////////////////////////////// MENU ////////////////////////////////////////*/
#menudiv{height:30px; text-align:left; position:absolute; top:1px; left:0; right:0; z-index:7; background: #FFF;}
#build{  display:inline-block; background:var(--hcol); color:#FFF; position:absolute; right:0px; font-size:8px; border-radius: 50px 0 0 50px; text-transform:uppercase; font-weight:bold; top:17px; padding:2px 5px; text-shadow:1px 0 4px rgba(0,0,0,0.4); }
#build:empty{display:none;}

.template{display:none;}
#newBtn { z-index: 1; padding:0 25px 0 36px; line-height:28px; margin-left:-15px;}
	#backbtn{ line-height:28px; width:0px; border-radius: 0; padding:0; transition:all 250ms;}
	#backbtn:not(.hide){ width:55px; padding:0 23px 0 13px }
	#backbtn:not(.hide):hover { padding-left: 4px; }
	#backbtn:not(.hide)+#newBtn{ padding-left:25px; }
#backbtn b, #forwardbtn b{font-size: 8pt; line-height: 10px; }
#forwardbtn{ padding-left:7px;}
#statusEl { right:86px/*253-150-17*/; position:absolute; top:4px; }
	#statusEl>*{ transition:all 200ms; scale:0.4; opacity:0; pointer-events:none; position: absolute; margin: 0; }
	#statusEl.active .active, #statusEl.offline .offline, #statusEl.error .error{ scale:1; opacity:1; pointer-events:all; }
	#statusEl .error{ margin: 2px 0; height: 18px; width: 18px!important; }
#menudiv .bluebtn#bookDemo, #menudiv .bluebtn#daysLeft{ display:none; float:right; line-height:9px; width:44px; border-right:1px solid #454545; padding:6px 10px; height:auto; }
#daysLeft{text-align: left;}
#daysLeft span{ font-size:20px; float:left; line-height:18px; margin-right:3px;}
	#daysLeft.on,#bookDemo.on{display:inline-block;}

#tabmenu{position:absolute; padding-left:10px; left:240px; top:2px; right: 275px; height: 28px;white-space: nowrap; transition:height 300ms; overflow-x:hidden; z-index:2}
	#tabmenu div{ display:inline-block; vertical-align: top; padding:8px 8px 3px 20px; color:#888; font-weight:bold; text-transform:uppercase; font-size:10px; border-bottom:0; margin-right:5px; line-height:5px; border-radius:50px; position:relative; transition:all 300ms; border:solid 2px #EEE; }
	#tabmenu div:not(.on):hover{ color:var(--h3col); z-index:1; box-shadow:0px 0 8px #CCC; border-color:#FFF; }
		#tabmenu div.on { background:#EEE; border:0; color:var(--hcol); z-index:2; padding:12px 14px 6px 24px; position:relative; border-radius:13px 13px 0 0; margin-top:0 }
		#tabmenu div.on::before, #tabmenu div.on::after{content:''; width:28px; height:28px; background:inherit; clip-path: url(#tabCorners);position:absolute;top:0;left:0;transform: translateX(-10px);}
			#tabmenu div.on::after{transform: rotateY(180deg); right: -10px; left: auto;}
		#tabmenu a.delbtn{color:#666; margin:-8px -7px -2px 9px; border:0; line-height:20px ;}
			#tabmenu a.delbtn:hover{ background:var(--h3col); color:#FFF}
		#tabmenu a.roundbtn{ margin: -7px 6px -3px -19px; }
		#tabmenu a.roundbtn svg{margin-top:1px;}
	#tabmenu.disconnected div.on{ color:#666; background:linear-gradient(180deg, #EEE 70%, #DDD 100%); padding:10px 14px 5px 24px; margin-top:1px; }
		#tabmenu.disconnected div.on::before, #tabmenu.disconnected div.on::after{ display:none; }
		#tabmenu.disconnected div.on:hover{ color:#F60; background:#EEE }
		#tabmenu.disconnected a.delbtn{color:#333; margin-left:10px}
	#tabmenu.disabled div{pointer-events:none; background: #BBB;min-width: 40px; padding-bottom: 10px;}
	#tabmenu.disabled div:after{border-color:transparent transparent transparent #BBB}

	#tabmenu #help { cursor:pointer; position:absolute; right:-60px; top:12px; }
		#tabmenu #help svg { color:#FFF; transition:all 0.3s; background:#20699d; border-radius:50%; pointer-events: none;}
		#tabmenu #help:hover svg { color:#FFF; background:#ff8800; }

	#tabDrop{ display:none; width: 0; height: 0; position: absolute;  top:0px; right:275px; z-index:2 }
	#tabDrop.on{display:block;}
	#tabDrop.on::before { content:""; position:absolute; height:29px; width:20px; right:0; background:linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%); }
	#tabDrop::after { content:"\25BA"; background:#DDD; width:20px; line-height:20px; height:20px; display:block; text-align:center; font-size:7px; border-radius:50px; margin-top:4px; transition:transform 200ms }
		#tabDrop:hover::after{background:var(--h2col); color:#FFF}
		#tabDrop:hover.on::after{ transform:rotate(90deg) scale(1.2); }
		#tabDropMenu{ max-height:0; overflow:hidden; width: 150px; border-radius: 15px; transition: max-height 400ms; margin-left: -82px; position: absolute; top: 25px; box-shadow: 1px 1px 20px rgba(0,0,0,0.5); }
		#tabDrop:hover #tabDropMenu{ max-height:300px; }
			#tabDropMenu div{ background: #FFF; padding: 12px 10px 12px 25px; color:#444; font-weight:bold; text-transform:uppercase; font-size: 10px; display:block!important; transition:background 300ms }
			#tabDropMenu div:hover{ background:#EEE; color:var(--hcol);}
			#tabDropMenu div.selected{ color:var(--hcol); }
			#tabDropMenu .delbtn{ border:0; font-size:8px; margin-right:-5px; line-height:16px;}
			#tabDropMenu .roundbtn.xxsmall{ display:none;}


/*MAIN MENU STYLING:*/

#toprightmenu { position:absolute; right:0; width:253px; top:0; }
#toprightmenu>* {display:inline-block; vertical-align: middle; float: none;}

	#mainCTAbtn{  position:absolute; right:253px; line-height:28px; margin:1px; z-index: 3;}
	#menu ul{ border-radius: 0 20px 20px; margin-left:-1px;}
	#menu #about{ background: transparent;padding: 0; }
	#menu #about span{ background:var(--h2col); background:color-mix(in srgb, var(--h2col), #000 6%); display: block; padding:7px 0 10px 0}
	#menu li ul li{background-color: var(--h2col);}
	#menu a{ padding:2px 18px; font-size:9pt; line-height:25px;}
	#menu a:hover{color:#FFF; background:rgba(255,255,255,0.06)}
	#menu a.bluebtn{color:#FFF; font-size:7pt; line-height:24px;}

	#menu li ul li a, #menu li:hover ul li a{padding:10px 20px 10px 18px; color:#FFF; white-space: nowrap;}
	#menu li ul li a.sel{color:var(--bgcol3);}
	#menu ul li a img, #menu ul li a svg{border:0; vertical-align:middle; float:left; margin-right:15px;}
	#menu li a.bluebtn img{margin-right:-16px; height:auto;}
	#toprightmenu a.blockbtn { height:30px; font-size:10px; font-weight:bold; padding:0px 17px; line-height:30px; margin:-1px;}
		#toprightmenu a.blockbtn svg{ width: 16px;}
		#toprightmenu a.blockbtn:hover{ background:#EEE; color: var(--h2col)}
		#alertbtn{ padding: 0 12px;}
		#menu li a#mainmenubtn img{float:none; margin:0; opacity:0.7;  margin-top:-1px;}
		#menu li:hover a#mainmenubtn{ background-color:var(--h2col); color:var(--bgcol3); text-shadow: 1px 1px 1px rgba(0,0,0,0.2);}
		#menu li:hover a#mainmenubtn img{opacity:1;}
	li#about{padding:5px 10px; text-align: center; font-size:10px; color:rgba(255,255,255,0.5); cursor:pointer; background:rgba(0,0,0,0.1)}
	li#about:hover{color:var(--bgcol3);}

	/*dropdown positioning:*/
	#menu a{display:block;}
	/*position level 1 links horizontally*/
	#menu li{display:block; float:left;}
	/*undo previous style for level 2 links*/
	#menu li ul li{float:none;}
	/*position level 2 links vertically and hide*/
	#menu li ul{max-height:0; padding-bottom:0; transition:max-height 300ms; position:absolute; z-index:10; margin-top:0; overflow: hidden; -webkit-filter:drop-shadow(1px 3px 3px rgba(0,0,0,0.3));-ms-filter:drop-shadow(1px 2px 3px rgba(0,0,0,0.3));filter:drop-shadow(1px 2px 3px rgba(0,0,0,0.3));}
	/*unhide level 2 links on li:hover from level 1*/
	#menu li:hover ul{max-height:500px; width: 190px}

/*//////////////////////////////////////// PANES: ////////////////////////////////////////*/
/*.pane{height:100%; width:300px; display:inline-block; overflow-y:auto; overflow-x:hidden; position:relative; border-right: 1px dotted #999; background-color:#FFF;}*/
.pane{width:300px; /* overflow-y:auto; overflow-x:hidden; */ position:absolute; top:0; bottom:0;  background-color:#FFF; }
.pane:not(.food):not(.activity):not(.recipe):not(.orders):not(:has(.options.supplier-options)){z-index:1}
.pane.wide{width:689px}
.pane iframe{width:100%; height:100%; border:0}
#pane-clientSearch{width:210px;}
#pane-clientEdit{left:210px; width:690px; white-space:initial; z-index: 0; border-top: solid 40px #EEE;}
#pane-logSearch{width: 250px; left:900px; z-index:5; transition:width 350ms; background:#EEE; overflow:inherit;}
	#pane-logSearch.maximised{ width:1024px; }

#pane-maindiv{width:auto; left:1150px; min-width:774px; overflow-x:auto; border-right:solid 1px #EEE; transition: opacity 400ms}
	#pane-maindiv:before{ content:''; display:block; position:absolute; top:0; left:0; width:100%; height:40px; background:#EEE; z-index:0; pointer-events:none; }
	#pane-maindiv.noscroll{overflow-x:hidden}
	 .popupOn #pane-maindiv{overflow:hidden}
	#mainnest{transition:-webkit-filter 1000ms, opacity 1000ms; max-width: 100%; max-width:calc(var(--scaled-width, 100vw) - 250px);}
	#pane-maindiv.closed{filter: grayscale(1); -webkit-filter: grayscale(1);}
	#pane-maindiv.closed #mainnest{ pointer-events: none; overflow: hidden;}
	#pane-maindiv.closed .options{top:0px;}
	#pane-maindiv.closed .fixedHead {top: 40px;}
	#pane-maindiv .disabled{filter:none;opacity: 1;pointer-events: all;}
	#pane-maindiv #susPanel.disabled,#pane-maindiv #cooPanel.disabled{filter:grayscale(1);}
	#pane-maindiv #weightbox.disabled,#pane-maindiv #allergyinfo.disabled{filter:grayscale(1); pointer-events: none;}
	#pane-maindiv.folder #footer input.disabled{pointer-events: none;}
	#mainnest>#loadingbar{position: absolute; left: 50%; top: 70px; margin-left: -20px;}
#mainnest:empty { position: absolute; }
	#mainnest:empty:before { content:'Open something to begin'; font-size:30px; width:775px; display:block; position:absolute; top:40vh; letter-spacing:-0.5px; color:#ddd; font-style:italic; white-space:normal; text-align:center; font-weight:900; }
	#mainnest .dotdotdot { position:absolute; scale:1.2; }

/*#pane-maindiv.recipe,#pane-maindiv.food,#pane-maindiv.activity,#pane-maindiv.RDA {overflow-x:hidden; padding-top:44px; }*/
#logtable{margin-left:390px;width: auto;}
#logTableWrap{overflow-x: auto;width:100%}
#logTableWrap #fixedHead{height:50px; display:inherit; margin-left:-411px;}
#logTableWrap #fixedHead tr{ position:fixed; z-index:3; background:#fff; border-bottom: solid 2px #EEE; min-width: 100%; }
#fixedHead .tabs a.on{ border-bottom:0px;}
#fixedHead .tabs a{line-height:27px; font-weight: 900;}
#logTableWrap .tabmenu{ margin:-7px 0 0 -13px; background:transparent!important }
	#logTableWrap .tabmenu a{ border-radius: 20px 20px 0 0; padding: 12px 35px 8px; vertical-align: top; }
	#logTableWrap .tabmenu a.on{ padding: 12px 35px 8px; }
#logTableWrap tbody th.td-food, #logTableWrap tbody th.td-del{ position:absolute; height: auto; padding: 0;}

#logTableWrap tbody th.td-del{height:35px; left:0px; padding-bottom:0px!important;}
#foodHead{height:40px!important; font-size:10px!important; line-height:34px!important;z-index:1;}
.fixed #foodHead{line-height: 25px!important;}
#logtable #foodHead .tabs{overflow: initial;} /*Fix for safari*/
#logTableWrap #fixedHead .td-quantity{padding-right:20px!important; padding-left:20px!important;}
#pane-maindiv.log thead .td-del{background: #fff!important;}
#logTableWrap tr:not(.collector):hover th{ background-color: var(--bgcol3); color: #222;}
#logTableWrap tr.collector:hover th{background:#E5E5E5;}
#logTableWrap tr.collector{ display:block; min-height: 28px; }
	#logTableWrap tr.collector th{ position:absolute; z-index:1; height:29px; width:100%; padding:4px 13px; font-size:15px; text-align:left; left:0px; background:#eee; font-weight:normal;border-left: 0; border-right: 0; overflow: visible; font-weight:bold; transition:all 300ms}
	#logTableWrap tr.collector th img{ margin:-3px 1px 0 -2px; vertical-align:middle; opacity:0; border:solid 2px transparent; border-radius:50%;}
			tr.collector.sel th, #view h5.sel, .mealHeading.sel td:first-child { color:var(--hcol)!important; margin-left:5px; transition: box-shadow 300ms}
			tr.collector.sel th:before, #view h5.sel:before, .mealHeading.sel td:first-child:before{ content:"▼"; color:var(--h3col); font-size: 10px; margin-left: -4px; position:absolute; z-index:0}
			.mealHeading.sel td:first-child:before{margin-left: 22px; margin-top:5px;}
			tr.collector.sel th>input, #view h5.sel>input, .mealHeading.sel td:first-child>input{ padding-left:17px; position:relative; z-index:1; }
				#view h5.sel [data-field='groupname'], .mealHeading.sel input{font-weight: bold!important;; color:var(--hcol)!important;}
				#view h5.sel [data-field='groupname']:focus, .mealHeading.sel input:focus{color:var(--h3col)!important;}
	#logTableWrap tr.collector th.dragOver{background-color: var(--h2col)!important; color:#FFF }
body.dragging #logTableWrap tr.collector{ margin-bottom: 12px;}
	body.dragging #logTableWrap tr.collector th { line-height:30px; box-sizing:content-box; border:dotted 2px #CCC; clear:both; font-weight:bold; font-size:16px; text-align:center; z-index:2; }
		body.dragging #logTableWrap tr.collector th:before{content:'\2198';margin-right: 7px;color: var(--h2col);}
	#logTableWrap tr.collector th.dragOver:before{color:#fff!important;}

		body.dragging #logTableWrap tr.collector th img{opacity:1; border-color:#FFF}
	/*body.dragging #logTableWrap tbody tr.collector th:after{content:'drop here'; float:right; margin-right:20px; font-style:italic; color:#999}*/
#logTableWrap th.td-food { min-width:350px; max-width:490px; padding:8px 15px; font-size:15px; text-align:left!important; left:41px; font-weight:normal; }
	#logTableWrap.scrolledX th.td-food { z-index:1; background:#FFF; }
	#logTableWrap.scrolledX #logtable>*>tr:before { content:''; position:absolute; height:38px; left:390px; width:20px; background:linear-gradient(-90deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.04) 100%); z-index:1; }
	#logTableWrap #foodBody th.td-food span:first-child,#logTableWrap #activityBody th.td-food span:first-child{ display:inline-block; max-width:320px; overflow:hidden; text-overflow:ellipsis;}
	#logTableWrap #foodBody th.td-food input, #logTableWrap #activityBody th.td-food input { display:inline-block; overflow:hidden; text-overflow:ellipsis; width:100%; line-height:36px; padding:0 30px 0 20px; margin-right:-30px; }
	#logTableWrap #foodBody th.td-food.grabber:before{margin:-8px 0; }
	#logTableWrap th.td-food .customWidth{max-width:235px!important;}
#logTableWrap #fixedHead tr{ margin-left:20px; }
	#logTableWrap #fixedHead th.td-food{ background:#FFF!important; overflow:visible; padding-right:5px; }
	.fixed #logTableWrap #fixedHead th{ padding:0px 10px 0px 10px; position:fixed; top:74px; z-index:2; height:25px!important; overflow:hidden; left:290px; box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.2); }
	.fixed #logTableWrap #fixedHead th.td-del{left:250px!important;}
#logTableWrap input{position:relative!important}
#logTableWrap .clearportion{ right:5px;}
#logTableWrap .unavailable{text-align:center;}
#logTableWrap .unavailable .smallText{font-style: normal;}
#showMeals{ position: fixed; top: 30px; z-index: 4; margin-left:531px; line-height: 28px;}
#fixedHead th.td-food, #fixedHead th.td-del{position:relative; z-index:3; left:0px;}
#fixedHead td,#fixedHead th{display:inline-block;}
#pane-maindiv{ padding-top:40px; padding-left: 0px; margin-left: 0px;}
	#pane-maindiv.mealplan{padding-top:0px;    margin-top: 40px;}
	#pane-maindiv.recipe, #pane-maindiv.food:not(.log), #pane-maindiv.RDA{ overflow-x:hidden; }
	#pane-maindiv.pane.food{padding-bottom: 100px}
	#pane-maindiv.recipe #mainnest{ border:0; overflow-x:hidden;}
	#pane-maindiv div#mainnest .mealPlan{margin-top: -41px;}
	#pane-maindiv.mealplan #mainnest{border:0;}
	.mealplan .td-quantity {z-index:0;}
	.mealplan .td-del a, .log .td-del a{z-index:0!important;}
#pane-report{width:855px; left:1151px; overflow:hidden; background:transparent; display:none}
	#wrapper.report #pane-report{display:block;}
	#pane-report .err span{font-size:13px;}
	#pane-report .err span:last-child{display:none;}
	#wrapper.report #pane-maindiv{display:none;}
#pane-startframe2{border-right:solid 1px #EEE;}
#mpTable .td-text{min-width:90px;}
#view .groupTotal, #subfolder-view .groupTotal{height:22px;}
	#view .groupTotal .mon.smallText{padding-right:3px;}
	#view .groupTotal .mon{line-height:21px!important;border:none!important;}
	#view .groupTotal .td-text{font-weight:bold;font-size:14px;background:#EEE!important;border-radius:50px;color:#666!important;padding:0 3px;}

/*//////////////////////////////////////// HOME PAGE: ////////////////////////////////////////*/
#bodynest{ color:#CCC; position:absolute; top:0; left:0; right:0; bottom:0; background: url(/media/back-watermark.png) no-repeat bottom center; }
	#start { position:absolute; width:250px; height:150px; top:52%; left:49%; transform:translateX(-50%); }
	#version { position: relative; font-size:9px; float:right; margin-right:10px; font-style:italic; margin-top:-10px; }
	#version strong{pointer-events:none;}
	#version .orange{ font-weight:900}
	#logo{width:100%}
	.bounceIn{animation-duration:1200ms; animation-name:bounceIn; animation-timing-function:ease-in;}
	#start.surefood #logo{width: 40%;left: 150px;position: relative;top: -20px;}
	#start.surefood span{top: 60px;left: 110px;position: absolute;}
	#start.surefood #version{margin-top:-15px !important;}
@keyframes bounceIn {
  0% {opacity: 0; transform: scale3d(.5, .5, .5);}
  50% { transform: scale3d(1, 1, 1); }
  60% { transform: scale3d(.97, .97, .97); }
  70% { opacity: 1; transform: scale3d(1, 1, 1);}
  80% { transform: scale3d(.99, .99, .99); }
  to { opacity: 1; transform: scale3d(1, 1, 1); }
}


.searchdiv{position:relative; background:#EEE; padding:2px; height:40px; width:100%; z-index:4; box-sizing: border-box;}
	.searchInput{ padding:0 45px; border:0;width: 100%;height:34px;line-height:36px; border-radius:50px; font-size: 18px; font-weight:bold; color:var(--h3col);position:absolute;left:0;transition:all 300ms; letter-spacing: -0.5px; margin-left:-1px;}
		.searchInput::placeholder{ font-size:10px; text-transform:uppercase; color:#AAA; text-shadow:none!important; letter-spacing:0px; transform:translate3d(0,-3px,0); transition:color 300ms;}
		.searchInput:hover{ box-shadow: 0px 0 8px #CCC; }
		.searchInput:hover::placeholder{ color:var(--h3col) }
		.searchInput+.roundbtn{ margin: 2px 0px;}
		input.searchInput:focus { box-shadow: 0 4px 30px rgba(0,0,0,0.4); transform:scale(1.03)}
		input.searchInput+.roundbtn svg { transition:all 300ms; }
		input.searchInput:focus+.roundbtn svg { width:16px !important;}
		#searchIcon{ z-index:1; }
		#searchIcon.searching svg{ animation:searching 1s infinite; margin:35%  }

	#pane-logSearch.activity #input-foodSearch,
		#pane-logSearch:not(.activity) #input-activitySearch,
		#input-packSearch:not(.hidden)+#input-foodSearch{display:none;}
	.options .searchDropBtn{margin: 2px 1px 2px 3px!important; z-index: 2}
	.searchdiv>a, .searchDropBtn{ position: relative; z-index: 1; margin: 2px;}
		.searchdiv a.clearSearch{ margin:8px 1px}
		#pane-clientSearch .searchdiv a.clearSearch{ margin:7px 30px; z-index:7; position:relative;}
		.searchdiv .clearSearch:not(.on), #clientDetails .select .clearSearch:not(.on),#menuSearchDrop .clearSearch:not(.on){display:none;}
	#advSearch .bluebtn, #advSearch .greybtn{ float: left; padding:9px 6px;}
	.searchdiv.on .searchDropBtn{ transform:rotate(180deg); font-size:10px; color:#FFF; background:var(--hcol); }
	#advSearchIng {display: none;}
	#advSearchIng.on{display: block;}
	#advSearchIng div input{width: 100%}


	.damobtn{padding:4px; background-color:#900; color:#FFF; float:right; cursor:pointer;}

	.panelopts { position:relative; z-index:2; background:var(--h2col); height:27px; line-height:26px; border-radius:50px; padding:0 3px; white-space:nowrap; }
	.panelopts a { padding:1px 13px; text-transform:uppercase; display:inline-block; margin:3px 0 -1px; min-height:21px; line-height:21px; border-radius:10px 10px 0 0; background:color-mix(in srgb, var(--h2col), #000 25%); color:#EEE; font-size:10px; position:relative; font-weight:900; transition:all 300ms; }
		.panelopts a:not(.on):hover { background-color:color-mix(in srgb, var(--h2col), #000 50%); transform:translateY(-1px); padding-bottom:3px; }
		.panelopts a>b{ width:66px; line-height:9px; margin:0px -7px -2px; text-align:center; }
	.panelopts a#treeviewBTN{ border-bottom-left-radius: 10px; }
	.panelopts a#searchTabBTN{ border-bottom-right-radius: 10px; width:33px; padding-left: 11px;  }
	.panelopts a#packsBTN, .panelopts a#projectsBTN{ padding:1px 12px; }

	#pane-clientSearch .panelopts{min-height:23px;}
	.pane.foods .panelopts a#foodsBTN,
			.pane.recipes .panelopts a#recipesBTN,
			.pane.packs .panelopts a#packsBTN,
			.pane.projects .panelopts a#projectsBTN,
			.pane.treeviews .panelopts a#treeviewBTN,
			.pane.searchresults .panelopts a#searchTabBTN{ background:#FFF; color: var(--h2col); transform:translateY(-1px); padding-bottom:4px; z-index:2; border-bottom-right-radius: 0; }
			.pane.treeviews .panelopts a#treeviewBTN{ border-bottom-left-radius: 0;}
	.panelopts a svg{ max-height:14px; max-width:16px; margin:-1px -3px 0 -3px;}
	.pane.foods .panelopts a#foodsBTN, .pane.recipes .panelopts a#recipesBTN{ padding-right:25px; }
	.pane.treeviews .group.select, .pane.searchresults .group.select{display:none;}

.grouplist{overflow:visible;}
#pane-clientSearch .results{top:40px;}

.bigIconMenu{margin:0 -20px -25px; text-align:center}
	.bigIconMenu>div{ display:inline-block; width: 169px; height:180px; vertical-align:top; border-radius:20px; transition:all 300ms, background 200ms; }
	.bigIconMenu>div .head{ font-size: 20px; color: var(--hcol);}
		.bigIconMenu .head+.subhead{ font-size:13px; color:#777; display:block;  margin:5px 10px;}
		.bigIconMenu .head:first-child{ margin-top:50px; display:inline-block; } /* no img */
	.bigIconMenu>div:not(.raised):not(.tab):hover{background-color: #F9F9F9;}
	.bigIconMenu>div:not(.submenu):active{transform:scale(0.95);}
	.bigIconMenu .img{display:inline-block; width: 166.5px; height:100px; overflow:hidden; box-sizing:border-box; /*padding: 105px 10px 70px;*/ line-height:90%; font-style:normal; font-size:20px; cursor:default!important; background: url(/media/icon-circle-icon.gif) no-repeat center 20px;text-align: center;transition: background 300ms; color:var(--hcol); outline:none}
		.bigIconMenu .grey:not(:hover) .img, #inputoutputTab .bigIconMenu .grey:not(:hover){filter:grayscale(1); opacity: 0.7;}
		.bigIconMenu .grey .head{color: #888;}
	.bigIconMenu svg.img { background-image:none; height:50px; width:auto; display:block; margin:25px auto 15px; }
	.bigIconMenu>div.disabled{filter: grayscale(100%);}
	#chooseFoodInputSrc>.spacer{ position:absolute; top:85px; left:105px; }
	#chooseFoodInputSrc.otherSrcs>.spacer{ left:275px; }
	#chooseFoodInputSrc svg.img {background-color:#226ca1;color:white;border-radius:50px;height:70px;padding:15px; margin:20px auto 15px; }
#startMenu .bigIconMenu > div:not(.submenu){width:169px; margin-right: -3px; overflow:visible; word-break:break-word;}
	#newTab .bigIconMenu>div[data-for='featuresTab'] svg, #newTab .bigIconMenu>div[data-for='inputoutputTab'] svg{color:#AAA;}
	.bigIconMenu>div.ontrial svg, #addFeaturesBtn .head, #addFeaturesBtn:hover svg { color:var(--h3col)!important; }
	.bigIconMenu>div.ontrial:after { content:'FREE ON TRIAL !'; padding:0 15px; border-radius:50px; line-height:16px; background:var(--h3col); color:#FFF; font-weight:900; font-size:10px; margin-top:7px; display:inline-block; }
#newTab .bigIconMenu div:first-child, #featuresTab .bigIconMenu div:first-child, #inputoutputTab .bigIconMenu div:first-child{border-left:0; margin-left: 1px;}

#startMenu.slideTabs.small{padding-top:15px;}
	#startMenu.small .bigIconMenu>div .head{ font-weight:bold; font-size:18px;}
	#startMenu.small .bigIconMenu .head+.subhead{font-size: 14px;}
	#startMenu.small .bigIconMenu > div:not(.submenu) { transform:scale(0.9); height:180px; margin:2px -25px -20px 0; width:190px; border-radius: 30px; z-index:1; position:relative;}
	#startMenu.small #featuresMenu > .tabBtn:not(.submenu), #startMenu.small #inputoutputTab > .tabBtn:not(.submenu){transform:scale(0.85); height: 170px; width: 22%; padding-top: 10px;}
	#startMenu.small #featuresMenu svg.img, #startMenu.small #inputoutputTab svg.img{margin-top: 10px;}
	#startMenu.small #featuresMenu .tabBtn.addonEnabled::after, #startMenu.small #inputoutputTab .tabBtn.addonEnabled::after{top: 49px;}
	#startMenu.small .bigIconMenu{margin:20px 20px 35px}
	#startMenu.small .bigIconMenu#featuresMenu{margin-top:0}
		#startMenu.small .bigIconMenu > div:not(.submenu):nth-of-type(5){border-left: none;}
		#startMenu.small .bigIconMenu > div:not(.submenu):nth-of-type(n+5){border-bottom: none;}
		#startMenu.small .bigIconMenu > div:not(.submenu):active{transform:scale(0.85);}
	#startMenu.small #featuresTab{min-height: 590px;}
		#startMenu.small .bigIconMenu{ height:335px; overflow-y:auto; overflow-x:hidden; }
		#startMenu.small #featuresMenu > div, #startMenu.small #inputoutputTab > div{ border-bottom: none!important; }

#featuresTab .tabBtn *:not(.subhead) { color: var(--h3col); }
#inputoutputTab .tabBtn *:not(.subhead) { color:var(--h2col); transition:color 250ms }
#inputoutputTab .tabBtn:hover *:not(.subhead) { color:var(--hcol); }
	#featuresTab .tabBtn.addonEnabled svg, #inputoutputTab .tabBtn.addonEnabled svg { fill: #BBB; }
	#featuresTab .tabBtn.addonEnabled *, #inputoutputTab .tabBtn.addonEnabled * { color: #AAA; }
	.tabBtn.addonEnabled:after { content:''; background:#09F url(/media/svg/nutico/frag#check) center no-repeat; width:20px; height:20px; border-radius:50px; position:absolute; border:solid 2px #000; top:65px; margin-left:8px; filter:invert(1); background-size:14px; }
	#featuresTab .tabBtn.on, #inputoutputTab .tabBtn.on {  background-color:#FFF; transform:scale(0.9) !important; box-shadow:0 2px 30px #DDD; }
		#featuresTab .tabBtn.on:before, #inputoutputTab .tabBtn.on:before { content: '\23f7'; position: fixed; color: var(--h3col); font-size: 23px; bottom:0; transform: translate(-50%,50%);}
		#featuresTab .submenu div, #inputoutputTab .submenu div{border: 0; width:auto; margin-left: -15px!important; }
		#featuresTab #LabelMaker .fl {width:580px;}
		#featuresTab h4 { font-size:22px; margin:25px 0 5px 35px; text-align:left; }
		#featuresTab .spacer>svg, #inputoutputTab .spacer>svg {margin: -3px 5px 0 -10px;}
		ul.featureList{font-size:15px; line-height: 36px; list-style-type:none;}
		ul.featureList li:before{content:''; width:25px; height: 25px; display: inline-block; margin-right: 10px; background:  url(/media/svg/allergens/frag#tick) no-repeat center; filter:invert(100%) brightness(0.5) sepia(8) hue-rotate(-10deg)saturate(20); vertical-align: middle; margin-top: -3px}
		span.planList{width: 30%; font-size:17px; display: block; line-height: 25px; padding-top: 6px;}
			.circleSummary{margin: 25px 0;text-align: center;font-size: 14px;color: #AAA;}
				.circlePrice { display:inline-block; width:70px; height:70px; background:#999; color:#FFF; font-size:9px; border-radius:100px; padding-top:25px; padding-right:5px; box-sizing:border-box; line-height:13px; text-align: center; vertical-align: middle;text-overflow:ellipsis; overflow:hidden; font-weight: bold;}
			.circlePrice.lgreyback{background: #EEE;color: #666;text-shadow:none;}
			.circlePrice.blue .price{ color: var(--h2col); }
				.circlePrice .price{ font-size: 28px; font-weight: 900; letter-spacing: -2px; }
			.circlePrice svg { width:26px; display:block; margin:-10px auto 0; }
				.circlePrice svg:only-child { width:40px; }
			.circleSummary .circlePrice{ margin:0 3px; width:60px; height: 60px; padding-top: 21px; text-transform: uppercase;}
			.circleSummary .circlePrice.blueback{ background: var(--h2col);}
				.circleSummary .circlePrice .price{  font-size: 20px; letter-spacing: -1.5px}
				.circleSummary .circleTxt {  position:absolute; margin-top:23px; width:55px; font-size:8px; margin-right:60px; display:block; text-align:center; line-height:9px; font-weight:bold;  }
				.circleSummary .circlePrice input{border:0; background:#eeeeee; width:100%; text-align:center; padding:0; margin-top:-5px;}
				.circleSummary+.spacer{margin-top: 0!important}
		#enableAddon { position:absolute; bottom:40px; right:50px; padding: 14px 30px; }
		#featuresTab .submenu{background-repeat: no-repeat; background-position:right 190px bottom 0;}
		#featuresTab .submenu#InsightsPremium{ background-position-y: 10px; }

	.bigIconMenu>div.submenu { background:#EEE; padding:25px 50px; position:absolute; bottom:6px; left:25px; right:25px; box-sizing:border-box; height:250px; width:auto; text-align:left; display:block; font-size:13px; border-radius:25px; }
		.bigIconMenu>div.submenu.small { height:auto; padding:10px;}
		.bigIconMenu>div.submenu.clearback { top:50px; padding:30px 10px;}
		.bigIconMenu>div.submenu.tab{ display:none; }
		.bigIconMenu>div.submenu.tab.on{ display:block; }
			.bigIconMenu hr.submenu{margin-top: 50px;}
		.submenu>div{ margin: 0 30px 0 0; }
		.submenu #action-container.inline-flex > .btn {position: relative;inset:unset; transform: unset;display: block !important;}
		.submenu > #col1, .submenu > #col2 {display: inline-block; vertical-align: top;}
		.submenu .nicEdit-head { width: 100%!important; }
			.submenu .nicEdit-main { width: 500px!important; }
			.submenu .nicEdit-head div, .submenu .nicEdit-body div, .submenu .nicEdit-options, .submenu .nicEdit-options div { margin: 0; width: auto; border: 0; }
			.submenu .nicEdit-options{ left:180px!important }
			.submenu .nicEdit-button { margin: 7px!important; }
			.submenu .nicEdit-selectTxt { height: 34px!important; line-height: 32px; cursor: default!important; }
			.submenu .nicEdit-selectControl { margin-top: 6px!important; }

			.bigIconMenu .submenu a { display:block; line-height:50px; padding-left:20px; white-space:nowrap; }
			.bigIconMenu .submenu a.disabled { background:none; color:#AAA; }

			.submenu div.fr{text-align:center; width:140px; margin: -15px;}
			.submenu div.fr a{ line-height:25px; font-weight:bold; font-size:11px; border-radius: 50px;;}
			.bigIconMenu .submenu a .counter{ margin-right: 5px; }
			.bigIconMenu .submenu a:hover .counter{background-color: var(--hcol);}


	.submenu#rep_periodsSub{max-width:845px;left:0;}
	.submenu#rep_periodsSub div{ width:unset; border-bottom:unset; margin:0 0 7px; background:transparent;}
	.submenu#rep_periodsSub .divTable{ width:90%; }
	.submenu#rep_periodsSub{ -webkit-column-count:unset; -webkit-column-gap:unset; column-count:unset; column-gap:unset;}
	.submenu#rep_periodsSub .divTable{ width:90%; }
	.submenu#rep_periodsSub .divTable .divTableCell .label, .submenu#rep_periodsSub[data-periodname=Meal] label, .submenu#rep_periodsSub[data-periodname=Day] label{ font-size:11px; line-height:120%; padding:0 6px; }
	.submenu#rep_periodsSub[data-periodname=Meal] >div, .submenu#rep_periodsSub[data-periodname=Day] >div{ display:inline-block; width:33%; }
	.submenu#rep_periodsSub div.menuAvg{width:100px;float:left;}
#outputContent.batch-period-day label.period-meal,#outputContent.batch-period-meal label.period-day{ color:#bbb; }
p#logsSelected { position:absolute; bottom:66px; right:0px; z-index:1; width:290px; background:#FFF; padding:7px; box-shadow:0 0 10px #DDD; border-radius:50px 0 0 50px; }
label.period-meal::after, label.period-day::after{  float: right; color: #999; font-size: 10px; }
label.period-meal::after{ content: "MEAL"; }
label.period-day::after{ content: "DAY"; }
#outputContent h2>p{margin-bottom:0px; line-height: 10px;}
#outputContent #needHelp{ font-size:10px; }
#explorerPop .splitform{ padding: 0px; }
#explorerPop #inactiveMenu{ font-weight: bold; visibility:hidden; }
#explorerPop #inactiveMenu.on{ visibility:visible; }
#explorerPop #inactiveMenu:before{ content: '!'; display: inline-block; color: #FFF; width: 16px; height: 16px; text-align: center; border-radius: 50%; border: solid 1px var(--h3col); line-height: 17px; font-size: 12px; background-color: var(--h3col); margin: 0px 3px; }
#explorerPop .helpbtn{ width: 20px!important; height: 20px; line-height: 20px!important; margin-top: -21px; margin-right: -3px; }
#explorerPop #menuList { width:350px; left:50%; border:solid 1px #DDD; transform:translate(-50%,50px); }
#explorerPop #copy { margin: -7px; }
#outputBackBtn{ position: absolute; left: -18px; top: 40px;}
	#outputBackBtn.orangebtn{ text-align: center; }
	#outputBackBtn.orangebtn:after{ display:none; }
.outputbtn, a.outputbtn { position:absolute; left:-23px; height:40px; line-height:30px; border-radius:50%; width:40px; top:40%; font-size:12px; padding:5px; }
	.outputbtn.flipH{left: calc(100% - 18px);}
	#qrcode { border-left:solid 4px var(--hcol); width:135px; height:100%; background:#EEE no-repeat; background-position:center; position:absolute; right:-110px; top:0; background-blend-mode:multiply; box-sizing:border-box; text-align:center; padding-top:5%; font-weight:bold; font-size:10px; color:#888; border-radius:0 30px 30px 0; }
	  	#qrcode img{display:block; margin:0 auto; width:130px; height:130px;}
		#qrcode #qrcodeimg{ margin:5px 0px; }
  #tab-DigitalMenu{ padding-right:300px; min-height:350px;}
  .togglebtn.sel+#tab-DigitalMenu{display:block;}
	  #tab-DigitalMenu #qrcode{ right:0; width:300px; line-height:200%;}
	  #tab-DigitalMenu #qrcode:before{ content:"How to access your\A digital menu app..."; white-space: pre; position:absolute; top:40px; left:0; width:100%; font-size:18px; color:#444}
	  #tab-DigitalMenu .bluehead{margin-bottom:0;}
	  #tab-DigitalMenu .delbtn{margin:0 -10px 0 10px;}
	  #tab-DigitalMenu p{padding:10px; margin:0; border-bottom:dotted 1px #CCC}
	  #tab-DigitalMenu #quickMenu{border-top: 2px solid var(--hcol); margin-top:10px;}
	  #menus p:hover, #menus+p:hover{background:#f2f2f2;}

	  #tab-DigitalMenu p.c{border:0; padding:0}
	  #tab-DigitalMenu p img{vertical-align:middle; margin-right:5px;}
		#tab-DigitalMenu p a:not(.delbtn){color:var(--hcol); font-weight:bold; padding:2px 10px;}
		#tab-DigitalMenu p a:hover{background:rgba(0,0,0,0.1);}
		#tab-DigitalMenu p a.tabbtn{margin-bottom: -10px; }
		#tab-DigitalMenu p a.tabbtn.on{ background:#DDD; padding: 6px 25px 5px 20px; position:relative;}
		#tab-DigitalMenu p a.tabbtn.on:after{content:'x'; position:absolute; right:8px; top:0px; color:#999}
		#tab-DigitalMenu p a.tabbtn.on:hover:after{color:#444;}
		#tab-DigitalMenu .bluebtn{margin-top:10px;}
	.vSettings{ background: #DDD; box-sizing:border-box; padding:0!important; height:0px; overflow:hidden;}
		.vSettings.on{ height:225px; padding:5px 15px!important; border-radius: 0 0 10px 10px; margin:-5px 0 10px; border-top:solid 5px #D5D5D5}
		.vSettings label{ line-height:30px!important}
		.vSettings label.indent{ margin-left: 20px; width: calc(50% - 20px); }
		.vSettings label:hover{background:rgba(0,0,0,0.05); transition:background 300ms; }
		.vSettings #disclaimer{position:relative;line-height:18px; width:100%; margin-bottom: 30px;}
		.vSettings #disclaimer input{width:100%;margin-left:0px; display: block!important; position:absolute;}
	#menus .vSettings{position:relative;}
	#menus .vSettings .groups{ position:absolute; margin-top: 115px; right:20px; font-size:11px;}
	#menus .vSettings .groups span{width:169px; display:block; margin-left:96px; min-height:15px; overflow-y:auto; margin-top:-13px; max-height: 80px;}
	#menus .vSettings .groups .newGroup{position: relative;left: 95px;}

	#tab-DigitalMenu input[type=text], #tab-DigitalMenu input[type=password]{width:168px;}

	#tab-PrintedMenu.vSettings.on{ height:auto;}
	#tab-PrintedMenu .spacer{margin-top:-5px;}

	#popupcontent #daterange, #popupcontent .flatpickr-input{ width:250px; font-size:14px; margin:-9px 0px;}
	#reportSchedulePop .flatpickr-input{ margin: 2px 0 0 0; width: initial;font-size: initial;}
		.flatpickr-calendar.open { box-shadow:0px 2px 25px rgba(0,0,0,0.25); transition:box-shadow 300ms; background:#FFF; padding:20px; overflow:hidden!important; box-sizing:content-box; margin-top:-3px; border-radius:30px; }
		.flatpickr-calendar.open:hover {box-shadow:0px 2px 15px rgba(0,0,0,0.6);}
	#orderTimeClock + #cpDrop { position: absolute; z-index: 1; }
	#menuActivityTable{ width: 100%; }
		#menuActivityTable tr{transition:opacity 300ms}
		#menuActivityTable thead td{font-weight: bold; transition:opacity 300ms}
		#menuActivityTable .totals td{font-weight: bold; background-color: #EEE;}
		#menuActivityTable .totals td:first-of-type:before{content:'Totals'}

/*//////////////////////////////////////// FOOD CREATOR: ////////////////////////////////////////*/
.food #mainnest, .activity #mainnest{width:100%;}
.recipeCreator .options, .foodCreator .options {width:auto!important; padding: 0 22px; margin-left: -20px;}
.recipeCreator .alert, .foodCreator .alert {width:700px!important; padding: 1rem; position: fixed; bottom: 10px; z-index: 3;}
.recipeCreator .alert .delbtn, .foodCreator .alert .delbtn {position: absolute; right: 0; top: 0; background-color: var(--h2col);}
.recipeCreator .options.disabled,.foodCreator .options.disabled {pointer-events: all;background:#EEE;opacity: 1;}
.disabled .options .roundbtn:not(.hidden), .disabled .options .greybtn:not(.hidden), .disabled .options .bluebtn:not(.hidden), .disabled .options .btn:not(.hidden),
.disabled #owner .roundbtn:not(.hidden), .disabled #owner .greybtn:not(.hidden), .disabled #owner .bluebtn:not(.hidden), .disabled #owner .btn:not(.hidden) {display: inline-block !important;}
.options .submenu.sel.bigdrop{  width:760px; position:relative!important; left:105px; top:-1px; max-height:490px; z-index:1; height:490px; overflow-y: auto; -webkit-column-count:1;-moz-column-count:1; column-count:1; min-height:180px}
	.options .dropbtn.sel{ position:relative; }
		.options .dropbtn.sel:before { content:''; border:7px solid transparent; border-top-color:var(--h2col); position:absolute; bottom:0; left:50%; transform:translate(-50%, 100%); z-index:3; }
	.bigdropList{-webkit-column-count:3;  -moz-column-count:3; column-count:3; width: 95%; padding-bottom:60px;}
	#foodcatSub.filtered #catlist.bigdropList{-webkit-column-count:2;  -moz-column-count:2; column-count:2;}
	.bigdropList.noresults:after { content:'No category found, please try a more general search term'; font-size:25px; color:#CCC; font-style:italic; position:absolute; left:0px; padding:100px; text-align:center; font-weight:bold; line-height:120%; }
	.bigdropList label{font-size:12px;}
	.bigdropList label input[data-group="Custom Fields"] + span .ficon {margin-left: 0; margin-right: 4px;}
	.bigdropList label:has(input[data-group="Custom Fields"] + span .ficon.hidden) {display: none !important;}
	.popup .bigdropList label{ font-size:12px; padding:4px;}
	.bigdrop .bigdropList{position:absolute; width: calc(100% - 40px); border:0;}
	[data-type="menu"] #monitorsDropSub .bigdropList,.folder[data-type="recipe"] #monitorsDropSub .bigdropList,.folder[data-type="food"] #monitorsDropSub .bigdropList {column-count: 2}
	.autoscale .bigdrop{ height:365px}
	.options .submenu.sel.bigdrop .delWrap{position:fixed; width: 725px; height: 30px; margin:0; z-index: 1; border:0; pointer-events: none;}
	.options .submenu.sel.bigdrop .delWrap input, .options .submenu.sel.bigdrop .delWrap a, .options .submenu.sel.bigdrop .delWrap>div{pointer-events: auto;}
	.options .submenu.sel.bigdrop .delWrap .footer a{padding: 0px 25px !important;}
	.delWrap .footer, #templateContent+.footer{ padding:10px; position:absolute; bottom:0; right:0; width:245px; height:60px; }
	.options .submenu.sel.bigdrop #foodcatSubNest{width:100%; border:0;}
	#foodcatSubNest .submenuFilterContainer{margin-top:0px !important;}
	.options .submenu.sel.bigdrop .delbtn{ right:10px; top:5px; left:auto;}
	.options .submenu.sel.bigdrop h5 { padding-left: 15px; margin:-10px -10px 10px -10px!important; text-align:center; width:calc(100% + 20px); font-weight:bold; color:#555; letter-spacing: -0.5px; font-size: 18px;}
	.options .submenu.sel.bigdrop.withTempaltes h5{ text-align:left; }
	[data-type="menu"] .options .submenu.sel.bigdrop h5,.folder[data-type="recipe"] .options .submenu.sel.bigdrop h5,.folder[data-type="food"] .options .submenu.sel.bigdrop h5{ text-align: left;}
	#resetmonitors:hover{color:var(--bgcol3);}
.pane.pack .options .submenu.sel.bigdrop {height: 240px;}

	#jumpMenu { position:fixed; z-index:4; top:73px; width:763px; white-space:normal; background:#FFF; border-radius:20px; padding:1px 1px 1px 35px; overflow: hidden; transition:all 300ms; }
		#pane-maindiv.scrolled #jumpMenu, #jumpMenu.on { box-shadow:0 0 15px rgba(0,0,0,0.2); }
		#pane-maindiv.scrolled #jumpMenu:not(.on) { width:min-content;}
		#jumpMenu.on { padding-bottom:20px;}
	#jumpMenu>span{ height: 34px; line-height: 34px; white-space: nowrap; }
		#jumpMenu.on>span{ margin-bottom:10px; }
		#jumpMenu>span:after{ content:''; position:absolute; right:0; top:0; bottom:0; width:20px; background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%); z-index:1; }
		#jumpMenu .drop{ margin-left:-15px; }
	#jumpMenu .btn{ margin:2px;}
		#jumpMenu button.btn{ margin:0 -20px 0 2px;}
	#pinnedJumpBtns{ padding-left:5px; }
		#pinnedJumpBtns:empty::before{ content:attr(data-css-content-val); font-size:12px; color:#AAA; font-weight:bold; margin-left:10px;}
		#pinnedJumpBtns .btn:hover svg{ color:var(--h3col)!important; }
	#mainnest>.recipeCreator>h5.tgPanel:first-of-type, #mainnest>.foodCreator>h5.tgPanel:first-of-type{ margin-top: 50px!important; }

#foodContent{margin:21px -10px 0; overflow: auto; padding: 0; border-right: solid 1px #EEE;}
	.startscreen #foodContent{ margin-bottom: 100px; overflow:scroll !important;}
	.startscreen #foodContent.showLabel>div{width:350px; margin:0 auto; border-left:2px solid; border-right:2px solid; height:78vh; border-color:#EEE; padding-top:20px; box-sizing: border-box;}
	.foodCreator.startscreen #foodContent.showLabel>div{height: 75vh;}
	.startscreen #foodContent.showLabel.USorder>div,.startscreen #foodContent.showLabel.GCorder>div{ height:var(--scaled-height, 100vh); } /* #40618 */
	.startscreen #foodContent .lInput input{pointer-events:all; cursor: initial; color: var(--hcol);}
	.startscreen #foodContent input{  display:inline-block; font-weight:bold; }
	.startscreen #foodContent .unit { font-weight:bold; }
	.startscreen #foodContent.showLabel {width:100%!important;background: #EEE;}
	.startscreen #foodContent.showLabel .lInput{width:235px; margin:0 auto;}
	.startscreen #foodContent.showLabel .unit{right:15px; font-weight: bold;}
	/*AUG22 37448 hide new sodium and salt input and their labels whyle not in extended or other sources and prevent the use of different style for new span in .unit*/
	.startscreen #foodContent.showLabel #salt-sodium, .form .unitval input, #foodContent.showLabel #salt-sodium{display: none !important;}
	.startscreen #foodContent.showLabel #foodlabel-salt .unit span, #foodContent.showLabel #foodlabel-salt .unit span{display: none !important;}
	.startscreen #foodContent.showLabel #sodium-salt, .form .unitval input, #foodContent.showLabel #sodium-salt{display: none !important;}
	.startscreen #foodContent.showLabel #foodlabel-sodium .unit span, #foodContent.showLabel #foodlabel-sodium .unit span{display: none !important;}
	.startscreen #foodContent .unit span{font-size: inherit;font-weight: inherit;color: inherit;}
	.startscreen .unavailable,.startscreen #labelHead h3:nth-child(3),.insertLabel{display:none;}
	.startscreen .insertLabel{display:block}
	a.insertLabel.adjustForVideo{left:820px;}
	#foodContent .lInput input{pointer-events:none; background: #f9f9f9; cursor: default; color:#777;}
	#foodContent{margin-top:-8px; overflow: auto; padding: 0; border-right: solid 1px #EEE; transition:all 0.5s; }
	#foodContent.showLabel label:not(.lInput),#foodContent.showLabel .grouphead{display:none;}
	#foodContent .label{display:inline}
	#foodContent.showLabel { width:470px; min-height:382px; }
	.pane.food #foodContent.showLabel { width: 350px; overflow: hidden; margin: 0;}
	#foodContent.showLabel label:hover{background:none!important;}
	#foodContent.showLabel .lInput{ width: 446px; float:none;position:relative; height:35px;}
	#foodContent.showLabel .unit { position:absolute; right:227px; color:#777; top:2px; text-align:left; width:20px; font-size:10px!important; }
	#foodContent.showLabel #foodlabel-labelRating .unit { top: unset; font-size: 18px!important; }

	 #foodContent.showLabel #foodlabel-labelRating .helpbtn {position:absolute; left:75px; top:10px; color:#FFF!important; } /*//Divya//#59003//changed left to 70px*/
	  .startscreen #foodContent.showLabel #foodlabel-labelRating .helpbtn{display: block; left:-18px !important;top:10px}
	  #foodContent.showLabel #foodlabel-labelRating .helpbtn span{color:#FFF!important; line-height: inherit; font-weight: normal; overflow: hidden;}
	#foodContent.showLabel #foodlabel-labelRating .extraTxt { position:absolute; right:auto; margin-left: 4px; top:3px;}
   .startscreen #foodContent.showLabel #foodlabel-labelRating .extraTxt{right:-23px;}

	/*//Divya//#59003//Start//*/
	#foodContent.showLabel .lInput#foodlabel-labelRating{height: 55px;}
		#foodContent.showLabel .EUNsLabel,#foodContent.showLabel .UKNsLabel { position:relative; margin:0px 55px 0 -7px!important; object-fit:cover; height:42px!important; object-position:bottom; }
		#foodContent.showLabel #foodlabel-labelRating div .hfssRating{float: right;width: 250px;color: rgb(119, 119, 119);}
		#foodContent.showLabel #foodlabel-labelRating .hfssRating .lnutName{width:90px; vertical-align: inherit;overflow: visible;}
		#foodContent.showLabel #foodlabel-labelRating .hfssRating .extraTxt{margin:0px !important; top:6px}
		#foodContent.showLabel #foodlabel-labelRating .hfssRating input { width:34px!important; text-align:center; margin:3px -30px 0 55px; padding:0px !important; padding-left:2px !important; padding-right:2px !important; vertical-align:text-bottom; border-radius:50px; height:34px; border:solid 2px currentColor; }
		#foodContent.showLabel #foodlabel-labelRating .hfssRating{display: inline-block;vertical-align: top;}
		#foodContent.showLabel #foodlabel-labelRating .hfssRating .helpbtn{left:100px}
		#foodContent.showLabel #foodlabel-labelRating .nScore ~ .hfssRating .helpbtn{left:355px !important}
		#foodContent.showLabel .nScore{ width:100px;}
		#foodContent.showLabel #foodlabel-labelRating .nScore ~ .hfssRating span>span{left:0}
		.foodCreator #foodContent.showLabel #foodlabel-labelRating .hfssRating{display:block;}
		.foodCreator #foodContent.showLabel #foodlabel-labelRating .hfssRating input{ margin-left:65px; }
		.hfssSubTitle{position:relative;top:-16px;}

		#foodlabel-labelRating img{margin-left: -24px;vertical-align: top; height: 40px;display: inline-block; padding:2px; background:white;width:90px;}
		#p-s_showFeatureOnMainMenu { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }
		#p-s_showFeatureOnMainMenu option.disabled{color:grey;}
		#p-s_showTherapeuticMeals~span{float: left;margin-left: -20px;margin-top: 15px;}
		.tableView #labelRating a svg , .tableView #healthScore a svg {width:15px !important ; vertical-align:0px}
	/*//Divya//#59003//End//*/

	#foodContent.showLabel .pUnit{right:85px!important}
	#foodContent .unitperc { font-size:12px; position:relative; top:-3px; height:32px; }
	#foodContent .unitperc:before { position:absolute; content:''; width:8px; height:100%; left:0; background:linear-gradient(to right, rgba(0,0,0,0.035) 0%,rgba(0,0,0,0) 100%); pointer-events:none; }
	#foodContent .unitperc span{color:#AAA!important; text-align: center;display: block;}
	#foodContent.showLabel .lInput span:not(.unitperc):not(#lUnit):not(#pServing){font-size:12px;color:#777;}
	#foodContent.showLabel .lnutName{width: 120px; display: inline-block; box-sizing: border-box; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; vertical-align: top; padding-top: 4px;}
	#foodContent.showLabel .lnutName.second, #foodContent.showLabel .unit.second{display: none}/*SEP22 42869 hide second and unit label from foodcontent*/
	#editLabelVals, #editCollabsBulk, #mapToggle { width:34px; height:34px; border-radius:50%; padding:0; margin-top:-6px; position:absolute; right:6px; }
	#closeQuidBtn{ margin: -4px 0; }
	h5[data-prefname='groups'] #editLabelVals{background-image: url(/media/icon-usergroup.png);}

#labelHead{height: 30px!important; color: #777;}
#labelHead h3{display: inline-block; text-align: center;}
#labelHead h3:nth-child(2){width: 91px;}
#labelHead h3:nth-child(3){width: 35px;}
#labelHead h3:nth-child(4){width: 91px;margin-left: 28px;}
#labelHead h3:nth-child(5){width:35px;}
/*.showLabel.USorder label:nth-child(-n+2) span{margin-left:10px;}*/
.showLabel.USorder #foodlabel-satfat .lnutName,.showLabel.USorder #foodlabel-trans .lnutName,.showLabel.USorder #foodlabel-fibre .lnutName,.showLabel.USorder #foodlabel-sugar .lnutName,.showLabel.GCorder #foodlabel-satfat .lnutName,.showLabel.GCorder #foodlabel-trans .lnutName,.showLabel.GCorder #foodlabel-fibre .lnutName,.showLabel.GCorder #foodlabel-sugar .lnutName,.showLabel.EUorder #foodlabel-sugars .lnutName,.showLabel.EUorder #foodlabel-satfat .lnutName,.showLabel.AUorder #foodlabel-satfat .lnutName,.showLabel.AUorder #foodlabel-sugars .lnutName{padding-left:10px!important; font-style:italic;}
.showLabel.SAorder #foodlabel-sugars .lnutName,.showLabel.SAorder #foodlabel-satfat .lnutName{padding-left: 10px!important;}

	#foodContent #unavailable{text-align:center;}
.foodCreator #statsbox{margin:0 15px 0 0;}
	.foodCreator #pie{margin:0 10px 0 0;}

	.panelbody{ padding:15px 10px; white-space: normal;transition:all 0.3s; opacity:1; width: 100%; box-sizing:border-box; position:relative;  }
		.panelbody .largeText{/* background:#FFF!important; padding: 9px; margin:-10px -10px 10px -10px; */}
		.panelbody .largeText input, #portionBody .largeText input{width:70px;color:var(--hcol);border: solid 2px #EEE;padding: 5px!important;font-size: 16px;font-weight:bold;text-align:center;border-radius: 50px;}
		.panelbody input:disabled{color:#888;}
		.greyborder{border: solid 1px #DDD!important; display: inline-block; margin-left: 5px; background:#FFF; position: relative;}
		.panelbody .greyborder{ border:solid 2px #EEE!important; border-radius: 50px;}
		.panelbody .largeText .greyborder input{border:0;}
		.panelbody .largeText input:hover:not(.greyborder input){box-shadow:0 1px 3px #CCC;}
		.panelbody .greyborder.yield{ color: #777;border-bottom: none;border: none!important;}
		.panelbody .greyborder.yield a{color: #777;font-weight: normal; border-bottom: 0;}
	#recipeMonitor{width:90px; display:inline-block!important}
	#recipeMonitor.hidden {display: none !important}
	.startscreen #recipeMonitor { width:90px; display:inline-block!important; text-align:right; padding-right:50px!important; }
	.largeText .gbox{  display: inline-block; color:var(--hcol); width: 24px; padding:5px 0 4px 1px; vertical-align: top;  margin-left: -1px; pointer-events:none; }
	.unitInput { color:var(--hcol); text-align:right!important; width:103px; font-weight:bold; letter-spacing:-1px; font-size:22px; margin-left:-20px; border:0!important; outline:0!important; }
		.unitInput+span{display: inline-block; color:var(--hcol); font-weight:bold; width: 24px; padding: 6px 0 4px 1px; margin-left: -1px; pointer-events:none; text-align: left; }
		.unitInput.largeText{line-height: 30px;}
		.unitInput.orgYield{color:#ccc;}
#foodContent.splitform input{width:210px;}
.food .options input#description, .recipe .options input#description, .pack .options input#description{font-weight: normal; width:306px; font-style: italic;}
.food .options input#code{width: 90px; margin-right: 8px;}
.foodCreator .smartInsert+h5, .recipeCreator .smartInsert+h5,.foodCreator .smartInsert+table, .recipeCreator .smartInsert+table{/* margin:0!important; */}
.foodCreator h5.off, .recipeCreator h5.off{margin:23px 0!important;}
.foodCreator h5.off *, .recipeCreator h5.off *{visibility:hidden;}
.foodCreator #code, .recipeCreator #code, .packCreator #code{  width:150px; margin:-5px -5px 0 0; text-align:center; font-size:12px; font-weight:bold; line-height:14px; }
#foodcode{font-weight:bold; color:#666;}
.recipeCreator.disabled .select{background: none; box-shadow:none}
.recipeCreator.disabled .select .selected::after{display: none;}
.recipeCreator.disabled #claims .select:not(.fullWidth), .recipeCreator.disabled .noClaims{display: none!important;}
.recipeCreator #exportPrefsContent{max-height: 500px !important;overflow: scroll !important;}
/* .recipeCreator.disabled .showClaim{display: inline;} */

.foodCreator .options .submenu label span{ border:0; padding:5px 2px;}
.foodCreator .options .submenu label{padding:0;}
.foodCreator .options .submenu label:hover span, .bigdropList label:not(.subgroupitem):hover span{background:var(--bgcol3); font-weight: bold;}
.foodCreator .options .submenu label.sel span, .bigdropList label.sel span{ border: solid 1px var(--hcol); padding: 0 10px; color:var(--hcol); font-weight:bold; z-index: 1; position: relative; background:#FFF; line-height: 20px; margin: 2px -1px;}

.recipeCreator .options form input.required, .foodCreator .options form input.required{border: 0;}

.submenu#foodcatSub #foodcatSubNest{ width:100%; border:unset; }
	.submenu#foodcatSub #foodcatSubNest h5{ display:block; }
#foodcatSub{left:0;}

#mainnest>div>h5, h5.tgPanel{ position:relative; margin:40px 0 0!important; clear:both; width:100%; padding:10px 20px; text-align:left; }
.folder h5.tgPanel.off{margin: auto 0 180px!important;} /*#93117 and #92592. Needed to avoid hiding under the theory ordering layer*/
	#mainnest>div>h5.off,thead.shrinkTD.off .tgPanel{transition: all 150ms ease-out 250ms; color:#666!important; transition:all 200ms}
	#mainnest>div>h5,td.tgPanel{transition:all 150ms ease-out 50ms;}
	#mainnest>div>h5.off:hover,td.tgPanel.off:hover{color:var(--hcol)!important; border-color:#AAA; }
	.tgPanel[data-prefname=allergens]{clear: right;}
	.tgPanel .smallselect { border-radius:50px; margin:0 -10px 0px 7px; text-align:center; font-weight:bold; width:120px; }
	.tgPanel .select.smallselect { line-height:30px; width:140px; margin:-5px 10px; }
	#mainnest>div>h5.off:after,.shrinkTD.off .tgPanel:after,#mainnest>div>span>h5.off:after,#mainnest>div>div>h5.off:after{content:'click to expand'; font-style:italic; font-size:12px; position:absolute; right:40px; line-height:23px; color:#AAA}
		#mainnest>div>h5.off:hover:after,.shrinkTD.off .tgPanel:hover:after{color:var(--hcol)}
	h5.tgPanel.off,.shrinkTD td {padding:3px 20px!important; }
	.shrinkTD td, .shrinkTD td .gbox{color:#EEE!important; border-right-color:#EEE!Important}
	.tgPanel::before { content:'\25bc'; font-size:12px; position:relative; margin-right:5px; top:-2px; transition:all 300ms; display:inline-block; }
	.tgPanel:hover::before { color:var(--h3col); }
	.tgPanel.off::before,.shrinkTD.off .tgPanel::before{ transform:rotate(-90deg);}

.tgPanelOn{max-height:100%;transition:max-height 0.5s cubic-bezier(0, 1, 0, 1);}
.tgPanelOff{max-height:0!important;padding:0;overflow:hidden;min-height:0px;}
h5.tgPanel.off>* { display:none; }
.tgPanel.off #code, .tgPanel.off #code{margin: -4px -6px 0 0;}

.smartInsert, .insertLabel { position:fixed; left:980px; line-height:60px; bottom:10px; cursor:pointer; -webkit-transform:translateZ(0); z-index:5; }
	.smartInsert{opacity: 0; pointer-events: none; transform: scale(0.8); transition: all 300ms}
	.smartInsert.vis{opacity:1; pointer-events: all; transform: none;}
	.recipeCreator .smartInsert.vis{z-index: 2;}
	.startscreen .smartInsert{display:none;}
	.smartInsert:hover{background:var(--h2col); color:var(--bgcol3); transform: scale(1.1);}

.insertOptions { width: 100%; display: block; }
.insertOptions span { display: inline-block; padding: 13px 8px 16px 37px; background: #EEE; color: #555; box-shadow: 1px 1px 1px rgb(0 0 0 / 20%); box-sizing: border-box; text-align: center; width: 45%; margin: 5px 22px 5px 0; cursor: pointer; position: relative; line-height: 40px; border-radius: 50px; font-weight: bold;}
	.insertOptions b { position: absolute; left: 10px; top: 2px; }
	.insertOptions p{overflow:hidden; text-overflow:ellipsis; white-space:nowrap;}
	.insertOptions span:hover{ color: var(--hcol); background-color: #FFF; box-shadow: 1px 1px 4px rgba(0,0,0,0.5); border-color: #FFF; }
	.insertOptions .ficon{ width: 50px;margin: 15px 0 0 -25px;}

#auditPanel { position:fixed; transform:translateX(100%); transition:transform 250ms; background:#FAFAFA; width:150px; top:30px; bottom:0; left:initial; right:0; overflow:visible; text-align:center; white-space:normal; z-index:6; box-shadow:0 10px 20px #DDD; }
.maximised #auditPanel {display: none;}
#auditPanel.on{ transform:none; }
#auditPanel>div{overflow-y:auto; height: 100%}
	#auditPanel p.spacer{ margin:0 8px 7px; line-height:40px; width:90%;}
	#auditPanel p.spacer .toggle{ margin:12px -21px 0 -40px;}
	#auditPanel ol h3{line-height: 40px; letter-spacing: normal;}
	#auditPanel ol>li>a{padding: 30px 0; font-weight: bold; border-radius: 10px; font-size: 12px; display: block; transition: background 300ms}
		#auditPanel ol>li>a:hover{color: var(--hcol); background: #FFF}
		#auditPanel ol>li.on>a{background:var(--h2col); color:#FFF;}
	#auditPanel ol ol{position: fixed;background: #FFF;color: #444;width: 310px;margin-left:-150px;top: 30px;opacity:0;transition: margin-left 300ms, opacity 300ms;pointer-events: none;overflow-y: auto;box-shadow: -1px 1px 24px rgba(0,0,0,0.4)}/* SEP22->37048 //Gurinder*/
	#auditPanel ol li.on ol { margin-left:-310px; opacity:1; pointer-events:all; overflow-y:auto; border-radius:25px; max-height: calc(var(--scaled-height, 100vh) - 30px);}
	#auditPanel ol ol li{padding: 10px;font-weight: normal; line-height: 150%; text-align: left;padding: 13px 20px;border-bottom: solid 2px rgba(0,0,0,0.03); font-size: 11px;}
		#auditPanel li p{margin-top: 5px;font-size: 10px; font-weight: bold;}
		#auditPanel ol ol li:hover{background:var(--bgcol3)}
		#auditPanel #minimenu .btn{margin:0 4px;}
			#auditPanel #minimenu .btn.on{ position:relative; z-index:1}
		#auditPanel #minimenu #aSearch{position:absolute; width:192px; height:42px; top:42px; right:35px; transform:translateX(118%); transition: transform 300ms; }
			#auditPanel #minimenu #aSearch a{ position:absolute; right:0px; top:0px; padding:13px 6px;}
			#auditPanel #minimenu .btn.on+#aSearch{ transform:none;}
			#auditPanel #minimenu #aSearch input{ line-height: 40px; width:210px; }
		#auditPanel ol li .tiles, #auditPanel .parentLi li{display:none;}
		#auditPanel ol li .tiles.on, #auditPanel .parentLi li.on{display:block;}

	#backbtn0, #forwardbtn0, #auditbtn{position:fixed;z-index:6;width:2px; top:30px;bottom:0;left:0;color:#FFF;transition: width 150ms;}
		#backbtn0 span, #forwardbtn0 span, #auditbtn span{ position:absolute; top:45%; display:block; padding:18px 0; color:transparent; background:var(--h3col); width:0; border-radius:0 60px 60px 0; }
		#backbtn0 span{background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='15px' height='14.4px' viewBox='0 0 15 14.4' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:none;stroke:%23FFFFFF;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:10;%7D%0A%3C/style%3E%3Cpolyline class='st0' points='7.2,1 1,7.2 7.2,13.4 '/%3E%3Cline class='st0' x1='1' y1='7.2' x2='14' y2='7.2'/%3E%3C/svg%3E%0A"); background-position: 3px 12px; background-repeat: no-repeat; background-size: 11px;}
		#forwardbtn0{ left:auto; right:0;}
		#backbtn0, #auditbtn{ width:3px; }
		#backbtn0:hover{width:6px; background: var(--h3col);}
		#backbtn0:hover span, #auditbtn span{color:#fff; width:18px; padding-left:1px}
		#forwardbtn0:hover{border-left: 1px solid #1C5D8C; width: 16px; text-align:right;}

		#auditbtn{ position:absolute; left: -5px; top:0; width:5px; background-color: #666; z-index: 0;}
			#auditPanel.on #auditbtn{ width:0; background-color: #EEE;}
				#auditPanel.on #auditbtn span:before { content:'>'; font-weight: 900; margin-left:2px; font-size: 12px;}
				#auditPanel.on #auditbtn svg { display:none; }
			#auditbtn span{left:-17px; top:50%; margin-top:-60px; border-radius: 60px 0 0 60px; background-color: #333; padding:30px 0px; width: 20px;}
				#auditbtn:hover, #auditbtn span:hover{background-color: var(--h3col)!important;}
			.orders.maximised #auditbtn{display: none;}

#alergyinfo select, .smallselect{float:none; margin-right:5px; width:100px; font-size:11px; font-style:bold; border:solid 2px #EEE; padding:2px; color:var(--hcol); min-height:20px;}
#alergyinfo select:hover, .smallselect{ background-position:right -64px!important; }

#overview{transition:all 0.5s; max-height:500px; position:relative;}
#overview .foodphoto, #overview .packphoto{ width:270px; height:270px; margin: 20px 0 -20px; overflow:hidden; border-radius:40px; box-shadow:0 1px 35px #E5E5E5; border:solid 8px #FFF; }
#calbox{  position:absolute; right:0; top:110px; right:203px; width:95px; text-align:center; color:#555; line-height:150%;}
	#calbox strong{font-size:30px; letter-spacing:-3px; display:block; }
#piewrapper{position: relative;}
#piechart{padding: 3px 0; vertical-align: top; width:180px; margin-top: 20px; position:absolute; right:170px}
#pievals{margin:70px 40px 0 15px; font-size: 14px; line-height: 160%; float:right; width: 100px; z-index: 1; position: relative;}
.packCreator #pievals{margin-right:-10px;width:150px;}
	#pievals p{margin:0}
	.col-carbohydrate,.col-sugars{ color:#0089bf;}
	.col-protein{ color:#444444;}
	.col-alcohol{ color:#990000;}
	.col-water{ color:#a7b6c1;}
	.col-fat, .col-satfat{ color:color-mix(in srgb, #ff6600, #FFF 20%);}
	.col-satfat, .col-sugars{display:none;}
	#pievals .greyback{ padding:1px 0 1px 10px; width:100%; margin:0 -12px 5px; border-radius:20px; font-weight:bold}

#labelWizard{padding-bottom:0;}
	#labelWizard .bluehead { line-height:15px;}
	#labelWizard .largeText{padding-left:97px;}
	#labelWizard .largeText span input{display:inline-block;}
	#labelWizard #closeWizard{display:none;}
	#labelWizard .backbtn{position:absolute; z-index:2; top:90px; left:0;display:none;}
	.foodCreator.startscreen #labelWizard{top: 82px;}
	.startscreen #labelWizard .backbtn{display:block;}
	#labelWizard .lnutName{display: block;}
	.startscreen #labelWizard #foodContent:not(.showLabel) .lnutName {display: inline-block; width: 110px; margin-right: 20px;}/*SEP22 42869 set width to 110px and display to inline block to put two label in a row*/
	.startscreen #labelWizard #foodContent:not(.showLabel) .lnutName.multi {width: unset;}
	.startscreen #labelWizard #foodContent:not(.showLabel) .unit.multi {width: 34px;display: inline-block;}
	#labelWizard #alcohol,#labelWizard #alcohol-abv{display: inline-block;}
	#selectLabel { width:80px; line-height:36px; margin:-10px 10px; }
		.startscreen #selectLabel { left:235px; top:42px;}
		#selectLabel .selected{ padding-left:10px; }
		.Foods #selectLabel .selected{ margin-top: -15px;}
		#labelWizard #selectLabel{ width:85px;  border:solid 2px #EEE; margin-left:-10px; font-weight:bold; color:#888; transition: all 300ms}
		#settings_prefs #selectLabel{ width:210px;  border:solid 2px #EEE; margin-left:0px; font-weight:bold; color:#888; transition: all 300ms; top:28px;}
		#labelWizard #selectLabel .selectdrop div, #settings_prefs #selectLabel .selectdrop div{padding:3px 5px 3px 10px;}
		#labelWizard #selectLabel.hov .selected, #selectLabel.hov .selected::after,#settings_prefs #selectLabel.hov .selected{ color:var(--h3col) }
		#labelWizard #selectLabel~p.form #isLiquid{width: 50px;margin-left:-50px;}
		.foodCreator  #labelWizard .largeText{margin-top: -16px;}
	#selectLabel .flag,.select.lblFormatDrop .flag{ margin-right:4px; margin-top:-3px;}
	#selectLabel .selected::after,.select.lblFormatDrop .selected::after,#labelWizard #selectLabel .selected::after,.select.lblFormatDrop .selected::after{background:none!important;}
	.select.lblFormatDrop.hov .selected::after{color:var(--hcol);}
	#selectLabel .selectdrop div,.select.lblFormatDrop .selectdrop div{padding-left:10px;}

#isLiquid { width:40px; position:absolute; margin-left:-41px; height:29px; margin-top:4px; max-height:40px; line-height:29px; border:0; display:none; border-radius:0 50px 50px 0; }
.startscreen #isLiquid{display:inline-block;padding:0px}
	.startscreen #labelWrapper{display:none;}
	#labelWrapper{ border-width:0px 1px 0px 1px; margin:0 auto; width:220px; padding:48px; border-style:solid; border-color:#ccc;transition:all 0.5s;}
	.startscreen #toggleNuts{display:table;}
	#helpText{display:none;}
	.startscreen #helpText.on{display:block; position:absolute; top:84px; left:4px; color:#444; font-style:italic; background:#eee; padding:3px 10px; border-radius:10px;}
	#toggleNuts{margin-left:42px; text-transform:uppercase; font-size:10px; font-weight:bold; margin: 0 auto;display: none;}
	#toggleNuts:before{content:'+ show'}
	#toggleNuts.hideNuts{position:absolute;z-index:1;right: 20px;top: 90px;}
	#toggleNuts.hideNuts:before{content:'+ hide'}
	#foodlabel .smartInsert{display:block!important;}
	.startscreen .excl{display:none!important;}

	h3.excl span{font-size:9px!important;}
	.excl:before{  content:'!'; display:inline-block; left:5px; color:#FFF; width:16px; height:16px; text-align:center; border-radius:50%; border:solid 2px #FFF; line-height:17px; top:5px; font-size:12px; background-color:var(--hcol); margin-right:5px; cursor: pointer; pointer-events: auto;}
	.excl.error:before{background: var(--h3col); border: solid 1px var(--h3col);}
	.excl.error:hover:before{background:#f80;}
	.excl.error.incompatible:before{margin: 0; border: none; line-height:16px;pointer-events: initial!important;}

	#view .excl.error:before, #subfolder-view .excl.error:before {position: absolute; top: 1px; left: auto; right: 2px;}
	/*#view.tableView .excl.error:before {left: 280px; top: 4px;}*/
#portions.panelbody.disabled{pointer-events: none;}
#portions.panelbody input{color:var(--hcol);}
	#portions.panelbody.disabled input{background: none;}
#portions.panelbody .subBlock em{ font-size:16px; font-style:normal; width:20px; display:inline-block; box-sizing:border-box; vertical-align:top;padding-left: 3px;}
#portions.panelbody .pBlock { width:368px; height:206px; border-radius:25px; display:inline-block; position:relative; padding:15px; box-sizing:border-box; margin-bottom:10px; font-size:12px!important; vertical-align:top; box-shadow: 0px 1px 20px #EEE; border: solid 3px #F5F5F5; transition: all 250ms; }
#portions.panelbody .pBlock:hover { box-shadow:1px 1px 10px #AAA; border-color: #FFF; }
#portions.panelbody .pBlock__disabled--layer { position: absolute; z-index: 10; top: 0; left: 0; right: 0; bottom: 0; margin: -12px -12px -3px -3px;}

#portions.panelbody .pBlock.simple{ width: 200px; height: 250px;}
	#portions.panelbody .pBlock.simple input{text-align: center; width:75px; font-size: 14px; padding: 0}
		#portions.panelbody .pBlock.simple .pInput{ width: 100%; margin:5px 0 -10px;}
		#portions.panelbody .pBlock.simple .portionImg { left: 10px; }
		#portions.panelbody .pBlock.simple .subBlock span { text-align: center;}
		#portions.panelbody .pBlock.simple .subBlock svg { display: none}
		#portions.panelbody .pBlock.simple .helpbtn{top:14px; right:16px;}

		#portions.panelbody .subBlock .pCosts a.blueline{ padding-bottom: 2px; }
		#portions.panelbody .subBlock .quantity input.disabled{color:rgba(0,0,0,0.7)!important;pointer-events:none;}
		#portions.panelbody .subBlock .serPerPack input.disabled{color:rgba(0,0,0,0.7)!important;pointer-events:none;}
		#portions.panelbody .subBlock .netPackWeight input.disabled{color:rgba(0,0,0,0.7)!important;pointer-events:none;}

#portions.panelbody .pBlock.servBlock span { margin:73px 20px; display:block; font-size:14px; font-weight:bold; text-align:center; color:#555; }
#portions.panelbody .pBlock.servBlock input { width:80px; height:36px; margin:0px 10px; text-align:center; border:solid 2px #EEE; border-radius:50px; }
#portions.panelbody .pBlock .subBlock span{display: block;}
	#portions.panelbody .pBlock .subBlock span,#portions.panelbody .pBlock input{font-weight: bold;}
	#portions.panelbody.disabled .pBlock.editable .subBlock span,#portions.panelbody.disabled .pBlock.editable input{color:var(--hcol) !important; pointer-events: all;cursor: text;}
	#portions.panelbody .pBlock input::placeholder{font-weight: normal;}
	#portions.panelbody .pBlock:nth-child(even) { margin-right:10px; margin-left:-2px; }
	#portions.panelbody .pBlock>input { width:93%; font-size:16px; margin:-4px -6px; border:none; padding:0px 0 0 10px; height: unset; }
	#portions .portionUserBtn{ position: absolute; top: 10px; right: 10px;left:unset;}
	#portions .portionUserBtn.ai{ right: 35px; }

	#portions.panelbody .pBlock .delbtn{position:absolute; top:-9px; right:-10px; transition:all 300ms; transform:scale(0); pointer-events:none; background: #FFF;}
	#portions.panelbody .pBlock:hover .delbtn{transform:scale(1.2); pointer-events:all;}

	#portions.panelbody .pBlock .helpbtn { position:absolute; top:18px; right:20px; }
		#portions.panelbody .pBlock .helpbtn span{position: inherit;}
	/* #portions.panelbody .pBlock .toggleWrap{position:absolute; padding:15px 15px 0px 15px; bottom:-1px; left:34px; transition: opacity 100ms 250ms;z-index: 2;} */
		#portions.panelbody .subBlock{position:relative;width:166px; /* border: 1px solid; */ height:168px; display:inline-block;float:left;vertical-align: top;box-sizing:border-box;}
		#portions.panelbody .subBlock:last-child{padding-top: 9px;height: auto !important;}
		#portions.panelbody .subBlock input{width:145px; border:none; padding: 3.5px 5px; font-size: 12px;text-align: left;}

		/*//#33292->JUL22*/
		#portions.panelbody .subBlock .disabled input { background:#FFF; color:#AAA!important; }
		#portions.panelbody .subBlock .showicon .lockicon, #portions.panelbody .subBlock .showicon .unlockicon{display:none;}
		#portions.panelbody .subBlock .portionLock:hover~.showicon, #portions.panelbody .subBlock .quantityLock:hover~.showicon, #portions.panelbody .subBlock .showicon:hover{display:inline-block!important;}

		#portions.panelbody .qtyServWidth:hover .quantityLock input:last-child{width:71px;}
		#portions.panelbody .qtyServWidth:hover .portionLock input{width:125px;}

		#portions.panelbody .subBlock .showicon { display:none; position:absolute; right:3px; border:2px solid #DDD; width:10px; height:27px; border-radius:0px 20px 20px 0px; top:60px; border-left:0px; }
			#portions.panelbody .subBlock .showicon svg{ margin-top:-3px;}
			#portions.panelbody .subBlock .showicon em { background:#FFF; border-radius:50px; margin:2px 1px; line-height:20px; text-align:center; padding: 0; transition:all 200ms }
			#portions.panelbody .subBlock .showicon em.on { display:inline-block!important; }
			#portions.panelbody .subBlock .showicon:hover em{ background:var(--h3col)!important; color: #FFF!important; transform:scale(1.2)}

		#portions.panelbody .portionImg { width:150px; height:150px; top:9px; position:absolute; left:0; border-radius:20px; transition:all 300ms 250ms; background:url(/media/back-apple.png) center no-repeat #EEE; background-size:100%; border:1px solid #EEE; z-index:1; overflow:hidden; }
			#portions.panelbody .portionImg iframe{opacity: 0; transition: opacity 300ms 250ms; }
		#portions.panelbody .portionImg.on iframe{opacity: 1;}
		#portions.panelbody .portionImg:hover+div{opacity: 0;pointer-events: none;}
	#portions.panelbody .portionImg:not(.preview):hover { z-index:1; box-shadow:0px 1px 20px #555; width:230px; height:230px; margin:-25px; top:0; border:solid 5px #FFF; border-radius:30px; }
		#portions.panelbody .portionphoto{width: 100%;height: 100%;}
		#portions.panelbody.disabled .portionphoto{background-repeat:no-repeat; background-size:cover;}

	#portions.panelbody .quantity.empty.uwStyle input{width: 73px!important}
	#portions.panelbody .quantity.empty.uwStyle .calInput{width:68px!Important; padding-left:5px;}
	#portions.panelbody .quantity.empty input{width: 62px!important}
		#portions.panelbody .quantity.empty:not(svg){color:#DDD;}
		#portions.panelbody .quantity input{width:50px;}
		#portions.panelbody .quantity .calInput{width:90px;padding-left: 12px;}
		#portions.panelbody .salePrice input{display:inline-block!important; width: 35%!important; padding-right:0; vertical-align: top; }
		#portions.panelbody .salePrice input:placeholder-shown{width: 55%!important;}
		#portions.panelbody .salePrice .vatdetail{width: 52%!important;color: #BDBDBD;display:inline-block !important;line-height: 180%;font-size: 12px;}
		#portions.panelbody .salePrice .vatdetail.small input{font-size: 12px;width:30%;}
		#portions.panelbody .salePrice input:placeholder-shown + .vatdetail{display:none !important;}

	#portions.panelbody .pCodeInput{font-size:15px!important; padding-right: 15px!important;}
		#portions.panelbody .pCodeInput::placeholder{font-size: 12px; font-weight: normal;}
	#portions.panelbody .portionCode:hover .pReload,#portions.panelbody .portionBarcode:hover .pReload{transform: scale(1); pointer-events: all;}
	#portions.panelbody .pReload{font-size:18px; cursor:pointer; color:var(--hcol); position:absolute; right:0px;pointer-events: none;transform: scale(0); transition: transform 300ms}
		#portions.panelbody .pReload:hover{color:var(--h2col);}
		#portions.panelbody .pReload.disabled{pointer-events: none !important;color:grey;}
	#portions.panelbody .pCosts input{cursor: auto; pointer-events: none; color:#444;}
		#portions.panelbody .pCosts span{display: inline-block!important}
		#portions.panelbody .pCosts a{margin-left: 5px;}
		#portions.panelbody .pCosts a:after{content:'\002197'; display: inline-block;}
/* 	#portions.panelbody .toggle.on:after,#portions.panelbody .toggle:hover:after,#portions.panelbody .pBlock:hover .toggle:after{border-color: var(--hcol);}

	#portions.panelbody .toggle.on,#portions.panelbody .toggle:hover,#portions.panelbody .pBlock:hover .toggle{background: var(--hcol);color: #FFF;box-shadow: 1px 1px 3px rgba(0,0,0,0.2) inset;}
	#portions.panelbody .toggle{transition: none;} */

	#portions.panelbody .subBlock svg{height: 20px !important;}
	#portions.panelbody .addbtn { display:inline-block; width:70px; text-align:center; color:#444; font-size:10px; font-weight:bold; text-transform:uppercase; white-space:nowrap; margin-left:18px; cursor: pointer;vertical-align: top; pointer-events: all}
	#portions.panelbody .addbtn.disabled{pointer-events: all !important; background: none;}
	#portions.panelbody .addbtn.middle{margin-top: 60px;}
		#portions.panelbody .addbtn b{display:block; background:#EEE; border-radius:50%; width:50px; height:50px; line-height:50px; margin:0 auto 5px; cursor: pointer;}
		#portions.panelbody .addbtn:hover{color:var(--hcol); cursor:pointer;}
		#portions .editable .delbtn{display: block!important;}
#portionInfo{position: relative; margin: -20px -35px -25px;}
	.pLeft{/* background-image:attr(data-image url) ; */ width:220px; height:220px; display:inline-block; border-radius:10px;background-repeat:no-repeat; background-size:contain;background-color: #EEE; margin-bottom: 12px;}
		.pLeft .src{background-color:rgba(0,0,0,0.30); color:#fff; font-size:9px; font-weight:bold; border-radius:0px 20px 20px 0px; padding:0px 10px; display:inline-block; margin-top:15px; height:20px; line-height:20px;}
			.pLeft .src .flag{margin-top:-1px;margin-left: 3px;}
	.pRight{display:inline-block; width:330px; padding-left:20px; box-sizing:border-box; vertical-align:top;}
		.pRight p { line-height:inherit!important; padding: 10px 0px 0px;}
		.pRight h2 { margin:0px 0px 10px 0px; }
			.pRight1 { display: inline-block;width:50%; font-weight: bold; }
				.pRight1 > span { display:block; height:21px; }
				.pRight1 span.portionCode {height: auto;}
				.pRight1 em { width:20px; font-size:16px; text-align:center; display:inline-block; font-style:normal; vertical-align:revert;}
				.pRight1 svg,.pRight1 em{margin-right: 5px;}
				.pRight2{width:49%; display:inline-block; vertical-align:top; overflow-y:auto;  height:145px;  overflow-x:hidden; text-align:center;}
				#popupcontent .pRight2 h5 { margin:0 0 5px!important; text-transform:uppercase; font-weight:bold; font-size:9px; border-radius:20px; display:inline-block; min-width:101px; line-height:15px!important; padding:0px 5px; height:auto; }
				.extraInfo .supInfo { width:75%; overflow:hidden; white-space:nowrap; box-sizing:border-box; text-overflow:ellipsis;vertical-align: top; display:inline-block; margin: 10px 5px;}
			   .extraInfo span:last-child { position:absolute; right:0; display:inline-block; bottom: 10px;}

	#costPanel .pName{display:inline-block;text-overflow:ellipsis;width: 155px;white-space:nowrap;overflow:hidden;height:16px;}
	#pCostPanel h5{position: relative;}
	#pCostPanel .starbtn{ margin: -3px 35px 0 -90px; }
	#pCostTempl{}
		#pCostTempl #exportPrefsContent{display: none; }
		#pCostTempl #templateContent div p{line-height: 35px;}
		#pCostTempl #templateContent h2 {font-size:16px;}
		#pCostPanel #templateContent{position: static; min-height: 200px;}
		#pCostPanel #templateContent div span{bottom: 0;}

	#popupcontent .portionphoto iframe { width:100%; height:100%; }
	#portionsPanel{position:absolute; height:100%; border-radius: 30px 0 0 30px; left:0; top:0; width:200px; overflow-y:auto; overflow-x:hidden;}
			#portionsPanel .cPortion{width:180px; height:180px; border-radius: 20px; margin-bottom: 5px; display:inline-block; position: relative}
				#portionsPanel .cPortion *{cursor: pointer;}
				#portionsPanel .cPortion:not(.on):not(:hover) { filter:grayscale(100%); }
				#portionsPanel .cPortion div { height:120px; aspect-ratio: 1 / 1; border-radius:20px; margin:20px auto 0; background:url(https://www.nutritics.com/media/back-apple.png) center no-repeat; background-size:100%; transition: background 300ms;}
					#portionsPanel .cPortion:hover div, #portionsPanel .cPortion.on div { background-size:110%; }
					#portionsPanel .cPortion.on div:after { content:''; position:absolute; right:-3px; top:47%; border:7px solid transparent; border-left-color:var(--hcol); border-left-width: 6px;}
				#portionsPanel .cPortion .pillbtn{ margin-top: -15px; }
					#portionsPanel .cPortion .pillbtn svg{ margin: 2px 3px 0 -7px;}
				#portionsPanel .cPortion span.blue{display:block; text-align:center; padding:0px 15px; margin-top: 5px;}

		#pCostPanel { margin:0 0 -20px 200px; height: 500px !important;}
			#pCostPanel h5 .helpbtn { top: 15px; right: 20px; }
			#pCostPanel h5 .helpbtn b{ color:var(--h3col); }
		#additionalCost{width:100%}
			#additionalCost .header span{display: inline-block; float: none; margin-left: 5px;position: relative;}
			#additionalCost .header span:empty{display: none !important;}

			#additionalCost tr.on td strong:before{transform: rotate(90deg);}
			#additionalCost .td-name { width:240px; }
				/* #additionalCost .td-name .shippingName {width:120px;display:inline;} */
				#additionalCost .rateKm {color:#999;display: block;}
			#additionalCost .percentage .td-name input{pointer-events:none; color:#444;}
		#additionalCost tfoot { position: relative;}
		#additionalCost tfoot:before, #additionalCost tfoot:after{ content: '';width: 50px; position: absolute;top:0;bottom: 0;background-color: #EEE;}
		#additionalCost tfoot:before{left:-50px}
		#additionalCost tfoot:after{right: -50px; border-radius: 0 0 15px;}
		#additionalCost tfoot td, #additionalCost tfoot tr:hover td{background-color: #EEE!important; padding-bottom: 30px !important;}
		#additionalCost tfoot tr td span{color:#AAA;}
		#additionalCost tfoot tr td{border-radius: initial!important;}
		#additionalCost tfoot tr:nth-child(1) td {padding: 12px 0px!important; border-bottom:1px solid #CCC!important;}
		#additionalCost tfoot tr td input{border: 1px solid #CCC;}

	/* #additionalCost{width:100%;margin-top:-20px;}
		#additionalCost td{position:relative;}
		#additionalCost input { height:45px; border:0;  }
		#additionalCost td:not(.td-name) input{font-weight: bold; text-align:center;}
		#additionalCost tr:not(.header) td{position:relative; padding:0; height:50px}
		#additionalCost .td-cost,.td-rate,.td-perc,.td-mins{width:100px;}
		#additionalCost .td-del{width: 50px;}
		#additionalCost span { position:absolute; text-transform:uppercase; font-size:10px; font-weight:bold; width:100%; text-align:center; color:#444; }
		#additionalCost .percentage .td-cost span{display:none;}
		#additionalCost .delbtn{margin-right:12px;}
		#additionalCost .greybtn{ position:absolute; right:15px; top:1px; border-radius:50px; padding:6px 20px!important; }
		#additionalCost .td-perc span{font-size:16px; color:#aaa; width:20px; right:20px; top:17px;}
		#additionalCost .td-perc input{ width:68px; text-align:right!important; font-size:16px;}
		#additionalCost .percentage .td-cost{pointer-events: none;color:#AAA;}
		#additionalCost .percentage .td-name input{pointer-events: none;color:#444;}
		#additionalCost .percentage .td-cost input,#additionalCost .rate .td-cost input{pointer-events: none;color:#aaa;}
		#additionalCost #costInfo input { pointer-events:none!important; color:#aaa; font-style:italic; }
		#additionalCost #costInfo td:first-child input { text-align:left; padding-left:55px; font-weight:bold; }
		#additionalCost #costInfo td{border-top:0;}
		#additionalCost #costInfo .portionphoto{ position:absolute;width:50px; height:53px; background-size:contain; display:inline-block; background-repeat:no-repeat; top:0px; }
		#additionalCost tr.greyback td:first-child { padding-left:10px; } */



	/* .autoscale #popupcontent .portionphoto{ height:210px; top:15px; left:0px;}
	.autoscale #popupcontent .portionphoto iframe{ width:210px; height:210px; } */

	#pHead .excl span,#pHead .tgPanel.off .excl{display:none;}
	#pHead .excl{ position:absolute; right:3px; top:9px; }
	#pHead .td-food input:not(.pBarcode){padding-right:55px;}


	#foodlabel td:first-child h3 span{ color: var(--h3col); border-bottom: dotted 1px var(--h3col); cursor: pointer;}
	#foodlabel td:first-child h3:hover span {color:#f80; border-color:#f80;}
	/*#foodlabel td *{pointer-events:none;}*/
.foodCreator table#foodMeta {width:100%; max-width:none; min-width:100%; border-bottom: solid 1px #CCC;}
#foodMeta td, table#foodlabel #foodMeta td:hover{background:inherit;}
#foodMeta td.td-food{min-width:inherit; max-width:inherit;}
#foodMeta .disabled{pointer-events:none!important; background:#999;}
#foodMeta #btnTAQUID{width:100%;}
#quidBlock,.quidBlock{position: relative;}
	#quidBlock p{margin-bottom:5px; padding:5px 0px; font-style:italic; margin-top:-15px;}
	#scanAllergenBtn{ position:absolute; left:35px; top:68px; z-index:2; }
	#lbl-isWholeFood { width:158px; top:69px; position:absolute; right:4px; z-index:1; border-radius:50px; padding:2px 4px; }
.scanAllergenPop .delbtn{display:none;}
.closeQuid{position:absolute; right:10px;top:10px;}
	.customQuid h5 div{height: 62px;text-align: center;vertical-align: middle; line-height: 62px;}
	.customQuid h5 .emptyQuid{line-height: 55px!important; display:block;}
	.customQuid h5 p{font-style: inherit!important;margin: -19px 0!important;padding: inherit!important;}
#quidBlock .nicEdit-main * {width: auto !important;}

.foodCreator #foodMeta .bluebtn{  line-height: 140%; width:110px;  padding: 7px 18px;}
table#foodlabel #foodMeta td input, table#foodlabel #foodMeta td select{width:100%; border-bottom:solid 1px #CCC; text-align:left;}
table#foodlabel #foodMeta .td-quantity{ width:200px;}

table#foodlabel tr:first-child td:not(.td-ri){ text-align:center; }
table#foodlabel tr:first-child .td-ri{ text-align:left; padding-left:10px; }

td.unitval { white-space: nowrap; position: relative; width: 70px;}
table#foodlabel td.unitval{width:91px;}
.form .unitval input,#foodContent.showLabel input{ padding-right: 25px; display: inline-block; width:91px!important; text-align: right; font-weight: bold; padding:5px 26px 5px 8px; font-size:18px; float:none; border-radius: 50px 0 0 50px; border:0}
.form .unitval span { position: absolute; top: 7.5px; right:1px; width:24px; font-size: 10px; font-weight: bold; display: block; pointer-events:none;}
.unitperc { display: inline-block; background: #EEE; line-height:31px; font-weight: bold; border:0; border-radius: 0 20px 20px 0; width:35px; margin-top: 2px; border-left: 0; padding: 0 10px 0 0; text-align:right; margin-right:15px;}

.recReform { border:3px solid #7A7A7A; border-radius:50%; margin-left:-9px; margin-top:6px; position:absolute; width:25px; height:25px; cursor:pointer; text-align:center; transition:all 200ms, border 200ms; background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='9.3px' height='15px' viewBox='0 0 9.3 15' xml:space='preserve'%3E%3Cstyle type='text/css'%3E.st0%7Bfill:%230089bf;%7D%3C/style%3E%3Cg%3E%3Cpolygon class='st0' points='2.7,14 3.7,14 3.7,15 5.7,15 5.7,14 6.7,14 6.7,12 2.7,12 '/%3E%3Cpath class='st0' d='M0.2,3.3c-0.8,2.5,0.5,4.9,2.4,5.9V11h4V9.2c1.6-0.8,2.7-2.4,2.7-4.4c0-3.2-3-5.6-6.2-4.6C1.7,0.7,0.7,1.9,0.2,3.3z'/%3E%3C/g%3E%3C/svg%3E"); background-position:center; background-repeat:no-repeat; -webkit-filter: grayscale(100%) brightness(180%); filter: grayscale(100%) brightness(180%);}
	.recReform:hover{border-color:var(--hcol); -webkit-filter: none; filter: none;}
	.recReform.on{border-color:#DDD; background-color: var(--h2col); -webkit-filter: none; filter: none; background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='9.3px' height='15px' viewBox='0 0 9.3 15' xml:space='preserve'%3E%3Cstyle type='text/css'%3E.st0%7Bfill:%23FFFFFF;%7D%3C/style%3E%3Cg%3E%3Cpolygon class='st0' points='2.7,14 3.7,14 3.7,15 5.7,15 5.7,14 6.7,14 6.7,12 2.7,12 '/%3E%3Cpath class='st0' d='M0.2,3.3c-0.8,2.5,0.5,4.9,2.4,5.9V11h4V9.2c1.6-0.8,2.7-2.4,2.7-4.4c0-3.2-3-5.6-6.2-4.6C1.7,0.7,0.7,1.9,0.2,3.3z'/%3E%3C/g%3E%3C/svg%3E");}


		#applyReformulationPanel { position:fixed; left:265px; width:740px; bottom:-150px; padding:15px 30px; text-align:center; transition:bottom 400ms; background-color:#ffffff; color:#ffffff; z-index:7; font-size:13px; font-weight:bold; line-height:15px; border:solid 4px var(--h3col); box-shadow:1px 0px 10px rgba(0,0,0,0.4); box-sizing:border-box; }
		#applyReformulationPanel.on{ bottom:10px; }
		#applyReformulationPanel p { background:var(--h3col); position:absolute; margin:-30px 190px; padding:3px 30px; border-radius:50px; }
		#applyReformulationPanel:before {  position:absolute; width:46px; height:46px; line-height:46px; background:color-mix(in srgb, var(--h3col), #FFF 20%); border-radius:50%; border:solid 2px #FFF; text-align:center; font-size:30px; box-shadow:1px 1px 7px rgba(0,0,0,0.7); left:-25px; animation:swell 5s infinite; -moz-animation:swell 5s infinite; -webkit-animation:swell 1s infinite; -o-animation:swell 5s infinite; top:50%; margin-top:-25px; }
		#applyReformulationPanel .largebtn { margin-right:3px; font-size:10px; border:0; }

		.highlightPrev{  position:absolute; text-align:center; font-size:14px; font-weight:bold; letter-spacing:-1px; width:110px; margin:-7px 30px; z-index:1; border:solid 3px var(--h3col); color:var(--h3col); border-radius:50%; width:44px; height:44px; line-height:44px; margin-right:5px; background:#FFF;}
			.highlightPrev:after { content:''; border-style:solid; border-width:7.5px 0 7.5px 6px; border-color:transparent transparent transparent var(--hcol); left:-9px; position:absolute; top:15px; }
			.highlightPrev:before { content:''; animation:blink 1s infinite; width:45px; height:45px; border:solid 3px var(--hcol); left:-58px; position:absolute; border-radius:50%; margin-top:-4px; }
			 #hppc{ transform: rotate(-90deg);  margin: -66px 11px;}
			 #hppc span{transform: rotate(90deg); display: block;}

#optimiseNuts{ width:500px; position:absolute; top:11px; left:18px; border-top: 3px solid var(--hcol); -webkit-box-shadow: 1px 4px 23px -2px #777777; box-shadow: 1px 4px 23px -2px #777777; background:#fff; display:none; z-index:2;border-radius:3px 3px 15px 15px;}
	#optimiseNuts:after{ content:''; position:absolute; border-style:solid; display:block; width:0; top: -10px; right:64px; bottom:auto; left:auto; border-width:0 6px 8px 6px; border-color:transparent transparent var(--h2col) transparent;z-index:2; }
	#optimiseNuts.portionLabel:after{right:216px;}
	#optimiseNuts.on{display:block;}
	#optimiseNuts h2{margin: 25px 0px 15px 20px; }
	#optimiseNuts ol{width:100%; font-size:13px; table-layout: fixed; border-top:solid 2px rgba(0,0,0,0.05);}
	#optimiseNuts li{border:solid 1px rgba(0,0,0,0.05); border-left:0; border-right:0; white-space:normal; padding:15px; padding-left:50px; display:block; counter-increment: count-me;}
	#optimiseNuts li::before{content:counter(count-me) ". "; color:var(--hcol); font-weight:bold; position:absolute; margin-left:-30px;}
	#optimiseNuts li:hover{background:#EEE!important;}
	#optimiseNuts ul li{ padding: 4px 20px; font-size: 12px;}
	#optimiseNuts ul li::before{ content: ''; }

#optimiseNuts em{font-weight:bold; color:#666;}
#optimiseNuts table td:first-child{width:35px; font-weight:bold; padding-left:23px; color:var(--hcol)}
#optimiseNuts .optimise{padding: 7px 3px; display: block; cursor:pointer; display:none;}
#optimiseNuts .circle{ text-align:center; border-radius:50%; width:50px!important; height:50px!important; line-height:50px; font-weight:bold; margin: -10px 10px 0 0; border:solid 1px rgba(0,0,0,0.08)}

#optimiseNuts .circle span { opacity:0; position:absolute; padding:10px 20px 10px 50px; height:28px; white-space:normal; line-height:120%; border:solid 1px #FFF; box-shadow:1px 0 5px rgba(0,0,0,0.5); overflow:visible; border-radius:0 50px 50px 0; top:-50px; left:165px; text-align: left; z-index:3; pointer-events:none; transition:opacity 300ms; }
	#optimiseNuts .circle:hover{ box-shadow:0 0 5px rgba(0,0,0,0.5); }
	#optimiseNuts .circle:hover span{opacity:1;}
	#optimiseNuts .circle span b{content:''; width:60px; height:60px; background:#FFF; border-radius:50px; margin:-15px -75px; display:block; position:absolute; font-size:17px; letter-spacing:-1px; line-height:60px;box-shadow:1px 0 5px rgba(0,0,0,0.5); animation:swell 1s infinite; text-align: center;}
	#optimiseNuts .circle.serving span{margin-left:150px; }
#optimiseNuts h3{  font-weight:normal; font-size:14px; text-transform:inherit; color:var(--h2col); padding:0px 20px 10px 20px; }


/* REPLACE INGREDIENT POPUP */
	#wrapperReplaceIng.aiSearch #recipeList{display: none;}
	#wrapperReplaceIng.aiSearch #searchIngResult{width: 100%;}
	#wrapperReplaceIng .topLeftBox, #wrapperReplaceIng .bottomLeftBox {width: 399px;}
	#wrapperReplaceIng .topRightBox, #wrapperReplaceIng .bottomRightBox {width: 480px;}
	#wrapperReplaceIng .box{display:inline-block; border: 0px solid #EEE; box-sizing: border-box; padding: 5px 10px;}
	#wrapperReplaceIng .bottomBox{border-bottom-width: 2px; height: 300px; vertical-align: top; overflow-y: auto;}
	#wrapperReplaceIng .topLeftBox{border-right-width: 1px; border-bottom-width: 1px; padding-left: 25px}
	#wrapperReplaceIng .topLeftBox p:before, #wrapperReplaceIng .topLeftBox p:after, #recipeList:before, #readOnlyRecipesList:before{ content:'REPLACE:'; font-weight:bold; background:var(--hcol); margin-right:10px; font-size:10px; color:#FFF; display:inline-block; line-height:16px; padding:0 10px; margin-left:-25px; border-radius:0 50px 50px 0; vertical-align:top; margin-top:10px; }
	#wrapperReplaceIng .topLeftBox p:after{content:'WITH:'; float: right; margin-right: -12px; border-radius: 50px 0 0 50px;}
	#recipeList:before{content:'IN YOUR RECIPES:'; margin-left: -68px}
	#recipeList input[type=checkbox]+label{ font-size:12px; line-height: 24px;}
	#readOnlyRecipesList:before{content:attr(data-count)' Cannot be swapped:'; margin-left: -68px; text-transform: uppercase;}
		#readOnlyRecipesList p {font-size: 12px;line-height: 24px; padding: 2px 0; vertical-align: middle; pointer-events: all; user-select: text;}
	#wrapperReplaceIng .topRightBox{border-left-width: 1px; border-bottom-width: 1px; position: relative; }
	#wrapperReplaceIng .topRightBox.replaceReview {border-left: 3px solid var(--hcol) !important;}
	#wrapperReplaceIng .bottomLeftBox{border-right-width: 1px; border-top-width: 1px; padding:15px 15px 15px 68px;}
	#wrapperReplaceIng .bottomRightBox{border-left-width: 1px; border-top-width: 1px;}
	#wrapperReplaceIng .searchIngredients{margin: 0; height: 35px; border: 0px; padding-left: 30px; position: relative;}
	#wrapperReplaceIng .searchIngredients::placeholder{font-size: 10px; font-weight: bold;}
	#wrapperReplaceIng .searchIngredients + .blueline {position: absolute; top: 16px; right: 0;}
	#wrapperReplaceIng #searchIngResult img {margin:40px auto; display:block;}
		#searchIngResult .emptyList span{display:block}
	#wrapperReplaceIng label.small { font-size:10px; width:100px; margin-top:10px; }
	#wrapperReplaceIng .topRightBox:not([class*="replaceReview"])::before{ display: inline-block; background: url(/media/svg/icons/frag#search) transparent no-repeat left center; content: ""; opacity: 0.4; width: 21px; height: 21px; position: absolute; z-index: 1; padding: 7px; background-position: 1px; }
	#wrapperReplaceIng .topRightBox.replaceReview span { margin:8px; }
	#wrapperReplaceIng .topRightBox.replaceReview p { display: inline; }
	#wrapperReplaceIng .wrapperTable { min-height: 300px; border-bottom: 1px solid #DDD; position: relative; }
	#wrapperReplaceIng .wrapperTable .centerBorder { border-right: 3px solid var(--hcol); position: absolute; height: 100%; left: 399.5px; }
	#wrapperReplaceIng .tblReviewReplace { width: 97%; min-height: 80px; }
	#wrapperReplaceIng .tblReviewReplace td:first-child { width: 400px; border-right:none; }
	#wrapperReplaceIng .tblReviewReplace td:last-child { width:490px; line-height:35px; border-left:none; overflow:visible; border:0; }
	#wrapperReplaceIng .tblReviewReplace .quantity {border: solid 2px #EEE; padding:10px;border-radius: 50px;font-weight: bold;font-size: 12px; width: 70px;margin: 7px 25px 0 0;}
	#wrapperReplaceIng .tblReviewReplace .triangle-right {width: 0;height: 0;border-top: 5px solid transparent;border-left: 8px solid var(--hcol);border-bottom: 5px solid transparent; float: left; margin-top:20px; margin-left: -2px;}
	#wrapperReplaceIng .tblReviewReplace td { width: 50%; }
	#wrapperReplaceIng .tblReviewReplace .qtyWrapper { width: 105px; }
	#wrapperReplaceIng .tblReviewReplace .qtyWrapper > .helpbtn { top: 23px; }
	#wrapperReplaceIng .tblReviewReplace .qtyWrapper > .helpbtn .btn { color: white !important; }
	#wrapperReplaceIng .tblReviewReplace .ficonR { background: #ccc; position: inherit; margin: 10px 5px 0 10px; display: block; }
	#wrapperReplaceIng .tblReviewReplace .fID { color: var(--hcol); margin-right: 20px; }
	#wrapperReplaceIng .tblReviewReplace .fID:after, .preview:after {content: '\002197'; display: inline-block; }
	#wrapperReplaceIng .tblReviewReplace .allergenPlus { position: relative; margin-left:12px; }
		#wrapperReplaceIng .tblReviewReplace .allergenPlus:before { content: "+"; color: var(--h3col); font-size: 16px; font-weight: bold; position: absolute; top: 12px; left: -10px; }
		#wrapperReplaceIng .tblReviewReplace .allergenMinus:before { content: "-"; color: var(--hcol); font-size: 26px; font-weight: bold; top: 5px; position: relative;}
	#wrapperReplaceIng .tblReviewReplace .medText:not(span) { float: left; max-width: 305px; }
	#wrapperReplaceIng .tblReviewReplace .unavailable {padding: 13px 10px !important;margin:0;display:inline-block;}
	#wrapperReplaceIng .tblReviewReplace .allergenicon { margin:2px 0; }
#wrapperReplaceIng .tblReviewReplace .kCal { margin-left: 20px; position: relative; border:3px solid #DDD; float: right !important; width: 46px; height: 46px; text-align: center; -webkit-border-radius: 40px; -moz-border-radius: 40px; border-radius: 40px; }
	#wrapperReplaceIng .tblReviewReplace .kCal.minus { color: var(--hcol); }
	#wrapperReplaceIng .tblReviewReplace .kCal.minus:before { content: "-"; color: var(--hcol); font-size: 26px; position: absolute; left: -16px; top: 4px; font-weight: bold; }
	#wrapperReplaceIng .tblReviewReplace .kCal.plus { color: var(--h3col); }
	#wrapperReplaceIng .tblReviewReplace .kCal.plus:before { content: "+"; color: var(--h3col); font-size: 16px; position: absolute; left: -15px; top: 10px; font-weight: bold; }
	#wrapperReplaceIng .tblReviewReplace .kCal span { padding-top: 10px; display: block; font-size: 10px; line-height: 9px; }
	#wrapperReplaceIng .tblReviewReplace .kCal span strong { font-size: 18px; letter-spacing: -2px; font-weight: 900; }
	#wrapperReplaceIng .tblReviewReplace .labelBTN { top: 0; right:34px; }
	#wrapperReplaceIng .tblReviewReplace .labelsContainer { display: block;max-height: 0; transition: max-height 400ms; overflow: hidden; display: flex; gap: 15px;}
	#wrapperReplaceIng .tblReviewReplace .labelsContainer #addLabelBtn, #wrapperReplaceIng .tblReviewReplace .labelsContainer .editbtn, #wrapperReplaceIng .tblReviewReplace .labelsContainer .delbtn, #wrapperReplaceIng .tblReviewReplace .labelsContainer .result, #wrapperReplaceIng .tblReviewReplace .labelsContainer .spacer { display: none; }
	#wrapperReplaceIng .tblReviewReplace .labelsContainer .label{ aspect-ratio: 1;}
	.popup .labelPreview iframe {height: 60vh; min-height: 350px; border: 0; border-radius: inherit;}
	.popup .labelPreview iframe #gTranslate {display: none;}

	.wrapperImportFood{display:block; width: calc(100% + 100px); margin: -20px -50px -50px; box-sizing: border-box;}
		.wrapperImportFood .box{display:inline-block; width: 50%; border: 0px solid #EEE; box-sizing: border-box;}
		.wrapperImportFood .topBox{    border-bottom: solid 1px #EEE; vertical-align: top;}
		.wrapperImportFood .bottomBox{border-bottom-width: 2px; height: 250px; vertical-align: top; overflow-y: auto;}
	  .wrapperImportFood .topLeftBox{border-right-width: 1px; vertical-align: top; padding-right: 1px; min-height:40px; padding-top:12px}
		.wrapperImportFood #fromFood::before{content:'FROM:'; float: left; margin-right: 10px; border-radius:0 50px 50px 0; font-weight:bold; background:#1d76bb;font-size:10px; color:#FFF; display:inline-block; line-height:16px; padding:0 10px;}

		/* .wrapperImportFood #fromFood::after{content:'TO:';float: right; margin-right: -2px; border-radius: 50px 0 0 50px;font-weight:bold; background:#1d76bb;font-size:10px; color:#FFF; display:inline-block; line-height:16px; padding:0 10px;} */
		.wrapperImportFood .topRightBox{vertical-align: top; position: relative; padding-left: 10px; padding-top:12px;margin-left: -45px;}
		.wrapperImportFood #toFood::before{content:'TO:'; float: left; margin-right: 10px; border-radius:50px 0 0 50px; font-weight:bold; background:#1d76bb;font-size:10px; color:#FFF; display:inline-block; line-height:16px; padding:0 10px;}
		.wrapperImportFood .bottomRightBox, .wrapperImportFood .bottomLeftBox{padding:10px 15px 15px 35px;}
		.wrapperImportFood #selectAllPortion::before{content:'PORTIONS:'; float: right; margin-right: -2px; border-radius: 50px 0 0 50px;font-weight:bold; background:#1d76bb;font-size:10px; color:#FFF; display:inline-block; line-height:16px; padding:0 10px;}
		.wrapperImportFood .bthDiv {float: right;padding: 10px;height: 0px;}
		.wrapperImportFood .checkboxDiv {padding: 10px;text-align: right;height: 0px;float:right;}

/*food start screen:*/
.startscreen h5, .startscreen .panelbody, .startscreen #weightbox, #skipFoodWizard,.startscreen #notesPanel{display:none;}
.startscreen #labelWizard { background: #EEE; display:block!important; position:absolute; border-radius:3px; opacity:1!important; pointer-events:all; /* left:30%; */ top:42px; }

.startscreen #labelWizard .largeText{ position: relative; padding: 40px 0px 40px 318px;border-bottom: 2px dotted rgb(238, 238, 238);margin: -20px -10px 10px;background: rgb(255, 255, 255) !important;}
.startscreen #labelWizard.otherSources .largeText{padding: 40px 0px 40px 273px;}
.otherSources #labelHead{display:none;}

.startscreen .largebtn{ padding: 15px 21px;}
.startscreen #labelWizard:before{content:"To get started, enter nutrient values from a food label \25BA"; font-size:20pt; color:#999; display:none; position:absolute; left:50px; width:340px; padding-right:30px; height:302px; padding-top:160px; line-height:130%; text-align:center; font-style:italic;}
.startscreen #skipFoodWizard{ display:inline-block; position:absolute; left:330px;}
.startscreen td{background:transparent!important;}
.startscreen .form input{border-color:#DDD;}
.startscreen .unitperc,.startscreen .td-ri{display:none;}
.startscreen #labelWizard #closeWizard{display:block;position: absolute;right: 20px; top: 10px;}

/*//////////////////////////////////////// RECIPE CREATOR: ////////////////////////////////////////*/
.recipeCreator, .foodCreator{ width: 804px; padding: 0 20px; }
#recTable { width: 100%; margin-top:10px; }
.foodCreator .options input#name, .recipeCreator .options input#name{width:220px;}
.foodCreator.startscreen .options{height:unset;padding: 0 18px;/* overflow-y: hidden*/;max-height: 40px; transition: max-height 500ms;}
.foodCreator.startscreen .options:has(#name[value='']) .optionsnest {display: none;}
.foodCreator.startscreen .options:not(:has(#name[value=''])){max-height:80px;/* overflow-y: visible;*/}
.foodCreator.startscreen .options .optionsnest{display:flex; align-items:center; gap:1rem;}
.foodCreator.startscreen .options .optionsnest input{min-width: 200px;}
.foodCreator:not(.startscreen) .options input#shortname {display: none;}
.foodCreator #unavailable, .recipeCreator #unavailable{text-align:center;}
.foodCreator #unavailable span, .recipeCreator #unavailable span{position: absolute; top: 51px; left: 11px; font-size: 16px;}
.recipeCreator td.td-food,.foodCreator td.td-food {padding:0}
.recipeCreator #exportPrefsSub.submenu.mini.sel{max-height: 515px;}
.recipeCreator tr .td-quantity a.blueline{display:inline-block; margin-top:10px;}
.td-food input{margin:0;padding:10px;border: 0;background:transparent;font-size: 13px;border: solid 1px transparent; border-left:0; border-right:0; pointer-events: all!important;font-weight:bold; color:#555;}
.td-food h3~input{width: 90%;}
.recipeCreator a.clearportion{margin-left:52px;}
.recipeCreator td.td-food a.clearportion.hoverShow:not(.hidden){display:block !important;margin-left:0px;right:30px;bottom:10px;}
.recipeCreator td.td-food a.clearportion.hoverShow:not(.expandView){top:10px;}
#ingredientBody .td-food:not(.expandView){height:auto}
.recipeCreator .notesdiv{min-height:inherit; padding-bottom:15px;}
.recipeCreator .notesdiv .tabmenu{background:#FFF;margin-left: 15px;}
.recipeCreator .notesdiv .tabmenu a.on{background:#EEE !important;color: var(--hcol) !important;display:inline-block !important}
.recipeCreator .notesdiv .tabmenu a{color:#666;}
.recipeCreator .notesdiv .nicEdit-head{width:745px !important;}
.recipeCreator .notesdiv .tabmenu a:hover{color:#FFF;}
.recipeCreator .notesdiv .tabmenu a:not(.on):hover{ cursor:pointer !important}
#notesPanel{overflow:auto;}
#notesPanel.fixEditorHead{padding-bottom:38px;}
.recipeCreator .notesdiv .nicEdit-head{width:745px !important;}
.recipeCreator #sortnote{font-size:10px;}
.recipeCreator td.tgPanel.off #sortnote{display:none;}
.recipeCreator #foodContent{border:none}
	.recipeCreator #foodContent hr.invis{ margin:0; }
#recTable .thead td{background:#EEE;}
	#recTable .thead td:first-child{ border-radius:20px 0 0 0;}
	#recTable .thead td:first-child.off{ border-radius:20px 20px 20px 20px;}
	#recTable .thead td:last-child{ border-radius:0 20px 0 0;}
#recTable .pillbtn{margin: 10px 0;}
	.btn.splitpill:first-of-type{ padding-right:20px;}
	.btn.splitpill:last-of-type{ padding-left:20px; border-left: solid 3px rgba(255, 255, 255, 0.1);}
#recTable .expand {width:150px!important;}
#recTable #portionBody td.td-del{ min-width:55px; }
.hideSpan span:first-child{display:none;}
.hideSpan span:nth-child(2){float:none!important;}
#g{width:90px;}
.tempCost{clear: both;}

/* .pBarcode { background:url(/media/icon-barcode.png) no-repeat left center; right:8px; bottom:11px; padding-right: 7px; height:20px; position:absolute; cursor:pointer; transition:all 0.5s; }
	.pBarcode.disabled{pointer-events: none; background: none;}
	.pBarcode.disabled .pBarcodeVal{right:5px;}
	.pBarcodeVal { font-size:10px; font-weight:bold; color:#555; margin-left:19px; }
	.pBarcode.empty{opacity:0.4; background-position:right; }
	.pBarcode.empty:hover{opacity: 1;} */

.pCode{ position:absolute;background:#ddd; width:auto; height:auto; top:11px; right:8px; /* transform:rotate(38deg)translateZ(0); */ padding:3px 7px 3px 17px; font-size:10px; text-transform:uppercase; font-weight:bold; border-radius:0px 5px 5px 0px; transition:all 0.2s; }
.pCode span{ max-width:140px; overflow:hidden; white-space:nowrap; box-sizing:border-box; text-overflow:ellipsis; direction:rtl; text-align:left; display:inherit;}
	.pCode.empty { background:#ccc;width:15px; height:10px;  top:16px; right:10px; transform:rotate(38deg)translateZ(0); padding: 0; border-radius: 0px 3px 3px 0px; }
	.pCode.disabled{pointer-events: none;}
	.pCode.empty.disabled{display:none;}
	.pCode:before { content:''; position:absolute; border-style:solid; border-width:9px 10px 10px 0px; border-color:transparent #ddd transparent transparent; left:-10px; top:0px; transition: all 0.2s;}
	.pCode:after { content:'\2022'; color:#fff; position:absolute; top:0px; font-size:14px; left:-3px; }
	.pCode:hover{background:#ccc;}
	.pCode:hover:before{border-color:transparent #ccc transparent transparent;}
	.pCode.empty span{display:none;}
	.pCode.empty:before{ content:''; position:absolute; border-style:solid; border-width:5px 6px 5px 0px; border-color:transparent #ccc transparent transparent; left:-6px; top:0px; }
	.pCode.empty:after { content:'\2022'; color:#fff;  top:-1px; font-size:10px; left:-2px; }
	.pCode.empty:hover{background:#aaa;}
	.pCode.empty:hover:before{border-color:transparent #aaa transparent transparent;}

/* #portionBody td{overflow: visible;}
.bCodeInput, .pCodeInput { position:absolute; width:160px; right:0; border:solid 1px #CCC!important; background:#FFF!important; z-index:2; height:32px; top:30px!important; padding-right:22px!important;}

.pCodeInput,.pCodeReload{right: 0px; top:-1px!important;}
.bCodeReload,.pCodeReload { position:absolute; right:0px; z-index:2; top:31px; font-size:18px; font-family:Roboto, Arial, Helvetica, sans-serif; text-align:center; line-height:30px; cursor:pointer; padding:0px 7px 0px 0px; color: var(--hcol)!important; }
.bCodeReload:hover,.pCodeReload:hover{ color: #3d9be4!important;} */

#statsbox{padding:2px 15px 10px 15px; width:154px; float:right; font-size:12px; border-left:solid 1px var(--hcol); border-bottom: solid 1px var(--hcol);}
	#statsbox .bluehead{padding:5px 15px; margin:-2px -15px 7px -15px;}
	#pie{margin:0}
	#weightbox{font-size: 12px; color: #555; line-height:28px; padding:0; width: 270px; float:right; margin-bottom:20px; overflow:hidden;}
		#weightbox .metaTable{ margin:0; width:100%; }
		#weightbox .metaTable tr:hover td,#weightbox label:hover { background:var(--bgcol3) }
		#weightbox strong{font-size:12px; margin-right:10px;}
		#weightbox .spacer{ margin-top:10px; margin-bottom:-10px; position: relative; z-index:1 }
		#weightbox>label{background: #FFF; padding-left: 10px; border: solid 2px #FAFAFA; font-weight: 900}
			#weightbox>label input{ width: 50%; border: 0; border-left: solid 2px #FAFAFA; }
		.recipeCreator #weightbox{border-right: solid 1px #DDD; }
		.recipeCreator #weightbox p{padding-left:20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
		/* .recipeCreator #weightbox p.bluehead{ margin-bottom: 10px; } */
		#weightbox input, #weightbox select { width:125px; height:30px; border-left:0; border-right:0; text-align:left; padding:0px 5px; color:var(--hcol); font-size:12px; background-color:transparent; cursor:text; margin:0; font-weight:bold;}
		#weightbox select{ padding:0 2px; cursor:default;}
		#weightbox input[type=checkbox]{cursor:default;}
		#weightbox hr{ visibility: visible; border: 0; border-top:dashed 1px #BBB; margin-bottom: -1px;}

		#labelsPanel {width: 283px; height: 425px; float:right; text-align:center;box-sizing:border-box;margin: -10px; border-left: dotted 2px #EEE; overflow-y: auto;}
				#labelsPanel .spacer{ line-height: 15px; }
				#labelsPanel .spacer .counter{ margin:0 2px 0 -10px }
				#labelsPanel .allLabels a { display:inline-block; width:100px; height:100px; background:#FFF; overflow:hidden; padding:0; position:relative; box-shadow:0 1px 15px #E9E9E9; border-radius:50px; transition:all 300ms; margin:0px 5px; cursor:pointer; border:solid 3px #FFF; }
				#labelsPanel .allLabels a img{cursor: pointer;}
				#labelsPanel a .labelThumb{width:75%;}
				#labelsPanel .unavailable { padding:130px 20px 0px; }
			#labelsPanel .allLabels a:hover{background:#EEE; transform:scale(1.1); box-shadow:0 1px 8px #999; z-index:1}
			#labelsPanel a.lgreybtn{position:absolute; margin-top:-27px; left:50%; transform:translate(-50%,0); border-radius: 50px}
			.allLabels+.footer { background:linear-gradient(0deg, rgba(255,255,255,1) 50%, rgba(255,255,255,0) 100%); padding:30px 0 15px;}
			.disabled .allLabels+.footer { background:linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(255,255,255,0) 100%);}
		#labelsPanel .bigIconMenu{ padding-top: 70px;}
		#labelsPanel .bigIconMenu .largeText{ background: none!important;}
		.labelAd{ background:url(/media/back-watermark.png) no-repeat; background-position:-420px; background-position-y:-390px; }




		#modifiersPanel .circleSummary{width:765px;    margin: 10px 0 55px;}
		 	#modifiersPanel .circleSummary span.price{display:block; width:100%; padding:2px 0px 5px; text-transform: lowercase;}
			#modifiersPanel .circlePrice {text-shadow: none; margin:0px 12px;}
				#modifiersPanel .circlePrice input{transition: none;}
				#modifiersPanel .circlePrice.blueback:hover input{background: #999!important;}
				#modifiersPanel .circlePrice.lgreyback input{background: #EEE!important; width:60px;}
			#modifiersPanel .circleSummary .circleTxt{width:55px;margin-left: 2.5px;}
				#modifiersPanel .circlePrice:nth-child(3):hover{background: #999;}
				#modifiersPanel .circlePrice:nth-child(3):hover #recipeConversionFactor{color:#FFF;}
				#modifiersPanel .circlePrice:hover input{ color:var(--h3col)}
				#modifiersPanel .clickable,#modifiersPanel .clickable span{cursor:pointer; transition: background 300ms}
				#modifiersPanel .clickable:hover{ background: var(--hcol)!important}

			#modifierTxtFields{ border-top:2px dotted #EEE;/*  background:grey;  position:absolute;*/ padding: 15px 0px;}
				#modifierTxtFields p { display:inline-block; margin: 0px 10px 20px; }
				#modifierTxtFields p[data-shared="1"] {position:relative;}
				#modifierTxtFields p:empty{display: none;}
				#modifierTxtFields p input, #modifierTxtFields p select,#modifierTxtFields p .whitebtn, #modifierTxtFields p textarea {width:120px;padding:5px!important;font-size:16px;font-weight:bold;text-align:center;color:var(--hcol);border-radius: 50px;border: solid 2px #EEE;}
					#modifierTxtFields p .whitebtn{max-height:33px; overflow:hidden; vertical-align:middle; box-sizing:border-box; line-height:22px; cursor:pointer;}
					#modifierTxtFields p input[type="date"]{font-size: 14px;}/*beta bug #25097 3 lines of styles*/

					 #modifierTxtFields p input::placeholder{font-size:10px; transform:translate(2px,-3px); }

				#modifierTxtFields p span{/* width:110px; */ display:inline-block;}
					#modifierTxtFields p span:first-child{ width:110px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; vertical-align: middle;}
					#modifierTxtFields p span.ficon:first-child{width:13px;height:13px;position:absolute;top:-5px;left:7px;}
					#modifierTxtFields p span:last-child{ width: 115px;text-align: center;vertical-align: middle;}
				#modifierTxtFields .cfieldhead{display: none;}
				#modifierTxtFields [data-empty="1"]{display: none;}
				#modifierTxtFields .td-quantity textarea {max-width: 100%; font-size: 12px; border-radius: 15px;}
				#shelfLifeLabel.disabled{background-color: rgba(239, 239, 239, 0.3);pointer-events: all !important;}
					#newMd{ width:225px; }
		/*#contextMenu.contextMenu.on.c-modifiers{max-height:240px;overflow-y:auto;}*/
		#shelfLifeLabel {width:auto;min-width:50px;min-height:22px}

.wChangeOpts { position:absolute; right:13px; margin-top:-13px; cursor:pointer; text-align:center; border:2px solid #CCC; line-height:21px; box-sizing:border-box; border-radius:50%; width:26px; height:26px; background:#FFF; filter:grayscale(100%); transition:all 200ms}
	.wChangeOpts svg{pointer-events:none; width: auto;}
	.wChangeOpts:hover{ border-color: var(--h2col);  filter:none;}
	.weightChangeInfo {min-height: 500px; margin: 0 10px 0px 240px; text-align:center; padding-bottom: 20px;}
	.weightChangeInfo .catName td{ cursor:pointer; position:relative;}
	.weightChangeInfo .catName td::after{content:"►"; position:absolute; right:2px; top:8px; font-size:10px; transition:0.5s all;}
	.weightChangeInfo .catName.on td::after{transform:rotate(90deg);}
	.weightChangeInfo .catName.on:hover td{background-color:transparent;}
	.weightChangeInfo table{ table-layout:fixed; position:relative; margin:0 auto 15px; }
	.weightChangeInfo table td{word-wrap:break-word; height:40px; width:85px; vertical-align:middle}
	.weightChangeInfo thead tr td { background:#FFF; font-weight:bold; font-size:11px; border-bottom:solid 3px #EEE; }
	.weightChangeInfo tbody td.highlight{cursor:pointer;}

	.weightChangeInfo tr td:first-child{ width:180px; text-align:left}
	tr#wcHead.fixedWcHead{position:fixed; margin-top:-66px;}

	.wcCats { width:220px; float:left; text-align:center; transition:all 0.5s; height:calc(100% - 155px); overflow:auto; margin:0px 0px -50px -50px; position: fixed;}
		.wcCats div{position:relative; padding:12px 0px;  cursor:pointer; transition:background 300ms}
		.wcCats div:hover{background:#EEE; color:#333;}
		.wcCats div:hover::after, .wcCats div.on::after{content:"►"; position:absolute; right:7px; top:15px; font-size:10px;  color:#20699D;}
		.wcCats div.on{background:var(--h2col); color:#FFF;}
		.wcCats div.on::after{color:#FFF;}

	/*#28121 #41889 - Can we have a second level for subcategory before showing the list of results? */
	.yieldPortion { width:220px; height:calc(100% - 150px); overflow:auto; margin:-20px 0px -50px 0px; position:fixed; line-height:40px; padding-left:10px; box-shadow:2px 0 10px #EEE; z-index:1; }
	.weightChangeInfo table .on td.sc-src { display:table-cell;	}
 	.weightChangeInfo table .on td.sc-edibleportion { display:table-cell;	}
	.weightChangeInfo table .on td.sc-edibleportion { display:table-cell;	}
	.yieldPortion .accordion>span:before { margin:0 5px 0 0px; }
	.yieldPortion .drop>div { transition: background 300ms, color 250ms}
		.yieldPortion .drop>div:hover { cursor:pointer; color: var(--h2col); }
		.yieldPortion .drop>div.on { color: var(--h3col); background: #EEE; border-radius: 50px; padding-left: 12px; font-weight: bold;}
		.yieldPortion .drop>div.on:after {content: ''; border-width: 4px 0 4px 6px; border-color: transparent transparent transparent currentColor; float: right; margin: 10px; display: inline-block; border-style: solid;}
	/*#28121 #41889 - end of implementation */

	.weightChangeInfo table td{display:none;}
	.weightChangeInfo table tr.on td.on{display:table-cell;}

	#wcFooter { position:fixed; width:99%; left:0; box-sizing:border-box; bottom:0px; padding:7px 10px 20px 170px; border-top:solid 3px #EEE; background:#FFF; border-radius:0 0 50px 50px; }
		#wcFooter p, #wcFooter div, #wcFooter a { display:inline-block; }
		#wcFooter p { margin-right:15px; }
		#wcFooter div:first-child{margin-right: 15px;}
		#wcFooter div span { font-size:8px; }
		#wcFooter input { width:80px; font-weight:bold; text-align:center; border:solid 2px #EEE; }
		#wcFooter b{ margin:0px 15px; }
		#wcFooter div { text-align:center; }
		#wcFooter a{ float:right; margin-right:10px; margin-top:15px; }

	#wcWrapper{position:relative; transition:0.5s all; left:0;height: 500px; }
	#wcWrapper .weightChangeInfo{padding-bottom: 100px;overflow: auto;margin-bottom: 110px;max-height: 320px;min-height: inherit;}
	#nutrientBreakdown,#fDetailPanel{color:#777; font-size:10px; margin-bottom:60px; line-height:16px; padding-top:0}
	#nutrientBreakdown p, #fDetailPanel p{clear:both; }
	#nutrientBreakdown p:hover, #fDetailPanel p:hover{ background:var(--bgcol3); border-radius: 50px; }
	#nutrientBreakdown p.grouphead, #fDetailPanel p.grouphead { background:#EEE; margin:15px 0 5px; padding:3px 10px; border-radius:50px; text-align:left; text-transform:uppercase; margin-right:6px;}
	#nutrientBreakdown p.grouphead>strong, #fDetailPanel p.grouphead { color:#444 }
	#fDetailPanel p span{width:72%;}
	.tip{ margin:15px 0;font-style:italic; font-size:11px;}

#makeThisIngredients p .blue{display:inline-flex; width:12%;}
#makeThisIngredients p .grey{color: #888;}
	.blue.ctype {padding-right: 10px;}

/*//////////////////////////////////////// COMPARE FOOD: ////////////////////////////////////////*/
#compare{text-align:center; table-layout: fixed;  }
.comPackTable #compare{ margin-top: 30px; }
.comPackTable #compare .compDesc{ font-weight: normal; }
.comPackTable #compare .ratedUses{margin:0;max-width:120px;font-size: 16px;font-weight: bold;text-align: center;color: var(--hcol);border-radius: 50px;border: solid 2px #EEE; }
/*start css for new compare tool*/
.fixed #compare tr:first-child{top:70px; z-index:2; box-shadow: 0px 4px 20px 0px rgba(0, 0, 0, 0.2);}
.fixed #compare input, .fixed #compare a, .fixed #compare .foodphoto, .fixed #compare select , .fixed #compare .compUnit{display:none;}
.fixed #compare tr:first-child td{ background-color:#FFF; border:none; vertical-align:inherit; text-align:center; padding:0; height:27px; box-shadow:0px 2px 10px 0px rgba(0, 0, 0, 0.2);}
.fixed #compare .compFood{ color: #FFF; padding:0 10px; width: 13em; overflow: hidden; text-overflow: ellipsis; display: inline-block; white-space: nowrap; }
.fixed #compare tr:first-child td:hover .delbtn{ width:10px;height:10px;line-height:8px;top:4px; }
.compFixHead{background-color: black; z-index: 10; position: absolute; top: 0px; width: 90%; left: 0; word-wrap: normal; word-break: normal; padding: 10px; min-height: 22px; color: white; text-align: center; display:none; transition:min-height }
.compFixHead.on{background-color: black; z-index: 10; position: absolute; top: 0px; width: 90%; left: 0; word-wrap: normal; word-break: normal; padding: 10px; min-height: 22px; color: white; text-align: center; display:none; }
#compare .compFood{ white-space: normal; letter-spacing:normal; overflow: hidden; width: 100%;-webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -webkit-box;}
	#exported.livepreview #compare .compFood{display:block;}
	#exported #view .menuGroup{max-height: inherit;overflow: inherit;}
#compare select{border:solid 2px #EEE; margin-top:5px; padding: 0 10px;}
.compare .enaSel{ background-color: white; border-left:solid 5px var(--hcol)!important; box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.3); }
.compare .foodNames{ font-size: 10px; color: #666; width: 90%; float: left; height: auto; white-space: normal; padding: 10px; padding-top: 0px; height: 24px; overflow: hidden; display: block; -webkit-line-clamp: 3; -webkit-box-orient: vertical; display: -webkit-box;}
#pane-maindiv #compare tr.thead td:first-child{font-size:10px; background:#DDD; text-transform:uppercase; font-weight:bold; border:0; letter-spacing:normal;}

#compBtn{ float: right;  }
#previewText{  font-size:16px; font-style:italic; color:#555; vertical-align:middle; line-height:31px; padding-left:2px; }
#halfOptions{display:none;}
.compare .optionsnest input{background: transparent}
.compare .options input#description{ width: 335px;}

#compare td{ min-width:135px; max-width:200px; white-space: normal; padding: 15px; position:relative}
#compare td.td-quantity{ font-weight:bold; font-size:18px; letter-spacing:-1px; }
#compare td.td-top{background:none !important;padding:10px 15px;}
#compare td:not(.td-quantity) p{ margin-bottom: 5px;; }

#compare #claimsbox, #compare #otherClaims  {width: 100%;margin-top: 0px;}
#compare #claimsbox h4, #compare #otherClaims h4 {width: 100%;}
#compare td .smallText{margin-left:1px; }
#compare td .circle{ width: 20px; height: 20px; padding: 5px; line-height: 20px; text-align: center; border-radius: 50%; margin:-6px -5px -6px 5px; position:absolute; right:10px;}
#compare td .foodphoto,#compare td .packphoto{height: 110px; width: 110px; position: absolute; top: 0; left: 50%; border-radius: 60px; margin-left: -60px; border: solid 5px #FFF; box-shadow: 1px 1px 5px #CCC;}
#compare tr:first-child td{ font-size: 13px; font-weight:bold; background:#FFF; white-space: normal; height:220px; position:relative; vertical-align:bottom; padding:10px 5px; text-align:center; }
	#exported.livepreview #compare tr:first-child td{padding-top:140px}

#compare td input { border: solid 1px #DDD; margin-top: 5px; margin-bottom: -10px;}
#compare .thead td{ padding:0px; text-align:center!important;}
.comPackTable #compare tr:first-child td:first-child{color:inherit}
#compare tr:first-child td:first-child{color:var(--hcol);}
	#compare tr:first-child td .delbtn{display:none; position:absolute; top:3px; right:3px; z-index:1; background:#FFF;}
	#compare tr:first-child td:hover .delbtn{display:block;}
#compare td:first-child{background:#EEE; font-size:11px; font-weight:bold; text-align:left; width:165px; min-width:185px; vertical-align: middle; letter-spacing:normal;}
	#compare td:first-child .circle{ width:30px; height:30px; line-height:30px; color:#444; background:#DDD; padding:5px; margin:-13px -7px; }
 #compare #fp_loaderbox {position: unset; transform: unset;}

/*end css for new compare tool*/
tr.grouphead td{background:#EEE; margin:5px 0; padding:3px 8px; border-left:solid 2px var(--hcol); color:var(--hcol)}
.alBorder span { border:1px solid; padding:3px 10px; display:inline-block; margin:8px 0 0; border-radius:50px; }
.allergenicon{text-transform:uppercase; font-size:7px; font-weight:bold; display:inline-block; margin:0px 5px; text-align:center; width:44px; word-wrap:normal; text-align:center; box-sizing:content-box; color:#444; vertical-align:top; line-height: 130%;}
	.allergenicon span{ aspect-ratio:1/1; height:40px; line-height:20px; padding:5px; background:#777; border-radius:50%; vertical-align:middle; display:inline-block; margin-bottom:3px}
	svg.icon { fill:#666; border-radius:50%; padding:3px; width:25px; vertical-align:middle; }
	.claim svg,.allergenicon svg{width:100%; height:100%; fill:#FFF; }
		.allergenicon.icon-milk span,.back-milk, .back-6,.allergenicon#texture6 span{background:#a0c3e6;}
		.allergenicon.icon-eggs span,.back-eggs, .back-3,.allergenicon#texture3 span{background:#FCCA2B;}
		.allergenicon.icon-gluten span,.allergenicon.icon-wheat span,.back-gluten,.back-wheat{background:#A0845A;}
		.allergenicon.icon-soya span,.back-soya,.back-4,.allergenicon#texture4 span{background:#62B36C;}
		.allergenicon.icon-nuts span,.back-nuts{background:#9E5738;}
		.allergenicon.icon-peanuts span,.back-peanuts{background:#ed4a47;}
		.allergenicon.icon-celery span,.back-celery{background:#9ec64f;}
		.allergenicon.icon-mustard span,.back-mustard{background:#E0D23D;}
		.allergenicon.icon-sesame span,.back-sesame{background:#E0C791;}
		.allergenicon.icon-crustaceans span,.back-crustaceans,.back-2,.allergenicon#texture2 span{background:#f492a2;}
		.allergenicon.icon-sulphites span,.back-sulphites,.back-5,.allergenicon#texture5 span{background:#f7941e;}
		.allergenicon.icon-fish span,.back-fish{background:#51B5B5;}
		.allergenicon.icon-molluscs span,.back-molluscs{background:#6570A8;}
		.allergenicon.icon-lupin span,.back-lupin{background:#B1477D;}
		.back-7,.back-7A, .back-7a,.back-1{background:#777}/*45743 added .back-7a as A can be lowercase too*/
		.back-0{background: #CCC;}
		.allergenicon#texture0 span{color:#777!important; background:#FFF; border-color:#DDD!important;}
		.allergenicon.texture span { font-size:14px; color:#FFF; line-height:20px; }
		.allergenicon.texture:not(.texture7as).shrink span{font-size:11px; line-height:22px; width:21px; height:21px;padding:0px !important}
		.allergenicon.texture7as.shrink span{padding:5px 2px !important;}

		.allergenicon.may-contain{ width:35px}
			.allergenicon.may-contain span{transform:scale(0.6); border-radius:4px; margin-bottom: -3px; opacity:0.5}
			.allergenicon.may-contain:hover span{ opacity:1}

	.allergenicon.prop span{background:#FFF; border:solid 2px #999;}
	.allergenicon.prop svg{fill:#777;}
	.back-vegetarian,.back-vegan,.back-glutenfree,.back-kosher,.back-halal,.back-alcohol{background:#777;}
	.allergenicon svg.fixedSize{max-height: 100%}

/*//////////////////////////////////////// MEAL PLAN CREATOR: ////////////////////////////////////////*/
.mealPlan #noteshead td:nth-child(2){padding-left:10px; }
#mpTable{/* border-collapse: collapse; */margin-right:1px;margin-top: 81px;}
/* #mpTable #fixedHead{position:absolute;top:40px;z-index:1;margin-top: -39px;} */  /*AUG22->40114 */
#mpTable #fixedHead{position:fixed; box-sizing: border-box; height: 40px; line-height: 40px; background: white; z-index:4 ; top: 70px;}
.mealplan #selectClient{width:164px; pointer-events: all !important;}
#mpTable .ficon{ padding:0px;}
	.td-del>.ficon, .td-del>.helpbtn{ position: absolute; z-index:1; margin: 1px 23px; }
	.td-del>.helpbtn.on{ z-index:3; }
/*#mpTable #fixedHead{z-index:3!important;}*/
.mealPlan td.td-food {min-width:250px; padding:0; position:relative;}
.mealPlan .options input#name{width:250px;}
.mealPlan .options #mp_monitorsSub.submenu.sel{min-height:500px;}
.mealPlan .options .submenu input:checked + span {line-height:15px;background: var(--bgcol4);}
.mealPlan .options .submenu input{height:auto !important}
.mealPlan .options .submenu label>span {font-weight:normal;}
.mealPlan .options #mp_monitorsSub.submenu label{width:165px;}
.mealPlan .mealHeadingNo{line-height: 26px;}
.mealPlan .mealHeading .recipephoto  {min-width:45px;min-height: 45px;}
#mpTable .mealHeading .ficon { right:auto; top:14px!important; left:28px; }
#mpTable #fixedHead tr #h-sus_co2eq{width: 145px !important;}
#mpTable tbody tr #c-sus_co2eq{min-width: 145px !important;}
#mpTable #fixedHead tr #h-sus_water{width: 100px !important;}
#mpTable tbody tr #c-sus_water{min-width: 100px !important;}
.mealHeading td { background:#EEE!important; border: 0}
.mealHeading td.td-del{border-right: 0;}
.mealPlan .clearportion{ margin-left:52px; }
.divMealHeader{display:flex; flex-direction: row;}
.mealPlan.disabled .mealname{background: transparent}
.mealPlan.disabled .mealHeadingMenu{display: none;}
.mealplan .notesdiv{max-width: 840px!important;}
.mealplan .nicEdit-head{width: 100%!important;}
.mealplan #unavailable{margin:35px !important;}
.mealHeadingMenu { position:absolute; right:0; width:350px; margin-top:3px; border-radius:50px 0 0 50px; font-weight:bold; color:#666; text-align:right; border-right:0; height:38px; background:#F9F9F9; }
		.mealHeadingMenu label { display:inline-block; font-size:8px!important; padding:0!important; margin-right:10px; background:transparent!important; margin-left:10px; line-height:38px!important; vertical-align:middle; height:38px; }
		.mealHeadingMenu label:hover{color:var(--hcol);}
	#syncbtn { position:absolute; padding:0; width:26px; height:26px; left:-10px; top:6px; border-radius:50px; }
		#syncbtn svg{ width:14px; margin-top:-9px; } /*Sep22->37856*/
		#syncbtn:before { content:'SYNC'; position:absolute; margin:-4px -37px ; color:#666; text-shadow:none; font-size: 8px}
	.mealHeadingMenu input { color:var(--hcol); width:89px; text-align:center; height:32px; border-radius:50px; }
	.mealHeadingMenu .circlebtn { position:relative; transform:scale(0.8); vertical-align:middle; margin-top:-2px; transition:transform 200ms}
	/*.mealPlan tr .td-measure{width:130px!important;}*/
.mealPlan tr .td-quantity a{display:block;}
.mealPlan.disabled tr, .mealPlan.disabled input{pointer-events: none!important;}
thead .monitor{ font-size:9px!important; text-align:center}
.monitor {color: #AAA!important;text-align:center!important;}
tr.rdafooter .monitor{border-bottom:solid 2px #999; font-weight:bold;}
.rdafooter .smallselect { width:95px; margin:0 20px 0 5px; background-color:#FFF; border-radius:50px; padding:0 15px; }
.monitor.blue { color: var(--hcol)!important; border-bottom-color:var(--hcol)!important; background: rgb(220, 228, 235)!important; }
.monitor.red { color: #C00!important; border-bottom-color:#C00!important; background:#FCC!important; }
.monitor span { width: 100%; overflow: hidden; display: block;}
.saveAsRecipeBtn{position:relative; z-index:1; margin:8px 10px 0 0;}

tr.mealplanfooter td,tr.mealfooter td,tr.mealplanfooter:hover td,tr.mealfooter:hover td{border:0; font-weight:bold; background:#FFF}
	tr.mealfooter td{border:0; padding:3px;}
	tr.mealfooter td{/* background:#EEE!important; */color:#666!important;}
	tr.mealfooter td.monitor { line-height:16px; background:#EEE!important; border-radius:50px; }
	tr.mealplanfooter td.smallText, tr.mealfooter td.smallText, tr.rdafooter td.smallText{font-style:italic; text-align:right; font-weight:bold}
	tr.mealplanfooter td{ padding:15px 9px; background:#AAA!important; color: white!important; }
	tr.mealplanfooter td.monitor{ background:#999!important; border-left:solid 1px #777!important;border-right:solid 1px #888!important; font-size:16px;}
	tr.mealplanfooter td a.largebtn { border-color:#bbb; padding:2px 40px; margin:-5px 0 -5px 15px; }
	tr.mealplanfooter td a.largebtn:hover{border-color:#FFF;}
	tr.mealplanfooter p {margin-bottom:2px;}
	tr.rdafooter .mp_stretch{border-bottom:0!important; text-align:right;}
	tr.rdafooter{background:#EEE;}
	tr.rdafooter td:first-child{border-bottom:solid 2px #EEE!important;}


.mealplan #macrotable table{width:500px;}
.mealplan #macrotable tr.nutrientGroup td{font-size:6pt;}
.mealplan #macrotable tr.nutrientGroup td:nth-child(3),.mealplan #macrotable tr.nutrientGroup td:nth-child(6){font-style: italic;}

#macronutrientanalysis #pievals{ margin: 54px 23px 0 14px; }
#macrotable #pievals{ margin:35px 0 0 0; float:left}
#macrotable #piechart{ position: inherit; float:left; margin-top:10px; width:125px;}

.excl.error.mealplanfood{display:inline; float:right; margin: 10px 3px; position: relative; z-index: 2;}

/*//////////////////////////////////////// LOG SEARCH////////////////////////////////////////*/
#mainnest{display:inline-block; /*border-right: solid 15px #EEE;*/ min-width:755px;}
#log .searchInput{padding:7px 10px 7px 10px; font-size:12pt;}
.results{ width:210px; overflow-y: auto; position: absolute; top:43px; bottom: 0; overflow-x: hidden;}
	.results h3:not(.incompatible){margin: 0; background-color: #FFF8; padding: 14px;}

	#results-foodSearch, #results-clientSearch{background-color: #FCFCFC; box-shadow:0 0 15px #EEE;}
	#results-foodSearch{top:66px; width:100%; transition:margin-top 300ms!important; border-radius: 3px }
	#results-foodSearch .prefade{ margin-top:40px!important; overflow-y:hidden!important; }
		#pane-logSearch.menus #results-foodSearch .prefade{ margin-top:0px!important; }
		#results-foodSearch .editbtn{ margin: -40px 2px !important}
		#results-foodSearch .result.sel~a.editbtn{ display: none}

	.results>div{padding:10px 8px; cursor:default; background-color: rgba(255,255,255,0.6); color: #666; transition:all 250ms; }
	#results-clientSearch.results div { line-height:35px; padding:6px; background:transparent url(/media/icon-collab-user.gif) no-repeat center left; background-position:16px 17px; background-size:12px;}
	#results-foodSearch>div{padding:0; margin:0; border:0; height:100px; vertical-align: top; transition:all 300ms;}
	.result .foodphoto { display:block; width:98px; height:98px; float:left; background-size:100%; background-color:#EEE; border-radius:10px; margin:1px 0 1px 1px; transition: background 200ms; }
		.result:not(.sel):hover .foodphoto { background-size: 110%; }
	#results-foodSearch>div .helpbtn:not(.foodReqIcon, .recipeReqIcon){position: relative; left: -13px;top: -41px;}
	#results-foodSearch>div .helpbtn::before{content: "!"}
	#results-foodSearch>div .helpbtn span{width: 210px; margin:9px 0 0 -193px; left: 8px;}
	#results-foodSearch>div .foodReqIcon, #limyproducts .foodReqIcon { position:absolute; top:127px; right:25px; background-color:var(--hcol); cursor:pointer; border:0; }
	#limyproducts .foodReqIcon{position: relative !important; right: 75px !important; background-color:var(--h3col)!important;}
	#results-foodSearch>div .foodReqIcon:hover{background-color:#50b2d9;}
		#results-foodSearch>div p { padding:10px; white-space:normal; margin-left:100px; overflow:hidden; max-height:100%; box-sizing:border-box; display:-webkit-box; -webkit-line-clamp:5; -webkit-box-orient:vertical; height:97px; word-break: break-word;}
	#results-foodSearch>div.portionBlock { display: block; height: auto; padding-bottom:20px;}
		.portionBlock a.insertbtn { float:right; opacity:0; pointer-events:none; transform:scale(0.7); width:24px; height:24px; padding:0; z-index:1; top:-1px; right:2px; line-height:24px; position:absolute; transition: transform 300ms,opacity 300ms}
		.portionBlock a.insertbtn:before{ content: '\25b6'}
		.portionBlock div:hover a.bluebtn.roundbtn {opacity: 1; pointer-events:all; transform: scale(1)}
			.portionBlock .ficon.inmenu{float: right; top: 6px; right: 5px; display:none;}
			.portionBlock .ficon.inmenu.on{display:inline-block;}
		#results-foodSearch .portiondetailitem { height:26px; transition:background 300ms  }
			#results-foodSearch>div.portionBlock div.portiondetailitem p { padding: 0;  font-size:11px; margin-left: 40px; width: 175px; line-height: 26px; display:inline-block;}
			#results-foodSearch>div.portionBlock div.portiondetailitem:hover { background: #F5F5F5!important; }

	.pane.menus #results-foodSearch>.result { height:40px; background:#EEE!important; overflow:hidden; border: 0; }
	.pane.menus #results-foodSearch>.result .foodphoto { width:40px; height:40px; min-height:40px; min-width:40px;}
	.pane.menus #results-foodSearch>.result .src{display:none}
	.pane.menus #results-foodSearch>div p{margin:0; display:inline-flex; align-items:center; height:100px; width:190px;}

	#results-foodSearch>div .smallText{font-weight:normal;    font-size: 11px!important; display:block; line-height:120%; margin-top:3px}
	#results-foodSearch>div .smallText.showMeHow{font-size: 9px!important; font-style: normal; display: inline-block;}
	#results-foodSearch .compare p{font-size:16px; height:auto;}
		#results-foodSearch .result{ position:relative; }
		#results-foodSearch .aiResult{ padding:10px 5px; height:auto; }
		#results-foodSearch .result .switchFood{ position:absolute;top: 5px;right: 5px; }
		#results-foodSearch .foodoptions{ position: fixed; height: 0; width: 300px;left: 200px;z-index: 1;display: none;transition: none;}
			#results-foodSearch .foodoptions.on{ display: block; z-index: 2}
			#results-foodSearch .foodoptions > div { position:absolute; width:100%; display:table; box-shadow:0px 5px 20px 0px #AAA; overflow:hidden; background:#FFF; }
			#results-foodSearch .foodoptions::after{content:'';border-width: 0 6px 8px 6px;border-color: transparent transparent var(--hcol) transparent;position: absolute;top: -8px;border-style: solid;left: 21px;}
			#results-foodSearch .foodoptions.inverted::after{top: var(--content-height, 230px);rotate: 180deg;}
			#results-foodSearch .foodoptions .foodoption{height: 30px;display: table-row;}
			#results-foodSearch .foodoptions .foodoption > *:not(script) {cursor: pointer; display: table-cell; vertical-align: middle; padding:13px 10px; min-width: 50px;max-width: 170px; transition:background 250ms}
			#results-foodSearch.results .foodoptions div.foodoption:hover > *:not(script){ background-color:#EEE!important;}
			#results-foodSearch .foodoptions .foodoption:not(.selected) .counter{visibility: hidden;}
			#results-foodSearch .foodoptions .foodoption > span:nth-child(2){overflow: hidden; text-overflow: ellipsis;}
		#results-foodSearch #aiAction {position: absolute; height:unset; right: 25px; bottom: 120px; z-index:1}
		#results-foodSearch #aiAction > div {position: fixed;}
			#results-foodSearch #aiAction #aiCounter {top: 20px; left: -10px; }
			#results-foodSearch #aiAction #aiCtx {border: 3px solid white;margin-top: -45px;position: fixed;margin-left: 10px;}
			.foodIncluded, .foodIsIncluded.sel .foodIncluded{ display:none; }
			.foodIsIncluded .foodIncluded, #results-foodSearch .portionBlock .foodIncluded{ display:block; }
			.foodIncluded:after{ position:absolute; content:'✓'; bottom:20px; right:3px; width:16px; height:16px; font-size:11px; margin:3px; text-align:center; background-color:var(--hcol); color:white; border-radius:50%; }
			.aboveIncompatible.foodIncluded:after { bottom:20px; }
			.portiondetailitem.foodIncluded:after { bottom:auto; right:4px; top:1px; }
			#results-foodSearch .excl.error.incompatible{ position:absolute; bottom: 0px; right: 0px; margin:5px; display:block }
			#results-foodSearch .sel .excl.error.incompatible{ bottom:50px; display: none;}
			#results-foodSearch .result .src, #results-foodSearch .foodoptions .foodoption .srcFlag{ position:absolute; display:block; height:16px; background-color:rgba(0,0,0,0.30); color:#fff; font-size:9px; font-weight:bold; border:0; border-radius:20px 0 0 20px; padding:0 8px 0 6px; top:12px; right:139px;}
			#results-foodSearch .result.pack .ficon { color:#555!important; margin-top:10px }
			#results-foodSearch .result.pack p span{display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden;}
			#results-foodSearch .result.pack p span.smallText{-webkit-line-clamp: 2;}
				#results-foodSearch .result.pack.sel .ficon { left:15px; scale:2; top:15px; margin:0; }
			#results-foodSearch .foodoptions .foodoption .srcFlag {position: static; display: flex;align-items: center;justify-content: space-between;}
			#results-foodSearch.noscrollbar .result .src { right:149px}
			#results-foodSearch .result.sel .src{ display:none; }
	#results-foodSearch .result .src *{ -webkit-user-select:text; cursor:text; }
				#results-foodSearch .result .src >*{ position:relative; top:1px; }
			#results-foodSearch .result .src .srcFlag{ padding:0px 2px; }
						#results-foodSearch .result .src .srcFlag .flag.flag-n{ position:relative; top:-1px; }
				#results-foodSearch .result .src.noflag >*{ position:relative; top:3px; }
					#results-foodSearch .result .src.noflag .srcFlag .flag{ display:none; }
				#results-foodSearch .result .src .srcFoodId{ background-color:white; color:#666; font-size:9px; padding:3px; }
			#results-foodSearch .result.sel .src .srcFoodId{ background-color:var(--hcol); color:white; }
			#results-foodSearch .result .src .flag{ margin:-1px 0 0 3px;}
			#results-foodSearch .result.sel ~ a.whitebtn.largebtn, #results-foodSearch:has(#catlinks > .favourites.on) .newItemBtn{ display: none; }

.newItemBtn { display:block; line-height: normal; padding:6px 20px; color:#999; font-weight:bold; text-align:center; border:solid 2px #DDD; margin:20px; border-radius:50px; background-color:rgba(255,255,255,0.4);  font-size:13px; transition:border 300ms}
	.newItemBtn:hover{color:var(--hcol); border-color:var(--hcol)}

.popBatchSearch { display:block; width:calc(100% + 100px); margin:-20px -50px -50px; box-sizing:border-box;overflow:hidden; }
	.popBatchSearch div {width: 100%;}
	.popBatchSearch .splitform { overflow-y: auto;height: 264px; margin-top: 10px; }
	.popBatchSearch .splitform label { padding: 4px 5px 4px 30px; }
	.popBatchSearch .splitform #searchByCode { width: 86%; height: 96%; margin: 0 auto; color:#CCC; text-align: left; padding: 15px 30px; border-radius:5px; background-color: #EEE; border: 0; transition: all 300ms}
	.popBatchSearch .splitform #searchByCode:focus { border:1px solid var(--h3col); font-style: normal; }
	.popBatchSearch .popFooter { background-color:#EEE; box-shadow: -2px 0 6px rgb(0 0 0 / 30%);}
	.popBatchSearch .popFooter p { padding: 15px 0 0 30px; }
	.popBatchSearch .popFooter .supplier { padding-right: 10px; }
	.popBatchSearch .popFooter .selectedSupplier { width: 65%; padding-left:0; padding-bottom: 10px; font-style: italic; }
	.popBatchSearch .bluebtn {margin: 10px 35px;}
	.popBatchSearchResults { position: relative; padding-top: 5px; }
	.popBatchSearchResults h4 { font-size: 25px !important; }
	.popBatchSearchResults .startSrc { padding-top: 26px; }
	.popBatchSearchResults .pnf .result { max-height: 110px; border-top: 2px solid #EEE; padding-top: 15px;}
	.popBatchSearchResults .result { display:inline-block; margin-top: 10px; overflow-y: auto; max-height: 200px; padding-right: 10px; width: 100%; }
	.popBatchSearchResults .result .border { border-top: 2px solid #EEE; padding-top: 5px; }
	.popBatchSearchResults .result .border:last-child { border-bottom: 2px solid #EEE; }
	.popBatchSearchResults .result .border.catalogue{ display: flow-root; }
	.popBatchSearchResults .result .border label{ display: inline; }
	.popBatchSearchResults .result .border.catalogue p{ width: 95%; }
	.popBatchSearchResults .result .largeText .ellipsis { max-width: 30%; display: inline-block; }
	.popBatchSearchResults p, .popBatchSearchResults a { color: #444; }
	.popBatchSearchResults .pnf { margin-top: 35px; }
	.popBatchSearchResults svg { padding-right: 10px; }
	.popBatchSearchResults .src { position: absolute; right: 0; top: 15px; display: block; width: 60%; text-align: right; }
	.popBatchSearchResults .ficon { margin-top: 7px !important; }
	.popBatchSearchResults .fID { color: #1d76bb; margin-right: 20px; font-size: 12px; }
	.popBatchSearchResults .fID:after { content: '\002197'; display: inline-block; }
	.popBatchSearchResults div p { border-bottom: none !important; padding: 5px 0 !important; }
	.popBatchSearchResults table { width: 100%; }
	.popBatchSearchResults table td { border: none; padding: 5px 0; }

.searchDrop { width: 250px; position:absolute; top:0; left:0; -webkit-box-shadow:1px 4px 8px -2px #777; box-shadow:1px 4px 23px -2px #777;border-radius: 25px;; background:#fff; z-index:3; padding:0 10px; overflow:hidden; max-height:0px; transition:all 200ms; }
	.searchDrop .savedSearches{ text-align: center; width:180px; background:#EEE; position:absolute; top:-40px; left:0; transform:translateX(-100%); box-shadow:-4px 4px 11px -2px #777; border-radius: 3px; height:calc(100% + 40px); overflow-y:auto; padding-bottom:25px; box-sizing:border-box; }
	.searchDrop .savedSearches p:not(.emptyList) { font-size:12px; text-align:left; padding:10px 5px 10px 10px; line-height:130%; transition:all 0.3s; cursor:pointer; }
	.searchFooter { float:left; padding:10px 10px 0; width:100%; }
		#resetDefaults { margin-left: 70px; }
	.searchDrop.on, .searchdiv.on>.searchDrop{ max-height:var(--maxHeight, 550px); padding:45px 10px 10px; overflow: visible;}
	.searchDrop .select,.searchDrop input,#menuSearchDrop .select{ border:solid 2px #EEE; box-shadow:none; transition:all 250ms; width:100%; height:34px; line-height: 30px; border-radius: 50px; }
	.searchDrop .select:hover,.searchDrop input:hover,#menuSearchDrop .select:hover{border-color:#FFF; box-shadow: 0px 0 8px #CCC;}
	.searchDrop input::-webkit-input-placeholder{ font-size: 10px; }
	.searchDrop .select .selected:not(.flatpickr-calendar .selected), #menuSearchDrop .select .selected:not(.flatpickr-calendar .selected){ color:#999; padding-left:10px; }
		.searchDrop .select:hover .selected, .searchDrop .select .selected b,#menuSearchDrop .select:hover .selected, #menuSearchDrop .select .selected b {color:var(--hcol);}
	.searchDrop .col3 .selectdrop{width: 610px;}
	.searchDrop .col3 .selectdrop div{height:30px; float:left; width: 180px;}
	.searchDrop .select .selected::after,#menuSearchDrop .select .selected::after { background:transparent;}
	.searchDrop .select:not(.hov):hover .selected::after,#menuSearchDrop .select:not(.hov):hover .selected::after{color:var(--hcol)}
		.searchDrop .additemBtn{margin:2px auto;}
		.searchDrop .additemBtn.on{ background:#EEE; color:var(--hcol);}
			.searchDrop .additemBtn.on b{ transform: rotate(90deg); background-color: var(--hcol); }
	.searchDrop .row{position:relative; height:30px; margin-bottom:6px;}
	.searchDrop .sAction { padding:5px; margin:10px -10px -10px; height:60px; border-radius:0 0 25px 25px; }
		.searchDrop .sAction .btn{margin-right:5px;}
		.searchDrop .sAction .h2back{margin: 1px -5px 0 4px}
	.searchDrop .head{height:23px!important; box-sizing:border-box; margin:0px 0px 6px 0px!important;cursor:pointer; transition:all 0.1s; padding: 5px 10px!important;}
	.searchDrop .head:hover{  background-color:#DDD!important;}
	.searchDrop .blue{font-style:normal!important;}
	.searchDrop .selectdrop{font-style:normal; background:#EEE;}
	.searchDrop .unitVal{position:absolute;right:33px;top:9px;}
	.searchDrop .containerNut .selectdrop{position: fixed;}
		.advAllergens .select, .advCheckbox .select, .advDbSources .select, .ownWrap .select, #ingr-1{width:100%;}
		.autoscale .advAllergens .selectdrop{zoom:86%;}
		.searchDrop .tab{border-radius: 0 0 25px 25px;}

		#nut-1{display:none;}
		.nutWrap .select { width: 100px; border-radius: 50px 0 0 50px;}
		.nutWrap .selectdrop{width:160px;}
		.nutWrap .arrow { height:33px; width:20px; line-height:33px; position:absolute; left:99px; margin-top:1px; z-index:1; }
			.nutWrap .arrow::after{content:'>';}
			.nutWrap .arrow.on::after{content:'<';}
			.nutWrap .select .selected::after{border-radius: 3px;}
		.nutWrap a {display:none;  top:7px; left:155px; background:#fff;}/* #41336->SEP-14-22*/
			.nutWrap a:before{content:'x';}
			.nutWrap:hover a{display:block;}
		.nutWrap input { height:34px; width:110px; position:absolute; left:118px; border-radius:0 50px 50px 0; }

		.orderWrap{margin-top:3px;}
			.orderWrap .select{width:195px;}
			#advSearch .orderWrap .selectdrop div:not(#aBox){width:25%;}
			.orderWrap .attrSearch { position:absolute;  right:0px;}
			.orderWrap .arrDown { white-space:initial; display:block; margin-top:-2px; }
				.orderWrap .arrDown:before { content:'za'; width:7px; word-wrap:break-word; line-height:8px; font-size:8px; display:inline-block; text-align:right; }
				.orderWrap .arrDown:after { content:'\2193'; display:inline-block; font-size:17px; vertical-align:super; }
			.orderWrap .attrSearch.asc:not(:hover) .arrDown { color:var(--h3col); }

		.nutWrap .arrow:hover,.circlebtn:hover{color: var(--bgcol3); background-color: var(--h2col);}

		.advCheckbox .selectdrop, .advDbSources .selectdrop {width:412px; overflow-y:hidden!important;}
		.advDbSources .selectdrop.overflow-y{width:612px; overflow-y:auto!important;}
		.advCheckbox .selectdrop.overflow-y{width:422px; overflow-y:auto!important;}
		.advAllergens .selectdrop.overflow-y{overflow-y:hidden!important;}


		#advSearch .selectdrop div:not(#aBox) {width:50%; float:left; text-align: left;}
		#advSearch .select.hov .sHead { display:none; }
		#advSearch.searchDrop .sAction .h2back, #advSearch.searchDrop .sAction .btn{margin: unset}
		.advCheckbox label, .advDbSources label{background-color: transparent!important}
		.advCheckbox .selected span, .advDbSources .selected span { background:#eee; padding:4px 9px; font-size:11px; margin-right:4px; position:relative; top:-1px; font-weight:bold; border-radius:30px; color:#777; font-style:normal; }
			.advDbSources .selectdrop{ width:600px; }
			.advDbSources .selectdrop label{ white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
			.advDbSources .selectdrop .medText{vertical-align:middle; border-right:solid 1px #CCC; width:60px; display:inline-block}
			.advDbSources .selectdrop p{  font-size:11px; line-height:120%; float:right; width:175px; white-space:normal; height:20px; margin:1px 0 0;}

		.advAllergens .select .selectdrop{width:400px;}
		.advAllergens .select.hov .selectdrop{text-align:center; height:490px; max-height:490px; overflow-y:hidden;}
		.advAllergens #aBox{padding:0;background:#FFF;text-align: center; white-space: normal; overflow:visible;}
		.advAllergens #aBox svg {vertical-align: top}
		.advAllergens #aBox .allergenicon span {height: 30px; }
		.advAllergens .selected span { padding:4px 9px; color:#fff; font-size:11px; margin-right:4px; position:relative; top:-1px; border-radius:30px; font-weight:bold; font-style:normal}

		:not(#menuSummaryBox)>#aBox .spacer{margin-top:10px;}
		#aBox .allergenicon {  color:#666; pointer-events:all; padding:9px 12px 15px; max-height:63px; border-radius: 15px; transition: all 300ms;}
		#aBox label:not(.allergenicon.icon-crustaceans) b{white-space: pre;}
		#aBox .allergenicon b {word-wrap: normal;}
		#aBox .allergenicon.on { background:#CCC; color:#222; border-radius:10px; }
		#aBox .allergenicon.on:hover span{ border-color:#FFF; }
		#aBox .allergenicon span { border:solid 3px #FFF; position: static; box-sizing: content-box;margin-left:-6px;}
		#clientDetails #aBox .allergenicon:not(.on2) span{background-color: #EEE;}
		#clientDetails #aBox .allergenicon:not(.on2) span svg{fill: #AAA;}

		#aBox .allergenicon.on span { box-shadow:1px 1px 5px rgba(0,0,0,0.15);  }
		#aBox .allergenicon:hover { z-index:1; box-shadow:0px 0px 12px #CCC; transform:scale(1.05) }
		#aBox .applybtn { background:#777; position:relative; color:#FFF; width:70px; height:70px; line-height:80px; box-sizing:border-box; padding-left:10px; border-radius:100% 0 0 0px; font-family:arial; font-size:10px; font-weight:bold; text-transform:uppercase; margin-left:294px; }

		#advsearch {border-radius: 0 0 10% 10%;}
		#advSearch .goBtn{text-transform:uppercase; font-size:8px; padding-left:2px;line-height: 50px;}
		#advSearch .goBtn span{cursor:pointer;}
		#advSearch .circleBtn span:nth-child(2) { background:var(--h2col); color:#fff; text-align:center; border-radius:50%; width:40px!important; height:40px!important; line-height:40px;  font-size:10px; position: absolute; left: 175px; }
		#advSearch .containerNut {max-height : 120px}
		#advSearch .containerNut.scrollbar { overflow : hidden auto;}
		#advSearch > .tabmenu {margin:-5px -10px 5px -10px;display:flex;}
		#advSearch > .tabmenu > a{width: 50%;padding: 13px 15px;position: relative;}
		#advSearch > .tabmenu > a > svg{ margin:-9px 5px -7px -20px; }
		#advSearch #aihead {display: flex; align-items: center;}
		#advSearch #aihead > .helpbtn{margin: unset;margin-left: auto;}
		#advSearch #tab-LibroAISearch .form #foodList { overflow-y:auto; display:inline-block; white-space:pre-line; text-wrap:wrap; border:solid 2px #EEE; margin-top:5px; border-radius:20px; width:100%; padding:10px 15px; color:#0089bf; min-height:250px; max-height:calc(var(--maxHeight, 550px) - 180px); margin-bottom: -50px; padding-bottom: 30px }
			#advSearch #tab-LibroAISearch .form #foodList[placeholder]:empty::before {content: attr(placeholder);color: darkgray; }
			#advSearch #tab-LibroAISearch .form #foodList[placeholder]:empty:focus::before {content: "";}
			#advSearch #tab-LibroAISearch .form #foodList:focus{background-color: #FFF;color: #F60;outline:none;border-color: #F60;cursor:default;}
			#advSearch #tab-LibroAISearch .btn.raised:after { content:''; position:absolute; left:53px; border:solid 5px transparent; border-left-color:var(--h3col); top:21px; z-index:-1; }
			#advSearch #tab-LibroAISearch .btn.raised svg{margin: -1px -2px 0 0;}
 		.aiResultQTY {position: absolute;bottom: 10px;left: 78px;}
		.aiResultQTY .roundbtn { display: inline-flex; align-items: center; justify-content: center; }
		.aiResultQTY .b {vertical-align:middle;padding: 2px 5px 2px 5px; border-radius: 0 15px 15px 0; transition: all ease-in-out 300ms; max-width: 110px;display:inline-block;}
			.aiResultQTY .b::before{content: '\25bc';float: right; font-size:9px; margin-left:5px;}
			.aiResultQTY .b:hover {background-color: #0089bf; color: white !important;}

		#results-foodSearch:not(.noscrollbar):has(#aiLookupInput){ padding-bottom: 200px !important; }
		#aiLookupInput {height:auto!important;}
			/* #aiLookupInput .editBTN { background-color: var(--hcol)!important; right: 12px !important; top:27px !important; } */
			#aiLookupInput > span { padding:20px; margin-bottom: 20px; max-height:72px; -webkit-line-clamp:3; line-height:140%; transition:all 350ms }
			#aiLookupInput:hover >span{ max-height: 30vh; display:block; color:var(--hcol); cursor:text; }

		#aiLookupInput .nomatch, #advSearch #tab-LibroAISearch .form #foodList .nomatch {color: #ff0e00; text-decoration: line-through;}

	.nophotos #results-foodSearch .result .src { margin:-13px 0; right:auto; border-radius:0px 50px 50px 0px; font-size:8px; height:16px; }
		.nophotos #results-foodSearch .result .src .srcFlag{padding:0;line-height: 14px;}
		.nophotos #results-foodSearch .result .src .srcFlag span:first-child{float:right;}
		.nophotos #results-foodSearch .result .src .flag{margin:-1px 3px 0 0px;}
		.nophotos #results-foodSearch .result .src.noflag .srcFlag{line-height: 10px;}

	.nophotos #results-foodSearch>div{ height:auto; border-top: solid 1px rgba(0, 0, 0, 0.03); border-bottom: solid 1px rgba(0, 0, 0, 0.03); padding: 10px 0px;}
		.nophotos #results-foodSearch>div.sel{min-height:180px;}
		.nophotos #results-foodSearch>div.sel p{position:relative; margin:8px 55px 0 5px; top:23px; -webkit-line-clamp:3; max-height:45px;}
		.nophotos #results-foodSearch>div.sel.hasCode p{ top:24px; display:inline-block; text-overflow:ellipsis; width:180px; white-space:inherit;}
		.nophotos #results-foodSearch>div p{margin-left:20px; padding:16px 10px; height:auto; }
		.nophotos #results-foodSearch>div .ficon{ margin:17px 0px 0px 8px;}
		.nophotos #results-foodSearch>div.sel .ficon{margin:30px 0px 0px 3px;}
		.nophotos .results div .resultDetail{left:19px; top:80px;}
		.nophotos #results-foodSearch a.viewBTN, .nophotos #results-foodSearch a.editBTN,.nophotos #results-foodSearch a.labelBTN{ width: 28px; height: 28px; top:8px;}
		.nophotos #results-foodSearch a.viewBTN, .nophotos #results-foodSearch a.editBTN{right: 8px;}
		.nophotos #results-foodSearch a.labelBTN{ right:42px; line-height: 25px; }
		.nophotos #results-foodSearch .foodphoto{display:none;}

	.blocklinks{font-size: 10px; text-align:center; display:block}
	#catlinks a, .blocklinks a { display:inline-block; text-transform:uppercase; font-weight:bold; line-height:27px; padding:0 15px; border-radius:50px; transition:background 300ms; }
	#catlinks a:not(.on) svg+span{display:none;}
	.blocklinks a { line-height:30px; padding:0 24px; margin:4px 1px; position:relative; transition:background 250ms; }
		.blocklinks:nth-child(1){margin-bottom:10px;}
			.blocklinks a.on, #catlinks a.on{ color: #FFF; background: var(--hcol); }
			.blocklinks a.on:after{ content:''; border-style:solid; border-width:6px 6px 0 6px; border-color:var(--h2col) transparent transparent transparent; position:absolute; left:50%; bottom:0; transform:translate(-50%,100%); }
			.blocklinks a:not(.lgreybtn):not(.on):hover, #catlinks a:not(.on):hover{ background:rgba(0,0,0,0.07); color:var(--hcol); text-shadow:none;}
			.blocklinks a.roundbtn{margin-left: 5px; font-size: 16px; width: 28px; height: 28px; line-height: 28px; border:0!important; text-shadow: none}
		.blocklinks.groups a{padding: 0 20px 0 20px!important;text-shadow: none!important;}
		.blocklinks.groups a:after,.blocklinks.groups a.on:after{display:none;}
		.blocklinks>strong{ display:inline-block; padding:0 10px; width:55px; }
		#popupcontent .blocklinks { margin:0 auto 10px; padding:0 30px; border-radius:50px; }
		#popupcontent .blocklinks.large a { line-height: 40px; }
			#popupcontent #startMenu .blocklinks{ margin:0 30px; display: inline-block;}
	.pillMenu{ border-radius:50px; display:block; margin:-5px auto 20px auto; padding:0 30px; width:50%; }

	#results-foodSearch>div#catlinks { padding:10px 0; white-space:normal; margin:-5px 0 0; height:auto; font-size: 10px; text-align:center; }
	#results-foodSearch>div#catlinks.pill { padding:5px 0; margin:10px; background:#EEE}
	.results h3.spacer{margin:0; background-color:#FFF8; padding:10px; border-bottom:solid 1px #DDD;}

	.results div:not(.src):not(.aiResultQTY):not(#aiLookupInput):hover{ background-color:#FFF!important;}
	.results div:hover>p{ color:var(--hcol);}
	.results div p{font-size:13px; font-weight:bold; pointer-events: none;}
	.results div b{color:var(--hcol);}
	.results div .delbtn{opacity:0; pointer-events: none; margin: 8px 5px 0 0;}
	.results div:hover .delbtn{opacity:1; pointer-events: all;}
	.results div.sel .delbtn{ margin-top:-20px; background:#FFF;}
	.firstlink{border-top:dotted 1px #999;}

	.emptyList, .results div.emptyList { font-size:14px; font-style:italic; white-space:normal; border:0; color:#AAA; line-height:110%; padding:15px 0!important; margin:30px 20px; text-align:center; height:auto!important; width:auto!important; font-weight:bold; }
		.results div.emptyList{color:#AAA; border-color:#DDD;}
	.results div.emptyList span{font-size:13px; display: block; padding: 7px 10px;}

	.results .ficon0{ margin-top:2px; pointer-events: auto;}
	.results .sel .ficon0{margin-top:0;}
		#results-clientSearch div.sel .delbtn{display:none; }
		#results-clientSearch div.sel{margin-right:-1px; color:var(--hcol); font-weight:bold;}
		#results-clientSearch div.sel::after{content:""; float:right; width: 0; height: 0; border-style: solid; border-width: 5px 0 5px 5px; border-color: transparent transparent transparent currentColor; margin: -22px 0;}

		#results-foodSearch>div.sel { padding:0; min-height:245px; margin:2px; font-weight:bold; border-radius:20px; box-shadow: 0 4px 30px rgba(0,0,0,0.4);}
		#results-foodSearch>div.sel0{ background:#FFF; color:var(--hcol);}
		#results-foodSearch>div.sel div.foodphoto { float:none; width:235px; height:125px; border:solid 5px #FFF; box-sizing:border-box; margin:0; border-radius:20px; }

	#results-foodSearch>div.sel p { white-space:normal; line-height:110%; color:#333; font-weight:bold; position:absolute; top: 130px; left:0; right:0; margin:0; padding:0 15px 0px 15px; height:auto; overflow:hidden; max-height:28px; -webkit-line-clamp: 2}
		.results div .resultDetail{display:none; pointer-events:none;}
		.results div .resultDetail{ display: block; position: absolute; top:158px; left:15px; right:13px; font-size: 10px;}
			#attached div .resultDetail .monVals, #attachPreview div .resultDetail .monVals{float: left; margin:-5px 0 0;}
			#popnest #attached .resultDetail .monVals, #attachPreview .resultDetail .monVals{margin: 0px}
		.result .foodphoto.activity{  background-image:none; border-radius:50px; line-height:100px; text-align:center; scale:0.7; margin-left:-7px; }
			.result .foodphoto.activity svg{ width:55%; }
			#index:not(.nophotos) #results-foodSearch>.result.activity p { padding:20px 10px 10px 0; margin-left:90px; position:static; max-height:none; height:78px; -webkit-line-clamp: inherit;}
			#results-foodSearch>.result.activity.sel { min-height: 150px; z-index: 2; }
			.results div.activity .resultDetail { top:85px; }
			.results div.activity .insertFoodBTN { margin-bottom: -5px; }

		#results-foodSearch a.insertFoodBTN { position:absolute; right:0; bottom:20px; z-index:0; border-radius:50px 0 0 50px; padding-right:14px; }
		#results-foodSearch a.editBTN, #results-foodSearch a.viewBTN, a.labelBTN, #view a.editBTN,#view a.viewBTN,#portionInfo a.editBTN,#portionInfo a.viewBTN{position: absolute; right: 15px; top:12px; background-color:rgba(0,0,0,0.6); width:35px; height:35px; border-radius:50%}
		#results-foodSearch a.editBTN:not(.bluebtn):hover, #results-foodSearch a.viewBTN:hover, a.labelBTN:hover, #view a.editBTN:hover,#view a.viewBTN:hover,#portionInfo a.editBTN:hover,#portionInfo a.viewBTN:hover{ background-color:rgba(0,0,0,0.8);}
		 a.labelBTN{ right:55px;}
		 a.favBTN { top:124px; position:absolute; right:5px; }
		 a.labelBTN span{ position:absolute; width:15px; height:15px; line-height:15px; text-align:center; color:#FFF; bottom:0; right:0; background:#000; border-radius:50%; font-size:10px;}
		 a.labelBTN span:empty{display:none;}

		.foodcode { background-color:var(--h2col); position:absolute; top:0; left:0; padding:0px 15px 0px 10px; line-height: 20px; font-size:9px; color:#FFF; font-weight:bold; border-radius:10px 0 50px 0; cursor:text; }
		.foodcode .flag{ margin: -2px 3px 0 0;}
		.foodcode .noflag{ width:4px; }

		.foodClickBtns{position: absolute; right:15px;  bottom:10px; display:block; z-index:1}
			.foodClickBtns a{margin-left:0px; padding: 9px 15px;}
			a.editBTN, a.viewBTN, a.catBTN, a.labelBTN{background-position: center;background-repeat: no-repeat;color:#FFF; text-align:center; line-height:30px;}
			a.editBTN::before{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-image: url(/media/icon-pencil2.png);background-position: center;background-repeat: no-repeat;}
			a.viewBTN{ background-image:url(/media/icon-i.png);}
			a.catBTN{ background-image:url(/media/icon-category.png);}
			a.labelBTN svg{width: 24px;}
			a.labelBTN{ background-image:none; line-height:32px;}
			.disabled a.editBTN,.disabled a.viewBTN{pointer-events:none; background-color:#CCC!important;}

		.resultDetail strong{color:var(--hcol); padding: 2px 0px 2px 5px; margin: 0 -5px; display: block; height: 24px;}
		.resultDetail em{float:right; max-width: 112px; word-wrap: break-word; white-space: normal; text-align: right;}
		.resultDetail .monVals em{float:none;}
		.resultDetail .monitors { color:#777; position:absolute; top:20px; max-width: 90px; white-space:nowrap; }
			.resultDetail .monitors.monVals { left:90px; }
			.resultDetail .monitors>span{ display: block; height:13px; overflow: hidden; text-overflow: ellipsis; }

		.ficon{ position:absolute; z-index: auto; width: 14px; height: 14px; line-height:15px; background: #AAA; color: #FFF!important; font-weight: bold; text-transform: uppercase; font-size: 8px;  text-align: center; border-radius: 10px; box-shadow: -1px -1px 3px rgba(0,0,0,0.1) inset; text-shadow: 1px 1px 1px rgba(0,0,0,0.2); margin:10px 0 0 -17px;}
		.ficon.shared:after { content: ""; border-bottom: solid 3px #AAA; width: 14px; position: absolute; margin: 4px -10px; border-radius: 12px; height: 12px;}
		.ficon.delisted{background: #CCC;}
		.ficon0{background:var(--hcol);}
		.ficon.pending{opacity:0.4; font-size: 11px;}
		.ficon0.shared:after{ border-color:var(--hcol) }
		tr .ficon{ margin:2px 9px; z-index:1}

		#tree0 .sharedOut:after, .ficon.sharedOut:after, .ficon.sharedIn:after, #attachGroups .sharedOut:after, #tree0 li[data-folderType][data-objid='shared']:after, #attachGroups li[data-folderType][data-objid='shared']:after{ content:'\2794'; width:13px; position:absolute; margin:-6px -19px; border-radius:12px; height:13px; font-size:10px; color:var(--hcol); transform:rotate(35deg); background:#FFF; font-weight:normal; line-height:13px; box-shadow:-1px 1px 4px rgba(0,0,0,0.2); }
		#tree0 .sharedOut:after, .ficon.sharedOut:after, #attachGroups .sharedOut:after { margin:-7px -5px; transform:rotate(-46deg) !important; background:none; box-shadow:none; font-weight:bold; }
		.sel .ficon.sharedIn:after{margin: -11px -10px; background: none; box-shadow:none;}

		.client .ficon.shared{ text-shadow:none; color:var(--hcol); width:8px; height:8px; margin:13px -14px;}
		.client .ficon.shared:after{ margin: -2px -6px;  width: 12px; height: 12px;}

	/*////////////////////////////////////////////////////// COMPARE SEARCH ////////////////////////////////////////////////////////////////////////*/
	#results-foodSearch .compare{height:75px; font-size:15px; color:#333; padding: 10px 0 10px 7px;}
	#results-foodSearch .compare p{ margin-left:0px;  padding-bottom:3px;}
	#results-foodSearch .compare.sel{ min-height:100px; }

/*//////////////////////////////////////// LOG TABLE////////////////////////////////////////*/
.options{box-sizing:border-box;height:40px;padding:7px 10px 4px 10px;background: #EEE;color:#333;line-height:40px;position:fixed;z-index:5; min-width:805px; top:30px; -webkit-transform: translateZ(0); padding: 0;}
	.options>input:not(.searchInput), .options>a, .options>.select, .optionsnest>a, .optionsnest>input, #exportmenu .bluebtn, .options > .btn-container > a{ padding:0 14px; line-height:34px!important; vertical-align:top; border:solid 2px transparent; height:36px; box-sizing:border-box; border-radius:50px; margin:2px 1px; }
	.options>a.greyback:not(:hover):not(.on):not(.sel){background-color:#AAA}
	.optionsnest a.orangebtn { line-height:34px!important; height:34px; margin-top:3px; padding:0 20px; }
	.optionsnest a.orangebtn:after{margin-top:10px;}
	.optionsnest .shortdesc { font-weight: normal; }
	.options>input, .options input:not(.searchInput):not(.submenuFilterInput){font-weight:bold; /* background:transparent; color: #444; */ transition:all 250ms}
	.options>input:hover, .options input:hover{ background-color:#FFF; box-shadow: 0px 0 8px #DDD; }
	.options>input::-webkit-input-placeholder,.options input:-ms-input-placeholder{ color:rgba(0,0,0,0.6);}
	/*.options>input::-webkit-input-placeholder{ color:rgba(0,0,0,0.6);}*/
	/*the following 2 lines are fixing an issue with  FF*/
	.options input#name:placeholder-shown{ background-color:#FFF; border:solid 2px var(--h3col);color:rgba(0,0,0,0.6);}
	.options input#name:focus:placeholder-shown{ color:#FFF;}

	.options>select{  background-position:right -0px;}
		.options>select:hover{ background-position:right -62px; }
		.options>.select{ padding: 0; }
	.skiptranslate+input+input+input+#loading+#menudiv+#wrapper #pane-maindiv .options{top: 70px;} /*FIX FOR GOOGLE TRANSLATE EXTENSION*/
	#addPeriodBTNs { color:#999; display:inline-block; height:40px; overflow:hidden; line-height:38px; padding-right:5px; font-weight:bold; border-top:0; border-bottom:0; }

	#clientListBtn img { width: 15px; margin-right: 5px; vertical-align: text-bottom;}
	.programProgress { width:100px; text-align:center; margin:0 }
		.programProgress .details{ display: inline-block; position: relative; line-height: 35px; white-space:nowrap;margin-left: -5px; /*padding: 0 20px;*/}
		.programProgress .details[onclick]:not(.disabled):hover:before { content:'CANCEL'; background:var(--h3col); position:absolute; padding:0 10px; line-height:17px; border-radius:20px; color:#FFF; font-size:9px; cursor:pointer; left:50%; top:50%; margin:-10px -32px; width:65px; box-sizing:border-box; border:solid 1px #FFF5; }
		.programProgress .details.ended[onclick]:not(.disabled):hover:before{content:'RESTART';}
		.programProgress .details.running[onclick]:not(.disabled):hover:before{content:'STOP';}
		.programProgress .details.active{color:var(--h3col);}
			.programProgress .scheduled{ background:#FFF; color:var(--h3col); padding:2px 12px; border-radius:10px; margin:1px -18px; vertical-align:middle; display: inline!important}
		.programProgress .details[onclick]:hover:active:before{background: var(--hcol);}
		.dayprogress>span { display:inline-block; width:18px; height:18px; border-radius:50%; background:rgba(0,0,0,0.3); color:#FFF; text-align:center; line-height:18px; vertical-align:baseline; }
		.dayprogress>span:first-of-type{background:var(--h3col);}
		.programProgress .helpbtn{ margin:9px -30px;}

	.options .programProgress{ width: auto; padding:0 10px; background:none; display: inline-block;vertical-align: top;}
	.options .programProgress.active{width: auto ; margin-left: 5px; margin-right: 5px;}
	.options .programProgress .scheduled{ margin: 0;}
	.options .programProgress .helpbtn{ margin: 10px 0 0 0;}
	.options .programProgress .details{ margin-left: 0;}

	input#periodInput { width:55px; color:var(--hcol); height:28px; margin:0px -15px 0px; vertical-align:middle; background:#FFF; }
	.options input#name{font-size: 18px; width:300px; float:left;}
	.options input#name::-webkit-input-placeholder,.options input#name:-ms-input-placeholder{ color:var(--h3col);}
	.options input#name:placeholder-shown{ background-color:#FFF;}
	.options input#description{font-weight: normal;width:385px;/* margin-right:7px; */font-style: italic;/* box-shadow: 0px 1px 1px rgba(0,0,0,0.1); */}
	.options input#startdate{ width:110px; }
	.options label.pill{ padding: 5px 15px 5px 8px; }

	.disabled #logTypeBTN {pointer-events:none; color: #999!important;}
	.disabled #logTypeBTN span{color: #999!important;}
	#logTypeBTN b{border-bottom:dotted 1px var(--hcol); color:var(--hcol)}
	/* .options>a.pillbtn{ line-height:32px!important; display:inline-block!important; height: auto; margin: 2px 10px; padding:0 20px; } */


#notesdrop { width:500px; height:250px; padding:10px; background-color:#FAFAFA; position:fixed; left:469px; top:70px; box-shadow:2px 2px 8px 0px #888888; z-index:3; border-radius:0 0 20px 20px; }
	#notesdrop .clearSearch{ margin: -7px;}
	#notesdrop textarea { width:100%; height:208px; padding:20px; color:var(--hcol); border:0; border-radius:20px; margin-top:7px; }

#rClickMenu{border:solid 1px #999; background-color:#FFF; display:none; left:50%; top:50%; position:absolute; z-index:5; min-width:65px; min-height:25px; font-size:8pt; }
	#rClickMenu p{padding:5px; color:#888;}
	#rClickMenu a{display:block; padding:3px; color:#0066CC;}
	#rClickMenu a:hover{background-color:var(--hcol); color:#FFF;}
	#rClickMenu a.smart{border-top:dotted 1px #0066CC;}


/*TABLE*/
.footerPush{height:100px; border:0; background:#FFF!important; border:0!important}
#mainnest.fixed{ padding-top:22px;}
#mainnest.fixed thead#fixedHead{position:absolute/*fixed*/; z-index:1; top:74px; box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.2);}
#mainnest.fixed thead#fixedHead td{padding:0;z-index:1; box-shadow:4px 2px 10px 0px rgba(0, 0, 0, 0.2);}

.opt td.td-del{min-width:40px;}
thead:not(#fixedHead) td.td-del { background:#FAFAFA; }
.meealHeading.opt td.td-del{background:#EEE;}
td.td-food{min-width:370px; padding:10px 15px; font-size:15px; text-align:left!important; position:relative}/* was min-width:330px*/
	td.td-food td.td-food{ min-width:238px; height:25px;}
	td.td-food .r0, td.td-food .r1{margin:-4px 0 0 8px; float:none}
	td.td-food.grabber input{padding-left:18px;}

/* .tabs{overflow:hidden;}
	.tabs a{display: inline-block; background:rgba(0,0,0,0.1); padding: 0 15px 3px 17px; text-transform: uppercase; line-height:25px; border:0; position:relative}
	.tabs a:hover{ background:rgba(0,0,0,0.08);}
	.tabs a:hover:after{ border-color:transparent transparent transparent rgba(0,0,0,0.08);}
	.tabs a.on{background:#FFF; color:var(--h2col); border-bottom:solid 1px #FFF; -webkit-filter:drop-shadow(0px 0px 2px rgba(0,0,0,0.3)); filter:drop-shadow(0px 0px 2px rgba(0,0,0,0.3)); z-index:1; border-radius: 2px 0px 0 0px;}
	.tabs a.on:after{border-color:transparent transparent transparent #FFF;} */
	.fixed #foodLogBTN, .fixed #activityLogBTN{ padding:0px 13px 5px 17px; font-size:8px; }

td.td-text{width:60px; vertical-align:middle; text-align:center}
td.td-link{ vertical-align:middle!important; text-align:center; font-weight:bold;}
td.td-quantity, td.td-optgroup, td.td-measure{width:69px; min-width:69px; padding:0; vertical-align:top; position:relative; padding-bottom:3px; }
td.td-quantity, td.td-optgroup{text-align:center;}
	#mpTable td.td-measure{width:100px; min-width:100px;}
	#mpTable #fixedHead td{text-align:center!important;}
	#pane-maindiv.log td.td-quantity{ width:90px; min-width:90px;background-clip: padding-box; }
	#custoptsTable td.td-quantity{width:90px!important}
	#custoptsTable td{ padding:3px 10px;}
	#pane-maindiv.log th.td-del{ width:20px; min-width:20px; box-sizing: inherit; padding: 8px 9px 8px 31px; overflow:visible; }
		#pane-maindiv.log td.td-del a.clearportion {margin: -12px 0 0 0px; width:21px; display:block;}
		#pane-maindiv.log .td-del>.helpbtn {margin:1px 0;}
	#custoptsTable tr.prefade{opacity:0; transition:opacity 400ms;}

	td.td-optgroup{width:49px;}
	td a.clearportion, td a.chevronBTN{display:none;}
	/*tr.sel .td-quantity a{display:block;}*/
	td.td-quantity input, td.td-optgroup input, td.td-measure input{ height:auto; display:block; position:absolute; text-align:center; padding:10px; font-size:13px; border:0; background-color:transparent; font-weight:bold; color:#777}
	td.td-quantity input{color:var(--hcol);}
	td.td-quantity input[type="time"]{position: static;}
	#metaTable[data-itemtype='logperiod'] td.td-quantity input{position: relative;}
	#metaTable[data-itemtype='food']{border-collapse: unset;}
	a.clearportion{ position:absolute; z-index:1; margin:3px 0 0 54px; padding: 0px 4px 2px 4px; font-size: 7pt; text-transform: lowercase; border-radius:3px; display:none;}
	a.clearportion:hover{ transform:scale(1.2)}
	td:hover a.clearportion{ display:block; }
tr.space td{border-top:0; height: 30px; background:transparent!important;}
	body:not(.meal) tr.space.dragOver td{border-left: 7px solid var(--h3col); background: #EEE}
	body:not(.meal) tr.space.dragOver td:before { content:'\2198 Create a new meal'; font-size:17px; color:var(--h3col); font-weight:bold; line-height:40px; padding-left:15px; }

#logtable tr.sel td input{ position: static; color:var(--hcol); background-color:var(--bgcol3); font-weight: bold;}
#logtable tr .ficon { margin:3px 2px; z-index: 1; }
#logtable tr.special input{ font-style: italic; color: #999}
#logtable tr.special td input{ color:var(--h3col); }
#pane-maindiv thead th, .livepreview tr.thead td, .download tr.thead td{line-height:21px; border:0; vertical-align: middle; background-color:#666!important; color:#FFF; padding:0; border:0; text-align:center; font-size:10px; font-weight:bold; height:21px;}
	#pane-maindiv thead td, #pane-maindiv tr.thead td{color:#777;padding:8px 10px;margin-bottom:0px;font-size:10px;font-weight:bold;border:0;line-height: 23px;border-right:0;}
	#pane-maindiv thead td:first-child, #pane-maindiv tr.thead td:first-child{font-size:19px; font-weight: normal; color:#444; padding-left: 20px;}
#pane-maindiv.log thead td.td-del{min-width:40px; width:40px;}
	.livepreview tr.thead td table{display: inline-block; float: right; width: inherit; margin-right: 20px;}
	.livepreview td span.portionPrice{ padding: 0px 10px; }
	.livepreview td.portionList{ padding:20px; color: #666; background: #EEE;}
		.livepreview td.portionList table{ display: inline-block; }
			.livepreview td.portionList table td{ border:none; margin:0px; padding:1px 10px; }
	.livepreview tr.thead td table span.separator{ padding: 0px 10px; }
	td.td-measure{width:130px; min-width:100px; overflow:visible;}
		td.td-measure input, .select.cmethod{ height:37px; line-height:39px; font-size:10px; padding-left: 0; padding-right: 0;}
		td.td-measure input:focus{ color:var(--hcol)}
		.select.cmethod { width:100%; border:0; box-shadow: none; text-align:center; height: 100%; border-radius: 15px; }
			.select.cmethod:not(.hov) .selectdrop{ padding:0; }
			.select.cmethod.hov .selectdrop{ background:#FCFCFC; line-height:90%; border-radius:25px; width: 400px; transform: translateX(-250px);}
			.select.cmethod .spacer{ display: block; width: 190px; margin: 10px auto 20px; }
			.select.cmethod .selectdrop div{ display:inline-block; width:33%; height:115px; white-space:normal; line-height: 110%; padding: 10px; border-radius:10px }
			.select.cmethod .selectdrop div:hover{background:#FFF!important;}
			.select.cmethod .selectdrop svg{ display:block; margin:auto;}
			.select.cmethod .selected { padding:0 5px 0 0;}
			.select.cmethod .selected:not(.expandView){overflow:hidden !important;padding: 0px 20px;}
				.select.cmethod .selected:after { background:#F9F9F9; height:24px !important; width:24px; border-radius:50px !important; padding:0 !important; line-height:24px; margin:8px 2px; }
				.select.cmethod .selected svg{ margin-top:-3px; }
				.select.cmethod .selected .icon{color: var(--hcol);bottom: 20px;position: relative;left: -10px;overflow: hidden;display: block !important;text-overflow: ellipsis !important; }
			.sel.cmethod .selected{color: var(--hcol);position:relative;overflow:visible; display: block;width: 70px; text-align:center;}
				.sel.cmethod .selected .icon{color: var(--hcol);bottom: 10px;position: relative;left: -10px;overflow: hidden;display: block !important;text-overflow: ellipsis !important;}
#activityUnavailable, #foodUnavailable{display:none;}
#pane-maindiv.activity #activityUnavailable, #pane-maindiv.food #foodUnavailable{ display:block; }
#pane-maindiv.food #activityBody,#pane-maindiv.recipes #activityBody { display:none; }
#pane-maindiv.activity #foodBody{ display:none; }
/*#pane-maindiv.activity.meal .periodName::after{content:'Session';}*/
/*#pane-maindiv.activity.meal .periodName span{display:none;}*/



.custopts{clear:both;}
.metaTable { table-layout:fixed; margin:15px; border-radius:0 0 30px 30px; }
	.metaTable td{width:50%!important;}
	.metaTable input, .metaTable select{ width:100%!important; margin:0!important; border:0!important; padding: 0 10px!important; line-height:30px; font-weight:bold; font-size:13px!important; color:var(--hcol); text-align:left!important}
	.contextMenu .metaTable a{padding: 4px 15px;}
	.metaTable.disabled #s_customField+label{display:none;}
	.metaTable.disabled {opacity:0.7; pointer-events:none;}
	.cfHeader{ max-width:144px; display: inline-block; vertical-align:middle;}

	.metaTable input[type=checkbox]{  margin-left: 44px; position: absolute; z-index: -1; display:inline-block!important; }
	/* #weightbox .metaTable:not(.disabled) *{pointer-events:all!important;}  this was making textare btn clickable*/
	.metaTable span.periodText{ color: #777; float: right; }
	#logtable .metaTable{  width:440px; margin-top:10px; border-right: solid 1px #EEE;}
/*		#logtable .chevronBTN{margin:-10px 0;}
		#logtable .sel .chevronBTN:not(.on){margin: -26px 0px; padding-top: 30px;}*/
		td:hover a.chevronBTN{display:block;}
		.greyHead td{ background-color:#EEE!important; color:var(--hcol)!important; text-transform:uppercase; font-weight:bold; font-size:10px;}
		span.fr.customiseCnt{ margin:4px 5px 0 0; position:absolute; right:0; }
			.customise.on svg{ display:none; }
			.customise.on:not(:hover) { background: #AAA; }
			.customise.on:after{ content:'OK'; }
		.excl.error.logfood{display:inline; margin: 2px 0 0 3px}
		.metaTable td{padding:5px 10px; height:auto; border:0; border-top:solid 1px #EEE; font-size:10px; line-height:20px; font-weight:bold; line-height:20px}
			tr.sel .metaTable tr td, .metaTable tr td{background:#FFF; border: solid 2px #FAFAFA;}
		.metaTable td.td-food { padding:10px; }
		.metaTable td.td-quantity, .metaTable td.td-optgroup{text-align:center; padding:0}
		.metaTable td.td-quantity input, .metaTable td.td-optgroup input{padding:5px; margin:0; border-left: solid 1px #EEE;}
		.metaTable td.td-del{background:#FFF; padding:0 5px}
		.metaTable tr.cfieldhead td { border:0; background:#EEE!important; padding:5px 5px 4px 15px; border-radius:50px; }
		.metaTable tr.cfieldhead td>span{  line-height: 30px;}
		.metaTable td.td-food span.ficon.sharedIn{position:initial; background:none; box-shadow:none; text-shadow:none; margin:0px 1px 5px 15px; width:0px; height:0px;overflow: hidden;}
		/* .metaTable td.td-food span.ficon:after{ margin: -20px -19px;} broken on cfields ingredient popup*/
		.foodCreator .metaTable .whitebtn{width:100%}
		#logtable .metaTable tr td.td-quantity input{ padding:8px; background:none; border: 0;}
		tr.opt .td-food span{float:right; text-transform:uppercase; font-size:8px; display:inline-block; padding:2px; color:#CCC;}
			.td-food .helpbtn{ margin: -28px 2px; color: #FFF!important; }
			tr.opt.o1 .td-food span, tr.opt.o1 td.td-optgroup input, #logtable .metaTable tr.opt.o1 td.td-quantity input{color:var(--hcol);}
			tr.opt.o2 .td-food span, tr.opt.o2 td.td-optgroup input, #logtable .metaTable tr.opt.o2 td.td-quantity input{color:#900;}
			tr.opt.o3 .td-food span, tr.opt.o3 td.td-optgroup input, #logtable .metaTable tr.opt.o3 td.td-quantity input{color:var(--h3col);}
			tr.opt.o4 .td-food span, tr.opt.o4 td.td-optgroup input, #logtable .metaTable tr.opt.o4 td.td-quantity input{color:#FC0;}
			tr.opt.o5 .td-food span, tr.opt.o5 td.td-optgroup input, #logtable .metaTable tr.opt.o5 td.td-quantity input{color:#6C0;}
			tr.opt.o6 .td-food span, tr.opt.o6 td.td-optgroup input, #logtable .metaTable tr.opt.o6 td.td-quantity input{color:#963;}
			tr.opt.o7 .td-food span, tr.opt.o7 td.td-optgroup input, #logtable .metaTable tr.opt.o7 td.td-quantity input{color:#96C;}
			tr.opt.o8 .td-food span, tr.opt.o8 td.td-optgroup input, #logtable .metaTable tr.opt.o8 td.td-quantity input{color:#F66;}
			tr.opt.o9 .td-food span, tr.opt.o9 td.td-optgroup input, #logtable .metaTable tr.opt.o9 td.td-quantity input{color:#99F;}
			tr.opt.o10 .td-food span, tr.opt.o10 td.td-optgroup input, #logtable .metaTable tr.opt.o10 td.td-quantity input{color:#690;}
			table select{  height: 32px; width:100%; border: 0; color:#666; background-color:transparent;}
		#logTableWrap tr.customising th.td-food{position:absolute; z-index:3; box-shadow:1px 3px 10px rgba(0,0,0,0.7); border-radius: 25px; background:#FFF; }

	div#newMetaPeriodPop table{ margin-left:-10px; }
	div#newMetaPeriodPop table{ border-bottom:solid 1px #CCC; }
	div#newMetaPeriodPop table tr:hover td{ background-color:transparent; }
	div#newMetaPeriodPop .metaTable{margin:auto;}
		div#newMetaPeriodPop .metaTable td{ padding-right:1px; }
		div#newMetaPeriodPop label:hover, div#newMetaPeriodPop .label:not(.pane):hover{ background-color: transparent; }
		div#newMetaPeriodPop #addCustomField{clear:both;}

	.lockedCField td,.lockedCField *:hover, .lockedCField td *,.lockedCField:hover td{ font-weight:bold!important; color:#AAA!important; font-style:italic; border-right:0!important; cursor: not-allowed!important;}
	.lockedCField .whitebtn{pointer-events:none!important;}
#countryOrigin td:last-child{padding: 0px; border-left: 1px solid #ccc;}
	#countryOrigin #cooTable{border-bottom:none;}
	#countryOrigin #cooTable #newCountrySelect{width: 80%!important;}
	#countryOrigin #cooTable .bluebtn{display: inline-block; padding: 5px 10px 3px 10px;}
	#countryOrigin #cooTable .td-quantity:after{right:60px;}
	#countryOrigin #cooTable .delbtn{color: #777;border: solid 2px #e5e5e5;}


	#metaPeriodName{ width:350px; display: inline-block;}

	#sortLog{ position:relative; z-index:0; right:-15px; }

	.chevronBTN{display: block; font-size: 9px; padding:13px 5px; z-index: 1; position: absolute; right: 0; width:20px; font-weight: bold; color: #AAA; background-color: #EEE; transition:padding 400ms; border-left:solid 1px #EEE; height:auto; box-sizing:border-box;}
	.chevronBTN:before{content:"◄";}
	.chevronBTN.on:before, .chevronBTN:active:before{content:"▼"; color:var(--hcol);}
	.chevronBTN.on{padding:18px 20px 8px 13px; height:auto; color:var(--hcol); border-color:#CCC;}
	.chevronBTN:hover{color:var(--hcol); background:#FFF; border-color:#DDD}


.sortBTN{color:var(--hcol); border-bottom:dotted 1px var(--hcol); line-height:100%; display:inline-block!important;}
	.sortBTN:hover{color:var(--h2col); border-color:var(--h2col)}
	.sortBTN svg{ margin: -5px 5px 0 -10px; }
	.sortBTN.hidden{display:none!important}
#sortnote{color:#888; float:right; font-style:italic; font-weight:900;}
#curSortRecipe::before{ content:'';	position:absolute;width:75px;height:42px;right:0;top:0; }

#dropPortionMenu { width:495px; min-height:170px; pointer-events:all; overflow:visible; background:#FFF; border-left:solid 1px #CCC; transition:all 300ms; border-radius:20px 20px 50px 50px; }
#dropPortionMenu:has( > .spinner) {display:flex;justify-content:center;align-items:center}
#dropPortionMenu #aiPortionBtn{aspect-ratio: unset;height: fit-content;color: #777; font-style: normal;}
#dropPortionMenu div:not(.nophoto) + #aiPortionBtn{position: absolute; left: 15%; bottom: -25px;}
#dropPortionMenu #aiPortionBtn .btn{aspect-ratio: 1/1;}
	#dropPortionMenu::after{ content: ""; position: absolute; border-style: solid; display: block; width: 0; top:-7px; right: var(--arrow-right, 27px); bottom: auto; left: var(--arrow-left, auto); border-width: 0 6px 8px 6px; border-color: transparent transparent var(--h2col) transparent;}
#dropPortionMenu.aiSearchDrop:after, #dropPortionMenu.aiSearchDrop #ptWasteSet{display:none;}
	#dropPortionMenu .tabmenu{ border-radius: 20px; padding-left:3%; margin:0 -5px;}
	#dropPortionMenu .tabmenu a{ padding:15px 30px; }
	#dropPortionMenu .delbtn{ border: solid 2px rgba(255,255,255,0.4); margin: 6px 1px; z-index: 3; position: relative;}
	#dropPortionMenu.openOnPopup {z-index:9;}
	#dropPortionMenu.openOnPopup::after {right:88px;top:-6px;}
	#dropPortionMenu.maximised { left: 250px!important; right: 0px!important; top: 71px!important; position: fixed; width:803px; transition:none;}
		#dropPortionMenu.maximised #portionInput{ margin-top: 105px;  margin-bottom: 100px;}
		#dropPortionMenu.maximised::after{display:none;}
		#dropPortionMenu.maximised #portionInputWaste { margin:-85px 0px 0px -10px; padding:0; text-align:center; }
		#dropPortionMenu.maximised .entrybox:before{ top: 90px;}
		#dropPortionMenu.maximised .entryboxBtn { left: 25px!important; bottom: -5px; box-shadow: none; border:0; }
		#dropPortionMenu.maximised .emptySp{ margin:80px 0 10px 3px; padding:28px 32px;}
	.restoreBtn{ width:38px; height:38px; background-image: url(/media/icon-maximise.png); background-repeat:no-repeat; background-position:center; display: block; position:relative; z-index:1;float: right; transition:background 300ms; background-size:13px;margin-right:15px;}
		.restoreBtn:hover{ background-size:auto; }
		.restoreBtn.min, .maximised>.restoreBtn, .day.on .restoreBtn{ background-image:url(/media/icon-minimise.png); background-size:auto}
		.restoreBtn.min:hover,.day.on .restoreBtn:hover{ background-size:12px}
		/* .maximised .restoreBtn, .on>.restoreBtn{ background-image:url(/media/icon-minimise.png); background-size:auto}
		.maximised .restoreBtn:hover, .on>.restoreBtn:hover{ background-size:12px} */
		#dropPortionMenu.noresize .restoreBtn{ display:none;}
		#tab-SmartPortions .emptySp { padding:12px 32px; width:66%!important; height:104px!important; margin:31px 0 10px 0; background:#EEE; }
		#tab-SmartPortions .emptySp strong{line-height:22px;}
		#tab-SmartPortions .unavailable { padding:7px 20px; font-size:20px; text-align:center!important; line-height:110%!important; height:140px!important; }
		#dropPortionMenu.scaleRecipe{z-index: 8;}
		#dropPortionMenu.scaleRecipe::after{right: 40%;left:auto!important}
	#confirmEdiblePortion{ display:none; position: absolute; background: #DDD; bottom: -3px;  width: 100%;}
		#confirmEdiblePortion.on{display:block;}
		#confirmEdiblePortion p{font-weight:bold; font-size:10px; margin-bottom:3px; color:#444; text-transform:uppercase; padding: 36px 0!important;}
		#tab-SmartPortions #confirmEdiblePortion .bluebtn{margin: 0; font-size: 10px;}

	/*GENERIC TAB MENU:*/
	.tabmenu:not(.starttabMenu){ background:var(--h2col); padding-top:3px;}
		.tabmenu:not(.starttabMenu) a { display:inline-block; padding:13px 25px; color:#FFF; transition:background 300ms; text-transform:uppercase; font-weight:900; font-size:9px; line-height:103%; border-radius:12px 12px 0 0; }
		.tabmenu:not(.starttabMenu) a:not(.on):hover{ background:color-mix(in srgb, var(--h2col), #FFF 10%); z-index:0; line-height:100%; }
		.tabmenu:not(.starttabMenu) a.on{color:var(--hcol); background:#FFF; position:relative; z-index:2}
		.tabmenu:not(.starttabMenu) a.on:not(.smallTab):only-child{background: transparent; color: #fff; display: block; text-align: center;}
	.tabmenu.greyback{ background: #EEE}
		.tabmenu.greyback a:not(.on){color: #666;}
		.tabmenu.greyback a:not(.on):hover{ background: #E5E5E5; color:var(--hcol) }
		.tabmenu.whiteback a:not(.on):hover{ background: #F9F9F9; color:var(--hcol) }
	.tabmenu.whiteback{ background: #FCFCFC; }
		.tabmenu.whiteback a.on{ border: solid 2px #EEE; border-bottom: 0; }
		.tabmenu.whiteback a:not(.on){color: #999; }
	.tabmenu.xl a { font-size:20px; font-weight:normal; text-transform:none; padding:13px 35px; letter-spacing:-0.5px; border-radius:20px 20px 0 0; }
		.tabmenu.xl a.on{ font-weight:bold;}

	.tabmenu.vertical{ width: 30%; height:100%; }
		.tabmenu.vertical a{ display:block; padding:0 15px; text-transform:none; font-size:12px; line-height:45px; position: relative;}
		.tabmenu.vertical a:not(.on):hover{ line-height: 45px; }
		.tabmenu.vertical.whiteback a.on{ box-shadow:0 2px 20px rgba(0,0,0,0.15) }
			.tabmenu.vertical a.on:after { content:""; position:absolute; border-style:solid; border-width:5px 0 5px 5px; border-color:transparent transparent transparent currentColor; right:0; top:50%; transform:translate(-50%,-50%); }
		.tab.vertical{ width: 70%; height:100%; float:right; }
		.tabmenu.vertical.fixed{ position:absolute; top:0; bottom:0; left:0; overflow-y: auto; height:auto; box-shadow:-5px 0 15px rgba(0,0,0,0.05) inset;}


	.tab{display:none; background:#FFF;}
	.tab.on{display:block;}

	/* GENERIC ACCORDION MENU */
	.accordion>span { display: block; }
		.accordion>span:before {content:''; display: inline-block; border-style:solid; border-width:4px 0 4px 6px; border-color:transparent transparent transparent currentColor; display:inline-block; margin:0 5px 0 -12px;; transition: transform 200ms; overflow: hidden;}
		.accordion>span:hover, .accordion.on>span  { color: var(--h2col); }
		.accordion>span>svg { margin-top: -3px; }
		.accordion.on>span:before { transform:rotate(90deg); }
		.accordion .drop{ max-height: 0; margin-left: 10px; line-height: 30px; overflow: hidden; transition:max-height 300ms}
		.accordion.on .drop{ max-height: 200px; overflow-y: auto; clear:both; }

	/* GENERIC CHOICE PANELS */
	.choicePanel>div {transition:box-shadow 200ms; box-shadow:1px 1px 10px #ccc; padding:15px 15px 15px 30px; margin:5px 0; border-radius: 25px}
		.choicePanel>div:hover { box-shadow: 1px 1px 5px #777; }
		.choicePanel.pills>div { border-radius: 25px }
			.choicePanel.pills>div:hover{ font-weight: bold; }
		.choicePanel.blocks>div {  border-radius:15px; display:inline-block; width:140px; vertical-align:top; } /* not yet in use */
		.choicePanel .drop{line-height: 120%; font-size: 11px;}
		.choicePanel .pillbtn.fr{ margin-top: -5px; margin-bottom:5px;}

	/* GENERIC MINI FEATURE PILLS */
	.minifeature{ display:inline-block; background:#EEE; margin:1px; border-radius: 10px; padding:3px 10px; font-size: 11px; font-weight: bold;}
		.minifeature.check:before{content:'✔'; margin-right: 5px; }

	/*SLIDE TABS: a simple 2 slide menu slider*/
	.slideTabs{white-space: nowrap; overflow: hidden; vertical-align: top; }
		.slideTabs *{white-space: normal;}
		.slideTab {display:inline-block; position: relative; width: 100%; transition:transform 500ms; will-change: transform}
		.slideTabs.on .slideTab{transform: translateX(-100%);}

	#startMenu.slideTabs{  margin:-35px -50px -35px; padding-top:40px; min-width:850px; }
		#startMenu .slideTab { min-height:460px; transition:height 300ms;}
		#startMenu .bigIconMenu > div:not(.submenu){margin-bottom: 50px;position:relative;}

	#tab-SmartPortions{color:#777; white-space: normal; padding-bottom:10px; margin:2.5px; background:transparent; }
	#tab-SmartPortions:has(#aiPortionBtn:not(.nophoto)) .entrybox { padding-bottom: 55px; }
	#tab-SmartPortions:has(#aiPortionBtn:not(.nophoto)) .entrybox .entryboxBtn {left: -20px !important;}
	.pane.recipe #tab-SmartPortions{ min-height: 155px; }
	#tab-SmartPortions>div { display:inline-block; text-align:center; width:30.9%; height:auto; position:relative; margin:1%; vertical-align:middle; transition:opacity 300ms; aspect-ratio:1 / 1; margin-bottom: 30px; }
	#tab-SmartPortions>div:not(.suggestion)>div{width:100%; height:100%;}
		#tab-SmartPortions .portionphoto { background:url(/media/back-apple.png) #E5E5E5 no-repeat center; background-size: 100%; width: 100%; height:100%; display:block; border-radius: 15px; transition:background 200ms }
		#tab-SmartPortions>div:hover .portionphoto{ background-size: 110%; }
		#tab-SmartPortions .portionphoto:after{ content:''; position:absolute; height:80px; left:-10px; right:-10px; bottom:-40px; }
		#tab-SmartPortions .smart .portionphoto{background-image:url(/media/back-people.png)}
		#tab-SmartPortions b { position:absolute; bottom:3px; left:50%; text-shadow:0 0 10px rgba(255,255,255,1); font-size:11px; background:rgba(255,255,255,0.6); padding:8px 15px; word-wrap:break-word; transform:translate(-50%,0); border-radius:50px; width:96%; color:#555; }
		#tab-SmartPortions b, #tab-SmartPortions strong{color: #333;}
		#tab-SmartPortions .quantity{ position: relative; left: 0; margin-top: -10px; }
		#tab-SmartPortions b span:not(.mname){display:none;}
		#tab-SmartPortions>div:hover{ background:var(--bgcol3);}
		#tab-SmartPortions div:hover .fr{color:var(--hcol);}
	#tab-SmartPortions .fr{ font-weight: bold; color:#DDD; margin-left:8px;}
	#tab-SmartPortions p{padding:5px;}
	#tab-SmartPortions a.roundbtn{ position: absolute; right: 0; bottom: -20px; z-index: 1;}
		#tab-SmartPortions a.roundbtn.minus{ right:auto; left:0 }

	#tab-SmartPortions>div:only-child, .entrybox{ background:#EEE!important; float:right; border-radius:15px 15px 0 0; margin-right: 10px!important;}
		.entrybox:before{content: 'MANUAL ENTRY:'; color:#444; font-size:9px; position: absolute; width: 100%; text-align: center; top:43px; left: 0; font-weight: bold;}
			.unavailable+.entrybox{min-height:90px;}
			.entrybox .greybtn{ box-sizing:content-box; display: inline-block; height: 37px; padding: 0; width: 16px; line-height:40px; color: #FFF; border-radius: 0 20px 20px 0; vertical-align: middle; text-align: left; padding-left: 5px; margin-top: 7px; margin-left:-15px;}
			.entryboxBtn { position:absolute; left:-28px!important; bottom:-50px; box-shadow:0 4px 15px rgba(0,0,0,0.3); border-radius:50px; border:solid 3px #FFF; }
			.entrybox .unitInput{ height:40px; margin:0; vertical-align:middle; text-align:center!important}
			.entrybox .largeTxt { line-height:100%; transform:translate(2px,1px); display:inline-block; }
			#dropInsertBtn{border-left: solid 3px color-mix(in srgb, var(--h2col), #FFF 10%);}
			#dropInsertBtn:only-child{width:190px;}
		.entrybox.activityMode .blue { margin:0px 6px 0 -30px; display:inline-block; vertical-align:middle; }
		.multiplier{color: #FFF; font-weight: bold; font-style: italic; position: absolute; top: 2px; right: 2px; width: 30px; height: 30px; background: var(--h3col); line-height: 30px; border-radius: 50%; overflow:hidden; transition:all 200ms; text-align:center;}
		.multiplier:empty{width:0px; height:0px; top:14px; right:14px;}
		.multiplier span:first-child{ font-size: 8px;}
		.multiplier:hover:before{content:'x'; font-style:normal; display: block;}
		.multiplier:hover span{display:none;}
		.multiplier{left:auto!important;}
		#portionInput{ line-height: 30px; margin-top:55px;  margin-bottom:45px;}
		#portionInput::-webkit-input-placeholder{font-size: 12px; text-transform:none; }
		#tab-SmartPortions .bluebtn{ height: 30px; border:0; box-sizing: border-box; line-height: 30px; padding: 0; display:inline-block; width:50%;}
		#tab-SmartPortions .bluebtn:last-child{ border-left:solid 1px #FFF}
		#tab-SmartPortions .bluebtn:only-of-type{display:block; width:auto; border:0;}
		#tab-SmartPortions .bluebtn span{vertical-align:top;}
		#tab-SmartPortions .bluebtn:hover{background:var(--hcol);}
	#tab-SmartPortions #loadingbar{margin-left:30px;}

	#tab-SmartPortions select#measureUnit { height:100%; line-height:40px; background-size:19px; color:var(--hcol); font-weight:bold; outline:0px; width:45px; border:0; padding-left:2px!important; position:absolute;  max-height:100%; }
	#tab-SmartPortions select#measureUnit:hover{ background-position: right 0px; }

	#tab-SmartPortions>div.nophoto { height:35px; width:310px; margin:0px 140px 0 8px; text-align:left; padding-left:35px; line-height:35px; border-radius:50px; }
	#tab-SmartPortions>div.nophoto:first-child { margin-top:5px; }
		#tab-SmartPortions .nophoto b{ position:static; font-size:12px; color:#555}
		#tab-SmartPortions .nophoto.suggestion b { position:relative; display:flex; }
		#tab-SmartPortions .nophoto.suggestion > div:first-child { flex: 1 1 0; max-width: 60%; }
		#tab-SmartPortions .nophoto .quantity{display:none;}
		#tab-SmartPortions .nophoto b span{display:inline;}
		#tab-SmartPortions .nophoto:not(.suggestion) b span.ellipsis{display:-webkit-inline-box; width:65%}
		#tab-SmartPortions .nophoto a.roundbtn{ bottom:-3px; }
	.nophoto .multiplier{margin-right:40px; left:auto!important}
	.nophoto + .entrybox{position: absolute!important; top: 45px; bottom: -10px; right: 0; aspect-ratio: unset!important; }
		.nophoto + .entrybox:before{ top:18px;}
		.nophoto + .entrybox #portionInput{ margin-top: 31px; margin-bottom: 23px; outline:0px;}
		.nophoto + .entrybox #portionInputWaste{ margin:-10px 0 15px;}
	   #portionInputWaste.smallText.b.disabled::before{background-color: rgba(0,0,0,0.1);}

	#tab-SmartPortions>div.suggestion {width:95%; margin-inline:auto; display:flex; justify-content:start;white-space: nowrap;}
	#tab-SmartPortions>div.suggestion > .src {width: 60px;min-width:60px;}
	#tab-SmartPortions>div.suggestion > .foodName{flex: 1 1 0; overflow: hidden; text-overflow: ellipsis;text-align:end;}

	.bluehead{text-align:center; font-size:7pt;  text-transform:uppercase; font-weight:bold; padding:3px; background-color:var(--h2col)!important; color:#FFF;}
		.bluehead.greyback, .counter.greyback{background-color: #666!important;}

	#tab-CustomFields,#tab-Ingr\.ListFields{min-width:340px; color: #444; background:transparent;}
	/*#tab-CustomFields td{background:#FFF;}*/
	.metaTable tr.yellowback td{background:var(--bgcol3);}
	#tab-CustomFields tr:hover td{ background:var(--bgcol3);}
	#tab-CustomFields td{ min-width:inherit;background-clip: padding-box!important; vertical-align: middle;}
	#tab-CustomFields td input[type='text']{height:30px;}
	#tab-CustomFields tr:last-child td{ border-top: solid 2px #EEE }
	#tab-CustomFields .metaTable+p{margin-top: -13px;}
	a.customFieldBtn { padding: 0px 15px!important; margin: 4px 3px 3px -100px; }
	#newCountryForm:not(.on){display: none;}
		#newCountryForm>label{ margin-left:215px; width: 210px;}
		#updPackCOO{margin: 0px 120px 0px 120px;}
		#updPackCOO #newCountryForm>label{ margin-left:0px;}
		#cooTable .td-quantity:after { content:"%"; position:absolute; right:126px; z-index:2; color:var(--hcol); font-weight:bold; line-height:30px; pointer-events:none; }
		#cooTable input::-webkit-input-placeholder{color:#AAA!important;}
		#newCoo select{width:100%!important;}
		#newCoo .customFieldBtn{ margin-right:10px;}
		#cooTable .delbtn{ margin:5px;}

	/*#customPointers .header{ font-weight:bold; }
	#customPointers .header >*{ padding-left:20px; }*/
	#customPointers .src{ width:80px!important; }
	#customPointers .code{ width:80px!important; }
	#customPointers .delete{ width:40px!important; }
	#customPointers .customFieldBtn{ margin:0px; }


/*NOTESDIV*/
.notesdiv{padding: 0; border: 0; position:relative; max-width:745px;}
	.notesdiv h5{padding-left:25px; padding-right:6px}
	.notesdiv textarea{ font-family:Roboto, Arial, Helvetica, sans-serif; font-size:11pt; width:100%}
	.nicEdit-main{ position:relative; z-index:1; padding:25px; white-space: normal; outline: 0px!important ;width:100%!important;line-height: 140%}
	.nicEdit-main *{ cursor: text; }
	.nicEdit-main li { margin-bottom:10px!important; font-size:12px; line-height:140%; color:var(--h2col)}
	.nicEdit-body.disabled > .nicEdit-main {pointer-events:none; color:#999;}
	.nicEdit-panelContain { border:0!important; min-height:38px; background:#F5F5F5!important; border-radius:50px; }
	.nicEdit-pane{ min-width:200px; border:0!important;}
	.nicEdit-button{margin:7px;}
	.nicEdit-button-undefined{background:transparent;border-color:transparent; box-shadow:none;}
	.nicEdit-button-hover:hover{border-color:transparent!important; background:#FFF!important; transition:background 250ms;}
	.nicEdit-buttonContain{ width: 34px!important; height: 34px!important; opacity:0.3!important; transition:opacity 0.5s}
	.nicEdit-buttonEnabled{opacity:0.7!important;}
	.nicEdit-button-active{ background:#EEE;}
	.nicEdit-buttonEnabled:hover{opacity:1!important;}
			/*.nicEdit-button-active{ background:#DDD!important;  box-shadow: 0px 1px 3px #BBB inset;}*/
		.nicEdit-selectContain {height: 34px!important; width:110px!important;}
		.nicEdit-selectTxt { height:100%!important; line-height:28px; width:inherit!important; font-weight:bold; font-size:10px!important; font-family:roboto!important; text-transform:uppercase; color:#888; }
		#notesrecommendations .nicEdit-selectTxt, .notesdiv .nicEdit-selectTxt{height: 34px!important; line-height:32px; width:inherit!important; cursor:default!important}
		.nicEdit-selectContain>div{height:32px!important; padding-left:15px!important; border-color:transparent!important; border-radius: 50px;}
		.nicEdit-selectContain:hover .nicEdit-selectTxt{ color:var(--h3col)!important; }
		.nicEdit-selectControl{margin-top:6px;}
		#notesClient{transition: background 300ms; font-size: 13px;}
		#notesClient.maximised { position:fixed; z-index:2; top:30px; background:#FFF; width:700px; height:100%; left:200px; max-width:none; }
			#notesClient.maximised .nicEdit-panelContain { width:100%!important; border-radius:0; background:#EEE!important; padding:1px; }
			#notesClient .nicEdit-panel{padding:0 36px 0 13px;}
			#notesClient .restoreBtn { position:absolute; right:0px; background-color:#AAA; border-radius:50%; width:28px; height:28px; margin:5px;}
			#notesClient .restoreBtn:hover{background-color: var(--h3col);}

		tr.noborder td{border:0;}
	.notesdiv h1{font-size:30px; margin:7px 0; font-weight:bold}
	.notesdiv h2{font-size:22px; margin:7px 0;}
	.notesdiv h3{font-size:16px; margin:7px 0; font-weight:bold}
	.notesdiv p{font-size:14px; line-height:120%; margin:10px 0;}
	.notesdiv ul, .notesdiv ol{padding-left: 25px;}
	.notesdiv hr{visibility:visible; margin:15px 0; border:0; border-top:solid 1px var(--hcol);}
	.notesbox{padding:0;}
	.notesbox textarea{width:96%; height:200px; margin:0 -50px 0 0 ; background:#FFF; border:0; }
	.recipeCreator #notesbox textarea{margin:0; width:460px; height:200px}
	#recTable #quidBTN{position: absolute; padding:0 15px; right:1px; z-index: 2; margin:3px; line-height:28px;}

	.simpleTable thead td { font-size:10px; font-weight:bold; border-bottom:solid 1px #EEE; line-height:25px; text-align:center; }
		.simpleTable thead td:first-child{ text-align:left; }
	.simpleTable tr:hover td { background:#F5F5F5; }
		.simpleTable thead tr:hover td, .simpleTable tr.header:hover td  { background:#FFF; }
		.simpleTable tr td:first-child { border-radius:50px 0 0 50px; }
		.simpleTable tr td:last-child { border-radius:0 50px 50px 0; }
		.simpleTable tr.header td { border-top:solid 1px #EEE; }
		.simpleTable tr.shrink { visibility:collapse }

	.simpleTable td { border:0; padding: 2px 5px!important; line-height: 30px}
		#pane-maindiv .simpleTable thead td, #pane-maindiv .simpleTable tr.thead td:first-child { font-size:10px; font-weight:bold; border:0; border-bottom:solid 1px #EEE; color:#777; padding:2px 15px; background:transparent!important}
		.simpleTable .td-food .iconsWrap { position:absolute; left:-8px; top:8px;}
		.simpleTable .td-name { padding:0; min-width: 140px}
		.simpleTable .ellipsis { display:block; max-width: 250px; }
		.simpleTable .td-small { width:100px; text-align: center; }
			.simpleTable .td-small input { text-align: center; min-width: 38px;}
			.simpleTable input[type=checkbox]+label:hover{background: none;}
		.simpleTable input[type=text], .simpleTable input[type=number], .simpleTable select { border:solid 2px #EEE; background-color:transparent; padding:0 15px; border-radius:50px; font-weight:bold; font-size:12px; line-height:35px; height:auto; max-height:none; }
			.simpleTable input[type=text]::placeholder { font-size: 10px; font-weight: bold; opacity: 0; transition:opacity 200ms}
				.simpleTable tr:hover input[type=text]::placeholder, .simpleTable.placeholderVisible input[type=text]::placeholder { opacity: 1; }

	#quidbody{ padding:20px; white-space:normal; line-height: 140%; overflow-wrap: break-word; }
		#quidbody p.ingListFormat{text-align: center;}
		#quidbody .quidTable .ingList {display:block; width:100%;}
		.quidTable .subIng .td-food input { padding-left:30px; font-weight:normal; }
		.recipeCreator .quidTable .subIng .td-food::before {content: ''; width: 4px; background-color: #EEE; position: absolute; bottom: 0; top: -15px; right: calc(100% - (var(--level, 0) + 9px));}
		.quidTable .td-ing { max-width:200px; position:relative; }
		.quidTable .td-hide { min-width:80px; }
		.quidTable .ingListFormat { display:none; }
		.quidTable .bottomLeft .helpbtn.fl{float: left!important;}
		#quidbody .quidTable .simpleTable .td-food { max-width:250px; min-width:250px; position:relative; padding:10px 15px; overflow:visible; }
		#quidbody .quidTable tr.rec input[type=text] { padding-left:13px; background: none;}
		#quidbody .quidTable tr.subRec input[type=text] { margin-left:17px; }
		#quidbody .quidTable tr.rec:not(.subRec) input[type=text] { margin-left:4px; }
		#quidbody .quidTable .detachedIcon { display:none; }
		#quidbody .quidTable tr.subRec .td-food .iconsWrap { margin-left: 17px; }
		#quidbody .quidTable .bottomLeft {margin: 30px 0 30px 0;}
		#quidbody .quidTable .bottomLeft input[type=checkbox]+label:before {width:28px;	height:28px;	line-height:28px;	font-size:15px;}
		#quidbody .quidTable .editQuid { opacity:0; width:28px; height:28px; position:absolute; border-radius:50%; right:60px; background:var(--h2col) url(/media/icon-pencil2.png) 6px center/15px no-repeat; margin-top:-29px; transition: opacity 300ms}
			#quidbody .quidTable tr:hover .editQuid{ opacity:1 }
	#rawNotes{  width: inherit; background: #FFF; white-space: normal; padding:25px;}

		.restoreOriginal {width: 385px;padding: 15px 15px 15px 35px;position: relative;margin-top:20px;text-align:left;}
		.restoreOriginal:before {content:'i'; border-radius:50%; border:solid 2px color-mix(in srgb, var(--h3col), #FFF 20%); padding: 0 7px;position: absolute;left:10px;top:13px;}
			.restoreOriginal .orangebtn {border-radius: 50px !important;padding: 10px 20px;position: absolute;right: 15px;top: 9px;}
			.restoreOriginal .orangebtn:after {content: none;}
	.nicEdit-options{  z-index : 99999; overflow : hidden; position : absolute; top: 38px; box-shadow:0px 2px 20px #AAA; border-radius:10px;}
	.nicEdit-pane>div{border:0!important; padding:3px 10px!important; }
		.nicEdit-pane>div:hover, .nicEdit-pane>div:hover>*{ background-color: #F9F9F9!important; cursor:default!important}
	.nicEdit-options.nicEdit-uploadImg{ left: 310px!important; }/*JUL22 38570 changed left*/

	.editorTd{ position:relative;}
	.nicEdit-poplink { font-weight:bold; padding:0px 0px 0px 22px; box-shadow: 0 1px 10px #DDD; line-height:30px; border-radius:50px 0 0 50px; font-size:10px; background-color:var(--h2col); color:#FFF; position:absolute; visibility:hidden; top:0; right:0px; overflow:hidden; z-index:10; }
	.nicEdit-visible{ visibility:visible!important}
	.nicEdit-poplink a { color:var(--bgcol3); padding:5px 14px; font-size:8pt; transition:background 300ms;}
		.nicEdit-poplink a:hover{background:rgba(0,0,0,0.25);}
		.nicEdit-poplink a.greyLink { color:#FFF; border-radius:50px; cursor: pointer !important; }
		.nicEdit-poplink a.greyLink b { color: var(--bgcol3); cursor: pointer !important; }

		.notesdiv img{cursor:pointer!important; border-radius:10px; height:auto; float:none!important; }
		.nicEdit-main img{border:2px dotted transparent!important; transition:border 200ms; }
		.nicEdit-main img.sel{opacity:0.7; border-color:var(--hcol)!important}
			.nicEdit-main img:hover:not(.sel){border-color:#CCC!important;}
			.nicEdit-main img.off{border-width:1px!important;}
		.nicEdit-main .right, .notesdiv .right{ float:right!important; margin:5px; margin-right:0; }
		.nicEdit-main .left, .notesdiv .left{ float:left!important; margin:5px; margin-left:0;}
		.nicEdit-main .center,.notesdiv .center{margin:0 auto; float:none!important; display:block;}

		.nicEdit-main .small ,.notesdiv .small{ width:100px!important; }
		.nicEdit-main .medium ,.notesdiv .medium{ width:150px!important; }
		.nicEdit-main .large, .notesdiv .large{ width:200px!important;}
		.nicEdit-main .Xlarge, .notesdiv .Xlarge{ width:300px!important;}
		.nicEdit-main .XXlarge, .notesdiv .XXlarge{ width:400px!important;}
		.nicEdit-main .original, .notesdiv .original{  height:auto; }

		.nicEdit-main .on{padding:5px;}
		.nicEdit-main .on:not(.sel){ border:solid 1px #CCC!important; }
		.nicEdit-main .off{ border:0; }
		.nicEdit-body { position:relative; z-index: 1; background:#FFF; margin-left: 15px; width: calc(100% - 30px)!important; min-height:220px!important; border-radius:0 0 25px 25px; border:0!important; box-shadow:0px 2px 25px #EEE; transition:box-shadow 300ms}
			.nicEdit-body:hover, .nicEdit-body:focus , .nicEdit-body:active { box-shadow:0px 2px 15px #CCC; }
				.nicEdit-body.populated .nicEdit-main{ background:#FFF }
				.nicEdit-placeholder{ position:absolute; z-index:0; text-align:center; left:50%; top:48%; transform:translate(-50%,-50%); font-style:italic; font-weight:bold; color:#CCC; font-size:18px; width:75%; }
		.fixEditorHead .nicEdit-head, .fixEditorHead #quidBTN{ position:fixed!important; top:70px; z-index:2; transition: scale 100ms;}
		.fixEditorHead .nicEdit-head:hover{z-index:4; scale: 1.01;}
		.mealplan .fixEditorHead .nicEdit-head,.mealplan .fixEditorHead #quidBTN{top:97px;}
		.log .fixEditorHead .nicEdit-head,.log .fixEditorHead #quidBTN{top:108px;}
		#notesrecommendations-section .nicEdit-body {  margin-left: 0px; }

		.fixEditorHead #quidBTN{right:auto!important;left:910px}
		.fixEditorHead  .nicEdit-options{position:fixed;top: 112px;left: 252px!important;}
		.log .fixEditorHead  .nicEdit-options,.mealplan .fixEditorHead  .nicEdit-options{top:135px;}
		.fixEditorHead .nicEdit-uploadImg{left:729px!important}
		.fixEditorHead  .nicEdit-poplink{position:fixed; top: 112px; left: 663px; right: auto;}
		.recipe .fixEditorHead  .nicEdit-poplink{left:646px!important}
		.log .fixEditorHead  .nicEdit-poplink, .mealplan .fixEditorHead  .nicEdit-poplink{top:134px!important}
		.log .options input#name{width:280px;}
/*//////////////////////////////////////// RDA EDITOR ////////////////////////////////////////*/
#pane-maindiv.RDA{width:664px; overflow-x:hidden;}
.select {width:150px; position:absolute; border-radius: 50px; line-height:40px; cursor: default;}
.select.third{width: 33%;}
.select.third2{width: 66%;}
.select.half{width: 50%;}
	.select:not(.clickable):hover, .select.hov{border-radius:15px 15px 7px 7px; border-right: transparent; z-index:3; }
	#oAllergensFluid .select .selectdrop, #oAllergensSolid .select .selectdrop{min-width:365px!important;width: max-content;}/*AUG22 40249_41735 changed setting current width as min-width and width as max-content to have all the filters in a single row */
		.select .selecttitle{float: left; margin-left: -55px; background: #EEE; display: inline-block; padding: 0px 7px; width: 50px; white-space: nowrap;}
		.select:not(.clickable):hover .selectdrop, .select.hov .selectdrop{ background:#FFF; max-height:300px; overflow-y:auto; }
		.select .selected:not(.flatpickr-calendar .selected){padding-left:5px; padding-right: 20px; color:var(--hcol); display:block; overflow: hidden; position:relative; height: 100%; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
		#labelWizard .select { z-index:1; }
		#labelWizard .select .selected:not(.flatpickr-calendar .selected){ margin-right:0px; }
			.select .selected:not(.flatpickr-calendar .selected)::after{content:"▼"; color:#888; font-size:8px; display:inline-flex;justify-content: center;align-items: center; padding:0 8px 0 5px; background:#EEE; border-radius: 0 50px 50px 0; position:absolute; right:0; top:0; height: 100%; transition:background 300ms}
			.select:hover .selected:not(.flatpickr-calendar .selected)::after{color:#444; background:#EEE;}
			.select:not(.clickable):hover .selected:not(.flatpickr-calendar .selected)::after, .select.hov .selected:not(.flatpickr-calendar .selected)::after{color:#FFF; background:var(--hcol);}
			.select:not(.clickable):hover .selected:not(.flatpickr-calendar .selected)::before, .select.hov .selected:not(.flatpickr-calendar .selected)::before{color:var(--hcol); background:#FFF;}
		.select .selectdrop{ white-space:normal; max-height:0px; overflow: hidden; transition:max-height 300ms; box-shadow: 1px 4px 15px rgba(0,0,0,0.4); border-radius:15px;}
			.select:not(.clickable) .selectdrop.up, .select .selectdrop.up{transform:translate(0,calc(-100% - 35px));}
			.select .selectdrop div{ display:block; background:#FFF; font-weight:bold; padding: 12px 5px 12px 15px; line-height:100%; font-size:12px; transition:all 200ms; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; position: relative; }
			.select .selectdrop div:not(.sHead):hover{background:#F5F5F5; color:var(--hcol);}
			.select .selectdrop div.half{ display:inline-block;}
			.select .selectdrop div label:not(.allergenicon){ font-size:12px; }
			.select .selectdrop div svg.fl{ margin: 0 7px 0 -7px; }
			.select .selectdrop div.on, .select.clickable .selectdrop div:not(.sHead):hover{ color:var(--hcol); }

			.select:not(.clickable):hover:before, .select.hov:before{ content:''; background:transparent; display:block; left:-50px; right:-50px; position:absolute; top:0px; bottom:-50px; z-index: -1;} /*hover overhang helper*/
		.select .selected img{vertical-align: middle; height: 16px; width: auto; margin: -2px 5px 0 10px;}
		.select .selected .hideonclose{display: none;}

		.select.droparrow .selected:after{display: none!important;}
		.select.droparrow:after{ top:3px; }

		.select.pill{line-height:32px; border:2px solid #EEE; box-shadow:none; height:34px; font-size:11px; font-weight:bold; box-sizing:border-box; }
			body .pane .select.pill .selected::after { width:24px; height:24px; line-height:24px; border-radius:50px; right:0px; top:3px; padding:0; text-align: center;}
			.select.pill:not(.clickable):hover, .select.pill.hov{border-radius:25px 18px 0 0}

		.circlePrice.select{position: relative; overflow: visible; border-radius: 50%!important; line-height: 13px;}
			.circlePrice.select.hov{background:var(--h2col); color: #FFF}
			.circlePrice.select:after { content:'▼'; position:absolute; right:0px; top:24px; }
			.circlePrice.select .selectdrop{line-height: 40px; width: 180px; margin-left: -60px; color: #444;font-weight:normal; text-transform:none; }
			.circlePrice.select .selectdrop div{padding-left: 5px }

			/*.select .selectdrop:focus{display:none;}*/
	.group.select{right:0; top:0px; background:none; border:0; width:6px; padding:0 10px; border-radius:0!important; color:#CCC; text-align:right; font-size: 10px; text-transform:uppercase; line-height:22px; box-shadow:none; margin-top:2px; }
		.group.select .spacer{ margin-top:10px; }
		.group.select img { vertical-align: middle; opacity: 0.5; margin-top: -2px;}
	 	.group.select>span { display:inline-block; width:20px; height:20px; text-align:center; border-radius:50px; margin-left: -5px; font-size:7px; background:#EEE; color: var(--hcol)}
		 #searchopts #fgrouplist .group.select>span{margin-left: 11px !important;}
	 	#searchopts #rgrouplist .group.select>span{margin-left: 18px !important;}
		.group.select:hover>span { background:var(--hcol); color:#FFF; border-radius:50px; margin-top: 1px}
		.group.select:hover img{opacity:1;}
		.group.select .selectdrop{background:#555!important; border-radius: 15px; font-weight:900; color:#AAA;overflow-y:auto; white-space: nowrap; min-width:120px; max-width:208px; text-align:left; text-transform:none; margin:0px -10px; position:absolute; right:auto;}
			#groupselect-cgroups.group.select .selectdrop{right: 10px;}
			.group.select .selectdrop div{background:#555; border:0; font-size:12px; padding:0px 20px; line-height:36px}
			.group.select .selectdrop div:last-child{margin-bottom:20px}
			.group.select .selectdrop div:hover{background:var(--h2col); color:#FFF}
		#pane-logSearch .group.select { display: none; }
			.pane.foods #fgrouplist .select, .pane.recipes #rgrouplist .select { display: block; z-index:3; top: 1px; right:auto; left:90px; }
			.pane.recipes #rgrouplist .select { left:165px; }
			#cgrouplist .select{width:60px; margin:8px 0; }
			#cgrouplist .select>span{margin-left: -3px;}

	/* autoComplete */
	input.autoCompleteOn{ border-bottom:solid 2px var(--h3col)}
	.autoCompleteDrop { position:absolute; background:#FFF; z-index:3; width:100%; box-shadow:1px 2px 10px #0007; font-size: 14px; max-height: 1px; opacity: 0; pointer-events: none; overflow-y: hidden; transition: max-height 300ms;}
	.autoCompleteDrop div{ display: table; width: 100%; }
	input.autoCompleteOn+.autoCompleteDrop{ max-height: 200px; opacity: 1; pointer-events: all; overflow-y: auto;}
		.autoCompleteDrop a{ display: table-row; border-bottom: dotted 1px #CCC}
		.autoCompleteDrop a.on, .autoCompleteDrop a:hover{ background: #EEE; }
		.autoCompleteDrop a span{flex-grow: 1; display:table-cell; padding: 10px 20px;}


#cgrouplist .group.select .selectdrop{max-width:215px;}
#RDAgroup .selectdrop{width:200px; margin-left: -70px;}


#newRDAbtn,#newRDArecordbtn{position: absolute; z-index: 3;}
#newRDArecordbtn{ right:100px}
#RDAgroup{margin-left:75px;}

#RDAcontent a#usermanual { pointer-events:all!important; color:var(--h2col)!important; border-bottom:dotted 1px var(--h2col); cursor:pointer; }

#RDAselect{right:240px; width:354px; }
	#RDAselect .selectdrop{border:0!important; width: 431px;}
	#RDAselect table{border-collapse:collapse; width: 100%; box-sizing: border-box; background: #FFF;}
	#RDAselect table td{padding:10px 5px; line-height:100%; font-size:10px}
	#RDAselect table td:first-child{ border-left:0; font-size: 10px; color: #777; font-weight: bold;}

#RDAgroup .selectdrop{width:220px;}
#RDAselect .selectdrop,#RDAselect table{width:550px;}
#RDAselect{width:310px;}
#RDAbutton{ margin: 5px 40px; }

.splitformhead{background:#EEE;  padding:5px 0;}
	.splitformhead label{width:285px; background:none; font-size:9px; float: left; padding:2px 5px 2px 10px;}
	.splitformhead label:first-child{width:210px; margin-right:-9px;}
	.splitformhead label#desc{width: 100%; padding:0 18px 0 10px}
	.splitformhead label textarea, #RDA label input{margin-top:0px;}
	.splitformhead label textarea{font-size: 12px; line-height: 140%; height:65px; width: 100%;}

.splitform{padding: 0 0 20px 0; white-space: normal;}
	.splitform label{padding:2px 5px 2px 10px; display:block; float:left; width:50%; font-size:11px; box-sizing:border-box; line-height: 20px;}
	/* .splitform label input, .splitform label select{float:right; width:200px;} */
		.splitform.threecol label{width:33%;}
		.splitform.threecol label input, .splitform.threecol label select{width:150px;}
	#foodContent.splitform label span {line-height:30px;}
	.splitform label span:not(.helpbtn) span{font-size:9px; font-weight:bold; color:#AAA;}
	.splitform .grouphead{background:#EEE; font-size:10px; text-transform:uppercase; text-align:center; padding:5px; font-weight:bold; margin:10px 0; color:var(--hcol);  }
	.splitform .grouphead:first-child { margin: 0; border:0; }
	.splitform .bluehead{ margin-bottom:10px; padding:4px; font-size:10px}
	.RDA #RDA.form .btn.whiteback{margin:14px 20px 0 0; }
	.form.disabled input, .form.disabled select, .form.disabled textarea {color:#666!important; background:#f9f9f9; cursor: default; pointer-events:none; }
	.form.disabled label:hover{background:none; pointer-events:none;}
	.form.disabled .collabs{pointer-events:all!important;}
	#RDA textarea#description{pointer-events:all!important;}
	.disabled > :not(#subfolder-maindiv) input{ pointer-events:none; cursor:no-drop;}
	.splitform.disabled .whitebtn{border: solid 2px var(--hcol); color:var(--hcol); }
		.splitform.disabled .whitebtn:hover{color:var(--bgcol3);}
	.disabled > :not(#subfolder-maindiv) input, .disabled > :not(#subfolder-maindiv) select,.disabled > :not(#subfolder-maindiv) .select,.disabled > :not(#subfolder-maindiv) .select .selected, .disabled > :not(#subfolder-maindiv) textarea, .disabled > :not(#subfolder-maindiv) a.blueline, .disabled > :not(#subfolder-maindiv) .gbox,/* .disabled > :not(#subfolder-maindiv) .pBarcode, */.disabled > :not(#subfolder-maindiv) input[type=checkbox]+label, .disabled > :not(#subfolder-maindiv) label:has(input){ cursor: default; color:rgba(0,0,0,0.7)!important; pointer-events:none;}
	.disabled .accessWrite input[type=checkbox]+label{ color:rgba(0,0,0,0.3)!important; pointer-events:all !important;}
	.disabled .accessWrite input[type=checkbox]:checked+label:before{ background-color:var(--hcol)!important;}
	.disabled input[type=checkbox]:checked+label:before{background:#777;}
	.disabled #s_beta:checked+label:before{background: var(--hcol);}
	a.enabled{cursor: pointer !important;}
	a.disabled{background-color:#EEE; color:#999; text-shadow:none; pointer-events:none!important;}
		.disabled input:focus, .disabled select:focus, .disabled textarea:focus{background:#DDD; color: #AAA; cursor: not-allowed; }
		a.disabled::after{border-color:transparent transparent transparent #999;}
	.feature-disabled{color:#999; text-shadow:none; filter: grayscale(1); cursor: default;}
	input.feature-disabled{background-color:rgba(239, 239, 239, 0.3);}
	.btn.feature-disabled {background-color: #eee;}
	.btn.feature-disabled:active {transform: scale(1); filter: brightness(1);}
	.feature-disabled:hover{color:#999; transform: scale(1) !important;}
	.editBTN.feature-disabled::before{filter: contrast(0.2);}
	.disabled .bluebtn, .disabled .whitebtn, .disabled .greybtn, .disabled .lgreybtn, .disabled .delbtn, .disabled .basketbtn{display:none!important;}
	#tabmenu.disabled .delbtn{display:block !important;opacity:0.1;pointer-events:none;}
	#settings_account.settings_page.form.disabled .bluebtn{display: block!important;}
	.disabled #exportmenu .bluebtn, .disabled #r .bluebtn, .disabled #owner .greybtn, .disabled #owner .bluebtn {display:inline-block!important; pointer-events: all;}
	.disabled .accessWrite .bluebtn, .disabled .accessWrite .greybtn {display:inline-block!important; pointer-events: all;}
	.disabled .visibleonread{display:inline-block!important;}
	.disabled select{ background:transparent; }
	.disabled .blueline{border:0;}
	.disabled .editable input{background:#FFF!important;}
	.disabled .editable input, .disabled .editable .gbox{cursor:auto; color:var(--hcol)!important; pointer-events:all; }
	#notes-log.disabled{ pointer-events:none!important;}
	.notes.disabled{ pointer-events:none!important;}

	.disabledTbody{ pointer-events:none!important;  }
	.disabledTbody input{color:grey!important;}
#cantEdit { display: inline-block; float: right; margin: 2px 6px; color: var(--hcol); line-height: 34px; font-size: 10px; text-transform: uppercase; font-weight: bold; background: var(--bgcol3); width: 210px; text-align: center; }

#RDAselector{border-bottom: dotted 3px #DDD; padding-bottom:15px; margin-bottom:15px;}


/*//////////////////////////////////////// pane-clientEdit ////////////////////////////////////////*/
#pane-clientEdit #clientDetails{width:300px; padding:20px; padding-top:10px; position:absolute; top:0; bottom:0; left:0; overflow-x:hidden; overflow-y:auto; background:#FFF;}
.client .ficon {background-color:transparent; margin:10px 0 0 -17px;}
.results .client p{padding-left:28px;}
#clientDetails .disabled {color: #777!important; pointer-events:none;opacity:1}
.noClick{pointer-events:none; opacity: 1 !important;}
#clientDetails .smartInsert { left:815px; bottom:20px; opacity:1; pointer-events:auto; }
#checkoutDatePicker + .input {width: 0 !important;margin: 0 !important;padding: 0 !important;}

#pane-clientEdit #clientDetails{ box-sizing: border-box; width:340px; padding:20px; padding-top:10px; position:absolute; top:0; bottom:0; left:0; overflow-x:hidden; overflow-y:auto; background:#FFF; }
	#pane-clientEdit #clientDetails, #pane-clientEdit #clientOverview{ opacity:0; pointer-events: none; transition: width 400ms, opacity 300ms 200ms; }
		#pane-clientEdit.maximised #clientDetails, #pane-clientEdit:not(.maximised) #clientOverview{ width: 100%; opacity: 1; pointer-events: all;border-bottom:6px solid var(--h3col);overflow-y: auto;}
	#clientDetails .disabled {color: #777!important; pointer-events:none;}
	#pane-clientEdit #logs{ transition: transform 400ms }
		#pane-clientEdit.maximised #logs{ transform: translateX(100%); }
	#pane-clientEdit>.delbtn{ position:absolute; right: 10px; top: -35px; transition: right 300ms}
		#pane-clientEdit.maximised>.delbtn{ right:15px; font-size:12px;}
		#pane-clientEdit.maximised .printClientBtn{ position:absolute; right:53px; top:-35px; }
		#pane-clientEdit:not(.maximised) .printClientBtn.roundbtn{ display: none; }

#clientOverview { text-align:center; width:340px!important; padding-top:22vh; background:url(/media/back-watermark-small.gif) no-repeat; height:100%; box-sizing:border-box;  background-position:70px calc(50% - 299px); position:relative; }
	#clientOverview>div{z-index:1;position:absolute; top:50%; margin-top:-50%; width:100%;}
	#clientOverview>div>img { width:130px; border-radius:500px; margin-bottom:15px; background:#FFF; padding:7px; box-shadow:1px 0px 30px #E5E5E5; }
	#clientOverview .headingText { font-size:22px!important; }
	#clientOverview .circleSummary{pointer-events: none;}
	#libroSummary { border:solid 2px #EEE; border-left:0; border-right:0; width:200px; margin:15px auto 0px; padding:20px 0 20px 40px; text-align:left; }
		#libroSummary svg{width: 30px; float: left; margin-left: -40px;}
		#libroSummary svg:not(.orange){ transform: rotate(-10deg) scale(1.35); }
	#clientOverview .editclientprofilebtn{z-index:2;}

#clientDetails .panelbody{min-height:auto;}
	#clientDetails .helpbtn { margin:20px -1px -30px; }
		#clientDetails .helpbtn span{position: absolute;}
	#clientDetails #notes{ height:150px;}
	#clientDetails>.delbtn { position:fixed; left:840px; background:#FFF; font-size:12px; width:37px; height:37px; line-height:37px; z-index:2}
	#clientDetails label > span {z-index: 1;}
		#clientHeader { margin:25px 0 -25px; }
		#clientHeader .toggle{ width: 38px}
		#clientHeader .toggle:before { content:'F'; color:#FFF; background:var(--hcol); border-radius:50px; }
		#clientHeader .toggle.on:before{content:'M';}
		#uploadClientImg { position:fixed; z-index:2; width:270px; height:270px; left:220px; top:40px; background:#FFF; box-shadow:2px 2px 10px #999; border-radius: 4px; border:solid 5px #FFF;}
		#uploadClientImg .delbtn{position: absolute; right:-10px; top:-10px;}
			.clientphoto{width: 100%; height: 100%;}

	#tableID option:not(.on){display: none;}
	#tableID option.occupied{ background-color: #DDD;}

	#stressFactorSliderLabel{ border-top:solid 1px #DDD; border-bottom:solid 1px #DDD; height:69px; padding-top:22px; }
	#stressFactorSliderLabel.focus{ border-color:var(--h3col) }
		#stressFactorSliderLabel>span { position:absolute; z-index:2; top:28px; margin-left: 10px; color: var(--hcol)}
		#stressFactorSliderLabel.on>span{color: #FFF; }
		#stressFactorSliderLabel .noUi-target{width:94%; margin-left:10px;}

	body .noUi-target{height:24px; border-radius:50px; background:#FFF; box-shadow: none; border:solid 2px #EEE;}
		body .noUi-connects{ overflow:hidden; border-radius:50px;}
			body .noUi-connect{background: #DDD; transition:background 300ms}
			body #stressFactorSliderLabel.on .noUi-target .noUi-connect{background: var(--h3col);}
			.c-1-color { background:var(--h2col); }
			body .c-2-color { background:#555; }
			body .c-3-color { background:var(--h3col); }
		body .noUi-handle.noUi-handle { transform:scale(0.96); transition: transform 150ms; border-radius:50px; width:32px; height:32px;  background:#EEE; border:solid 3px #FFF; box-shadow:1px 2px 5px rgba(0,0,0,0.5); }
			body .noUi-handle.noUi-handle:hover:not(:active){ transform:scale(1); background:#DDD; box-shadow:1px 2px 5px rgba(0,0,0,0.8); }
			body .noUi-handle.noUi-handle:active{ transform:scale(0.8); background:#CCC; }
			body .noUi-handle:before, body .noUi-handle:after{display: none;}

		body .noUi-marker-horizontal.noUi-marker-large { height:26px; margin-top:-30px; background:var(--h3col); width:1px; }
		body .noUi-value { color:var(--h3col); font-weight:bold; margin-top:-11px; }
		body .noUi-pips{opacity: 0; transition: opacity 500ms; height: 20px}
			body #stressFactorSliderLabel.on .noUi-target .noUi-pips{opacity: 1;}

		#clientRDA{margin-top: 10px;}
			/*#clientRDA .blocklinks{display:block; margin:1px 0 20px; border: 0;}
			#clientRDA .tabmenu a.on:only-child{display: inline-block;}
			#clientRDA .blocklinks a:not(.roundbtn){ color: #555; background: #E9E9E9; }
				#clientRDA .blocklinks a:not(.roundbtn):hover{ background: #DDD; }
				#clientRDA .blocklinks a.on{ background: #FFF; color: var(--hcol); border-top-color: var(--hcol)}
				#clientRDA .tabmenu a.on:before { content:'\2605 '; display:inline-block; font-size:14px; vertical-align:middle; margin:0 3px 0 -8px; }*/
			#clientRDA .right { width:143px; margin-top:50px; margin-bottom:80px; position:relative; z-index:2}
			#clientRDA .center {text-align: center; margin-bottom:10px; }
			#clientRDA .right .pillbtn { margin-top:75px}
			#clientRDA #pievals { width:240px; margin:75px 0 0 0; position:absolute; left:210px; }
				#clientRDA #pievals strong{ width:87px; display:inline-block; }
				#clientRDA #pievals .infoAvg{margin-top: 0px;font-size: 10px;line-height: 9px;}
				#clientRDA #pievals label{display: inline-block; font-size: inherit;margin-bottom: 0;}
			#clientRDA #calbox { right:auto; top:93px; left:57px; line-height:18px; }
			#clientRDA .circleSummary{margin-top:0; }
				#bmilabel{padding-top: 5px;}
				#bmilabel.high #bmilabelLevel{ color: var(--h3col);}
				#bmilabelLevel{display: block; padding-bottom: 4px; color:#AAA;}
			#genericEnergy { width:215px; }
				#genericEnergy p{ margin-top: 5px;}
			#clientRDA .settingsRdaBars.off{display:none; } /* please dont use .off classes - always use .on and turn it on by default if needed */
			#clientRDA .createClientRDA{display:flex; }
			#clientRDA .createClientRDA.off{display:none; }

			#clientRDA .roundbtn.lgreybtn.off{display:none;}
			.calcs .spacer.round.EERheading{margin-top: 10px!important;}
			.calcs.manualPal>.spacer.round.EERheading:before { display:block; content:'MANUAL ENERGY'; font-size:10px; margin: 0}
			.calcs.manualPal>.spacer.EERheading:before { display:block; content:'MANUAL ENERGY'; font-size:10px; margin: 0}
				.calcs.manualPal>.EERheading>span{display:none}
			.clearManualPal{ display:none; margin-left:5px; margin-right: -25px;}
				.calcs.manualPal .clearManualPal{ display: inline-block; width: 20px; border-bottom: none; }
				.clearManualPal:before{ display: none!important; }
				.clearManualPal:hover{ color: var(--hcol); }
				.clearManualPal svg{ pointer-events: none; left: -10px;}
			#calcFromMacros{ font-size:50px; position:absolute; margin:0px 60px; cursor:pointer; transition:transform 300ms, color 300ms }
				#calcFromMacros.on{ transform: rotateX(180deg); color:var(--h3col); }
				#RDAcontent #calcFromMacros{font-size:13px;margin:0;position:relative;} /*AUG22->36012*/
				#clientRDA .calcFromMacros #updownbox,
					#clientRDA .calcFromMacros .dietExercBar,
					#clientRDA .customtab:not(.calcFromMacros) #manualMacros { display:none!important }
				#clientRDA .calcFromMacros .circleSummary {filter:grayscale(1); opacity:.6; margin-top:-20px;}
				#clientRDA #manualMacros{margin: 61px 17px 0px;display: block;text-align: center;}
				#clientRDA #manualMacros .updownbox{display: inline-table;height: 60px;margin: 2px 5px;}
				#clientRDA #manualMacros .updownbox .spacer{ top: -47px; left: 50%; transform: translate(-50%); }
			#clientRDA .customtab .dietExercBar{display: none;}
			#clientRDA .customtab .dietExercBar.on{display: block;}
			#clientRDA .customtab .dietExercBar .diet{float:left;margin:2px 0 0 6px;z-index: 1545;position: relative;}
			#clientRDA .customtab .dietExercBar .exercise{float:right;margin:2px 6px 0 6px;z-index: 1545;position: relative;}
			/* #clientRDA .customtab .carbProtFatPerc{margin-top: -12px;}
			#clientRDA .customtab .carbProtFatBar .prot{color: #555555}
			#clientRDA .customtab .carbProtFatBar .fat{color: color-mix(in srgb, var(--h3col), #FFF 20%)} */
			#clientRDA .customtab .carbProtFatPerc { margin:-40px 10px 7px; color:#FFF; z-index:1; position:relative; text-transform:uppercase; pointer-events:none; font-size:10px; }
			#clientRDA .customtab .carbProtFatBar .noUi-connect.c-1-color{background: var(--hcol)!important;}

			#clientRDA .customtab .exNutrients .updownbox{padding: 3px;}
			#clientRDA .customtab .labelProps{ margin: -5px -3px 17px; display: block; }
			#clientRDA .customtab .labelProps label .spacer{ left: 24px; margin:9px auto -2px!important; position: initial!important; }
			#clientRDA .customtab .labelProps label{}
			#clientRDA .exNutrients{ overflow:hidden; max-height: 1650px; transition:all 400ms;}
			#clientRDA .exNutrients:not(.on){ opacity:0; max-height: 10px;}
			#clientRDA .exNutrients >span:first-child{margin-top: 10px!important;}
			#clientRDA .customtab .exNutrients .updownbox{display: inline-table; height: 60px;}
			.listClientRAD{margin-top: 20px; margin-bottom: 10px; top: 86px; max-height: 270px; min-height: 200px; overflow-y: auto;}
			.listClientRAD .card.client.on{color:var(--h3col)!important; border-left:solid 4px var(--h3col); font-weight:bold; background-color: #EEE; }

		#clientDetails .form{width:95%; margin:0 auto;}
			.form input, .form textarea, .form select, .form .textarea { box-sizing:border-box; padding:8px 15px; border:solid 2px #EEE; font-size:13px; font-weight:900; display:block; color:var(--hcol); margin:0; width:100%; border-radius:25px; font-family:Roboto, Arial, Helvetica, sans-serif; margin-top:2px; transition:border-color 250ms, color 250ms }
				.form textarea, .form .textarea { padding:15px; }
				.form input:hover, .form textarea:hover, .form select:hover{border-color:#CCC;}
				.form input.large{font-size:18px;}
				.form input.headingText{font-size:22px;  }
			.form select { padding:0 15px; line-height:35px; white-space:inherit; max-height:none; height:auto; }
				.form select.large{ height:38px; line-height:38px;  max-height:38px;}
				.form select.inlineInput{ width:85px; display:inline-block; margin: -8px 5px -8px 6px;}
			#clientDetails input.half{width:117px; display:inline-block}
			#clientDetails input.large { font-size:22px; font-weight:bold; }
			#clientDetails input::-webkit-input-placeholder,#clientDetails input::-ms-input-placeholder
			.unitInput::-webkit-input-placeholder,.unitInput::-ms-input-placeholder{ font-size:12px; font-style:italic; color:#BBB; letter-spacing:normal;}
			#clientDetails .spacer .orangebtn{ position:absolute; right:0; z-index:1; margin:0px 35px; }
			#clientDetails .warningFormula{margin-top:40px;}

		label,.label{display:block; box-sizing: border-box; padding:2px 0; font-size:9px; vertical-align: middle;}
		html {padding:0!important; box-shadow: none!important;} /* fixes padding set to <html> by the previous rule */
			label.fullWidth{width:100% !important; }
		label.half{width: 50%;display:inline-block;}
		label.third{width:33.3%; display:inline-block; }
		label.third2{width:65%; display: inline-block;}
		label.quarter{width:25%; display: inline-block;}
		label.greyback{padding:0 10px; line-height: 30px}
		label.lastlabel{border-bottom:0;}
		label .helpbtn,.label .helpbtn{margin: 2px 0;}

		.spacer.round{ border-radius:50px; }
		.expandbtn:before { content:'▼'!important; transform:rotate(-90deg); transition:transform 300ms; font-size:11px!important; margin:-3px 3px 0px 0!important; display:inline-block; vertical-align:middle; }
			.expandbtn.on:before{transform:none;}

	.bigform label { position:relative; padding:0; margin-bottom:-1px; }
	.bigform label:focus-within {  z-index: 1 }
	.bigform label>span:not([id]){ position:absolute; top:20px; left:13px; font-weight:bold; color:#666; pointer-events: none;}
	.bigform label>span.helpbtn{ right: 13px; top:10px; left:unset; pointer-events: all;}
	.bigform label.r>span { left:auto; right: 0;}
	.bigform label.r input { text-align: right;}
	.bigform input+label{ padding: 20px 0; }
	.form.bigform input, .form.bigform select { box-sizing:content-box; font-weight:900; padding:30px 0 20px 13px; line-height:100%; margin:0 0 -1px; border-radius:0; border-left:0; border-right:0; }
		.form.bigform select { height:28px; padding:25px 0 12px 13px; width:calc(100% - 25px); background: transparent; white-space:nowrap;}
			.droparrow{position: relative; cursor: pointer;}
				.droparrow:after{ content:'▼'; width:24px; height:24px; line-height:25px; position:absolute; top:5px; right:5px; background:rgba(0,0,0,0.1); border-radius:50px;  text-align:center; font-size:7px; pointer-events: none; transition: background 350ms}
				.form.bigform label.droparrow:after{ top:22px; }
			.form.bigform label:hover.droparrow:after{color: var(--hcol);}
			.form.bigform label:active.droparrow:after, .form.bigform label:focus-within.droparrow:after{color: #FFF; background: var(--h3col)}
		.form.bigform textarea { font-weight:bold; padding:34px 0 0 13px; line-height:100%; height:69px; margin:0 0 -1px; border-radius:0; border-left:0; border-right:0; }
	.bigform .label{padding: 0}
		.bigform label .labelTextArea {top : 5px !important; }
		.bigform label .labelTextArea+textarea:focus {box-shadow: 0px -1px var(--h3col) !important; border-top-width: 0px; border-top-width: 15px ;border-top-color: transparent !important;}
		.bigform label .labelTextArea+textarea{border-top-width: 15px; border-top-color: transparent;box-shadow: 0px -1px #e5e5e5; padding-top: 10px;}


	.bigform input+label{ border-bottom:solid 1px #CCC}
	.bigform input::placeholder{ font-size:83%}
	.bigform input.smallInput{padding: 10px 20px; display:inline-block; width:auto; }

	.pillform.panelbody{padding:15px 30px;}
		.pillform header.hflex { border-bottom:solid 1px #EEE; line-height: 30px; margin-bottom: 10px; height: 30px;}
		.pillform .hflex { height:40px; line-height:40px; position: relative; }
		.pillform .accordion {line-height: 40px;}
		.pillform .accordion .drop .hflex { line-height:25px; height:25px; }
		.pillform .col{ width: 30%; margin-right:1%; line-height: 35px;}
		.pillform .col.small{ max-width: 80px; width: auto;}
		.pillform .col.barchart{width:80px;}
		.pillform input, .pillform select { border:solid 2px #EEE; border-radius:50px; background:transparent; padding:0; height:34px; line-height: 34px; }
		.pillform input.large, .pillform select.large { height:50px; line-height: 50px; }
		.pillform .droparrow:after{ top: 8px;}
		.pillform select{ padding:0 30px 0 15px !important; font-size:11px; font-weight:bold; max-height: none; }
			.pillform select option { font-size:14px; font-style:normal; padding:3px; }
			.pillform select:disabled { color: #777; }

	.panelbody>.left, .panelbody>.right{width: calc(100% - 230px); display: inline-block; vertical-align: middle;}
	.panelbody>.right{width:230px; }

	/* COMPONENTS PANEL */
	#components header svg{ margin:-2px 5px 0 -5px;}
	#components header .col.small{margin-right: 30px; text-align: right;}
	#components .col>.delbtn{ margin: 7px 5px 0 -5px; }
	#components .numInput,#components .totals .col.small{ margin-right:30px;}
		#components .numInput input{ width:80px;}
		#components .numInput span{ margin-top:4px;}
		#components .totals{margin-top: 15px;}
		#components .totals .col.small:last-child{margin-right: 1%;}
		#components .col.pack{line-height: 17px;position: relative;}
		#components .col.pack input{border: none !important;}
		#components .col.pack input.editable{border:solid 2px #EEE !important;width:90%;padding:0 10px;}
		#components .col.pack input.editable + .clearportion{top:-3px !important;}
		#components .col.pack:hover .clearportion{top:-12px;right:3px;z-index:2;display:block !important;}
	/* COO PANEL */
	#coobody canvas { cursor: pointer; }
	#countryTooltip { opacity:0; position:absolute; transition:all 250ms ease; background-color:#FFF; box-shadow:0px 0px 25px 0px rgba(0,0,0,0.2); z-index:10; border-radius:50px; padding:10px 20px!important; font-weight:bold; pointer-events:none; }
		#countryTooltip p{ display:inline-block; margin-left:5px;}
	#mapToggle svg {top: 0; bottom: 0; left: 0; right: 0; position: absolute; margin: auto;}
	#cooPanel {padding: 0;}
	#cooWrapper {position:relative}
	#coo-legend-container { white-space: normal; margin: -60px 50px 50px; }
	#coo-legend-container p { display:inline-block; padding:7px 15px; border-radius:50px; background:#FFF; margin:2px; }
		#coo-legend-container p .flag{ margin-right:5px; }
		#coo-legend-container p b{ color:var(--hcol);}
	#tab-cooMap{margin-bottom:60px;}

	/* SUS PANEL */
	.disabled #susWrapper .susPortionCheck, .disabled #susWrapper .susPortionCheck+label {pointer-events: all;}
	.disabled #susWrapper .susPortionCheck:checked+label::before {color: white; background-color: var(--hcol);}
	#susPanel .susProp , #cooPanel .cooProp { line-height:40%; min-height:70px; border-bottom:solid 1px #EEE; padding:10px 0; }
	#susPanel .accordion .drop { margin-left:40px; }
		#susPanel .accordion.on .drop { padding-bottom: 20px; }
		#susPanel.pillform .accordion .drop .col:first-child{ max-width: 185px;}
		#susPanel.pillform .accordion .col.small{ width: 80px;}
		#susPanel .susProp .col>em, #cooPanel select+em{margin-top:-7px; display:block;}
	#susPanel .select { width: 190px; }
		#susPanel .select .grey.fr { margin-right: 10px;}
		#susPanel .selectdrop { width:480px; text-align:left; }
		#susPanel .selected { text-align:left; padding-left:15px;  }
		#susPanel>.left>.helpbtn { margin:10px 30px; z-index: 2; }
		#susPanel .hoverParent#susTransportToYouWrapper { margin:10px 0 5px -10px; width: 510px; z-index: 1; }
		#susPanel .benchmark{ width:18px; height:18px; line-height:18px; text-align:center; font-size:13px; font-weight:900; color:#fff; background-color:var(--h3col); border:1px solid var(--h3col); border-radius:25px; position:absolute; top:20px; right:-20px;z-index:1; }/* #49814 style button alert ! */
		#susPanel .hoverParent { padding-right: 20px; width: 500px; box-sizing: border-box; transition:background 300ms; z-index: 1; }
		.recipeCreator #susPanel .hoverParent { padding-right: 45px;}
		.recipeCreator #susPanel .hoverParent .orangeback.counter{ position: absolute; right: 37px; top: 11px;}
		#susPanel .hoverParent:hover{background:rgba(0,0,0,0.05);}
			#susPanel .hoverBtn { position: absolute; top: -1px; right: 4px; }
		#susPanel .qty { width: 45px; display: inline-block; }
		#susPanel .col.mediumTxt{line-height: 15px;}
	#susBadge, .susBadge{ display:inline-flex; flex-direction: column; align-items: center; position: relative; box-sizing: border-box; padding: 10px; transition:opacity 300ms 250ms, transform 300ms 200ms; }
		#susBadge.prefade, .susBadge.prefade{ transform:scale(0.7); }
		#susBadge .fp_badge.default, .susBadge .fp_badge.default, #susBadge .fp_badge.lowres, .susBadge .fp_badge.lowres { transform:scale(1.1); width: 100%; }
		.susBadge:has(#fp_loaderbox) {position: absolute;right: 15%;top: 50%; transform: translate(-50%, -50%);}
		#fp_loaderbox { position:absolute; left:50%; z-index:0; top:50%; transform:translate(-50%,-50%); width:176px; height:176px; transition:opacity 300ms 250ms, transform 300ms 200ms;}
			#fp_loaderbox.prefade { transform:translate(-50%,-50%) scale(0.7); }
			.fp_icon { position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:70%; filter:grayscale(); opacity: 0.1; transition:filter 300ms, opacity 300ms }
				#fp_loaderbox.prefade .fp_icon{ filter: none; opacity: 1; }
			.fp_loader{fill:transparent; width:100%; height:100%; transform:rotate(-90deg)}
				.fp_loader .outer{stroke: var(--h3col); stroke-width: 16px; stroke-dasharray:5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 8.9 5 1000; stroke-dashoffset:500; transform-origin: center; }
					#fp_loaderbox.on .outer{ animation:fp_dash linear 2s, fp_spin 2s linear 2s infinite; }
				.fp_loader .inner{stroke: #EEE; stroke-width: 16px; stroke-dasharray:5 8.9 }
				@keyframes fp_dash {
				  100%{ stroke-dashoffset:0 }
				}
				@keyframes fp_spin {
				  0%{ stroke-dashoffset:0 }
				  100%{ stroke-dashoffset:0; transform:rotate(360deg); }
				}
	#susSmallBadge, #susMiniBadge{position: absolute;left:-2000px;}
	#susMiniBadge > div {padding: 10px;}
	.panelbody .hflex.pill { padding:0 0 0 10px; margin-right:-15px; }
	.panelbody .hflex.pill .fr { position:absolute; right:-5px; }

	.userimg{width: 70px; height: 70px; border-radius: 50%; position: relative; background: #EFEFEF url(/media/back-person.png) no-repeat center; background-size: contain;}
		.userimg img{width: 100%; height: auto;}
		.userimg .circlebtn{left:50%; top:50%; transform: translate(-50%,-50%) scale(0.8); opacity:0; transition: opacity 300ms, transform 300ms}
			.userimg:hover .circlebtn{opacity: 1;transform: translate(-50%,-50%); }
	#exported .userimg{ margin-top:-80px; }

	#owner, .yellowBanner{background:var(--bgcol3); padding: 20px 28px 20px 15px; min-height: inherit; font-style: italic; color: #B59209; line-height: 16px; margin:10px 10px -25px; border-radius: 50px;}
		#owner .pillbtn{ margin:-12px 25px 0 5px; }
		#owner .card{  font-weight: bold; font-style: normal; font-size: 9px; text-transform: uppercase; padding: 0 25px 0 40px; border-radius: 20px; line-height: 24px; height: 24px; margin: -10px 5px; vertical-align: middle; min-width:inherit; background-position-x:12px; background-color: var(--bgcol3); border: solid 2px #D2C78E; box-shadow: none; opacity:0.85}
		#owner .card:hover{background-color:#FFF; opacity:1}
		#owner a.pillbtn{padding:0px 20px !important;margin: -12px 10px 0 -5px !important;font-size: 9px;}
		#owner a.pillbtn:before{margin:0px !important;}
		#exportPrefsSub #owner, #view.view-menu #owner {max-width: 800px; margin-top: 15px;}
		#exportPrefsSub #owner .pillbtn, #view.view-menu #owner .pillbtn {inset: 0;position: relative;width: unset; height: unset;font-size: 9px;line-height: 40px !important;}
		#clientDetails #owner{padding:10px; line-height: 21px; margin-top:-7px;}
			.removebtn:before{content:attr(data-css-content-removebtn);}
			#clientDetails .removebtn:before{content:'x';}
			#clientDetails .removebtn{ min-width:21px; padding: 0; height:21px; line-height: 21px; position: absolute; right: 15px; z-index: 1; margin-top: 0;}

/* #lPtag{background:var(--h3col); padding:5px 10px; float:right; display:inline-block; color:#FFF; border-radius:30px; margin-top:3px; font-size:10px; text-transform:uppercase; font-weight:bold; margin-left:5px; transition:background 300ms;}
#lPtag:hover{cursor:pointer; background:color-mix(in srgb, var(--h3col), #FFF 20%);} */
#lPtag{position:relative;background:#EEE; padding:7px 12px 7px 25px; float:right; color:#777; border-radius:30px; font-size:10px;  text-transform:uppercase; font-weight:bold; margin-left:5px; transition:background 300ms;}
	#lPtag span{position:absolute; background:var(--h3col); width:30px; height:30px; text-align:center;  line-height:30px; color:#fff; border-radius:30px; font-size:12px; left:-10px; top:-2px;}
	#lPtag:hover{background:#ccc; cursor: pointer;}
	#lPtag:hover span{background:color-mix(in srgb, var(--h3col), #FFF 20%);}
/* #lPtag:after{content:'s'}
#lPtag.lp-1:after{content:''} */
#liveFoods div p:first-child{ font-size:10px; border-bottom:1px dotted #ccc; padding-bottom:10px; padding-top: 10px;}
#liveFoods div p .ficon{ display:inline-block;position:relative; top:-2px; margin: 0px 5px 0px 0px; font-size:7px; width:12px; height:12px; line-height:12px;  }
#liveFoods div p .lpCode a{ font-size:11px; font-weight:bold; display:inline-block; color:var(--h2col); cursor:pointer;}
#liveFoods div p .lpCode.disabled a{pointer-events: none;}
#liveFoods div p .lpCode a:after{content:'\2197';margin-left:2px;}
#liveFoods div p .lpCode a:hover{color: var(--h2col);}
#liveFoods div p .action{text-transform:uppercase; font-weight:bold; font-size:10px;}
#liveFoods div p .action:before{content:'R';}
#liveFoods div p .action.on:before{content:'D'}
#liveFoods div p .moddate{position:relative; padding-left:35px; color:#777; margin-right:5px; text-transform:uppercase;}

#liveFoods div p .moddate:before{content:'delisted'; margin-right:8px; font-style:italic;font-weight: bold;}
#liveFoods div.on .moddate:before{content:'since'; font-style:normal; margin-right:3px;font-weight: normal;}
#liveFoods div.on .moddate:after { content:"● Live"; display:block; color:var(--h3col); position:absolute; left:0px; top:0px; font-weight:bold; }
#liveFoods div p.largeText{padding-top:5px;}
#liveFoods div p.largeText .measure{font-weight: bold;}
#liveFoods div p.largeText .pCode{position:relative; top:5px; right:25px; padding:0px 10px 0px 10px; line-height:17px;background: #ccc;}
#liveFoods div p.largeText .pCode:before{border-color:transparent #ccc transparent transparent;}
#liveFoods div p.largeText .binbtn{ background-size:65%; margin-left:20px; margin-top:-2px; width:30px; height:30px; line-height:30px;}
#liveFoods div p.largeText:hover .binbtn{transform: scale(1);}
#liveFoods div p:last-child{padding-bottom:10px;}
#liveFoods div:not(.on) ,#liveFoods div:not(.on) .lpCode a{color:#aaa!important;}
#liveFoods div:not(.on) .ficon{background:#ccc;}
#liveFoods .pCode:before{border-width: 8px 10px 10px 0px;}
#liveFoods .del.disabled{color:#AAA; border:0;}


#publishingPanel{min-height: 150px; color:#666; }
	.panelLeft{width:78%}
	.panelRight{float:right; width:22%}
	#publishingPanel .panelLeft{width: 58%; }
	.panelbody p.republishMsg{display: none;}
	.panelbody p.republishMsg + i:hover:has(.publishFoodBtn) { position: static; }
	.panelbody .panelLeft p:not(.bannerUnpublished), #validationPanel p { padding:15px 15px 15px 20px; font-weight:bold; position:relative; font-size:12px; border-radius:15px; transition:background 200ms}
	#validationPanel p.approval { border: solid 2px #DDD; color:var(--hcol);}
	.panelbody .panelLeft p:not(.bannerUnpublished):hover, #validationPanel:not(.on) p:hover { background: #F5F5F5; }
	.panelbody .panelLeft p:not(.bannerUnpublished):before, #validationPanel p:before { content:'\2713'; display:block; position:absolute; top:13px; left:-10px; color:#FFF; width:16px; height:16px; line-height:16px; text-align:center; border-radius:50%; border:solid 2px #FFF; font-size:12px; background-color:var(--hcol); margin:1px 0 0 1px; transform:scale(1.2); transition:transform 200ms; }
	.panelbody .panelLeft p:not(.bannerUnpublished):hover:before, #validationPanel p:hover:before { transform:scale(1.4); }
	.panelbody .panelLeft p a:after{content:'...';}
	.panelbody .panelLeft p.warning:before, #validationPanel p.warning:before, .supplier-options ~ #view .helpbtn.warning:has(~ .result) {content:var(--error-count, '!'); color:var(--color, var(--hcol)); background:#FFF; border: solid 1px var(--color, var(--hcol)); margin-top:1px}
	.panelbody .panelLeft p.error,.panelbody.republish p.republishMsg{ display: block; background:var(--bgcol3);}
	.panelbody .panelLeft p.error:before,.panelbody.republish p.republishMsg:before, #validationPanel p.error:before{content:var(--error-count, '!'); background:var(--color, var(--h3col)); border:solid 1px var(--color, var(--h3col))}

	.panelbody .panelLeft p.error a:first-child:after{content:attr(data-css-content-error-fix);}
	.panelbody .panelLeft p.error a:nth-child(2):after{content:attr(data-css-content-error-skip);}
	.panelbody .panelLeft p.error.mismatch a:nth-child(2):after{content:attr(data-css-content-error-contact);}
	.panelbody .panelLeft p.error.verify a:first-child:after{content:attr(data-css-content-error-verify);}
	.panelbody .panelLeft p.error a:after{content:attr(data-css-content-error-fix);}
	.panelbody .panelRight{margin-bottom: 70px;}

	.panelNotification{ position:relative; min-height:54px;}
	.panelNotification .excl:before{ background:var(--h3col); font-style: normal;}
	.panelNotification p{padding:0px 150px 0px 5px; white-space:normal; transform:translateY(-50%); top:50%; position:absolute; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; max-height:36px;}
	.panelNotification div{ position:absolute; top:10px; right:15px; }
	.panelNotification a{font-size:10px; margin-right:15px;}
	.panelNotification button.orangebtn:after{display:none;}


	#publishingPanel .blueline{margin:-2px 0 0 10px;}
	#publishingPanel .roundbtn{position:absolute; bottom:-12px; right:15px;}
	#publishingPanel a.roundbtn.whitebtn.on:hover{background:#FFF!important; transition:none;}
	.publishFoodBtn:after{ content:attr(data-css-content-after); }
.publishFoodBtn.on:after { content:"\27f3" !important; font-size:40px; font-weight:100; animation:rotate 0.8s infinite linear; display:block; transform-origin:48%; margin-left:3px; }
		.publishFoodBtn.h2back:after{ content:"Publish \25b6"; }
		#publishingPanel.republish .publishFoodBtn:after{ content:"REPUBLISH"; }
		#publishingPanel:not(.republish) .showLiveBtn.roundbtn:after{content:'\002714\000020 Live'}
	#publishingPanel + table{margin: 40px 0px 0!important;}
	#publishingPanel .noshow{display:none;}
	#publishingPanel a.roundbtn.greenbtn{background:#281!important; font-size: 24px; position: relative; bottom: auto; right: auto;}
	#publishingPanel .roundbtn.greenbtn:after{content:"\2713"; }
	#publishingPanel .checkpass{font-size: 16px; position: absolute; bottom: 0px; right: 15px;}
	#publishingPanel .delistedCount{margin-left: 70px;color: #CCC;font-weight: bold;font-size: 11px;}

	.publishRemindPanel { z-index:3; width:130px; background-color:var(--bgcol3); height:47px; position:fixed; font-weight:bold; bottom:20px; left:847px; display:flex; align-items:center; justify-content:center; border-radius:30px 0px 0px 30px; box-shadow:0px -1px 10px rgb(0 0 0 / 30%); display:none; border:solid 2px #FFF; }
		.publishRemindPanelWithInsert {left: 790px;}
		.republish .publishRemindPanel, .recheck.publishRemindPanel  { display: flex;}
		.publishRemindPanel p { padding:10px 25px; font-style:italic; line-height:100%; }
		#publishFoodBottomBtn { left: 100px; top: -11px;}
		.publishRemindPanel .roundbtn{ box-shadow:0px -1px 10px rgb(0 0 0 / 30%); }

	#sGateWrapper .tgPanel > div { position:relative; width:220px; }
		#sGateWrapper #sgSettings { z-index: 2; margin: -3px -10px; }
			#sGateWrapper #sgSettings .drop { width: 300px; overflow: visible; white-space: normal; }
			#sGateWrapper #sgSettings label{ font-weight: normal; font-size: 12px; padding:15px 30px}
			#sGateWrapper #sgSettings label:first-child{ border:0; }
			#sGateWrapper #sgSettings .label{ font-weight: bold; }
		#sGateWrapper .panelbody{ min-height: 220px; }
	#sgatesPanel{ margin-top:20px; }
		#sgatesPanel .unavailable{ margin-top:-20px;}
		#sgatesPanel #stages{ display: flex; flex-wrap: wrap; gap: 10px; justify-content: center;}
		#sgatesPanel .panelLeft {min-height: 160px; display: flex; justify-content: center; align-items: center;}
		#sgatesPanel .stage { display:inline-block; width:30px; height:60px; transition:all 250ms  }
			#sgatesPanel .stage:hover{ z-index:2; }
			#sgatesPanel .stage.on   { z-index:3; }
				.folder:has(#footer:not(.hidden)) #sgatesPanel .stage.on, .folder:has(#footer:not(.hidden)) #sgatesPanel .stage:hover, .folder:has(#footer:not(.hidden)) #sGateWrapper #sgSettings, .folder:has(#footer:not(.hidden)) #sGateWrapper .tgPanel #sgateID { z-index:1; }
				.folder:has(#footer:not(.hidden)) #sgatesPanel .stage { z-index:0; }
			#sgatesPanel .stage.lastStageGroup{ margin-right:65px;}
			#sgatesPanel .stage:before{content: '';}
			#sgatesPanel .stage.lastStageGroup:before{ content:''; position: absolute; width: 100px; border-bottom:solid 3px #EEE; top: 20px; z-index:-1; }
			#sgatesPanel .stage .sgUnderbtn{ padding: 15px 0; position: absolute;width: 100px; right:-35px; color:#555; }
				#sgatesPanel .stage:hover .sgUnderbtn { color:var(--hcol); }
				#sgatesPanel .stage.complete .sgUnderbtn{color: #AAA;}
			#sgatesPanel .stage:hover b, #sgatesPanel .stage.on b{ transform: scale(1.1); }
			#sgatesPanel .stage:last-of-type:before{ border-bottom:dashed 3px #EEE; width:100px; }
		#sgatesPanel .delbtn { margin-top: -15px;margin-right: -30px;align-self: center; z-index: 0; }
		#sgatesPanel .stage.active { color: var(--hcol) }
			#sgatesPanel .stage.active b{ background-color: var(--h2col);color: #FFF; font-size: 14px; }
		#sgatesPanel .stage.complete b, #sgatesPanel .stage .complete1{ background-color:#CCC; color: #AAA; }
			#sgatesPanel .stage.complete.approve b svg, #sgatesPanel .stage .complete2 svg{ fill:#006a91; }
		#sgatesPanel .stage.complete.approve b, #sgatesPanel .stage .complete2{ background-color:#fff; border: 1px solid #006a91; }
			#sgatesPanel .stage.complete:before{ border-bottom-color:#DDD; }
		#sgatesPanel .stage.on .drop{ z-index: 1; width:320px; overflow:visible; margin-top:9px; }
			#sgatesPanel .stage > b{ cursor: pointer; margin: 0 -4px; transition:transform 250ms }
			/*#sgatesPanel .stage + .stage{ margin-left: 10px; }*/
			.dragging #sgatesPanel .stage.lastStageGroup:before{ border-bottom: solid 80px transparent; top: -20px;}
				#sgatesPanel .stage.dragOver { border-right:solid 6px #F60; height:44px; padding-left:15px; margin-left:-53px; margin-right:28px; width:130px; }
					#sgatesPanel .stage.dragOver .sgUnderbtn { display:block; right:-5px; }
				#sgatesPanel .stage > b.dragOver{transform:scale(1.5); background: #F60; }
			#sgatesPanel form{ padding: 10px; }
				#sgatesPanel .stage.dropdown > form.drop { max-height: initial; }
				#sgatesPanel form.readonly, #sgatesPanel form.readonly input, #sgatesPanel form.readonly textarea{ background-color: rgb(238, 238, 238)!important; }
				#sgatesPanel form label{ padding: 2px; }
				#sgatesPanel form:before { position: absolute; content:''; top:-8px; border-style:solid; display:block; border-width:0 6px 7px 6px; border-color:transparent transparent var(--hcol) transparent; left:50%; transform:translateX(-50%); }
					#sgatesPanel form.noarrow:before{ left:25px }
				#sgatesPanel form input, #sgatesPanel form textarea{ margin: 0; text-align:center; min-height: 40px; }
				.stageDatePreview{ display:inline-block; text-align:left; vertical-align:middle; margin-left: 5px;}
				#sgatesPanel .stage .containerComment div{ padding: 5px 15px; margin: 2px 0; }
				#sgatesPanel .stage .containerComment:empty{ display:none; }
				#sgatesPanel .stage .card.user{ text-transform:none; width:160px; max-width:160px;text-align: left; }
					#sgatesPanel .stage .card .title{width: 120px;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}
				.spacer.sgStatus{ margin:-10px auto; position: relative; z-index: 1;}
		.markdown2html.form textarea, .markdown2html.form .textarea{ font-size:12px; line-height:140%; height:130px; margin-bottom: 4px !important; }
			.markdown2html.form .textarea{ color:#666; overflow-y: scroll; }
			.markdown2html.form .textarea:empty{ height:46px; }
				.markdown2html.form .textarea:empty:before{ content:'Add Instructions...'; color:#AAA; }
			.markdown2html .sgInstr.editing, .markdown2html .sgInstr:not(.editing) + textarea{ display:none; }
			.markdown2html{position: relative;min-height: 20px;font-weight: normal;}
			.markdown2html .editBtn { position:absolute; right: 4px; bottom: 3px; }

		#sgatesPanel .panelRight{text-align: right; padding-right: 15px; padding-top: 35px;}
			#sgatesPanel .panelRight a#rejectbtn { position:absolute; top:150px; right:10px; }
			#sgatesPanel .panelRight a#rejectbtn.h2back { top:180px;}
		.sgatesPanelContainer table td { padding-top: 10px;padding-bottom: 10px; border: none; }
		.sgatesPanelContainer table tr.lastGroup td, .sgatesPanelContainer table thead td{ border-bottom: 1px solid #EEE; }
		#sgDueDate, #sgDueDate + .flatpickr-input { width:130px }
		.popUpReviewStage .stageName { max-width: 160px; }
		.popUpReviewStage textarea{ padding: 8px 10px; }
		.popUpReviewStage .sgStatus{ display:block; }
		.popUpReviewStage .accordion{ margin-left: 60px; }

	.groups{ min-height: 20px; white-space:normal; padding:10px;}
	#clientDetails .groups{ padding:5px 0; }
	#clientDetails .groups a.newGroup.on { background-color: #fff !important; }
	#clientDetails #groups a.tag{ display:none!important; }
	.groups a:not(.newGroup):not(.clearButton){position: relative; display:inline-block; line-height:24px; padding:0 8px 0 20px; text-transform:uppercase; font-size:9px; font-weight:bold; margin:0 6px 7px 0; background: #EEE; color:#555; position:relative; background: #EEE; border-radius:50px; transition: all 250ms}
		.groups a:not(.newGroup):not(.clearButton)>svg{ margin: -3px 5px 0 -10px}
		#groupsPanel .groups a:not(.newGroup):not(.clearButton) { line-height: 34px; padding: 0 18px 0 30px;}
		#groupsPanel .groups a:not(.newGroup):not(.clearButton):not(:hover),
		#groupsPanel .groups a:not(.newGroup):not(.clearButton):not(.on):not(:hover) .tag { color: #AAA}
		#groupsPanel .groups a.tag{ padding-left:42px!important;}
		#groupsPanel .groups a.on::after{  margin:-2px -13px 0 13px; color: #888}
		#groupsPanel .groups a.on::after:hover{  color: var(--h3col)}
		#groupsPanel .groups a.tag .tag{ left:0px; top:0px; }
	.groups a.newGroup,a.newPortion{ position: relative; top: 3px; font-size: 10px; font-weight: bold; text-transform: uppercase; white-space:nowrap; margin-left:7px;}
		.startscreen a.newPortion { position: initial; } /* Fix bad positioning of add portion button when on label wizard and have no access to publishing panel */
	.groups a.newGroup::after, .groups a.clearButton::after{display:none;}
	.groups a.tag{padding-left:32px!important;}
		.groups a.tag .tag { content:'#'; display:inline-block; background:#FFF; width:30px; height:30px; line-height:27px; color:#333; border-radius:50px; position:absolute; left:-4px; top: -5px; text-align:center; font-size:12px; border:solid 2px #DDD; text-shadow: none; padding: 0}
	#isparentfolder:not(:checked) + label + #selectcolor{ display: none; }

	.groups a:after{ content:'+'; font-size:14px; color:#999; font-weight:bold; text-transform:lowercase; margin-left:8px; vertical-align: middle; margin-top: -2px; display: inline-block; margin-right: -2px;}
		.groups a:hover:not(.newGroup):not(.clearButton){ color:var(--hcol); background-color:#FFF; box-shadow: 1px 1px 10px rgba(0,0,0,0.2);}
		.groups a:hover:after{color:var(--h3col);}
		.groups a.on{ color:#FFF!important; background-color: var(--h2col)!important; box-shadow:none;}
		.groups a.on::after { content:'x'; font-size:11px; margin:-2px -5px 0 5px; background:#FFF; width:14px; height:14px; line-height:14px; text-align:center; border-radius:20px; opacity: 0; color: var(--h3col); transition: opacity 300ms}
		.groups a.on:hover{background-color:var(--h2col);}
		.groups a.on:hover:after{ opacity:1; }
		.groups a.newGroup.on{color: var(--hcol)!important; background-color: #fff; }
		.groups a .sharedIn:after, #tree0 li .sharedIn:after, #tree0 li .sharedOut:after,#tree0 li .systemgroup:after, #attachGroups li .sharedOut:after, #attachGroups li .sharedIn:after, .sfIcon:after, .groups .accordion[data-objid=SH] .nestedgroup::after{content: '\2794'; width: 14px; position: absolute; margin: 2px 0; border-radius: 12px; height: 14px; font-size: 10px; color: var(--hcol); transform: rotate(35deg); background: #FFF; font-weight: normal; line-height: 14px; box-shadow: -1px 1px 4px rgba(0,0,0,0.2); left:0; z-index:1;}
		.groups .accordion[data-objid=SH] .nestedgroup::after { left:5px; }
		/* #groupsPanel .groups a .sharedIn:after,#popupcontent .groups a .sharedIn:after{margin: 10px -18px !important;} */
	.groups .accordion{  padding:5px 30px; border: currentColor solid 2px; border-radius: 20px;margin:3px;position: relative;}
	.groups .accordion.on .drop{  margin-top:3px;margin-bottom: 3px;}
		.groups .nestedgroup{ color: inherit !important; }
		.groups .accordion.dragOver, .groups.dragOver{ border-style: dashed; border-radius:20px}
			.groups.dragOver .tag{ pointer-events:none; }
	#tree0 li li .sharedIn:after, #tree0 li li .sharedOut:after{ left: 24px; }
	#tree0 li li li .sharedIn:after, #tree0 li li li .sharedOut:after{ left: 15px; }
	#attachGroups li li .sharedOut:after, #attachGroups li li .sharedIn:after{ z-index: 0; }
	#tree0 .sfIcon:after { left:24px; background:#FFF url(/media/icon-surefood.png) no-repeat center; content:''; text-indent: -13px; transform:none; background-size:8px; }
	#tree0 li .systemgroup:after { content:''; background:#FFF url(/media/favicons/favicon2.ico) no-repeat; display:inline-block; width:12px; margin-top:0px; left:23px; height:12px; transform:none; color:unset; box-shadow:none; background-size:contain; border:solid 2px #FFF; }
	#groupsPanel .groups .systemgroup::after,.groups a[data-objname='Favourites'] .systemgroup::after, .groups .accordion[data-objid=SY] .nestedgroup::after { content:''; background:url(/media/favicons/favicon2.ico) no-repeat; display:inline-block; width:14px; margin-top:10px; position:absolute; left:26px; height:14px; transform:none; color:unset; box-shadow:none; background-size:contain; z-index:1; }
	.groups a[data-objname='Favourites'] .systemgroup::after{left:-3px;top:3px;margin-top: auto;}
	#groupsPanel .groups a:not(a.tag)[data-objname='Favourites'] .systemgroup::after{left:6px;top:9px;margin-top: auto;}
	.groups .accordion[data-objid=SY] .nestedgroup::after { margin-top: auto; left:5px;}
	#groupsPanel .groups a:not(a.tag) .systemgroup::after {width: 14px; height: 14px; margin:2px 0; left:0}
	.disabled .groups a.on{background-color:#999;}
		.groups a.texture.on{ box-shadow: inset -2px 2px 2px #0001; text-shadow:1px 1px 3px #0004}
			.groups a.texture1 .tag{ color:#777; }
				.groups a.texture1.on{ background:#777!important; }
			.groups a.texture2 .tag{ color:#f492a2; }
				.groups a.texture2.on{ background:#f492a2!important; }
			.groups a.texture3 .tag{ color:#FCCA2B;}
				.groups a.texture3.on{ background:#FCCA2B!important; }
			.groups a.texture4 .tag{ color:#62B36C; }
				.groups a.texture4.on{ background:#62B36C!important; }
			.groups a.texture5 .tag{ color:#f7941e; }
				.groups a.texture5.on{ background:#f7941e!important; }
			.groups a.texture6 .tag{ color:#a0c3e6; }
				.groups a.texture6.on{ background:#a0c3e6!important; }
			.groups a.texture7 .tag{ color:#444;  }
				.groups a.texture7.on{ background:#444!important; }
				.groups a.texture8 .tag{ color:#111;  }/*AUG22 40249 new texture button style for 7 regular*/
					.groups a.texture8.on{ background:#111!important; }/*AUG22 40249 new texture button style for 7 regular*/
	.tag{ background:#DDD; line-height:20px; padding:0 10px; border-radius:50px; display:inline-block; font-weight:900; text-transform:uppercase; font-size:10px; margin:2px; }

	#popupcontent .newGroupInput.on{ position:relative;display:inline; }
		.newGroupInput > input { width:150px; display:inline; border:solid 2px #DDD; border-radius:50px; padding:7px 25px 7px 20px; }
  	.clearButton {position:relative; margin:-18px;}
	#groupsPanel .newGroupInput, #popupcontent .newGroupInput:not(.on),#groupsPanel .groups a:not(.on):not(.on0):not(.fav),#popupcontent .newGroupBtn.on,#popupcontent .newGroupInput.on+a { display:none}

.card { display:inline-block; min-width:80px; height:30px; padding:7px 10px 0px 35px; margin:0 5px 5px 0; background:#FFF url(/media/icon-org.gif) no-repeat; background-position:9px; color:#555; box-shadow:1px 1px 20px rgba(0,0,0,0.1); position:relative; transition:all 250ms; border-radius:50px; font-size:13px; font-style:normal; font-weight:normal; line-height:24px; vertical-align:middle; box-sizing:content-box; border:solid 4px transparent; }
	.card:hover, .squareToggle:hover { color:var(--hcol); box-shadow:0px 1px 8px rgba(0,0,0,0.4); transform:scale(1.05); }
	.card.noicon{ background-image:none; padding-left:10px; }
	.card.groupMember { background-position:50px 12px; padding-left:80px; min-width:130px!important; }
	.card.group { background:var(--bgcol4) url(/media/icon-folder-dark-horizontal.png) no-repeat; background-position:12px 6px; font-weight:bold; }
		.card.group.open{ color: var(--h2col); }
	.card .title{ line-height:100%; display:inline-block; font-weight: bold;}
	.card.user{background-image:url(/media/icon-collab-user.gif);}
	.card.client{background-image:url(/appmob/favicon.ico);}
	.card.libro{background-image:url(/appmob/favicon.ico);}
	.card.org{background-image:url(/media/icon-collab-org.gif);}
	.card.org.disabled{background-repeat: no-repeat;background-position: 10px;}
	.card.menu{background-image:url(/media/icon-collab-menu.gif);}
	.card.viewer{background-image:url(/media/icon-collab-viewer.gif);}
	.card.blank{background-image:none; padding-left:10px!important;}
	.card.claim { background-image: none; padding: 10px 15px; box-sizing: border-box; height: 50px; }
	.card.recipe{background-image:url(/media/icon-chef.gif);}
	.card.log{background-image:url(/media/icon-collab-table.gif);}
	.card.mealplan{background-image:url(/media/icon-collab-table.gif);}
	.card.compare{background-image:url(/media/icon-collab-table.gif);}
	.card.folder{background-image:url(/media/icon-folder-dark.png);}
		.card .counter{ position:absolute; left:19px; bottom:5px; font-size: 10px; background: #444}
			.card:hover .counter{ background:var(--hcol) }
	.card.large{height:100px; width:150px; border-radius:25px; line-height:100%;}
		.card.large .counter{ left:-7px; top:-2px; background:var(--h3col);}
		.card.large .counter.large{ left:-15px; top:-10px;}
		.card.large img{ width:70px; height:auto; display:block; margin:0 auto;}


		.tgPanel .helpbtn{margin:2px 0px 0px 5px; z-index:3; font-style:normal;}
		/*#claims .select {  display:inline-block!important; min-width: 180px; margin-left: -20px; border:0px; transition: all 0.5s; box-shadow: none; background: none;}
		#claims .selectdrop{width:370px; position: absolute;}
		#claims .fullWidth .selectdrop{width:550px;}
		#claims input[type=checkbox]+label{line-height: 36px;}
		#claims .select .selected { border:1px solid #ddd; border-left:0px; max-height:36px; padding-left: 30px; border-radius:0px 15px 17px 0px; line-height:36px }*/

		/*#claims .selected span { font-size:10px; line-height:11px; display:inline-block; padding:3px 10px 0px 0px; color:#444; }
		#claims.disabled {pointer-events:none!important;}*/
		#enabledClaims .card.claim{min-width:165px;}
		.pane.recipe #enabledClaims .claim { z-index:unset!important; }
		#enabledClaims .fullWidth{width:550px;}
		#enabledClaims .fullWidth .selected{min-height: 35px;}
		#enabledClaims h4{display:inline-block;}
		#enabledClaims .hClaim{text-transform:capitalize;}
				#enabledClaims .hClaim:after { border-left:solid 3px #DDD; content:''; transform:rotate(-20deg); display:inline-block; padding:0; height:20px; vertical-align:middle; margin:-5px 0 -7px 7px; }
				#enabledClaims .hClaim:last-of-type:after{display:none;}

		#enabledClaims .claimText { display:inline-block; margin-left:10px; width:600px; vertical-align:text-top; }
		#exported #enabledClaims .spacer{display:none;}
		#exported #labelWizard .claimBadges{margin: 10px 65px; display: grid; grid-template-columns: 1fr 1fr 1fr; float: right;}
		#exported #labelWizard .claimBadges img{height: 90px; padding: 15px 60px;}
		.noClaims { display:inline-block; margin-left:10px; color:#999; font-style:italic; white-space:normal; }

		#claimsbox,#otherClaims {margin-top: 40px;  text-align: left;}
		#claimsbox + #otherClaims {margin-top:0;}
		#claimsbox h4,#otherClaims H4 {display: inline-block;width: 50%;font-size: 8px; margin: 0; vertical-align: top; text-align: left;}
		#hClaims span {display: block;}
		#hClaims:empty{display:none;}
		#hClaims {display: inline-block; margin: 20px 0px; width:470px;}
		#boxWrapper #hClaims {width: 100%; text-align:left; text-transform: initial;}
		.claimText:before{content:'\2605'; padding-right: 5px; position: relative;}

		#claimsbox .claim span, #otherClaims .claim span{ display:inline-block; width:32px; height:32px; }
		#claimsbox .claim .icon, #otherClaims .claim .icon{/* fill:#7b9e35!important;  */ background:#FFF; width:32px; padding:0; margin:-3px -2px 0 0}
		#claimsbox .claim .icon use, #otherClaims .claim .icon use{filter: invert(65%) sepia(38%) saturate(698%) hue-rotate(39deg) brightness(155%) contrast(83%)!important; /*fill:#7b9e35. filter also worked for dom to image plugin*/}

		.claim.card .claimIcon{ display:inline-block; width:32px; height:32px; background:#FFF; text-align:center; border-radius:50%; position:relative; top:-14px; left:-6px; margin-right: 5px;  pointer-events: none;}
			.claim.card .claimIcon svg{ margin-top:6px; fill:#444; width:20px; height:20px; }
			.claim.card .claimIcon + div{display: inline-block; position: relative; line-height: 13px; width: calc(100% - 70px); pointer-events: none;}
			.claim.card.fullWidth .claimIcon + div{width:78%}
			.claim.card .claimIcon + div span{ display: block; height:12px; }
			.claim.card .claimIcon + div b b, .claim.card .claimIcon + div span b{color:var(--h3col);}
			.nhCheck .claim.card {background: transparent;height: 52px;border: 2px solid #DDD;box-shadow: none;}
			.nhCheck .claim.card .claimIcon{ background: transparent; top:-11px; pointer-events: all; }
			.nhCheck .claim.card .claimIcon input[type=checkbox]+label:before{margin-right: 0; cursor: pointer; }
			.nhCheck input[type=checkbox]+label:hover{ background: transparent; }

		.collabs { display:table; width:100%; table-layout:fixed;}
		.collabs div{ display:table-cell;}
		#groupsPanelCollabs .collabs { display:block; } /* #39179 */
		#groupsPanelCollabs .collabs > div { width: 33%; display: inline-block; vertical-align: top; } /* #39179 */
		.collabs .spacer{ border-right: solid 4px #FFF; margin-bottom: 15px!important;}
			#collabs>div:only-child .spacer{display:none;}

		#clientDetails .collabs .spacer{margin:0; background:#FFF}
		#clientDetails .collabs div:nth-child(4){display:none;}
	#clientDetails .collabs div .btnWrapper{display:block !important;}
		.collabs .blueline{ display: inline-block; margin-top: 5px; margin-left: 10px; font-size:10px; text-transform:uppercase; font-weight:bold;}

	.collabGroupMember:before { content:''; width:20px; height:20px; background:url(/media/svg/icons/frag#tick) no-repeat center; position:absolute; left:10px; opacity:0.3; border:dotted 2px #999; border-radius:50px; background-size:15px; transition:background 250ms; }
	.collabGroupMember.active:before { filter:invert(100%); opacity:1; background-color:#EE936E; border:solid 2px #EE936E; }
	.collab_group_members { padding:7px 0 0 5px; display:block !important; text-align:left; border-left:solid 3px var(--hcol); margin:-5px 0 12px 55px; }
		#popnest .groupCollabsWrapper .collabs div.collab_group_members { margin:-4px 20px; padding:5px 5px 0; margin-bottom:10px; }
		.collabs .collab_group_members .card { width:120px; min-width:120px; }
		#popnest .groupCollabsWrapper .collabs div .collab_group_members .card { width:138px; min-width:120px; }
		#popnest .collabs .collab_group_members .card { width:150px; min-width:150px; }
		.collabs .collab_group_members .card:last-child { margin-bottom:0; }


		.empty_group{display:block!important; height: 40px; width: 100%; color:#AAA; font-weight: 900; padding:10px 20px; font-style:italic;}
			.empty_group:after{ content:'No items'; }
		.collab_group_members.hidden,.empty_group.hidden{display:none !important;}
		.caret {width: 0;height: 0;display: inline-block;border: 5px solid transparent; border-left-color: currentColor; transition: transform 250ms}
			.caret.down{ transform:rotate(90deg) translate(40%,10%)}
			.caret.up{transform: rotate(-90deg);}
			.caret.left{transform: rotate(180deg);}
		.collabs .btnWrapper { display:block; width:90%; }
	.collabs .card { min-width:130px; line-height:inherit; border-radius:50px; background-position-x:14px; padding-left:42px; }
		.collabs .group.dragOver { background-color:var(--h2col); color:#FFF; }
		.collabs .card.dragOver * { pointer-events: none; }
		.collabs .card .title{ position:absolute; text-overflow:ellipsis; white-space:nowrap; overflow:hidden; display:block; width:calc( 100% - 70px);text-align: left; }
	#collabs-outlet{margin-top:-30px;}
	#clientDetails .collabs{margin:0 -10px -10px;}
		#clientDetails .collabs .spacer{margin:0!important; background:#FFF}
		#clientDetails .collabs div:nth-child(4){display:none;}

	.card.menu .on1, .card.menu .on0 {background-image: url(/media/icon-tick2.png);background-position: 4px 5px;position: relative;z-index: 2}
	.card .on0,.card .on1,.card .on2{float: right; display: inline-block; width: 37px; margin: -7px -10px -10px 5px; background: var(--h2col) url(/media/icon-pencil2.png) center no-repeat; height: 37px; background-position:10px center; border-radius:30px; transition:background 200ms;}
		.card .on1{ background-image:url(/media/icon-eye.png); background-position:8px center; }
		.card .on0{ background-image:url(/media/icon-noaccess.png);  background-color:#999;}
		.card.claim .on1, .card.claim .on0{ background-image:url(/media/icon-tick2.png); background-position:4px 5px; position:relative; z-index:2}
		.card.claim .icon::before{background-image: initial;}
		.card.claim .on1.icon-bin{transition:none;}
		.card.claim .on1.icon-bin:hover:before{background-image: url(/media/svg/icons/frag#bin); opacity: 1; background-size: 16px;}
			.card.claim .icon-bin:before{margin-top: 8px; opacity:0;transition: opacity 500ms;}
			.card.claim .on1.icon-bin:hover{text-align: center;background: var(--h2col); cursor:pointer;}
			.packCreator .card.claim .on1.icon-bin{margin-left: 0px;}

		.hClaims{ height: 100%; display: table; margin: 0 6px 0 -2px;}
			.hClaims .cell{ width: 8px; display: table-cell; vertical-align: middle;}
			.hClaims .helpbtn{margin: 0 0 2px 1px; background: var(--h2col);}
				.hClaims .helpbtn span{ margin: 17px 0 0 -240px;}

		.parentClaimCard{  display: inline-grid; width: 248px; vertical-align: top; box-sizing: border-box; grid-template-columns: 1fr auto; /* overflow:hidden */}
		.parentClaimCard.disabled .card{pointer-events: none;filter: grayscale(1);}
			.parentClaimCard span#cCount:empty{display: none;}
				.parentClaimCard span#cCount { float:right; width:20px; height:20px; background:var(--h2col); text-align:center; color:#FFF; line-height:20px; margin-top:2px; }

			.parentClaimCard.claimCat .card { height: 55px; }
				.parentClaimCard.claimCat .claimIcon{ width:35px; height:35px; top:-2px; left: 0; margin-right: 10px; }
				.parentClaimCard.claimCat .claimIcon + div {vertical-align: middle;}
				.parentClaimCard.claimCat span#cCount{ width:22px; height:22px; margin-top:4px; line-height:22px;}
				#hClaimParent div label { padding: 7px 18px 7px 15px; display: inline-block; border-radius: 50px;}

		#claimsHeader {padding-bottom: 10px;display: none;}
			#claimsHeader.on{display: block;}
			#claimsHeader h5{ display: inline-block; width:auto; background: none; margin-left: -5px!important;}
				#claimsHeader h5:empty::after{content: 'Choose a Category:'}
				#claimsPanel .excl.error.claimalert{display:none;}
				#claimsHeader .helpbtn, #claimsPanel .excl.error.claimalert{float: none;margin: 0px 7px 0px -4px;position: relative;top: -3px; }
				#claimsHeader .helpbtn:not(.hidden) + .claimalert.on{display: inline-block; top:-2px;}
				#claimsHeader .helpbtn span{left: 40px;}
			#claimsHeader .btn.h2back{ float: right; margin-top: 25px; margin-left: 10px;}
			#claimsHeader .smallbtn{ position: relative; bottom: 2px; left: 5px;}
			#claimsHeader #backArrow { display:inline-block; margin:-4px 5px 0 10px; vertical-align:middle; color:var(--hcol) }
				#claimsHeader #backArrow:hover{color:var(--h3col);}
			#claimsFilter {position:relative; float: right; margin-top: 25px;}
			#claimsFilter .input{ border:solid 2px #EEE; min-width:150px;}
			#claimsFilter .delbtn{ position: absolute;right: 7px;top: 7px; z-index: 2; background: #E9E9E9;}

			#claimsFilterSelect.select {  display:inline-block!important; display:none!important; margin-left: -20px; border:0px; transition: all 0.5s; width: 0;}
				#claimsFilterSelect .selectdrop{ width: 158px;position: absolute;left: -140px;}
				#claimsFilterSelect.select .selected { border-radius:0px 15px 17px 0px; line-height:36px; height: 36px; width: 0px; padding-left: 0!important; border: 0!important;}

				/* #claims .selected span { font-size:10px; line-height:11px; display:inline-block; padding:3px 10px 0px 0px; color:#444; } */
				#claimsFilterSelect .selected::after{ background:transparent; border: 0!important;}
				#claimsFilterSelect.hov .selected::after{     background: var(--hcol); }

				#claimsBody{max-height: 500px; width: 755px;}
					#addClaimBtn{ text-align: right; margin-top: 20px;}
					#addClaimBtn .additemBtn{display:none}
					#addClaimBtn .additemBtn.on{display: inline-block;}
				#claimsBody .parentClaimCard{/* overflow: hidden; */}

		.collabs .on0:after,.collabs .on1:after,.collabs .on2:after{content:'Can Edit'; display:block; position:absolute; text-transform:uppercase; font-size:8px; font-weight:bold; left: 42px; top: 20px; transition:background 300ms; color:var(--hcol); border-bottom: dotted 1px var(--hcol); opacity:0; transition:opacity 300ms}
		.collabs .card:hover .on0:after, .collabs .card:hover .on1:after, .collabs .card:hover .on2:after{opacity:1;}
		.collabs .on1::after{content:'Can View';}
		.collabs .on0::after{content:'No access'; box-shadow:none; color:#555; border:0;}
		.collabs .disabled .on0::after{content:'For org admin only';}
		.card.group .on0::after, .card.group .on1::after, .card.group .on2::after{margin-left:10px;}

		.expander {height: 24px;overflow:hidden;display:block; text-align: right; clear:both }
		.expander.on{ height:auto; padding-bottom:10px; overflow:visible; }
			.expander>a:first-child:after{content:"▼";margin-left:5px;display: inline-block;transition:transform 300ms 150ms;font-size: 9px;}
			.expander.on>a:first-child{ z-index: 2; position: relative; margin-bottom: 5px; }
			.expander.on>a:first-child:after{ transform:rotate(180deg);}
			.expander.on>a:first-child span:before{content:"ing";}
			.expander>div{text-align: left;}
			.expander:not(.on) .card{ box-shadow: none; }

	.groupCollabsWrapper{position: relative; min-height: 500px;}
		#popupcontent .groupCollabsWrapper .blocklinks { margin:auto; }
		 .groupCollabsWrapper .blocklinks .fl{ margin:14px 0; }
		 .groupCollabsWrapper .blocklinks .helpbtn{ margin:10px -20px; }
		 .groupCollabsWrapper .blocklinks .card { background:rgba(255,255,255,0.5); padding:0 40px 0 30px; font-size:14px; box-shadow:none; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; box-sizing:border-box; height:34px; cursor:pointer; font-weight:bold; max-width:220px; line-height:28px; margin:3px; }
			.groupCollabsWrapper .blocklinks .card.on { color:#FFF; background-color:var(--h2col); border-radius:20px 20px 0 0; }
			.groupCollabsWrapper .blocklinks .card:after { content:'\25b6'; position:absolute; transform:rotate(90deg); font-size:8px; right:12px; transition:all 0.5s; }
			.groupCollabsWrapper .blocklinks .card.on:after { transform:rotate(270deg); }
			.groupCollabsWrapper .blocklinks .card svg { margin-right:5px; vertical-align: initial; }
		.groupCollabs { position:fixed; z-index:1; background:#fff; max-height:0px; transition:all 0.5s; box-shadow:0px 8px 10px rgb(0 0 0 / 60%); overflow:hidden; width:340px; text-align:center; border-radius:25px; margin:-3px 90px; }
			.groupCollabs.on { max-height:485px; padding-bottom:50px; overflow-y:auto; }

	#popnest .groupCollabsWrapper .collabs div, #groupCollabs .collabsList{ width:225px; display:inline-block; margin:0px 7px 0px 7px; box-sizing:border-box; vertical-align:top;}
	.selecEntiretGroup{width:30px; height:30px; top: 7px; right: 0px;float: right; position:absolute; display: none!important; } /* #39791 */ /*#44189 button */
	#tab-tab_share_collabs .collabsList .card.group .selecEntiretGroup { display: block!important; } /* #39791 */ /*#44189 show only tab_share_collabs */
	.selecEntiretGroup:before {  content:''; width:20px; height:20px; background:url(/media/svg/icons/frag#tick) no-repeat center;  opacity:0.5; border:dotted 2px var(--hcol); border-radius:50px; background-size:15px;position: absolute;} /*#44189 Icon */
	.selectEntireGroup{width:30px; height:30px; top: 7px; right: 0px;float: right; position:absolute; display: none; }
	.selectEntireGroup:before {  content:''; width:20px; height:20px; background:url(/media/svg/icons/frag#tick) no-repeat center;  opacity:0.5; border:dotted 2px var(--hcol); border-radius:50px; background-size:15px;position: absolute;} /*#44189 Icon */
	.groupCollabs .collabsList .card {  border-radius:50px; transition:all 0.3s; background-position-x:15px; text-align: left;}
	.groupCollabs .collab_group_members {  margin-left:25px; }
	.groupCollabs .collab_group_members .card {  width:140px; }
		.collabsList .card, #popnest .groupCollabsWrapper .collabs div .card{width: 165px;}
			.collabsList .card.on { border: 2px solid var(--hcol); color: var(--hcol); }
			.collabsList .card span:not(.title) { display:none; }
			.collabsList .card span.caret{display:inline-block;}
			.collabsList .card.group{ text-align:left }
		#groupCollabsItems .collabsList .card span:not(.title) { display:inline-block; }
			.collabsList .spacer:after,.collabsList .spacer:before{vertical-align: bottom;}

	.groupCollabsWrapper .collabsItems{ display:none; text-align:left}
	.groupCollabsWrapper .collabsItems.on{display:block;}
	.collabsItems .spacer { color:var(--hcol); padding:5px; border-radius:50px; background:#EEE; }
		.collabsItems .card { width:100%; padding:7px 10px 0px 0px; background:#fff; box-shadow:none; transform:scale(0.85); margin:-4px -38px; }
			.collabsItems .card:hover{background-color:var(--bgcol3);}
			.collabsItems .card span:not(.title){float:none;}
		.collabsItems .title { padding-left:20px; vertical-align:top; width: 89%; font-weight:normal;}
	#collabsItems-recipe.collabsItems .title{width:89%;}
	#collabsTick:before { content:''; width:20px; height:20px; background:url(/media/svg/icons/frag#tick) no-repeat center; position:absolute; left:10px; margin-top:-6px; opacity:0.5; border:dotted 2px var(--hcol); border-radius:50px; background-size:15px; }
	#collabsTick:active:before{filter:invert(100%) brightness(0.5) sepia(8) hue-rotate(-10deg)saturate(20); opacity: 1}


	#allergenPanel{ padding-top:0; text-align: center;}
	#foodAllergens{clear:both;}
	#allergyinfo{display: inline-block;margin:0px -12px; }
	#allergyinfo label { display:inline-block; width:90px; height:100px; border-radius:20px; margin:5px 8px 0; text-transform:uppercase; font-size:7px; font-weight:bold; word-wrap:break-word; position:relative; transition:all 200ms; }
	label#toggleValc-milk{  margin-top: -1px;  height: 98px; }
	#allergyinfo label:hover{ z-index:1; box-shadow:0px 0px 12px #CCC; transform:scale(1.05)}

	#allergyinfo label *{pointer-events:none;}
		#allergyinfo label:before{ content:""; font-size: 11px; position: absolute; bottom:17px; width: 100%; left: 0; padding: 2px 0; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; }
			#allergyinfo label.on0:before{ content:attr(data-css-content-freefrom); letter-spacing:-0.5px; }
			#allergyinfo label.on1:before{ content:attr(data-css-content-maycontain); letter-spacing:-0.5px;}
			#allergyinfo label.on2:before{ content:attr(data-css-content-contains); letter-spacing:-0.5px;}
			#allergyinfo label:not(.on):not(.on2) .icon{ background:#EEE; }
		#allergyinfo label.on0{ background-color:#FFF; color:var(--hcol); }
		#allergyinfo label.on1{ color:var(--hcol); }
		#allergyinfo #foodProps label.on1:not(:hover), #allergyinfo label.on2:not(:hover){ box-shadow: 0px 3px 30px rgb(0 0 0 / 12%)!important; }
		#allergyinfo label span{position:absolute; bottom:11px;  width: 100%; left: 0; right: 0;}
		#allergyinfo .icon{  fill: #AAA; height: 50px; width: 50px; pointer-events: none; border-radius: 26px; padding:7px; left: 50%; transform: translate(-50%,-70%); }
		#allergyinfo .suballergens > svg.icon {transform: translate(0,0);background: #DDD;}


		#allergyinfo label.on2 .icon, #allergyinfo #foodProps label.on1 .icon{ fill: #FFF; }
		 #allergyinfo #foodProps label.on1 .icon{ background-color: var(--h2col); }
		#allergyinfo label.on0 .icon, #allergyinfo label.on1 .icon { fill:var(--hcol); background:#FFF; box-shadow:0px 1px 6px #ddd; }
		#allergyinfo #foodProps label.on1:before{content: "\2713"; content: ""; font-size: 21px; font-weight: normal; bottom: 14px;}
		#allergenPanel.extendAl label{width:109.5px!important; }

		.makeRecipe{}
		.makeRecipe h5.greyback input{ width:80px; }
			#mrAllergen .allergenicon{margin-bottom: 10px;}
			#mrAllergen.fl{width:100%; max-width:600px;text-align:center;margin-top:-10px;}
				#popupcontent #mrAllergen h5{padding: 2px 0;color: #444;font-size: 14px;margin:0;}
				.allergyCont{width:25%;}
				.allergyCont h5{margin-bottom: 10px;}
				.foodCreator #newLabel { margin:-4px 50px; line-height:30px;}
			.makeRecipe #makeThisIngredients .ctype { width: 65px; display: inline-block; }
			.makeRecipe .footer{padding: 0 40px 20px!important;}
			.makeRecipe .allergyCont{margin:-20px 0px 0 20px }
			.makeRecipe #makeThisIngredients p strong.hcol{margin-right: 5px;}

		.suballergens{position: absolute; background: #666; z-index: 3;   font-size:10px; text-align:left; padding:0 0 10px; font-weight:bold; border-top:solid 5px #1d77bb; overflow:hidden; transition:all 200ms; width:110px; max-height:0px; opacity:0; pointer-events:none;}
		/* #toggleValc-nuts+.suballergens{margin-left:219px;} */
			.suballergens .icon{ margin:0 30px 5px; fill:#1d77bb!important; margin-top:7px!important;}
			.on+.suballergens{ max-height:fit-content; opacity:1; pointer-events:all; overflow:visible; box-shadow: 1px 2px 8px 0px #777777;}
			.on+.suballergens:before{  border-style:solid; border-width:6px 7px 0 7px; border-color:#ddd transparent transparent transparent; position:absolute; left:42px; top:60px; }
			.on+.suballergens:after{content:'x'; width:12px; height:12px; position:absolute; top:5px; right:5px; border:solid 1px #999; color:#999; text-align:center; line-height:10px; border-radius:50%;}
			.on+.suballergens:hover:after{color:#FFF; background-color: #1d77bb;}
			#foodAllergens .on+.suballergens{max-height: 800px;}
			.suballergens a{display:block; padding:7px 10px; transition:background 300ms; color:#999; text-transform:uppercase;}
			.suballergens a.on1, .suballergens a.on2, .suballergens a.on0{ color:#FFF;}
			.suballergens a.on0{text-decoration:line-through;}
			.suballergens a:hover{background:#555;}
			.suballergens a:after{  content:''; border:solid 1px transparent; float:left; margin-right:5px; width:10px; height:10px; border-radius:50%; text-align:center; line-height:10px;}
			.suballergens a.on1:after{ content:'!'; border:solid 2px #1d77bb; color:#FFF; box-shadow:0px 0px 0px 1px #AAA; width:7px; height:7px;}
			.suballergens a.on2:after{ content:'\2713'; background-color:#1d77bb; color:#FFF; font-size:10px; line-height:10px; text-align:center;}
			.suballergens a.on0:after{ content:'x'; border-color:#FFF; color:#FFF;}

		#clientDetails .suballergens{ margin:-1px -18px; border-top:solid 3px rgba(0,0,0,0.1); background-color: #a0845a}
			#clientDetails .suballergens .icon{ margin:0 20px 5px; }
			#clientDetails #c-nuts+.suballergens{margin-left:92px; background: #9e5738; max-height: 504px;}
			#clientDetails .suballergens a{  color:rgba(255,255,255,0.7);}
			#clientDetails .suballergens a:hover{ color: #FFF; background-color: rgba(0,0,0,0.2);}
			#clientDetails .suballergens a.on2{color: #FFF;}
			#clientDetails .suballergens:after { content:''; width:0; height:0; border-style:solid; border-width:0 4.5px 7px 4.5px; border-color:transparent transparent #a0845a transparent; position:absolute; top:-9px; left:50%; margin-left:-5px; }
			#clientDetails #c-nuts+.suballergens:after{border-color:transparent transparent #9e5738 transparent;}
			#clientDetails #aBox .allergenicon.on{border-radius: 2px!important; background: #DDD!important}
			#clientDetails #clinicalPanel .half .select{width: 100%;position: relative;height: 68px;padding-top: 25px;}
			#clientDetails #clinicalPanel .half .select .delbtn{position: absolute; top: 24px; right: 30px}
			#clientDetails #clinicalPanel .half .select .selected::after{display: none;}
			#clientDetails #clinicalPanel .half .select .selectdrop label span{left: 35px;top:unset}
			#clientDetails #clinicalPanel .half .select .selectdrop > .spacer{margin-top: 15px;}
			#clientDetails #clinicalPanel .half .select .selectdrop > div{padding: 0;}
			#clientDetails #clinicalPanel .half .select .selectdrop > div > label {padding: 14px 10px}

		#aBox .allergenicon.on2 { box-shadow: 0px 3px 30px rgb(0 0 0 / 12%)!important; color: #222; }

		#nutHint .yellowback, #allergyHint .yellowback{ display: block; padding:13px; padding-left:135px; margin:-13px; background: var(--bgcol3); border-radius:50px; position:relative; bottom:15px;}
		#nutHint .fl, #allergyHint .fl{ background: var(--bgcol3); padding:13px 15px; width:106px; display:inline-block; position:absolute; left:25px; top:0; bottom:0;}
		#nutHint .fl{ height:100%;}
		#nutHint, #allergyHint{ text-align: center; font-weight: bold; color: #777; font-style: italic; margin:15px 40px -20px; padding: 13px 0; clear: both;}
		#allergyHint{background-color: #F5F5F5; border-radius:20px; overflow:hidden}
		hr#allergyHint{ padding: 0; height: 0px; margin-bottom: -12px;}
		#nutHint{ position:fixed; left:261px; z-index:3; width:742px; bottom:5px; box-shadow:0px -1px 8px rgba(0,0,0,0.4); background:var(--bgcol3); height:50px; border-top:solid 5px var(--bgcol3); transition:bottom 300ms}
		#nutHint:empty{bottom:-30px; padding:0}

	#toggleValrecalcAllergens{ width:38px; height:38px; line-height:32px; background-color:#EEE; color:#999; border-radius:100%; float:right; margin:25px 36px 0 0; text-align:center; font-size:10px; font-weight:bold; border:solid 4px #DDD; transition: background 500ms}
		#toggleValrecalcAllergens::after{ content:"AUTOMATIC ALLERGENS"; position:absolute; display:block; margin:26px 0 0 -26px; width: 95px; line-height:120%; font-size:8px; color:#777}
		#toggleValrecalcAllergens.on1{background:var(--h2col); color:#FFF; box-shadow:0px 0px 4px rgba(0,0,0,0.3) inset}
		#toggleValrecalcAllergens.on1.disabled{background: #EEE;color: #999;box-shadow: none;}
		#toggleValrecalcAllergens::before{content:"OFF"; }
		#toggleValrecalcAllergens.on1::before{content:"ON"; }

	.disabled #allergyinfo label:hover{box-shadow:none;}
	.disabled #toggleValrecalcAllergens{visibility: hidden;}
	#approvedAllergens{padding-left:15px;  border-radius: 20px;}

	#notesClient {position: relative;/* max-width: 360px; */}
		#notesClient .nicEdit-head{width:100%!important;}
		#notesClient .nicEdit-body { width:calc(100% - 30px)!important; min-height:300px!important; margin-bottom:50px; margin-left: 15px; }
		#notesClient .nicEdit-main{min-height:300px!important;}
		#notesClient.maximised div:not(.nicEdit-options){border-bottom:0; box-shadow:none;}
		#notesClient.maximised .nicEdit-body{ width: 680px!important;}

#logs{width:350px; background-color:#F5F5F5; color:#333;overflow-y:auto;overflow-x:hidden; padding: 10px 10px 65px 10px; position:absolute;top:0;bottom:0;right:0;}
	#clientName{ float:right; border:solid 1px #999; color:#666; padding:3px 5px 3px 5px; font-size:8pt; font-weight:bold; margin:10px 13px 0 20px}
	#logs h2 { margin:40px 0 7px 0; font-size:17px; text-align: left; background:rgba(0,0,0,0.04); padding:7px 0px 6px 18px; border-radius:50px; }
		#logList h2{ margin-top: 20px; }
	#logs .divbtn{ padding:15px 7px 7px 32px; font-size:8pt; overflow:hidden;}
		#logs .divbtn:hover{ background:#F9F9F9; border-color:#F9F9F9; color:var(--hcol)}
		#logs .divbtn span{display:inline-block; }
		#logs .delbtn{float:left; margin:-2px 0 0 -25px; }
		#logs a.greybtn { width:53px; text-align:center; border-radius:20px 0 0 20px; margin-right:-7px; padding:7px 1px 7px 10px; margin-top:-2px; }
		#logs .divbtn>.pillbtn{ margin:2px -7px; border-radius:50px 0 0 50px; padding-right:7px; line-height:24px}
	#logs .expander{ margin-top:-14px; z-index:1; position:relative; }
		#logs .expander:not(.on){height:30px;}
		#logs .expander.on>a:first-child{ margin-bottom:-10px;  }
	#clientDetails .collabs .expander{text-align: left;}

.logname { width:155px; min-height:35px; vertical-align:middle; float:left; margin-right:5px; color:#555; padding-right:5px; word-wrap:break-word; font-weight:bold; }
	#view:not(.tableView) .logname{font-size: 16px;  width: 100%;}
	#view .logname .smallText{display: none;}
	#view:not(.tableView) .grabber:before, #view:not(.tableView) .grabber:after{ left:5px; height:26px;}
.view-mealplan .logname{width:100%; box-sizing: border-box;}
.view-mealplan .mon{margin-left: 0;}
.view-mealplan.tableView .logname{width: 188px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.view-mealplan.tableView .addbtn a{padding-left:12px!important;}
.view-mealplan #footer .mon:first-of-type{width:300px; border:0!important;}
	span.details{font-size:10px;}
#programList .logname .smallText{display:block;}
#programList>div.divbtn{ overflow : visible !important;}/*//Divya//#37646*/
	#pane-clientEdit h2>.btn{ margin:-6px 0; }
	#pane-clientEdit h2>.counter{ margin: -4px 1px 0 -10px; }
	#pane-clientEdit h2 .bluebtn:empty { background-image:url(/media/icon-paperclip.png); background-repeat:no-repeat; background-position:center; }
		#pane-clientEdit .orangebtn{margin:0px -2px;}
		#pane-clientEdit .raisedList h2 .orangebtn{ margin: -5px 10px}
		#pane-clientEdit #dietPrefs>.groups, #pane-clientEdit .allergiesVerified{ margin-top: 20px}

#ordersList .orderDayGroup { display: flex; align-items: flex-start; }
	#ordersList .orderMenus { flex: 1; display: flex; flex-direction: column; gap: 8px; }
	#ordersList .orderDate { width: 110px; padding-left: 5px; }
	#ordersList .orderMenuItem { display:grid; }
	#ordersList .orderMenuItem .logname { min-height: 14px; }

.orderDocketsPopup .docketsContainer { display: flex; flex-wrap: wrap; gap: 15px; justify-content: center; }
	.orderDocketsPopup .docketFrame { flex: 0 0 330px; max-width: 330px; box-sizing: border-box; overflow: hidden; position: relative; padding-bottom: 30px; }
		.orderDocketsPopup .docketFrame iframe { width: 100%; height:530px; border: 0; }
	.orderDocketsPopup .docketLoading { position:absolute; inset:0; display:flex; align-items:center; justify-content:center; }
		.orderDocketsPopup .docketLoading img { width:32px; height:auto; }

.updownbox div{margin-top: 3px;}
	.updownbox input { display:inline-block; width:60px; text-align:center; height:28px; padding:0!important; }
	.updownbox input.large { width:160px; margin-left:-47px; margin-right:-46px; vertical-align:middle; margin-top:-3px; }
	.updownbox a:not(.pillbtn) { display:inline-block; width:38px!important; aspect-ratio: 1 / 1; font-size:16px; margin:0!important; border-radius:50px; padding:0; line-height:34px; }

.donutpie { position: relative; z-index: 0; background: conic-gradient( var(--h2col) 0deg 10deg, transparent 10deg 360deg ); color: var(--h2col); }
	.donutpie:before { content: ''; position: absolute; background: #FFF; width: 76%; height: 76%; border-radius: 50px; left: 12%; top: 12%; z-index: -1; }

 #settings_generate h2{margin-bottom:20px;}
 #settings_generate p{ padding-left:30px; background:url(/media/icon-printable.png) left center no-repeat;}
 .printable{vertical-align: middle; margin: -4px 3px 0 0;}



/*//////////////////////////////////////// LOAD LABEL ////////////////////////////////////////*/
.grabber{ position:relative; }
	.grabber:before{ content: ''; display:block; position:absolute; width:17px; left:0; z-index: 3; height:100%; cursor:move;}
	.grabber:after{ content:''; display:block; position:absolute; border-right:solid 2px #CCC; border-left:solid 2px #CCC;  height:22px; left:8px; top:10px; width:1px; z-index:2; transition:opacity 300ms; opacity: 0}
	.grabber:hover:after{ opacity: 1;}
	.grabber:after:hover{ border-color: var(--h3col); }

/* OVERWRITE GRABBER FOR MENUS AND WASTE LOG LIST */
.view-menu .item.grabber:before, .view-waste .item.grabber:before{ left: 30px; }
.view-menu .item.grabber:after, .view-waste .item.grabber:after {top: 4px; left: 34px;}

 #pane-maindiv.label{overflow-x: hidden;}
.labelMaker .options{ min-width: 750px;}
.labelMaker .options input#name{ margin-left:150px;}
	.labelMaker svg:not([viewBox]){position: absolute;}
	.labelMaker .options input#quantity:placeholder-shown{ color:var(--h3col); background-color:#FFF;}
	.labelMaker .options #quantity, .options .quantity{width:100px; text-align:center; font-size:16px; filter: grayscale(1); pointer-events: none;}
		.labelMaker.v2 .options #quantity, .options .quantity{filter:none; pointer-events: all;}
		.labelMaker #exportPrefs,.labelMaker #exportPrefsContent{display: none;}
		.labelMaker.v2 #exportPrefs{display: block;}
		.labelMaker #exportPrefsSub { width:780px; height:565px; overflow-y: auto; max-width:none; max-height: none;}
		.autoscale .labelMaker #exportPrefsSub {height:420px;}
		.labelMaker #templateContent{ width:auto; float:none; border:0; padding:10px; margin-bottom:0}
		.labelMaker #templateContent div{display:inline-block; width:180px; box-shadow: 1px 1px 5px rgba(0,0,0,0.2); margin-right:10px; overflow: hidden; background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAKElEQVQYV2NkQANnzpz5z4gsBhIwMTFhhAvCBECKwILIAmBBdAGQIADcqBNp8cESRgAAAABJRU5ErkJggg==) repeat;}
		.labelMaker #templateContent div:before{content:''; display:block; width:100%; height:180px; background: -moz-radial-gradient(center, ellipse cover,  rgba(255,255,255,0.85) 0%, rgba(255,255,255,0.85) 1%, rgba(255,255,255,0) 100%); background: -webkit-radial-gradient(center, ellipse cover,  rgba(255,255,255,0.85) 0%,rgba(255,255,255,0.85) 1%,rgba(255,255,255,0) 100%);
background: radial-gradient(ellipse at center,  rgba(255,255,255,0.85) 0%,rgba(255,255,255,0.85) 1%,rgba(255,255,255,0) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d9ffffff', endColorstr='#00ffffff',GradientType=1 );}
		.labelMaker #templateContent div p{border-top: solid 1px #DDD; padding:4px 15px;z-index: 9;position:relative;background-color: var(--bgcol);transition: all 200ms; width: 100%; text-transform: uppercase;}
		.labelMaker #templateContent .default:before{margin-left:-7px;}
		.labelMaker #unsavedTemplate em:first-child{background:var(--h2col); color:#fff; padding:0px 8px; font-size:8px; margin-right:-10px;}
		.labelMaker .options #selectLblFormat { width:80px; line-height:36px; margin:2px 5px; }
		.labelMaker .options #selectLblFormat .selectdrop div{ width: 130px; margin-right:-40px; }
		.labelMaker .options #selectLblFormat .selectdrop div{padding-left:20px;}
			.labelMaker .options #selectLblFormat .selected .flag{width:15px;height:15px;}
		.flag.flag-uk{background-position: -128px -64px !important;}

	.labelMaker .unavailable,.labelMaker #unavailable{margin:30px 0px 10px; font-size:20px; line-height: 110%;}
	.labelBack .custom_fields .unavailable {line-height: 110%;}
	#lButtons{position:absolute; top:0px; left:0; width:150px; border-right:solid 1px #DDD; height:100%; z-index:1;}
	.labelMaker #lblPanel{ width:100%; vertical-align:top; height:calc( 100% - 40px); transition:all 300ms; position:absolute; top:40px; pointer-events: none;}
		.labelMaker.v2 #lblPanel{pointer-events: all;overflow: hidden;}
		.labelMaker #lblPanel #lblSettings{display: inline-block;height: 100%; pointer-events: none; filter: grayscale(1);position: relative;z-index: 4;}
		.labelMaker.v2 #lblPanel #lblSettings{pointer-events: all; filter: none;}
		/* .labelMaker #lblPanel #lSettings{display:inline-block; transition:all 300ms 250ms; margin-left:-150px;  height:100%; border-radius: 0 30px 30px 0; box-shadow: 0 2px 5px rgba(0,0,0,0.5); background: #FFF; overflow: hidden;} */
		.labelMaker #lblPanel.on #lPreview{/* width: calc(100% - 450px); */ }

	/*settings hover panel*/
	.labelMaker #lblPanel #lSettings { position:absolute; top:10px; left:160px; margin: 0; transition:all 300ms 300ms; border-radius:50%; box-shadow:2px 1px 8px rgba(0,0,0,0.5); background:#FFF; z-index:2; overflow: hidden; width: 50px; max-height: 50px;}
	.labelMaker.v2 #lblPanel #lSettings{pointer-events: all!important}
	.labelMaker.v2 #lblPanel .disabled{pointer-events: none!important}
	.labelMaker.v2 #lblPanel input.disabled{ color: #AAA; }
	.labelMaker #lblPanel #lSettings {pointer-events: none;}
	.labelMaker #lblPanel.on #lSettings{ width: 280px; max-height:80vh; padding-bottom: 40px; display: block; border-radius:20px; overflow: hidden auto; transition:all 300ms }
	.labelMaker #lblPanel #lSettings.shortMode{height: calc(100% - 4%);overflow-y:auto; overflow-x:hidden; border-radius:30px 0px 0px 30px;}
		#lblPanel #lSettings>*{ transition: opacity 300ms 300ms; }
		#lblPanel:not(.on) #lSettings>*{ opacity: 0; pointer-events: none; transition: opacity 300ms;}
		#lblPanel #lSettings .cogBtn { opacity: 1; pointer-events: all; position:absolute; background:#FFF; top:0; left:0; bottom:0; right:0; text-align:center; line-height:48px; z-index:1; color: #666; transition: opacity 100ms 300ms;pointer-events: none;}
			.v2 #lblPanel #lSettings .cogBtn {pointer-events: all;}
			#lblPanel #lSettings:hover .cogBtn,#lblPanel #lSettingszoomin:hover .cogBtn{color: var(--h3col);}
			#lblPanel.on #lSettings .cogBtn{  opacity: 0; pointer-events: none; transition: none;}
		#lSettings p.pill{ line-height:25px; padding:0 15px; margin:20px auto 5px; }
			#lSettings p.pill .toggle{ margin: 5px -10px; }
			#lSettings p.pill.full .toggle{ margin: 5px 10px; }
		#lSettings .colorPanel {position: absolute;top: 104px; left: 17px; width:219px; padding: 41px 17px 2px 25px; z-index:1;}
		#lSettings .delbtn { position:absolute; right:12px; top:9px; }
		#lSettings label:not(.checkboxLabel){text-transform: uppercase; font-size: 9px; font-weight: 900; text-align: center;}
		#lSettings input{text-align: center; font-weight: 900}
		#lSettings input::-webkit-input-placeholder{ font-size: 11px;}
		#lSettings .spacer.blue .toggle{ display: none;}
		#lSettings .notesdiv { border-radius:25px; overflow:hidden; border:solid 2px #EEE; margin: -7px 0}
		#lSettings #sett-p-origin .notesdiv { margin: 10px 0 -10px}
		#lSettings #sett-p-batch_code #lbl-identifier {display: none;}
		#lSettings #sett-p-batch_code #lbl-identifier.show {display: inherit !important;}
		#lSettings #sett-p-batch_code select {text-align:center;margin-bottom:10px;}
		#lSettings #sett-p-batch_code .lbl-useJulianDate {white-space: initial;}
		#lSettings .nicEdit-head+div{ border: 0!important}
		#lSettings .nicEdit-main{ margin-top:10px !important;text-transform: none; font-weight: normal;}
		#lSettings .blocklinks.lgreyback { margin-top:20px;}
		#lSettings .lbl-syncQuid{margin-bottom: 10px;}
		#lSettings .lbl-adviceQuid{margin-bottom: 20px;}
		#lSettings #sett-p-quid .helpbtn{position:absolute; top:50px; left:130px;}
		 	#sett-p-quid #eWrapper.disabled{pointer-events: none;color: #AAA;}
				#sett-p-quid #eWrapper .ingListFormat{display:none}
			#sett-p-quid .resetBtn{display: none;}
		#lSettings .unavailable{padding:50px 20px}
		#lSettings .lbl-sHeadingOn { margin-bottom: 20px; }
		#lSettings label.lSync { position:relative; }
		#lSettings .lSync:hover + .sync, #lSettings .sync:hover { display:inline-block; background: var(--h2col) url(/media/icon-pencil2.png) 6px center/15px no-repeat; }
		#lSettings .lSync:hover + .syncIcon:not(.sync), #lSettings .syncIcon:not(.sync):hover { display:inline-block; background:#BBB;line-height:20px;font-weight:bold;color:#fff; }
		#lSettings .syncIcon:not(.sync):before {content:"x"; font-size: 8px}
		#lSettings .syncIcon { cursor:pointer;float:right;position:absolute;right:2px;display:none; }

		#lSettings #sett-p-nutrition .packServ:hover .sync { width:28px; height:28px; border-radius:50%; bottom:0px; right:20px;display:inline-block; background: var(--h2col) url(/media/icon-pencil2.png) 6px center/15px no-repeat; }
		#lSettings #sett-p-nutrition .packServ:hover .syncIcon:not(.sync) { width:20px; height:20px; border-radius:50%; bottom:3px; right:60px;display:inline-block; background:#BBB;line-height:20px;font-weight:bold;color:#fff;}
		#lSettings #sett-p-nutrition .packServ label.lSync{display:block}

		#lSettings #sett-p-origin #lbl-origin .sync { top:5px; }
		#lSettings #sett-p-origin #lbl-origin .syncIcon:not(.sync) {top:9px;}
		#lSettings #sett-p-origin .origin .sync { width:28px; height:28px; border-radius:50%; top:15px;left:220px }
		#lSettings #sett-p-origin .origin .syncIcon:not(.sync) { width:20px; height:20px; border-radius:50%; top:20px;left:225px;}

		#lSettings #sett-p-origin .origin .sync { width:28px; height:28px; border-radius:50%; top:15px;left:235px }
		#lSettings #sett-p-origin .origin .syncIcon:not(.sync) { width:20px; height:20px; border-radius:50%; top:20px;left:235px;}
		#lSettings #sett-p-origin .origin #o-origin-country.disabled{color:#AAA;background-color: #EEE}

		#lSettings #sett-p-origin .perc:hover .sync { width:28px; height:28px; border-radius:50%; bottom:-2px; right:25px;display:inline-block; background: var(--h2col) url(/media/icon-pencil2.png) 6px center/15px no-repeat;}
		#lSettings #sett-p-origin .perc:hover .syncIcon:not(.sync) { width:20px; height:20px; border-radius:50%; bottom:0px; right:25px;display:inline-block; background:#BBB;line-height:20px;font-weight:bold;color:#fff;}

		#lSettings #sett-p-dates .bestb4:hover .sync ,#lSettings #sett-p-dates .useby:hover .sync{ width:28px; height:28px; border-radius:50%; right:10px;bottom:0px;display:inline-block; background: var(--h2col) url(/media/icon-pencil2.png) 6px center/15px no-repeat;}
		#lSettings #sett-p-dates .bestb4:hover .syncIcon:not(.sync),#lSettings #sett-p-dates .useby:hover .syncIcon:not(.sync){ width:20px; height:20px; border-radius:50%; right:20px;bottom:3px;display:inline-block; background:#BBB;line-height:20px;font-weight:bold;color:#fff;}

		#lSettings #sett-p-dates .usebytime:hover .sync { width:28px; height:28px; border-radius:50%; right:8px;bottom:0px;display:inline-block; background: var(--h2col) url(/media/icon-pencil2.png) 6px center/15px no-repeat;}
		#lSettings #sett-p-dates .usebytime:hover .syncIcon:not(.sync) { width:20px; height:20px; border-radius:50%; right:15px;bottom:3px;display:inline-block; background:#BBB;line-height:20px;font-weight:bold;color:#fff;}
		#lSettings div[data-type="p-text"] .numInput, #lSettings div[data-type="p-text"] h5{text-align: center!important;}

		#lSettings .sett-p-instructions .tabmenu{margin-top: -3px;width:inherit;height:38px;background:#FFF !important;}
		#lSettings .sett-p-instructions .tabmenu a{overflow:hidden;text-overflow:ellipsis;width:59px;color:#666;;background: #FFF !important;padding-left:5px !important;padding-right:5px !important;cursor: default !important;}
		#lSettings .sett-p-instructions .tabmenu a.on{background: #EEE !important;color: var(--hcol) !important;}
		#lSettings .sett-p-instructions .tabmenu a:not(.on):hover{color:#FFF; background: var(--hcol) !important;}
		#lSettings .sett-p-instructions:has(.optBtn + .tabmenu) .optBtn{top:38px;}
		#lSettings .sync { width:28px; height:28px; border-radius:50%; bottom:4px; }
		#lSettings .syncIcon:not(.sync) { width:20px; height:20px; border-radius:50%; bottom:8px; }
		#lSettings .lSyncText .syncIcon:not(.sync), #sett-p-barcode .syncIcon:not(.sync), #sett-p-weight .syncIcon:not(.sync) { bottom:12px; margin-right:2px;}
		#lSettings .lSyncText .sync{ bottom:5px; right:-5px; }
		#lSettings .lSyncText .sync, #sett-p-barcode .sync, #sett-p-weight .sync {bottom:6px; }
		#lSettings .lSyncTextarea .sync, #lSettings .lSyncTextarea .syncIcon:not(.sync) { bottom:0; right: 4px; z-index: 1; }
		.labelMaker.v2 #lblPanel .editorTd.disabled {pointer-events: auto !important; color: #888; background-color: #DDD;}
		.labelMaker.v2 #lblPanel .editorTd.disabled .nicEdit-main, .labelMaker.v2 #lblPanel .editorTd.disabled .nicEdit-body {color: #888; background-color: #DDD; }
		.labelMaker.v2 #lblPanel .editorTd.disabled .nicEdit-body { pointer-events: none; }
	/*#lSettings, #lPreview{padding: 0 15px;}*/
	#lSettings{padding: 0 15px;}
		#lButtons{ background:#FFF; }
		#lButtons>div{max-height:calc(100% - 75px); overflow-y:auto; overflow-x:hidden;}
		#lButtons.on>div{max-height:calc(100% - 115px)}
		#lButtons label { height:43px; line-height:37px; padding-left:15px; font-weight:bold; font-size:11px; }
		#lButtons label .hoverArea{position: absolute;}
				#lButtons label.on .hoverArea { width:40px; height:130px; right:0px; top:-45px; }
				#lButtons .grabber:last-child .hoverArea {display: none;}
			#lButtons label:hover{ background:#FFF; }
			#lButtons label.on,#lButtons label.elSelected{ color: var(--h3col); }
				#lButtons label.on:before,#lButtons label.elSelected:before{ background-color: var(--h3col); }
				#lButtons label.on:after{content:""; width:0; height:0; border-style:solid; border-width:6px 0 6px 5px; border-color:transparent transparent transparent var(--h3col); position:absolute; right:2px; margin-top:13px; z-index: 1;}
			#lButtons label span { position:absolute; display:block; top:0; bottom:-1px; right:0; left:50px; text-overflow:ellipsis; line-height:42px; white-space:nowrap; width:65px; overflow:hidden;}
			#lButtons label#l-page_setup { background:#EEE url(/media/icon20-print-dark.gif) no-repeat center left; background-position:21px;}

		#lButtons .settingsBTN{ height: 43px; overflow: hidden; transition:height 200ms;}
		#lButtons:not(.on) .settingsBTN.turnedOff, #lButtons.on .settingsBTN:not(.turnedOff){ height: 0px; opacity: 0; pointer-events: none;margin: 0;border:none;}

		#lButtons .newItemBtn {margin:10px 6px; border:solid 2px #CCC; height: auto;}
		#lButtons #addLblEls{margin: 5px; display: block;}
			#lButtons #addLblEls:after{content:attr(data-css-content-add);}
			#lButtons.on #addLblEls:after{content:attr(data-css-content-back);}
			#lButtons.on #addLblEls:before { content:'◀'; position:absolute; margin-left:-33px; font-size:7px; }
	#lSettings .WeightFactorMess{text-wrap:wrap;margin:-10px 0 10px 0;}
	#lSettings #sett-p-weight .WeightFactorMess{margin-top:15px;}
	#lSettings{ width:300px; left:150px; box-sizing: border-box; border-right:solid 1px #DDD;z-index: 1;}
		#lSettings #miniMenu{ position:absolute; left:0; }
		#lSettings #miniMenu .helpbtn{float:none; margin:0;}
		#lSettings #miniMenu .helpbtn span{left:225px;}

		#lSettings .unavailable{text-align:center;}
		.unavailable:not(.hidden)+.available{display:none;}
		.labelMaker .spacer.blue { margin:0px -15px 15px; line-height:26px; padding:6px 0 4px; border-radius:30px 30px 0 0; background:none; border-bottom:solid 1px #DDD; }
		 #lPreview .spacer{margin:0px 0px 30px 0px; line-height:40px; background-color: rgba(0,0,0,0.07);padding:1px 0 0; }
			.spacer .toggle{ margin: 10px 20px 0 -60px;}
		#lSettings>div{display:none;}
		#lSettings>div.sel{display:block; opacity:1; transform: translateZ(0);}
			#lSettings>div.sel.on{ filter: none; -webkit-filter:none; opacity:1; }
			#lSettings .spacer .toggle { position:absolute; right:-2px; margin-top:3px; }
			#lSettings .bigcheck { vertical-align: baseline;}
			#lSettings .headingText{ margin-right: 5px; cursor:pointer}
			#lSettings .headingText:hover{ color:#3d9be4!important;}
			#lSettings input[type=checkbox]+label{text-align:left;font-size: 12px;line-height: 24px;}
			#lSettings select{text-transform: capitalize;}
			#lSettings div.o-tooltip{position: relative;}
			#lSettings div.o-tooltip .helpbtn{position:absolute;top:8px;right:0;}
			#lSettings div.o-tooltip .helpbtn span{width:260px;}

			#swapSizes { position:absolute; right:15px; margin-top:50px; font-size:18px; font-weight:bold; z-index:2;}
			.hiddenOptions{margin:20px 10px;}
			input[type=checkbox]+label+.hiddenOptions, .dropdown+.hiddenOptions{ max-height:0; transition:max-height 400ms; overflow:hidden; box-sizing:border-box;  background:#DDD; padding:0 10px; margin-top:-22px; box-shadow:0 2px 5px #CCC inset;}
			.dropdown.on+.hiddenOptions{ max-height:300px; padding:10px; }/*//Divya//#63974*/
			input[type=checkbox]:checked+label+.hiddenOptions{ max-height:350px; padding:10px;}/*//Divya//#63974*/
			input[type=checkbox]+label+.hiddenOptions{margin-top:0;}
			#lSettings #sett-p-allergens{white-space: normal;}
				#sett-p-allergens{text-align:center;}
				#sett-p-allergens strong:first-of-type { margin-top:-15px; /* display:block; */ }

			#bcPreview{height:100px; background:no-repeat center; background-size: contain; image-rendering: -webkit-optimize-contrast;}
				.downloadlabel{ border-radius: 50%; padding:8px!important; border:solid 2px #FFF!important;}
				.downloadlabel img{ width: 13px; height:auto;}

			#lSettings>div#p-dates h5:not(.dropdown){text-align:left;}
			label[for=o-dates-prepared] span:first-child{display: none;}
			.resetTip {position:absolute; left:-17px; top:-20px; display:none;}
				.resetTip span { background:var(--h2col); width:100%; color:#fff; padding:2px 13px; text-transform:initial; font-size:10px; border-radius:50px; }
				.resetTip:after { content:'\25b6'; position:absolute; transform:rotate(-30deg); bottom:-10px; left:22px; color:var(--h2col); }

			.numInput{font-size:12px;}
			.numInput input, .numInput span{display:inline-block; text-align:center; padding: 0;}
			.numInput input{ width:90px; font-weight:bold; border-color:#EEE; border-width: 2px; line-height: 32px;}
			.numInput input:hover{border-color:#CCC;}
				.numInput span { border-radius:50px; line-height:26px; width:26px; height:26px; position:absolute; margin:7px -21px 8px -3px; transition:background 300ms; font-weight:bold; color:#AAA; }
					.numInput input+span { margin:7px -24px; }
					.numInput span:hover{ background:var(--h2col); color:#FFF;}
				.numInput + .helpbtn { top: -30px; }

	#lPreview{background:#FAFAFA; display:inline-block; width:calc(100% - 150px); vertical-align:top; transition:all 300ms 250ms; height:100%; position:absolute; left: 150px}
		#lPreviewNest{  transition:all 400ms; transform-origin: top left; display:inline-block; padding:10px; }

		#lPreviewNest .el{font-family:robotocond,Arial, Geneva, sans-serif;}
		/* #lPreviewNest *{font-family:robotocond,Arial, Geneva, sans-serif!important;} */
		#labelDownload>svg{display: none;}
			#labelDownload g[id*="icon-"] {color: white;} /* 62045 - fix allergen svg icon color (dom2img) */
			#labelDownload .el:not(.sustainability) svg{fill:#FFF;/*fill added here to fix color in image (domtoimage)*/}
		/* 	#labelDownload .lowRes svg{fill:#000!important;} */
			#labelDownload .labelBack .allergenicon.prop svg{fill:#777;filter: invert(48%) sepia(5%) saturate(2%) hue-rotate(333deg) brightness(94%) contrast(86%)!important;}
		/* 	#labelDownload .claim use{fill: #7b9e35!important;filter: invert(65%) sepia(38%) saturate(698%) hue-rotate(39deg) brightness(175%) contrast(83%)!important;} */
			.labelBack{ position: relative; background:#FFF; text-align:center; box-sizing:border-box; word-wrap:break-word; white-space: normal; border-radius:10px; font-size: 7pt; line-height: 120%;}
			.labelBack .unavailable{margin:0; padding: 50px 10px;}
			.labelBack .el{position:relative; z-index:1}
			.labelBack hr {margin: unset;height: 1px;}
				.labelBack .ingListFormat.hide { display:none; }
		.v2 .el{position:absolute;/* position:relative;; width:100%; */ top:0px; left: 0px;z-index:1;/* line-height: normal; */; line-height: 140%; opacity: 1; transition: border 300ms; border: 1px dotted transparent; border-radius: 3px;box-sizing: unset;}
		.v2 .el.hide{opacity: 0;transition: none;}
		.v2 .el[data-eltype="text"]{font-size: 7pt;}
		/* .v2 .el:hover, .v2 .el.elSelect{z-index: 9999!important; border-color:var(--h3col); } */
		.v2 .el:hover, .v2 .el.elSelect{ border-color:var(--h3col); }
		.v2 .el:not(.graphic):hover, .v2 .el:not(.graphic).elSelect {z-index: 9999!important;}
		.v2 .el.elSelect{ border-style:solid;}
		.v2 .el[data-fixedalignment="1"]{ text-align:center!important; }

	.v2 .nutrition:not([data-eltype="text"]){width:auto!important; max-width:none!important;/*this width is for nutrition panel to scale*/}
	.v2 .allergenicon,.v2 #p-allergens h3,.v2 #p-storage h3{color:inherit;}
		.v2 #p-allergens[data-eltype="text"] h3,.v2 #p-storage[data-eltype="text"] h3{font-size: inherit}
		#lPreview .labelBack{ border:0; box-shadow:1px 2px 5px #999;/*margin-bottom:10px;*/;box-sizing: border-box; display:inline-block; vertical-align: top;}
		#lPreview .blueline{display:none;}
		.labelBack.loading:before{content:''; background:url(/media/loading-pulse-blue.gif) no-repeat center; width:50px; height:50px; display:block; position:absolute; top:50%; left:50%; margin-left:-25px; margin-top:-25px;}
		.labelBack.loading .el{opacity: 0;}
		.labelBack .title.largeText{font-size:18px!important;}
		.labelBack h1, .labelBack .h1Text{ font-size:20pt; letter-spacing:-1px; margin:10px 0; line-height: 90%;}
		.labelBack .largeText{font-size:14pt; line-height:90%;}
		.labelBack .medText{font-size:10pt;}
		.labelBack .smallText{font-size:8pt;}
		.labelBack h3{margin:10px 0;}
		.labelBack h1+h3{ margin:-5px 0 10px}
		.labelBack .el{margin:5mm 0;}
		.labelBack .allergens h3 {font-size: 9px;}
		.labelBack .allergens .allergenicon span {height: 23px;width:23px;display: inline-flex;}
		.labelBack .nicEdit-body {margin: unset;}


		.v2 .el{margin:auto; font-weight: 400}

		/* .v2 #p-title{letter-spacing: -1px} */
		.v2 #p-title, .v2 #p-price {font-size: 16pt;}
		.v2 #p-title strong{display: block; line-height: 100%;margin-bottom: 5px}
		.v2 #p-title .description{font-size:7pt;line-height: 100%;letter-spacing: normal;}
		.v2 .graphic .gImg.bg{position:initial;}
		.labelBack #sett-p-allergens{white-space: nowrap;}
		.labelBack .allergenicon, #lSettings .allergenicon {line-height:10px;white-space: nowrap;}
		.labelBack .allergenicon.icon-gluten, #lSettings .allergenicon.icon-gluten,.labelBack .allergenicon.icon-nuts, #lSettings .allergenicon.icon-nuts, .labelBack .allergenicon.icon-crustaceans, #lSettings .allergenicon.icon-crustaceans{white-space:normal;}
		.labelBack ul{display: inline-block;}

		.labelBack #p-allergens h3{margin:10px 0 5px;}
		.v2 #p-allergens .allergenicon:last-of-type{ margin-bottom: 0px; }
		.v2.labelBack #p-allergens h3, .v2.labelBack #p-quid h3, .v2.labelBack #p-storage h3{margin: 0px 0 5px; font-size: 10px;font-weight: 700;letter-spacing: unset;}
		.v2.labelBack #p-quid, .v2.labelBack #p-storage{font-weight: normal!important;-webkit-font-smoothing:antialiased;}

		.labelBack .claims #hClaims,.labelBack .claims #claimsbox, .labelBack .claims #otherClaims{width:auto;margin:0px; overflow:hidden; padding-top: 3px;;}
		/* .labelBack .claims .claimBadges{display: grid; grid-template-columns: 1fr 1fr 1fr;} */
		.labelBack .claims .claimBadges{display: flex; flex-flow: row wrap; justify-content: space-evenly;}
		.labelBack .claims .claimBadges img{ padding: 5px 10px;}
		.labelBack .claims .claimBadges.extrasmall img{height: 30px;}
		.labelBack .claims .claimBadges.small img{height: 50px;}
		.labelBack .claims .claimBadges.medium img{height: 70px;}
		.labelBack .claims .claimBadges.large img{height: 90px;}
		.labelBack .claims .claimBadges.extralarge img{height: 110px;}
		.labelBack .claims #claimsbox h4:only-child{width: auto;}


		.v2 .claims>div{font-size: 10px!important;}
		.labelBack .el.invert,.labelBack .el.invert *{color:white; border-color:white;}
		.labelBack .el.invert svg{background:transparent; fill:#FFF;}
		.labelBack .customText.placeholderHint{color: #AAA;}

		.labelBack .el.invert table, .labelBack .el.invert table td{border-color:#fff!important}
		p.date { line-height: 100%; }
		.labelBack #p-origin{width:auto!important;}
		#p-barcode img,#p-qr_code img{max-width:100%; width:auto; height: auto; margin:0; image-rendering: -webkit-optimize-contrast; image-rendering: optimize-contrast; filter:none!important;pointer-events: none;}
		#p-barcode label[for=o-barcode-white]{display: none;}
		.largeText.barcode img{width:75%!important;}
		.medText.barcode img{width:50%!important;}
		.minText.barcode img{width:40%!important;}
			.labelBack .el.graphic{margin:0; position:relative;box-sizing: unset;}
			.v2 .el.graphic{position:absolute; width:100%}
			.graphic img{width:100%; height:auto; pointer-events: none;}
			.v2 .graphic img{width:100%!important}
			.graphic img.bg{  position:relative; z-index:0; }
			.graphic img.tmpl{opacity:0.65;}

			.minText.graphic img{width:50%;}
			.medText.graphic img{width:65%;}
			.largeText.graphic img{width:80%;}
			.h1Text.graphic img{width:100%;}
			.graphic .gImg.bg{position:absolute;}
		.lowRes.labelBack{font-size:7pt;color:#000!important;}
		.lowRes .allergenicon span{ background:#FFF; border:solid 2px #000; padding:4px }
		.lowRes .allergenicon svg{/* fill:#000!important; */ filter:invert(80%) sepia(0%) saturate(7471%) hue-rotate(259deg) brightness(95%) contrast(107%)!important;}
		.pdfdownloadmode .lowRes .allergenicon svg{fill: black;}
		.lowRes img:not(.tmpl){ filter:grayscale(1); }

		.imgPreview{margin-top:50px;}
		.imgPreview img{width:100%;}
		.uploadLogo{position:relative;}
		.uploadLogo h1{ background:var(--hcol); color:#fff; font-size:10px; padding:8px 20px; display:inline-block; text-transform:uppercase; border-radius:2px; margin-bottom:7px;}
		.uploadLabel{ position: absolute !important; opacity: 0; top: 0px;cursor:pointer;}
		.label #dropPortionMenu{left: 90px!important; top: 37px!important;}
		#oPreview{ margin:50px auto; transform:scale(2);}
		.previewWrap{position:absolute; top:-750px;}
		#sett-p-barcode .previewWrap {width: 100%}
			#fopPreview{ display:inline-block;}

		#addNutrient{ text-transform:uppercase; font-weight:bold; position: absolute; display:none; }
		#addNutrient.on{display:block;}
		#fopPreview a{display:none;}


		#fopPreview a{ text-transform:uppercase; font-weight:bold; display:table; margin-top:25px; }
		#additionalNutrient label{position:relative;}
		#additionalNutrient.submenu { position:absolute; top:370px; margin:-125px auto; right:0; left:0; z-index:5; background:#FFF; overflow:hidden; padding:30px 40px 30px 40px; box-sizing:border-box; white-space:normal; opacity:0; -webkit-column-count:4; -webkit-column-gap:7px; column-count:4; column-gap:7px; pointer-events:none; box-shadow:0px 1px 20px rgba(0,0,0,0.3); max-width:753px; min-height:420px; overflow-y:auto; display:none; border-radius:30px; }
		#additionalNutrient .delbtn{top:6px; right:10px;}
		#additionalNutrient.submenu.sel { opacity:1; max-height:400px; pointer-events:inherit; display:block !important;}
		#additionalNutrient .bluebtn{height:28px; line-height:28px;}
		#additionalNutrient .claimNutrient{background: #ddd;color: #888; font-style: italic; }
		#additionalNutrient .claimNutrient:after { content:'claim enabled'; color:var(--hcol); /*position:absolute; right:8px; top:5px;*/ display: block; text-align: right; padding-right: 10px; }
		#additionalNutrient .claimNutrient:before{ content:'\2714'; position:absolute;/* margin-top:6px; margin-left:5px;*/ top: 30% !important; left: 3px !important; }

		#updateTemplate { background:#FFF; position:absolute; right:30px; padding:10px 40px; border-radius:60px; text-align:center; box-shadow: 1px 1px 6px rgb(0 0 0 / 30%); display: none; }
		#updateTemplate.on{ display: block; }
		#updateTemplate p{ margin-bottom: 5px; }

		.lbl-percRi,[data-type="p-nutrition"] .numInput,.lbl-servDesc,.lbl-servSizeDesc,.lbl-packDesc,.lbl-linearFormat {display:none;}
		/*.labelBack #p-nutrition{display: inline-block;min-width: 307px;}*/
		.nutrition:not([data-eltype="text"]){font-size:9px !important;height: fit-content;}
		[data-type="p-nutrition"] .hiddenOptions .numInput{display:block!important}
		[data-type="p-nutrition"].EU.BOP .lbl-percRi, [data-type="p-nutrition"].UK.BOP .lbl-percRi,
		[data-type="p-nutrition"].EU.BOP .lbl-linearFormat, [data-type="p-nutrition"].UK.BOP .lbl-linearFormat,
		[data-type="p-nutrition"].EU.BOP .numInput, [data-type="p-nutrition"].UK.BOP .numInput,[data-type="p-nutrition"].US.BOP .numInput,[data-type="p-nutrition"].GC.BOP .numInput,
		[data-type="p-nutrition"].EU.BOP .lbl-servDesc, [data-type="p-nutrition"].UK.BOP .lbl-servDesc,[data-type="p-nutrition"].US.BOP .lbl-servDesc,[data-type="p-nutrition"].GC.BOP .lbl-servDesc
		,[data-type="p-nutrition"].AU.BOP .lbl-servDesc,[data-type="p-nutrition"].AU.BOP .numInput,[data-type="p-nutrition"].SA .lbl-servDesc ,[data-type="p-nutrition"].US .lbl-packDesc,[data-type="p-nutrition"].US .lbl-servSizeDesc,[data-type="p-nutrition"].GC .lbl-packDesc,[data-type="p-nutrition"].GC .lbl-servSizeDesc{display:block;}
		[data-type="p-nutrition"].SA .lbl-percRi{display:none;}
		[data-type="p-nutrition"].US label[for=o-nutrition-perServ],[data-type="p-nutrition"].GC label[for=o-nutrition-perServ]{display:none;}
		[data-type="p-nutrition"].AU label[for=o-nutrition-packServ]{display:none;}
		[data-type="p-nutrition"].AU.BOP .lbl-percRi{display:block}
		[data-type="p-nutrition"].UK.BOPc .lbl-linearFormat, [data-type="p-nutrition"].UK.BOPc .lbl-percRi, [data-type="p-nutrition"].UK.BOPc .numInput, [data-type="p-nutrition"].UK.BOPc .lbl-servDesc,
		[data-type="p-nutrition"].EU.BOPc .lbl-linearFormat, [data-type="p-nutrition"].EU.BOPc .lbl-percRi, [data-type="p-nutrition"].EU.BOPc .numInput, [data-type="p-nutrition"].EU.BOPc .lbl-servDesc{display:none;}

		/*//Divya//#59003//Start*/
		.lbl-incBorder{display:none}
		[data-type="p-nutrition"].EU._Nprofile_H .lbl-incBorder,
		[data-type="p-nutrition"].EU._Nprofile_V .lbl-incBorder{display:block}
		[data-type="p-nutrition"].EU._Nprofile_H .lbl-perServ,
		[data-type="p-nutrition"].EU._Nprofile_V .lbl-perServ{display:none}
		/*//Divya//#59003//End*/
		.sett-p-claims #claimsbox,.sett-p-claims #otherClaims { display:inline-block;margin-top:0; width:250px;}
			.sett-p-claims #claimsbox h4,.sett-p-claims #otherClaims h4 { float:left; width:50%; font-size:inherit; margin:0; text-overflow:ellipsis; overflow:hidden;}
			.sett-p-claims #claimsbox label,.sett-p-claims #otherClaims label { float:left; width:50%; font-size:inherit; margin:0; text-overflow:ellipsis; overflow:hidden;}
			.sett-p-claims #hClaims{margin:0px; width:265px; text-align:left;display: block; }
			.sett-p-claims .claimText { display:block; word-wrap:break-word; white-space:normal; }
			.sett-p-claims .claimText:before{content:'\2605'; padding-right: 5px; position: relative;}
			.sett-p-claims .unavailable{margin: 0; padding: 40px 0px;}
			.sett-p-claims h5{font-size: 14px;}
		.labelBack .claims #claimsbox h4, .labelBack .claims #otherClaims h4{float: none!important; text-align: left; font-weight: bold; line-height: 13px;}

		#p-quid.minText{font-size:7px!important;line-height:7px;}
		#p-quid.medText{font-size:9px!important;line-height:9px;}
		#p-quid.largeText{font-size:14px!important;line-height:14px;}
		#p-quid.h1Text{font-size:24px!important;line-height:24px;}
		/*#p-quid.minText{font-size:11px!important;line-height:11px;}
		#p-quid.medText{font-size:12px!important;line-height:12px;}
		#p-quid.largeText{font-size:16px!important;line-height:16px;}
		#p-quid.h1Text{font-size:26px!important;line-height:26px;}*/
		.boldCapsFirst{font-weight:bold !important;text-transform:capitalize !important;}
		.boldUnderlined{font-weight:bold !important;text-decoration: underline!important;}
		.capsUnderlined{text-transform:uppercase !important;text-decoration: underline!important;}
		.capsBold{text-transform:uppercase !important;font-weight:bold !important;}

		#p-instructions.minText *{font-size:7px!important;line-height:7px!important;}
		#p-instructions.medText *{font-size:9px!important;line-height:9px!important;}
		#p-instructions.largeText *{font-size:14px!important;line-height:14px!important;}
		#p-instructions.h1Text *{font-size:24px!important;line-height:24px!important;}
		#p-instructions li{list-style-position: inside;}
		/* .lowRes .instructions *,.lowRes .quid *,.lowRes .origin *{color: #000!important;background: transparent!important;} */
		.lowRes .el[data-eltype='text'], .lowRes .el[data-eltype='text'] *, .lowRes #p-allergens{color: #000!important;background: transparent!important;}
		.lowRes .el.dividerline {color:#000 !important}
		/*#p-instructions.minText{font-size:11px!important;line-height:11px;}
		#p-instructions.medText{font-size:12px!important;line-height:12px;}
		#p-instructions.largeText{font-size:16px!important;line-height:16px;}
		#p-instructions.h1Text{font-size:26px!important;line-height:26px;}*/
#AUorigin select{text-transform: none;}
		#drawOrigin {  width:250px; }
			#drawOrigin.vertical{width:65px}
			#drawOrigin .img { background:url(/media/kangaroo.svg) no-repeat; width:37px; height:100%; background-size:100%; position:absolute; }
			#drawOrigin .percBar { width:38px; height:15px; border-radius:15%; border:2px solid #007A5E; position:absolute; box-sizing:border-box; text-align:left; }
			#drawOrigin span { display:inline-block; width:2px; height:6px; background:#007A5E; margin-left:5.2px; margin-top:5px; }
			#drawOrigin .text { margin-left:50px; background:#fff; font-size:15px; text-align:left; line-height:15px; width:185px; font-weight:bold; box-sizing:border-box; padding-top:3px;min-height: 52px;  }
			#drawOrigin .c3,#drawOrigin .c2,#drawOrigin .c1{position:relative; background:#fff; width:100%; padding:4px 5px; border:2px solid #007A5E; border-radius:5px; box-sizing:border-box;}
			#drawOrigin .c3.vertical,#drawOrigin .c2.vertical  { width:65px; padding:2px 2px; display:inline-block; }
			#drawOrigin .c3 .percBar { top:41px; }
			#drawOrigin .c3.vertical .text,#drawOrigin .c2.vertical .text { display: inline-block;text-align: center; font-size: 10px; text-align: center; line-height: 10px;padding-top: 55px;min-height: 120px; width:55px; margin-left: auto;white-space:normal}
			#drawOrigin .c3.vertical .img{left:11px;}
			#drawOrigin .c3.vertical .percBar{left:11px;top:38px;}
			#drawOrigin .c2 .img{display:none;}
			#drawOrigin .c2 .percBar{top:23px;left:8px;width:45px;}
			#drawOrigin .c2 .percBar span{margin-left:6.4px;}
			#drawOrigin .c2.vertical .text{padding-top:28px;min-height:92px;}
			#drawOrigin .c2.vertical.c2SubLabel .text {min-height:75px;}
			#drawOrigin .c2.vertical .percBar{left: 8px;  top: 5px;}
			#drawOrigin .c1{border-color:#000;}
			#drawOrigin .c1 .img,#drawOrigin .c1 .percBar{display:none;}
			#drawOrigin .c1 .text{margin-left:auto;width:100%;min-height: auto;white-space:normal;text-align:center;}
			#drawOrigin .c1.vertical{width:100px;left:85px;}
			#AUoPreview #drawOrigin{text-align:center;white-space:normal;}


		#p-price p.h1Text{font-size:30pt!important;}
		.originStamp{ display:inline-block; font-size:7pt; text-align:center; font-family:Courier,monospace; border:2px solid #333; padding:10px 15px; border-radius:50%; font-weight:bold; color:#333; line-height:100%;}
		.h1Text .originStamp{font-size:20pt;padding:15px;}
		.medText .originStamp{font-size:5pt;padding:8px;}
		.labelBack .invert .originStamp{color:#FFF; box-shadow:0 -2px 2px rgba(0,0,0,0.1); border-color: #FFF;}
		[data-type="p-nutrition"] .hiddenOptions label:nth-child(-n+1),#p-origin .hiddenOptions label:nth-child(-n+1),#p-origin label[for=o-origin-white],[data-type="p-nutrition"] label[for=o-nutrition-white]{display:none;}
		/*[data-type*="p-quid"] .hiddenOptions label:nth-child(-n+2),[data-type*="p-instructions"] .hiddenOptions label:nth-child(-n+2),[data-type*="p-textarea"] .hiddenOptions label:nth-child(-n+2), [data-type*="p-nutrition"] .hiddenOptions label:nth-child(-n+2){	display:none;}*/
	/*LABEL TEXT EDITOR:*/
	.labelMaker .nicEdit-head, .labelMaker .nicEdit-panelContain,  .labelMaker .nicEdit-body, .labelMaker .nicEdit-main{width: 100%!important; box-sizing: border-box;margin: 0!important;}
	.labelMaker .notesdiv .optBtn { position:absolute; right:2px; top:2px; font-size:10px; transition:transform 0.5s; color:var(--hcol); cursor:pointer!important; padding:12px 10px; }
	.labelMaker .notesdiv .optBtn:hover {text-shadow:0px 0px 1px rgba(0,0,0,0.5);  }
	.labelMaker .nicEdit-panel{height:36px; transition:all 0.5s; width:235px;}
	.labelMaker .nicEdit-main{padding: 0px 10px}

	.labelMaker .notesdiv.on .nicEdit-panel{height:75px;}
	.labelMaker .notesdiv.on .optBtn{ transform:rotate(-180deg);}
	.labelMaker .notesdiv .nicEdit-options{top:40px; left:2px!important;}
	.labelMaker .notesdiv.on .nicEdit-options{ top:112px; }
	.labelMaker .nicEdit-pane{border:0!important;z-index: 9999; position:fixed}
	.laberMaker .nicEdit-uploadImg .nicEdit-pane{width:256px!important;}
	.labelMaker .fileName{display:none;}
	#labelOptions label{display:none;}
	#labelOptions label.on{display:block;}

	#lFormatBar{ position:absolute; background:#FFF; padding-top:5px; border-radius:22px; box-shadow:3px 3px 9px rgba(0,0,0,0.7); visibility: hidden; pointer-events: none; opacity: 0;transition: all 300ms;z-index: 1; }
	#lFormatBar.on{visibility:visible; opacity: 1; pointer-events: all;}
	#lFormatBar .textopts{display: none;}
		#lFormatBar.textFormat #scaleBtn,#lFormatBar.dividerLine #scaleBtn {display: none;}
		#lFormatBar.textFormat .textopts{display: block;}
		#lFormatBar p { position:relative; margin: 0px 5px 5px 5px; width:38.5px; text-align:center; cursor: pointer; }
		#lFormatBar p:not(#colorBtn):hover:after,#lFormatBar p:not(#colorBtn):hover:before{content:''; position:absolute; width:45px; height:50px; display:block; right:-45px; top:0px;}
		#lFormatBar p.allowReset:not(#text-alignBtn) .barOpt::before { content:'\0021ba'; position:absolute; color:var(--hcol); font-weight:bold; font-size:22px; top:-1px; background:#FFFFFF; width:36px; height:36px; left:-1px; box-sizing:border-box; border-radius:50px; line-height:34px;transition: all 300ms;opacity: 0;    border: 1px solid #DDD;}
		#lFormatBar p:not(#text-alignBtn):hover .barOpt::before{opacity: 1;}


		#lFormatBar p:before{left:-45px;}
		#lFormatBar p.on .barOpt{background:var(--hcol); color: #FFF; }
		#lFormatBar p .barOpt{ display: block; width:36px; height:36px; border:1px solid #DDD; border-radius:50px;  margin: 0 auto; box-sizing:border-box; transition: background 300ms; cursor: pointer; padding:7px;position: relative;}
			#lFormatBar p .barOpt svg{cursor: pointer; pointer-events: none; }
		/* #lFormatBar p:hover span{background:var(--hcol); color:#FFF;} */
		#lFormatBar .incDec a{position:absolute; width:36px; height:36px; line-height: 36px;text-align:center; background:var(--hcol); top:0;right:0;left:0; border-radius:50px; font-size:16px; color:#FFF; box-sizing:border-box; z-index: -1;opacity: 0; transition: all 300ms; cursor: pointer;}
		#lFormatBar .incDec:hover a{opacity: 1; z-index: 1;}
		#lFormatBar .incDec:hover .icon-minus{left:-43px;}
		#lFormatBar .incDec:hover .icon-plus{left:45px;}
		#lFormatBar .incDec .icon-minus::before{content:'-'}
		#lFormatBar .incDec .icon-plus::before{content:'+'}
		#lFormatBar .incDec input{width:34px; padding: 1px 0px 0px 0px; text-align:center; font-size:11px; font-weight:bold; border:none; color:var(--hcol);}
		#lFormatBar #colorBtn{ margin:-2.5px 0px 2.5px 0px; width:50px; padding:2.5px 0px; }
	   	#lFormatBar #colorBtn.on{background:#EEE;}
		#lFormatBar #colorBtn span{z-index: 1}
		#lFormatBar #colorBtn span svg:last-child {position: absolute;left:7px; }
		#lFormatBar #colorBtn:hover svg:last-child {display: none;}
		/* #lFormatBar #colorBtn span,#lFormatBar #colorBtn span svg use{pointer-events: none;} */
		#lFormatBar .colorPanel{ position:absolute; z-index:0; left:50px; padding:40px 5px 0px 0px; width:190px; border-radius:0px 18px 18px 0px; top:-136px; box-shadow:3px 1px 8px 0px rgb(0 0 0 / 80%);}
		#lFormatBar .colorPanel .delbtn{display: none;}
		#lFormatBar:not(.modifyWidth) .colorPanel{ top:-100px; padding:40px 6px 0px 45px; width:235px; border-radius:18px 18px 18px 18px; left:1px; z-index:-1; }
		#lFormatBar:not(.modifyWidth) .colorPanel.disablePanel:before{width:186px; right:0; left:auto;}
		#lFormatBar #widthBtn{display: none;}
		#lFormatBar.modifyWidth #widthBtn,#lFormatBar.enableColor #colorBtn{display: block;}
		#lFormatBar #text-alignBtn, #lFormatBar #font-sizeBtn, #lFormatBar #widthBtn{z-index: 1}
		#lFormatBar #text-alignBtn span{display: none;}
		#lFormatBar #text-alignBtn.left span:nth-child(1){display: block;}
		#lFormatBar #text-alignBtn.center span:nth-child(2){display: block;}
		#lFormatBar #text-alignBtn.right span:nth-child(3){display: block;}
		.v2 .el.disabled{pointer-events: none;}
		.labelBack .el.elSelect .delbtn { position:absolute; top:-8px; right:-7px; width:15px; height:15px; font-size:7px; line-height:14px; font-weight:900; text-transform:lowercase; }
		.labelBack .el.elSelect.transition{transition: all 300ms}

		#sett-p-allergens svg{display: block;}

.colorPanel { width:172px; white-space:normal; box-sizing:border-box; background:#FFF; padding:10px 10px 0px 10px; border-radius:20px; box-shadow: 0 3px 10px rgba(0,0,0,0.2); }

	.colorPanel.disablePanel:before{ content:'Colours are unavailable in low resolution mode'; position:absolute; width:100%; left:0; padding:58px 10px; background:#FFF; box-sizing:border-box; top:40px; border-radius:0px 0px 18px 0px; height:178px; color:#888; font-size:12px; line-height:150%; text-align:center;}
	.colorPanel span.color { width:21px; height:21px; display:inline-block; border-radius:50px; border:1px solid #EEE; margin-bottom:-2px; cursor:pointer; transition:transform 300ms; box-sizing: border-box;}
	.colorPanel span.color:hover{transform:scale(1.1);}
	.colorPanel .delbtn{position:absolute; top:-6px; right:-3px; background:#DDD;}
	.colorPanel input{ background:#FFF; font-weight: 900; text-align:center; color:var(--hcol); font-size:11px; width:75px; margin:9px auto; display:block; padding:0; border:none;}
	.colorPanel .selectFont .variant { border-radius:0; background:none!important; color:#444!important; }
	.colorPanel .selectFont{ width:165px; margin-bottom:10px; border:0; top:0; box-shadow:none;}
	.colorPanel .selectFont .selected{font-size:13px; padding-left:10px;}
	.colorPanel .selectFont .selected::after{ background:none; font-size: 10px;}
	.colorPanel .selectFont.hov .selected::after{color: var(--hcol);}
	.colorPanel .selectFont .selectdrop{width:190px;}
	.colorPanel .selectFont .selectdrop div{font-size: 14px;}

.selectFont #viewMore{display: block!important; text-transform: uppercase;}
	.selectFont div{text-align: left}
	/* .selectFont .variant:before { content:'-'; display:inline-block; margin:0px 3px;} */
	.selectFont .selectdrop{ background:#eeeeee; text-align:center;}
		.selectFont .selectdrop .lgreyback{ background-color: #eee; display: flex; }
		#lFormatBar .colorPanel .selectFont .selectdrop .clearSearchFont{ top:12px; right:3px; display:block }
	.selectFont.hov.loadingFont .selectdrop div:before { content:''; position:absolute; width:100%; text-align:center; background:url(/media/loading-bar-blue.gif) no-repeat rgb(238, 238, 238); height:100%; background-position:center; background-size:25px; left:0; }



#results-foodSearch .label, #wrapperReplaceIng .tblReviewReplace .labelsContainer .label { height:220px; margin:0 5px; overflow:hidden; max-height:none; position:relative; background:#FAFAFA; border-radius:15px; box-shadow: 0 0 15px rgba(0,0,0,0.1);}
#results-foodSearch .label:hover, #wrapperReplaceIng .tblReviewReplace .labelsContainer .label:hover{ box-shadow: 0 0 15px rgba(0,0,0,0.3); border-radius: 20px;}
	#results-foodSearch .label:active, #wrapperReplaceIng .tblReviewReplace .labelsContainer .label:active{ transform:scale(0.9)}
	#results-foodSearch .label p, #wrapperReplaceIng .tblReviewReplace .labelsContainer .label p { position:absolute; bottom:0; left:0; right:0; height:auto; margin:0; text-align:center; padding: 40px 10px 15px; background: linear-gradient(0deg, rgba(255,255,255,1) 40%, rgba(255,255,255,0) 100%);}
	.labelThumb{ background:#FFF; border-radius:3px; transform:rotate(10deg) translate(-60%, -58%); box-shadow:1px 1px 25px rgba(0,0,0,0.1); position: absolute; left: 50%; top: 50%; transition:all 300ms}
	#results-foodSearch .label:hover .labelThumb, #wrapperReplaceIng .tblReviewReplace .labelsContainer .label:hover .labelThumb{ transform:rotate(10deg) translate(-60%, -58%)  scale(1.1); box-shadow:1px 1px 15px rgba(0,0,0,0.4); }
	#results-foodSearch .largebtn{margin:10px 53px; width:80px;}

#additionalNutrient .disabled:before { content:'\2714'; position:absolute; /*margin-top:6px; margin-left:5px;*/ top:35%; left:5px; }
	#additionalNutrient .disabled,#additionalNutrient .notAllowed { color:#AAA; pointer-events:none; }
	#additionalNutrient .notAllowed:before { content:'\2a2f'; position:absolute; /*margin-top:4px; margin-left:4px;*/ top:30%; left:4px; font-style:normal; font-size:15px; }

/*//////////////////////////////////////// IFR-REPORT ////////////////////////////////////////*/
body#ifr-report{overflow:inherit; color:#000; background:#FFF; margin-top:40px; border:0;}
	body#ifr-report .smallText{font-size:7pt;}
	body#ifr-report td p{color:#333; font-style:italic; font-size:8pt}
.heading{ font-size:22pt; font-style:italic;}
#subhead{margin-bottom:20px; margin-top:2px; font-size:8pt; line-height:20px;}
#showingDays{border:solid 1px #CCC; padding:3px 8px 3px 10px; float:right; font-size:8pt; font-weight:bold; margin: 0 -4px 0 12px; border-radius:30px; cursor:pointer}
#showingDays span{ border-radius:50%; font-size:8px; background:#BBB; font-weight:bold; font-family:Roboto, Arial, Helvetica, sans-serif; color:#fff; margin-left:4px; display:inline-block; width:16px; height:16px; line-height:17px; text-align: center; box-sizing:border-box; cursor:pointer}
#showingDays span.selected{background:var(--hcol);}
.report.mealsxday{height:auto; box-shadow: none;padding: 0;}
.report.mealsxday #clientDetails .divTableContainer{ float:right; margin:0 -4px 2px 20px; }
.report.mealsxday .divTableContainer #showingDays { width:unset; float:right; font-size:9px; padding:5px 10px 5px 22px; display:inline-block; border-radius:0; margin:1px 3px; font-weight:bold; color:#666; position:relative; text-align:center}
.mealsxday #showingDays:after,.mealsxday #showingDays:before{ display:block;}
.mealsxday #showingDays.divTable:after{content:'MEALS';}
.mealsxday #showingDays.divTable:before{ content:'DAYS'; transform:rotate(-90deg); position:absolute; left:4px; top:50%; margin-top:-14px; }
.report.mealsxday .divTableContainer #showingDays *{ cursor:pointer; }
.report.mealsxday .divTableContainer #showingDays .divTableCell{ padding:1px; }
.report.mealsxday .divTableContainer #showingDays .divTableCell >div{ background-color:#BBB; width:6px; height:6px; border-radius:100%; }
.report.mealsxday .divTableContainer #showingDays .divTableCell.on >div{ background-color:var(--h2col); }
.report.mealsxday #showingDays { float:right; margin-top:-30px; color:var(--hcol); margin-right:0px; margin-bottom:-10px; }
.report.mealsxday #showingDays:not(.divTable)+p+p#subhead .fr{ margin-right:unset; margin-top:unset; }
#ifr-report .report.mealsxday #subhead{ margin-top:30px; }
#clientname { font-size: 28px; display: inline-block; color: var(--hcol); letter-spacing: -0.5px; font-style: italic;}
.unavailable, #unavailable{font-size:22px; padding:50px; margin:20px; color:#CCC; font-style: italic;  white-space: normal; text-align: center; font-weight:900; letter-spacing:-0.5px;}
	.unavailable .smallText, #unavailable .smallText, .unavailable .medText{ font-style:normal; letter-spacing:normal;}
	.unavailable .smallText:not(a), #unavailable .smallText:not(a), .unavailable .medText:not(a){ color:#AAA; }

.notes{width:609px; min-height:50px; margin-top:15px; border:solid 1px #CCC; font-size:11pt; color:var(--hcol); font-family:Roboto, Arial, Helvetica, sans-serif; line-height:140%;}

#ifr-report .nicEdit-head{width: 798px!important;}
#ifr-report .nicEdit-body{width: 795px!important;}
#ifr-report .nicEdit-main{width: 760px!important;}

#reportMenu{font-size:11px; font-weight:bold; position: fixed; left: 0; right:0; top:0; z-index: 3; width:100%}
	#reportMenu.scrolled{ box-shadow:0px 3px 10px 0px rgba(0, 0, 0, 0.3); border-bottom:0}
	#reportMenu select{color:var(--hcol); margin-right:10px; padding:3px; width: 115px; height:29px; border:0; box-shadow: 0px 1px 1px rgba(0,0,0,0.1);}
	#reportMenu .bluebtn{ float:left; padding-left:8px; padding-right:11px; font-size:9px;  }
	#reportMenu #rdaBTN{ display:block; width:20px; line-height:30px; height:30px; padding: 0; text-align: center; border: 0; font-size: 14px; color: #DDD; position:absolute; top:7px; left:212px;}
	#rdaIDGroup{width:130px; left:138px;}
		#rdaIDGroup .selectdrop{width:205px;}
			#rdaIDGroup .selectdrop>div{ padding-left: 30px;}
			#rdaIDGroup .selectdrop>div svg{ color: #999; width: 16px; margin: 0 5px 0 -20px;}
		#rdaIDGroup:hover:before{ width: 300px;} /* hover helper */
	#eersrcGroup{width:130px; left: 324px}
		#eersrcGroup .selectdrop{width:265px;}
		#eersrcGroup:hover:before{ width:400px;} /* hover helper */
		#eersrcGroup .selectdrop div{line-height:120%; font-weight:normal; padding:13px; font-size: 14px}
		#eersrcGroup .selectdrop div span {line-height: 140%; margin-top: 4px; display: block;}
	#rep_periods{ left: 385px; width: 80px;}


.liveIndicator { display:none; color: var(--h3col); font-size: 8px; font-weight: 900; }
.liveIndicator.on { display: block; }
	.liveIndicator:before { content: ""; color: var(--h3col); display: inline-block; width: 7px; height: 7px; vertical-align: middle; margin-right: 6px; background-color: var(--h3col); border-radius: 50%; transition: all 200ms; border: solid 2px #FFF; }
	.sharedIn+.liveIndicator, .sharedOut+.liveIndicator{ scale: 0.75; margin-top: 7px !important; margin-left: 3px;}
.pane.folder .unavailable{ min-height: calc(var(--scaled-height, 100vh) - 450px);}
.pane.folder .extraBtn{ padding-left:35px; background-image:url(/media/icon-print.png); background-repeat:no-repeat; background-position:5px; }
.pane.folder .extraBtn#digital{ background-image:url(/media/icon-tablet-white.png); }
	.pane.folder .extraBtn#digital .liveIndicator { position: absolute; top: 10px; margin-left: -17px; }
		.pane.folder .extraBtn#digital .liveIndicator:before { margin-top: -11px; }

.pane.folder .extraBtn#menuOptionsDrop{ background-image:url(/media/icon-settings.png); background-position:center; position:absolute; top:0; left:736px; }
.pane.folder .item a:not(.lgreybtn):not(.btn):not(.basketbtn):hover{ color:var(--hcol); }
.pane.folder .fixedHeader >div{ white-space:normal; background-color: #FFF;flex-shrink: 0;}
.pane .folder:not([data-type="menu"]) .fixedHeader .column:nth-child(n+2){ cursor:grab;white-space: nowrap;text-overflow: ellipsis;overflow: hidden; }
.pane .folder[data-type=menu] .fixedHeader .column:nth-child(n+4){ cursor:grab;white-space: nowrap;text-overflow: ellipsis;overflow: hidden; }
.pane.folder .bigcheck { margin-top: -5px; }
.pane.folder #monitorsDropSub, #usersDropSub{ position:absolute!important; top:40px; z-index: 3;overflow: auto;}
.pane.folder #mainnest .folder[data-type="menu"] #monitorsDropSub.submenu.bigdrop:before{ margin:-41px 375px; }
	.pane.folder #mainnest .folder[data-type="menu"] .grouped h5>input{line-height:normal; width: 270px; }
	.pane .folder[data-type=food] #monitorsDropSub:before,.pane .folder[data-type=recipe] #monitorsDropSub:before,.pane .folder[data-type=mealplan] #monitorsDropSub:before,.pane .folder[data-type=program] #monitorsDropSub:before{margin: -41px 215px;}
	.pane .folder[data-type="allPubFood"] .selectdrop:has(#source) div:has(input[name="U"]) {display: none;}
	.pane.food #foodcatSub:before{margin-left:565px;}
	.pane.recipe #foodcatSub:before{margin-left:475px;}
	.pane .folder #monitorsDropSub #portiondetails,.pane .folder #monitorsDropSub #portiondetails+span{display: none;}
	.pane .folder[data-viewType=tableView] #monitorsDropSub #portiondetails,.pane .folder[data-viewType=tableView] #monitorsDropSub #portiondetails:not(.hidden)+span{display:block;}
	.pane .folder[data-viewType=tableView] .avgCost{display: block !important; pointer-events:none !important;}
	.folder[data-type="food"] #view:not(.tableView.portionsVisible) [data-type="portion"],.folder[data-type="recipe"] #view:not(.tableView.portionsVisible) [data-type="portion"] {display:none !important}
	[data-type="menu"] .bigdrop.withTemplates .bigdropList, .folder[data-type="food"] .bigdrop.withTemplates .bigdropList, .folder[data-type="recipe"] .bigdrop.withTemplates .bigdropList, [data-type="catalogue"] .bigdrop .bigdropList {width: calc(100% - 280px) !important;}

	.pane.folder #monitorsDropSub input[type=checkbox] + span:before, #usersDropSub input[type=checkbox] + span:before { content:"\2714"; color:rgba(0,0,0,0.3); display:inline-block; width:16px; height:16px; line-height:16px; vertical-align:middle; margin:-4px 5px -4px -5px; background-color:rgba(0,0,0,0.1); border-radius:50%; transition:all 200ms; text-align:center; font-size:8px; font-weight:900; }
	.pane.folder #monitorsDropSub .head input[type=checkbox] + span:before, #usersDropSub .head input[type=checkbox] + span:before { background-color: #fff; color: #888; opacity: 0.6}
	.pane.folder #monitorsDropSub input[type=checkbox]:checked + span:before, #usersDropSub input[type=checkbox]:checked + span:before{ color: white; background-color: var(--hcol); opacity: 1}
	.pane.folder #monitorsDropSub input[type=checkbox]:checked:disabled + span {filter: opacity(0.5);}
	/* .pane.folder #monitorsDropSub label.head input[type=checkbox]:checked + span:before{ background: var(--bgcol3); color:var(--hcol) } */
	.pane.folder #monitorsDropSub .subhead.hidden+.subarrow, #usersDropSub .subhead.hidden+.subarrow{display:none;}
	.pane.folder #monitorsDropSub .delWrap, #usersDropSub .delWrap { width: 730px; height:inherit; margin-top:-20px; }
	.pane.folder #menuOptionsDropSub, .pane.program #menuOptionsDropSub{ position:absolute!important; top:41px; }
	.pane.folder #menuOptionsDropSub::before{ margin:-40px 628px; }
	.pane.folder #menuOptionsDropSub .vSettings{ position: absolute;width:96%; height:auto; background:unset; border:unset; }
		.pane.folder #menuOptionsDropSub .vSettings label{ cursor:pointer; }

		.pane.folder #menuOptionsDropSub .vSettings .toggle{ width:45px; margin:10px 0px; }
		.pane.folder #menuOptionsDropSub .vSettings .groups{ width:100%; border:unset; }
			.pane.folder #menuOptionsDropSub .vSettings .groups .spacer { border-top:dotted 2px #CCC; line-height:100%; margin:10px 0 0; padding:10px 0 0; }
			.pane.folder #menuOptionsDropSub .vSettings .groups #dynamicGroups-menu{ margin-left:10px;}
			.pane.folder #menuOptionsDropSub .vSettings .groups a{ line-height:17px; display:inline-block; border-top:0; padding-right:5px;}
			.pane.folder #menuOptionsDropSub .vSettings .groups a.blueline{padding-left:5px; margin-left:5px;}
			.pane.folder #menuOptionsDropSub .vSettings .helpbtn.info{margin-top: -27px; margin-left: 130px; float: left;}
			.pane.folder #menuOptionsDropSub .halfdiv{width: 50%; margin: 0px; border: 0px; vertical-align:top;}
			.pane.folder #view{ /* overflow-y: scroll;*/ /* max-height: 100vh; */}
			.pane.folder #view:not(.empty):not(.view-waste) .unavailable, .pane.folder #view.view-surefood.empty > *:not(.unavailable), .pane.folder :has(#view.empty) + #sGateWrapper, .pane.folder :has(.supplier-options) + #sGateWrapper {display: none;}
			.pane.folder #validationPanel {display: flex; flex-direction: column; height: calc(100% - 60px); position: fixed; top: 70px; left: 250px; max-width: 0; overflow: hidden; transition: max-width 300ms ease;z-index: 3;overflow-y: auto; }
			.pane.folder #validationPanel .closeBtn {position: absolute; top: 5px; left: 5px;}
				.folder[data-objname='Action required'] #validationPanel > .closeBtn { display:none; }
			.pane.folder #validationPanel.highlighting .validationRule:not(.highlighting), .pane.folder #validationPanel.highlighting h4.spacer {display: none !important;}
			.pane.folder #validationPanel .validationRule {position:relative;text-wrap: wrap;border-radius: 15px;width: 166px;transition: all 300ms ease;height: auto;box-shadow:unset;display: flex;flex-direction: column;justify-content: center;align-items: center;}
			.pane.folder #validationPanel .validationRule.published {order: -100;}
			.pane.folder #validationPanel .validationRule.rpublish[data-affected-items=""], .pane.folder #validationPanel .validationRule.approved[data-affected-items=""] {display: none;}
			.pane.folder #validationPanel .validationRule:hover { background:#F5F5F5 }
			.pane.folder #validationPanel .validationRule.on {max-height: 500px;background-color: #FFF!important;box-shadow:1px 1px 10px #CCC; z-index:1}
			.pane.folder #validationPanel .validationRule::after { content:''; position:absolute; right:-7px; top:50%; transform:translateY(-50%); border-left:7px solid var(--color); border-top:8px solid transparent; border-bottom:8px solid transparent; opacity:0; transition:opacity 300ms ease; }
			.pane.folder #validationPanel .validationRule.on::after{opacity:1;}
			.pane.folder #validationPanel .validationRule hr {margin: 0px; height: 1px; background-color: #DDD;width: 90%;}
			.pane.folder #validationPanel .validationRule .progress-label { display:none; }
			.mon > span.vRuleHeading{ margin:7px -23px; width:auto; }
			:is(.view-food, .view-recipe, .view-menu, .view-mealplan, .view-actionReqR, .view-waste) .mon > span.vRuleHeading, .folder:not(:has(.supplier-options)) .mon > span.vRuleHeading, .mon > span.vRuleHeading+#name:not(.empty), .mon > span.vRuleHeading:empty{ display: none !important; }
			:is(.view-food, .view-recipe, .view-menu, .view-mealplan, .view-actionReqR, .view-waste, .view-pubFood, .view-allPubFood, .view-detFood, .view-supply) .mon > span.vRuleHeading + #name:not(.empty) {display: inline-block !important;}

			.pane.folder #validationPanel .validationRule .ruleDescription {max-height: 0;overflow:hidden;transition: max-height 300ms ease;text-align: center;color: black;}
			.pane.folder #validationPanel .validationRule .ruleDescription > div:not(:empty) {padding: 15px;}
			.pane.folder #validationPanel .validationRule .ruleDescription a.btn {margin-bottom: 15px;padding: 0 10px;}
			.pane.folder #validationPanel .validationRule.on .ruleDescription {max-height: 500px;}
			.ruleDescription h4{ border-top:solid 2px #EEE; margin:-15px -15px -5px; padding:9px 0; }
			.ruleDescription h4 svg{ margin:-2px 5px 0 -5px;}
			.pane.folder #validationPanel .validationRule p {width: 100%; transition:color 300ms ease;}
			.pane.folder #validationPanel .validationRule.on p { color:var(--color); }
			.pane.folder #validationPanel .validationRule p.published {color: #AAA;}
			.pane.folder #validationPanel .validationRule p::before{font-size: 9px;}
			.pane.folder #validationPanel .validationRule p.approval::before {content: var(--error-count, '0')}
			.pane.folder #validationPanel .validationRule p.published::before {background-color: #AAA; content: var(--error-count, '0')}
			.pane.folder #validationPanel .validationRule p.rpublish::before {background-color: var(--h2col); content: var(--error-count, '0')}
			.pane.folder #validationPanel .validationRule p.all::before {background-color: white; color:#666; content: var(--error-count, '0'); border-color:currentColor;}
			.pane.folder #validationPanel .validationRule p.delete::before {background-color: white; color:var(--h3col); content: var(--error-count, '0'); border-color:currentColor;}
			.pane.folder #validationPanel .validationRule.warning {--color: var(--hcol);}
			.pane.folder #validationPanel .validationRule.error {--color: var(--h3col);}
			.pane.folder #validationPanel .validationRule.complete:not(.on) {--color: #555; color: #FFF; pointer-events: none; order: 2;}
			.pane.folder #validationPanel .validationRule.complete.on {pointer-events: all;}
			.pane.folder #validationPanel:has(+ #view:not(.view-pubFood)) .published, .pane.folder #validationPanel:has(+ #view:not(.view-pubFood)) .rpublish {display: none;}
			.pane.folder #validationPanel.on{ max-width: 200px; padding-inline: 15px; padding-block: 35px; }
			.pane.folder #validationPanel + #view{ transition: padding-left 300ms ease;}
			.pane.folder #validationPanel.on + #view{ padding-left: 200px; border-top-left-radius: 15px;}
			.pane.folder #validationPanel + #view::before {content: '';width: 20px;height: 20px;display: block;top: 55px;left: 235px;position: fixed;border: solid 15px transparent;	border-top-color: #EEE;	z-index: 3;	border-radius: 100vw;rotate: -45deg;transition: left 300ms ease;}
			.pane.folder #validationPanel.on + #view::before{left: 435px;pointer-events: none;}
			.pane.folder #validationPanel:has(+ .view-actionReqR) #rule0, .pane.folder #validationPanel:has(+ .view-actionReqR) #rule-1 {display: none;}
			.pane.folder.pin-search #validationPanel.on + #view::before{left: 330px;}
			.pane.folder.pin-search #validationPanel {left: 425px;}
			.pane.folder:has(.supplier-options) .helpbtn.on span ol {list-style: none;}
			.pane.folder:has(.supplier-options) .helpbtn.on span li::before {content: '!'; background-color: var(--h3col); font-size: 12px; text-align: center; font-weight: bold; line-height: 19px; width: 18px; height: 18px; border-radius: 50px; display: inline-block; margin-left: -1.25rem; margin-right: .25rem}
			.pane.folder:has(.supplier-options) .helpbtn.on span li[data-type="warning"]::before {color: var(--hcol); background-color: white; border: solid 1px var(--color, var(--hcol))}
			#menuOptionsDropSub .parentInput:checked+label+.indent{ max-height: 330px; opacity: 1;}
				#menuOptionsDropSub .indent{padding-left: 10px; margin: 0px; margin-left: 10px; border: 0px; border-left: 4px solid #DDD; width: 100%; vertical-align:top; overflow:hidden; max-height: 0px; opacity: 0;transition: max-height 300ms, opacity 300ms;}
				#menuOptionsDropSub .indent label.prefade{opacity: 0;}
				#menuOptionsDropSub .indent label{width: calc(100% - 20px);}
				#menuOptionsDropSub .parentInput:checked+label+.indent label{}
				#menuOptionsDropSub label{width: 100%}
		#menuOptionsDropSub .indent label{font-size: 12px;}
		#menuOptionsDropSub input{ background-color:white; color:var(--hcol); height:30px; vertical-align: middle; margin-left: 5px;}
			#menuOptionsDropSub input:focus{background: #FFF!important; color: var(--h3col)!important;}
			#menuOptionsDropSub input.inlineInput{ width:50px; float: none;}

	.folder #exportPrefsSub {width: 890px; /* max-height: 510px; */ max-height: 80vh; z-index: 3;}
	.mealPlan #exportPrefsSub .footer a,.folder #exportPrefsSub .footer a{padding:0 25px !important}
	.folder #exportPrefsContent { width:655px; padding-bottom:20px;}
	.folder #exportPrefsContent .tabmenu,
		.folder #exportPrefsContent .tab,
		.folder #exportPrefsContent .menuSettingBlock{ width:auto; margin:0; border:0; line-height: 100%; clear: both;}
	.folder #exportPrefsContent .tabmenu { width:100%; white-space:nowrap; margin-top: -2px;}
	.folder #exportPrefsContent .tabmenu.whiteback{ padding-top:20px; }
		.folder #exportPrefsContent .blocklinks a { margin: 0 0 -2px;}
		.folder #exportPrefsContent .blocklinks a label{ font-size: 10px; color: #999; padding:0 20px 0 10px; width:100%; background:none; line-height: 20px;}
		.folder #exportPrefsContent .blocklinks a.on label{ color:var(--hcol); }
		.folder #exportPrefsContent .tab.whiteback{ padding: 25px; }
			.folder #exportPrefsContent .tab.whiteback:after{ content:''; display: block; clear: both;}
			.folder #exportPrefsContent .tab.whiteback p{ margin:10px auto 18px; font-size: 14px}
			.folder #exportPrefsContent .tab.whiteback p+label{ border-top:solid 1px #DDD; margin-top: 10px;}
			.folder #exportPrefsContent .tab.whiteback p .inlineInput{ width:80px!important}

	.folder #exportPrefsContent .tab:not(.whiteback) { padding:20px; background:none; overflow-y:auto; height:360px; }
	.folder #exportPrefsContent .pMultipleInputs {clear: both;}
	.folder #exportPrefsContent .tab>label, .folder #exportPrefsContent .tab .menuSettingBlock>label, .folder #exportPrefsContent .tab label>label{ padding:15px 5px 15px 34px; font-size:12px; line-height:20px; position:relative; }
		.folder #exportPrefsContent .tab label>label{ padding:0; }
		.folder #exportPrefsContent .tab>label .excl.error{ margin-bottom: 0px; margin-top: 2px; }
		.folder #exportPrefsContent a.lgreybtn:not(.pillbtn){line-height: 100%;}
		.folder #exportPrefsContent .tab>input+label, .folder #exportPrefsContent .tab .menuSettingBlock>input+label { padding-left: 5px; }
		.folder #exportPrefsContent .tab>label[for="p-s_showItemsPerLine"]{padding: 10px 35px !important;}
		.folder #exportPrefsContent .tab>label[for="p-s_showFeatureOnMainMenu"]{padding: 15px 0px 15px 35px !important;}
		.folder #exportPrefsContent label>i { content:'•'; top:16px; font-size:24px; color:#AAA; position:absolute; left:12px; font-style:normal; }
		.folder #exportPrefsContent label:hover>i { color:var(--hcol) }
		#exportPrefsContent .c {clear: both; float: none; text-align: center; width:80%; margin:5px auto 0;}
			#exportPrefsContent .fullWidth.c{ width:95%; }
		#exportPrefsContent select.c{ width: 50%; }
		.folder #exportPrefsContent label.fullWidth { /* padding: 10px 5px;  */background:none!important }
		.folder #exportPrefsContent .tab.whiteback label.fullWidth { text-align: center;}
		#exportPrefsContent label .helpbtn{  margin: 1px 5px 0 0;}
		#exportPrefsContent label .helpbtn>span{  color: #FFF; line-height: 160%;}
		#exportPrefsContent	label.fullWidth.disabled .nocompanion { opacity: 0.6;}
		#exportPrefsContent h2 label {text-transform: inherit !important;padding-left:12px;}
		#exportPrefsContent label.weeklyOpt { width: 29px; padding-left: 0px; text-align: left; margin: 0; }
		#exportPrefsContent label.monthlyOpt { padding-left: 0px; text-align: left; margin: 0; }
			#exportPrefsContent label.weeklyOpt.mon::before { content: 'M' }
			#exportPrefsContent label.weeklyOpt.tue::before, #exportPrefsContent label.weeklyOpt.thu::before { content: 'T' }
			#exportPrefsContent label.weeklyOpt.wed::before { content: 'W' }
			#exportPrefsContent label.weeklyOpt.fri::before { content: 'F' }
			#exportPrefsContent label.weeklyOpt.sat::before, #exportPrefsContent label.weeklyOpt.sun::before { content: 'S' }

		/*.folder #exportPrefsContent .menuSettingBlock { width:auto; margin:0; border:0; line-height: 100%; }*/
		.folder #exportPrefsContent .menuSettingBlock, #exportPrefsContent .dynamic { display: none; width: 100%; }
			#exportPrefsContent input[type=checkbox]:checked+label+.dynamic{display: block;}
			#exportPrefsContent input[type=checkbox]:not(:checked)+label+.dynamic+.menuSettingBlock,
			.folder #exportPrefsContent .menuSettingBlock.on { display:block; }
				.folder #exportPrefsContent .menuSettingBlock p.pMultipleInputs { height:32px;}
				.folder #exportPrefsContent .menuSettingBlock .helpbtn{float: none;}
		.folder #exportPrefsContent .tab .delbtn { position:static; margin:0; }
	.folder #exportPrefsContent .tab #cpDrop, #popbox #cpDrop { position: fixed; z-index: 2; /* margin-top: 40px; margin-left: -60px; */ }
	.folder #exportPrefsContent .tab .oBlockData #cpDrop{z-index: 99999;}
		.folder #exportPrefsContent .tab #cpDrop.to { margin-left: 178px; }
		.folder #exportPrefsContent .tab .inlineInput.cpMinWidth{width:80px!important}
		.folder #exportPrefsContent table{border:0}
			.folder #exportPrefsContent td { border:0; padding:0; line-height:32px; overflow: visible; position: relative;}
			.folder #exportPrefsContent td .helpbtn{ float: none; }
			.folder #exportPrefsContent tr[data-index='{{i}}']{ display: none; }
		.folder #exportPrefsContent #repeatSettings { margin-top: 10px; }
		.folder #exportPrefsContent #repeatSettings .publishRightBlock { display:inline-block; width: 50%; margin: 0; }
			.folder #exportPrefsContent #repeatSettings .publishRightBlock .inlineFull { display:inline-block; width: 100%; margin: 0; }
				.folder #exportPrefsContent #repeatSettings .publishRightBlock .inlineFull.cond:not(.on) { display:none; }
				.folder #exportPrefsContent #repeatSettings .publishRightBlock .inlineFull span{ display:inline-block; margin: 0; }
					.folder #exportPrefsContent #repeatSettings .publishRightBlock span.blockDesc { width: 20%; font-size: 11px; }
					.folder #exportPrefsContent #repeatSettings .publishRightBlock span.blockOpts { width: 75%; }
		.folder #exportPrefsContent input[type=hidden].disabled+input[type=text] { color: #888!important; background-color: #DDD; pointer-events: none; }
	/* .folder #folderPublishBTN, .folder #selectSrc{display: none!important; } */
		.folder #folderPublishBTN{padding:0 25px; margin:2px 5px; transition: all 300ms ease;}
		.folder #folderPublishBTN:not(.noissues) > svg {display: none;}
		.folder #folderPublishBTN:after, #folderPublishBTN.hasissues #fpCount {margin-right: 5px; margin-left: unset;}
		#folderPublishBTN:before{content:'publish'; display: inline-block;}
		/*#folderPublishBTN.reCheck:before{content:'re-check';}*/
		.folder #folderPublishBTN.reCheck:before{content:'re-check';margin:unset;}
		.folder #folderPublishBTN.hasissues:before, .folder #folderPublishBTN.noissues:before {content:unset;margin:unset;}
		.folder #folderPublishBTN.hasissues:after{content:'Issues Found';}
		.folder #folderPublishBTN.noissues:after{content:'All Checks Passed';}
		#folderPublishBTN #fpCount{ width:24px; height:24px; line-height:24px; margin-left:5px; display: none}
		#folderPublishBTN.reCheck #fpCount, #folderPublishBTN.hasissues #fpCount {display: inline-block;}
		#selectSrc,#selectParent { position:relative; box-shadow:0 -1px #ddd inset; }
			#selectSrc .selected,#selectParent .selected{line-height: 40px;}
			#selectSrc .selectdrop:empty:after { content:"No catalogues"; color:#CCC; text-align:center; font-weight:bold; width:100%; display:inline-block; padding:10px 0px; }
			#selectSrc.catalogue,#selectParent.catalogue{width:150px; padding-left:5px;}
			#selectSrc.catalogue:after { content:'SOURCE:'; position:absolute; padding:4.5px 15px; font-size:9px; font-weight:bold; color:#999; transform:translateX(-100%); top:0; border-bottom:solid 1px #DDD; }
			#selectSrc.catalogue svg,#selectParent.catalogue svg{padding-right:5px; -webkit-filter:grayscale(100%)}
		#pcatUser{display:inline-block; width:100px;}
	.view-catalogue .delbtn{color:#0089bf; left:-2px;top: 5px; transform: scale(0.7)!important;}
	.fromSrc{filter: grayscale(1)}
	.fromCatalogue{color:var(--hcol)}
	.view-catalogue .item:hover *{filter: none!important;}
	.view-catalogue #addNewBtn, .view-catalogue #thumbsBTN, .view-catalogue #groupBTN, .view-catalogue .recipeReqIcon, .view-catalogue .incompatible{display: none;}

	.view-catalogue .item[data-status="2"] *:not(.delbtn) {text-decoration: line-through;}
	.view-catalogue .item .removeItem{border:none;}
	.view-catalogue .item .removeItem a{position:relative; bottom:12px; right:12px; line-height:19px;}
		.folder .options .disabled{ pointer-events: none; color: #DDD!important;}
		.folder[data-objname="Base Prices"] .shortdesc{ width: 300px!important; margin-left: -100px;}
		.view-catalogue h5{width: 100%; box-sizing: border-box;}
		#view.tableView.view-catalogue .item{overflow: hidden;}
		#view.view-catalogue.tableView .item .food{width: 270px;padding-left: 20px;position: relative;}

	#catUserBtn .counter{ position: absolute; margin: 20px -5px; background:#FFF!important; }
	#catUserBtn .counter:empty{ display:none; }
	#catUserPanel{ position:fixed; top:40px; transform:translateX(320px); bottom:0; width:250px; background:#FFF; z-index:6; transition:transform 300ms; padding:0; box-sizing:border-box; display:flex; flex-direction:column; right:0; height:100vh}
		 #catUserPanel.on{transform: translate(0);box-shadow: -2px 0 10px rgba(0,0,0,0.5);}
		#catUserPanel h3{margin-bottom:0; padding:2px; text-transform:inherit;}
		#catUserPanel .delbtn{ position:absolute; right:7px; top:10px; width:20px; line-height:20px; height:20px; border-width:2px!important; color:#AAA;}
		#catUserPanel p{ height:30px; line-height:30px;}
			#catUserPanel p span { display:inline-block; text-align:center; color: #666; }
				#catUserPanel p span:first-child{width:73%;}
				#catUserPanel p span:last-child{width:27%;}
				#catUserPanel .accordion label.cOrgInput { display: inline-block;height: 40px;padding: 6px 0px 0px 8px; vertical-align: top;}
				#catUserPanel .accordion .head{display: inline-block; position: relative; width: calc(100% - 40px);}
				#catUserPanel .accordion>span:before{position: absolute; right: 0; top: 14px; transform: rotate(90deg);}
				#catUserPanel .accordion.on .drop{max-height: 220px;}
				#catUserPanel #userWrapper{ overflow: auto; height: 83vh;}
		.catUser{border-top:1px solid #EEE; padding:5px 0px 2px 0px;}
			.catUser *{cursor: pointer;}
			.catUser div:first-child{ width:75%; display:inline-block; position:relative; vertical-align:top; padding:0px 10px; height:40px; box-sizing:border-box;}
			.catUser div:last-child{ width:22%; display:inline-block; text-align:center;}
				.catUser div:last-child input{ width:100%; text-align:center; padding:0; border-width:0px 0px 1px 0px;}
			.catUser div label{display: inline-block;}

			.catUser div span:not(.smallText){ position:absolute; top:-4px; max-width:120px; }
			.catUser div span:last-child{ top:8px; position:absolute; color:#AAA}
				.catUser.on div span:last-child{color:#F60}
		.folder #folderPublishBTN:before{content:'Validate';margin: unset;}
		#folderPublishBTN.publish, #folderPublishBTN.approve, #folderPublishBTN.delete {background-color: var(--h3col); color: white;}
		#folderPublishBTN.publish > #fpCount, #folderPublishBTN.approve > #fpCount, #folderPublishBTN.delete > #fpCount {color: var(--h3col); background: white; display: inline-block}
		.folder #folderPublishBTN.publish:before{content:'Publish';}
		.folder #folderPublishBTN.approve:before{content:'Approve';}
		.folder #folderPublishBTN.delete:before{content:'Delete';}
		#folderPublishBTN.actionReqFCheck{display: inline-block !important}
		/* AUTOSCALE STYLE ADJUSTMENTS */
		.autoscale .folder #exportPrefsSub { max-height: 480px; }
		.autoscale .folder #exportPrefsContent .tab { height: 330px; }

.folder .strFont{font-size:10px;}
.folder select.smallselect:focus:hover { border-right: var(--h3col) solid 1px!important; }
.folder .ingListWidth{display: block;height:100%;width: 100%;max-height:100px;overflow-y: auto; font-weight: normal; text-align: left ;}
.folder .view-food:not(.view-food.tableView):not(.view-food.disabled) .ingListWidth,.folder .view-recipe:not(.view-recipe.tableView):not(.view-recipe.disabled) .ingListWidth {height: 100px;}
.folder .row-pBarcode > .ingListWidth{height: auto !important;}
.options .togglebtn.catBTN{  background-position:10px; padding:0 20px 0 30px; }
.recipeCreator .options .togglebtn.catBTN, .foodCreator .options .togglebtn.catBTN{ overflow: hidden;width:94px;text-overflow: ellipsis; padding:0 10px 0 28px}
.options .togglebtn.sel, .options .togglebtn.on{  background-color: var(--hcol)!important; color: #FFF; -webkit-box-shadow: 0px -2px 6px 0px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0px -2px 6px 0px rgba(0, 0, 0, 0.2); box-shadow: 0px -2px 6px 0px rgba(0, 0, 0, 0.2); text-shadow:none;}
/*.options .dropbtn:after { content:''; border:6px solid transparent; border-top-color:#FFF; transform:scaleX(0.5); display:inline-block; vertical-align:middle; margin-top:5px; margin-right: -12px;}
.options .dropbtn.sel:after {  border:6px solid transparent; margin:39px 0 0 -36%; position:absolute; border-top-color:var(--hcol); z-index:2;transform:none;} */ /* changed z-index on .options .submenu.sel.bigdrop, making this obsolete */

.options .submenu{ position:absolute; top:40px; right:10px; left:10px; z-index:-1; border-radius: 30px; background:#FFF; overflow:hidden; padding:20px 20px 25px 20px; box-sizing:border-box; white-space:normal; transition:opacity 300ms 50ms, max-height 300ms; opacity:0; -webkit-column-count:4; -webkit-column-gap:7px; column-count:4; column-gap:7px;pointer-events: none; box-shadow:0px 1px 25px rgba(0,0,0,0.5); max-width:895px; overflow:hidden; max-height:0px;}

	/*.options .submenu a{line-height:100%;}*/
	.options .submenu.mini{width:250px; padding-bottom: 50px; left:auto; -webkit-column-count:auto; column-count:auto; }
	.options .submenu.sel{opacity:1; max-height:420px; pointer-events:inherit; display:block !important; z-index:1; overflow-y:auto;/*min-height:80px; bugs on safari */}
	.pane.compare .options .submenu.sel{max-height: 480px;}
	.options .submenu label, .bigdropList label,#additionalNutrient label{ display:block; line-height:100%;}
	.bigdropList div.subgroup{margin: 0px 0 0 11px;padding-left: 2px; border-left: solid #DDD; border-bottom: 0;}
	.bigdropList label.subhead ~ span.subarrow:before {content: "\25BC"; color: rgba(0,0,0,0.3); display: inline-block; width: 16px; height: 16px; line-height: 16px; vertical-align: middle; background-color: rgba(0,0,0,0.1); border-radius: 50%; transition: all 200ms; text-align: center; font-size: 8px; font-weight: 900; float: right; pointer-events: all; margin-top: -18px;}
	.bigdropList label{position:static;}
	#additionalNutrient label{font-weight:bold;}
	.options .submenu label:hover, .bigdropList label:hover{background:none; }
	.options .submenu h2{ font-size: 17px; }
	.options .submenu label.head, .bigdropList label.head, #additionalNutrient label.head { margin:10px -5px 2px; line-height:130%; font-size:10px; font-weight:bold; padding:5px 0px 5px 10px; background-color:#9992; text-transform:uppercase; border-radius:50px; }
		.options .submenu label.head span, .bigdropList label.head span, #additionalNutrient label.head span{margin-left:-8px}
		.submenu .delbtn{ position:absolute; top:25px; right:25px;}
		.submenu .greybtn,.submenu .bluebtn{ position: absolute; padding:0px 20px; bottom:10px; right:10px;}
			.submenu .bluebtn.pillbtn { position: relative; margin-left: 9px; top: 19px; }
			.options .submenu label>span:not(.helpbtn), .bigdropList label span, #additionalNutrient label span { padding:0 11px; display:inline-block; word-break:break-all; line-height:26px; border-radius:50px; transition:background 300ms; margin:-1px -13px -1px -2px; }
			#foodcatSub.filtered .bigdropList label span{font-size: 16px; line-height: 40px;}
			.options .submenu label:not(.subgroupitem):hover span, .bigdropList label:not(.subgroupitem):hover span{color:var(--hcol)}
		.options .submenu input{height: 35px; }
		.options .submenu input.inlineInput{ margin: -8px 3px;}
		.options .submenu input:checked + span{ font-weight:900; background:#FFF; font-weight:900; border-radius:50px; color: var(--h2col)}
		.options .submenu .bigdropList input:checked + span{ background:var(--bgcol4);}
		/* .options .submenu label.head input:checked + span{ background: #FFF3; } */
		.options .submenu.mini input:checked + span{background:none; color:var(--hcol); border-color:transparent; overflow: hidden;text-overflow: ellipsis; white-space: nowrap;display: inline-block; width: 150px;}
		.options .submenu.mini input:checked + span:hover{border-color:#DDD}

	/*dropdown positioning:*/
	#exportPrefs{float: right; width: 36px; border: 0; padding: 0; margin:2px;}
		#exportPrefs.sel{background-color:var(--hcol)!important; z-index:4; position: relative;}
		#exportPrefs.sel:after { content:" "; border:6px solid transparent; margin:36px 0 0 -6px; position:absolute; border-top-color:var(--h2col); left:50%; }

	.exportContainer{display: inline-block; position: absolute; right: 0;}
		.program .exportContainer{left: 920px;}
	#exportmenu{ float:right; text-align:center;}
		.program #exportmenu{position:relative;}
	#exportmenu a{display:block; width:100%;}
	#exportmenu a.bluebtn{padding-left:13px;padding-right:13px;font-size:9px;position: inherit !important;}
	/*position level 1 links horizontally*/
	#exportmenu li{display:block; float:left;}
	/*undo previous style for level 2 links*/
	#exportmenu li ul li{float:none;}
	/*position level 2 links vertically and hide*/
	#exportmenu li ul{max-height:0; box-sizing:border-box; position:absolute; z-index:4; margin-top:-1px; opacity:0; transition:max-height 200ms}
	/*unhide level 2 links on li:hover from level 1*/
	#exportmenu li:hover ul{max-height:280px; padding:5px 0 8px 0; opacity:1;  }
	#reportMenu #exportPrefsSub .delbtn{display:none;}

	/*#exportmenu #mealPlanBtn:after{	content:'New!';	color:var(--h3col);	position: relative;	left: 4px;}
	Was using for 30 days trails of label maker
	li.exportlMaker{ background: var(--h3col);}
	li.exportlMaker a{height:30px;}
	.exportlMaker a:after { content:'try free for 30 days'; position:absolute; display:block; font-family:tahoma; font-size:8px; font-weight:bold; color:var(--bgcol3); margin-left:3px;  }*/
	/*.exportlMaker:hover{background: #222; color: var(--bgcol3);}*/

	/*dropdown styling:*/
	#exportmenu, #exportmenu ul, #exportmenu li, #exportmenu a{ box-sizing:border-box; margin:0 2px 0 0; padding-left:0; padding-right:0; width:100px!important; line-height:13px; font-size: 11px; font-weight: bold;}
	#exportmenu li ul { background-color:#444; box-shadow:2px 2px 10px 0px rgba(0, 0, 0, .8); overflow:hidden; top:39px; border-radius:10px; }
	#exportmenu li ul a{ width:100%; padding:7px 0!important; color:#FFF; display:block; transition:background 200ms;}
	#exportmenu li ul a:hover{ background:var(--h2col); }
	/*export styling*/
	#exportPrefsSub{padding:0!important; overflow: hidden; width:510px; min-height:300px; margin-top: -1px;}
	.folder[data-type="menu"] #exportPrefsSub #templateContent { overflow:hidden auto; max-height:400px; min-height:380px; }
	#exportPrefsSub #templateContent .labelBtn{position: fixed; margin-top: 45px;}
	#exportPrefsSub #templateContent a.greybtn{position: fixed; margin-bottom: -560px; right: 25px;}
	#exportPrefsSub .footer .pillbtn{padding:0px 20px !important;}
		#exportPrefsContent{ float:left; width:270px; padding:20px 0; border-right:solid 2px #F5F5F5; overflow:auto; margin:0 0 0 0;}
		.folder #exportPrefsContent{ margin-bottom: -40px;}
		.folder.disabled,.mealPlan.disabled{filter:none;opacity:1}
	#exportPrefsContent label{transition:background 300ms; padding:2px 0px 2px 25px;}
	#exportPrefsContent label:hover{background:#F9F9F9;}
	#exportPrefsContent h2>.helpbtn{ position:absolute; top:30px; right:265px; }
	#pane-maindiv:not(.folder) #exportPrefsContent label { text-transform:uppercase; font-size:10px; font-weight:bold; }
	#pane-maindiv:not(.folder) #p-preparation+label,#pane-maindiv:not(.folder) #p-method+label,#pane-maindiv:not(.folder) #p-criticalcontrolpoints+label,#pane-maindiv:not(.folder) #p-presentation+label{text-transform:capitalize !important;margin-left: 25px;}
	#templateContent { position:absolute; padding:20px 0 0 0; height:100%; width:240px; z-index:0; top:0; right:0; margin:0; overflow-y:auto; overflow-x:hidden; border-radius:0 30px 30px 0; }
		.foodCreator #exportPrefsSub #templateContent, .recipeCreator #exportPrefsSub #templateContent { overflow:hidden auto; }
		.recipeCreator #exportPrefsSub #templateContent { height:425px; background:#FFF; }
		/* #38177 */#exportPrefsSub h2 { padding:0 0 13px 22px; }
		#monitorsDropSub #templateContent {  border-left: solid 2px #F5F5F5; }
		#monitorsDropSub #templateContent div { padding:0 0 13px 22px; }
		#templateContent .on, #templateContent .on p { color:var(--hcol); font-weight:bold;}
		.labelMaker #templateContent div:not(#unsavedTemplate):hover p { width:85%; }
		.labelMaker #templateContent > div { padding: unset; }
		.labelMaker #templateContent  h2 { margin-bottom: 15px; }
		#templateContent>div { padding:0 20px; position:relative; width: 96%; margin: 0 auto; }
		#templateContent div.blue:hover p { background:#FFF; }
		#templateContent .default:before { margin:0 3px 0 -15px; line-height:100%; font-weight:normal; }
		#templateContent .default p:hover { border-bottom:1px solid #CCCCCC; background:rgba(126, 126, 126, 0.09); }
		#templateContent div span { position:absolute; color:#666; bottom:6px; right:0px; z-index:0; cursor:pointer; width:28px; height:34px; opacity:0; transform:translateX(150%); transition: all 200ms }
			#templateContent div:hover span { transform: none; opacity:1 }
			#templateContent div span:after { content:"..."; font-size:16px; font-weight: 900; }
		#templateContent div span:hover { color:var(--hcol); background:#FFF; }
		#templateContent div.linkWithTick { margin:2px auto; padding:0 10px!important;}
		.linkWithTick { padding:2px 15px 2px 5px ; font-weight:bold; }
		.linkWithTick:hover { background:#fff; cursor:pointer}
		#templateContent div.linkWithTick.on,#templateContent div.linkWithTick.on:hover { background:transparent; font-weight:bold; }
	#unsavedTemplate{display:none;}
		#unsavedTemplate.on{display:block;}
		#unsavedTemplate.on:hover .fr{color:var(--hcol);}
	#templateContent .labelBtn{top:9px; right:20px;bottom:auto;}

	/*FOR REPORTS*/
	#reportMenu p{font-weight:normal;}
	#reportMenu #printprefs label{display:none}
	#reportMenu #printprefs.displayFiv label:nth-child(-n+11){display:block;}
	#reportMenu #printprefs.displaySev label:nth-child(-n+14){display:block;}
	#reportMenu #exportPrefs{align-content:center;}
	#reportMenu #exportPrefs.sel:after {margin:28px 0 0 -6px}

.report #pie{float:right; margin: -20px -80px 0 0!important; width: 250px; height: auto;}
#ifr-report .report{width:800px; margin:20px; position:relative; padding-bottom:50px; margin-top:75px;}

/*LIBRO SHARE BTN*/
#ifr-report .card { left:395px; background-color:#666; box-shadow:none; padding:2px 35px 5px 32px; box-sizing:border-box; height:34px; line-height:27px!important; margin-top:3px; max-width: 150px; border:0}

	#ifr-report .card:hover{ background-color:#555; }
	#ifr-report .card span { width:34px; height:34px; line-height:30px; background-position:center; margin:-2px -43px; color:#FFF; }
	#ifr-report #toggleVal1-client.on1{background-color:var(--h3col);}
	#ifr-report .card .title { color:#FFF; margin:0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; padding-right:4px; width: 100%; display: inline-block;}

.nut, .bar, .rda, .ul, .ll{height:100%; z-index:1; top:0; bottom:0; text-indent:-500px;}
.graph{position:relative; width:100%; height:25px; padding:0;  font-size: 8pt; color: #AAA;}
.nut{width:100%; overflow:hidden; position:relative}
	.bar{width:0%; height:6pt; margin-top:12px; background:#000; -webkit-print-color-adjust:exact; position:relative; z-index:2;}
	.rda{background-color:rgba(102, 153, 204, 0.6); width:0; left:50%; position:absolute; border-left:solid 1px var(--hcol); border-right:solid 1px var(--hcol);-webkit-print-color-adjust:exact;}
	.ul,.ll{background-color:#990000; opacity:0.4; position:absolute; right:-1px;-webkit-print-color-adjust:exact;}
	.ll{left:-1px; right:inherit;}
.contentwrap{position:absolute; width:100%;}
	.contentdetail{ width:70px; font-size:7pt; white-space: nowrap;}

.barchart { line-height:normal !important; text-align:left; height:30px; border-left:solid 1px #CCC; display:inline-flex; flex-flow:column; justify-content:space-evenly; }
	.barchart.medium{ height:20px; }
	.barchart.small{ height:15px; }
	.barchart.xsmall{ height:10px; }
	.barchart>b{width:0%; height:50%; border-radius:0 2px 2px 0; display:inline-block; vertical-align: middle; transition:background 200ms, opacity 300ms, width 500ms }
	.barchart:hover>b{ background-color: var(--hcol)!important; }
	.barchart.pill{padding:0; border:0; height: 15px;}
		.barchart.pill>b{ border-radius:500px; height:100%;}

#ifr-report table{border:solid 1px #DDD; margin-bottom:10px; width:100%;}
#ifr-report thead td {background:#FFF; color:#000;}
#ifr-report td{border:0; border-left:solid 1px #DDD; border-bottom:solid 1px #DDD}
tr.nutrientGroup td{ color:#FFF; padding:2px; text-transform:uppercase; font-size:10px; font-weight: bold; background-color:#666!important; -webkit-print-color-adjust:exact; text-align:center; padding: 5px 0; border: 0}

#headerrow td{font-weight:bold; font-size:7pt}
	#graphkey div{width: 25%; float:left;white-space: nowrap; }
	#graphkey div span{ display:inline-block; width:15px; height:15px; line-height:15px; position:static; }

td.nutrientName{ white-space: nowrap; font-size:9pt; line-height:22px; width:100px; font-weight:bold;}

	td.nutrientName em{text-transform:lowercase}
	td.nutrientName em::before{content:"› ";}
	td.nutrientName sub{line-height:100%;}
td.nutrientName.alert{ color:#990000; position:relative; overflow:visible!important;}
td.nutrientName.alert::before{content: ""; position:absolute; border-style: solid; display: block; width: 0; top: 6px; left: 0px; border-width: 6px 0 6px 7px; border-color: transparent #900;}

	td.nutrientHover::after{ content: 'i';width: 14px;height: 14px;line-height: 14px;margin: 4px -5px 0 0;color: #999;font-size: 12px;font-weight: bold;text-align: center;float: right;text-transform: lowercase;border-radius: 50%;font-family: times;border: solid 1px #DDD;}
	td.nutrientHover:hover::after{color: #FFF;background: var(--hcol);}
	td.nutrientHover div.tooltip{pointer-events: none;position: absolute;max-height: 0px;margin:0px 130px;opacity: 0;text-transform: none;line-height: 140%;transition: all 300ms;box-sizing: content-box;z-index: 0;color: #FFF;background: var(--hcol);box-shadow: 1px 1px 5px rgba(0,0,0,0.5);transform: scale(0.8);z-index: 4;}
	td.nutrientHover:hover div.tooltip{max-height: 150px;padding:12px 25px; opacity: 1;transform: scale(1); z-index: 5; margin:-7px 150px}
	td.nutrientHover div.tooltip:after { content:''; width:0; height:0; border-style:solid; border-width:0 4.5px 7px 4.5px; border-color:transparent transparent var(--h3col) transparent; position:absolute; bottom:-9px; margin-left:-7px; }


td.delCell {text-align:center; padding:0!important; text-transform:lowercase!important; border-color:#FFF}
td.delCell .whitebtn{height:100%; width: 19px; background: #FFF; padding: 0; line-height:30px; display: block; font-size: 14px; font-weight: normal; border:0;}
td.delCell .whitebtn:hover{background:var(--hcol);}

tr.disabled td{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAIklEQVQIW2NkQAJ37979zwjjgzjKysqMYAEYB8RmROaABAAFug+bVs5NCQAAAABJRU5ErkJggg==); color:#CCC; border-color: #CCC!important;padding: 0px 10px 0 10px; height: 10px;  }
	tr.disabled .nut{display:none}
	tbody.disabled tr{display:none;}
	tbody.disabled tr.nutrientGroup{display:table-row;}
	tbody.disabled td{background:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAYAAACp8Z5+AAAAKklEQVQIW2N89+7dfwYouHfvHgMjTADEUVJSggjAOCCFjGfOnPkPkoEBALUJF8M0gfOkAAAAAElFTkSuQmCC)!important; border:solid 1px #AAA; border-left:0; border-right:0;color: #666!important;}
	tbody.disabled td.nutrientName::after, tr.disabled .graph::after{content:" (hidden)"; text-align:center; font-size:7pt; text-transform:uppercase; color:#777}
	/* .disabled .whitebtn::before{content:"+";} */
	.disabled .whitebtn span{display:none;}

.optionalsection{background:#EEE; padding:10px 10px 1px 10px; margin-top:30px; min-width: 800px;}
.optionalsection.on{background:#FFF; padding:10px 0 0 0;  border-top:dotted 2px #CCC; }
.optionalsection div, .optionalsection table{display:none;}
.optionalsection.on div{display:block;}
.optionalsection.on table{display:table;}
.optionalsection h2{margin-bottom:10px;}
.optionalsection .bluebtn{padding: 8px 12px; margin-top: -2px;}

#macrotable{ width:100%; max-width:800px}
	#macrotable table{ float:left; width:515px; table-layout:fixed; border-top:0; margin:10px 0 30px 0}
	#macrotable td{width:20%; text-align:center}
	#macrotable td.firstcol{  text-align:left; width:115px;}
#periodPies{width:100%; border:0!important; table-layout:fixed;}
#periodPies td{border:0;}
#periodPies td h3{ margin:0; padding-left:35px; color:var(--hcol); margin-bottom: -5px;}
#ifr-report #periodPies canvas{ width:144px; height:102px}
#nutrientGroup{width:55%; float:left;}

#tdeeanalysis table{width:100%;}
	#tdeeanalysis td{text-align:center;}
	#tdeeanalysis .sub td{ font-size:10px; font-weight:bold; background:#EEE; color:#666; }
	#tdeeanalysis .sub .firstcol{ padding-left: 30px;}

/*report notes*/
#reportnotes-section *, .notesdiv *, #recipeNotes *{-webkit-user-select:auto!important; cursor:auto!important;-moz-user-select: text !important;}
#reportnotes-section hr{visibility:visible; height:1px;  margin:20px 0; border:0; border-bottom:solid 1px #666;}
#reportnotes-section h1,#reportnotes-section h2,#reportnotes-section h3,#reportnotes-section h4{margin:10px 0;}
#reportnotes-section h3{text-transform:uppercase; color:var(--hcol); font-size:14px;}
#reportnotes-section h4{text-transform:uppercase; color:#999; font-size:14px;}
#reportnotes-section ul, #reportnotes-section ol{margin-left:20px;}
#reportnotes-addremove{}
#reportnotes-save{position:absolute; z-index:1; right:0; margin:2px; padding:4px 10px; font-size:10px}
#pane-maindiv#pane-maindiv.log #reportnotes-save{top:21px; right:1px; padding: 3px 10px 4px 10px;}
#generator{ width:350px; text-align:right; color: #666;}
#backtorecbtn{display:none;}

/*dropdown positioning:*/
.flyout{padding:0; text-align:center}
/*position level 1 links horizontally*/
.flyoutul li{display:block; float:left; background:var(--h2col); transition: background 200ms}
/*undo previous style for level 2 links*/
.flyoutul li ul li{float:none; background:none; color:auto; border-top:dotted 1px #CCC; }
/*position level 2 links vertically and hide*/
.flyoutul li ul{display:none; position:absolute; z-index:3; margin-top:0; width:270px; margin-left:-270px; margin-top:-25px;}
/*unhide level 2 links on li:hover from level 1*/
.flyoutul li:hover ul{display:block;}
.disabled .flyoutul{display:none;}

/*dropdown styling:*/
.flyout strong{ color:#FFF; display: block; padding: 0 7px;}
.flyoutbtn{width:100%; text-align:center; font-size:11pt; height:32px; line-height:32px}
.flyoutbtn:hover::after { content:""; position: absolute; z-index: 2; width: 40px; height:14px; margin: -15px 0 0 -20px;} /* increases hover size of btn */
.flyoutul ul{line-height:normal;}
.flyoutul li.title{text-align:center; font-size:7pt; border-top:solid 1px #DDD; text-transform:uppercase; font-weight:bold; padding:11px; background-color:var(--hcol); color:#FFF; background:#444!important; margin-right: -20px; margin-top: -8px;}
.flyoutul li.breakdown{padding-top:0; background:#FFF!important}
.flyoutul li ul{background:#FFF; -webkit-box-shadow:2px 2px 10px 0px rgba(0, 0, 0, .8); -moz-box-shadow:2px 2px 10px 0px rgba(0, 0, 0, .8); box-shadow:2px 2px 10px 0px rgba(0, 0, 0, .8); text-align:left}
/*.flyoutul li ul::after {content: ""; position: absolute; border-style: solid; display: block; width: 0; top:-1px; right: -10px; bottom: auto; left: auto; border-width: 10px 0 10px 10px; border-color: transparent var(--hcol);}*/
.flyoutul li.title::after {content: "‹"; position:absolute; font-size: 12pt; margin-top:-5px; right: -10px;}
.linebelow{border-bottom: dotted 1px var(--hcol);}
.lineabove{ border-top:solid 3px #DDD;}
.flyoutul li ul li{padding:10px; font-size:10pt; overflow:hidden}
	.flyoutul li ul li .bluebtn{padding:7px 8px; margin-top:-3px}
	.flyoutul li ul li p{font-size:7pt; font-style:normal; color:#666; text-align:right; color:#666!important}
	.flyoutul li ul li p span{float:left; overflow:hidden; width:150px; text-align:left}
	.flyoutul li ul li:hover{background-color:#FFFFDD;}

/*MODULES:*/
.mod td{ -webkit-user-select: text; cursor:auto; font-size:8pt; font-style:normal; position:relative}
.mod td .delbtn{position:absolute; top:6px; right:7px; z-index:1}
.mod.hidden{display:none;}
.mod h4{font-size:8pt; margin:0 0 5px 10px; color:var(--hcol);}
.mod h4.greyback{ margin-right: 10px;}

.mod-linegraph td{padding:0;}
	#ifr-report canvas{ height:100px; width:100%;/*width fixes some weird problem with colspan*/ }
	/*#ifr-report canvas#c_energyKcal{display:block}*/

.list td, .logdetail{ font-size:7pt; padding:20px 10px 20px 10px}
	.list td{ padding-top: 30px; }
	.list div{float:left; width:33%}
	.list p, .logdetail p{text-align:right; white-space:nowrap; padding:0 10px 0 10px; color: var(--hcol)!important;}
	.list p strong, .logdetail p strong{ color:var(--hcol);}
	/*.mod-breakdown p b, .logdetail p b{float:right;}*/
	.logdetail p b{float:right;}
	.list p span{color:#666!important; float:left; overflow:hidden; width:82%; text-align:left}
	#nutrientBreakdown.list p span{width:79%;}
	.mod-srcreport p span:last-child, .mod-breakdown p span:last-child{float:none;color: var(--hcol)!important;}
	#sus_water-breakdown.mod-breakdown.list div,#sus_co2eq-breakdown.mod-breakdown.list div{width:50% !important;}
	#sus_water-breakdown.mod-breakdown.list p span,#sus_co2eq-breakdown.mod-breakdown.list p span{width:75% !important;}
	#sus_water-breakdown.mod-breakdown.list p span:last-child,#sus_co2eq-breakdown.mod-breakdown.list p span:last-child{width:25% !important;display:block;}
	table.logdetail{border:0; padding:0; width:100%; table-layout: fixed;}
	#ifr-report .logdetail td{ background:#FFF; vertical-align:top; padding:20px; border:solid 1px #CCC; border-left:1px #CCC solid;}
		.logdetail div{width:174px; float:left; padding:0 20px 0 0}
		.logdetail p{padding:0; text-align:left;width:100%; display:inline-flex;}
		.logdetail p span:first-child{ width:338px; text-overflow: ellipsis; overflow: hidden;}
		.logdetail p span{display:inline-block;text-align:left;}
			.logdetail.MealsxDay p:before { content:'•'; display:block; margin:0px 2px; }
		.logdetail td{ vertical-align: top;}
		.rtalign .logdetail p span, .rtalign .logdetail p{text-align:right;}

.mod-textreport td{ padding:20px;}
	.mod-textreport td p{margin-bottom:10px;  font-size:10pt!important; line-height:130%; font-weight:normal;}

.mod-line td{ padding:0;}

.fixedHeader,.fixedFooter{ transition:opacity 0.5s ease-in-out!important; }
.fixedHeader.fixedAnim,.fixedFooter.fixedAnim{ opacity:0; }
.scrolled .fixedHeader{ box-shadow:0 0 20px #DDD; }
input.bluebtn{color: #FFF; cursor: pointer;}

/* TREE VIEW */
#tree0{ box-shadow: none; margin: 0; border: 0; z-index:0!important }
	#tree0>ul{margin:0;}
	#tree0 > .input, #tree0 #treemymenus2 .input {width:89%}
	#tree0 input.submenuFilterInput{width:95%; border: 0; margin:10px 0;}
	#tree0 #limyfoods input.submenuFilterInput, #tree0 #limyrecipes input.submenuFilterInput{width:85%;}
		#tree0 ul {padding:10px 0 2px 10px; margin: -10px -20px -20px -62px; background:#EEE; font-weight:normal;position:relative; overflow: hidden; transition: background-color 250ms;}
		#tree0 li:not(.on) ul{background-color: #FFF;}
		#tree0 ul ul { margin:3px -20px -5px; padding-top:0px; }
		#tree0>li{position:relative; white-space: nowrap!important; overflow: hidden!important; text-overflow: ellipsis!important;font-size:13px; }
			#tree0>li.expandable.on { background-color: #FFF; }
		#tree0>li>ul{box-shadow:0 2px 8px #CCC inset;border-top: solid 2px var(--hcol); padding-left:25px; padding-bottom:50px; max-height: 50vh; overflow-y: auto; transition: max-height 250ms;position: relative;width:auto; }
			#tree0>li>ul:before{content:'';border-style:solid; border-width:5px 5px 0 5px; border-color:var(--hcol) transparent transparent transparent; position:absolute; top:0; left: 34px; transition:margin-top 200ms}
			#tree0>li.on>ul:after { content:''; position:sticky; bottom:-43px; left:0; width:100%; height:40px; background:linear-gradient(to bottom, rgba(238,238,238,0) 0%, #eee 100%); display:block; margin-bottom:-40px; pointer-events:none; }
			#tree0 li:not(.on) ul{ max-height:0; padding-top:0; padding-bottom:0; border:0;}
			#tree0 li:not(.on) ul:before{ margin-top:-10px}
			#tree0>li.on>ul{ margin-bottom:-50px; }
			#tree0 li.on .pillbtn{ margin: 8px 0 -8px; }
				#tree0 li:not(.on) .pillbtn{display:none;}
			#tree0 li.blueline { font-size:10px; font-weight:bold; display:inline-block; padding:7px 1px; margin-left:19px; }
		#tree0>li#liliveproducts li:empty:before{content:'!'; background:var(--h3col); color:#FFF; font-weight:bold; width:16px; height:16px; line-height:16px; font-size:12px; display:inline-block; text-align:center; border-radius:50px;}
		#tree0>li#liliveproducts:after, #tree0>li#limyprograms:after{content:'BETA'; color:#AAA; position:absolute; top:20px; right:10px; font-size:9px}

	#tree0>li { font-weight:bold; padding:22px 10px 22px 50px; background:transparent url(/media/icon-circle-apple.gif) no-repeat; background-size:25px; background-position:15px 12px; filter:grayscale(100%); opacity:0.9; }
		#tree0>li#limyrecipes{background-image:url(/media/icon-circle-chef.gif)}
			#tree0>li#limylabels{background-image:url(/media/icon-circle-labelling.gif)}
			#tree0>li#limymealplans{background-image:url(/media/icon-circle-list.gif)}
			#tree0>li#liorders{background-image:url(/media/icon-circle-list.gif)}
			#tree0>li#limyprograms{background-image:url(/media/icon-circle-sports.gif)}
			#tree0>li#limymenus{background-image:url(/media/icon-circle-small-menu.gif)}
			#tree0>li#liforecastingwaste{background-image:url(/media/icon-circle-bintruck.png)}
			#tree0>li#limyproducts{background-image:url(/media/icon-circle-box.png)}
			#tree0>li#limysavedsearches{background-image:url(/media/icon-circle-small-search.gif);}
			#tree0>li#limycomparisons{background-image:url(/media/icon-circle-small-scales.gif);}
			#tree0>li#liinsights{background-image:url(/media/icon-circle-insights.png);}
			#tree0>li#limyintegrations{background-image:url(/media/icon-circle-component.png);}
		#tree0>li.on{-webkit-filter:none; filter:none; opacity:1!important;}
		#tree0>li:hover{ opacity:1; -webkit-filter:none; filter:none; background-color:#FFF; }
		#tree0 li.prefade{margin-top:5px!important;}
		#tree0 li:not(.prefade):not(.blueline){ transition:all 300ms;text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
		#tree0>li>strong, #tree0>li>span{ display:block; padding:15px 0; margin:-20px 0 10px;}
			#tree0>li.on>span, #tree0>li:hover>strong, #tree0>li:hover>span{ color: var(--hcol); }
		#tree0 li li:not(.expandable):not(.on):not(.blueline){ border-radius: 50px; }
		#tree0 li li:not(.expandable):not(.on):hover, #attachGroups li li:not(.expandable):hover{ background-color:rgba(0,0,0,0.05); color:var(--hcol); }
		#tree0 li li.on>span{ font-weight: bold; }
			#tree0 li li.on>span:not(.sharedIn):not(.sharedOut):after{content:"▼"; font-size:9px; margin-left: 2px; }
		#tree0 #liliveproducts>ul>li:hover{color:#333;}
		#tree0 li li{padding:5px 20px; background:none;}
		#tree0 li[data-folderType],#attachGroups li[data-folderType]{ background:url(/media/icon-folder-dark.png) no-repeat left; padding:7px 0 7px 27px !important; background-position:5px 7px; text-overflow: ellipsis!important;white-space: nowrap!important;overflow: hidden;max-width: 97%!important;width: 97%!important;}
		#tree0 li[data-folderType][data-objid='favourite'], #attachGroups li[data-folderType][data-objid='favourite']{ background:url(/media/icon-star.png) no-repeat left; background-size:15px; background-position-x:5px; }
		#tree0 li[data-folderType][data-objid='systemgroup'], #attachGroups li[data-folderType][data-objid='systemgroup']{ background:url(/media/favicons/favicon2.ico) no-repeat 4px 5px;}
		#tree0 li[data-folderType][data-objid='shared'], #attachGroups li[data-folderType][data-objid='shared']{ position: relative }
		#tree0 li[data-folderType][data-objid='shared']:after, #attachGroups li[data-folderType][data-objid='shared']:after{ top:20px; left:20px}
		#tree0 li[data-folderType] .counter, #attachGroups li[data-folderType] .counter {margin-left: -2.25rem;}
			li[data-dragtype="foodnestedgroup"] > .foldername::before, li[data-dragtype="recipenestedgroup"] > .foldername::before{ content:""; display:inline-block; width:10px; height:10px; border-radius:50%; background-color:var(--bg-color);  margin: 2px 13px -5px -23px; vertical-align:middle;}
		#tree0 li li.sel { background-color:#FFF; color:var(--hcol); border-bottom: solid 1px rgba(0,0,0,0.1); font-weight:bold; }
			#tree0 li li.sel>ul:empty{display:none;}
			#tree0 li li.sel:after { content:""; width:0; height:0; border-style:solid; border-width:6px 0 6px 5px; border-color:transparent transparent transparent var(--h2col); position:absolute; right: 15px; margin-top:1px; z-index:1; }
			#tree0 li.sel:has(ul li.sel):after{content: none;}
		.expandable.on>strong{display:block; padding:5px 5px 5px 23px; margin:0 -8px 0 -26px; background-color: #FFF;}
		#tree0 ul .expandable.on>strong,#attachGroups ul .expandable.on>strong{background:#FFF url(/media/icon-folder-dark.png) no-repeat left}
		.expandable>strong:before{content:'\25BA'; font-size:9px; display: block; float:left; transition:transform 300ms; margin:3px 4px 0px -4px;}
		.expandable.on>strong:before{ transform:rotate(90deg)}
		.expandable.on .newGroup{ display:inline-block; text-transform:uppercase; margin: -9px -7px; /* background-image:url(/media/icon-folder-dark.png); background-repeat:no-repeat; background-position:3px center; padding-left: 22px */}
		.expandable ul a{ display:none;}
		.expandable.on .blueline{ display:inline-block; position: relative; font-size: 10px; text-transform:uppercase; font-weight: bold; margin: 0px 10px 13px; padding: 5px!important;}
		.expandable a.fl { margin:-8px -33px 0; font-weight:bold}
		.expandable.on> strong+b{ display:none }
		td.expandable:hover, .header.on td.expandable { color:#106b90; }

		#tree0>li.expandable>strong:before,.expandable .newGroup,#tree0>li>ul li .newGroup, #attachGroups>ul>li .newGroup,#tree0+a{ display:none; }
		#tree0 >#limymenus >ul >li.expandable.on{ margin-bottom:0px; background-color: transparent;}
		#tree0 >#limymenus >ul >li.expandable.on .newGroup{ display:inline-block; }
			#tree0 >#limymenus >ul >li .liveIndicator { position: absolute; left: 17px; margin-top: 2px; z-index: 99999;}

		#tree0 >#limylabels >ul >li > ul>li{height: 55px;}
		#tree0 >#limylabels >ul>li>ul>li:last-child{height: 16px;margin-right: 110px;}
		#tree0 >#limylabels >ul >li > ul>li>span{display:inline-block; width:50px; height:50px; background:#DDD; overflow:hidden; padding:0; position:relative; border:solid 1px #DDD; margin: 1px -12px; border-radius:50px; transition:all 300ms; }
		#tree0 >#limylabels>ul >li > ul{display: flex!important; width: 211px!important; flex-wrap: wrap!important;}
		#tree0 >#limylabels >ul >li > ul>li>span> img{ width: 75%;transform: rotate(10deg) translate(-65%, -25%);}
		#tree0 >#limylabels >ul >li > ul>li.sel:after{border-width:0!important;}

		#tree0>.blueline, #limymenus>ul>.blueline, #liliveproducts>ul>.blueline{display:none;}

		a.bluebtn.plusbtn{ width:18px; height:18px; line-height:18px; font-size:16px; font-weight: normal; border-radius:50%; margin:-5px 0; position:absolute; right:10px; z-index:1; padding:0;opacity:0; transition:opacity 300ms, transform 200ms; transform:scale(0.5)}
		#tree0 li:hover .plusbtn{opacity:1;transform:scale(1)}

.folder #mainnest, .folder .options{ width: calc(var(--scaled-width, 100vw) - 260px); }
#subfolder-maindiv .subfolder-options {width: calc(100% - 550px); height: 40px; background-color: #EEE; position: fixed; top: 30px; z-index: 5; line-height:initial;}
.folder #mainnest #view .item .recipe .helpbtn.orangeback.error.recipeReqIcon {top: 0 ;pointer-events: all}
.folder #mainnest #view.view-pubFood .helpbtn.orangeback.error.recipeReqIcon {top:3px !important; left:290px;}
	.folder .options{min-width: 900px;}
	.folder .submenu .greybtn,.folder .submenu:not(#exportPrefsSub) .bluebtn, #popUi .bluebtn{ padding:0px; bottom:-430px; right:0px; border-radius:50px; height:50px; width:50px; font-size:26px; line-height:52px!important; }
	#popUi { position: absolute;background-color: #FFF; -webkit-box-shadow: 2px 2px 8px 0px #777777;box-shadow: 1px 2px 8px 0px #777777;border-radius: 20px;width: max-content;}
	#popUi form {width: max-content;}
	#popUi .bluebtn {bottom: 0;position: static;}
	#popUi #lSettings {width: 380px;border:none;padding: 0px 0px 10px 15px; text-align: center;}
	#popUi #lSettings > div {display: inline-block; margin-right: 10px;}
	#popUi #lSettings input { color: var(--hcol); border-left: none;border-right: none;}
	#popUi:before{content: '';width: 0; height: 0; border-left: 5px solid transparent;border-right: 5px solid transparent;border-top: 5px solid var(--h3col);display: block;position: absolute; left: 50px; }
		#popUi.arrowRight:before{ right: 50px; left: initial; }
	.folder .options .submenu.sel.bigdrop .delbtn, #usersDropSub.submenu.sel.bigdrop .delbtn { right:20px; top:20px; left:auto; }

	.submenu .submenuFilterContainer{ position:absolute; border:0px; margin-top: 17px;  }
		.submenu.withTemplates .submenuFilterContainer{ width:470px; }
		.submenu .submenuFilterContainer input{ height:25px;  }
	input.submenuFilterInput { width:140px; border-width:1px; font-size:12px; background:#FFF url(/media/icon-search.png) no-repeat; border-radius:50px; padding:0px 10px 0px 30px; line-height:28px; background-position:7px; transition:all 300ms; font-weight:bold; color:#666; border:0; }
		input.submenuFilterInput:hover { background-color:#FFF; box-shadow:0 0 5px rgba(0,0,0,0.1)}
		input.submenuFilterInput.large{ line-height:35px; padding:0px 10px 0px 40px; background-position:12px; }
		input.submenuFilterInput.large:focus { width:300px }
	#popupcontent input.submenuFilterInput { margin:-5px auto 5px; border: solid 2px #EEE;}
	#popupcontent input.submenuFilterInput.catlist { margin:unset; position: absolute; top: -10px; left: 20px;}
		input.submenuFilterInput::placeholder{ transform:translateY(-1px) }
		input.submenuFilterInput:not([value=""]),
			input.submenuFilterInput:focus{width:210px; color: var(--h3col); box-shadow: 0 1px 15px #AAA; }
			.submenu .submenuFilterClear{display:inline-block; height:23px; line-height:23px; position:absolute;padding: 0; border: 0;}

#view{ white-space:normal; padding:10px; padding-bottom:50px; }
	#view .selectAllCheck{width:20%; position:absolute; left:4px; text-align:left; display: none; margin-top: 5px}
	#view.view-pubFood .selectAllCheck{ margin-left:-40px;}
	#view .selectAllCheck label:hover{background:none;}
	#selbox{position: fixed; border:dotted 1px var(--h3col);}
	/** DRAG AND DROP: BEGIN **/
	.dragging input{pointer-events: none!important;}

	.dragging.food #view.view-menu.empty:before,#view.view-waste.empty:before, .dragging.recipe #view.view-menu.empty:before,
	.dragging.recipe #view.view-waste.empty:before, .dragging.foodgroup #view.view-menu:before, .dragging.foodgroup #view.view-waste:before, .dragging.recipegroup #view.view-menu:before,.dragging.recipegroup #view.view-waste:before,
	.dragging.menu #view.view-waste:before, .dragging.food .recipeCreator:before, .dragging.recipe .recipeCreator:before, .dragging.food .foodCreator:before, .dragging.recipe .compTable:before, .dragging.food .compTable:before, .dragging.food #view.view-food:before, .dragging.recipe #view.view-recipe:before, .dragging.food .mealPlan.emptyMP:before, .dragging.recipe .mealPlan.emptyMP:before{ content:''; position:fixed; right:0px; left: 250px; top: 70px; background:rgba(240,240,240,0.6); bottom:0; z-index:2; }
/** 42330 **/
	.dragging.food #view.view-menu.empty:after, .dragging.food #view.view-menu.empty:after, .dragging.recipe #view.view-menu.empty:after, .dragging.menu #view.view-waste:after, .dragging.foodgroup #view.view-menu:after, .dragging.recipegroup #view.view-menu:after, .dragging.foodgroup #view.view-waste:after, .dragging.recipegroup #view.view-waste:after,  	.dragging.food #view.view-waste.empty:after, .dragging.recipe #view.view-waste.empty:after,   .dragging.food .recipeCreator:after, .dragging.recipe .recipeCreator:after, .dragging.food .foodCreator:after, .dragging.recipe .compTable:after, .dragging.food .compTable:after, .dragging.food #view.view-food:after, .dragging.recipe #view.view-recipe:after, .dragging.food .mealPlan.emptyMP:after, .dragging.recipe .mealPlan.emptyMP:after{ content:' DROP'; text-align:center; font-size:15px; font-weight:900; color:#666; border-radius:50%; border:solid 5px #DDD; width:120px; z-index:2; position:fixed; height:120px; line-height:150px; display:block;
	top:50%; left:50%; background:#FFF; margin:-60px; background-repeat:no-repeat; background-position:center 39px; background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='22px' height='22.9px' viewBox='0 0 22 22.9' xml:space='preserve'%3E%3Cstyle type='text/css'%3E	.st0%7Bfill:%23666666;%7D%3C/style%3E%3Cg%3E%3Cpolygon class='st0' points='17.1,12.4 17.1,0 4.9,0 4.9,12.4 0,12.4 11,22.9 22,12.4 '/%3E%3C/g%3E%3C/svg%3E"); transition:all 300ms}
	.dragging.menu #view.view-waste.dragOver:after, .dragging.food #view.view-menu.dragOver:after, .dragging.recipe #view.view-menu.dragOver:after, .dragging.foodgroup #view.view-menu.dragOver:after, .dragging.recipegroup #view.dragOver.view-menu:after,
	.dragging.food #view.view-waste.dragOver:after, .dragging.recipe #view.view-waste.dragOver:after
	,.dragging.foodgroup #view.dragOver.view-waste:after,.dragging.recipegroup #view.dragOver.view-waste:after,.dragging.food .recipeCreator.dragOver:after, .dragging.recipe .recipeCreator.dragOver:after, .dragging.food .foodCreator.dragOver:after, .dragging.recipe .compTable.dragOver:after, .dragging.food .compTable.dragOver:after, .dragging.food #view.dragOver.view-food:after, .dragging.recipe #view.dragOver.view-recipe:after, .dragging.food .mealPlan.emptyMP.dragOver:after, .dragging.recipe .mealPlan.dragOver.emptyMP:after{ color:var(--h3col); border-color:var(--h3col); transform:scale(1.1);  background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='22px' height='22.9px' viewBox='0 0 22 22.9' xml:space='preserve'%3E%3Cstyle type='text/css'%3E	.st0%7Bfill:%23FF6600;%7D%3C/style%3E%3Cg%3E%3Cpolygon class='st0' points='17.1,12.4 17.1,0 4.9,0 4.9,12.4 0,12.4 11,22.9 22,12.4 '/%3E%3C/g%3E%3C/svg%3E");}

	/** DRAGGING BOX OVERWRITE: BEGIN **/
	.dragging.food .recipeCreator:before, .dragging.recipe .recipeCreator:before, .dragging.food .foodCreator:before, .dragging.food .mealPlan.emptyMP:before, .dragging.recipe .mealPlan.emptyMP:before{width: 775px;}
	.dragging.food .recipeCreator:after, .dragging.recipe .recipeCreator:after, .dragging.food .foodCreator:after, .dragging.food .mealPlan.emptyMP:after, .dragging.recipe .mealPlan.emptyMP:after {left: 630px;}
	/** DRAGGING BOX OVERWRITE: END **/
	.dragging div.mon{pointer-events: none;}
	/** DRAG AND DROP: END **/
	.item{display: inline-block; width:375px; padding:10px; position:relative; box-shadow:1px 1px 15px #DDD; border:0; border-top:solid 1px transparent; border-bottom:solid 1px transparent; margin:5px; font-size:15px; line-height:30px; vertical-align:middle; border-radius:15px; transition:background 300ms, box-shadow 250ms;}
		.item[data-type=recipe]{padding:5px 15px 20px 5px;}
		/*.item:not(.monHead):not(.addbtn) [onclick]{pointer-events: none;}*/
		.item:not(.monHead):not(.addbtn) a{pointer-events: all;}
		.item:not(.prefade){transition:all 200ms}
		.item.sel{background:#ffffe5;}
			#view .item .editBTN,#view .item .viewBTN{right:auto;  left:18px; top:8px;  transform: scale(0.7); opacity: 0;transition:transform 300ms 200ms, opacity 300ms 200ms}
			#view .item[data-type=mealplan] .editBTN{left: 8px; top: 2px;}
			#view .item:hover .editBTN, #view .item:hover .viewBTN{ z-index:1;opacity: 1; transform: scale(1); pointer-events: all!important;  }
			#view .item[data-type=recipe] .editBTN, #view .item[data-type=food] .editBTN{left:8px; top: 8px;}
			#view .item.inactive > *:not(span:has(> .activateBtn)):not(.helpbtn) {filter: grayscale(1);}
			#view .item.inactive > .helpbtn {background-color: #858585 !important;}
			#view .item.inactive > span > .activateBtn{z-index: 1;}
			#view .item.inactive div[id^='result'] p::before {content: '[INACTIVE]'; display: inline-block;padding-right: 5px;}
			#view:not(.tableView) .item .result input { line-height: 30px; font-weight: bold; color: var(--hcol); background: transparent; border: solid 1px transparent; width: 160px; text-align: center; padding: 0; margin-top:-5px; pointer-events: all; text-align: left; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;}
		.item div{display:block; width:auto; border:0; box-sizing: border-box;}
			#view.tableView	h5>.removeItem{top:4px; position: absolute; left: 0px; width: 30px;}
			#view:not(.tableView) .item div.removeItem{width: 30px; height: 30px; background-color: rgba(0,0,0,0); position: absolute; right:0; top:0;}
				#view:not(.tableView) .item div.removeItem a{background-color: #f9f9f9;}
		.item p { line-height:120%; padding:5px 0 5px; font-size:15px; white-space:normal; margin-left:100px; overflow:hidden; max-height:100%; box-sizing:border-box; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; width:160px; text-overflow:ellipsis; }
		.item.addbtn { border:0px; box-shadow:none; text-align:center; background:#EEE; margin:2px 0 0 5px; width:auto; padding:13px 12px 10px; height:auto; transition:background 300ms}
			.item.addbtn:hover{background: #DDD;}
			.item.addbtn a{ display:inline-block; cursor:pointer;}
			.item.addbtn b{ width:25px; height:25px; line-height:25px; font-size:14px; border-radius:50%; display:inline-block; color:#FFF; background:var(--h2col); font-weight:900; cursor:pointer;font-style: normal;}
			.item.addbtn span{display:block; color:#666; font-style:normal; margin-top:7px; font-size:10px; font-weight:bold; line-height:100%; text-transform:uppercase; cursor:pointer;}
			.item.addbtn.fixed{position:fixed;left:260px;bottom:20px;}
		.fixedHead.item{display:none;}
		#view:not(.grouped) h5{display:none;}
		#view.tableView:not(.grouped) h5{display:none;}
		#view.grouped h5{display:block;}
		.fixedHead .lgreybtn { line-height:15px; margin:5px!important; }
		.item .food, #view .item .recipe, #view .item.dragDummy .result { width: 300px; pointer-events:none;}
		.view-catalogue .item .food, #view.view-catalogue .item .recipe, #view.view-catalogue .item.dragDummy .result { width: 270px;}
		#view:not(.tableView) .item .food, #view:not(.tableView) .item .recipe, #view:not(.tableView) .item.dragDummy .result, #view:not(.tableView) .item .recipe > p > input, #view:not(.tableView) .item .food > p > input { width: 100%; }
		#view:not(.tableView) .item .food > p, #view:not(.tableView) .item .recipe > p {width: calc(100% - 110px)}
		.mon{ font-size:10px; line-height:18px; margin-left: 110px; font-weight: bold; color: #555; position:relative; text-align:right; }
		.item div.mon{ border-bottom:dotted 1px #CCC; min-height:18px; vertical-align: top;}
		.item[data-type="mealplan"] div.mon{line-height: 21px;}
		#view:not(.tableView) .item[data-type="recipe"] div.mon,#view:not(.tableView) .item[data-type="food"] div.mon,#view:not(.tableView) .item[data-type="menuitem"] div.mon {width: auto !important; }
		#view:not(.tableView) .item[data-type="recipe"] div.mon input,#view:not(.tableView) .item[data-type="food"] div.mon input,#view:not(.tableView) .item[data-type="menuitem"] div.mon input{right:5px;position:relative;width: 65px; }
		#view:not(.tableView) .item[data-type="recipe"] div.mon .ingListWidth,#view:not(.tableView) .item[data-type="food"] div.mon .ingListWidth,#view:not(.tableView) .item[data-type="menuitem"] div.mon .ingListWidth {height: auto !important;}
		#view:not(.tableView) .item[data-type="recipe"] .mon div,#view:not(.tableView) .item[data-type="food"] .mon div,#view:not(.tableView) .item[data-type="menuitem"] .mon div{width:225px;}
		#view:not(.tableView) .item[data-type="recipe"]~h5:first-of-type,#view:not(.tableView) .item[data-type="food"]~h5:first-of-type{margin-top:0px;}
		#view:not(.tableView) .item[data-type="recipe"] div.mon .sus_badge_container>b,#view:not(.tableView) .item[data-type="food"] div.mon .sus_badge_container>b,#view:not(.tableView) .item[data-type="menuitem"] div.mon .sus_badge_container>b{position:relative;right: 20px;}
			#view:not(.tableView) .item div.mon{ width: 260px !important; }
			.item div.mon:last-child{border-bottom:0;}
			#Gall .item .mon.disabled{ filter:none; opacity:1 }
			#Gall .mon a{line-height:20px; }
			.tableView .item .mon div:not(.block){display: flex; justify-content: center;}
			#view:not(.tableView) .item .mon div{ width: 250px; }
			#view.tableView .item .mon div span{ margin-top:6px; text-align:center; }
			.mon > span { font-weight:bold; float:left; min-width:180px; max-width: 100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:left; display: inline-block !important; }
			.mon > div > label {width: 100%;}
			.mon select{ font-size:9px; padding-left:6px;padding-left:0px!important; background-position:right -10px; height:15px; color:#555; }
			.mon select[data-val="2"]{ color:var(--hcol); font-weight:bold; }
			.mon input { line-height:15px; font-weight:bold; color:var(--hcol); background:transparent; border:solid 1px transparent; border-left:0; border-right:0; width:80px; text-align:center; padding:0;}
			.mon textarea{display:inline-block; }
			.mon.disabled input{color:#777!important;}
			.mon input,.mon textarea,.mon select{border-color: transparent; }
			.mon .link{float:none; display:inline-block; text-align:center; padding:0px; vertical-align:bottom; width: 100%;}
			.mon .link .spinner, .mon .link .spinner:before {width: 16px; height: 16px; border-width: 3px;}
			.mon .link .spinner:before {top: -3px; left: -3px;}
			.mon .link:has(.mon-icon), .mon .link:has(.spinner){margin-top: 0 !important;display: inline-flex;justify-content: space-evenly;}
				.mon .link:has(.mon-icon):hover, .mon .link:has(.spinner):hover{ transform: scale(1.2); color:var(--h3col); }
			.mon .link .droparrow::after{width: 16px; height: 16px; line-height: 19px;top: 8px;}
			.mon a:has( + input) {position: absolute; right: 5px;}
			.mon a + input[value=''] {padding-left: 5px;}
			.mon a:has( + input:not([value=''])), .mon > .addbtn + input {display: none;}
			.mon > .addbtn{display: flex !important; justify-content: space-evenly !important; align-items: center; width: 100%; position: static; background: inherit;}
			.mon > .addbtn > .counter {display: block; position: static !important;}
			.mon .dropdown.on .drop#portions .subBlock > div {display: inline-block !important;}
			.mon .dropdown.on .drop#portions .portionUserBtn.ai {top: 5px; right: 10px;}
			.mon .dropdown .closeBtn, .item:has([data-type="import"]) .portionUserBtn.ai {display: none}
			.item:has([data-type="import"]) #portions .portionImg,
			.item:has([data-type="import"]) #portions .calInput,
			.item:has([data-type="import"]) #portions [id^='serPerPack'],
			.item:has([data-type="import"]) #portions .pCosts,
			.item:has([data-type="import"]) #portions .salePrice {pointer-events: none; opacity: .5}
			.mon .dropdown.on .closeBtn {display: block; position: fixed;margin-top: -10px;margin-right: -365px;left:unset;box-shadow: inherit;background-color: white;z-index: 1;}
			.mon:has(.dropdown.on){overflow: visible; z-index: 2;}
			.mon .dropdown.on .drop{margin-top: 30px;margin-left:-90px;width: 270px;height: 270px;border: 6px white solid;overflow: visible;}
			.mon .dropdown.on .drop .dropcontent{overflow: hidden; border-radius: 15px;}
			.mon .dropdown.on .drop#portions{margin-top: 0px;margin-left:-145px;width: 370px;height: 225px;overflow: hidden;border: unset;padding: unset;z-index:10}
			.mon .dropdown.on .drop#portions .pBlock{height: 100%;}
			.mon .dropdown.on .drop#portions span{margin-top: unset;text-align: unset;}
			.mon .dropdown.on .drop#portions input{pointer-events: all;}
			.mon .dropdown.on .drop .dropcontent:has(div.foodphoto) { width: 100%;}
			.mon .dropdown.on .drop .dropcontent > div{display: block !important;margin:0;width: 100%;}
			#view:not(.tableView) .mon input[type=checkbox]+label{ line-height: 10px; padding: 0;}
			#view:not(.tableView) .mon input[type=checkbox]+label:before{ transform: scale(0.8); margin: -1px 0px -1px 0px; }
		.item .src{display:none;}
		.item:hover:not(.fixedHead){color:var(--hcol); box-shadow:0px 1px 10px #999;}
		.addbtn.item:hover:not(.fixedHead){color:inherit; box-shadow:none;}
		.item.addbtn a:hover b{background:var(--hcol)!important;}
		.item.addbtn a:hover span{color:var(--hcol)!important;}
		.item .foodphoto{ margin-right:10px; border-radius: 6px}
	#view h5{margin:0px -10px 0px; padding-left: 20px;}
		#view h5.dragDummy{ background:transparent; }
		#view:not(.tableView) h5~div:not(.addbtn):not(#footer):not(.action-buttons-container){margin-left:-10px; padding: 10px 10px 20px 10px}
		#view h5 .mon{ display:none;}
		#view h5>span:first-child{width:300px; pointer-events:none; padding: 0 0 0 30px;}
		#view:is(.view-food, .view-recipe) h5>span:first-child{width:270px;}
		#view.view-actionReqR h5>span:first-child{width:270px;order: -101;}
		#view h5 span.mon{ display:none; }
		#view .damobtn{display:none;}

		#view .fixedCol{ position:absolute; }
		#view h5 .fixedCol{ margin-left:30px; }
		#view h5 .fixedCol~.mon{ left:270px; }
		#view .item .fixedCol~.mon{ left:300px; }

	#view.tableView:not(.view-pubFood){padding:0; display:inline-table;padding-bottom:150px;}
		#view.view-menu.tableView, #view.view-waste.tableView{padding-bottom:60px;}
		#view.tableView:nth-child(2){ margin-top:38px; }
		.tableView .item{display:flex; box-shadow:none; margin:0; width:100%; padding:0; height:30px; white-space:nowrap; align-items: center;}
		.tableView .item > *{flex-grow: 0; flex-shrink: 0;}
			#view.tableView .item div.removeItem{width: 30px; height: 30px; border-right:solid 1px #EEE; padding: 0;}
			/*Css for detached icon*/
			#view.tableView .item span.helpbtn{ margin:8px 4px;pointer-events:all;order: -101;}
			#view.tableView .item span.helpbtn::before{ content: var(--error-count, '!');}
			#view.tableView .item span.helpbtn.warning::before{color: var(--hcol);}
			#view.tableView.view-allPubFood .item span.helpbtn {display: none;}
			/*#view.tableView .item span.helpbtn span{ position:fixed;}*/
			#results-foodSearch>div .detachedIcon{position: relative; right: 13px;top: 50px;}
			#results-foodSearch>div .ficon{margin:12px 0 0 -7px;}
			#results-foodSearch>div.sel .ficon{ margin:4px 0;}

		/*.tableView .result, .tableView .result p{display:inline; margin-left:0px;}*/
		.tableView .groupTotal .result {width:270px;}
		.tableView .result, .tableView .result p{margin-left:0px;height:32px;width:260px;white-space:nowrap;padding: 0;font-size:12px;font-weight:bold;line-height:30px;/*margin-left: 5px;*/}
			.tableView .result p{width: auto;}
		.tableView .dragDummy .result, .tableView .dragDummy .result p{height:22px;}
			.tableView h5.dragDummy .result, h5.tableView .dragDummy .result p{height:100%;}
		.tableView h5.dragDummy{display:none!important;}
		.tableView .item:hover{box-shadow:none; border-color:#EEE}
		.tableView .fixedHeaderWrapper {position: fixed; top: 70px; overflow: hidden; z-index:2;}
		#view.tableView > .fixedHeaderWrapper {width: calc(var(--scaled-width, 100vw) - 260px);}
		#subfolder-view.tableView > .fixedHeaderWrapper {width: calc(var(--scaled-width, 100vw) - 575px);}
		.tableView .fixedHead { background:#FFF; width:100%; top:0; display:flex; line-height:33px; height:39px; border-radius: 0;}
				.tableView .fixedHeaderWrapper.fixedMovedY{ box-shadow:0px 2px 10px #DDD; }
		.tableView .mon{ display:inline-block; width:80px; height:100%; text-align:center; margin:0; border:0!important; border-right:solid 1px rgba(0,0,0,0.06)!important; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; line-height: 20px;}
			.tableView .mon.disabled label,.folder #validationPanel ~ .view-recipe .item .mon.disabled,.folder #validationPanel ~ .view-food .item[data-type="food"] .mon.disabled{pointer-events: none!important}
			#view.tableView .mon.highlight {display:inline-block !important; order: var(--order, -1);position: relative;min-width: 90px;}
			.tableView .mon:not(.disabled).highlight {pointer-events: all;}
			.tableView .mon .additemBtn{transform:scale(1)!important;}
			.tableView .fixedHead .mon{border-right:solid 1px #EEE!important; padding:0; font-size:10px; line-height:10px; padding-top:5px;}
			.tableView .fixedHead .mon select { padding-left:5px!important; border-right:0; color:#FFF; font-weight:bold; margin:-5px 0px; width:68%; vertical-align:middle; text-transform:uppercase; max-width:none;}
			.tableView .fixedHead .mon select.subgroup1{background-color: var(--hcol);}
			.tableView .fixedHead .mon select.subgroup2{background-color: #AAA;}
			.tableView .mon input{width:100%; height:100%;}
			.tableView #footer .mon input{height:auto;}
			.tableView .mon input[data-field='sus_water']{ padding-right: 13px; }
			.tableView .mon input[data-field='sus_co2eq']{ padding-right: 8px; }
			.tableView .mon input[data-field='pFPwater']{ padding-right: 13px; }
			.tableView .mon input[data-field='pFPco2']{ padding-right: 8px; }
			.tableView h5.sel .mon input{padding-right:0px;}
			.tableView h5 .mon input{width:100%;}
			.tableView h5 .mon>div{ color:#BBB; position:absolute; z-index:1; height:20px; left:0; top:12px; width:100%; pointer-events:none; }
			.tableView .mon select{background-position: right -3px; height: 30px; vertical-align: sub; font-weight:bold; width: 100%; text-indent:5px; background-color: transparent; border-bottom-width: 3px;}
			.tableView .mon textarea{max-width: 78px; max-height: 30px; border-bottom-width: 3px;}
			.tableView .mon .counter{ position: absolute; right: 0; top: 8px; }
			.tableView .mon a:not(.additemBtn){ cursor: pointer!important; pointer-events: auto; line-height: 30px; font-weight: bold; color: var(--hcol); background: transparent; }
		.tableView .mon:first-child{text-align:left;}
		.tableView .mon >span:not(.link):not(.spacer):not(#name){display:none!important;}
		.tableView .item>div[data-col='0'],.tableView.view-mealplan .item.fixedHead>div[data-col='0']{ width:300px; min-width: 300px; display:inline-block; padding-left:30px;order: -101;}
		.folder:not(:has(.supplier-options)) .tableView:is(.view-food, .view-recipe) .item>div[data-col='0']{min-width:270px;width:270px !important;}
		.tableView.view-mealplan .item>div[data-column='0']{width:300px;min-width:300px;padding-left:30px;border-right:solid 1px #EEE!important;}
		.tableView .item.fixedHead>div[data-col='0']{ width:300px; padding-left:30px; order: -101; }
		.folder:not(:has(.supplier-options)) .tableView.view-menu .item.fixedHead>div[data-col='0']{ width:270px; min-width:270px; }
		.tableView:is(.view-food, .view-recipe) .item.fixedHead > div[data-col='0'] {padding-left: 42px;}
		.tableView.view-menu:not(.disabled) .item.fixedHead>div[data-col='0']{ margin-left:30px; }
		.tableView.view-pubFood .item>div[data-col='0']:has(.selectAllCheck), .tableView.view-actionReqF .item>div[data-col='0']:has(.selectAllCheck) {width: 300px;order: -101; margin-left: 40px;}
		.folder:has(.supplier-options) .tableView .item[data-type]:not([data-type='portion']) {background-color: #F9F9F9; border-radius: 0;}
			.tableView .ficon{margin: 8px 0px 0px -20px;}
			.tableView .menuFolder .ficon{ margin:7px 0px 0px -20px}
		.tableView .foodphoto, .tableView .portionphoto{display:none!important;}
		.tableView:not(.view-menu) .fixedHead+h5{margin-top:0!important;}
		.tableView h5 input + h3{display: none; position: relative; top: -10px;}
		.tableView h5 input + h3:before{ content: '!'; display: inline-block; left: 5px; color: #FFF; width: 16px; height: 16px; text-align: center; border-radius: 50%; top: 5px; font-size: 12px; cursor: pointer; background: var(--h3col); margin: 0; border: none; line-height: 16px; pointer-events: initial!important; }
		.tableView h5 input[data-field="popularity"]:not([value="100"]):not([value="100.0"]) + h3, .tableView h5 input[data-field="price"] + h3{display: inline-block;}
		.tableView h5 input[data-field="price"] + h3{top: 2px; left: 12px;}
		.tableView .item.addbtn { text-align:left; display:inline-block !important; width:auto; height:auto; margin:10px 8px 6px; line-height:29px; border-radius:50px; }
		.tableView .item.addbtn a { margin-left:0; margin-right:0!important; height:auto; padding:0px 20px 0 10px; }
 		.tableView .item.addbtn b { width:15px; height:15px; line-height:15px; font-size:10px; margin-left:-1px; text-align:center; margin-right:4px; vertical-align:middle}
		.tableView .item.addbtn span { display:inline; margin-left:3px; vertical-align:middle}
		#view.tableView .item .editBTN,#view.tableView .item .viewBTN{left:-2px; top:-3px; background-color:var(--h2col); transform:scale(0.7)!important;}
			#view.tableView .item .editBTN:hover, #view.tableView .item .viewBTN:hover{background-color: var(--h2col);}

		.tableView.view-food .item>div:first-child, .tableView.view-recipe >h5>span, .tableView.view-recipe .item>div:first-child{position: sticky; left: 0; z-index: 1; overflow: visible;}
		.tableView.view-food .item>div:first-child, .tableView.view-recipe .item>div:first-child{ background:#FFF}
			.tableView.view-food.fixedMovedX .item:not(.fixedHead)>div:first-child:after,
				.tableView.view-recipe.fixedMovedX .item:not(.fixedHead)>div:first-child:after { content:''; position:absolute; right:-21px; width:22px; background:linear-gradient(90deg, rgba(0,0,0,0.1) 0%, rgba(0,0,0,0) 100%); height:100%; pointer-events:none; }
			.tableView.view-food .item.sel>div:first-child, .tableView.view-recipe .item.sel>div:first-child{ background-color: #ffffe5; }
		.tableView.view-recipe >h5>span{background-color: inherit;padding-left:30px;margin-left:-30px}
		.tableView.view-recipe >h5 .mon>div{z-index: 0;}
		.tableView.view-recipe > .menuGroup {overflow-y: unset !important;}
		.tableView .item[data-type='portion'] p{ padding-left:15px; font-weight:normal; border-left:solid 2px #EEE; margin-left:5px; }
		.tableView .item[data-type='portion'] .ingListWidth {display:none;}
		.tableView .item[data-type='portion'] .ingListWidth.barcode{display:block;}
		.tableView .item[data-type='recipe'] .ingListWidth.barcode,.tableView .item[data-type='food'] .ingListWidth.barcode {display:none;}

		input[data-field=healthScore]:not([value='']):disabled { border:solid 2px currentColor; border-radius:50px; width:25px!important; color:var(--h3col)!important; letter-spacing:-1px; height:25px; margin:0 25px 0 0; font-size:11px; }
			input[data-field=healthScore][value^='0']:disabled,
			input[data-field=healthScore][value^='1']:disabled{color:#ed1c24!important;}
			input[data-field=healthScore][value^='4']:disabled,
			input[data-field=healthScore][value='5']:disabled{color:#39b54a!important;}
			.tableView input[data-field=healthScore]:not([value='']):disabled{ margin:2px auto}
		input.hfss.red[data-field=healthScore]{color: #EF3E22!important;}
		input.hfss.green[data-field=healthScore]{color: #7FC241!important;}
		/*//Divya//#59003//#64829*/
		input[data-field=labelRating]:not([value='']):disabled { border:solid 2px currentColor; border-radius:50px; width:25px!important; color:#08B34C!important; letter-spacing:-1px; height:25px; margin-top:2px; font-size:11px; }
			input[data-field=labelRating][value^='B']:disabled {color:#7FC241!important;}
			input[data-field=labelRating][value^='C']:disabled {color:#FECA0A!important;}
			input[data-field=labelRating][value^='D']:disabled {color:#F58220!important;}
			input[data-field=labelRating][value='E']:disabled {color:#EF3E22!important;}
		/*//Divya//#59003//#64829*/

	li#liforecastingwaste ul {	margin-left:-50px !important;	padding:0;	width:240px;	overflow:hidden; }
		li#liforecastingwaste ul::before {	z-index:2; }
		li#liforecastingwaste ul li {	padding:0;	border-radius:0 !important; }
		li#liforecastingwaste ul .flatpickr-calendar {	background-color:transparent;	box-sizing:border-box;	width:230px; padding:10px 15px 50px; background:#FFF }
		li#liforecastingwaste ul .flatpickr-calendar::before, li#liforecastingwaste ul .flatpickr-calendar::after {	display:none !important; }
		li#liforecastingwaste ul .flatpickr-days {	width:100%; }
		li#liforecastingwaste ul .dayContainer {	width:100%;	min-width:100%; }
		li#liforecastingwaste ul .flatpickr-day {	display:flex;	justify-content:center;	align-items:center;	aspect-ratio:1;	height:auto;	line-height:initial; }

#abovefooterMenu:not(:empty){margin:10px 0 110px; padding-left:30px;}
.folder.disabled #abovefooterMenu > .btn, .folder.disabled #abovefooterMenu > .additemBtn {display: none;}

#view #footer { display:none; background:#DDD; height:40px; position:fixed; bottom:0px; right:0; left:250px; padding-right:10px; white-space: nowrap; box-shadow:0px -2px 5px #bbb; z-index: 2;}
		#view.fixScroll #footer{ bottom:9px!important; }
		#view.fixScroll :not(.action-buttons-container) .greybtn{ bottom:20px!important; }
		.folder.disabled #view.view-mealplan.fixScroll .greybtn{display: block !important;}
		#view.tableView #footer, #view.view-menu #footer{ display:block; padding: 20px 0; height: auto; }
		#view.tableView #footer #averages{height: 25px;margin-top: -15px;position: absolute;}
		#view.tableView.view-menu #footer #averages{height: 30px;margin-top: 0;position: inherit;}
		#view.tableView.view-menu #footer #averages:has(+ #weightedTotal:not(.hidden)){height: 25px;margin-top: -15px;position: absolute;}
		#view.tableView #footer #totals{padding:0;height:40px;}
	#view.tableView h5, #subfolder-view.tableView h5{ position:relative; padding:0 0 0 30px; line-height:40px; height:40px; display:inline-flex; text-align:left; white-space: nowrap; transition:all 200ms; margin: 0px;}
		#subfolder-view.tableView h5.sel:before{display:none;}
	#view.tableView.view-menu h5, #view.tableView.view-waste h5{ border-top: 2px solid #FFF }
	#view.tableView h5~div div.dragDummy, #subfolder-view.tableView h5~div div.dragDummy{ padding-bottom: 0px; height:25px;line-height:unset; overflow-y: hidden; }
		#subfolder-view.tableView h5~div div.dragDummy{visibility: hidden; pointer-events: none;}
	#view.tableView h5~div div.dragDummy:hover, #subfolder-view.tableView h5~div div.dragDummy:hover{ border-color: #FFF; }
		#view.tableView h5>*:last-child, #view.tableView .item>*:last-child{ margin-right:80px; } /*add extra space so the + monitr button is drawn on the layout*/
		.folder.showAuditPanel #view.tableView h5>*:last-child, .folder.showAuditPanel #view.tableView .item>*:last-child{ margin-right:206px; } /* add extra 80px + 126px audit panel */
	#view.view-waste #footer, #view.view-menu #footer{ height: auto; padding: 10px 0px;}
	.tableView #footer{ transition:transform 350ms!important }
		.tableView #footer.minimised{ transform: translateY(calc(100% - 20px)); }
		.tableView #footer .minimiseBtn{ position:absolute; top:-15px; right:20px; }
			.tableView #footer.minimised .minimiseBtn{ transform:rotate(180deg); transition:transform 350ms; }

	/* 62426 - waste project v3 */
	.menuInfoBTN { position:absolute; left:264px; scale: 0.9	}
	.forecastWasteBtn { margin:3px 40px 2px 5px !important; padding:0 25px 0 35px !important; }
		.forecastWasteBtn .spinner, .forecastWasteBtn .counter{ margin:0px 6px 0 -25px }
		.forecastWasteBtn .spinner:not(.hidden)+.counter{display:none;}
	.dateSelectorWrapper {display: inline-block;}
	.dateSelectorContainer {display: flex; align-items: center; height: 40px;}
	.dateSelectorContainer__waste {margin-left: 30px; margin-right: 152px;}
	.dateSelectorContainer__waste-menu {padding: 0 5px;}
	.dateSelectorContainer .dateSelectorBtn {height: 36px; width: 36px;line-height: 36px; font-size:9px; margin: 2px !important;}
	.wasteContainer {display: flex; flex-direction: column; width: 80px; text-align: center; margin-left: 5px; margin-right: 5px;}
	.wasteDate {line-height:10px; margin-top:5px; font-size: 9px;}
	.spacer.wasteDatePicker { margin:0 !important; }
		.wasteDate.input {margin:0;}

	/* enable tracking container */
	.wasteEnableTracking {position: absolute; display: flex; justify-content: center; margin-top: 150px; width: calc(100% - 40px);}
	.enableTrackingBtn {line-height: normal; height: 40px; align-content: center;}

	/* tab menu sub folder */
	#closeSubFolderBtn{position:fixed; left:483px; top:75px; padding:0 15px; transition:all 200ms}
		#closeSubFolderBtn:hover{left:478px; padding:0 20px 0 15px;}
	.subfolder-options .delbtn{ display: inline-block !important; }
	#subfolder-maindiv {position:absolute; background-color: white; top: 40px; right:calc(-1 * var(--scaled-width, 100vw) + 300px); min-height:calc(100% - 40px); pointer-events:none; z-index: 6; width: calc(100% - 300px); box-shadow:-1px 11px 30px rgba(0,0,0,0.1); transition:right 450ms; overflow: auto;}
		#subfolder-maindiv.on{ right:0; pointer-events:all;}
		#subfolder-maindiv:empty{ visibility:hidden; pointer-events:none; }
	#subfolder-maindiv .tabmenu { display:inline-block; vertical-align:bottom; padding:0 20px; background:unset; border:unset;	}
		#subfolder-maindiv .tabmenu a { position:relative; margin-right:15px; padding:13px 15px; transition:background 300ms; color:var(--hcol);}
		#subfolder-maindiv .tabmenu a.no-access {color:#999;}
		#subfolder-maindiv .tabmenu a:not(.on):hover { background:#E5E5E5;	}
		#subfolder-maindiv .tabmenu a::before, #subfolder-maindiv .tabmenu a::after{ content:''; width:35px; height:35px; background:inherit; clip-path:url(#tabCorners); position:absolute; top:0; left:-15px; transform:translateX(-10px);	}
		#subfolder-maindiv .tabmenu a::after { transform:rotateY(180deg); right:-25px; left:auto;}
		#subfolder-maindiv .tabmenu a.on { z-index:1;}
	#subfolder-view { width:fit-content; padding:39px 0 100px; margin-left:15px;}
		#subfolder-view .fixedHead{ width:100%;}
		#subfolder-view.tableView h5 { padding:0 !important;	}
		#subfolder-view.tableView h5 .mon>div { top:22px;	}
	.waste_menuLive { display:inline-block; margin-right:130px !important;	}
		.waste_menuLive .counter { margin: 0 3px 0 -10px; }
		.waste_menuLive .drop ul { list-style:none; max-height:50vh; overflow-y:auto; min-width:220px; }
		.waste_menuLive .drop li label { padding:12px 20px; width:100%; font-weight:normal; color: #333	}
		.waste_menuLive .drop li a { margin:10px;}
	#view.view-waste .item[data-type=recipe]>div{background:transparent;}
		.tableView .item.mixedWaste-item,
		.tableView .mixedWaste-item .result,
		.tableView .mixedWaste-item .result p,
		.tableView .mixedWaste-item .mon { height:80px; line-height:76px; }
		.tableView .mixedWaste-item .result { pointer-events: none; }
		.tableView .item.mixedWaste-item{border-bottom: solid 2px #EEE; border-radius: 15px; overflow: hidden;}
	#view.view-waste.tableView .mixedWaste-item .title p{ margin-left:-22px; }
		.tableView .mixedWaste-item .title p{ font-size:15px; }
		.tableView .mixedWaste-item .title svg{ margin-right: 10px; }
	.helpbtn.generalWaste-tooltip { position:absolute; top:50%; left:20px; height:fit-content !important; }
		.helpbtn.generalWaste-tooltip span { margin-left:-20px; height:auto !important; line-height:inherit !important; text-align:left !important;	}
	.unavailable_generalwaste { text-align:initial !important; padding:30px !important; margin:0 !important; border-radius:15px;}
	#view.view-waste #footer{ padding:20px 0;}
	#Ggeneralwaste .additemBtn{padding:0 5px 0 5px;text-overflow: ellipsis;overflow: clip;white-space: nowrap;width: 100%;}

	#mw-preview-pop { position:fixed; width:700px; bottom:100px; padding:50px; box-shadow:0 0 15px rgba(0, 0, 0, 0.5); border-radius:100px; background:#fff; left:50%; transform:translateX(-250px); z-index: 6; }
		#mw-preview-pop::before { content:""; position:absolute; top:-1.5px; left:50%; transform:translateX(-50%); width:50%; height:3px; background-color:#F60; }
		#mw-preview-pop p { white-space:normal; margin:0 30px; }

	.mw-preview-input-div{ position:absolute; top:0; left:0; background-color:#fff !important; width:100%; height:100%; padding-bottom:0 !important; }
		.mw-preview-input-div input{ color:#F60; }
	#mw-preview-total-balloon{ margin-left:15px; position:absolute; top:5px; transform:translateX(-50%); width:60px !important; height:60px; background-color:#FFF; border:3px solid #F60 !important; color:#F60; font-weight: bold; border-radius:50%; font-size:14px; display:flex !important; align-items:center; justify-content:center; z-index: 6; }
		#mw-preview-total-balloon::after{ content:""; position:absolute; bottom:-10px; left:50%; transform:translateX(-50%); width:0; height:0; border-left:10px solid transparent; border-right:10px solid transparent; border-top:10px solid #F60; }
	.mixedWasteForm .wasteLogComboBox{top:-5px;}

		/* waste project end */

	#view.view-menu.tableView .item>*:last-child, #view.view-waste.tableView .item>*:last-child{margin-left: 42px;}
	#view.view-menu.tableView .groupTotal>*:last-child{margin-left: 0;}
		#view.tableView h5 .mon{ display:inline-block; line-height: inherit;}
		#view.tableView h5 span { display:inline-block; height:100%; line-height:40px; float:left;}
		#view.view-food h5{ padding:0px !important; }
		#view.tableView h5:first-child{margin-top:0}
	#view > .action-buttons-container { position:fixed; bottom:3px; right: 5px; display: flex; flex-direction: row; justify-content: flex-end; align-items: center; gap: .25rem; z-index: 2;}
	#thumbsBTN, #groupBTN, #togglePortions, #resetcolumnsPrefs { width:40px!important; height:40px; border-width:2px; padding:0; background:#999 url(/media/icon-thumbs.png) no-repeat center; box-shadow:none; border-radius:50%; z-index: 2}
			/* #thumbsBTN{ right:5px; } */
			#groupBTN{ /* right:48px;  */background-image:url(/media/icon-grouped.png); }
			#togglePortions{ background-image:url(/media/icon-detail.png); }
			#thumbsBTN:hover, #groupBTN:hover, #resetcolumnsPrefs:hover, #togglePortions:hover {background-color: #777;}
			#resetcolumnsPrefs{ background-image:url(/media/icon-sorted.png);}
			#view.view-waste #thumbsBTN, #view.view-waste #groupBTN, #view:not(.tableView) #togglePortions{display:none;}
		#view:not(.tableView) #thumbsBTN, #view.grouped #groupBTN, #view #togglePortions.on{ background-color:var(--h2col);}
		#view:not(.tableView) #thumbsBTN:hover, #view.grouped #groupBTN:hover, #resetcolumnsPrefs:hover{ background-image:url(/media/icon-undo.png); }
	#footer .mon{display:none;}
		#footer>.spacer{ position:absolute; top:-15px; left:50%; }
		#footer .removeItem{width:30px; display:inline-block;}
		.tableView #menuFixedFooter>div{ height: 30px; line-height: 30px;}
			.tableView #footer #targets{ height: 40px; line-height: 40px; }
			.tableView #footer .grey{ color:#999!important }
			.tableView #footer .mon{display:inline-block; height: 100%; line-height:inherit; transition:background 300ms}
			.tableView #footer #targets .mon{border-bottom:solid 2px #CCC !important; border-top:solid 1px #CCC !important}
			.tableView #footer #menuFixedFooter>div:hover .mon:not(:first-of-type){ background:#EEE }
			.tableView #footer #menuFixedFooter>div:hover .mon, .tableView #footer #menuFixedFooter>div:hover .mon input{ color:#333!important; }
		#footer .additemBtn{margin:6px 10px;}
		#footer .mon:first-of-type{ width:190px; display:inline-block; margin:0px; }
		.view-detFood #footer .mon:first-of-type, .view-allPubFood #footer .mon:first-of-type{ margin-left:110px; }
		.view-food #footer .mon:first-of-type, .view-recipe #footer .mon:first-of-type{margin-left:80px;}
		.view-menu #footer .mon:first-of-type{width:300px; border:0!important;}
		.view-waste .wasteTotals{ padding: 0; height: 30px; line-height: 30px; }
			.view-waste .wasteTotals .caps{ overflow:visible }
			.view-waste .wasteTotals .dgrey{ color:#333!important }
		#footer .monb{ display:inline-block; line-height: 42px;}
		.pane.folder.closed #footer{ display:none!important; }
	#view.grouped:not(.tableView) .newGroup.offFooter{display:inline-block;}
	.newGroup.offFooter, #unavailable+#footer+.newGroup{display:none;}
	#view h5 .hideGroup{ display: inline-block; height: 20px; vertical-align: middle; }
	#view.tableView h5 .hideGroup{ position:absolute; left:250px; top:10px; }
	body#exported #view.tableView h5 .hideGroup{ display:none; }
	.pagination{text-align: center; font-size: 0;} /*font-size: 0 to remove spaces between href tags (causing by display:inline-block)*/
		.pagination .disabled, .pagination:empty{display: none;}
		.pagination .paginationMessage { position: absolute; }
	#pagination{margin: 15px 0; pointer-events:none;}
		#pagination>*{ pointer-events:all; }
		.tableView #pagination { position:fixed; bottom:-15px; right:0px; width:calc(100% - 250px); z-index:1; padding:3px 140px 2px 0; }
		.tableView #footer+#pagination { bottom:80px; }
		.tableView.view-recipe #pagination, .tableView.view-recipe #pagination {bottom: 85px;}
		.tableView.view-actionReqF #pagination {bottom:1px; margin:0}

	/* Exceptions for menu V2 */
	#view.view-menu.tableView .item .recipe, #view.view-menu.tableView .item .food, #view.view-menu.tableView .mixedWaste-item .result{width: 270px;padding-left: 40px;position: relative; border-right:solid 1px rgba(0,0,0,0.06)!important;}
	#view.view-menu.tableView .result p{ width: auto; }
	#view.view-menu.tableView .result.menuFolder p{ padding: 0; }
	.disabled #view.view-menu input, .disabled #view.view-menu label:has(input) {pointer-events: none !important; color: #777 !important;}
	.disabled #view.view-menu .refreshbtn {display: none;}
	#view.view-waste.tableView .item.fixedHead >div:first-child {width:330px;}
	#view.view-waste #footer .mon:first-of-type {width: 330px; border:0;}
	#view.view-menu #footer .mon.noborder, #view.view-waste #footer .mon.noborder {border:0 !important;}
	h5>input,
		#view.view-menu.tableView .item .result.menuFolder input,
		#view.view-food.tableView .item .result input,
		#view.view-pubFood.tableView .item .result input,
		#view.view-recipe.tableView .item .result input,
		#view.view-actionReqF.tableView .item .result input,
		#view.view-actionReqR.tableView .item .result input,
		#view.view-cat.tableView .item .result input,
		#view.view-allPubFood.tableView .item .result input,
		#view.view-detFood.tableView .item .result input,
		#view.view-waste.tableView .item .result.wasteFolder input,
		.supplier-options ~ #view .item .result input {width: 100%; background: transparent;border: solid 2px transparent; color: #555; font-size: 18px; font-weight: normal; border-radius:50px; line-height: 30px; padding:0; text-overflow: ellipsis;}
		#view.view-waste.tableView .item .result.wasteFolder input {width: 100%;}
	#view.view-waste.tableView .item .result.wasteFolder input{font-size: 15px;}
	#view.view-menu h5>input:not([data-field="groupname"])/*DEC22 48773*/,
		#view.view-menu.tableView .item .result.menuFolder input,
		#view.view-waste.tableView .item .result.wasteFolder input,
		#view.view-food.tableView .item .result input,
		#view.view-actionReqF.tableView .item .result input,
		#view.view-actionReqR.tableView .item .result input,
		#view.view-pubFood.tableView .item .result input,
		#view.view-cat.tableView .item .result input,
		#view.view-allPubFood.tableView .item .result input,
		#view.view-detFood.tableView .item .result input,
		#view.view-recipe.tableView .item .result input,
		.supplier-options ~ #view .item .result input {width: 100%; font-size: 13px;height: 30px; padding: 0; pointer-events: all; border-left: 0; border-right: 0; border-radius: 0; border-width: 1px;}
		#view.portionsVisible .item:not([data-type='portion']) .result input, #view.view-menu .item:not([data-type='portion']) .result input, #view.view-waste .item:not([data-type='portion']) .result input{font-weight: bold!important;}
	#view.view-food.tableView .item .result.food input,
	#view.view-pubFood.tableView .item .result input,
		#view.view-recipe.tableView .item .result input{ width:100%; font-size: 15px; padding: 0;}
	#view.view-food.tableView .item .result.food input:hover,
	#view.view-pubFood.tableView .item .result input:hover,
		#view.view-recipe.tableView .item .result input:hover{color:var(--hcol);}
	#view.view-pubFood.tableView .item[data-type="portion"] .result input,
	#view.view-recipe.tableView .item[data-type="portion"] .result input,
	#view.view-food.tableView .item[data-type="portion"] .result input,
	#view.view-actionReqF.tableView .item[data-type="portion"] .result input,
	#view.view-actionReqR.tableView .item[data-type="portion"] .result input,
	#view.view-cat.tableView .item[data-type="portion"] .result input,
	#view.view-allPubFood.tableView .item[data-type="portion"] .result input,
	#view.view-detFood.tableView .item[data-type="portion"] .result input {font-size: 13px; font-weight: normal;}

	#view.view-menu.tableView .item .result.menuFolder { min-width: 270px; width: 270px; }
	#view.view-menu.tableView .item .result.menuFolder input{pointer-events: none !important;}/*//To make input field readonly//#74518*/
	#view.view-menu.tableView .item .result.menuFolder input.editable{pointer-events: all !important;}/*//To make input field readonly//#74518*/
	#view:not(.tableView) .item .recipe > p > input{pointer-events: none !important;}
	#view:not(.tableView) .item .recipe > p > input.editable{pointer-events: all !important;}
	#view.view-waste h5>input {width: 300px;}
	#view.view-waste h5~div div.dragDummy{  height:unset; }

	#view.view-menu .menuGroup .item.dragDummy {height:5px;}
	#subfolder-view .menuGroup .item.dragDummy {height:0;}
	#view.view-menu .menuGroup .item.dragDummy.tempDummy {height:25px;}
	#view.view-menu :is(.item, h5) .mon[data-col='3'], #view.view-menu .item .mon.em {width: 90px;}
	#view.view-menu .item.dragDummy, #view.view-waste .item.dragDummy, #subfolder-view.subfolder-view-waste .item.dragDummy { box-shadow: unset; }
		#view.view-menu .item.dragDummy div.mon, #view.view-waste .item.dragDummy div.mon, #subfolder-view.subfolder-view-waste .item.dragDummy div.mon { border: 0; }
		.item.dragDummy .mon{visibility: hidden;}
	.tableView .removeItem .delbtn {margin: 5px;}
	.tableView .removeItem { order: -101; }

	#view.view-waste.tableView .item .recipe, #view.view-waste.tableView .item .food, #view.view-waste.tableView .item .title{ width: 300px; padding-left: 40px; position: relative; border-right: solid 1px rgba(0, 0, 0, 0.06) !important;}
	#view.view-waste.tableView .result p{ width: auto; }
	 #view.view-waste.tableView .result.wasteFolder p{ padding: 0; }

	#view.view-waste .item { transition: border 0ms, opacity 300ms; }
		#view.view-waste .item.dragDummy { box-shadow: unset; }
			#view.view-waste .item.dragDummy div.mon { border: 0; }

		#view.view-waste .grabber .mon:hover:not(.disabled), #subfolder-view.subfolder-view-waste .item:not(.fixedHead):not(.mixedWaste-item) .mon:hover:not(.disabled) {background-color: #f5f5f5; border:0!important; border-radius:50px;}
		#view.view-waste .grabber input:hover { cursor: pointer; }
		#view.view-waste.tableView input.disabled,#view.view-waste.tableView input.disabled:focus{border-width: 0; color: #AAA; }
		#view.view-waste.tableView .mon input[columnwastelog], #subfolder-view.subfolder-view-waste.tableView .mon input[columnwastelog] { margin-left: 2px; width: calc(100% - 32px); }
		.iconWaste {margin: 4px 0 0 10px;}
			.iconWaste svg {pointer-events: none;}

	#view.view-waste .monHead .mon:hover:not(.disabled) {background-color: transparent !important; }
	/* #view:not(.tableView) #showPortionsBtn{margin: 5px 7px 0px 318px; bottom: unset; z-index: 0} */
	#view .menuGroup { transition: all 300ms; overflow-y: auto; }
	#view.empty #showPortionsBtn{margin: -2px 7px 0px 7px; bottom: unset; z-index: 0}
	#view.tableView .menuGroup { /*max-height: 900px;*/ transition: all 300ms; overflow-y: visible; }
	.refreshbtn{position:absolute; right:20px; top:12px; border:0!important; font-size:22px; padding:5px; border-radius:50px; opacity:0; pointer-events: none; transform:scale(0.8); transition: all 300ms }
		div.mon .refreshbtn{right:0px; font-weight:normal;}
		p:hover .refreshbtn, div.mon:hover .refreshbtn{opacity:1; pointer-events: all; transform:scale(1)}
		.refreshbtn:hover{color: var(--h3col)!important;}
	#view.tableView .refreshbtn{top:1px;}

	#view.tableView #menuItemPortionsDrop { margin: 34px 37px!important; }

	.view-pubFood .publishCheck, .view-actionReqF .publishCheck{display:inline-block; vertical-align:top;order: -101;}
	.view-pubFood .publishCheck::before, .view-actionReqF .publishCheck::before{margin: 0px 4px;}
	#validationPanel:has(#rule0:not(.on)) + #view .publishCheck, #validationPanel:has(#rule0:not(.on)) + #view .selectAllCheck {visibility: hidden;}
	.folder:has(.supplier-options) .publishCheck:has(> .spinner) {margin-inline: 5px;}
	.view-pubFood #addNewBtn,.view-pubFood .item .editBTN, .view-actionReqF #addNewBtn,.view-actionReqF .item .editBTN{display: none !important;}
	.view-pubFood.tableView .result,.view-pubFood.tableView .result p, .view-actionReqF.tableView .result,.view-actionReqF.tableView .result p, .supplier-options ~ #view .result p{margin-left: 10px;padding-right:15px;}
	.view-pubFood .item[data-type='portion'] [id^='result'], .view-actionReqF .item[data-type='portion'] [id^='result'], .view-pubFood .item[data-type='portion'] [id^='result']{margin-left: 40px;}
	.supplier-options ~ #view .item .removeItem ~ [id^='result'][data-type='import'], .supplier-options ~ #view .removeItem ~ [id^='result'][data-type='import'] {margin-left: 10px;}
	.view-pubFood .helpbtn, .view-actionReqF .helpbtn, .supplier-options ~ #view .helpbtn, .supplier-options ~ #view .incompatible:before {margin: 5px 5px 0px 0px !important; position:absolute; left:310px;}
	.supplier-options ~ #view:not(:has(.selectAllCheck)) .helpbtn, .supplier-options ~ #view .incompatible:before  {left:280px}
	.supplier-options ~ #view.view-food:not(.tableView) .helpbtn{left:347px;}
	.supplier-options ~ #view .result a.attachment {width: 18px; height: 18px; margin-left: -20px; margin-top: 5px;}
	.supplier-options ~ #view .result .aboveIncompatible + a.attachment {margin-top: -3px;}
	.folder:is([data-type="supply"], [data-type="allPubFood"], [data-type="cat"]) .supplier-options #folderPublishBTN {display: none;}
	.view-pubFood .helpbtn.on span, .view-actionReqF .helpbtn.on span, .view-food .helpbtn.on span, .view-recipe .helpbtn.on span, .view-supply .helpbtn.on span{ padding:15px 20px 30px 35px; width:350px;max-height: max-content;}
	.view-pubFood .helpbtn.on span li, .view-actionReqF .helpbtn.on span li, #view.tableView .helpbtn.on span li[data-rule]{padding: 4px 0px}
	.view-pubFood .helpbtn.warning{ color:var(--hcol); background:none; border:solid 1px var(--hcol);}
	.view-allPubFood .foodReqIcon{ background-color:var(--hcol); border:0; cursor:pointer;}
	.view-allPubFood .foodReqIcon:hover{ background-color:#50b2d9;}
	.view-pubFood .selectAllCheck,.folder[data-type="pubFood"] #folderPublishBTN,.folder[data-type="pubFood"] #selectSrc, .folder[data-type="catalogue"] #selectSrc, .view-actionReqF .selectAllCheck,.folder[data-type="actionReqF"] #folderPublishBTN{ display: block!important;}
	.view-pubFood #thumbsBTN,.view-pubFood #groupBTN, .view-actionReqF #thumbsBTN,.view-actionReqF #groupBTN{display: none;}
	.view-pubFood #footer,.view-pubFood .error.incompatible, .view-actionReqF #footer,.view-actionReqF .error.incompatible{display: none!important;}
	.view-detFood .detachedIcon,.view-actionReqF>div .foodReqIcon{display: none;}

	/* RECIPE ACTION REQUIRED FOLDER */
	.view-actionReqR .publishCheck, .folder:has(.supplier-options) .publishCheck:has(> .spinner)::before{display:none;}
	.view-actionReqR #addNewBtn,.view-actionReqR .item .editBTN{display: none;}
	.view-actionReqR .tableView .result,.view-actionReqR.tableView .result p{margin-left: 10px;padding-right:28px;}
	.view-actionReqR .helpbtn {margin: 5px 5px 0px 0px; position:absolute; left:280px;}
	.view-actionReqR .helpbtn.on span{ padding:15px 20px 30px 35px; width:350px;}
	.view-actionReqR .helpbtn.on span li{padding: 4px 0px}
	.view-actionReqR .helpbtn.warning{ color:var(--hcol); background:none; border:solid 1px var(--hcol);}
	.view-actionReqR .selectAllCheck { display: none!important;}

	/* .folder[data-type="actionReqR"] #folderPublishBTN, .folder[data-type="actionReqR"] #selectSrc { display: none!important; } */
	.view-actionReqR #thumbsBTN,.view-actionReqR #groupBTN{display: none;}
	.view-actionReqR #footer,.view-actionReqR .error.incompatible{display: none!important;}
	#results-foodSearch>div .recipeReqIcon {position: absolute; bottom: 3px; right: 0; margin-bottom: 0 !important; cursor: pointer; border: 0; margin: 5px;}

	#results-foodSearch>div.sel .recipeReqIcon {display: none; }
	#view.tableView.view-actionReqR .item span.helpbtn span{ position:absolute;}
	#view.tableView:is(.view-pubFood, .view-food, .view-recipe, .view-actionReqR, .view-actionReqF) .item span.helpbtn span{z-index:3;}

	/* FOODPRINT BADGES IN GROUPS*/
	#view.tableView .item .mon .counter.small,#view.tableView .item .mon .counter.fp_bg_water{left: 18px;}

	/* FIX FOR SCROLLING DURING DRAG */
	body.dragging .fixedHead, body.dragging .options, body.dragging .options *, body.dragging #footer{ pointer-events: none!important; }

	/* MENU DRAGGING */
	body.dragging.menuGroup #view.view-menu div.menuGroup, body.dragging.menuGroup #view.view-waste div.menuGroup { max-height: 0px; }
	body.dragging.portiondetail #view.tableView.view-menu .item.dragOver, 	body.dragging.portiondetail #view.tableView.view-waste .item.dragOver,
		.dragging.food #view.tableView.view-menu .item.dragOver, .dragging.food #view.tableView.view-waste .item.dragOver,
		.dragging.food #view.tableView.view-waste .unavailable_generalwaste.dragOver,
		.dragging.recipe #view.tableView.view-menu .item.dragOver, .dragging.recipe #view.tableView.view-waste .item.dragOver,
		.dragging.menuGroup #view.view-menu h5.dragOver, .dragging.menuGroup #view.view-waste h5.dragOver,
		.dragging.meal .mealHeading.dragOver:not(.dragging) td,
		.dragging.food .mealPlan tr[data-dragtype=food].dragOver td,
		.dragging.recipe .mealPlan tr[data-dragtype=food].dragOver td,
		#ingredientBody tr[data-dragtype=ingredient].dragOver td{ border-top: 2px solid var(--h3col); }
		.dragging #view.tableView.view-menu .item.mixedWaste-item{ border-top: 1px solid #EEE !important; }
		#view.view-menu .groupTotal.dragOver{border-top:none !important;}

	body.dragging.portiondetail #view.view-menu:not(.tableView) .item.dragOver, body.dragging.portiondetail #view.view-waste:not(.tableView) .item.dragOver,
		.dragging.food #view.view-menu:not(.tableView) .item.dragOver, .dragging.food #view.view-waste:not(.tableView) .item.dragOver,
		.dragging.recipe #view.view-menu:not(.tableView) .item.dragOver, .dragging.recipe #view.view-waste:not(.tableView) .item.dragOver { border-left: 2px solid var(--h3col); }

	body.dragging.portiondetail #view.view-menu .item *, body.dragging.portiondetail #view.view-waste .item * { pointer-events: none!important; }

	/* MP DRAGGING */
	/*.mealPlan .dummyTR td{ padding:0px; height:0px; border: 0px; max-height:0px; opacity:0; transition: max-height 300ms}*/
	.dragging.meal #mpTable { border-collapse: separate; }
	.dragging.meal tr:not(.mealHeading):not(.dummyTR) td { display:none; pointer-events:none;}
	.dragging.meal .mealfooter.dummyTR.dragDummy.o2.foodLevel td { display:none; pointer-events:none;}
	.dragging.meal .mealHeading td{border-bottom: solid 1px #DDD;}
	.dragging.meal .fixedHead{border-bottom: solid 1px #DDD!important;}
	.dragging.meal .mealHeading.dragging{filter:grayscale(); opacity: 0.5; transition: all 1s}
		.dragging .mealPlan .divMealHeader{pointer-events: none!important;}
	.dragging.meal .dragDummy:not(.foodLevel) td{ height: 50px; max-height: none; border-bottom: 0; background: none!important; opacity: 1}
	.dragging.meal .dragDummy.dragOver td{border-top: 2px solid var(--h3col);}

	/* LOG DRAGGING */
	.dragging.recipe #logtable tbody tr:not(.collector) td, .dragging.food #logtable tbody tr:not(.collector) td, .dragging.recipe #logtable tbody tr:not(.collector) th, .dragging.food #logtable tbody tr:not(.collector) th {display:none; pointer-events: none; }
	.dragging.recipe #logTableWrap>div.collector~#logtable tbody tr:not(.collector) td,.dragging.food #logTableWrap>div.collector~#logtable tbody tr:not(.collector) td, .dragging.recipe #logTableWrap>div.collector~#logtable tbody tr:not(.collector) th,.dragging.food #logTableWrap>div.collector~#logtable tbody tr:not(.collector) th{display:table-cell !important;pointer-events:all !important;}
	.dragging.recipe #logTableWrap>div.collector~#logtable tbody tr.collector~tr:not(.collector) td,.dragging.food #logTableWrap>div.collector~#logtable tbody tr.collector~tr:not(.collector) td, .dragging.recipe #logTableWrap>div.collector~#logtable tbody tr.collector~tr:not(.collector) th,.dragging.food #logTableWrap>div.collector~#logtable tbody tr.collector~tr:not(.collector) th{display:none !important;pointer-events:none !important;}
	.dragging.food #logTableWrap div.collector,.dragging.recipe #logTableWrap div.collector{display:block !important;pointer-events:all !important;}
	.dragging.food #logTableWrap div.collector:before,.dragging.recipe #logTableWrap div.collector:before{ content:''; position:fixed; right:0px; left: 250px; top: 70px; background:rgba(240,240,240,0.6); bottom:0; z-index:2; }
	.dragging.food #logTableWrap div.collector:after,.dragging.recipe #logTableWrap div.collector:after{ content:' DROP'; text-align:center; font-size:15px; font-weight:900; color:#666; border-radius:50%; border:solid 5px #DDD; width:120px; z-index:2; position:fixed; height:120px; line-height:150px; display:block;
		top:50%; left:50%; background:#FFF; margin:-60px; background-repeat:no-repeat; background-position:center 39px; background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='22px' height='22.9px' viewBox='0 0 22 22.9' xml:space='preserve'%3E%3Cstyle type='text/css'%3E	.st0%7Bfill:%23666666;%7D%3C/style%3E%3Cg%3E%3Cpolygon class='st0' points='17.1,12.4 17.1,0 4.9,0 4.9,12.4 0,12.4 11,22.9 22,12.4 '/%3E%3C/g%3E%3C/svg%3E"); transition:all 300ms}
	.dragging.food #logTableWrap div.collector.dragOver:after,.dragging.recipe #logTableWrap div.collector.dragOver:after{ color:var(--h3col); border-color:var(--h3col); transform:scale(1.1);  background-image: url("data:image/svg+xml,%3Csvg version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' width='22px' height='22.9px' viewBox='0 0 22 22.9' xml:space='preserve'%3E%3Cstyle type='text/css'%3E	.st0%7Bfill:%23FF6600;%7D%3C/style%3E%3Cg%3E%3Cpolygon class='st0' points='17.1,12.4 17.1,0 4.9,0 4.9,12.4 0,12.4 11,22.9 22,12.4 '/%3E%3C/g%3E%3C/svg%3E");}

		a.basketbtn { top:72px; position:fixed; z-index:5; box-shadow:2px 1px 6px #0005; opacity:0; pointer-events: none; transition: opacity 250ms 300ms, left 250ms 300ms; left:140px; margin-top: 2px;}
	.folder[data-type=menu] a.basketbtn { z-index: 4;}
		#view:not(.tableView) a.basketbtn.bluebtn { margin-top:8px }
	a.basketbtn.vis{ pointer-events: all; opacity:1; left:254px; }

	.view-menu .contextMenu.whiteback{ width:300px; font-weight: bold; padding:15px 10px; margin:50px 20px;}
	.view-menu .contextMenu.whiteback.on{margin-top:30px;}
	.view-menu .contextMenu.whiteback label{ line-height: 36px; padding:2px 10px; }
		.view-menu .contextMenu p{ margin:-45px 0px 20px 30px; font-weight: normal;}
			.view-menu .contextMenu p .ficon{ background-color:var(--h3col)!important; margin:2px 0}
			.view-menu .contextMenu p:after { content:'SELECT PORTIONS'; color:var(--hcol); display:block; text-align:center; font-size:10px; font-weight:bold; margin:20px 0 -20px; width:230px; }
		.view-menu .contextMenu.whiteback .circlebtn{position: absolute; bottom:5px; right:5px;}
		.view-menu .contextMenu.whiteback:before{margin-top: -25px}
		.view-menu .contextMenu .delbtn{margin-top: -15px;}

	/* END MENU V2 */
	.view-catalogue .contextMenu.whiteback{ width:300px; font-weight: bold; padding:15px 10px; margin:50px 20px;}
	.view-catalogue .contextMenu.whiteback.on{margin-top:30px;}
	.view-catalogue .contextMenu.whiteback label{ line-height: 36px; padding:2px 10px; }
		.view-catalogue .contextMenu p{ margin:-45px 0px 20px 30px; font-weight: normal;}
			.view-catalogue .contextMenu p .ficon{ background-color:var(--h3col)!important; margin:2px 0}
			.view-catalogue .contextMenu p:after { content:'SELECT PORTIONS'; color:var(--hcol); display:block; text-align:center; font-size:10px; font-weight:bold; margin:20px 0 -20px; width:230px; }
		.view-catalogue .contextMenu.whiteback .circlebtn{position: absolute; bottom:5px; right:5px;}
		.view-catalogue .contextMenu.whiteback:before{margin-top: -25px}
		.view-catalogue .contextMenu .delbtn{margin-top: -15px;}


/*attachments*/
#attachPanel {display: flex; align-items: start; gap: 20px; margin-top: 20px; padding:20px 10px 10px;}
	#attachPanelFiles > a { display:inline-block; padding:15px 10px; width:90px; white-space:normal; word-wrap:break-word; overflow:hidden; cursor:pointer; border-radius:15px; position:relative; font-size:10px; font-weight:bold; vertical-align:top; height:110px; text-align:center; }
	#attachPanelFiles > a:hover{ color: var(--hcol) }
	#attachPanelFiles > a .fileLabel{ cursor: inherit; }
		#attachPanelFiles > a small{font-weight: normal; cursor: inherit;}
		#attachPanelFiles a img, .attachPanelForm .fileIcon img, .sFileContainer img.sFileIcon{ width: 40px; height: auto; pointer-events: none;}
		#attachPanel .delbtn{position:absolute; right:5px; top:5px; }
		#attachPanel form .delbtn{right:0; top:0; }
		#attachPanel #file-input,.startscreen #attachPanel{ display: none; }

#attachPanelFiles {display: flex; flex-wrap: wrap; gap: 10px}
#attachPanel:has(.attachPanelForm) #attachPanelFiles {width: 390px;}
#attachPanel .attachPanelForm {position: relative; min-width: 0; width: calc(100% - 410px);}
#attachPanel .attachPanelForm.on .additemBtn {display: none;}
	.attachPanelForm form {display: flex; align-items: stretch; gap: 15px; padding: 20px; border-radius: 30px; max-height: 0; opacity: 0; transform: translateY(-10px); visibility: hidden;}
	.attachPanelForm.on form {max-height: 1000px; opacity: 1; transform: translateY(0); visibility: visible; transition: max-height 0.4s ease, opacity 0.3s ease, transform 0.3s ease;}
	.attachPanelForm .first {display: flex; flex-direction: column; justify-content: space-between;}
	.attachPanelForm .second {display: flex; flex-direction: column; min-width: 40%; width: 40%;}
		.attachPanelForm .second .fileLabel, .sFileContainer {display: flex; align-items: center; justify-content: center; margin-bottom: 2px; padding: 10px; height: 80px; border: 2px dotted #ddd; border-radius: 20px;}
		#attachPanelForm .second .fileLabel:hover { background:#EEE; }
		.attachPanelForm .second .fileInfo {display: none; flex-direction: column; width: 100%;}
		.attachPanelForm .second .fileIcon {position: relative; font-size: 4em; align-self: center;}
		.attachPanelForm .second .fileCount {position: absolute; top: 0; right: 0; padding: 2px 5px; color: white; border-radius: 30%; font-size: 10px; transform: translateX(40%);}
		.attachPanelForm .second .fileNames {display: inline-block; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}

/*drag/drop on folders*/
#tree0 li li strong{pointer-events:none;text-overflow: ellipsis;white-space: nowrap;max-width: 101%;overflow: hidden;}
	#tree0 li li.dragOver,#tree0 li li:has(>.foldername.dragOver){background-color:var(--hcol); color:#FFF;}
	#tree0 li li.dragOver li{ color:#444; background:none!important;}
	.item.dragging{opacity:0.7;filter: grayscale(1);  -webkit-filter: grayscale(1); }
	.dragging.food #view.view-food h5, .dragging.recipe #view.view-recipe h5, .dragging.menuGroup #view.view-menu h5{border-left:solid 3px var(--h3col);}
	.dragging.food #view.view-food h5.dragOver, .dragging.recipe #view.view-recipe h5.dragOver, .dragging.food .mealPlan .mealHeading .td-food.dragOver, .dragging.recipe .mealPlan .mealHeading .td-food.dragOver{ border-color: var(--h3col); color: var(--h3col); padding:15px 0 15px 30px; }
	.dragging.food #view.view-food.tableView h5.dragOver, .dragging.recipe #view.view-recipe.tableView h5.dragOver, .dragging.food .mealPlan .mealHeading .td-food.dragOver, .dragging.recipe .mealPlan .mealHeading .td-food.dragOver{ padding:7px 0 7px 30px; margin-top:0px;}
	.dragging.food #view.view-food h5.dragOver:before, .dragging.recipe #view.view-recipe h5.dragOver:before, .dragging.food .mealPlan .mealHeading .td-food.dragOver:before, .dragging.recipe .mealPlan .mealHeading .td-food.dragOver:before{content:'\2198'; margin:0px  3px 0 -16px; color:var(--h3col);}
	.tableView:not(.view-menu) .fixedHead+h5.dragOver {margin-top:-7px!important;}

	.dragging.menu li[data-dragtype="menu"].dummy { display: list-item!important; }
	.dragging.menu li[data-dragtype="menu"].dragOver, .dragging.menu li[data-dragtype="menu-dummy"].dragOver { border-top: var(--h3col) 3px solid; }

	.dragging.menuGroup #view.view-menu h5:first-of-type{margin-top: 3px;}
	.dragging.menuGroup #view.view-menu h5.dragDummy{display:inline-flex!important;}
	.dragging.menuGroup #view.tableView .menuGroup{display:none !important}


/* PROGRAMS */
#pane-maindiv.program{ padding-bottom: 55px; }/* padding for program note*/
.program.disabled #days .day h1, .program.disabled #days .day p, .program.disabled input, .program.disabled textarea{pointer-events: none!important;}
.program.disabled #days .day p{filter:grayscale(1);}
.program.disabled .binbtn, .program.disabled .editBTN, .program.disabled #addDayBtn{display: none!important;}

.program #mainnest, .program .options{width:calc(var(--scaled-width, 100vw) - 260px);}
.program #menuOptionsDrop{background-image:url(/media/icon-settings.png); background-position:center; background-repeat:no-repeat; aspect-ratio: 1 / 1;}
.program #menuOptionsDrop.sel:after{ content: '\23f7'; position: fixed; color: var(--h2col); font-size: 20px; margin: 18px -10px; z-index: 2; }
.program #menuOptionsDropSub:before{display:none;}

.program #menuOptionsDropSub .bluebtn{display:none;}
	.program #menuOptionsDropSub #pSettings .helpbtn{ margin: 0px -5px 0 -20px;}
	.program #menuOptionsDropSub #pSettings .spacer .helpbtn{position: absolute; left: 180px; top:60px}
	.program #menuOptionsDropSub #pSettings .helpbtn.mLeft span{margin: 9px 0 0 -170px;}
	.program #menuOptionsDropSub #pSettings {margin:0;}
	.program #menuOptionsDropSub label{width:fit-content}
	.program #menuOptionsDropSub #pSettings.program #menuOptionsDropSub #pSettings #cTracker {width: 165px;}
	.program #menuOptionsDropSub #pSettings div:last-child {width: 350px !important;}
	.program #menuOptionsDropSub #pSettings #cTrackers, .program #menuOptionsDropSub #pSettings div p.spacer+div{width:100% !important;}
.program #days .day p.intro {max-height:25px;}
.program .options .opt{margin-top:5px;height:32px;line-height:25px;}



.ogCard { border-radius:5px; padding:10px 15px 10px 20px; font-size:12px; font-weight:normal; border-left:0; border-right:0; position:relative; }
	.ogCard.active-state, .ogCard.active{border-color:var(--h3col);}
	.ogCard h6{color: #444; font-size: 18px; margin: 5px 0; font-weight: 900}
	.ogCard .img { width:120px; height:120px; margin:0 10px 0 -18px; float:left; position:relative; overflow:hidden; background-repeat: no-repeat; background-position: center top; background-size:cover; }
	.ogCard .img img{max-width:120px; max-height:120px; }
	.ogCard a { padding:7px 0 3px; color:var(--hcol); font-weight:bold; display:block; max-width:none; text-align:right; }
	.ogCard a:before{content:'\2197'; float: right; display: inline-block; font-weight: normal; color: #FFF; width: 20px; height: 20px; line-height: 20px; border-radius: 50px; background: var(--hcol); text-align: center; font-size: 14px; margin:-2px -13px 0 6px}
	.ogCard .description{margin-left: 112px;}


#attachGroups .newtracker{display:none;}
#pSettings{width:100%; border:0;}
	#pSettings .col3{ width: 100%!important; -webkit-column-gap: 110px; column-gap: 110px; padding: 10px 0px;}
	#pSettings #cTrackers{width:100%!important;text-align:center; padding: 10px 0px; line-height:15px;}
	#pSettings #cTrackers div{width:100%;border:0;}
	#pSettings #cTrackers div:first-child{max-height: 320px; overflow-y: auto;}
	#pSettings .lines{width:100%; margin: 10px 0px;}
	#pSettings .helpbtn {   margin: -2px -5px 0 -20px;}
	#pSettings .helpbtn.mLeft span{margin:24px 0 0 -170px;}
	#pSettings .circle span { font-size:9px; color:var(--hcol); text-transform:uppercase; font-weight:bold; overflow:hidden; text-overflow:ellipsis; width:100%; }
	#pSettings .circle svg { transform:rotate(-90deg); border-radius:50%; box-shadow:inset 0 0 0 4px var(--hcol); position:relative; width:60px; }
	#pSettings .circle.big { position:relative; display:inline-flex; margin:0px 2px; align-items:center; }

	#pSettings .circle.big.addbtn{top:-12px; margin:0 12px;}
	#pSettings .circle.big.addbtn svg{box-shadow: inset 0 0 0 4px #ccc; width: 40px;}
	#pSettings .circle.big.addbtn span { font-size:22px; color:#999999; line-height:13px; }
	#pSettings .circle.orange svg{box-shadow:inset 0 0 0 4px var(--h3col)!important;}
	#pSettings .circle.big span { line-height:9px; display:block; position:absolute; }


	#pSettings .circle.big.orange span {color:var(--h3col);}
	#pSettings .circle.big a{display:none;}
	/* #pSettings .circle a{color: #000;background: #ccc;opacity: 0.8;border:0;font-weight:bold;} */
	#pSettings .circle.big:hover a{ left:auto; right:3px; top:2px; -webkit-box-shadow:0px 0px 6px 0px rgba(0, 0, 0, 0.3); box-shadow:0px 0px 6px 0px rgba(0, 0, 0, 0.3); border:0; display:block; width:15px; height:15px; line-height:15px!Important; }
	#pSettings .circle.big.addbtn:hover svg {box-shadow: inset 0 0 0 4px #a3a3a3;}

#pSettings .circle.small{position:relative;margin:0px 5px;}
	#pSettings .circle.small span{position: relative; left: 4px;}
	#pSettings .circle.small svg{box-shadow: inset 0 0 0 2px var(--hcol); width: 15px;}
	#pSettings .circle.small.addbtn svg{box-shadow: inset 0 0 0 2px #ccc; }
	#pSettings .circle.small.addbtn span{ color:#999999; left:0px; font-size:10px; top:2px; position:absolute; text-align:center; }
	#pSettings .circle.small.addbtn:hover svg {box-shadow: inset 0 0 0 2px #a3a3a3;}
	#pSettings .circle.addbtn:hover span{color:#7a7a7a;}

		#pSettings .circle.small a{display:none; margin:4px 0; white-space: nowrap;}
	#pSettings .circle.small:hover a {  display:inline-block; width:11px; height:11px; position:absolute; left:2px; top:-1px; -webkit-box-shadow:0px 0px 6px 0px rgba(0, 0, 0, 0.3); box-shadow:0px 0px 6px 0px rgba(0, 0, 0, 0.3); border:0; line-height:10px!Important; font-size:7px; text-align:center;  border-radius:10px; }

	#pSettings>div{ float:left; border:0; margin-right:10px; width:170px; }
	#pSettings div{border: 0;}
	#pSettings>div:last-child{width: 320px;}
	#pSettings label:hover{color: var(--hcol);}
	.submenu #pSettings>div:last-child label{ margin-bottom: 5px;}
	#pSettings .small.addbtn{position: relative;}
	#pSettings .small.addbtn:after { content:'ADD'; font-size:10px; font-weight:bold; position:absolute; margin:1px 5px; }
	#pSettings .small.addbtn:hover:after{color: var(--hcol);}

#mainnest .program {white-space:normal;}
#days{padding:1px 5px;}
#days .day{ width:290px; background:#FFF; height:400px; display:inline-block; margin:3px; border-radius:25px;box-shadow:1px 1px 9px #BBB; padding:20px; vertical-align: top; box-sizing:border-box; overflow:hidden; position:relative;  overflow-y: auto; transition:width 300ms 50ms, height 300ms 50ms, border-left 200ms, opacity 300ms;}
	#days .day.on{transition:width 300ms 50ms, height 300ms 50ms, border-left 200ms, opacity 300ms, margin 300ms}
	#days .day .pillbtn{ margin: 10px -10px; width:70px;}
	#days .day h1 { margin:-15px -10px 5px; font-weight:900; font-size:12px; text-align:center; padding:6px 20px; letter-spacing:normal; }
		#days .day h1 span{font-size:8px; display:block; margin-bottom:-7px; letter-spacing: normal; pointer-events: none;}
		#days .day h1[draggable=true] { cursor:move; width:55px; height:38px; box-sizing:border-box; text-align:center; text-transform:uppercase; margin:-11px -20px 8px; background:#E9E9E9; border-radius:0 50px 50px 0; padding:2px 0 5px 0px; font-size: 18px; letter-spacing:-2px; border-left:solid 3px transparent; transition:all 300ms 50ms;}
	#days .day.on h1[draggable=true]{ color:var(--h3col);  background:#EEE; width: 70px;  transform:scale(1.1); margin-left:-17px;}
	#days .day:not(.on):hover h1[draggable=true]{color: var(--h3col);}
		#days .day h1[draggable=true].dragging{color: var(--hcol);}
		.progdaydrag .day.dragOver{border-left:solid 4px var(--h3col);}
		.progdaydrag .day .itemlist, .progdaydrag .day a, .progdaydrag .day h1:not(.dragging){pointer-events: none!important;}

	#addDayBtn{margin:80px 0 0 110px; color:#AAA; display:inline-block; vertical-align: top; text-align:center}
	#addDayBtn a { margin-bottom:3px; position:relative; display:block; }
	#days .day p{border:solid 1px transparent; border-left:0; border-right:0; font-size:11px; padding:5px;  border-radius:2px; transition:background 300ms}
		#days .day.on p{font-size: 13px; font-weight:normal; padding:8px 10px;}
	#days .day p:before, #days .day p:after{ content:''; display:inline-block; margin-right:4px; width: 16px; height: 16px; line-height: 16px; background:no-repeat center; background-size: contain; opacity: 0.4; vertical-align: middle; margin-top: -3px; /* filter:invert(100%) brightness(0.2) sepia(1) hue-rotate(140deg) saturate(20); opacity:1 */}
			#days .day p.intro:before{ content:none; background-image:url(/media/svg/nutico/frag#info); margin:-2px 7px -2px -4px; }
			#days .day p.heading:before{ content:none; }
			#days .day p.exercise:before{background-image: url(/media/svg/nutico/frag#exercise)}
			#days .day p.meeting:before{background-image: url(/media/svg/nutico/frag#meeting)}
			#days .day p.article:before{background-image: url(/media/svg/nutico/frag#article)}
			#days .day p.notification:before,#days .day p.nfOn:after{background-image: url(/media/svg/nutico/frag#bell)}
			#days .day p.form:before{background-image: url(/media/svg/nutico/frag#form)}
			#days .day p.meal:before{background-image: url(/media/svg/nutico/frag#food)}
			#days .day p.video:before{background-image: url(/media/svg/nutico/frag#video)}
			#days .day p.notification:before{background-image: url(/media/svg/nutico/frag#bell)}
			/* #days .day p.required:before{background-image: url(/media/svg/nutico/frag#stop)} */
			#days .day p.done:before{background-image: url(/media/svg/icons/frag#tick);}

		#days .day p:after{content:none; margin-right: 0; margin-left: 7px;}
			#days .day p.blocked:before{content:''; background-image: url(/media/svg/nutico/frag#hidden); filter: invert(100%) brightness(0.2) sepia(1) hue-rotate(140deg) saturate(20); opacity:1;/*  filter:invert(100%) brightness(0.5) sepia(8) hue-rotate(-10deg) saturate(20); */}
			#days .day p.sticky:after{content:''; background-image: url(/media/svg/nutico/frag#pin); background-size: 15px;}
			#days .day p.nfOn:after{content:''; margin-right: 0; margin-left: 7px;background-size: 15px;}
			#editProgItemForm input#sticky+label:before { content:''; background:url(/media/svg/nutico/frag#pin) no-repeat center; background-size:19px; margin-right:5px; opacity:0.3; transition:opacity 300ms; width:30px; height:30px; box-sizing:border-box; }
			#editProgItemForm input#sticky:checked+label:before{ opacity:1; filter:invert(100%) brightness(0.5) sepia(8) hue-rotate(-10deg) saturate(20); }

		#days .day p.done{text-decoration: line-through;}
		#days .day p.blocked{color:#CCC!important}
		#days .day p.blocked:after{opacity: 0.15;}
		#days .day p.heading { text-align:center; padding:3px; margin-top:10px; margin-bottom: 1px;font-weight:bold; text-transform:uppercase; font-style:normal; font-size:10px; background:#EEE; }
			/* #days .day p.heading:before, #days .day p.heading:after{content:' ● '; margin: 0; opacity: inherit; color: inherit!important; font-size: 7px} */
		#days .day.on p.heading{ padding:3px; }
		#days .day p.intro { font-style:italic; cursor:text; font-weight:bold; font-size:12px; width:53%; padding:9px 0; position:absolute; top:11px; margin-left:40px; background-color: transparent!important; transition:margin-left 300ms 50ms; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; display:-webkit-box; -webkit-box-orient:vertical; max-height:20px; }
			#days .day p.intro .grey{color: #CCC; pointer-events: none; }
			#days .day.on p.intro{margin-left: 70px; font-size: 13px;}
		#days .day p:not(.dragDummy):hover{ background-color:#EEE; opacity: 1}
		#days .day p:not(.intro).dragOver, .opt.dragOver:not(.mealHeading){border-top:solid 2px var(--h3col);}
		#days .day p.dragging{background:#EEE; color:var(--hcol); border-color:transparent!important}
	#days .day p.editable{color:var(--hcol);}
		/* #days .day:not(.on) p.editable{font-weight: bold;} */
		#days .day p.editable.heading{color: var(--h2col)}
		#days .day p.editable:before{filter: invert(100%) brightness(0.2) sepia(1) hue-rotate(140deg) saturate(20); opacity:1;}

		#days.custom .day h1{pointer-events: none;}
	.itemlist p.dragDummy:nth-child(2){height:270px;}


#days .circlebtn{ font-size: 18px; background-color:#CCC;}
	#days .circlebtn:hover{background-color:#999;}
	#days .circlebtn:active{background-color:var(--h3col);}
	#days .day .circlebtn,.day .binbtn{ transform:scale(0.5); opacity:0; pointer-events:none; transition:transform 300ms, opacity 300ms, background-color 250ms; float: right; position:static; margin:-12px -6px;}
	#days .day:hover .circlebtn, .day:hover>.binbtn, p:hover .binbtn{transform:scale(0.85); opacity:1; pointer-events:all;position: relative; z-index: 10;}/*AUG22 17820 added position and z-index to put buttons on top of .intro*/
	#days .day:hover .circlebtn{z-index: 0;}
	.day:hover>.binbtn, p .binbtn:hover{transform:scale(1);}
	#days :not(.day) .circlebtn{ background-color:#999;}
	#days :not(.day) .circlebtn:hover{ background-color:var(--h2col);}
	#days .day#profiles .circlebtn{pointer-events:all;}
	#days .day.on .circlebtn,.day.on .binbtn{margin-left: 5px;}


.day .delbtn{margin-left: 7px;}
	/* .day:not(.on) .daymenu:not(.restoreBtn){ display: none; } AUG22 17820 changed selector to hide only the delete button*/
	.day:not(.on) .daymenu.binbtn{ display: none; }
	.day:not(.on) .daymenu.restoreBtn{ margin-left: 5px !important; }/*AUG22 17820 added margin left to distantiate the buttons*/
	#days .day#profiles .circlebtn{transform:scale(0.5); opacity:0;}
	#days .day#profiles div:hover .circlebtn{transform:scale(0.7); opacity:1;}
	#days .day#profiles div:hover .circlebtn:hover{background-color:rgba(0,0,0,0.3);}


.day.copyto h1 { color:#fff!important; background:var(--h3col)!important; opacity:1; border-left-color:#666666!important; }
.day.copyto h1 span{opacity:1!important;}
.copyto a,.copyto .itemlist,.copyto h1{pointer-events:none!important;}

#setup{ float:left;}
	#setup:after, .disabled .day:after{content:'';}
	#setup h1{float: none; }
	#days .spacer{margin-top:10px;}
	#days .day.on { width:auto; height:auto; overflow-y:auto; overflow-x:hidden; position:fixed; left:555px; right:10px; z-index:1; top:78px; margin:0; bottom:10px; }

	/* #days .day.on { width:auto; height:auto; overflow-y:auto; overflow-x:hidden; position:fixed; left:calc(100vw - 260px); z-index:1; top:calc(100vh - 310px); margin:calc(-100vh + 388px) calc(-100vw + 768px); width:calc(100vw - 515px); height:calc(100vh - 87px); } */

	#setup:not(.on) input[type=checkbox]:not(:checked)+label{ display:none; }
		#setup:not(.on) :not(.lines) label{display:inline; font-size:11px; color:#666; line-height: 100%}
		#setup:not(.on) :not(.lines) label:before{content:none;}
		#setup:not(.on) :not(.lines) label:after{content:', ';}
		#setup:not(.on) .spacer{padding:3px; margin:10px 0 5px}
		#setup:not(.on) .spacer span{display:none;}
		#setup:not(.on) .col2, #setup:not(.on) .col3{column-count:auto;}
		#setup:not(.on) .lines label{ padding:0; border:0; line-height:100%; margin-bottom:10px; color:#777}
		#setup:not(.on) .lines label span{display:none;}
		#setup:not(.on) .lines label:before{ width:16px; height:16px; line-height:16px; margin-right:5px; background:#AAA}
		#setup:not(.on) .lines .spacer{margin-bottom:10px;}
		#setup.on h1{ font-size:18px;}

#profiles.day{background:#666; color:#FFF; text-align: center;}
	#profiles h1{background: #777;}
	#profiles div{text-align: left; padding: 12px 5px 12px 20px; margin:2px 0; transition: background 300ms}
	#profiles div:hover{background: #0003;}
	#profiles div:not(.footer):active{background: var(--h3col); color: #FFF;}
	#profiles div.on{background:var(--h2col);}
	#profiles div.on:after { content:""; width:0; height:0; border-style:solid; border-width:6px 0 6px 5px; border-color:transparent transparent transparent #FFF; position:absolute; right:7px; }
	#profiles>div:last-of-type{margin-bottom: 10px;}
	#profiles div.flashing{background: #555; font-weight: bold; }
	#profiles .footer{background: #555; position: absolute; bottom:0; left:0; right: 0; margin: 0!important}
	#profiles .footer .greybtn { margin:-5px -12px; }
	#profiles .delbtn{ display:inline-block; margin:-3px 3px; color:#FFF;}
	#profiles div.client svg{ vertical-align:text-top; margin-right:2px; width:14px; margin-left:2px;}
	#profiles div .helpbtn{margin: -4px 3px;}
	#profiles .additemBtn{margin-top: 16px;}
	#profiles #recent { position:absolute; bottom:0; padding:3px 20px; margin:0!important; left:0; right:0; background:#0002; }
		#recent .smallText{ position:absolute; top:-15px; left:20px;}
		#recent div{ padding:13px 20px;}

	#profileForm ::placeholder{font-size: 14px; font-weight: normal;}
	#profileForm div.headingText{margin: 25px 0;}
	#profileForm .spacer{background: none; margin: 10px 0 0;}
	#profileForm label:not(.third){margin-top:5px;}
	#profileForm p:not(.on){display: inline;}
	#profileForm p:not(.on) label:not(.greyback){display:none;}
	#profileForm p:not(.on) label.greyback{width:auto!important; margin: 2px; padding: 2px 23px;}
		#profileForm p.on label.greyback{position: relative;}
		#profileForm p.on label.greyback:hover:after{content:'x'; display:inline-block; position: absolute; right:3px; top:6px; text-align: center; font-size: 10px; width: 18px; height:18px; line-height: 16px; border-radius: 20px; background:#FFF;}
	#profileForm p:not(.on) input,#profileForm p:not(.on) .iblock, #profileForm p:not(.on) select{display: none !important;}
	#profileForm .iblock{margin-left: 10px}

#days .day#overview { background: #EEE; box-shadow: none; padding:20px 10px; position:fixed; z-index:1; left:255px; top:50vh; opacity:0; pointer-events: none; margin-top: 100px; transition:opacity 300ms 200ms, margin-top 300ms 200ms; }
	#overview h1{margin-bottom: 10px!important; border-bottom: solid 1px #DDD;}
	#overview>span{display: inline-block; width:26px; height: 26px; line-height: 26px; background: #DDD; font-weight: 900; border-radius: 50px; margin: 3px; text-align: center; transition: background 300ms}
	#overview>span:hover{background-color: #CCC; color: var(--hcol)}
	#overview>span.on{background-color: var(--h3col); color: #FFF;}

#days.on .day#overview{ opacity:1; pointer-events: all; margin-top: 0;}
	#days.on .day#profiles{ position: fixed; top: 75px; left:255px; }
	#days.on .day:not(#profiles):not(.on):not(#overview){opacity:0; pointer-events: none;}
	#days.on .day#profiles, #days.on .day#overview{height: calc(50vh - 90px);}
	#days #profilesMarker{display: none;}
	#days.on #profilesMarker{display: inline-block;}

.followUp{ padding:0px!important; }
	.followUp h1{ padding:15px 15px!important; margin:0!important; text-transform: uppercase; }
	.followUp label{ padding:8px 15px 8px 15px; border-top:dotted 1px #CCC; font-size:14px!important; box-sizing:border-box; min-height:55px; display:block; line-height:41px; }
	.followUp label:hover{ background:#FFF }
	.followUp textarea{ background:#FAFAFA; width:100%; height:175px; border:0; padding: 15px; border-top: dotted 1px #CCC; }
	.followUp label input{ display:inline-block; width:45px; text-align:center; height:45px; font-size:18px; font-weight:bold; color:var(--h2col); background:#e9e9e9; border:solid 1px transparent; margin:0px 10px 0px 10px; }
	.followUp .bluebtn{padding:0px 20px; height:30px; line-height:30px; display:inline-block; margin-top:6px; opacity: 1!important; pointer-events: all!important;}

 .bigIconMenu [data-type] .img{background-size:50px; filter:invert(100%) brightness(0.18) sepia(1) hue-rotate(142deg) saturate(17); height: 80px; }
  .bigIconMenu [data-type]:hover .img{ filter:invert(100%) brightness(0.2) sepia(1) hue-rotate(142deg) saturate(20);}
	 .bigIconMenu [data-type=heading] .img{background-image:url(/media/svg/nutico/frag#heading)}
	 .bigIconMenu [data-type=exercise] .img{background-image:url(/media/svg/nutico/frag#exercise)}
	 .bigIconMenu [data-type=meal] .img{background-image:url(/media/svg/nutico/frag#food)}
	 .bigIconMenu [data-type=meeting] .img{background-image:url(/media/svg/nutico/frag#meeting)}
	 .bigIconMenu [data-type=article] .img{background-image:url(/media/svg/nutico/frag#article)}
	 .bigIconMenu [data-type=form] .img{background-image:url(/media/svg/nutico/frag#form)}
	 .bigIconMenu [data-type=video] .img{background-image:url(/media/svg/nutico/frag#video)}
	 .bigIconMenu [data-type=notification] .img{background-image:url(/media/svg/nutico/frag#bell)}

	#editProgItemForm .bigIconMenu{ margin-bottom:0; }
	#editProgItemForm #typeLink{margin:-65px -50px;z-index:1;}
	#editProgItemForm .footer .bellbtn>svg{opacity:0;}
	#editProgItemForm .footer .bellbtn:before{margin-right: -15px;margin-left: 0px;}
	#typeLink{ position:absolute; line-height: 30px; margin:-45px -50px; border-radius:20px 50px 50px 0; padding: 5px 20px 5px 50px}
		#typeLink:before{ content:'▼'; float:right; margin:0 -10px 0 10px; font-size: 80%}
		#typeLink:after { content:''; width:42px; height:36px; position:absolute; background-size:20px; left:-1px; margin-top:-3px; filter:invert(1); background-repeat:no-repeat; background-color:#dd9761; background-position:40%; border-radius:0 50px 50px 0; }
		#typeLink[data-type='intro']:after{ content:none; background-image:url(/media/svg/nutico/frag#info); margin:-2px 7px -2px -4px; }
		#typeLink[data-type='heading']:after{ background-image: url(/media/svg/nutico/frag#heading) }
		#typeLink[data-type='exercise']:after{background-image: url(/media/svg/nutico/frag#exercise)}
		#typeLink[data-type='meeting']:after{background-image: url(/media/svg/nutico/frag#meeting)}
		#typeLink[data-type='article']:after{background-image: url(/media/svg/nutico/frag#article)}
		#typeLink[data-type='notification']:after{background-image: url(/media/svg/nutico/frag#bell)}
		#typeLink[data-type='form']:after{background-image: url(/media/svg/nutico/frag#form)}
		#typeLink[data-type='meal']:after{background-image: url(/media/svg/nutico/frag#food)}
		#typeLink[data-type='video']:after{background-image: url(/media/svg/nutico/frag#video)}
		#typeLink[data-type='notification']:after{background-image: url(/media/svg/nutico/frag#bell)}
	#editProgItemForm.on .bigIconMenu>div,
		#editProgItemForm.on .bigIconMenu h5,
		#editProgItemForm:not(.on)>*,
		#editProgItemForm:not(.on) .footer,
		#editProgItemForm:not(.on) #typeLink{display:none;}
	#editProgItemForm:not(.on) .bigIconMenu{display: block;}
	#editProgItemForm.on .bigIconMenu{text-align: left; margin:50px 0;}
	.bigIconMenu [data-type=intro]{display:none;}
	#editProgItemForm .footer{margin-top: 10px;padding: 20px 0;}
		#editProgItemForm .footer label{line-height: 36px; display: inline-block; padding:0 10px 0 0;}
		#editProgItemForm .footer .binbtn{margin:0 10px 0 -5px;}
	#editProgItemForm, #editProgItemForm label { font-size:11px; }
	#editProgItemForm #progNotification { display:inline-block; opacity:1; overflow:hidden; border-radius:25px; width:0px; height:40px; position:relative; transition:all 0.3s; height:180px; margin-top:-140px; padding-right:0px; box-shadow:1px 1px 20px rgba(0,0,0,0.6); z-index:1; margin-bottom:-40px; }
		.notification-pdForm #progNotification,.notification-pdForm .bellbtn{display:none;}
		#progItemPreview{display: inline-block;width: 100%;}
			#progItemPreview .itemSummary{height: 115px;}
			#progItemPreview .itemSummary .foodphoto,#progItemPreview .itemSummary .recipephoto,#progItemPreview .itemSummary .cardphoto {border-radius:50px;}
			#progItemPreview .itemSummary .editBTN{top: -40px !important;}
			#progItemPreview #attached .delbtn{margin: 5px !important;}
			#progItemPreview .itemSummary h1{font-size:2em;float: left;}
			#progItemPreview .itemSummary .resultDetail strong {margin-left: -5px;margin-top: -5px;float: left;width: 86%;}
			#progItemPreview .itemSummary .resultDetail em {margin-left: 350px;max-width: 150px !important;}
			#progItemPreview .itemSummary .resultDetail .monitors {margin-top: -5px;display: block;margin-left:91px;}
			#progItemPreview #attached .itemSummary .resultDetail .monVals.monitors {margin-top: -5px;}
		#editProgItemForm #progNotification.on { width:400px; padding-right:10px; }
		#editProgItemForm #progNotification div { width:403px; background:#FFF; position:relative;  padding:15px 20px; box-sizing:border-box; height:180px; border-radius: 2px}

		#editProgItemForm #progNotification div:before { content:''; position:absolute; right:-9px; border-top:6px solid transparent; border-bottom:6px solid transparent; border-left:6px solid var(--h3col);  bottom:37px; }
		#editProgItemForm #progNotification #n-hrs{text-align: right;}
		#editProgItemForm #progNotification #n-hrs,#editProgItemForm #progNotification #n-mins{ display:inline-block; width:50px; height:33px; font-weight: bold;}
		#editProgItemForm #nfTime { margin-top:12px; right:220px; position:absolute; }
		#editProgItemForm #progNotification.disabled+#nfTime{display: none;}
		#editProgItemForm .nfOn:before{opacity: 1;filter: invert(100%) brightness(0.5) sepia(8) hue-rotate(-10deg) saturate(20);}
		#editProgItemForm .nfOn{opacity: 1;}
		#editProgItemForm #progNotification select{ width:43px; display:inline-block; max-height:33px; height:33px; line-height:32px; font-weight: bold;}
		/* #editProgItemForm #progNotification input { width:145px; position:absolute; margin-top:3px; } */
		#editProgItemForm #progNotification input:last-child{ margin-top:7px; }
		#editProgItemForm #progNotification span{position:absolute; font-size:18px; font-weight:bold; color:#888; top:22px;}
		#progNotification label[for=notify]{pointer-events: all!important; font-size:14px; font-weight:bold;}
		#progNotification.disabled .delbtn{display: block!important; pointer-events: all !important}

	#popbox.disabled #editProgItemForm .footer .binbtn, #popbox.disabled #editProgItemForm .footer .bellbtn{display:none;}
	#popbox.disabled #editProgItemForm input, #popbox.disabled #editProgItemForm label{pointer-events:none;}
	#popbox.disabled #editProgItemForm #typeLink { display: inline-block!important; pointer-events: none; }
	#popbox{overflow-y:auto;}
	#pdMsg{position:relative;}
	#pdMsg textarea{height: 240px;}
	#editProgItemForm .libbtn { margin-top: -60px; }
	#editProgItemForm .libbtn svg { margin: 0 5px 0 -15px; width: 16px;}
	#editProgItemForm #formbody .starcheck {z-index: 1;position: absolute;right: 10px;top: 14px;}

		.starcheck{display:inline-block; visibility:hidden; }
		.starcheck input[type=checkbox]{display:block!important; cursor:pointer; width:22px; height:22px;font-size:22px;}
		.starcheck input[type=checkbox]:before { content:"\2605"; color:#AAA; visibility:visible; transition:color 300ms;}
		.starcheck input[type=checkbox]:hover:before{color:#777}
		.starcheck input[type=checkbox]:checked:before{ color:var(--h3col) }
		#formbody #attached{position: relative;}
			#formbody #attached .delbtn{position:absolute; right:0;}
		#editProgItemForm[data-type=heading] .starcheck{display: none;}
		#editProgItemForm .nicEdit-body{margin-left:0px;min-height: 150px!important;}
		#editProgItemForm #meetingapps{height:125px}
	/* #attached:not(:empty)+#urlbtns.on{ display: none;} */
	#urlbtns{margin: 10px 0 20px; display: none;}
		#urlbtns.on{display: block;}
		#urlbtns.on+label{display: none;}
		#urlbtns a{margin-right: 2px;}
		#editProgItemForm:not([data-type='meal']) #pdUrl .blueline{display: none;}
	#meetingapps{background:url('/media/icons-videocalls.png') no-repeat; background-size: 99%;height:140px; transition:opacity 1000ms; margin-bottom:20px}
	#meetingapps.on{display: block;}
	#meetingapps a{float:left; height:125px; width: 16%; border-radius: 15px; margin-left: 4px;}
	#meetingapps a.active{box-shadow: 0px 1px 20px 0px #AAA; transform: scale(1.05); transition: transform 300ms; color:var(--hcol);}
	#meetingapps a span{display: block;	position: relative;	top: 100px;}
	#starthelper:not(.on){display:none;}
		#starthelper.on+#formbody{display: none;}
		#starthelper h4{border-bottom: solid 1px #DDD; padding: 10px 0; margin: 0;}
		#starthelper p{padding:10px; border-bottom:solid 1px #DDD; font-size: 12px; font-weight: bold;}
		#starthelper p:hover{background:#EEE;}
		#starredItemList{margin:0 0 20px;}
			#starredItemList p a{opacity:0; pointer-events:none; transition:opacity 400ms; margin:-6px;}
			#starredItemList p:hover a{opacity:1; pointer-events:all;}
			#starredItemList:empty:before{ content:'Star items to have them appear here'; text-align:center; font-weight:900; color:#CCC; padding:20px 0; display:block; font-size:16px; font-style:italic}
			#starredItemList .starcheck{  margin-top: -3px; }
#progNote{ background:#FFFFDD; padding:10px 15px 10px 15px; position:fixed; border-radius:2px; bottom:0px; right: 0; left: 250px; height: 30px; line-height: 30px; z-index: 1; border-top: solid 1px #0002; }

.col2{column-count:2;}
.col3{column-count:3}

.progPrev{height: 515px; width: 350px; margin: -35px -50px -53px; border:0;}


/*//////////////////////////////////////// ORDERING ////////////////////////////////////////*/
#pane-maindiv.maximised.orders{box-sizing: border-box;}
#pane-maindiv.maximised.orders #mainnest{ max-width: calc(var(--scaled-width, 100vw) - 200px);}
#pane-maindiv.maximised.orders .searchdiv.on{margin-left: 180px}
.options .searchdiv{width: 280px; position:relative; padding-left:40px; display:inline-block; background:transparent; z-index: 1;transition: margin-left 300ms;margin-left: 0px;}
	.options .searchInput{width:275px; padding-left:40px; background-image:url(/media/icon-search.png); background-repeat:no-repeat; background-position:15px center; }
		#ordSearchInput.disabled{color:#555!important;}
	.options .searchNameCont { background-color:#FFF; z-index:1; position:absolute;  display:none; cursor:text; }
	.options .searchNameCont.on{display: block;}
		.options .searchNameCont.white{border-color: #FFF;}
	.options .searchDrop{width: 500px; border-radius:0 2px 30px 0}
	.options .savedSearches{ background: #F9F9F9; border-radius:20px 0 0 30px; position: absolute; transform: translateX(-100%); box-shadow:-5px 4px 8px -2px #777; }
	.options>.roundbtn { margin:2px 1px!important; height:36px; width:36px; }
	.options .roundbtn:active, .options .roundbtn.on{background-color:var(--h2col)}
	.pane.orders .searchInput, .pane.folder .options.supplier-options .searchInput{padding-right: 54px; margin-left:5px;opacity:1 !important}
	.pane.orders .searchInput:not([value=""])+a{display: block;}
	.options #import{ padding:0 20px; }
	.thumbsbtn{background-image: url(/media/icon-thumbs.png);background-position: center;background-repeat: no-repeat;}
	.roundbtn.restoreBtn{margin:6px 22px;}

	/* .pane.orders .roundbtn.editBTN {position: absolute;margin: -46px 0 0px 4px;} */
	.pane.orders #LTtabs{ margin-top:-2px}
		.pane.orders #LTtabs .tabmenu>a{ color:var(--hcol);}
		.pane.orders #LTtabs .tabmenu>a.on{ color:#FFF;}
	.pane.orders .class{margin-right: 5px;}
	.pane.orders{ background:#FAFAFA; overflow-x: hidden!important; }
	.pane.orders .options .searchDrop, .pane.folder .options.supplier-options .searchDrop{top:40px}

	#LTtabs{ display: inline-block; vertical-align:middle;}
		#LTtabs .tabmenu{border: 0; background: transparent; text-align: center; z-index:2; position:relative; display: inline-flex;}
		#LTtabs>.tabmenu>a { font-size:16px; text-transform:none; border-radius: 50px; }
		.orders #LTtabs .tabmenu a{padding:5px 20px 7px; line-height:14px;}
			#LTtabs>.tabmenu>a:not(.on){background: transparent; color: #444 }
			#LTtabs .tabmenu>a.on{background:var(--h2col)}
			#LTtabs .tabmenu>a:not(.droparrow):not(.selected).on:after { content:'\23f7'; position:absolute; color:var(--h2col); bottom:-8px; left:50%; margin-left:-7px; font-size:17px; }
				#LTtabs .tabmenu>a>b{ display: block; color: #444; font-size: 8px}
				#LTtabs .tabmenu>a.on>b{ color: #FFF}
		#LTtabs .tab{ position: absolute; width:300px; transform:translate(-10px,40px); box-shadow:1px 2px 7px rgba(0,0,0,0.6); border-radius:30px; text-align: center; padding-bottom: 40px; }
			#LTtabs .tab h5{margin: 10px; font-size:15px; }
			#LTtabs .tab>.delbtn{ margin: 15px 15px 0 -30px }
			#LTtabs .tab .roundbtn{ background: #444; border-radius: 50px; padding: 7px; color: #FFF; margin: 5px; line-height: 100%; margin-right:-40px;}
			#LTtabs .updownbox span.largeText{ display: inline-block; width: 70px}
			#LTtabs .updownbox {margin-top: -10px;}
		#tab-AdvancedSearch.on{border-radius: 50px;}
	#orderSearchDrop{padding:0px}
	.searchdiv.on #orderSearchDrop{padding: 0px 0px 10px 0px; font-weight:bold; color:#555; border-top: solid 3px var(--h3col);}
		.savedSearches .star:before{ float: right;}

		#orderSearchDrop.on{height: 300px;}
		#orderSearchForm{padding:10px;}
		#orderSearchDrop .advAllergens .selected{text-overflow: inherit;}
		#orderSearchDrop .advAllergens .alr,#orderSearchForm [data-multiSelect="1"] .alr, #clientDetails #clinicalPanel .half .select .selected .alr,#menuSearchDrop [data-multiSelect="1"] .alr{padding:4px 9px!important; color:#fff!important; margin-right:4px; position:relative; top:-1px; border-radius:30px; font-style:normal;}
		#orderSearchDrop .pillbtn.blue{padding-left: 22px}
		#orderSearchDrop .row{height:100%; margin:0;z-index: 2;}
		#orderSearchDrop .col{position: relative;float:left;width:50%;padding: 0; height:50px; }
		#menuSearchDrop .col{position: relative;float:left;width:100%;padding: 0; height:50px; }
		#orderSearchDrop .col > svg, #orderSearchDrop .col > span,#menuSearchDrop .col > svg{position:absolute; width:18px; left:5px; color:#777; z-index:1; top: 50%; transform: translate(50%, -50%);}
		#orderSearchDrop .select,#menuSearchDrop .select{ height:48px; line-height:48px;}
		#orderSearchDrop .select .selected:not(.flatpickr-calendar .selected), #menuSearchDrop .select .selected:not(.flatpickr-calendar .selected){ padding-left: 40px; }
			#menuSearchDrop .select .selected:not(.flatpickr-calendar .selected){margin-right:10px;}
			#orderSearchDrop .select .selectdrop:after,#menuSearchDrop .select .selectdrop:after{content:attr(data-empty); text-align:center; display:block; font-size:10px; font-weight:900; color:#CCC;}
			#orderSearchDrop .selected span, #clientDetails #clinicalPanel .half .select .selected span{color:var(--hcol); font-weight:bold; font-size:11px; line-height:48px;}
			#orderSearchDrop .selectdrop .spacer,#menuSearchDrop .selectdrop .spacer{ margin-top:10px; }
			#orderSearchDrop input:not(.cur-year){/* padding:20px 8px; */ margin:0; }
		#orderSearchDrop .osInput{ height: 48px; padding-left:40px; }
			#orderSearchDrop input::-webkit-input-placeholder{ text-transform: uppercase; color: #AAA; font-weight: 900; font-size: 10px; padding: 0;}
			#orderSearchDrop input#from{border-radius:50px 0 0 50px; border-right:0;}
			#orderSearchDrop input#to{border-radius:0 50px 50px 0; border-left:0; padding-left:10px;}
		#orderSearchDrop label:not(.toggle):hover{border-color: #ddd;background: transparent!important}

		#orderSearchDrop .timeFrom, #orderSearchDrop .timeTo{ width:25%;}
		/*#orderSearchDrop .timeFrom::after{display:none;}
		#orderSearchDrop .timeFrom:hover::after{z-index: 2; }
		#orderSearchDrop .timeTo::after{ content:"▼"; color:#888; font-size:8px; padding:0 5px; position:absolute; right:0; top:0px; height:100%; transition:background 300ms;}
		#orderSearchDrop .specificdateLabel::after,#orderSearchDrop .daysoffsetLabel::after{content:"▼"; color:#888; font-size:8px; padding:0 5px; position:absolute; right:0; top:0px; height:100%; transition:background 300ms; } */

		#orderSearchDrop #dueDate{cursor: pointer;}
			#orderSearchDrop #orderDate .flatpickr-calendar{ margin: 39px -12px;}
			#orderSearchDrop #orderDate .col{width:100%;}
			#orderSearchDrop #orderDate .daysoffsetLabel{display: none;}
			#orderSearchDrop #orderDate.daysoffset .daysoffsetLabel{display: block;}
			#orderSearchDrop #orderDate.daysoffset .specificdateLabel{display: none;}
			#orderSearchDrop #orderDate .daysoffsetLabel{top:0px; position:absolute; left:1px;}
			#orderSearchDrop #orderDate.daysoffset #orderDateDrop{height: 144px;}

			/* #orderSearchDrop #orderDate .col.on{display: block;} */
			/* #orderSearchDrop #orderDate #offsetDateMode+label { position:absolute; z-index:9; top:343px; background:#EEE; width:318px; padding:5px 10px; border-radius:0px 0px 5px 5px;display: none;}
			#orderSearchDrop #orderDate #offsetDateMode+label:hover{ background: #EEE!important; } */
			#orderSearchDrop #orderDate .col { width:100%; }
			/* #orderSearchDrop #orderDate .dueDate{z-index: 3;} */
			/* #orderSearchDrop #orderDate.on #offsetDateMode+label{display: block;}
			#orderSearchDrop #orderDate.offsetLabel.on #offsetDateMode+label{width:187px; top:120px;} */
			#orderSearchDrop #orderDate .updownbox, #insightsOffset.updownbox{ text-align: center;}
			#orderSearchDrop #orderDate .updownbox span, #insightsOffset.updownbox span{ display:block; width:55px; margin:0 auto; padding:0; background:#EEE; height:20px; line-height:20px; border-radius:8px; text-transform:uppercase; font-size:10px; font-weight:bold; color:#666;  margin-top:10px; margin-bottom:-5px;}
			#orderSearchDrop #orderDate .updownbox input, #insightsOffset.updownbox input{width:25px; border:none; font-style:normal; font-weight:bold; text-align:center;}
			#orderSearchDrop #orderDate .updownbox #dOWrapper, #insightsOffset.updownbox #dOWrapper{display: inline-block;width:75px;color:var(--hcol); font-weight: bold;}
			/* #orderSearchDrop #orderDate .updownbox #dOWrapper::after{ content:'days'; display:inline-block; font-style:normal; font-weight:bold; color:var(--hcol); text-align:right; margin-left:4px;} */
			#orderSearchDrop #orderDate .updownbox .whitebtn, #insightsOffset.updownbox .whitebtn{background: #FFF}
			#orderSearchDrop #orderDate .updownbox .whitebtn:hover, #insightsOffset.updownbox .whitebtn:hover{background: var(--h2col);}
			#orderSearchDrop #orderDate .updownbox .pillbtn, #insightsOffset.updownbox .pillbtn{position:absolute; bottom:5px; right:10px;}

			/* #orderSearchDrop #orderDate.offsetLabel .updownbox {display: block; border-right: 0px;}
			#orderSearchDrop #orderDate.offsetLabel .dueDate{display: none;}
			#orderSearchDrop #orderDate.offsetLabel.on .selectOption{padding:15px 26px 38px 26px} */

		#orderSearchDrop #orderDateDrop { position:absolute; width:318px; z-index:5; top:45px; height:342px; border-radius:25px; overflow:hidden; box-shadow:0px 1px 6px rgba(0,0,0,0.5); display: none;background: #FFF;}
		#orderSearchDrop #orderDateDrop.on{display: block}
			#orderSearchDrop #orderDateDrop .tabmenu{background:#EEE; padding: 0; height: 43px; text-align:center;}
				#orderSearchDrop #orderDateDrop .tabmenu a { width:50%; line-height:normal; vertical-align:text-bottom; padding:16px 0px; }
				#orderSearchDrop #orderDateDrop .tabmenu a:not(:hover):not(.on){color:#666;}

.c>.flatpickr-calendar.inline{margin: 0 auto;}
.flatpickr-wrapper{width: 100%}
		#orderSearchDrop .updownbox div{margin-top: 0px;}
		#orderSearchDrop .updownbox .selectOption:hover{background: #EEE; }
		#orderSearchDrop .clearSearch,#menuSearchDrop .clearSearch{position:absolute; z-index:2; right: 25px; top: 5px;}
		#orderSearchDrop .clearSearch:hover, #orderSearchDrop .specificdateLabel:hover::after,#orderSearchDrop .daysoffsetLabel:hover::after,#orderSearchDrop .timeTo:hover::after,#orderSearchDrop .timeFrom:hover::after,#menuSearchDrop .clearSearch:hover{ color:var(--hcol); background-color:#DDD; }
		.flatpickr-current-month span.cur-month{font-weight: 900!important;}
		.flatpickr-current-month input.cur-year{font-weight: 900!important; letter-spacing: -1px;}
		.flatpickr-day { color:#666; }
		.flatpickr-day.today { border:0; box-shadow:0 0 0 2px inset var(--h3col); font-weight:bold; color:var(--h3col) }
		.flatpickr-calendar .highlighted-date { position:absolute; width:8px; height:3px; border-radius:150px; bottom:4px; left:calc(50% - 4px); content:" "; display:block; background:var(--h3col); }

	#orderSearchDrop .timeTo input{padding-left: 0;}
	#orderSearchDrop .timeTo input[value='']+em{display:none;}
	#orderSearchDrop .timeTo input:not([value=''])+em{display:block; position:absolute; font-weight:bold; left:-2px; top:3px;color: var(--hcol);}
	#orderSearchDrop .osInput.flatpickr-input{position:relative; cursor: pointer;}
	#orderSearchDrop #from+div{z-index:5; margin-left:-100px;}
	#orderSearchDrop #to+div{z-index:5; margin-left:100px;}
	#orderSearchDrop #AmPm{display: block; width: 0; height: 0;opacity: 0;}
	#orderSearchForm .select .selected:empty:before, #clientDetails .select .selected:empty:before,#menuSearchDrop .select .selected:empty:before{content:attr(data-css-content-placeholder); text-transform:uppercase; color:#AAA; font-weight:900; font-size:10px;}
	#orderSearchForm .multiSelChecks+label{margin-left:-15px; padding-left:15px; width:188px;}
	#orderSearchForm [data-multiSelect="1"] .alr, #clientDetails #clinicalPanel .half .select .selected .alr,#menuSearchDrop [data-multiSelect="1"] .alr { color:var(--hcol)!important; background:#EEE; line-height:initial; }
		/* #orderSearchForm.clinical [data-forminput="tableNo"]:empty:before{content:'beds'}
		#orderSearchForm.clinical [data-forminput="waiter"]:empty:before{content:'ward staff'}
		#orderSearchForm.clinical [data-forminput="tableGroup"]:empty:before{content:'wards'} */
		#orderSearchForm.clinical .tableicon {display: none;}
		#orderSearchForm .allergenicon{max-height:none;}
		#orderSearchForm .allergenicon span{width:30px; height:30px; line-height:30px;}
		#orderSearchForm .solidGrades label b,#orderSearchForm .liquidGrades label b{white-space:pre; line-height:10px; display:block; font-size:8px; margin-top:5px;}
			#orderSearchForm .advAllergens .select.hov .selectdrop{height: 140px;}
			#orderSearchForm .liquidGrades,#orderSearchForm .solidGrades{border: 0;}
#liorders .newGroup{display: none;}

#savedSearchMaximesed {display: none;}
#savedSearchMaximesed .orderHead { background: #E4E4E4;  }

a.threeDotsButton.on{background-color:var(--h2col); color:#FFF;border: solid 1px transparent; font-size: 9px;}

.threeDotsButton { position:absolute; right:5px; top:30%; }
.threeDotsButton.bluebtn, .threeDotsButton.lgreybtn{ position: absolute; }
.pin-search #orders, .pin-search #view{margin-left: 335px;background: #FFF;transition: margin-left 300ms;width: calc(var(--scaled-width, 100vw) - 453px - 150px) !important;}
.pin-search #view{margin-left: 175px;}
	.pin-search #savedSearchMaximesed { position:fixed; left:250px; top:70px; z-index:1; width:150px; display:block; box-shadow:-2px 0 4px inset #ccc; height:calc(var(--scaled-height, 100vh) - 70px); overflow-y:auto; }
	.pin-search #aggSum {left: 350px;}
	.pin-search #orders.xScrollPane.aggSum { width: calc(var(--scaled-width, 100vw) - 840px); margin-left: 590px;}
	.pin-search #savedSearchMaximesed {background: #EEE;position: fixed;left: 250px;top: 70px;border: 0;z-index: 1;height: calc(100% - 110px);padding-bottom: 70px;border-radius: 0 0 0 0;width: 150px;display: block;}
	#pane-maindiv.maximised.pin-search #savedSearchMaximesed { left:0; top:40px; height:calc(100% - 40px);}
	.maximised.pin-search #orderTotals {left: 150px;}
	.pin-search #orderTotals {left: 400px; display: block;}

#orders #pinSavedSearchPanel, .folder #pinSavedSearchPanel { height:34px; vertical-align:middle; line-height:34px; }
	#savedSearchMaximesed.savedSearches p:not(.emptyList) { font-size:12px; text-align:left; padding:0 5px 0 15px; font-weight:bold; }
		.savedSearches p.on{ color: var(--hcol); border-left:3px solid var(--hcol); background:#FFF; font-weight:bold; line-height: 35px;}
			#pinSavedSearchPanelBtn svg { width:15px; }
			.pin-search #pinSavedSearchPanelBtn { background-color:white; border-color:transparent; color:var(--h3col)!important; }
			#pinSavedSearchPanelBtn{position:absolute; left: 0; margin-top: -5px}
			#pinPanelTitle{ margin: 10px 0 10px 17px; padding-left: 20px; }

#orders{margin-left: 180px;background: #FFF;transition: margin-left 300ms; padding:0 0 0 20px; }
#orders .unavailable{text-align: left;}
#orders .unavailable a{margin-left: 50px;}
#orders .order.prefade{transform: translateX(200px);transition: none!important;}
.xScrollPane { height:100%; width:calc(var(--scaled-width, 100vw) - 430px); overflow-x:auto; overflow-y:hidden; box-sizing: border-box;}
.order .allergenicon span{ height:30px; width:30px;}
.order .tags{margin-top:5px;white-space: normal;}
.order .tags .head{display:none}

#auditPanel + .options + .xScrollPane {width:calc(var(--scaled-width, 100vw) - 450px - 126px);}
#auditPanel + .options + #orders.xScrollPane {width:calc(var(--scaled-width, 100vw) - 453px);}
.maximised #auditPanel + .options + #orders.xScrollPane {width:calc(var(--scaled-width, 100vw) - 200px);}
	.order { position: relative; width:280px; border-right:solid 2px #EEE; border-bottom:solid 2px #EEE; height:calc(var(--scaled-height, 100vh) - 88px); text-align: center; display:inline-block; vertical-align:top; overflow-y: auto;transform: translateX(0px);opacity: 1;transition:transform 300ms, opacity 300ms, width 250ms;}
		.order.closing{ opacity: 0.4; transition: opacity 600ms }
		.order.closed{width:0px; opacity: 0; pointer-events: none; overflow: hidden;}
	.order,.orders.pane #mainnest,.xScrollPane{height:calc(var(--scaled-height, 100vh) - 83px); vertical-align: top;}
	.orders.pane.maximised #mainnest,.maximised .xScrollPane{height:calc(var(--scaled-height, 100vh) - 45px); vertical-align: top;}
	.order .moreOptions{ width: 130px; border-radius:20px; overflow:hidden}
		.order .moreOptions>b{ padding:15px 25px; }
		#orders.condensed .order .moreOptions>b {padding: 10px 20px;}
	#ordAllergens,#custName{ display:inline-block; position: relative;background:#EEE; margin:0 auto; border-radius:50px; text-align:center; max-width:240px; white-space:normal; padding:6px 10px; box-sizing:border-box; transition: padding 300ms, border-radius 300ms; }
		#custName{text-transform:uppercase; font-size:10px; font-weight:bold; padding:6px 15px;}
		#ordAllergens a{display: none;}
		#ordAllergens::before,#custName::before{  content:''; width:20px; height:20px; background:url(/media/icon-collab-user.gif) no-repeat; display:inline-block; vertical-align: middle;}
		#ordAllergens::before{margin-top:8px; margin-right:2px;}
		#ordAllergens::after{content:attr(data-fname); position:absolute; text-transform:uppercase; font-size:10px; font-weight:bold; left:0; margin:0 auto; width:100%; top:-6px; white-space: nowrap;}
		#ordAllergens hr{display: none;}
		#ordAllergens .icon-paperclip svg{width:25px; height:25px; margin: 1px 0px 0px 1px;}
		#ordAllergens label{ width:32px; margin:2px 0px 0px 0px; padding:0; display:inline-block;}
		#ordAllergens label b,#ordAllergens label.dontShow{display:none;}
		#ordAllergens label:hover{background-color: transparent;}
		#ordAllergens .head,
			#ordAllergens .tag,
			#ordAllergens #ordNotes,
			#ordAllergens #contactInfo{display: none;}
		#ordAllergens #contactInfo{text-align: left;margin: 10px 0 0 25px;}
		.popwindow #ordAllergens.expand{z-index:0 !important;}
		#ordAllergens.expand{ z-index:1 !important;position:relative;width:250px; max-width:none; padding:0px 0px 20px 0px; border-radius:20px; border:2px solid #FFF; box-shadow:3px 3px 5px -2px rgba(0, 0, 0, 0.3);}
			#ordAllergens.expand a{display:inline-block; position:absolute; right:5px; font-size:12px; font-weight:bold; padding:10px;}
			#ordAllergens.expand .texture b { color:#000;}
			#ordAllergens.expand .head{display:block; text-transform:uppercase; font-size:12px; font-weight:bold; padding:10px 0px 0px 0px;}
			#ordAllergens.expand::before,#ordAllergens.expand::after{display: none;}
			#ordAllergens.expand .icon-paperclip span { width:20px; height:20px; margin:5px; line-height:20px; }
			#ordAllergens.expand .icon-paperclip svg{width:18px; height:18px; margin:-4px 0px 0px -2px;}
			#ordAllergens.expand .icon-paperclip{position:absolute; margin-top:-40px; margin-left:90px; display: inline-block;}
			#ordAllergens.expand hr{opacity:0.1; display:block; visibility:initial; background:#EEE; margin-top: 20px;}
			#ordAllergens.expand hr:last-child{display: none;}
			#ordAllergens.expand label b,#ordAllergens.expand #ordNotes,#ordAllergens.expand #contactInfo{display: block;}
			#ordAllergens.expand .tag{display: inline-block;}
			#ordAllergens.expand #ordNotes{color:#222;font-size: 12px; padding:0px 15px;overflow-wrap:break-word;}
			#ordAllergens.expand label:not(.icon-paperclip) { margin:5px 4px 0px 4px; width: 46px;}
			#companionOrder{padding: 2px;font-size:12px;background-color: white;color:red;width:120px;border: 1px solid;top: 95px;left: 80px;position:absolute;}
			#companionOrder svg{background-color:red;color:white;border-radius:10px;}
	/* .order .moreOptions span:first-child{border-radius:9px 9px 0px 0px;}
	.order .moreOptions span:last-child{border-radius:0px 0px 9px 9px;} */


	#orderTotals { background:#F5F5F5; position:fixed; box-shadow:0px 0 11px rgba(0,0,0,0.2); left:250px; top:70px; border:0; z-index:1; height:calc(100% - 70px); padding-bottom:70px; width:200px; border-radius: 0 15px 15px 0; }
		.orderHead{ border-bottom: solid 2px #F9F9F9; line-height: 34px; text-align: center; margin-bottom: 10px}
		.orderHead .largeText{ font-size: 14px!important;}
		.orderHead svg{ float:left; margin-top:7px; margin-left:10px; }
		.order.aggSum .footer {position: sticky; display: flex;align-items: center;justify-content: end;}
		.popwindow .order.aggSum .footer{ padding: 10px 0; }
		.order .footer{position:fixed; bottom:3px; width:100%; padding:20px 0; background:linear-gradient(0deg, rgba(255,255,255,1) 60%, rgba(255,255,255,0) 100%); }
			.order .footer .pillbtn{ margin-right: 10px; width:130px; padding: 0}
			.order #status a{ margin-right: 10px}
			.order .popupBtn a:after{ content:''; border-style:solid; border-width:0px 20px 10px 20px; position:absolute; top:-10px; margin-left:-20px; left:50%; opacity: 0; transition: opacity 150ms;z-index: -1;}
			.order #status a[data-type='print']:after{border-width: 0px 10px 10px 10px; margin-left:-10px; top:-8px;}
			.order .popupBtn.on a:after{opacity: 1;}
				.order .popupBtn.on a{ background:var(--hcol); color: #FFF;}
			.order #status .arrow{ position:absolute; right:13px; top:50%; margin-top:-17px; font-size:10px;padding:10px; transition: transform 250ms; color: #FFF;}
			.condensed .order:not(#orderTotals) #status .arrow{ right:0; }
			.order #status a[data-type='print']+span{display: none;}
			.order #status a[data-type='print'],.order #status a[data-type='print']:after{background: var(--h2col);color:#FFF; border-color:var(--h2col);}
			.order #status a[data-status='-1'],.order #status a[data-status='-1']:after{ background: var(--h2col);color:#FFF; border-color:var(--h2col); }
			.order #status a[data-status='0'],.order #status a[data-status='0']:after{ background: #999;color:#FFF; border-color:#999; }
			.order #status a[data-status='20'],.order #status a[data-status='20']:after{ background: var(--h2col);color:#FFF; border-color:var(--h2col); }
			.order #status a[data-status='30'],.order #status a[data-status='30']:after{ background: var(--h3col);color:#FFF; border-color:var(--h3col);}
			#orderTotals .footer .pillbtn{ width: 110px}
			.order .popupBtn {display:inline-block; position:relative;}
			.order .popupBtn.on .moreOptions{transform: scale(1) translate(0,-45px);opacity:1;visibility: visible;}
			.order #status.on .arrow{ transform: rotate(180deg); }
			.order .popupBtn .moreOptions{position:absolute;transform: scale(0.8) translateY(35px);opacity: 0;transition: all 200ms;visibility: hidden;bottom: -5px;}
			.order .popupBtn.print .moreOptions{ margin-left: -75px; }
			.order .popupBtn.print a:after{ border-color:var(--h2col); height: 20px; }
		#orderTotals .orderHead{ border-bottom: solid 2px #EEE; padding-left: 25px; }
		#orderTotals .footer{ background: linear-gradient(0deg, #F5F5F5 60%, rgba(255,255,255,0) 100%); }
			.orderHead .fl{ margin: 5px 10px;}
			.orderHead .fr{ letter-spacing: -1px; margin-right: 10px}
			.orderHead b { line-height:95%; display:inline-block; vertical-align:middle; }
		#orderTotals.maximised{  width: calc(var(--scaled-width, 100vw) - 250px);}
		#orderTotals:not(.maximised) #btn{  width: calc(var(--scaled-width, 100vw) - 250px);}

	.order .orderItems>a { display:block; font-size:16px; font-weight:900; padding:8px 5px; position:relative; white-space:normal; transition:all 400ms}
		.order .orderItems>a.scratched{color: #AAA!important; text-decoration: line-through;}
		.order .orderItems>a.on { background:#EEE; color:var(--hcol); border-radius: 50px;}
		.order .fname>.smallText{ white-space:nowrap; }
		.orderItem .allDots{display:inline-block; position:relative; left:10px;}
		.orderItem .allergenDot{float:right; width:12px; height:12px; border-radius:50px; margin-right:2px;}
		.order .customisations{display: block; font-style: italic;font-size: 12px; white-space: normal; font-weight: 900}
		.order .orderItems>p.smallText{ margin: 10px 0; }

		#receiptPreview{border: 0; height: 60vh; margin: 0 auto;}

	#orderTotals.order .orderItems a{padding: 0px 5px 0px 55px; height: 55px; text-align: left;/* border-bottom:solid 1px #E9E9E9; */font-size: 12px;}
		#orderTotals.order .orderItems>.groupname+a{ /* border-top:solid 1px #E9E9E9; */}
		#orderTotals.order .orderItems>a.on{ background: #FFF; box-shadow:0 1px 15px #DDD;}
		#orderTotals.order .orderItems>a.on:after { content:""; width:0; height:0; border-style:solid; border-width:6px 0 6px 5px; border-color:transparent transparent transparent var(--h2col); position:absolute; right:4px; top:20px; z-index:1; }
		#orderTotals .groupname{background: #FFF;}
		#orderTotals .fname{ display:block; position:relative; top:50%; transform:translateY(-50%); margin-right:15px;max-height: 40px;overflow: hidden;}
		#orderTotals .customisations, #orderTotals .allDots, #orderTotals .fname>.orange{display: none;}

		#usersDrop span#selectedUsersCount { margin: -3px 3px 0px -4px; }
			#usersDrop.sel span#selectedUsersCount { background: #FFF; color: var(--hcol); }

	#internalOrderSummary {padding: 20px 35px; overflow-y: scroll;}
	#internalOrderSummary, #internalOrderSummary details {display: flex; flex-direction: column; gap: 10px; }
	#internalOrderSummary details {cursor: pointer; position: relative;}
	#internalOrderSummary .group-name {color: var(--hcol); font-size: 18px;}
	#internalOrderSummary .recipe-name {color: var(--h3col); text-align: left; margin-left: 20px; font-size: 16px;}
	#internalOrderSummary .group-name + .content {margin-left: 5px;}
	#internalOrderSummary .content {text-align: left; margin-left: 24px; padding-left: 20px; gap: 5px; display: flex; flex-direction: column; border-left: 2px solid var(--col, var(--hcol));}

.circleImg { width:50px; height:50px; border-radius:50%; background:#EEE url(/media/back-chef.png) no-repeat; background-size:contain; display:block; }
	.circleImg>.counter { top:60%; left:55%; }
	#orderTotals .circleImg { top:4px; position:absolute; left:3px; border:solid 2px #FFF; box-shadow:1px 1px 3px #AAA; width:40px; height:40px; transition:all 300ms; }
	#orderTotals a.on .circleImg { border:0; box-shadow: none; width:47px; height: 47px;}

	#orders.aggSum{margin-left: 440px;}
		#orders.xScrollPane.aggSum{ width: calc(var(--scaled-width, 100vw) - 690px); padding-left:45px; }
		.autoscale #orders.xScrollPane.aggSum{width: 410px;}
	#orders.aggSum #orderTotals{border-radius:0; box-shadow: none;}

	#aggSum { position:absolute; display:block; top:40px; left:200px; bottom:0px; height:auto!important; background:#FFF; border-radius:0 40px 50px 0; box-shadow:10px 0 15px rgba(0,0,0,0.2); overflow-x:hidden; z-index:1;}
		#aggSum:not(.on){opacity: 0; pointer-events: none; transform:translateX(-100%); z-index:0;}
		#aggSum>div:not(.footer), .aggSum .header, #aggBlocks>div { border-bottom:solid 2px #DDD; border-image:linear-gradient( to right, #EEE0, #EEE 50%) 1; padding:20px 30px; box-sizing:border-box; min-height:60px; position:relative;}
		.aggSum>div:first-to-type{background:#efefef; border-bottom:0;}
		.aggSum .header .delbtn{ position:absolute; right:8px;}
		.aggSum .header:not(:first-of-type) .delbtn{ display: none }
			.aggSum .circleImg { position:absolute; left:3px; top:12px; z-index:1; }
			.aggSum .selFoodName { width:calc(100% - 45px); display:block; white-space:normal; line-height:100%; margin:0 auto; }
				.aggSum .selFoodName .orange{display: none;}
			#aggBlocks div:not(.header) .counter, .aggSum input[type=checkbox]+label{ position:absolute; z-index:1; top:50%; transform:translateY(-50%); left:15px; }
				.aggSum input[type=checkbox]+label{ left:auto; right: 8px; padding: 10px 0}
			.aggSum .content{ white-space:normal; }
				.aggSum .content:empty:before{ content:'No Modifications'; display:inline-block; font-weight: bold; font-size:12px; color:#999; font-style:italic; padding:10px 30px; background: #EEE; border-radius: 50px;}
				#aggBlocks>div.scratched .content, #aggBlocks>div.scratched .counter, #aggBlocks>div.scratched *:not(use,svg,.threeDotsButton) { filter: grayscale(1); opacity: 0.3; transition: filter 500ms 100ms, opacity 500ms 100ms}
				#aggBlocks .tag[data-tag]{margin-top: 10px;}
			.aggSum .customisations{display: block; margin:0px 30px 5px;}
			.aggSum .customisations:not(.orange){color:#555;}
			.aggSum .allergenicon{margin: 0 2px;}
			.aggSum label{background:transparent;}
		#aggBar{ position: absolute; left:25px; top:50px; z-index: 0; height: 200px; width:5px; background:#EEE; border-radius: 50px;}


	#orders.condensed{width:calc(var(--scaled-width, 100vw) - 430px); overflow-y:auto; overflow-x:hidden; white-space:normal; padding:2px 0 50px 25px;}
		#pane-maindiv.maximised .xScrollPane{width: calc(var(--scaled-width, 100vw) - 200px);}
		#orders.condensed .order:not(#orderTotals):not(#aggSum) { height:250px; min-width:217px; overflow:hidden; width:24.85%; max-width:290px; border-radius:20px; border:solid 2px #EEE; margin:2px; }
		#orders.condensed .order:not(#orderTotals) .orderItems a { font-size: 90%; font-size: 14px; pointer-events: none; padding: 5px}
		#orders.condensed #ordAllergens{ padding:1px 3px 1px 7px; transform: scale(0.85); margin-top: -10px;}
		#orders.condensed #ordAllergens:before{ margin-right:0;}
			#orders.condensed :not(#orderTotals) .footer {position:sticky;bottom:0;z-index:2;padding:5px 0 5px calc(100% - 48px); width:auto; transition:all 200ms; white-space: nowrap; overflow: hidden; background: linear-gradient(0deg, rgba(255,255,255,1) 25%, rgba(255,255,255,0) 100%);}
				#orders.condensed :not(#orderTotals) .footer.on{ padding-left:0px; width:100%; overflow:visible; background: linear-gradient(0deg, rgba(255,255,255,1) 60%, rgba(255,255,255,0) 100%);}
				.order .roundbtn.slidebtn { display:none; margin-right:20px!important; }
				#orders.condensed :not(#poppane) .footer:not(.on) .slidebtn{display:inline-block;}
				#orders.condensed :not(#orderTotals) .footer a { line-height:33px; margin: 0; }
					#orders.condensed :not(#orderTotals) .footer a.roundbtn { transform: scale(0.85); vertical-align:middle; margin-right: -2px;}
				#orders.condensed :not(#orderTotals) .footer .pillbtn{ width:110px }
				#orders.condensed .footer svg{width: 18px; }
			#orders.condensed p.smallText{ display:none; }
		#orders.condensed .order:not(#orderTotals) .popupBtn.print .moreOptions{bottom: 35px;}
		#orders.condensed .order:not(#orderTotals) .popupBtn.on .moreOptions{bottom:-21px!important; right: -20px; z-index:1}
			#orders.condensed #orderTotals .popupBtn .moreOptions{bottom:-8px;}
			#orders.condensed .order:not(#orderTotals) .moreOptions span{padding: 12px 18px;}
			#orders.condensed .order .spacer{display: none;}
			#orders.condensed .order p.smallText{margin:4px 0}

	#poppane .order{ box-sizing: border-box; margin:-35px -50px -30px; width:330px; height:calc(var(--scaled-height, 100vh) - 90px); max-height:600px; border:0; pointer-events: none; overflow:visible; overflow-x: hidden;}
	.darkcover.on #poppane .order *{ pointer-events: all;}
	.darkcover.on #poppane .order .orderItems, .darkcover.on #poppane .order #aggBlocks {display: block;height: calc(100% - 50px - 35px - 90px);overflow: auto;}
	.darkcover.on #poppane .order #aggBlocks {height: calc(100% - 50px);}
		#poppane .orderHead { padding-right:45px; line-height:55px; border-radius:8px 8px 0 0; }
		#poppane .orderHead .fl { margin:15px 20px;}
		#poppane .order .roundbtn{margin-right:10px;}
		.orderSummary #popnest{ padding:0; overflow-y: hidden; overflow-x:auto  }
			.orderSummary #poppane { white-space: nowrap; max-width: calc(var(--scaled-width, 100vw) - 40px) !important; width: auto !important;}
			.orderSummary #poppane .order{ margin: 0; width: 250px; border-right: solid 2px #EEE; }
			.orderSummary #poppane .order .header .delbtn{ display:none; }
			.orderSummary #poppane .order .header{ min-height: 90px; }

#pane-maindiv.maximised { position:fixed; height:var(--scaled-height, 100vh); width:var(--scaled-width, 100vw); max-width:none; left:0; right:0; z-index:7; top:0; bottom:0; background:#FFF; transition:top 500ms }
	.maximised .options{top: 0; width:var(--scaled-width, 100vw)!important}
	.maximised #orders.aggSum{width: calc(var(--scaled-width, 100vw) - 440px)}
	.maximised .order{height:calc(var(--scaled-height, 100vh) - 40px);}
	.maximised #orderTotals{left:0; top:40px; height: calc(100% - 40px)}
	.autoscale #pane-maindiv.maximised { height:auto; width:auto; }
		.autoscale .orders.pane #mainnest{vertical-align: inherit;}
		.autoscale .maximised .options{width: 100%!important;}
		.autoscale .maximised #orders{width:940px;}
		.autoscale .maximised #orders.aggSum{width:660px;}
		.autoscale .maximised .order{height:100%;}


/*//////////////////////////////////////// INSIGHTS ////////////////////////////////////////*/
.insightPanel::before { content:'⏷'; display:inline-block; font-size:16px; color:var(--h2col); vertical-align:middle; margin:-1px -7px 0 -2px; padding:1px 5px; transition:transform 200ms; }
.insightPanel:hover::before { color:var(--h3col); }
.insightPanel.off::before { transform:rotate(-90deg);}
#exported .chart .insightPanel{ display:none;}

.pane.insights{padding:10px 0 150px 0px!important;}
.pane.insights #mainnest{width:calc(var(--scaled-width, 100vw) - 260px); max-width: 100%; white-space: normal;}
.insights .options input#description, .insights .options input#name{width:270px;}
.insights #LTtabs>.tabmenu a{ padding: 0 30px; line-height: 35px; }
.insights #LTtabs>.tabmenu a:not(.on):hover{ background:rgba(0,0,0,0.1) }

#insightsform { min-width: 150px; overflow: hidden;}
	#insightsform:after{ top: 7px;}
.insights #LTtabs .tab, .options.supplier-options #LTtabs .tab{ width: auto; transform: translate(-55px,0); border-radius: 0 20px 30px 0;}
.insights #LTtabs #tab-insightsformfilter { width: 800px; height: 340px; overflow: scroll;}
.insights #LTtabs .tab{ width:318px; min-height: 400px; }

#insightsOffsetTab { width: 100%; background: #eee !important; border-top-right-radius:12px;}
	#insightsOffsetTab a:not(:hover){ color: #333;}
	#insightsOffsetTab a.on { color: var(--hcol)  !important; background: #FFF !important; position: relative; z-index: 2 ;}
	#insightsOffsetTab a.on:after { display:none }

#insightsOffset.updownbox input{width:50px;}
#insightsOffset.updownbox #dOWrapper{width:100px;}
#insightsOffset.updownbox {margin-top: 20%;}

.insights .groupCollabsWrapper { min-height: auto;}
	.insights .options .flatpickr-calendar, .options.supplier-options #LTtabs .flatpickr-calendar{margin: 10px 5px 40px;}
	.insights .options .tab .footer, .options.supplier-options #LTtab.tab .footer { position:absolute; bottom:0; height:55px; width:100%;}
.insights .savedSearches, .options.supplier-options #LTtabs .savedSearches { top:0; height:100%; border-right:2px solid #EEE; width:100px; }
.insights .options svg{ margin:-3px 4px 0px 0px; }
.newChart .poppane { height: 550px; }
.newChart #popnest { border-radius: 30px; }
.newInsights .poppane { height: 700px; }


.insights h5.grabber{ border-radius:50px; padding-left:20px; text-align:left; border-right: solid 3px #FFF; align-items: center;}
	.insights h5 input { margin:-5px 0; /* max-width:calc(100% - 200px); */ width:auto; padding-right:0; margin-right:-10px; }
	.insights h5 .roundbtn.fr { flex-grow:0; margin: -3px 0 -3px 4px; }
	.chartDataInfo {margin: 0 10px 0 auto; flex-grow:0; white-space: nowrap}
	.chartDataInfo svg{ margin-top:-2px;}
.chart h5>input { width: 100%; }
#chartWrapper { margin-top:30px; padding:0 20px; }
.chart { position:relative; width:100%; padding:0 5px 10px; }
	body.dragging .chart>* { pointer-events:none; }
	.chart.dragOver { border: solid 3px #F60;}
		.chart.dragOver *{pointer-events: none;}
	.chartBody{ min-height: 300px; }
	.chart:not(.loading) .loadspinner { opacity:0; }
	.chart .loadspinner { position:absolute; z-index:1; left:0; right:0; top:85px; bottom:0; padding-top:100px; background:#FFF; transition:opacity 500ms; pointer-events:none; }
	.chart .canvas:not(.hidden)+.table{display:none;}
	.chart .table { padding:20px 15px 30px; display:block; margin:-20px 20px 10px; border-radius:0 0 20px 20px; overflow: scroll; }
		.chart table { width:100%; }
			#pane-maindiv .chart table thead td{ padding:4px 10px; font-size:10px; font-weight:bold; border:0; color:var(--hcol); line-height:10px; border-bottom:solid 4px #EEE; }
			.chart table td:first-child{font-weight: bold;}
			.chart table td:last-child{ border-right:0; }
	.chart[data-size='two_thirds']{width: 66%; max-width:66%; }
	.chart[data-size='half']{width: 50%; max-width:50%;}
	.chart[data-size='one_third']{width: 33%; max-width:33%;}
	.chart[data-size='one_quarter']{width: 25%; max-width:25%; }
	.chart .kpis>div{ display: inline-block; vertical-align: top; width:150px; height:150px; color:#FFF; background-color: #CCC; padding:10px; border:solid 3px #FFF; border-radius: 20px; }
		.chart .kpis>div:hover{ box-shadow: 0px 2px 12px rgb(0 0 0 / 15%); }
		.chart .kpis .smallTxt.caps{ line-height: 100%; display: block; }
		.chart .kpis .xxlargeTxt{ font-size: 55px; letter-spacing: -3px; }
		.chart .kpis .unit{ margin-left:5px }
		.chart .kpis .mediumTxt{ letter-spacing: 0;}
	.chart .userKPI{width:100px;}
.chart .chartFooter { text-align: center; }

#newChartPop .tabmenu{ top: 65px; border:0; border-radius: 0 20px 0 20px; }
#newChartPop .tab{ margin: -20px -50px; padding-top: 20px; width:480px; min-height: 50vh; border-radius: 20px;}
	.chartPreview{position:relative; display: block; padding:25px; min-height:135px; box-sizing: border-box; transition:opacity 400ms }
		.chartPreview:hover{ color:#006a91; }
		.chartPreview:hover .thumb{ transform:scale(1.05); box-shadow:1px 2px 20px rgba(0,0,0,0.2);}
		.chartPreview.on{ background:var(--bgcol3); }
		.chartPreview:before{ content:"\2714\FE0E\a0"; display:inline-block; width:22px; height:22px; line-height:22px; vertical-align:middle; border-radius:50%; text-align:center; font-size:10px; font-weight:900; color:white; background-color:#0089bf; position:absolute; margin: -4px -31px; z-index: 3;	border: solid; transform: scale(0.001); transition:transform 150ms;}
			.chartPreview.on:before{  transform:scale(1)}
		.chartPreview.grey:after { content:'ACTIVE'; position:absolute; top:27px; left:60px; padding:2px 10px; background:#0089bf; color:#FFF; font-size:8px; font-weight:900; border-radius:50px; z-index:2; }
		.chartPreview.grey.notenabled:after { content:'DISABLED'; position:absolute; top:27px; left:60px; padding:2px 10px; background:#0089bf; color:#FFF; font-size:8px; font-weight:900; border-radius:50px; z-index:2; }
	.chartPreview .thumb { display:block; width:90px; height:90px; float:left; margin:-25px 15px 0 -5px; padding-top:70px; text-transform:uppercase; box-sizing:border-box; text-align:center; transition:all 200ms; border:solid 3px #FFF; }
			.thumb.table{background:url(/media/charts/table.png) no-repeat center;}
			.thumb.bar{background:url(/media/charts/bar.png) no-repeat center; text-indent: 0;}
			.thumb.line{background:url(/media/charts/line.png) no-repeat center;}
			.thumb.bubble{background:url(/media/charts/bubble.png) no-repeat center;}
			.thumb.doughnut{background:url(/media/charts/doughnut.png) no-repeat center;}
			.thumb.kpis{background:url(/media/charts/kpis.png) no-repeat center;}
#newChartPop .footer { position:absolute; width:70%; height:90px; background:linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(255,255,255,1) 50%); bottom:0; right:0; padding:30px 20px; box-sizing:border-box; }
		#newChartPop .footer:not(.on){ display:none;}

.img.sizeicon{ background-image: none;}
	.img.sizeicon:before{content:''; box-sizing: border-box; display: block; width:100px; border:solid 4px rgba(0,0,0,0.2); border-radius: 10px; margin:40px auto; height:50px; transform:scale(0.7); transition:all 300ms}
		.bigIconMenu>div:hover .img.sizeicon:before{border-color:currentColor; transform:scale(0.8);}
		.img.sizeicon.half:before{ border-left-width:50px; }
		.img.sizeicon.one_third:before{ border-left-width:33px; }
		.img.sizeicon.two_thirds:before{ border-left-width:66px; }
		.img.sizeicon.one_quarter:before{ border-left-width:25px; }
#insightsHideFieldPop{ max-height: 70vh; overflow-y: auto; margin-bottom: 10px; }
#insightsSelectAll + label{ font-weight: bold; line-height: 36px; float:left;}

/*BRANCH VARIATIONS:*/
body:not(.hasClients) #wrapper{left: -900px; transition:none;}
body:not(.hasClients) #backbtn,body:not(.hasClients) #backbtn0,
body:not(.hasClients)#forwardbtn,
body:not(.hasClients) #input-activitySearch{ display:none; }
body:not(.hasClients) #newBtn,body:not(.hasClients) #newBtn{margin: 0; border-radius:0 50px 50px 0;}
#retStart{position: absolute; top: 0; left: 0px; right: 0; bottom: 0; overflow: hidden;}

@media screen and (max-width: 780px){ /* login screen for tablets */
	/*#index #loading{display:block!important; opacity:1!important; text-align:center;}
	#index #loading::before{ content:"Please set your resolution to at least 1024x600 to use this software."; font-size:24px; color:#CCC; display:inline-block; margin-top:30px}*/
	#login{ width:100%; }
	#loginform { width:877px; }
	#loginlogo { float: right; margin-top: -37px; width: 185px; margin-right: 82px; }
	#login input { padding: 10px 15px; font-size: 14pt; color: var(--hcol); border: 0;  margin-left: -30px; width: 21%; vertical-align: middle;}
		#login input#pwd { width: 180px; margin-left: 5px; }
	#formtitle { margin-right: 47px; margin-top: 12px; float: left; margin-left: 75px; width: 100px;}
	#wrapper{display:none;}
	#remembermebox { color: #999;border: 0;width: 170px; margin-top: -4px;float: left;padding-bottom: 5px; margin-left: 73px;margin-left: 90px; }
	#settingsbox .popup{height:350px;}

}
@media only screen and (max-width : 430px){ /* login screen for mobiles */
	#loginform{  width:var(--scaled-width, 100vw); margin-left:-50%; padding:200px 0; text-align:center; top: 0; margin-top: 0;  min-width: auto;}
	#formtitle, #loginlogo{  display:block; float:none; width:auto!important; margin:10px auto!important; max-width:80%; text-align: center; padding: 0!important; box-sizing:border-box; height:auto;}
	#loginlogo { margin:-70px auto 70px!important; max-width:70%; height: auto;}
	#loginfields{width:95%; border-radius:50px; margin:30px auto;}
	#login input#uname, #login input#pwd{width:50%; text-align:center; height:75px; box-shadow:none!important}
	.loginTitle{ position:absolute; margin-top:0px; left:50%; transform:translate(-50%); }
	#loginform .btn{ position:absolute; top:570px; left:50%; border-radius:50px; width:190px; transform:translate(-45%); }
		#loginform .btn:before{content:'LOGIN ';}
	#remembermebox{ margin: 0 -35px;}
	#loginOauth2{ margin:70px auto; background:#FFF}
	#loginbanner{ width:80%; box-sizing:border-box; left:0; margin:0; bottom:8%; }
	#loginform .eyebtn{position:absolute;}
}
@media all and (min-width:430px) and (max-width:801px) and (max-height:1280px) and (orientation:portrait) { /* ipad portrait */
	#index #loading{display:block!important; opacity:1!important; text-align:center;}
	#index #loading::before{ content:"Please use Nutritics in landscape mode only."; font-size:38px; color:#CCC; display:inline-block; margin:500px 0 -800px 0}
}

/* TEMPORARY STYLING */
#touchToggle{ float: right;  position: relative; margin:1px 40px 1px 0; background:#444; color:#AAA; display:block; width:28px; height:28px; border-radius:15px; line-height: 28px; text-align: center; font-size:10px; text-transform:uppercase;}
	#touchToggle.on{ background:var(--hcol); }
	#touchToggle::after{content:'off';}
	#touchToggle.on::after{content:'on'; color: #FFF;  }
	.sel0{ background:#FFF; border-left: solid 5px var(--hcol); color:var(--hcol);}
	.bannerphoto iframe{width:372px; height:100px;}
	.rtalign .bannerphoto{background-position:left!important;}
	.bannerphoto #openfile{top:38%;}
	#settings_profile #aboutmsg{position: inherit!important; margin-top:50px;}
	.highlight td, .highlight input , .highlight{ background: var(--bgcol3) !important; }
	#global { position: absolute; display: block!important; z-index: -1; }
	.rtalign #foodContent{text-align: left;direction: ltr !important;float: left;}
	.rtalign #foodContent .lnutName{direction: rtl;}
/*Additional classes for prieview recipes and foods*/
/*.panelbody.newOverview{ padding-right:150px;}
.panelbody.newOverview p{left:0px!important;}*/

.livepreview .panelbody, .download .panelbody{min-height:270px;}
#hideTitle{display:none;}

.livepreview .panelbody.hide, .download .panelbody.hide{display:none;}

.livepreview #chartWrapper .chart a { pointer-events: none; }/*disable links in live preview for charts*/

#recInput input{display:inline-block!important;}
#menu li ul.openMenu{max-height:348px;}
.textblock {line-height: 140%;}
.textblock p,.textblock li{margin-bottom:10px;}
#autoComplete{ position: absolute; background: #fff; margin-top: 37px; width: 182px; margin-left: 62px; z-index: 2; box-shadow: 0px 1px 1px rgba(0,0,0,0.1); color: var(--hcol);display:none;}
#autoComplete div{ padding: 6px 7px; border-bottom: 1px solid #eee; }
#autoComplete div:last-child{ padding-bottom:10px; }
#autoComplete div:hover{ background-color: #eee; cursor:pointer;}
#confirmbox.darkcover{ z-index:8; }
#orgMembers { margin:20px 0px 10px 0px; padding:20px 50px; position:absolute; top:150px; max-height:40vh; min-height:200px; overflow-y:auto; }
.sgatesCollab #orgMembers{margin:10px -50px; max-height:70vh;}
	#orgMembers .card.user{ min-width:100px; }
	#orgMembers .card.client{ min-width:100px; }
#DayLogs,#MealLogs{display:none;}
#DayLogs.on,#MealLogs.on,#recipeLogs.on{display:block; width:100%;}
#recipeLogs{display:none;overflow-x: hidden;}
	#recipeLogs.exportOption{overflow-x: hidden}
	#recipeLogs.exportOption .bigIconMenu>div{ margin: 40px 10px; }
	#recipeLogs.on{display:block;}
	#recipeLogs>span{padding:10px 10px 11px 10px; background:var(--hcol); display:block; color:#fff; margin-top:0px; margin-bottom:10px; position:relative;}
	#recipeLogs>span strong:nth-child(2){float: right; margin-right: 82px;}
	#recipeLogs #selectLabel{right: 3px; margin-top: -7px; color:#444;}
	#recipeLogs .block{width: 350px; float: left;}
	#recipeLogs .bluebtn{position: absolute;right: 50px;bottom: 22px;}

#quidhead h5.noBmargin a{cursor:pointer; font-size:16px;}
#loadingNewItems{ background-image:url(https://www.nutritics.com/media/loading-bar.gif); width:100%; height:40px; display:inline-block; background-repeat:no-repeat; background-position:center; }
#searchMore{ width:100%; text-align:center; display:inline-block; padding:10px 0px; }

#sources [checked]+label{font-weight: bold; border-top:dotted 1px #CCC;}
	#sources input:not(:checked)+label .smallText.grey{display:none;}
	#sources input:checked+label .smallText.grey{display: inline-block; margin-left: 20px; line-height: 130%;}
	.popwindow .showDB input[type="checkbox"]:not(:checked) + label,.popwindow .showDB input[type="checkbox"]:not(:checked) + label + p.dblabels {display: none}
	.showDB label { font-size: 13px!important; padding: 25px 0 0px; background:#FFF!important }
		.showDB strong{display:inline-block; font-weight:900; width:60px; margin-right:5px; }
		.showDB .outlined{ line-height:13px; margin:-2px; }
	p.dblabels{ color: #AAA; font-size: 12px; line-height: 24px; border-bottom:dotted 2px #EEE; padding-bottom: 25px;}
	p.dblabels span{ display: inline-block; padding: 0 9px; margin-right: 2px;}
		p.dblabels span:before{content:"x"; margin-right:5px;}
		p.dblabels span.active{ color: var(--hcol); font-weight:bold; }
		p.dblabels span.active:before{ content:"\2714\FE0E"; }
	#settings_databases h2, #settings_profile .tab h2 { margin-top: 30px;}
	#settings_databases .avg-scorecard{margin:30px 0;position:relative;border-radius:25px;}
		.avg-scorecard .sc-header{width:56%;height:35px;padding:0 30px;line-height:35px;top:-16px;z-index:1;}
		.avg-scorecard .sc-header img{height:25px;width:auto;margin:5px 0 0 7px;}
		.avg-scorecard .sc-header .helpbtn::before{content:"i"}
		.avg-scorecard .sc-header .helpbtn{position:absolute;right:20px;top:19px}
		.avg-scorecard .sc-content{margin-top:30px;}
		.avg-scorecard .sc-content .sc-grade{width:20%;padding-left:25px;}
		.avg-scorecard .sc-content .sc-total{width:50%;padding:15px 0 0 15px;}
			.sc-content .sc-total td{border:none;padding:3px 0;}
			.sc-content .sc-total tr td:first-of-type{display:inline-block;margin-right: 5px;}
			.sc-content .sc-total p.grey {padding-top:5px;}
			.sc-content .sc-btn{width:30%;}
			.sc-content .sc-btn a{line-height:22px;width:115px;padding:5px;margin-top:5px;margin-right:25px;}
			.sc-content .sc-btn a.greyback:hover{background:#EEE;}
		.avg-scorecard .sc-footer{margin-top:10px;padding:13px 0;border-top:1px solid var(--bgcol2);}
	#settings_databases .src-surefood {border-radius:25px;position:relative;margin:10px 0;padding-top:25px;padding:15px;}
	#settings_databases .src-surefood:not(:has(input:checked)):not(:hover) { filter:grayscale(1); opacity:0.8; box-shadow:none!important}
		.src-surefood label {padding-top:0;}
		.src-surefood:has(.dbsrcLabel.hidden) {display: none;}
		.src-surefood strong.dgreyback{position:absolute;top:-25px;left:30px;line-height:20px;}
		.src-surefood p.dblabels {border-bottom:0;padding-bottom:5px;}
		.src-surefood p.dblabels span {padding: 0 7px;}
		label.hidden+p.dblabels{display:none;}
		#filterDbSrcs{line-height:38px; padding-left:30px; margin-top: 50px;}
		.src-surefood .noitalic {font-weight:bold;font-size:16px;}
		.src-surefood a.btn:hover{cursor: pointer;}
		.src-surefood img {width: 80px;height: 80px;border-radius: 50%;}
		.src-surefood .surefood-content {height:85px;}
		.src-surefood .surefood-image {width:100px;height:80px;padding: 0 10px;}
		.src-surefood .surefood-score{width:145px;border-radius:20px;position:relative;margin:8px 0 0 10px;height: 65px;}
			.surefood-score span.c {padding-top:7px;}
			.surefood-score .surefood-badge {height: 30px;width: 80px;margin-top: 2px;}
			.surefood-score .rule-shield {width:30px;}
			.surefood-score .rule-letter {font-size:16px;}
			.surefood-score .grade-percent {padding-left:10px;margin-top:3px;width:auto;}
			.surefood-score .btn {position: absolute;bottom:-9px;line-height: 16px;border-radius: 10px;padding: 0px 13px;}
		.src-surefood .surefood-btn a{width:100px;line-height:22px;margin:22px 5px 0 0;}


#groupsPanel,#groupsPanelCollabs,#groupsPanelCollabs .expander{text-align: center;}
	#groupsPanelCollabs .expander:not(.on){height:20px;}
	#groupsPanel .disabled, #popupcontent .groups .disabled,#groupsPanelCollabs .disabled{ cursor:not-allowed!important; }
	#groupsPanel>.collabs:first-child .spacer { margin-top:0; }
  #groupsPanelCollabs>.collabs:first-child .spacer { margin-top:0 !important; }
  #groupsPanel span#dynamicGroups-food, #groupsPanel span#dynamicGroups-recipe {display: inline-block;}

#popLoadLog{ margin: 10px -10px -10px -20px; overflow: hidden; }
	#popLoadLog #logsFromScratch{ width: 37%; float: left;}
	#popLoadLog #logsFromScratch h2{ font-weight:normal}
	#popLoadLog #logsFromLibro{ width: 63%; float: left; position: relative; left: 26px;min-height:338px;}
	#popLoadLog #libroDays{position: absolute;left: 0;bottom: 0;}
		#popLoadLog #libroDays h2{margin-bottom: 0px;font-weight:normal}
		#popLoadLog #libroDays span{ font-size:10px; font-weight:bold;}
	#popLoadLog #importFromLibro {position: absolute;right: 26px;bottom: 0;}
		#popLoadLog #importFromLibro a{font-size:11px;}
		#popLoadLog .logMode > span.on { background:var(--hcol); color:#FFF; position: relative;}
		#popLoadLog .logMode > span.on::after { content: '▼'; color: var(--h2col); position: absolute; bottom: -8px; left: 0; right: 0; z-index: 1;}
#popLoadLog .dayHover{background-color:var(--h3col); position:absolute; margin-top:-10px; color:#fff; margin-left:-68px; font-size:10px;padding: 5px 10px 6px 10px;line-height: 15px; display:inline-block; opacity: 0; transition: visibility 0s, opacity 0.2s linear; filter: alpha(opacity=0); pointer-events: none;}
	#popLoadLog span:hover>span.dayHover{filter: alpha(opacity=90); opacity:0.9;}

.cfTable{ width: 100%; margin-left: 20px; font-size:12px; font-style: italic;}
.cfTable td:nth-of-type(2){width:100%; white-space: normal !important;}
#ingredientBody td{vertical-align: top!important; overflow: inherit;white-space: nowrap; border-bottom: solid 1px #EEE; border-right:0}
	#ingredientBody td input{ padding:12px 0;}
#recTable td .ficon { margin:14px -8px!important; }
#ingredientBody .td-food { border-left: solid 1px #EEE; max-width: 405px; height:60px; }
	#ingredientBody .td-food input{font-size:14px; padding:10px 10px 10px 18px;}
	#ingredientBody .td-food .fr{ margin: 13px 0; z-index:1; position:relative; }
#ingredientBody .td-del { padding-top:11px; }
#ingredientBody .td-food .helpbtn { right: 23px;  position: absolute; bottom: 37px; }
#ingredientBody .td-food .iconsWrap { position:absolute; z-index:1; right: -6px; bottom: -10px; }
	#ingredientBody .td-food .iconsWrap .ficon{position: unset; margin: 11px 4px!important;}
	#ingredientBody .td-food input.editable+.clearportion { top: 1px; right: 3px; z-index:2; display:block!important }
	#ingredientBody .td-food input:not(.editable)+.clearportion { display:none; }
	#ingredientBody td .smallTxt.grey{margin:-8px 4px 0 18px;}
	#ingredientBody td .pcode{ flex-grow:0; }

#ingredientBody .td-food .detachedIcon:before{content: "!"; /* top: 21px;left: -13px; */}
#ingredientBody .foodReqIcon{color:var(--hcol); background:none; border:solid 1px var(--hcol);}
#ingredientBody .foodReqIcon:before{content: "!";}
.majorChanges{ padding: 0px 0px 20px 20px; color: #FF7400; }

/***** TABLELESS: BEGIN *****/
.divTableContainer .divTableHeaderLeft{  float:left; word-break:break-all; margin-right:9px; }
.divTableContainer .divTable{ float:right; }
.divTable{ display:table; border-collapse:collapse; }
.divTable .divTableRowHeader, .divTable .divTableRow{ display:table-row; }
.divTable .divTableCell{ display:table-cell; vertical-align:middle; text-align:center; }
/***** TABLELESS: END *****/

#batchImport >div{ width: 100%; display: inline-block; }
	#batchImport #importType { z-index: 0; }
	#batchImport #importType > span.on { background:var(--hcol); color:#FFF; position: relative;}
	#batchImport #importType > span.on::after { content: '▼'; color: var(--h2col); position: absolute; bottom: -8px; left: 0; right: 0; z-index: -1;}
	#batchImport #dragDropBatch { width: 600px;}
	#batchImport.surefood #dragDropBatch { height: 200px;}
	#batchImport #dragDropBatch > .uploadBubble { height: 100%; overflow: auto;}
	#batchImport #dragDropBatch > .uploadBubble + .progress-container:not(.on) + div.hflex { display:hidden !important;}
	#batchImport #dragDropBatch #itemList:not(:empty) + div { display: none; }
	#batchImport #dragDropBatch #itemList { counter-reset: filesCount; }
	#batchImport #dragDropBatch #itemList li { list-style: none; }
	#batchImport #dragDropBatch #itemList li a { display: none; }
	#batchImport #dragDropBatch #itemList li:hover a { display: block; }
	#batchImport #dragDropBatch #itemList li:before { content: counter(filesCount); counter-increment: filesCount; display: inline-block; width: 20px; height: 20px; text-align: center; line-height: 20px; background-color: var(--hcol); color: #FFF; border-radius: 50%; margin-right: 10px; }
	#batchImport #dragDropBatch + #supportedFiles > p > span.xlargeTxt { width: 24px; height: 24px; display: inline-block; }
	#batchImport .footer #selectLabel {display: inline-block;}
	#batchImport > div:has(#itemList:not(:empty)) + .footer > .btn { background-color: var(--hcol); }
	#batchImport >div:first-child{ margin: 10px 0px 20px 0px; }
	#batchImport .batchTemplates a{ margin-left: 10px; }
	#batchImport .footer #excelOptions {flex-wrap: wrap;}
	#dragDropBatch.dragging{ background-color:#fff;}
	#dragDropBatch.loading{  }
	/*#dragDropBatch p { font-size:20pt; padding:0px; margin:0px; color:#999; font-style:italic; white-space:normal; height:150px; line-height:150px; }*/
		#dragDropBatch.loading p{cursor: wait; color:var(--h3col);}

#batchImportReport.batchReport{ display:none; }
	#batchImportReport.batchReport.on { display:block; background:#FFF; box-sizing:border-box;  padding-bottom:50px; top:80px; min-height:280px; width:100%;}
	#batchImportReport.batchReport>.bluebtn{position:fixed; right:50px;}
	#batchImportReport.batchReport .client.lines{margin-top: 10px;}
	#batchImportReport.batchReport .lines{ line-height: 140%; }
	#batchImportReport.batchReport h6{ margin:7px 0 0px; font-size:12px; text-transform:uppercase; }
	#batchImportReport.batchReport a{padding: 1px 5px; margin-right: 10px; cursor: pointer;}
#batchImport #selectLabel{position: relative; width: 80px; display: inherit;padding-top: 10px;}

#batchtype~.batchtab{ padding-bottom:10px; margin-bottom: 40px; text-align:left; min-height:260px;  max-height:45vh; overflow-y: auto;}
#batchtype~hr{margin-bottom:26px;}
#batchtype~#formfooter,#batchImport~#formfooter{position: fixed; bottom: 0; background-color: #EEE; margin-left: -50px; border-radius: 0px 0px 3px 3px; margin-top:0; height:100px;}
#batchtype~#formfooter tr td,#batchImport~#formfooter tr td{border: 0!important;}/*{border: 0!important;}*/
	#batchtype~#formfooter tr:first-child td,#batchImport~#formfooter tr:first-child td{padding-top: 10px;}
	#batchtype~#formfooter tr:last-child td,#batchImport~#formfooter tr:last-child td{padding-bottom: 10px;}
	#batchtype~#formfooter tr td:first-child,#batchImport~#formfooter tr td:first-child{padding-left: 50px;}
	/* #batchtype~#formfooter tr td:nth-child(2),#batchImport~#formfooter tr td:nth-child(2){text-align: center;} */
	#batchtype~#formfooter select,#batchImport~#formfooter select{background-color: #FFF;}
	#batchtype~#formfooter tr:first-child td:last-child,#batchImport~#formfooter tr:first-child td:last-child{padding-right: 50px; padding-bottom: 10px;}
	#batchtype~#formfooter tr:first-child td:first-child:before{content:'Export type:';font-weight:bold;}
	#batchImport~#formfooter tr:first-child td:first-child:before{content:'Import type:';font-weight:bold;}
	span.batchinfo.helpbtn.info {float: none; margin-left: 0px; margin-right: -4px; margin-top: unset; margin-bottom: unset;}


/****************SETTINGS EXTENDED MEAL NAMES ****************/
#extendedNamesSettings{padding-left: 10px; margin: 0px; margin-left: 17px; border: 0px; border-left: 4px solid #DDD; width: 100%; vertical-align: top; overflow: hidden;}
#extendedNamesSettings .halfdiv1{width: 50%; float: left;}
#extendedNamesSettings .halfdiv2{width: 50%; float: right;}
#indentExtendedNamesSettings{ margin-top: 15px;}

/**********SHOPPING LIST***************/
#slistChecks{overflow-y: auto; padding-bottom:20px; /* max-height: 325px; display: grid; *//*abhaya 31993 padding-bottom 100px to 20px*/}
	#slistChecks.menu{ column-count: 2}
	.menuUl{ display: inline-flex; width: 100%; margin-bottom:5px; break-inside:avoid-column; -webkit-column-break-inside:avoid; column-break-inside:avoid; moz-column-break-inside:avoid; }
	.menuUl label{width: 100%; height: 100%;}
		.menuUl .expandable{width: 100%;}
		.menuUl label{width: 100%;}
		.menuLi{margin-top:5px; list-style: none; }
	.sListMenu{	background:var(--bgcol4); border-radius:50px; transition: background 300ms}
	.sListMenu .menuName{display: inline-block; width: calc(100% - 35px);}
	.sListMenu::before, .labelSlist::before{margin-left: unset !important;}
		.sListMenu:hover{background:#DDD!important; }
			.expandable .sListMenu:hover,.expandable.on .sListMenu{ background:color-mix(in srgb, var(--bgcol4), #000 5%)!important; font-weight: 900}
	.labelSlist{ padding: 0px 5px 0px 10px;  line-height: 31px!important; height:33px; margin: 0; border-radius:50px;}
		.labelSlist:hover{ background:var(--bgcol3)!important}
		.labelSlist .inlineInput{ margin: 0;}
		.labelSlist span { width:75%; display:inline-flex; line-height:13px!important; transform:translateY(-40%); position:relative; top:6px; }
		.labelSlist strong.smallText { margin:0 0px 0 12px; position:relative; }
	#slistChecks{overflow-y: auto; /**max-height: 400px;**/}
		form #slistChecks input.inlineInput{margin: -2px 3px; line-height: 20px;}
		form #slistChecks:not(.menu) input.inlineInput{margin: -2px 0;}
		input:not(:checked)+.labelSlist .dynamic{display:none}
	#slistContent{min-height:35vh;}
	#slistContent .disabled input.inlineInput, #slistContent .disabled label strong.blue { color: rgba(0,0,0,0.3)!important; }
	#slistFooter .drop { position:fixed; min-width:135px; transform:translate(-37px, -30px); left:unset; }
	#downloadSlistOrder{pointer-events: all !important;}

/**********WASTE CALC***************/
#wastePortionTick{ margin-top:34px; margin-bottom:10px;position: absolute; top:141px; overflow-y: auto;}
	#wastePortionTick p{margin:5px 24px 10px;width: 430px;}
	#wastePortionTick p input{width: 80px; margin-right:5px; border: solid 2px #EEE!important;}
	#wastePortionTick #recYieldList{display:none;}
	#wastePortionTick.noCosts{margin-top: -32px;}
	#wastePortionTick p span{cursor:pointer;}
	#wastePortionTick label[for="usableYield"]{margin-top: 8px;}
#prWastePer{margin-left: -2px;}
#portionInputWaste{margin-top: -38px;text-align: left;padding-left: 10px;}

#confirmbox #recYieldList{ max-height:300px; overflow-y:auto; margin-right:-50px; }
	#confirmbox #recYieldList .spacer{ padding:0; line-height:19px; font-style: normal; text-align: left; margin-bottom: 10px;  margin-right:20px;}
	#confirmbox #recYieldList .card:hover {background-color: #E9E9E9; color: #555; box-shadow: 1px 1px 1px rgb(0 0 0 / 20%);}

.ptWasteLog.pillform .col{width: 90%; margin: 0 auto;}
.ptWasteLog.pillform select {text-indent: 40px;}
.ptWasteLog.pillform select option {text-indent: 10px;}
.wasteLogComboBox{width: 50px; height: 50px; line-height: 50px; position: absolute; border-radius: 50px; background-color: var(--h2col); color:#FFF; z-index: 1; top: 20px;}
.ptWasteLog.pillform svg {color: white}
#confirmbox #recYieldList .card:hover {background-color: #E9E9E9; color: #555; box-shadow: 1px 1px 1px rgb(0 0 0 / 20%);}
.confirmBox #recYieldList .counter{margin:0 5px 0 0;}
#tab-SmartPortions>div.ptWasteSet{display:table; opacity: 0; pointer-events: none; width:100%; height: 70px; position: absolute; top:calc(100% - 3px); left:0px; background-color:#FFF; margin-left: 0px; transition: opacity 250ms, transform 250ms; transform:translateY(-10px); min-height: 70px!important;  border-radius:50px; z-index:-2; padding:0 20px; margin-top:10px;}
	#tab-SmartPortions>div.ptWasteSet.on{opacity: 1; pointer-events: all; box-shadow:0px 8px 20px 0px #999; transform: none;}
	.ptWasteSet>label { line-height:4px!important; display:table-cell; color:#AAA; padding:20px 5px; text-align:left; vertical-align:top; background:transparent!important; white-space:nowrap; }
	.ptWasteSet>label:first-of-type{ width:43%; padding-right:3% }
		#tab-SmartPortions .blueline { font-weight:bold; margin:3px 0 0 0; color:var(--hcol); line-height:100%; }
		#tab-SmartPortions .blueline.off{color:#777!important;}
		#tab-SmartPortions>.smartPcontainer:first-child + .entrybox + .ptWasteLog {margin-top: 45px;}
		#tab-SmartPortions>div.ptWasteLog{pointer-events: all; box-sizing: border-box; margin: 10px 0; padding-left: 20px; padding-right: 5px; width:100%; height: 80px; background-color:#FFF; border-radius: 30px;}
		#tab-SmartPortions>div.ptWasteLog label{color: var(--h2col)}
		#tab-SmartPortions>div.ptWasteLog .ptWasteLogFields{width: 50%; display: inline-block; margin-top: 10px;}
		#tab-SmartPortions>div.ptWasteLog .ptWasteLogFields .droparrow:after {top: 5px;}
		#dropPortionMenu.maximised #tab-SmartPortions .ptWasteLog {width:768px; height: 80px; }
		.ptWasteSet label>i{ margin-left: 31px;}
		.ptWasteSet .unitInput{width: 50px; border: solid 2px #EEE!important;}
		.ptWasteSet .unitInput.off{color:#777!important;}
		.ptWasteSet .unitInput:first-of-type{margin-right: -1px}
		#ptWasteSet input[type=checkbox]:checked+label.disabled::before{background-color: gray;}
		.entrybox span .disabled {display:none;}
		#ptWasteSet .smallText a.disabled{background-color: transparent;}

#ineWasteBox{width:98.5%; min-height:29px; height: 83px; position:absolute; top:calc(100% - -37px); background-color:transparent;}
	#ineWasteBox div{height: 56px; position: absolute;min-height: 56px;top: -22px}

.waste .td-perc{/* font-size: 16px; */ color: #aaa; text-align: center;font-weight: bold;}
.waste .td-cost{color: #aaa;font-style: italic; text-align: center;font-weight: bold;}
.waste .td-name p {margin-left: 7px;}

#adsNewCustomer{ position:fixed; z-index:4; background:var(--h3col); color:#FFF; bottom:0; left:50%; line-height:19px; transform:translateX(-50%); font-weight:bold; border-radius:50px 50px 0 0; border-radius: 30px 30px 30px 30px; bottom: 30px;width: 549px;text-align: center;max-height: 45px;}
	#adsNewCustomer span{margin: 4px auto; display: block;font-size: 12px;}
	#adsNewCustomer a{cursor: pointer;}
	#adsNewCustomer .onboarding a:last-child{position: fixed; right: 12px;}
	#adsNewCustomer .onboarding{width: 447px;}
	#adsNewCustomer span.oneLineText a:last-child{margin: -9px 77px;position: fixed;}
	#adsNewCustomer a.underline, span.underline{text-decoration: underline!important;}
	#adsNewCustomer input[type=checkbox] { display: inline-block!important; margin-right: 2px;}
	#adsNewCustomer span.oneLineText p{font-size: 11px;font-weight: normal;color: #999;position: fixed;margin: 5px auto!important;width: 100%;}

.referralBox { text-align: center; }
	.referralBox input{width: 438px; margin: 0}
	.referralBox .share{display: inline-flex;}
	.referralBox a{width: 108px;border-radius: 0px; cursor: pointer;}
	.referralBox .circlePrice{margin-right: 20px; transition:transform 200ms;}
	.referralBox .circlePrice:hover{margin-right: 20px; transform: scale(1.1)}

#menuReferralShare{display: grid; vertical-align: middle; margin: 0; float: none;}
	#menuReferralShare a{ line-height: 42px; padding:0px 20px; color:#FFF; white-space: nowrap; transition: background 300ms}
		#menuReferralShare a:hover{color:#FFF; background:var(--h2col);}
		#menuReferralShare li a img{width:15px; margin-top: -1px; background-color: white;border-radius:50px; padding: 4px;border:0;vertical-align:middle;margin-left: -12px; margin-right: 7px;}
		#menuReferralShare li ul a{text-align: left;}
	#menuReferralShare li ul li a.sel{color:var(--bgcol3);}
	#menuReferralShare li{display:block; float:left; position: relative;}
	#menuReferralShare li ul li{float:none;}
	#menuReferralShare li ul{max-height:0; width: 150px; padding-bottom:0; transition:max-height 300ms, opacity 200ms; position:absolute; z-index:10; bottom: 0; opacity: 0; overflow: hidden;}
		#menuReferralShare li:hover ul{max-height:320px; background: #555; border-radius: 20px 20px 0 0; opacity: 1}
	#contactmsg{display: block; color: #666;}

	.disabled #foodlabel-labelRating .lnutName span{pointer-events:auto !important;}/*allow click on the help button*/
	.marLeft {margin-left: 20px;}
#quickStartAI{padding:50px;}

	.exportOptionLabel{display: inline-block;}

#viewMenuBtn { width: 90px; }
.options .submenu.mini.viewMenuDrop { width: 500px; height:350px; }
	.viewMenuDrop.on:before { content:'\23f7'; position:fixed; color:var(--h2col); font-size:20px; top:19px; right:175px; }
	.viewMenuDrop img{ max-width:100%; }
	.viewMenuDrop .tabMenu { width:200px; position:absolute; height:100%; margin:-20px; background:#FAFAFA; }
		.viewMenuDrop .tabBtn { padding:56px 30px; height:49.5%; display:block; line-height:20px; margin-bottom:2%; }
			.viewMenuDrop .tabBtn img{ display:block; width: 130px; }
	.viewMenuDrop .tab { margin-left:190px; line-height:140%; width:270px; height:280px; }
	.viewMenuDrop .tab .counter+span{ margin-right:5px; }
	.viewMenuDrop .tab .headingText{ margin-bottom:15px; }
	.viewMenuDrop .tab p{ width:250px; text-align:center; line-height: 150%;}
	.viewMenuDrop .raisedList>*:not(.notRaised){border-radius: 25px !important;}
	.viewMenuDrop .tabBtn.on:after { content:""; position:absolute; right:-14px; top:50%; margin-top:-7px; border:solid 7px transparent; border-left-color:var(--h3col); }
	#menuSearchDrop .select .selected{line-height: 47px;}
	#menuSearchDrop svg{ margin: 15px 15px 0; position: absolute; }

	#rdalabel-stressFactorPerc{padding-top:32px;}
	.mealsxday #mainnest .options #exportmenu .bluebtn {margin-left:-30px !important;}
	.mealsxday #mainnest .options #exportmenu li ul {margin-left:-30px !important;}
	#logTableWrap{ float:left;margin-bottom:10px;}
	#logTableWrap:has(#foodUnavailable) + .spacer > a, .pane.log.activity #logTableWrap + .spacer > a {display:none}
	.pane.log:not(.activity) #logTableWrap:not(:has(#foodUnavailable)) + .spacer > a {display:block;position: absolute;left:15px}
	#allergenError .helpbtn {float: left !important; margin: 0px 5px 0px;}
	.td-allergen{padding: 5px 35px 5px 10px; min-width: 360px !important;}
	#panelWarning p{padding: 0px 100px 0px 5px !important;}
	.td-allergen .allergenicon:not(.may-contain) span {width: 30px; height: 30px; line-height: 12px; margin-top: 5px;}
	#ingredientBody .allergenicon{margin: 0px!important;}
	.disabled .td-allergen .delbtn{display: block !important;}
	.td-allergen .pillbtn { margin: 0px 20px; }
	#pane-maindiv.recipe #tab-CustomFields td{ min-width:-webkit-fill-available}
	.disabled .options #mp_monitors{display: none!important;}
	.disabled .options #tabquickdish .btn,.disabled .options #tabtenkite .btn{display: table!important;}
	.view-menu #footer #menuFixedFooter .mon:first-of-type{width:85px !important; border:0!important;}
	#aBox #tab1 {width: 85%;text-align: center;margin-left: 50px;}
	#menuSummaryBox .subAllergens{ display: none; }
	#menuSummaryBox .subAllergens.on { display: block;  }
	#menuSummaryBox .subAllergens a { color: #444 ; font-size: 10px; text-transform: uppercase; font-weight: 900}
	#menuSummaryBox #aBox .subAllergens { margin-left: 40px;  }
	#menuSummaryBox #sub-c-nuts.subAllergens { margin-left: 70px; }
	#menuSummaryBox #aBox #sub-c-nuts.subAllergens { margin-left: 120px; }
	#menuSummaryBox .subAllergens .scroll { position: absolute; margin-top:20px; }
	#menuSummaryBox .subAllergens .scroll:before { content: ''; border-style: solid; border-width: 0 6px 7px 6px; border-color: transparent transparent #FFF transparent; position: absolute; top: 34px; left: 37px; z-index: 2; }
	#menuSummaryBox .subAllergens ul { overflow-y: auto; max-height: 220px; background: #FFF; border-radius:20px; width: 160px; list-style: none; position: absolute; margin-top: 40px; margin-left: 17px; box-shadow:0 5px 30px rgba(0,0,0,0.3);z-index: 1; }
	#menuSummaryBox .subAllergens ul li { text-align:left; padding:0 12px; line-height:40px; }
	#menuSummaryBox .subAllergens ul li svg { opacity:0; width:27px; height:27px; margin-right:10px; color:var(--hcol); transform: scale(0.8); transition: transform 300ms, opacity 300ms}
	#menuSummaryBox .subAllergens ul li.on svg{opacity: 1; transform: scale(1);}
	#menuSummaryBox .subAllergens ul li:hover { background-color: #E9E9E9; }
	#menuSummaryBox .subAllergens ul li.on { background-color: #EEE; }
	#menuSummaryBox #aBox.on .allergenicon.textureicon:not(.enabled){opacity:0.3; pointer-events: none;}
	#menuSummaryBox #aBox.on .allergenicon.on{ background:#CCC; color:#222; border-radius:10px;}
	#menuSummaryBox #aBox.on .allergenicon.on span{ border:solid 3px #FFF; box-shadow:1px 1px 5px rgba(0,0,0,0.15);}
	#menuSummaryBox #aBox.on .allergenWrapper{position:relative;display:inline;}
	#menuSummaryBox .allergenicon.texture6 span{background:#a0c3e6;}
	#menuSummaryBox .allergenicon.texture3 span{background:#FCCA2B;}
	#menuSummaryBox .allergenicon.texture4 span{background:#62B36C;}
	#menuSummaryBox .allergenicon.texture2 span{background:#f492a2;}
	#menuSummaryBox .allergenicon.texture5 span{background:#f7941e;}
	#menuSummaryBox .allergenicon.texture7 span{background: #444;}
	#menuSummaryBox .allergenicon.texture1 span{background: #777;}
	#menuSummaryBox .allergenicon.texture0 span{background: #FFF; color: #999}
	#menuSummaryBox #aBox .allergenicon span{border: solid 2px #EEE;height:35px; line-height:35px;}
	#menuSummaryBox #aBox .allergenicon span{margin-left:0px;}
	#menuSummaryBox #aBox:not(.on) .allergenicon.on, #aBox:not(.on) .tag.on, #aBox:not(.on) .tab{display:inline-block; vertical-align:top;}
	#menuSummaryBox #aBox .allergenicon.on, #aBox.on .allergenicon{width:auto; opacity:1; margin:0 5px; border-radius: 15px;}
	#menuDietPref{ display:inline-block; position: relative;background:#EEE; margin:0 10px; border-radius:20px; text-align:center; width:45%; white-space:normal; padding:6px 10px; box-sizing:border-box; transition: padding 300ms, border-radius 300ms; height:100px; cursor:pointer; }
	.greyOut{opacity: 0.3; pointer-events: none;}
	#menuDietPref .allergenicon span{width:30px; height:30px; line-height:20px;}
	#menuDietPref .allergenicon {width:30px;}
	#menuSearchDrop {width:50%;float:left;}
	#menuSearchDrop .clearSearch{top:6px;}
	#menuDietPref .allergenicon.texture span {font-size: 12px;}
	#menuDietPref .pillbtn.greyback{ color:#444}
	.dietWarningMsg {height: 40px; line-height: 40px; font-size: medium; font-size: 12px; font-weight: bold; color: var(--h3col);width: 80%; text-align: center; margin: 20px; cursor: pointer;}
	.dietWarningMsg .counter {margin:10px -10px 0px 10px}
	.theroticalOrderingCP{width:355px;float:left;}
	.theroticalOrdering{width:385px;float:left;padding-left:10px; transition: opacity 300ms;}
	#footer.minimised .theroticalOrdering{ opacity:0; }
	.propheadingC{display:block;}
	#orderTotals .dietWarningMsg {font-size: 12px; width: 90%; margin: 2px;}
	#orderTotals div.dietWarningMsg.on{color: white; background-color: var(--h3col);}
	.cselect{border-radius:50px; text-align:center; width:200px; margin: 10px;}
	.order .showconflictmsg{ font-size: 10px; color:var(--h3col); text-align: center; font-style: italic; white-space: normal; }
	.dietWarningMsg+.showconflictmsg{margin-top: -17px;}



/*style for integrations menu*/
#integrations{ width: calc(100vw - 260px); white-space:normal;}
	#integrations .options{white-space:nowrap;}
	#integrations .imenu{background: #eee; float: left; width: 200px; max-width: 200px; height: 100vh; overflow-y: overlay; overflow-x: hidden; scrollbar-width:none; }
	#integrations .imenu a{display:block; padding:20px; color:#333; transition:background 300ms; border:0; text-transform: uppercase; font-weight: bold; font-size: 9px;}
	#integrations .imenu a:hover{background:#DDD;}
	#integrations .imenu a.on{color:#1d76bb; background:#FFF; position:relative; border-left:solid 4px #1d76bb!important}
	#integrations .imenu a .counter{ margin-top:-4px; position: relative;}
	#integrations .imenu a .counter:not(.on){ display: none;}
	#integrations .icontent {padding: 20px; width: 774px; font-size: 16px; line-height: 1.6; color: #333; float: left;}
	#integrations .icontent .tab{ max-width:800px; }
	#integrations .apidescription p {margin: 0 0 10px; width: 100%; overflow-wrap: break-word; word-wrap: break-word; white-space: normal;}

	#integrations .iappheader { margin: 20px 50px 0 20px; min-height:100px; padding-top:20px; white-space: normal; }
	#integrations .icon { max-width: 80px; max-height: 80px; float: left; margin: 20px; background-size: contain; background-repeat: no-repeat; background-position: center; }
	#integrations .hflex { align-items: start;}
	#integrations h5.hflex { padding:5px 20px; line-height: 32px;}
	#integrations .small { font-size:8px!important; font-weight:bold;text-transform:uppercase; }


	#integrations .tab:not(.live) .card{filter:grayscale(1); opacity:0.6; pointer-events: none;}
	#integrations .tab:not(.live) .access:before{content:'has no access'; }
	#integrations .tab:not(.live).newApp .access:before{content:'is requesting access'; font-weight: bold; color:#226fa9 }
	#integrations .tab.live .access:before{content:'has access'; font-weight: bold; color: #F30;}
	#integrations .tab.on .access.changed:before{content:'is requesting permission changes'; font-weight: bold; color: #F60;}

	#integrations .card:not(.large) { background-image:url(/media/icon-org.gif); display:block; width:360px; }
		#integrations .card .on0{ background-image:url(/media/icon-noaccess.png); }
		#integrations .card.food{background-image:url(/media/icon-plate.png);}
		#integrations .card.label{background-image:url(/media/icon20-print-dark.gif);}

	#integrations .on0:after, #integrations .on1:after, #integrations .on2:after { content:'Can Edit'; display:block; position:absolute; text-transform:uppercase; font-size:9px; font-weight:bold; left:auto; top:14px; transition:background 300ms; color:#1d76bb; border-bottom:solid 3px #EEE; opacity:1; transition:opacity 300ms; right:45px; line-height:130%;  }
		#integrations .card .on1{ background-image:url(/media/icon-eye.png); background-position:8px center; }
		#integrations .card .on0{ background-image:url(/media/icon-noaccess.png);  background-color:#999;}
		#integrations .card.claim .on1, #integrations .card.claim .on0{ background-image:url(/media/icon-tick2.png); background-position:4px 5px; position:relative; z-index:2}
		#integrations a.changed{color: brown}
		#integrations .card:hover .on0:after, #integrations .card:hover .on1:after, #integrations .card:hover .on2:after{opacity:1;}
		#integrations .on1::after{content:'Can View';white-space: nowrap; }
		#integrations .on0::after{content:'No access'; box-shadow:none; color:#555; border:0; white-space: nowrap;}
		#integrations .disabled .on0::after{content:'For org admin only';}
	#integrations .card.menu .on1, 	#integrations .card.menu .on0 {	background-position: 10px center; }/* override for menu icon styles for #integrations */

	#integrations .history tbody{ font-size: 13px;}
	#integrations .history::-webkit-scrollbar { display: none; /* Chrome, Safari, Opera */ }
	#integrations .history { -ms-overflow-style: none; /* IE, Edge */ scrollbar-width: none; /* Firefox */}
	#integrations .dropcal{ padding:9px 25px; }
	#integrations .flatpickr-calendar.inline{background:transparent;}
	#integrations .flatpickr-calendar+.footer{ margin:20px 0 -20px 0}
	#integrations #tab-insightsform{width: 310px;}
	#integrations #LTtabs .tab{ width: auto; transform: translate(-55px,0); border-radius: 0 20px 30px 0;}
	#integrations .savedSearches { top:0; height:100%; border-right:2px solid #EEE; width:100px; }

.darkgrayback{background:#6a6969;}

.sort-icons .btn { position:absolute; bottom:1px; right:1px; }
.sort-icons .btn.desc.on { rotate:180deg; }
.resetColumn {position: absolute; bottom: 65px; right: 38px;}
.bigdrop:not(.withTemplates) .resetColumn {bottom: 10px; right: 105px; background-color: white; border-radius: 500px; padding: 0.5rem;}
.resizer {position: absolute; top: 0; width:5px !important; height: 100%; cursor: col-resize; z-index: 2; transition:background 250ms}
.resizer:hover { background: var(--h3col); }
.resizer.rightR {right: 0;}
.resizer.leftL {left: 0;}
.pane.folder .fixedHeader >div.column.dragOver { border-left: solid 5px var(--h3col) !important; transition:border 250ms }
#settingsVisualURL {display: inline-block; max-width: 100%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap; vertical-align: middle;}


#findReplaceBox .icon { background-color:var(--hcol); width:50px; height:50px; margin:auto; display:flex; justify-content:center; /* Centers horizontally */ align-items:center; text-align:center; border-radius:50%; overflow:hidden; }
#findReplaceBox .icon svg { display:block; vertical-align:middle; color:white; margin-left:-38%; width:30px !important; }
#findReplaceBox .icon-item{ max-width:33%; }
#findReplaceBox .icon-item *{ cursor:pointer; }
#findReplaceBox #usageButtons { text-align:center; }
#findReplaceBox #usageButtons button { display:block; min-width:100%; padding:0; margin-bottom:5px; background-color:lightgray; color:var(--txtcol)}
#findReplaceBox #usageButtons button:hover, #findReplaceBox #usageButtons button:active, #findReplaceBox #usageButtons button:focus{ color:white; background-color:var(--hcol); }
#findReplaceBox .icon-desc {	margin-top:5px; }
#tab-AdvancedSearch .advActionButtons:nth-of-type(2){	margin-left:5px;	width:30px;	height:27px;	line-height:28px}
#tab-AdvancedSearch .advActionButtons {	max-width:35px;	max-height:35px;	line-height:40px; }
#searchTabBTN2 { background:unset; color:unset; padding:unset;	margin:-4px 0 0 2px; }
#searchTabBTN2:hover, #searchTabBTN2:active{	color:black; }
.mySavedSearchOnHoverBtn:first-of-type{	right: 35px;}
.mySavedSearchOnHoverBtn{	margin:0 2px 0 2px; visibility:hidden; position: absolute; right: 10px; }
.mySavedSearchOnHoverBtn svg{	width:12px!important; }
#onHoverRunSavedSearchBtn{	line-height:2.2}
#treemysavedsearches1 > li:hover .mySavedSearchOnHoverBtn{	visibility:visible; }
#treemysavedsearches1 li{	position:relative; }



.suppLogo { display:flex; align-items:center; width:200px; height:200px; top:-25px; right:-40px; border-radius:100%; /* overflow:hidden; */ position:absolute; padding:20px 35px 20px 20px; }
	.suppLogo .footer { position:absolute; left:0; right:0; bottom:0; }
	.suppLogo+#exportmenu{ margin-right:150px;}
/*SUPPLIER SEARCH PANE*/
	.options.supplier-options #LTtabs{position: relative;width: 100%;}
	.options.supplier-options .searchdiv {width:385px}
	.options.supplier-options .searchdiv.animating #orderSearchDrop * {transition: none !important;}
	.options.supplier-options .searchdiv.animating #orderSearchDrop {overflow-x: visible; overflow-y: clipR;}
	.options.supplier-options .searchdiv #orderSearchDrop {will-change: max-height; transition: max-height 200ms;}
	.options.supplier-options .searchInput {width:380px; padding-right: 35px !important;cursor:text;}
	.options.supplier-options .tabMenuTimeFilter {width: 100%;height: 100%;padding: 0;}
	.options.supplier-options #LTtabs .tabmenu>a{flex-grow: 1;padding: unset !important;border-top-left-radius: 0;border-bottom-left-radius: 0;}
	.options.supplier-options #LTtabs .flatpickr-calendar{margin-bottom: 0;}
	.options.supplier-options #LTtabs .droparrow:after {top: 9px;}
	.options.supplier-options .split2 #cpDrop, .options.supplier-options #LTtabs{z-index:2;}
	.options.supplier-options .split2 #cpDrop, .options.supplier-options #LTtabs.disabled{filter: grayscale(1);}
	.options.supplier-options .btn-container {display: inline-flex; justify-content: space-between; width: calc(100% - 395px - 245px);vertical-align: top;}
	.options.supplier-options .selectdrop .allergen .icon {fill: #FFF; left: unset; right: 10px;}
	.options.supplier-options [class*='split'] .select, .options.supplier-options [class^='split'] input {border: solid 2px #EEE;position: relative;}
	.options.supplier-options .split .select, .options.supplier-options .split input {border-radius: 50px 0 0 50px !important;border-left: solid 2px #EEE;}
	.options.supplier-options .split2 .select, .options.supplier-options .split2 input {border-radius: 0 50px 50px 0 !important;border-right: solid 2px #EEE;}
	.options.supplier-options [class*='split'] .select:hover, .options.supplier-options [class*='split'] input:hover {border-color: #DDD !important;}
	.options.supplier-options [class*='split'] .selected::after{border-radius: unset;}
	.options.supplier-options ~ #validationPanel .validationRule.complete p { color:#AAA; }
	.options.supplier-options ~ #validationPanel .validationRule.complete p::before { content:'✔'; color:var(--hcol); border:solid 2px currentColor; margin-top:-1px; background:transparent; }
	.options.supplier-options ~ #validationPanel .spacer {display: none;}
	.options.supplier-options ~ #validationPanel .progress-container {position: absolute; right: 15px; left: 15px; bottom: 0;}
	.options.supplier-options ~ #validationPanel:has(.validationRule.complete) .spacer {display: block; order: 1;position: relative;}
	.options.supplier-options ~ #validationPanel:has(.validationRule.complete) .spacer > span {position:absolute; left:-12px; top:-3px; background:var(--hcol); width:24px; height:24px; border-radius:100%; display:flex; align-items:center; font-size:14px; justify-content:center;}
	.options.supplier-options #folderPublishBTN.reCheck:not(.approve):not(.publish):not(.delete) {visibility: hidden !important; transition: none;}
	.pin-search .options.supplier-options + #pinSavedSearchPanel #savedSearchMaximesed{width: 175px;height: 100%;}


/*PROGRESS BARS*/
progress {  -webkit-appearance:none; appearance:none; border:none; width:100%; color:var(--h3col); background-color:rgba(0,0,0,0.1); border-radius:50px; }
progress.xsmall{ height:6px; }
progress.small{ height:8px; }
progress.medium{ height:12px; }
progress.large{ height:20px; }
progress.xsmall ~ .progress-label {display: none;}
progress.small ~ .progress-label {font-size: 9px;line-height: 8px;}
progress.medium ~ .progress-label {font-size: 11px;line-height: 12px;}
progress.large ~ .progress-label {font-size: 14px;line-height: 20px;}
progress::-webkit-progress-bar {  background-color:transparent; }
progress::-webkit-progress-value {  background-color:currentColor;  border-radius:50px; }
progress + .progress-label{font-weight: bold; color: white; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-size: 12px;}
.progress-container {display: none; position: relative; line-height: 0; }
.progress-container.on {display: block;}
#advSearch #advSearchIng input::placeholder{ text-transform: unset; }
#pane-logSearch .replaceDelistedError {display: none;}