/*
╭━━━━━━━━━━━╯ KARIMBA-DESIGN ╰━━━━━━━━━━━╮

	Feuille de styles du selecteur et de la prise de commandes

 _________________________________________________________
	Mis à jour le 15/08/2013 à 15:27:56 par Y. Guérin
	© KARIMBA-DESIGN > http://www.karimba-design.fr
╰━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━╯
*/


#mainselecteur input {
	outline: none;
}
#mainselecteur li {
	position: relative;
	border-bottom: 1px solid #CCC;
	padding:7px 0px 8px;
	clear: both;
}
#mainselecteur li.li1 {padding-bottom:15px;}
#mainselecteur li.li3 {padding-bottom:0px;height: 40px;}
.ie7 #mainselecteur li.li3 {margin-bottom:7px;}
#mainselecteur li.li4 {min-height:64px;}
#mainselecteur li h4 {
	position: absolute;
	left:-40px;
	top:3px;
	width: 25px;
	height:25px;
	line-height: 21px;
	font-family: cursive, sans-serif;
	text-align: center;
	font-size:22px;
	color:white;
	background: #AAA;
}
.lt-ie10 #mainselecteur li h4 {line-height:26px;}
#mainselecteur li.li1 h4 {top:11px;}
#mainselecteur li.li4 h4 {}
#mainselecteur li label {
	color:#B5000C;
	font-size: 13px;
	font-style: italic;
	cursor: default;
}
#mainselecteur li.li1 label strong {
	font-size: 19px;
}
#mainselecteur li label.souslabel {
	color:#888;
	font-size: 15px;
	font-weight: bold;
	font-style: normal;
	position: relative;
	top:-2px;
}
#mainselecteur li.li2 label em {
	color:#888;
	font-size: 11px;
	font-style: normal;
}
#mainselecteur li.li2 a.more {
	margin-left:20px;
	float: right;
	font-size:12px;
	font-weight: bold;
	margin-top: 2px;
}
#mainselecteur li.li2 a img {
	position: relative;
	top:-1px;
	margin-right:5px;
}

