/*global*/
*{
	font-family:Helvetica, Arial, sans-serif;
}
body{
	margin:0;
	padding:0;
	background:#e5e7f0;
	background-image: linear-gradient(to bottom, #FFFFFF, #e5e7f0);
	background-size: 100% 870px;
	background-repeat: no-repeat;
	background-position: 0 0;
	color:#666666;
	font-size:14px;
	line-height:18px;

	--stickyHeaderTop:120px;
}
a{
	color:#666666;
	border:0;
}

a.linkStyle2{
	color:#fad5bc;
	text-decoration: none;
}

	a.linkStyle2:hover{
		text-decoration: underline;
	}


a.linkStyle2 strong{
	color:#666666;
	text-decoration: underline;
}


img{
	border:0;
}
a:hover{
	text-decoration:underline;
}
p{
	margin:0;
	padding:0;
}
*+p{
	margin-top:1em;
}
h1 {
	font-size: 28px;
	line-height: 28px;
}

.content{
	width:950px;
	margin:0 auto;
	position:relative;
}
div.clr, div.clear{
	clear:both;
	font-size: 1px;
	line-height: 1px;
	height: 0;
}

div.clr2{
	clear:both;
	padding-top:3em;
}

.lowercase{
	text-transform: lowercase;
}

.hidden{
	display:none;
}
hr{
	clear:both;
	margin-top:10px;
	margin-bottom:10px;
	border:0;
	width:100%;
	height:1px;
	background:#357d98;
}

hr.full{
	margin:30px -30px 0 -30px;
	width:auto;
}

.noscreen{
	display:none;
}
#website{
/*	background:url(images/top.jpg) no-repeat;*/
	background-image: linear-gradient(-45deg, #FFFFFF, #CCD1E2);
	text-align:center;
	width: 100%;
	height: 310px;
}

.whole{
	position:relative;
	width:990px;
	margin:0 auto;
	text-align:left;
}

.btt{
	margin-right:20px;
	float:right;
	color:#003883;
	text-decoration:underline;
}

/*welcomelist*/

#welcomelist li{
	margin-top:1em;
}

/*Help*/
.helpme, .helppop{
/*	display:inline-block;*/
	background:url(images2/interogation.png);
/*	background:url(images/interogation.gif) #AABD26;*/
	width:30px !important;
	height:30px !important;
	cursor:help;

	float:right !important;
	margin-right:15px;
}

/*Page border*/

.pborder{
	position:fixed;
	top:0;
	width:15px;
	height:100%;
	background:#003883;
	z-index:50;
}
.pborder.left{
	left:0;
}
.pborder.right{
	right:0;
}
.addbtn,
.flr{
	text-align:right;
	float:right;
}

.btnAjout+.btnAjout{
	margin-right:10px;
}

/*Head*/

#header{
	position:relative;
	height:235px;
}
#head{
	position:relative;
	width:950px;
	height:235px;
}
#logo{
	position:absolute;
	top:0;
	left:0;
	width:245px;
	height:235px;
}

/*topmenu*/

ul#topmenu{
	display:block;
	position:absolute;
	top:0;
	right:0;
	margin:0;
	padding:0;
	width:705px;
	height:50px;
	margin-top:75px;
	text-align:right;
	font-size:12px;
	list-style:none;
}
ul#topmenu li{
	margin:0;
	padding:0;
	list-style:none;
	float:right;
	margin-right:10px;
	padding-right:10px;
	border-right:2px solid #ee7d11;
}
ul#topmenu li:first-child{
	border:0;
	margin:0;
	padding:0;
}

/*Menu*/

#logo2{
	z-index:9;
	height:60px;
	width:245px;
	background:#FFFFFF;	
	position:absolute;
	top:130px;
	right:510px;
	font-size:15px;

	padding: 10px;
	box-sizing: border-box;
}

#logo2 img{
	float:left;
/*	margin-top:-23px;	*/
}

#logo2 div{
	line-height:60px;
	float:right;
	width:185px;
	text-align:left;	
	color:#003883;
}

#logo2:after{
	position:absolute;
	top:60px;
	left:0px;
	content:" ";
	display:block;
	width:350px;
	height:15px;
	background:url(images/shmenua.png) top left no-repeat;
	pointer-events:none;
/*	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='shmenua.png', sizingMethod='scale');
	background:none !important;*/
}

ul{
	margin-top:0.3em;
}

#logo2.fixedSubbar:after{
	top:120px;
}

#menu{
	padding:20px 0;
	position:absolute;
	top:130px;
	right:20px;
	width:735px;
	height:20px;
	background:#ee7d11;
	z-index:10;
	color:#FFFFFF;
}

#menu:after{
	position:absolute;
	top:60px;
	right:0px;
	content:" ";
	display:block;
	width:350px;
	height:15px;
	background:url(images/shmenub.png) top right no-repeat;
	pointer-events:none;
}

#menu.fixedSubbar:after{
	top:120px;
}

#menu ul{
	display:block;
	padding:0;
	margin:0 auto;
	list-style:none;
	text-align:center;
}
#menu li{
	font-size:15px;
	display:inline;
	height:20px;
	line-height:20px;
	color:#FFFFFF;
	text-transform:uppercase;
	color:#FFFFFF;
	margin:0;
	padding:0;
	list-style:none;
	margin-left:15px;
	padding-left:15px;
	border-left:2px solid #003883;
}
#menu div.twoline{
	text-align:center;
	font-weight:bold;
	position:relative;
	top:-10px;
}
#menu li:first-child{
	border:0;
	margin:0;
	padding:0;
}
#menu a{
	color:#FFFFFF;
}
#menu a:hover, #menu a.active {
	color:#003883;
	text-decoration:none;
}

#topzone.fixedSubbar{
	border-bottom:60px solid #7f8cb7;
}

/*Bar*/

#bar a{
	color:#FFFFFF;
}


ul#bar{
	display:block;
	width:990px;
	height:75px;
	color:#FFFFFF;
	font-size:25px;
	margin:0 -20px;
	padding:0;
	list-style:none;
}
ul#bar li{
	float:left;
	padding:0;
	margin:21px 0 0 0;
	list-style:none;
	height:54px;
	line-height:54px;
	background:#99a3c6;
}
ul#bar li.selected{
	background:#003883;
}

ul#bar li.tvb{
	width:30px;
	background:url('images/tvb.png');
}
ul#bar li.tnb{
	width:30px;
	background:url('images/tnb.png');
}


ul#bar li.t.first{
	margin:0;
	padding:21px 0 0 0;
/*	width:50px;*/
/*	background:url('images/tbv.png');*/
	background: #99a3c6;
	border-top-left-radius: 20px;
	margin: 21px 0 0 20px;
	padding: 0;
	width:30px;
}
ul#bar li.t.selected.first{
	margin:0;
	padding:21px 0 0 0;
/*	width:50px;*/
/*	background:url('images/tbn.png');*/
	background: #003883;
	border-top-left-radius: 20px;
	margin: 21px 0 0 20px;
	padding: 0;
	width:30px;
}
ul#bar li.t.last{
	margin:0;
	padding:21px 0 0 0;
	width:50px;
/*	background:url('images/tvb.png');*/
	background: #99a3c6;
	border-top-right-radius: 20px;
	margin: 21px 20px 0 0;
	padding: 0;
	width:30px;
}

	ul#bar li.t.first::before,
	ul#bar li.t.last::before,
	ul#bar li.t.first.selected::before,
	ul#bar li.t.last.selected::before,
	ul#bar li.selected+li.t.last::before{
		display: none;
	}

ul#bar li.t{
	width:30px;
/*	background:url('images/tvv.png');*/

	background:#99a3c6;
	position: relative;
}

	ul#bar li.t::before{
		content: "";
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 20px;
		height: 100%;
		border-top-right-radius: 20px;
		background: #99a3c6;
		box-shadow: 5px 5px 5px rgba(0,0,0,.5);
	}

ul#bar li.t.i{
	width:30px;
/*	background:url('images/tvv2.png');*/
}

	ul#bar li.t.i::before{
		top: 0;
		right: 0;
		left: auto;
		border-top-right-radius: 0;
		border-top-left-radius: 20px;
		box-shadow: -5px 5px 5px rgba(0,0,0,.5);
	}

ul#bar li.t.selected{
	width:30px;
/*	background:url('images/tvn.png');*/
}

	ul#bar li.t.selected::before{
		content: "";
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		width: 20px;
		height: 100%;
		border-top-left-radius: 20px;
		background: #003883;
		box-shadow: 0 0 5px black;
		box-shadow: -5px 5px 5px rgba(0,0,0,.5);
	}

ul#bar li.selected+li.t{
	width:30px;