#mainselecteur li label.labelchkbox {
	margin:0px 20px;
}
#mainselecteur li label.labelchkbox input {
	margin-right:8px;
	vertical-align: middle;
}
#mainselecteur li input.entree,
#mainselecteur li textarea.entree {
	font-size: 19px;
	font-weight: bold;
	color:#000;
	padding:2px 5px;
	border: 1px solid #AAA;
	-webkit-border-radius: 4px;
	   -moz-border-radius: 4px;
		border-radius: 4px;
	background:#EEE;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#EEEEEE', endColorstr='#FFFFFF');
	background: -webkit-gradient(linear, left top, left bottom, from(#EEEEEE), to(#FFFFFF));
	background: -moz-linear-gradient(top, #EEEEEE, #FFFFFF);
}
#mainselecteur li input.entree:focus,
#mainselecteur li textarea.entree:focus {
	outline: none;
	border: 1px solid #67DD00;
}
#mainselecteur li input.plattyp {
	background: none;
	margin:0px 20px;
	font-size:18px;
	font-weight: bold;
	color:#888;
	padding:2px 10px 1px;
	position: relative;
	top:1px;
	border:1px solid #CCC;
	-webkit-border-radius: 8px;
	   -moz-border-radius: 8px;
		border-radius: 8px;
	-webkit-box-shadow:0px 1px 8px rgba(0,0,0,0.1);
	   -moz-box-shadow:0px 1px 8px rgba(0,0,0,0.1);
		box-shadow:0px 1px 8px rgba(0,0,0,0.1);
	background:#FFFFFF;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#EEEEEE');
	background: -webkit-gradient(linear, left top, left bottom, from(#FFFFFF), to(#EEEEEE));
	background: -moz-linear-gradient(top, #FFFFFF, #EEEEEE);
	-webkit-transition:	all 0.2s linear;
	-moz-transition:	all 0.2s linear;
	-ms-transition:		all 0.2s linear;
	-o-transition:		all 0.2s linear;
	transition:		all 0.2s linear;

}

#mainselecteur li input.plattyp.selected {
	/*background: transparent url(../images/fleche_verte_bas.png) no-repeat center 0px;*/
	color:#333;
	background:#DDDDDD;
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#DDDDDD', endColorstr='#EEEEEE');
	background: -webkit-gradient(linear, left top, left bottom, from(#DDDDDD), to(#EEEEEE));
	background: -moz-linear-gradient(top, #DDDDDD, #EEEEEE);
	-webkit-box-shadow: inset 0px 1px 8px rgba(0,0,0,0.3);
	   -moz-box-shadow: inset 0px 1px 8px rgba(0,0,0,0.3);
		box-shadow: inset 0px 1px 8px rgba(0,0,0,0.3);
}
.lt-ie9 #mainselecteur li input.plattyp {
	top:-2px;
}
#mainselecteur li input.plattyp:hover {
	background:#FFFFFF;
	color:#000;
	-webkit-box-shadow:0px 1px 8px rgba(0,0,0,0.4);
	   -moz-box-shadow:0px 1px 8px rgba(0,0,0,0.4);
		box-shadow:0px 1px 8px rgba(0,0,0,0.4);

}

#mainselecteur li.li3 div {
	position: absolute;
	top:5px;
	right: 0;
	background: #FFF;
	padding-left: 15px;
}
.ie7 #mainselecteur li.li3 div {
	top:-17px;
}

#mainselecteur li.li3 div input {
	text-align: right;
	width:40px;
	margin-right:5px;
	position: relative;
	top:-2px;
}
.ie7 #mainselecteur li.li3 div input {
	top:-5px;
}
#mainselecteur li.li3 p.menuunique {
	font-size: 11px;
}
#mainselecteur li.li3 div span,
#mainselecteur li.li4 div span.totalboissons,
#mainselecteur li.li5 div span.totalplateau {
	font-size:26px;
	font-weight: bold;
	color:#888;
}
#mainselecteur li.li3 div span.totalplateau {
	margin-left:36px;
}
#mainselecteur li sup {
	font-size: 60%;
}
.lt-ie10 #mainselecteur li sup {
	font-size: 80%;
}
#mainselecteur li input.button1 {
	margin-right:0px;
}
#mainselecteur li.li4 input.button1 {
	position: relative;
	top:-6px;
}
#mainselecteur li.li4 li {
	border-bottom: none;
	padding:1px 2px;
	color: #000;
}
#mainselecteur li.li4 li strong,
#mainselecteur li.li4 li span {
	display: block;
	float:left;
	width:50px;
}
#mainselecteur li.li4 li strong.deno {
	width:250px;
}
#mainselecteur li.li4 li strong.soustotal {
	text-align: right;
}

#mainselecteur li.li4 div.boutons {
	position: absolute;
	bottom:5px;
	right:0px;
}

#mainselecteur li.li5 div.total {
	clear: both;
	position: relative;
	top: 0px;
	margin-bottom: 10px;
}
#mainselecteur li.li5 div span.totalplateau {
	margin-left:20px;
	color:#000;
}
#mainselecteur li input#dat {
	width:100px;
	position: relative;
	z-index: 10;
}
#mainselecteur li input#datopener {
	position: relative;
	top:6px;
	width:27px;
	height:27px;
	margin-right:15px;
	background: transparent url(../images/calendar.gif) 0px -1px;
}
#mainselecteur li img#iedatopener {display:none;}
.lt-ie10 #mainselecteur li input#datopener {display:none;}
.lt-ie10 #mainselecteur li img#iedatopener {
	display:inline;
	position: relative;
	margin-left:5px;
	margin-top:-2px;
	border:1px solid #AAA;
	cursor: pointer;
}
.ie9 #mainselecteur li img#iedatopener {margin-top:-5px;}
.ie8 #mainselecteur li img#iedatopener {margin-top:-8px;}
#mainselecteur li.li5 p.txtdroite {
	clear: both;
	margin-top:15px;
	padding-bottom:10px;
}
#mainselecteur li.li5 p.txtdroite label {
	font-size:12px;
	font-style: italic;
	font-weight: normal;
	color:#666;
}
#mainselecteur li.li5 p.txtdroite input.button1 {
	position: relative;
	top:-13px;
	margin-left:10px;
}
#mainselecteur li.li5 p.txtdroite a {
	color:#666;
	text-decoration: underline;
}
#mainselecteur li.li5 p.txtdroite a:hover {
	color:#62AD23;
}
#mainselecteur li.li5 p.txtdroite label.noident {
	font-size: 11px;
	font-style: normal;
	font-weight: bold;
	color:#B5000C;
	margin-right:10px;
}
#mainselecteur li.li5 p.txtdroite label.noident a {
	color:#B5000C;
}
#mainselecteur li.li5 p.txtdroite span.alert {
	font-size: 1px;
	padding:0px 19px 17px 0px;
	position: relative;
	top:-5px;
	margin-right:5px;
	background: url(../images/alert.png) no-repeat 0px 0px;
}