/*	background:url('images/tnv.png');*/
}

	ul#bar li.selected+li.t::before{
		content: "";
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 20px;
		height: 100%;
		border-top-right-radius: 20px;
		background: #003883;
		box-shadow: 5px 5px 5px rgba(0,0,0,.5);
	}

ul#bar li.selected+li.t.last{
	margin:0;
	padding:21px 0 0 0;
/*	width:50px;*/
/*	background:url('images/tnb.png');*/
	background: #003883;
	border-top-right-radius: 20px;
	margin: 21px 20px 0 0;
	padding: 0;
	width:30px;
}


/*subbar*/

#subbar{
	background:url(images/shside.png) top center repeat-y #7f8cb7;
	height:60px;
	overflow:hidden;
	z-index:6;
}
#subbar .content{
	width:890px;
	padding:20px 30px;
	height:20px;
	line-height:20px;
	text-align:left;
	background:#003883;
	color:#FFFFFF;
	font-size:18px;
	font-weight:bold;
}

#subbar ul{
	margin:0;
	padding:0;
	display:block;
	float:left;
	list-style:none;
}

#subbar li{
	display:block;
	float:left;
	list-style:none;
	border-left:1px solid white;
	margin:0 10px 0 0;
	padding:0 0 0 10px;
}
#subbar li:first-child{
	margin:0;
	padding:0 10px 0 0;
	border:0;
}

#subbar a{
	color:#FFFFFF;
}

/*Options*/

#subbar #options{
	display:block;
	float:right;
	color:#FFFFFF;
}

#subbar.fixed{
	position:fixed;
	top:60px;
	left:0;
	width:100%;
	background:transparent;
}

/*Jumpbar*/
.addshadow{
	padding:0 20px;
	background:url(images/shside.png) top center repeat-y;
	position:relative;
}

.addshadow.top:before{
	position:absolute;
	top:-25px;
	left:0px;
	content:" ";
	display:block;
	width:990px;
	height:25px;
	background:url(images/shtop2.png) top center no-repeat;
	pointer-events:none;
}

.addshadow.bottom:after{
	position:absolute;
	bottom:-25px;
	left:0px;
	content:" ";
	display:block;
	width:990px;
	height:25px;
	background:url(images/shtop2.png) bottom center no-repeat;
	pointer-events:none;
	z-index:2;
}


ul#jumpbar{
	display:block;
	/*width: 890px;*/
	/*padding: 20px 30px 20px 30px;*/
	width: 950px;
	padding: 20px 0px 20px 0px;
	height: 20px;
	line-height: 20px;
	text-align: left;
	background:#33478d;
	text-align:center;

	margin:0;
	list-style:none;
}
ul#jumpbar li{
	display:inline;
	font-size:15px;
	height:20px;
	line-height:20px;
/*	text-transform:uppercase;*/
	color:#FFFFFF;
	margin:0;
	padding:0;
	list-style:none;
	margin-left:10px;
	padding-left:10px;
	border-left:2px solid #ee7d11;
}
ul#jumpbar li:first-child{
	border:0;
	margin:0;
	padding:0;
}
#jumpbar a{
	color:#FFFFFF;
}
#jumpbar a:hover, ul#jumpbar a.active {
	color:#003883;
	text-decoration:none;
}

/*footer*/

#footer{
	margin:100px 0 50px 0;
}
#footer ul{
	margin:0 0 0 30px;
	padding:0;
	list-style:none;
}
#footer ul li{
	float:left;
	color:#FFFFFF;
	color:#FFFFFF;
	margin:0;
	padding:0;
	list-style:none;
	margin-left:10px;
	padding-left:10px;
	border-left:1px solid #357d98;
}
#footer ul li:first-child{
	border:0;
	margin:0;
	padding:0;
}
#footer a{
	color:#000000;
}
#footer #rights{
	margin-left:30px;
	font-size:11px;
	line-height:12px;
}

/*page*/

div.addshadow:first-child div.box{
	margin-top:0;
	border-top:0;
}

div.box{
	text-align:left;
	border:1px solid #003883;
	background:#FFFFFF;
	color:#003883;
	padding:30px 29px 30px 29px;
	margin-top:30px;
	width:890px;
}

div.box>h1, div.box>h2{
	float:left;
	margin-top:0;
	padding-top:0;
}

/*dropdown*/
ul#dd{
	margin:0;
	padding:0;
	list-style:none;
	display:none;
	border:1px solid #DBDBDB;
	border-top:0;
	position:absolute;
	z-index:100;
	top:194px;
	left:50%;
	padding:0 10px;
	background:#FFFFFF;
}

ul#dd li{
	margin:0;
	padding:0;
	list-style:none;
	display:block;
	border-top:1px solid #DBDBDB;
	height:40px;
	line-height:40px;
}
ul#dd li:first-child{
	border-top:0;
}
ul#dd a{
	margin:0 -10px;
	display:block;
	line-height:40px;
	height:40px;
	color:#504C44;
	padding:0 30px;
}
ul#dd a:hover, ul#dd a.selected{
	background:#F5F5F5;
	background:rgba(0,93,127,0.08);
	text-decoration:none;
}



.legend{
	margin:-30px -29px 30px -29px;
	padding:30px;
	background:#fdf0e8;
}

.legend2{
	margin:0 -29px 0px -29px;
	padding:30px;
	background:#fdf0e8;
}

.legend.fixed{
	position:fixed;
	top:120px;
	left:50%;
	margin:0 0 0 -475px;
	width:890px;
	z-index:99;
}

#legendCloser{
	position:absolute;
	top:0;
	right:0;
	line-height:34px;
/*	padding:0 30px 0 10px;
	background:url(images/del.gif) top right no-repeat #FFF;*/
	padding:0 10px;
	cursor:pointer;
	color:#333333;
	opacity:0.5;
}

#legendCloser:hover{
	opacity:1;
}


/*Table (listBox)*/
div.masterListbox{
	clear:both;
	margin:-30px -29px -30px -29px;
}

	div.masterListbox>footer{
		text-align: center;
		background: #33478d;
		color: #FFFFFF;
		padding: 5px 0;
		position: sticky;
		bottom: 0;
		/*color: #FFF;*/
	}

table.listbox{
	width:100%;
	border-spacing: 0px;
	border-collapse: collapse;
}


th{
	text-align:left;
}

table.listbox td, table.listbox th{
	text-align:left;
	padding:5px 5px  5px 29px;
}

table.listbox th, table.listbox th a{
	background:#33478d;
	color:#FFFFFF;
	text-decoration:none;
}

table.listbox th a:hover{
	text-decoration:underline;
}

table.listbox tr:nth-child(odd), table.listbox tr:nth-child(odd) td{
	background:#EEEEEE;
}

table.listbox tr.header{
	position: sticky;
	top: var(--stickyHeaderTop);
}

table.listbox tr.unused{
/*	opacity: .5;*/
	background: #999;
}
table.listbox tr.unused:nth-child(odd), table.listbox tr.unused:nth-child(odd) td{
	background: #888;
}

div.listBoxPgs{
/*	border-top:2px solid #00688F;*/
	background:#003883;
	color:#FFFFFF;
	padding-right:29px;
	text-align:right;
	font-size:12px;
}


/*FORM*/

.etape1 .label{
	width:270px;
}
	.etape1 .label span{
		width:210px;
	}

	.etape1 input.bigBox, 
	.etape1 div.faketext,
	.etape1 textarea{
		width:595px;
	}

	.etape1 select.bigBox{
		width:616px;
	}

	.etape1 .helpme{ 
		margin-right:10px;
	}

#morenutrition{
	display:none;
}

#morenutrition>div{
	display:none;
}

#morenutrition h2, .morebtn{
	cursor:pointer;
	background:#003883;
	color:#FFFFFF;
	padding:5px;
}

.form4 input.text{
	width:50px;
	margin-right:10px;
}

.validerror,
.etape5 input.text.validerror{
	background:#FFEEEE;
	border-color:#FF0000 !important;
}

div.question{
	margin-bottom:10px;
}

div.question.offset1{
	margin-left:40px;
}
div.question.offset2{
	margin-left:80px;
}

div.question.validerror{
	margin: -5px -10px 5px -10px;
	padding: 4px 9px;
}

div.question.offset1.validerror{
	margin-left:30px;
}
div.question.offset2.validerror{
	margin-left:70px;
}


div.question#confirm2.validerror, 
div.question#confirm3.validerror{
	padding:3px 8px;/*2px 2px;/* +2 +7 */
	margin:-2px -7px 8px -7px;
}


.checkbox{
	margin-top:8px;
	margin-right:15px;
}

.radiobutton{
	margin-top:8px;
	margin-right:15px;
}

.radiobutton2{
	margin-top:2px;
	margin-right:15px;
}


.inputspacer{
	float:left;
	width:30px;
}

.inputspacer *{
	margin-right:0;
}