#mainselecteur li div.selecteur {
	position: relative;
	overflow: hidden;
	width:668px;
	margin-top: 10px;
}
#mainselecteur li div.selecteur.formules {
	height:320px;
}
#mainselecteur li div.selecteur.suggestion {
	height:320px;
}
#mainselecteur li div.selecteur div.contenu {
	position: absolute;
	overflow: hidden;
	z-index: 1;
}
#mainselecteur li div.selecteur.formules div.contenu {
	left:17px;
	top:52px;
	width:610px;
	height:237px;
}
#mainselecteur li div.selecteur.suggestion div.contenu {
	left:17px;
	top:15px;
	width:610px;
	height:248px;
}
#mainselecteur li div.selecteur.formules div.contenu ul {
	position: absolute;
	top:0px;
	width:200px;
}
#mainselecteur li div.selecteur.formules div.contenu ul.entree	{left:0px;}
#mainselecteur li div.selecteur.formules div.contenu ul.plat	{left:203px;}
#mainselecteur li div.selecteur.formules div.contenu ul.dessert	{left:406px;}
#mainselecteur li div.selecteur.formules div.contenu ul li {
	height:250px;
	padding: 0px;
	border-bottom: none;
}
#mainselecteur li div.selecteur.formules div.contenu ul li img {
	width:200px;
	height:200px;
}
#mainselecteur li div.selecteur.formules div.contenu ul li h5 {
	position: absolute;
	top:200px;
	height:38px;
	width:200px;
	font-size:12px;
	color:#333;
	text-align: center;
	font-weight: normal;
}
#mainselecteur li div.selecteur div.contenu p {
	text-align: center;
	background: url(../k_core/images/1x1_FFFFFF_90.png) repeat;
	color:#333;
}
#mainselecteur li div.selecteur div.contenu em.allerg {
	text-align: center;
	position: absolute;
	bottom: 22px;
    left: 0;
    color: #666;
    font-size: 10px;
    width: 200px;
}
#mainselecteur li div.selecteur.formules div.contenu p {
	display:none;
	position: absolute;
	top:0px;
	width:170px;
	padding:15px;
	height:216px;
	font-size: 13.5px;
	line-height: 1.3em;
}
#mainselecteur li div.selecteur.formules div.contenu h6 {
	position: absolute;
	top:9px;
	right: 5px;
	padding:3px 7px 1px;
	font-size: 16px;
	font-weight: bold;
	background: #D00;
	color: #FFF;
    -ms-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    transform: rotate(5deg);
	-webkit-box-shadow:0px 1px 8px rgba(0,0,0,0.3);
	   -moz-box-shadow:0px 1px 8px rgba(0,0,0,0.3);
			box-shadow:0px 1px 8px rgba(0,0,0,0.3);
}
#mainselecteur li div.selecteur.suggestion div.contenu table {
	position: absolute;
	top: 0px;
	left: 103px;
	width: 400px;
	height: 250px;
	overflow: hidden;
}

#mainselecteur li div.selecteur.suggestion div.contenu table td {
	vertical-align: middle;
	text-align: center;
}
#mainselecteur li div.selecteur.suggestion div.contenu table td p {
	font-family: "GemelliRegular", "Comic Sans MS", cursive;
	font-size: 16px;
	line-height: 18px;
	background: none;
	color: #FFF;
	margin: 10px 0px;
}