.span{
	display:block;
	font-weight:bold;
	padding-top:20px;
	padding-bottom:10px;
}

.radiolabel{
	margin-top:8px;
}
.formLigne,
.formLigneRadio{
	clear:both;
	padding-bottom:5px;
	min-height:30px;
}

.formLigneRadio{
	padding:0 0 0 10px;
}

.formLigneRadio .radioContainer{
	width:30px;
}
	.formLigneRadio .radioContainer input{
		margin-right:0;
	}


.col.formLigne:nth-child(odd){
	background:#F8F8F8;
	margin:0 -29px;
	padding-left:29px;
	padding-right:29px;
}

.validation .formLigne:nth-child(odd){
	margin:0 -20px;
	padding-left:20px;
	padding-right:20px;
}

.formLigne input,
.formLigneRadio input{ 
	float:left;
}

.formLigne label,
.formLigneRadio label {
	float: left;
}

.formLigne label.step2{
	width: 180px;
}

.formLigne select,
.formLigneRadio select {
	font-size: 11px;
	height: 28px;
	width: 140px;
	margin-right: 60px;
	margin-top: 2px;
	float: left;
}

.formLigne div,
.formLigneRadio div {
	float: left;
}

.formLigne div label,
.formLigneRadio div label{
	float: left;
	width:120px;
}

.label.look{
	margin-bottom:5px;
}


#cookingMethodsColumn{
	display: none;
}

	#cookingMethodsColumn textarea{
		display: block;
		width: 400px;
		float:left;
	}


.formLigneRadio.large{
	
}

	.formLigneRadio.large label{
		width: auto !important;
	}


.field{

}

	.field div.select{
		float: left;
		width: 215px;
		height: 30px;
	}

		.field div.select:after{
			height: 30px;
			width: 30px;
		}

		.field div.select select{
			width: 100%;
			height: 100%;
		}

	.field input{
		text-decoration: none;
		text-align: center;
	}

	.field input[disabled]{
		display: none;
	}

.label{
	line-height:28px;
	width:240px;
	height:28px;
	font-size:14px;
	float:left;
	clear:left;
}
.llabel{
	width:240px !important;	
}

span.unite{
	line-height:28px;
	font-size:14px;
}

.label2 {
	width:210px !important;
	line-height:28px;
	font-size:14px;
}

.label3 {
	width: 189px !important;
	line-height:28px;
	font-size:14px;
}

.label3.whelp{
	width: 200px !important;
}

.label span{
	display:inline-block;
	padding-right:12px;
	float:left;
	width:180px;
}

.label span.required{

}

	.label span.required::after{
		content:" *"; 
		color: red;
	}


.label2 span{
	display:inline-block;
	float:left;
}

.label3 span {
	display:inline-block;
	float: none;
}

.label img, .label2 img, .label3 img{
	cursor:pointer;
	float:left;
}

.halfLine {
	float: left;
	width: 200px;
}
	.halfLine .radiobutton {
		margin-top: 2px;
	}


#alertBox .label{
	width:120px;
}

#alertBox li+*{
	margin-top:0.5em;
}

div.formSubmit{
	position:absolute;
	width: auto;
	height:38px;
	bottom: -38px;
	right: -1px;
	z-index:3;
}

div.formSubmit input,
input.submitButton{
	float:right;
	position:relative;
	/*top:31px;
	left:32px;*/
	height:38px;
	line-height:38px;
	border:0;
	background:#ee7d11;
	color:#ffffff;
	padding:0 20px;
	font-size:15px;
	cursor:pointer;
	margin-right: 0;
} 

.arrowr,
div.formSubmit input.arrowr{
	background-image:url(images/droitefleche.png);
	background-position:100% 50%;
	background-repeat: no-repeat;
	padding-right:30px;
}

#btnNextStep{
	position: relative;
	text-decoration: underline;
	font-family:Helvetica, Arial, sans-serif;
	font-size:15px;
}

#btnNextStep:hover{
	text-decoration: none;
}

div.sauvegarde{
	position: absolute;
	height: 38px;
	bottom: -38px;
	left: -1px;
	z-index:4;
}

div.sauvegarde a{
	display: block;
	height:38px;
	line-height:38px;
	border:0;
	background:#003883;
	color:#ffffff;
	padding:0 20px;
	font-size:15px;
	cursor:pointer;
}

.arrowl,
div.sauvegarde a.arrowl{
	background-image:url(images/gauchefleche.png);
	background-position:0% 50%;
	background-repeat: no-repeat;
	padding-left:30px;
}

div.discreet{
	width:888px;
	position:absolute;
	height:11px;
	text-align:center;
	bottom: 20px;
	z-index:5;
}

div.discreet a{
	text-align:center;
	position:relative;
	top:31px;
	right:30px;
	height:38px;
	line-height:38px;
	border:0;
	color:#AAAAAA;
	padding:0 20px;
	font-size:15px;
	cursor:pointer;
}


div.sauvegardebck a{
	display:block;
	width:auto;
	height:28px;
	line-height:28px;
	border:0;
	background:#003883;
	color:#ffffff;
	font-size:16px;
	font-weight:bold;
	margin-bottom:10px;
	margin-top:70px;
	margin-right:20px;
	padding:0 5px;
	cursor:pointer;
	float:right;
	cursor:default;
	cursor:pointer;
}

.btnAjout{
	height:28px;
	line-height:28px;
	border:0;
	background:#ee7d11;
	color:#ffffff;
	padding:0 5px;
	font-size:15px;
	cursor:pointer;
	float:right;
}

div.formSubmit input:hover, div.sauvegarde a:hover{
	text-decoration:none;
	/*background:#003883;*/
}

div.sauvegarde{
	clear:both;
}

input.bigBox, div.faketext, div.dropzone{
	width:625px;
	height:18px;
	font-size:14px;
	float:right;
	line-height:18px;
	padding:5px 10px;
	border:1px solid #999;
	color:#000000;
}

div.faketext+span.mceEditor{
	float:right;
	margin-bottom:5px;
}

input.ingredient{
	height:18px;
	font-size:11px;
	float:right;
	line-height:18px;
	padding:5px 10px;
	border:1px solid #999;
	color:#000000;
}

input.txtUnit{
	width:70px;
	height:18px;
	font-size:11px;
	line-height:18px;
	padding:5px 10px;
	border:1px solid #999;
	margin-right:10px;
}


.etape5 input.text{
	display:block;
	box-sizing:content-box;/*valuecontent-box*/
	background:#FFF;
	padding:3px;
	border:1px solid #999;
	width:50px;
	height:18px;
	line-height:18px;
}

.etape5 input.text[disabled]{
	background:#EEE;
}

.etape5 input.text.withselector {
	border-right:0;
	margin-right:0;
	width:45px;
}

div.select{
	display:block;
/*	width:43px;*/
	width:53px;
/*	height:18px;*/
	height: 24px;
	background:#FFF;
	color:rgb(42, 126, 152);
	color:#FFF;
	overflow:hidden;
/*	padding:3px 5px;*/
	position:relative;
	border:1px solid #ee7d11;
}

div.select.validerror{
	background:#FFEEEE;
	border-color:#FF0000 !important;
}

div.select.validerror::after{
	background-color:red;
}

div.select.validerror select{
	border-color:#FF0000 !important;
}


div.select select{
	display:block;
   -webkit-appearance: none;
   width:100% !important;
   height:100%;
/*   line-height:24px;*/
   border:0;
   border-radius:0;
   background:transparent;
   outline: none;
   color:rgb(42, 126, 152);
   padding:3px 5px;
}

	div.select:after{
		content:" ";
		width:20px;
		height:26px;
		background:#ee7d11 url(images/whitearrow.png) no-repeat center center;
		z-index:5;
		pointer-events:none;
		position:absolute;
		top:0;
		right:0;
		text-align:center;
		line-height:26px;
	}


select.bigBox{
	-webkit-appearance: menulist-button;
	width: 646px;
	height: 30px;
	line-height:30px;
	font-size: 11px;
	float: right;
	border: 1px solid #999;
	color: black;
}


div.faketext,
div.dropzone{
	border:1px solid #EEEEEE;
	overflow:hidden;
	font-size:14px;
	float:right;
	background:#EEEEEE;
	height: auto;
	min-height: 18px;
}

div.dropzone{
	height: 100px;
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin-bottom: 10px;
}

	div.dropzone>span{
		display: block;
		text-align: center;
		margin-top: 1em;
		opacity: .5;
	}

div.dropzone.hover{
	box-shadow: inset 0 0 0 10px #ee7d11;
}


	div.faketext.fullWidth{
		width:870px;
		float:none;
	}


div.dropzone+input{
	display: none;
}

div.half{
	float:left;
	width:425px;
	margin:0 20px 0 0;
}

div.halfzone{
	float:left;
	width:445px;
	overflow:hidden;
}

div.halfzone.n1,
div.halfzone.n2{
	width:425px;
	overflow:visible;
}

div.halfzone.n1{
	margin-right:40px;
}

/*div.halfzone.n1>.question,
div.halfzone.n2>.question{
	max-width:400px;
}*/



div.faketext.withChosen, div.halfzone.withChosen{
	overflow:visible;
	background:transparent;
}

/*div.halfzone.limitedsize{
	max-height:650px;
	overflow-x:hidden;
	overflow-y:auto;
	float:right;
}*/

div.halfzone label{
	font-size:12px;
	width:140px;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space: nowrap;
}


div.halfzone.nutritioninformation label{
	width:155px;
}

div.halfzone.nutritioninformation div.faketext, div.halfzone.nutritioninformation input.bigBox, div.halfzone.nutritioninformation select.bigBox{
	width:235px;
}

div.halfzone label.larger{
	width:285px;
}

div.halfzone label.larger.twolines{
	height:auto;
	white-space:normal;
}

div.halfzone .textMg, div.halfzone div.faketext, div.halfzone input.bigBox, div.halfzone select.bigBox{
	width:100px;
	margin-right:15px;
}

div.halfzone .faketext select.bigBox{
	display:block;
	margin:-5px -10px;
	width:270px;
	height:28px;
	line-height:28px;
	-webkit-appearance: menulist-button;
}

.faketext select.bigBox{
	display:block;
	width:646px;
	margin:-5px -10px;
	height:28px;
	line-height:28px;
	-webkit-appearance: menulist-button;
}

div.halfzone .faketext .chosen-container, .faketext .chosen-container{
	margin:-5px -10px;
}

div.halfzone div.faketext,div.halfzone input.bigBox, div.halfzone select.bigBox{
	width:250px;
}

div#formAllergens label.label{
	font-size:12px;
	width:250px;
}
div#formAllergens label.label6{
	font-size:12px;
	width:150px;
}
div#formAllergens label.multi{
	line-height:14px;
}

div.halfzone select{
	width:110px;
}

div.half.deux{
	float:left;
	width:425px;
	margin:0 0 0 20px;
}


div.halfzone.nutrientInfo label{
	width:160px;
}
div.halfzone.nutrientInfo div.faketext{
	width:230px;
}

div.half input.bigBox{
	width:160px;
}

div.half ul.list{
	margin-left:2em;
}


/* validation */
.validerror{
	border:1px red solid;
}
	
.validerror2{
	background-color:red;
}

.validerror3{
	color:red;
}

/*Color bubble*/

div.bulle.loading{
	opacity:0.5;
}

div.bulle{
	width:20px;
	height:20px;
	margin:0 auto;
	background:#999;
	border-radius:10px;
	box-shadow: inset 0 0 2px 1px rgba(255, 255, 255, 0.5), 0 2px 3px rgba(0,0,0,0.7), inset 0 -5px 10px rgba(0, 0, 0, 0.3);
}

div.bulle.fl{
	width:auto;
	line-height:20px;
	padding:0 5px;
	display:inline-block;
	margin:10px 15px 10px 0;
	color:#000000;
	padding:2px 10px;
	box-shadow: inset 0 0 2px 1px rgba(255, 255, 255, 0.5), 0 2px 3px rgba(0,0,0,0.7), inset 0 -8px 10px rgba(0, 0, 0, 0.3);
	color:white;
	font-weight: bold;
	font-size:11px;
}

div.bulle.fl.blacktext{
	color:#000;
}

div.bulle.fl.grey{
	color:black;
}


div.bulle.red{
	background:#B20032;
	color:#FFFFFF;
}

div.bulle.black{
	background:#000000;
	color:#FFFFFF;
}

div.bulle.yellow{
	background:#F2AE00;
}

div.bulle.blue{
	background:#03ACCE;
}

div.bulle.green{
	background:#008300;
}

div.bulle.grey{
	background:#BBB;
}


div.bulle.withBelow{
	position: relative;
	padding:0 40px;
	margin-bottom:35px;
}

div.bulle.withBelow .below{
	font-size:11px;
	font-weight: normal;
	color:#003883;
	display: block; 
	position: absolute;
	top: 25px;
	left: 0;
	width: 100%;
	text-align: center;
	line-height:11px;
}

/*Fullwidth table*/
table.fullwidth{
	width:948px;
	margin:0 -29px;
	border-collapse:collapse;
	line-height:25px;
}

div#alertBox table.fullwidth{
	margin:0;
	width:100%;
}

table.fullwidth.fullheight{
	margin-bottom:-29px;
}

table.fullwidth.fullheight+table.fullwidth.fullheight{
	margin-top: 29px;
}

table.fullwidth th, 
table.fullwidth td{
	padding-left:29px;
	line-height:19px;
	padding-top: 3px;
	padding-bottom: 3px;
}

table.fullwidth th.sub, 
table.fullwidth td.sub{
	padding-left:58px;
}

	table.fullwidth td div.sub{
		margin-left:29px;
		font-style: italic;
		color: #000;
		padding: 5px;
		box-shadow: 0 0 0 1px #EEEEEE, inset 0 0 0 1px #FFFFFF;
	}

	table.fullwidth td.tdsComments{
		width:30px;
		margin:0;
		padding:0;
		position: relative;
		overflow: hidden;
	}

		table.fullwidth td.tdsComments:hover{
			cursor: pointer;
			background:#fad5bc;
		}

		table.fullwidth td.tdsComments::before{
			display: block;
			content:"";
			width:30px;
			height:30px;
			background-image:url(images/icons/empty.png);
			background-size: 100% auto;
			background-size: contain;
			background-position: 50% 50%;
			background-repeat: no-repeat;
		}
		table.fullwidth td.tdsComments.type_allergens::before{
			background-image:url(images/icons/allergens.png);
		}
		table.fullwidth td.tdsComments.type_amount::before{
			background-image:url(images/icons/amount.png);
		}
		table.fullwidth td.tdsComments.type_formula::before{
			background-image:url(images/icons/formula.png);
		}
		table.fullwidth td.tdsComments.type_multiple::before{
			background-image:url(images/icons/multiple.png);
		}
		table.fullwidth td.tdsComments.type_name::before{
			background-image:url(images/icons/name.png);
		}
		table.fullwidth td.tdsComments.type_nameissue::before{
			background-image:url(images/icons/nameissue.png);
		}
		table.fullwidth td.tdsComments.type_nutritionalissue::before{
			background-image:url(images/icons/nutritionalissue.png);
		}
		table.fullwidth td.tdsComments.type_sugar::before{
			background-image:url(images/icons/sugar.png);
		}


		table.fullwidth td.tdsComments.comment::after{
			display: block;
			content: "...";
			width: 30px;
			line-height: 4px;
			height: 29px;
			position: absolute;
			top: 0;
			right: 0;
			background: #ee7d11;
			transform: translate(50%, -50%) rotate(-135deg);
			overflow: hidden;
			text-align: center;
			color: #FFF;
			font-weight: bold;
			font-size: 12px;
		}


table.fullwidth th.nopadding, table.fullwidth td.nopadding{
	padding-left:0;
}


table.fullwidth td.longtext{
	padding:5px 0 5px 29px;
	line-height: 1.3em;
}

table#formula.fullwidth th, table#formula.fullwidth td{
	padding-left:0;
}


table.fullwidth th{
	background:#003883;
	color:#FFFFFF;
}

	table.fullwidth th.tdsComments{
		width: 30px;
		margin: 0;
		padding: 0;
		color:transparent;
		font-size: 0;
		text-indent: -10000px;
	}

table.fullwidth tr:nth-child(odd) td{
	background:#EEEEEE;
}


table.fullwidth tr.unused{
/*	opacity: .5;*/
	background: #999;
}
table.fullwidth tr.unused:nth-child(odd) td{
	background: #888;
}


.edited, .faketext.edited{
	background:#FFFFAA;
}
table.fullwidth tr.edited:nth-child(odd) td, table.fullwidth tr:nth-child(odd) td.edited{
	background:#EEEE99;
}

.deled, .faketext.deled{
	background:#FFBBBB;
}
table.fullwidth tr.deled:nth-child(odd) td,table.fullwidth tr:nth-child(odd) td.deled{
	background:#EEAAAA;
}
.added, .faketext.added{
	background:#BBFFBB;
}
table.fullwidth tr.added:nth-child(odd) td, table.fullwidth tr:nth-child(odd) td.added{
	background:#AAEEAA;
}
/*Formula*/
table#formula{
	border-collapse:collapse;
	width:890px;
}

table#formula .range{
	position:relative;
}

table#formula .pct{
	position:relative;
}

table#formula td, table#formula th{
	padding-bottom:20px;
}