#mainselecteur li div.selecteur div.masque div {
	float: left;
	height:320px;
	background: transparent no-repeat 0px 0px;
	position: relative;
	z-index: 5;
}
#mainselecteur li div.selecteur.formules div.masque div.g {width:30px;background-image: url("../images/selecteur_form_g.png");}
#mainselecteur li div.selecteur.formules div.masque div.c {width:200px;background-image: url("../images/selecteur_form_c.png");background-repeat: repeat-x;}
#mainselecteur li div.selecteur.formules div.masque div.d {width:30px;background-image: url("../images/selecteur_form_d.png");}
#mainselecteur li div.selecteur.formules div.masque div.sep {width:3px;background-image: url("../images/selecteur_form_sep.png");}
#mainselecteur li div.selecteur.formules div.masque div.c1,
#mainselecteur li div.selecteur.formules div.masque div.c3 {width:187px;}

#mainselecteur li div.selecteur.suggestion div.masque div.g {width:30px;background-image:  url("../images/selecteur_sugg_g.png");}
#mainselecteur li div.selecteur.suggestion div.masque div.c {width:580px;background-image: url("../images/selecteur_sugg_c.png");background-repeat: repeat-x;}
#mainselecteur li div.selecteur.suggestion div.masque div.d {width:30px;background-image:  url("../images/selecteur_sugg_d.png");}

#mainselecteur li div.selecteur.formules div.interface {
	position: absolute;
	top:26px;
	left:17px;
	width:617px;
	z-index: 7;
}
#mainselecteur li div.selecteur.formules div.interface div {
	float: left;
	z-index: 7;
	width:200px;
	height:283px;
	margin-right:3px;
	position: relative;
}
#mainselecteur li div.selecteur.formules div.interface div h3 {
	position:relative;
	top:-15px;
	text-align: center;
	font-size:17px;
	letter-spacing: 0.2em;
	color:#B5000C;
	z-index: 6;
}
#mainselecteur li div.selecteur.formules div.interface div a {
	display: block;
	position: absolute;
	width:200px;
	height:31px;
	left:0px;
	background: transparent no-repeat center 10px;
}
#mainselecteur li div.selecteur.formules div.interface div a.infos {
	top:31px;
	height:221px;
	z-index: 8;
}
#mainselecteur li div.selecteur.formules div.interface div a.h {
	top:0px;
	background-image: url(../images/selecteur_form_h.png?c=1);
}
#mainselecteur li div.selecteur.formules div.interface div a.b {
	bottom:0px;
	background-image: url(../images/selecteur_form_b.png?c=1);
	background-position: center 13px;
}
#mainselecteur li div.selecteur.formules div.interface div a.h:hover,
#mainselecteur li div.selecteur.formules div.interface div a.h.animover {
	background-image: url(../images/selecteur_form_h_over.png?c=1);
}
#mainselecteur li div.selecteur.formules div.interface div a.b:hover,
#mainselecteur li div.selecteur.formules div.interface div a.b.animover {
	background-image: url(../images/selecteur_form_b_over.png?c=1);
}
#mainselecteur p.rappelurgence {
	padding-top:3px;
	font-size:11px;
}

#mainselecteur ul.boissonsliste {width: 540px;}
#mainselecteur ul.boissonsliste li {
	border-top:1px solid #EEE;
}

#bselecteur {
	position: relative;
	background: #EEE;
	-webkit-box-shadow:1px 4px 15px #888888;
	   -moz-box-shadow:1px 4px 15px #888888;
		box-shadow:1px 4px 15px #888888;
	-webkit-border-radius: 16px;
	   -moz-border-radius: 16px;
		border-radius: 16px;
	border:2px solid #FFF;
	padding:20px;
	margin: 20px 0px;
}
#bselecteur h5 {
	font-size:22px;
	color: #B5000C;
	padding-bottom:5px;
	margin-top:-5px;
	margin-bottom:10px;
	border-bottom: 1px solid #CCC;
}
#bselecteur span.close {
	background: transparent url(../images/close_888888.png) no-repeat 0px 0px;
	display: block;
	width:16px;
	height:16px;
	position: absolute;
	top:20px;
	right:20px;
	cursor: pointer;
}
#bselecteur span.close:hover {background-position: 0px -16px;}