table#formula tr:hover img{
	opacity:1;
}
table#formula div{
	float:left;
}

table#formula input, table#formula span{
	height:28px;
	float:left;
}
table#formula .proportions{
	width:118px;
	margin:0;
	padding:0 4px;
	border:1px solid #999;
	font-size:1em;
}

table#formula .propEcart{
	width:46px;
	margin:0;
	padding:0 4px;
	border:1px solid #999;
	font-size:1em;
}

table#formula span.unit{
	width:10px;
	text-align:center;
	padding:0;
}

span.propecartlabel{
	width:16px;
	text-align:center;
	font-size:0.7em;
	height:32px;
	line-height:32px;
}

.unit{
	line-height:32px;
	padding-left:3px;
}



table#formula .proportionsTitre{
	width:116px;
	margin-right:20px;
}

table#formula .interrogation{
	width:26px;
	height:28px;
	margin-right:10px;
	margin-left:5px;
	float:left;
}

table#formula .ingredients, table#formula .components{
	width:302px;
	padding:0 4px;
	margin:0;
	font-size:14px;
	line-height:18px;
	border:1px solid #999;
}

textarea{
	width:625px;
	height:54px;
	font-size:14px;
	float:right;
	line-height:18px;
	padding:5px 10px;
	border:1px solid #999;
	color:black;
	resize: vertical;
}

	textarea#ingList,
	textarea#userComment2,
	textarea#precautions{
		width:569px;
		margin-right:56px;
	}

	textarea#ingList.step2,
	textarea#userComment2.step2,
	textarea#precautions.step2{
		width:632px;
	}

textarea.fullWidth{
	width:868px;
}


input.full,
textarea.full{
	float: none;
	width:794px;
	box-sizing: border-box;
}

table#formula img{
	cursor:pointer;
}

div.method, div.validation{
/*	width:640px;
	padding:20px;
	margin:20px 100px;
	border:5px solid #003883;*/
}

div.validation label{
	line-height:18px;
	font-size:14px;
}

/*SMARTBOX*/

#searchResults{
	overflow-x:hidden;
	overflow-y:auto;
}

.searchResultsList{
	cursor:pointer;
	padding:10px 0;
	border-top:1px solid #357d98;
}

.searchResultsList:first-child{
	border:0;
}

.searchResultsList:hover{
	background:#ee7d11;
	color:#FFFFFF;
}

input.smartBox{
	width:550px;
	height:28px;
	line-height:16px;
}

div.smartDiv{
	display:none;
	position:relative;

	width:550px;
	height:28px;

	border:1px solid #C4CEDF;
	-moz-border-radius: 10px; /* Firefox */
	-webkit-border-radius: 10px; /* Safari, Chrome */
	border-radius: 10px; /* CSS3 */

	background: #E4EEFF; /* for non-css3 browsers */
}

div.smartDiv>a{
	display:block;
	height:28px;
	line-height:28px;
	position:absolute;
	top:0;
	right:10px;
	cursor:pointer;
}

div.smartDiv>span{
	display:block;
	height:28px;
	width:510px;
	overflow:hidden;
	line-height:28px;
	position:absolute;
	top:0;
	left:10px;
}

input.load{
	background-color:#F5F5F5;
	background-image:url(images/load.gif);
	background-position:right 6px;
	background-repeat:no-repeat;
}

div.alert{
	background:#FFEEEE;
	padding:20px;
	margin-bottom:1em;
}
div.info{
	background:#fdf0e8;
	padding:20px;
	margin-bottom:1em;
}


	div.info ul,
	div.info ul li{
		/*margin:0 0 3px 0;*/
		margin:1em 0 0 0;
	}
div.smartbox{
	z-index:45;
	background:#EEEEEE;
	border:2px solid #aabd26;
	border-top:0;
	max-height:200px;
	overflow:auto;

	-moz-box-shadow: 1px 1px 3px #999;
    -webkit-box-shadow: 1px 1px 3px #999;
    box-shadow: 1px 1px 3px #999;
    -ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#999')";
    filter: progid:DXImageTransform.Microsoft.Shadow(Strength=3, Direction=135, Color='#999');
}

div.smartbox hr{
	margin-bottom:0;
}

div.smartbox>div{
	padding:5px;
}

div.smartbox>div.actif{
	background:#FFFFFF;
	cursor:pointer;
}

#alertBox input.smartBox, #alertBox div.smartDiv{
	width:435px;
}

/*Smoke & AlertBox*/
#smoke{
	display:none;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:#EEEEEE;
	background:rgba(255,255,255,0.8);
	display:none;
	z-index:140;
}

#alertBox{
	display:none;
	width:500px;
/*	min-height:100px;
	max-height:400px;*/
	height:auto;
	position:fixed;
	top:50%;
	left:50%;
	margin-top:-150px;
	margin-left:-250px;
	border:1px solid #003883;
	background:#FFFFFF;
	z-index:141;
	overflow:hidden;

	/*margin-top: 0;*/
	/*transform: translateY(-50%);*/
}

#alertBox.addAllergenToProduct{
	width:700px;
	margin-left:-350px;
	margin-top:-300px;
}

	#alertBox.addAllergenToProduct #alertBoxText{
		width:642px;
		width:calc(100% - 58px);
		max-height:600px;
	}

	#alertBox.addAllergenToProduct label{
		padding-left:20px;
		width:100px;
		position:relative;
	}

		#alertBox.addAllergenToProduct label input{
			position: absolute;
			top:50%;
			left:0;
			transform: translateY(-50%);
			margin:0;
			padding:0;
		}

		#alertBox.addAllergenToProduct .allergenBox{
			opacity:.5;
			pointer-events: none;
		}

		#alertBox.addAllergenToProduct .allergenBox.active{
			opacity:1;
			pointer-events: auto;
		}


#alertBox h1{
	float:left;
	margin:0.1em 0 0.3em 0;
	padding:0;
}

#alertBox h1 span.s{
	display:block;
	font-size: 12px;
	color: #888888;
	font-weight: normal;
}

#hidehelp{
	position:absolute;
	top:0;
	right:0;
	line-height:34px;
	padding-right:30px;
	background:url(images2/del.png) top right no-repeat;
	cursor:pointer;
	color:#333333;
	opacity:0.5;
}

#resizehelp{
	position:absolute;
	top:0;
	left:0;
	line-height:34px;
	padding-left:30px;
	background:url(images2/bigger.jpg) top left no-repeat;
	cursor:pointer;
	color:#333333;
	opacity:0.5;
}

#alertBox.big #resizehelp{
	background:url(images2/smaller.jpg) top left no-repeat;
}

#hidehelp:hover, #resizehelp:hover{
	opacity:1;
}

#alertBox.yellow{
	background-color:#fdf0e8;
}

#alertBox.yellow #resizehelp,
#alertBox.important #resizehelp,
#alertBox.longer #resizehelp,
#alertBox.noclose #hidehelp{
	display: none;
}

#alertBoxText{
/*	position:absolute;*/
	top:0;
	left:0;
	font-size:14px;
	padding:0 29px 29px 29px;
	margin-top:29px;
	width:442px;
	min-height:92px;
	max-height:342px;
	overflow-x:hidden;
	overflow-y:auto;
	color:#003883;

	/*max-height: 75vh;*/
	/*max-height: calc(90vh - 58px);*/

}

#alertBox.longer{
	margin-top: 0;
	transform: translateY(-50%);
}

	#alertBox.longer #alertBoxText{
		max-height: 75vh;
		max-height: calc(90vh - 58px);
	}

	#alertBoxText ul.list{
		text-align: left;
	}

	#alertBoxText ul.buttons{
		display: block;
		text-align: center;
		margin:0;
		padding:0;
	}

		#alertBoxText ul.buttons li{
			display:inline-block;
			margin:0 5px;
			padding:0;
		}

			#alertBoxText ul.buttons li>*{
				display:block;
				padding:5px 10px;
				background:#000000;
				color:#FFFFFF;
				cursor:pointer;
				border:1px solid;
			}

			#alertBoxText ul.buttons li>*:hover{
				color:#000000;
				background:#FFFFFF;
			}

#alertBox.important{
	background:yellow;
}

#alertBox.important #alertBoxText{
	font-size: 28px;
	line-height: 1.2em;
	text-align:center;
	color:#000000;
}

	#alertBox.important #alertBoxText span{
		line-height: 1.5em;
	}

#alertBox.higher{
	margin-top:0;
	transform:translateY(-50%);
} 

	#alertBox.higher #alertBoxText{
		max-height:600px;
		max-height:90vh;
	}


#alertBox.big{
	width:90%;
	height:90%;
	top:5%;
	left:5%;
	margin:0;
	padding:0;
}

#alertBox.big #alertBoxText{
	font-size:16px;
	position:absolute;
	width:auto;
	height:auto;
	max-width:none;
	max-height:none;
	margin:0;
	padding:0 0 29px 0;
	top:29px;
	left:29px;
	right:29px;
	bottom:0;
}

#alertBox2{
	position:fixed;
	top:50%;
	left:50%;
	width:700px;
	height:450px;
	margin-top:-225px;
	margin-left:-350px;
	
	background:rgb(243,255,255);
	background:rgba(233,248,251,0.8);
	display:none;
}
#alertBoxText2{
	margin:40px;
	width:620px;
	height:320px;
	overflow-x:hidden;
	overflow-y:auto;
}

#alertBox.notop{
	margin-top:0;
	transform: translateY(-50%);
}

.notop #alertBoxText{
	padding:29px;
	margin-top:0;

	max-height: 75vh;
	max-height: calc(100vh - 100px);
}


/*MCe fix*/
.mceToolbar, .mceStatusbar{
	display:none;
}

.printdiv{
	display:none;
}

.startext{
	padding-left:15px;
	position:relative;
}

.startext:before{
	content:"*";
	color:red;
	position:absolute;
	top:0;
	left:0px;
}

#confirm2, #confirm3,
#sulfitesBlock1{
	width: 434px; 
	padding:2px;
/*	display: block;*/
	font-size:12px;
}

#confirm2 label.radiolabel, #confirm3 label.radiolabel{
	line-height:20px;
	width:80px;
	margin-top:2px;
	font-size:12px;
}

#confirm2 label input, #confirm3 label input{
	line-height:20px;
	margin:4px 5px 0 0;
}

.btn{
	float:right;
	background:#003883;
	color:#FFF;
	cursor:pointer;
	padding:5px 10px;
}

.btn:hover{
	background:#ee7d11;
}

.btn.left{
	display: inline-block;
	float:none;
	text-decoration:none;
	text-transform: uppercase;
	line-height:38px;
}

.btn2{
	border: 1px solid #EEEEEE;
	overflow: hidden;
	font-size: 14px;
	background: #EEEEEE;
	height: auto;
	padding: 5px 10px;
	color: black;
	margin: 10px 0;
}

.btn2:hover{
	background:#ee7d11;
	color:#FFFFFF;
	cursor: pointer;
}

.sectionBorder{
	border-top:5px solid #035C7E;
	margin:5px -30px 0 -30px;
	padding:10px 30px 0 30px;
}

.attestContainer{
	background:#003883;
	margin:7px -29px -30px -29px;
	padding:10px 10px;
	/*color:#FFF;*/
}

	.attestContainer>*{
		background:#FFFFFF;
		padding:0 19px;
	}

	.attestContainer>h2{
		display: block;
		margin:0;
		padding:10px 0 20px 0;
		background:#003883;
		color:#FFFFFF;
	}

	.attestContainer>.radioContainer{
		padding-top:5px;
		padding-bottom:5px;
		margin:0;
	}

	.attestContainer>strong{
		display:block;
		padding:5px 19px 10px 19px;
	}

	.attestContainer>label{
		display: block;
		position: relative;
		margin-top:5px;
	}

		.attestContainer>label>input{
			opacity: 0;
			position: absolute;
		}

		.attestContainer>label>span{
			line-height: 20px;
			padding-left:20px;
			position: relative;
			display: block;
		}

			.attestContainer>label>span::before,
			.attestContainer>label>span::after{
				display: block;
				content:"";
				background:#EEEEEE;
				position: absolute;
				top:2px;
				left:0;
				width:16px;
				height:16px;
				border-radius: 100%;
			}

			.attestContainer>label>span::before{
				box-shadow: inset 0 0 0 1px #CCC;
			}

			.attestContainer>label>span::after{
				background: #ee7d11;
				width:12px;
				height:12px;
				top:4px;
				left:2px;
				opacity: 0;
				transform: scale(0);
				transition: transform .5s, opacity .5s;
				box-shadow: 0 0 0 1px #FFF;
			}

			.attestContainer>label>span.checked.lv9.updated::after{
				background: red;
			}

			.attestContainer>label:hover>input+span::after{
				opacity: .5;
				transform: scale(.4);
			}

			.attestContainer>label>input:checked+span::after,
			.attestContainer>label>span.checked::after{
				opacity: 1;
				transform: scale(1);
			}

			.attestContainer>label:hover>input:checked+span::after{
				opacity: .8;
				transform: scale(.8);
			}

div#formAllergens #sulfitesBlock1 label.label6{
	float:none;
	width:auto;
	display:block;
}

#sulfitesBlock1{
	font-size:12px;
}

#oilConfirm{
	display:none;
	margin:0 0 20px 0;
}

	#oilConfirm.validerror{
		margin: -5px -10px 15px -10px;
	}


#oilConfirm input.radiobutton{
	margin:0 8px 0 20px;	
}

#oilConfirm table{
	margin:10px 0;
	width:500px;
}

.deleteLine{
	cursor:pointer;
	opacity:0.5;
}

.deleteLine:hover{
	opacity:1;
}


/* AUTOCOMPLETE THING */
.ui-autocomplete {
	background: white;
	width: 300px;
	max-height:200px;
	overflow:auto;
	padding: 0;
	margin: 0;
	top: -481px;
	list-style-type: none;
	border: 1px solid #fad5bc;
	z-index: 100;
	position:fixed;
}
	.ui-autocomplete li {
		border-bottom: 1px solid #fad5bc;
	}
		.ui-autocomplete li a {
			display:block;
			overflow: hidden;
			white-space: nowrap;
			text-overflow: ellipsis;
			padding:5px 10px;
			width:280px;
			font-size:11px;
		}

		.ui-autocomplete li:hover, .ui-autocomplete .ui-state-hover {
			background: #fad5bc;
			cursor:pointer;
		}
			.ui-autocomplete li:hover a, .ui-autocomplete .ui-state-hover {
				color:#fff;
				text-decoration: none;
			}

.ui-autocomplete-input{
	width:280px;
	height:20px;
	line-height:20px;
	margin:-5px -10px;
	padding:5px 10px;
	border:0;
}

.fakeselect{
	position:relative;
}

table.compareTable{
	border:1px solid #357d98;
	border-collapse:collapse;
	font-size:12px;
	width:100%;
}

table.compareTable td, table.compareTable th{
	border:1px solid #357d98;
	width:46%;
	padding:19px;
	vertical-align:top;
}

table.compareTable th{
	font-size:10px;
	font-weight:normal;
	color:#FFF;
	background:#357d98;
}

table.compareTable th strong{
	font-size:12px;
}

div.alignwithtable{
	padding:0 30px;
	text-indent:-10px;
}

#bubble{
	position:absolute;
	top:0;
	left:0;
	background:#003883;
	color:#FFF;
	text-align:center;
	border-radius: 5px;
	width:175px;
	height:35px;
	line-height:35px;
	box-shadow: 0 2px 10px rgba(0,0,0,0.5);
}

#bubble:before{
	content:"";
	position:absolute;
	bottom:-15px;
	right:12px;
	border-width:15px 0 0 15px;
	border-style:solid;
	border-color:#003883 transparent;
	display:block;
	width:0;
	z-index:2;
}



.faketext.smallertext{
	font-size:0.9em;
}

.faketext .autocalcval{
	float:right;
	border-left:3px solid white;
	padding:6px 5px;
	margin:-6px -10px -6px 0;
	width:80px;
	height:18px;
	line-height:18px;
	font-size:0.9em;
}

.faketext .autocalcratio{
	float:right;
	border-left:3px solid white;
	padding:6px 5px;
	margin:-6px 0 -6px 0;
	width:55px;
	height:18px;
	line-height:18px;
	font-size:0.9em;
}

.faketext.clientitemnumber.editable:hover{
	-webkit-box-shadow: #ee7d11 0px 0px 0px 2px inset;
	box-shadow: #ee7d11 0px 0px 0px 2px inset;
	cursor:pointer;
}
.faketext.clientitemnumber.editable.saving,
.faketext.clientitemnumber.editable.saving:hover{
	-webkit-box-shadow: #003883 0px 0px 0px 2px inset;
	box-shadow: #003883 0px 0px 0px 2px inset;
	cursor:pointer;
}

.faketext .autocalcratio.editable:hover,
.faketext .autocalcval.editable:hover{
	-webkit-box-shadow: #ee7d11 0px 0px 0px 2px inset;
	box-shadow: #ee7d11 0px 0px 0px 2px inset;
	cursor:pointer;
}

.faketext .autocalcval.empty, .faketext .autocalcratio.empty, .faketext{
	color:#BBB;
	cursor:default;
}



/*New interactive tabel*/

table.reorderable.interactive th.orderable:hover{
	text-decoration:underline;
	cursor:pointer;
}