#mainselecteur li.li4 #bselecteur ul li {
	float: left;
	clear: none;
	width:300px;
	-webkit-border-radius: 10px;
	   -moz-border-radius: 10px;
		border-radius: 10px;
	border:1px solid #CCC;
	padding:10px;
	background: #FFF;
	margin: 0px 5px 5px 0px;
}

#bselecteur ul li {position: relative;}
#bselecteur ul li img {
	float:right;
	margin: 0px 10px 5px 10px;
}
#bselecteur ul li h6 {
	font-size:15px;
	color:#333;
	position: relative;
	top:-4px;
}
#bselecteur ul li p.description {
	color:#666;
	font-size: 12px;
}
#bselecteur ul li div {
	clear: both;
	text-align: right;
	font-size:16px;
	color:#888;
	padding-top: 4px;
}
#bselecteur ul li div label {
	font-size:12px;
}
#mainselecteur li #bselecteur ul li div input.entree {
	width:30px;
	padding:1px 4px;
	text-align: right;
	font-size:15px;
}
#mainselecteur li.li4 #bselecteur ul li div strong {
	display: inline;
	float:none;
	color:#000;
}
#bselecteur div.boutonsbas {
	clear: both;
	height: 20px;
}
#bselecteur p.nouveau {
	position: absolute;
	top:0px;
	right: -10px;
	padding:1px 3px 0;
	font-size: 11px;
	font-weight: bold;
	background: #D00;
	color: #FFF;
    -ms-transform: rotate(5deg);
    -webkit-transform: rotate(5deg);
    transform: rotate(5deg);
	-webkit-box-shadow:0px 1px 6px rgba(0,0,0,0.3);
	   -moz-box-shadow:0px 1px 6px rgba(0,0,0,0.3);
			box-shadow:0px 1px 6px rgba(0,0,0,0.3);
	z-index: 10;
}

#compositionpanier ul {
	font-size: 20px;
	line-height: 40px;
	width:150px;
	color:#666;
	font-weight: bold;
}
#compositionpanier ul.col1 {float:left;}
#compositionpanier ul.col2 {margin-left:170px;}

#mainselecteur span.cacheloader,
#mainselecteur li.li4 #bselecteur li span.cacheloader {
	position: absolute;
	background: url(../images/loader_platoons1.gif) no-repeat center center;
}
#mainselecteur span.cacheloader {
	width:200px;
	height:200px;
	top:0px;
	left:0px;
}
#mainselecteur li.li4 #bselecteur li span.cacheloader {
	width:90px;
	height:90px;
	top: 35px;
	left: 210px;
}
#mainselecteur p.livraison {font-size: 12px;margin-top: 10px;}
#mainselecteur p.livraison a {letter-spacing: 0.05em;}
#mainselecteur p.livraison a:hover {text-decoration: underline;}
#mainselecteur p.livraison span.currentadr {margin: 0 10px;}
#mainselecteur p.livraison span.currentadr.false {text-decoration: line-through;}
#mainselecteur p.allergenes {margin-top: 3px;}
#mainselecteur p.allergenes label {color: #666; font-style: normal;cursor: pointer;font-size: 12px;}
#mainselecteur p.allergenes label:hover {color: #5FCC00;text-decoration: underline;}
#mainselecteur p.allergenes label input {margin-right: 5px;font-size: 12px; vertical-align: middle;}
#mainselecteur #newadresse,
#mainselecteur #allergies {
	width: 97%;
	margin: 3px 0 10px;
	font-size: 12px;
	font-weight: normal;
	padding: 3px 7px;
}

.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
	opacity: 1;

}
.ui-state-disabled span.ui-state-default,
.ui-widget-content .ui-state-disabled span.ui-state-default,
.ui-widget-header .ui-state-disabled span.ui-state-default {
	opacity: 0.35;
}
td.ui-state-disabled {position: relative;}
td.ui-state-disabled[title="Complet"]:before,
td.ui-state-disabled[title="Congés"]:before {
	content: attr(title);
	display: none;
	position: absolute;
	top:-2.5em;
	left:50%;
    width: 5em;
	margin-left: -3.3em;
	padding: 0.3em 0.8em;
	background: #AE111D;
	color: #FFF;
	font-weight: bold;
	font-size: 1em;
    text-align: center;
	z-index: 10;
	-webkit-border-radius: 0.3em;
   -moz-border-radius: 0.3em;
        border-radius: 0.3em;
		-webkit-box-shadow:0 0 0.5em rgba(0,0,0,0.4);
		   -moz-box-shadow:0 0 0.5em rgba(0,0,0,0.4);
				box-shadow:0 0 0.5em rgba(0,0,0,0.4);
}
td.ui-state-disabled[title="Complet"]:hover:before,
td.ui-state-disabled[title="Congés"]:hover:before,
td.ui-state-disabled[title="Complet"]:hover:after,
td.ui-state-disabled[title="Congés"]:hover:after {
	display: block;
}
td.ui-state-disabled[title="Complet"]:after,
td.ui-state-disabled[title="Congés"]:after {
	content:"";
	display:none;
	position:absolute;
	left: 0.7em;
    top: -0.55em;
    width: 0;
    height: 0;
    border-left: 0.7em solid transparent;
    border-right: 0.7em solid transparent;
    border-top: 0.8em solid #AE111D;
	z-index: 11;
}

@media screen and (max-width: 530px) {
	#mainselecteur li {
		padding:7px 0px 8px;
	}
	#mainselecteur li.li1 input.plattyp {
		margin: 3px 10px;
	}
	#mainselecteur li.li3 {padding-bottom:0px;min-height: 76px;}
	#mainselecteur li.li4 {padding-top:8px;}
	#mainselecteur li h4 {
		left:0px;
		width: 20px;
		height:20px;
		line-height: 19px;
		font-family: cursive;
		font-size:22px;
	}
	#mainselecteur li.li1 h4,
	#mainselecteur li.li4 h4 {top:3px;}
	#mainselecteur li label {
		margin-left:28px;
	}
	#mainselecteur li label.souslabel {
		margin:0px;
		display: block;
	}
	#mainselecteur li.li3 div {
		top: 0px;
		position: relative;
		float: none;
		text-align: right;
	}
	#mainselecteur li input#datopener {
		margin-right:0px;
	}
	#mainselecteur li.li3 div span.totalplateau {
		margin-left:10px;
	}
	#mainselecteur li input.entree {
		padding:1px 3px;
	}

	#mainselecteur li.li5 p.txtdroite {
		margin-top:20px;
		padding-bottom:5px;
	}
	#mainselecteur li.li5 p.txtdroite input.button1 {
		top:-4px;
		margin-left:10px;
		margin-bottom:20px;
	}
	#mainselecteur li.li5 .nouveaucb {
		float: none;
		margin: 5px 0 5px;
		width: auto;
	}
	#mainselecteur li.li5 .nouveaucb p,#mainselecteur li.li5 .nouveaucb h5 {
		display: inline;
		font-size: 11px;
	}
	#mainselecteur li.li5 div.total {
		float: none;
		text-align: right;
		width: 100%;
	}
	#mainselecteur li.li5 .total label.souslabel {
		display: inline;
	}
	#mainselecteur li label.souslabel[for="dat"] {
		display:inline;
	}


	#bselecteur {
		padding:10px;
		margin: 10px 0px 20px;
	}
	#bselecteur h5 {
		font-size:19px;
		padding-bottom:3px;
	}
	#bselecteur span.close {
		top:11px;
		right:11px;
	}

	#mainselecteur li.li4 #bselecteur ul li {
		float: none;
		width:auto;
		margin: 0px 0px 5px;
	}

	#bselecteur ul li img {
		margin: 0px 0px 5px 5px;
	}
}

/* ╰━┅┉┈  © KARIMBA-DESIGN - www.karimba-design.fr  ┈┉┅━╯ /*