table.reorderable.interactive th.orderable::after{
	content:"";
	margin:0;
	padding:0;
	display:inline;
	text-decoration: none;
	display: inline-block;
	padding-left: 10px;
	width:15px;
	text-align:center;
}

table.reorderable.interactive th.orderable.ordered.orderedasc::after{
	content:"↓";
}

table.reorderable.interactive th.orderable.ordered.ordereddesc::after{
	content:"↑";
}

table.reorderable.interactive th.orderable:hover::after,
table.reorderable.interactive th.orderable.ordered.ordereddesc:hover::after{
	content:"↓";
}

table.reorderable.interactive th.orderable.ordered.orderedasc:hover::after{
	content:"↑";
}

/* Help page */

.titreSection.welcomePage{
	text-align: justify;
}

.titreSection.welcomePage h2{
	margin-top:30px;
}


#help{

}
	#help>ul>li{
		margin:0 0 6px 0;
	}
.helpThings{
	margin:20px 0;
}

	.helpThings>div{
		position: relative;
		display:block;
		float:left;
		width:207px;
		height:370px;
		background:#003883;
	}

		.helpThings>div>a{
			display:block;
			padding:3px;
			width:201px;
			height:364px;
			background:#003883;
			color:#FFF;
			text-decoration: none;
		}

		.helpThings>div>a:hover{
			background:#ee7d11;
		}


			.helpThings>div>a>h2{
				display:block;
				position: relative;
				font-size: 19px;
				font-weight: 500;
				height: 72px;
				width:155px;
				line-height: 21px;
				margin:0;
				padding:0 23px;
				display:table;
				font-weight:bold;
			}
				.helpThings>div>a>h2>span{
					display: table-cell;
					height: 100%;
					vertical-align: middle;
				}
			.helpThings>div>a>img{
				width:100%;
				height:auto;
			}

			.helpThings>div>a>p{
				display: block;
				width:181px;
				padding:10px;
				font-size: 15px;
				margin:0;
				height:121px;
				background:#FFF;
				color:#333333;
				text-align: center;

				display:table;
			}

				.helpThings>div>a>p>span{
					display: table-cell;
					height: 100%;
					vertical-align: middle;
				}

			.helpThings>div>a>.fakemore{
				font-size: 13px;
				position: absolute;
				bottom:0;
				left:0;
				width:181px;
				height:35px;
				line-height:35px;
				margin:0 10px;
			}


.helpThings1,
.helpThings4{
	width:208px;
}

.helpThings2,
.helpThings3,
.helpThings4{
	margin-left:20px;
}







#popsmoke{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:#EEEEEE;
	background:rgba(255,255,255,0.8);
	z-index:140;
}

.info.popinfo{
	width:500px;
	height:300px;
/*	min-height:100px;
	max-height:400px;*/
	height:auto;
	position:fixed;
	top:50%;
	left:50%;
	margin-top:-150px;
	margin-left:-250px;
	border:1px solid #003883;
	background:#FFFFFF;
	z-index:141;
	overflow:auto;

	max-height:350px;

	background: #fdf0e8;
}

.info.popinfo h1{
	margin-top:0;
	padding-top:0;
}

.info.popinfo #hidehelp{
	background:url(images2/del.png) top right no-repeat;
}

#tempForm #tempWhy{
	width:420px;
	width:calc(100% - 22px);
	height:auto;
	min-height:90px;
	margin:6px 0;
}

#alertBox.big #tempForm{
	height: calc(100% - 100px);
}

#alertBox.big #tempForm #tempWhy{
	height:calc(100% - 0px);
}

.info.popinfo li{
	margin:6px 0;
}


br.specificHeight{
	clear: both;
	width: 100%;
	height: 0.7em;
	display: block;
	content: "";
}

ul.specificHeight,
ul.specificHeight li{
	margin:0.7em 0 0 0;
}



.newButton{
	display: block;
	background:#ee7d11;
	color:#FFFFFF;
	text-decoration: none;
	padding:10px 20px;
	float:left;
	text-align: center;
}

	.newButton strong{
		display: block;
		font-size: 1.35em;
	}

.newButton:hover{
	background:#003883;
	text-decoration: none;
}




.sociallink{
	position: relative;
	top:-7px;
	display: inline-block;
	width:30px;
	height:30px;
	margin-left:5px;
	overflow: hidden;
	color:transparent;
	text-indent: -100px;
	background-color:#EEEEEE;
	background-size: auto 100%;
	background-position: 50% 50%;
	background-repeat: no-repeat;
	border-radius: 3px;
}

.sociallink:hover{
	opacity:0.8;
}

.sociallink.twitter{
	background-size: auto 60%;
	background-color:#1DA1F2; 
	background-image:url(images/twitter.svg);
}
.sociallink.facebook{
	background-color:#ffffff;
	background-image:url(images/facebook.svg);
}
.sociallink.linkedin{
	background-size: auto 100%;
	background-color:#ffffff;
	background-image:url(images/linkedin.svg);
}
.sociallink.google{
	background-size: auto 70%;
	background-color:#db4437;
	background-image:url(images/google.svg);
}



ol.addPadding>li,
ul.addPadding>li,
ol.addPadding>li>p,
ul.addPadding>li>p{
	padding-bottom:0.5em;
}

ol.addPadding>li>p,
ul.addPadding>li>p{
	margin-top:0;
}

ol.addPadding>li>blockquote{
	margin-top:0.5em;
	margin-bottom:0.5em;
}






.dbmsgCtn .message p+br{
	display: none;
}




.dbmsgBox.job .dbmsgCtn{
	min-height: 90px;
	padding-left:130px;
	background-image:url(images2/jobsearch.png);
	background-size:100px 88px;
	background-size:100px auto;
	background-repeat: no-repeat;
}

.dbmsgBox.important .dbmsgCtn{
	min-height: 100px;
	padding-left:130px;
	background-image:url(images2/error.png?v=2);
	background-size:100px 100px;
	background-repeat: no-repeat;
}

	.dbmsgBox h2{
		margin-top:0;
	}


.dbmsgBox.header{
	position: absolute;
	top: 190px;
	left: 50%;
	width: 433px;
	background: #FFFFFF;
	border: 1px solid #666666;
	z-index: 1;
	z-index: 1;
	padding: 20px;
	max-height: 78px;
	overflow: hidden;
	text-align:left;

	transition:max-height 1s .3s;
}

.dbmsgBox.header:hover{
	max-height:300px;
	max-height:50vh;
	max-height:calc(100vh - 190px);
	overflow:auto;

	transition:max-height .5s;
}
	.dbmsgBox.header::after{
		content:"";
		display: block;
		position: absolute;
		bottom:0;
		left:0;
		width:100%;
		height:20px;
		background:rgba(255,255,255,.5);
		background:linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1));
	}


.dbmsgBox.welcome.job .dbmsgCtn,
.dbmsgBox.header.job .dbmsgCtn{
	padding-left:70px;
	background-size:50px 44px;
	background-size:50px auto;
}

.dbmsgBox.welcome.important .dbmsgCtn,
.dbmsgBox.header.important .dbmsgCtn{
	padding-left:70px;
	background-size:50px 50px;
}


.dbmsgBox .btn.left{
	text-transform: none;
}

.dbmsgBox.tds4b{
	border: 1px solid #666666; /*003883*/
	color: #666666;
	margin: 1em 0;
}

.dbmsgBox.tds4b .dbmsgCtn{
	padding: 1em;
}

	.dbmsgBox.tds4b.important .dbmsgCtn{
		background-size: 50px 50px;
		background-position: 1em 1em;
		padding-left: 78px;
		padding-left: calc(50px + 2em);
	}

	.dbmsgBox.tds4b.important .dbmsgCtn,
	.dbmsgBox.tds4b.job .dbmsgCtn{
		background-size: 50px 50px;
		background-position: 1em 1em;
		padding-left: 78px;
		padding-left: calc(50px + 2em);
	}

.dbmsgBox.footer{
	margin-top: 100px;
}

	.dbmsgBox.footer .dbmsgCtn{
		width: 900px;
		margin: 0 auto;
	}

.dbmsgBox.footer+#footer{
	margin-top: 50px;
}


.mceEditor>.mceLayout tr.mceFirst.fixed{
	position: fixed;
	top:120px;
	width:645px;
	background: #F0F0EE;
}

	.mceEditor>.mceLayout tr.mceFirst.fixed>*{
		margin:0 auto;
		width:647px;
	}

.mceEditor>.mceLayout.active tr.mceFirst.fixed+tr.mceLast>td>iframe{
	margin-top:30px;
}

form#formulaCommentForm{

}

form#formulaCommentForm.loading{
	opacity: .5;
	pointer-events: none;
}

	form#formulaCommentForm label{
		margin-top:20px;
	}


	form#formulaCommentForm textarea{
		width:100%;
		box-sizing: border-box;
	}

/*	form#formulaCommentForm .icon{
		display: inline-block;
		vertical-align: bottom; 
		width:30px;
		height:30px;
		background:#EEEEEE;
		border-radius: 3px;

		background-image:url(images/icons/empty.png);
		background-size: 100% auto;
		background-size: contain;
		background-position: 50% 50%;
		background-repeat: no-repeat;
	}

	form#formulaCommentForm select[value="allergens"]+.icon{
		background-image:url(images/icons/allergens.png);
	}
	form#formulaCommentForm select[value="amount"]+.icon{
		background-image:url(images/icons/amount.png);
	}
	form#formulaCommentForm select[value="formula"]+.icon{
		background-image:url(images/icons/formula.png);
	}
	form#formulaCommentForm select[value="multiple"]+.icon{
		background-image:url(images/icons/multiple.png);
	}
	form#formulaCommentForm select[value="name"]+.icon{
		background-image:url(images/icons/name.png);
	}
	form#formulaCommentForm select[value="nameissue"]+.icon{
		background-image:url(images/icons/nameissue.png);
	}
	form#formulaCommentForm select[value="nutritionalissue"]+.icon{
		background-image:url(images/icons/nutritionalissue.png);
	}
	form#formulaCommentForm select[value="sugar"]+.icon{
		background-image:url(images/icons/sugar.png);
	}*/

	form#formulaCommentForm label.flagicon{
		position: relative;
		border:1px solid #fad5bc;
		display: inline-block;
		margin:0 3px 3px 0;
		vertical-align: top;
	}

		form#formulaCommentForm label.flagicon>input{
			opacity: 0;
			width: 0;
			height:0;
			position: absolute;
			top:0;
			left:0;
			overflow: hidden;
		}

		form#formulaCommentForm label.flagicon>span{
			position: relative;
			display: block;
			padding:0 5px 0 30px;
			cursor: pointer;
			line-height: 29px;

			position: relative;
			font-size:12px;
			height: 38px
		}

			form#formulaCommentForm label.flagicon>span>span{
				line-height: 1.2em;
				position: relative;
				top:50%;
				display: block;
				transform: translateY(-50%);
			}

/*		form#formulaCommentForm label.flagicon>span:hover{

		}
*/
		form#formulaCommentForm label.flagicon>input:checked+span{
			background:#fad5bc;
			color:#FFFFFF;
		}

			form#formulaCommentForm label.flagicon>span::before{
				display: block;
				content:"";
				position: absolute;
				top:2px;
				left:2px;
				width:24px;
				height:24px;
				background:#FFFFFF;
				border-radius: 3px;

				background-image:url(images/icons/empty.png);
				background-size: 100% auto;
				background-size: contain;
				background-position: 50% 50%;
				background-repeat: no-repeat;

				top:50%;
				left:2px;
				transform:translateY(-50%);
			}

			form#formulaCommentForm label.flagicon.allergens>span::before{
				background-image:url(images/icons/allergens.png);
			}
			form#formulaCommentForm label.flagicon.amount>span::before{
				background-image:url(images/icons/amount.png);
			}
			form#formulaCommentForm label.flagicon.formula>span::before{
				background-image:url(images/icons/formula.png);
			}
			form#formulaCommentForm label.flagicon.multiple>span::before{
				background-image:url(images/icons/multiple.png);
			}
			form#formulaCommentForm label.flagicon.name>span::before{
				background-image:url(images/icons/name.png);
			}
			form#formulaCommentForm label.flagicon.nameissue>span::before{
				background-image:url(images/icons/nameissue.png);
			}
			form#formulaCommentForm label.flagicon.nutritionalissue>span::before{
				background-image:url(images/icons/nutritionalissue.png);
			}
			form#formulaCommentForm label.flagicon.sugar>span::before{
				background-image:url(images/icons/sugar.png);
			}


	form#formulaCommentForm::after{
		content:"";
		display: block;
		clear:both;
	}




.flexdisplay{
	display: flex;
	clear: both;
}


	.flexdisplay>div{
		
	}

		.flexdisplay>div>label{
			padding-right: 3px;
		}

		.flexdisplay>div+div>label{
			width: 140px;
			padding-left: 10px;
		}

		.flexdisplay>div>div.faketext{
			width: 225px;
		}




h3.accordion{
	padding-top: .5em;
	clear:both;
/*	position: relative;*/

	cursor: pointer;
}

	h3.accordion::after{
		display: inline-block;
		padding: 0 1em;
		content: "â–¾";
		transition: transform .5s;
/*		position: absolute;*/
/*		top: 50%;*/
/*		right: 0;*/
/*		transform: translateY(-50%);*/
	}

div.accordionctn{
	clear:both;
	display: none;
}

h3.accordion.opened+div.accordionctn{
	display: block;
}

h3.accordion.opened::after{
	transform: rotate(-180deg);
}

label.showPassword{
	display: none;
	background: #EEEEEE;
	float: right;
	width: 647px;
	cursor: pointer;
}
label.showPassword:hover{
	background: #DDDDDD; 
}

	label.showPassword input{
		display: none;
	}

	label.showPassword span{

	}

		label.showPassword span::before{
			display: block;
			padding: 2px 0;
			text-align: center;
			content: "Show password";
			color: #888888;
			font-size: 12px;
		}

		label.showPassword input:checked+span::before{
			content: "Hide password";
		}

input[type="checkbox"].displaypassword:checked ~ input[type="password"] {
  -webkit-text-security: none;
  -moz-text-security: none;
  -ms-text-security: none;
  text-security: none;
}



#ingredientCompareUI{
	margin: -30px;
	position: relative;
	height: calc(100vh - 370px);

	transform-origin: 50% 0;
}

	#ingredientCompareUI>div{
/*		width: 50vw;*/
/*		max-width: 950px;*/
		width: 985px;
		position: absolute;
		top: 0;
		height: 100%;

		box-shadow: 0 0 0 1px black;
	}
	#ingredientCompareUI>div:first-child{
		right: 50%;
	}
	#ingredientCompareUI>div:last-child{
		left: 50%;
	}

		#ingredientCompareUI>div>iframe{
			width: 100%;
			height: 100%;
			border: 0;
		}


body.compareiframe{
	background: #FFF;
}

	body.compareiframe #website{
		background: #FFF;
	}

	body.compareiframe #header,
	body.compareiframe #topzone,
	body.compareiframe #subbar,
	body.compareiframe .pborder,
	body.compareiframe .dbmsgBox,
	body.compareiframe #footer,
	body.compareiframe .btnAjout,
	body.comparectn .addshadow.bottom:after{
		display: none;
	}

	body.compareiframe a,
	body.compareiframe form,
	body.compareiframe button,
	body.compareiframe .tdsComments{
		pointer-events: none;
	}

	body.compareiframe a.btt{
		opacity: 0;
	}

	body.compareiframe .addshadow{
		padding: 0;
		background: transparent;
	}

		body.compareiframe .addshadow.top:before,
		body.compareiframe .addshadow.top:after{
			display: none;
		}

	body.compareiframe div.box{

	}

	body.compareiframe .whole{
		width: 100%;
	}


#compareHeader{
	background: #003883;
	margin: -30px;
	margin-bottom: 30px;
	padding: 15px 30px;
	color: #FFFFFF;
	font-weight: bold;

	position: sticky;
	top: 0;
	z-index: 999;

	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	margin: 0;
	text-align: center;
}

#compareHeader+*{
	margin-top: 50px;
}


@media screen and (max-width:2000px){
	#ingredientCompareUI{
		transform: scale(.95);
	}
	#ingredientCompareUI>div{
		height: 106%;
	}
}


@media screen and (max-width:1915px){
	#ingredientCompareUI{
		transform: scale(.9);
	}
	#ingredientCompareUI>div{
		height: 112%;
	}
}

@media screen and (max-width:1830px){
	#ingredientCompareUI{
		transform: scale(.85);
	}
	#ingredientCompareUI>div{
		height: 118%;
	}
}

@media screen and (max-width:1730px){
	#ingredientCompareUI{
		transform: scale(.8);
	}
	#ingredientCompareUI>div{
		height: 125%;
	}
}

@media screen and (max-width:1640px){
	#ingredientCompareUI{
		transform: scale(.75);
	}
	#ingredientCompareUI>div{
		height: 134%;
	}
}


@media screen and (max-width:1500px){
	#ingredientCompareUI{
		transform: scale(1);
		background: #003883;
		height: 300px;
	}
		#ingredientCompareUI::before{
			content: "A larger window is needed to view this comparison.";
			color: #FFF;
			position: absolute;
			font-weight: bold;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
		}

	#ingredientCompareUI>div{
		display: none;
	}

}