/*****by LPJ juillet 2018********/

#holiday_table tr td {
    height: 24px;
}

.popup .center .btn.holiday_del_btn {
	width: 45px;
}

.popup .center p.del-info {
    font-size: 18px;
    margin-bottom: 10px;
}

.loader {
	background: rgba(0,0,0,.6);
    border: none;
    display: flex;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 0 20px;
    width: 100%;
    box-sizing: border-box;
    z-index: 2;
    transition: all .5s ease;
}

.loader div img {
	display: block;
	margin: 10px auto 0 auto;

}

.loader div p {
	font-size: 15px;
	font-weight: 500;
	text-align: center;
}

.se-pre-con {
	display: none;
    font-size: 15px;
    font-weight: 500;
    margin: 0;
}

.se-pre-con p {
	margin-bottom: 10px;
}

*{margin:0;padding:0}
body{background:#efe7d7;font-family:Roboto,sans-serif;font-weight:300;color:#222}
h1,h2,h3{font-family:'Roboto Slab',serif;font-weight:400}
h1{font-size:24px}
h1 span {float: right;font-size: 20px;color: #a83347;}
h2{font-size:18px;margin:0 0 30px}
h3{font-size:14px;margin:0 0 20px}
a{color:inherit;text-decoration:none}
a:hover{color:#ff6600;text-decoration:underline}
img{border:none}
button,input,select,textarea{font-family:Roboto,sans-serif;font-weight:300;box-sizing:border-box;border:1px solid #ccc;padding:5px}
input:not(input[type=radio],input[type=checkbox]),textarea{-webkit-appearance:none;-webkit-border-radius:0}
input[type=radio],input[type=checkbox]{position:relative;top:1px;margin:0 5px 0 0;-webkit-border-radius:0}
input[type=date]{height:28px;min-width:110px}
input:focus,input:hover{border-color:#aaa}
input[type=search]::-ms-clear,input[type=search]::-ms-reveal{display:none}
input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration,input[type=search]::-webkit-search-results-button,input[type=search]::-webkit-search-results-decoration{display:none}
input[type=search]{padding:5px 25px 5px 30px}
input[type=search]:focus,input[type=search]:hover{border-color:#3c8dbc}
label[for=search]{display:inline-block;position:relative;font-size:0;margin:0 -36px 0 0;padding:7px 10px;cursor:pointer;z-index:1}
label[for=search]:hover{color:#3c8dbc}
label[for=search]:before{content:"\f002";font-family:"Font Awesome 5 Free";font-weight:700;font-size:12px}
table{border-collapse:collapse;width:100%;min-width:750px}
table td,table th{font-size:14px;padding:10px;text-align:left}
table th{font-size:12px;text-transform:uppercase}
table td,table th{border-bottom:1px solid #ccc}
table tr td input[name="dateMin"]{width: 100px; height: 29px; padding: 0; border: none;}
table .input label{display:inline-block;font-weight:400;min-width:80px}
table .input input{margin:0 0 -1px;padding:7px 10px;max-width:130px}
table .input input:focus,table .input input:hover{position:relative;z-index:1}
table h3{font-size:14px;margin:0}
table p{margin:5px 0 0}
table p span:last-child{display:block;margin:20px 0 0}
.tableScroll{overflow-x:auto;clear:both}
.tableScroll:not(:last-child){margin:0 0 80px}
.btn{background:#3c8dbc;border:none;color:#fff;font-size:12px;display:inline-block;padding:5px 10px;border-radius:2px;cursor:pointer}
.btn:active{position:relative;top:1px}
.btn:hover{background:#4c99c6;color:#fff;text-decoration:none;}
.btn.add{background:#7b5d42}
.btn.add:hover{background:#5a4430}
.btn.terminer{font-size: 14px;}
.btn.terminer i {margin-right: 5px;}
.btn.change{background:#f39c12}
.btn.change:hover{background:#f4a62a}
.btn.edit{background:#55a62d}
.btn.edit:hover{background:#5bb230}
.btn.delete{background:#b9314b}
.btn.delete:hover{background:#b50023;}
.btn.description{background:none;color:#b9b9b9;padding:0 5px;font-size:14px}
.btn.description:hover{color:#ff6600}
.btn.holiday{background:#f39c12}
.btn.holiday:hover{background:#f4a62a}
.btn.classe{background:#9c182f;}
.btn.classe:before{margin: 0!important;}
.button .btn.classe:before{margin: 0 5px 0 0!important;}
.btn.default,.btn.default:hover{background:#ddd;color:#aaa;position:static;cursor:no-drop}
.btn:after,.btn:before{font-family:"Font Awesome 5 Free";font-weight:700;margin:0 5px 0 0}
.btn:after{float:right;margin:1px 0 0 5px}
.btn.close:before{content:"\f00d"}
.btn.back:before{content:"\f359";font-weight:inherit}
.btn.save:before{content:"\f00c"}
.btn.save i {display: none;}
.btn.load {pointer-events: none;}
.btn.load:before {display: none;}
.btn.load i {display: inline-block;margin-right: 5px;}
.btn.add:before{content:"\f067"}
.btn.change:before{content:"\f362"}
.btn.edit:before{content:"\f303"}
.btn.delete:before{content:"\f1f8"}
.btn.description:before{content:"\f059"}
.btn.presence:before{content:"\f058"}
.btn.classe:before{content:"\f0c0"}
.btn.menu:before{content:"\f002"}
.btn.holiday:before{content:"\f185"}
.btn.pdf:before{content:"\f1c1"}
.btn.send:before{content:"\f0e0"}
.btn.legend:before{content:"\f05a"}
.btn.groupe:before{content:"\f013"}
.btn.groupe:after,.btn.legend:after{content:"\f107"}
.btn.groupe.show:after,.btn.legend.show:after{content:"\f106"}
.btn.download:after{content:"\f358";font-weight:inherit;opacity:0;margin:1px -3px 0 5px;transition:all .5s ease}
.btn.download:hover:after{opacity:1}
header nav,section{max-width:1140px;min-width:280px;margin:0 auto}
header{background:#fff}
header nav{padding:15px 20px;position:relative;overflow:hidden}
header div{float:left}
header div a{display:inline-block}

/** header img,header svg{position:relative;top:2px;height:50px;width:208px;z-index:2} **/
header img,header svg{position:relative;top:-2px;height:50px;width:70px;z-index:2}


header ul{float:right;margin:15px 0 0}
header li{display:inline-block}
header li:last-child a{background:#ddd;border-radius:3px;display:inline-block;margin:0;padding:5px 10px;text-transform:inherit}
header li:last-child a:hover{background:#eee;color:#ff6600;border:none}
header li:last-child a:before{content:"\f011";font-family:"Font Awesome 5 Free";font-weight:700;display:inline-block;margin:0 5px 0 0;transition:all .5s ease}
header li:last-child a:hover:before{transform:rotate(-90deg)}
header a{font-size:12px;margin:0 20px 0 0;text-transform:uppercase;cursor:pointer;}
header a.active,header li a:hover{border-bottom:3px solid #ff6600;color:inherit;text-decoration:none}
header a.active{font-weight:500;}
.menuBurger.active header svg{position:fixed;top:17px}
.menuBurger.active header svg *{fill:#fff}
.menuBurger header ul:before{content:"\f0c9";font-family:"Font Awesome 5 Free";font-size:22px;font-weight:700;position:absolute;top:0;right:0;padding:30px;cursor:pointer}
.menuBurger header ul li{display:inherit;text-align:center}
.menuBurger header ul li:first-child{margin:150px 0 0}
.menuBurger header ul a{color:#fff;font-weight:500;display:block;font-size:20px;margin:0;padding:20px;text-transform:inherit}
.menuBurger header ul a.active,.menuBurger header ul a:hover{border:none;text-decoration:underline}
.menuBurger header ul li:last-child a{background:#7d2133;color:#fff;position:absolute;right:0;bottom:0;left:0;padding:20px}
.menuBurger:not(.active) header ul:hover:before{color:#ff6600}
.menuBurger:not(.active) header ul li{display:none!important}
.menuBurger.active header ul:before{content:"\f410";font-weight:inherit;color:#fff}
.menuBurger.active header ul{background:#ff6600;position:fixed;top:-15px;left:0;right:0;bottom:0;min-width:320px;z-index:1}
section{padding:50px 20px 0}
section>.btn{float:right;margin:-20px 0 0 10px}
#content{background:#fff;margin:20px 0 0;padding:0;box-shadow:0 2px 3px rgba(0,0,0,.1)}
#content>.back{cursor:pointer;position:absolute;font-size:16px;padding:5px 0;color:#fff;transition:all .5s ease}
#content>.back:hover{color:#ff6600;text-decoration:inherit}
#content>.back:before{content:"\f060";font-family:"Font Awesome 5 Free";font-weight:700;font-size:17px;color:#fff;background:#ff6600;margin:0 3px 0 0;padding:5px 10px;transition:all .5s ease}
#content>.back:hover:before{padding:5px 14px 5px 6px}
#content>div{padding:50px}
#tabs{overflow:hidden}
#tabs li{float:left;list-style:none}
#tabs li a{display:inline-block;border-top:4px solid #ccc;color:inherit;padding:10px 20px;font-size:14px;text-decoration:none}
#tabs li a:hover{border-color:#aaa}
#tabs li a.active{border-color:#ff6600;font-weight:400;}
#menu{float:right;margin:50px 50px 0}
#menu>ul:nth-child(2){margin:0 10px}
#menu ul{position:relative;display:inline-block}
#menu li{list-style:none}
#menu .sub span,#menu a{background:#fff;display:inline-block;border:1px solid #aaa;border-radius:2px;font-size:12px;padding:5px 10px;cursor:pointer;position:relative}
#menu .sub span:hover{background:#aaa;color:#fff}
#menu .sub span:after{content:"\f107";font-family:"Font Awesome 5 Free";font-weight:700;margin:0 0 0 5px;position:relative;top:1px}
#menu>ul:not(.sub) a:before{content:"\f1c1";font-family:"Font Awesome 5 Free";font-weight:inherit;margin:0 7px 0 0}
#menu>ul:not(.sub) a{background:#eee;border:none;color:#ff6600}
#menu>ul:not(.sub) a:hover{background:#ff6600;color:#fff}
#menu ul ul{background:#fff;border:1px solid #aaa;border-radius:2px;position:absolute;top:26px;left:0;width:100%;min-width:220px;text-align:left;box-sizing:border-box;z-index:1;display:none}
#menu ul ul a{display:block;border:inherit;border-radius:inherit}
#menu ul ul a:hover{background:#aaa;color:#fff;text-decoration:none}
#menu .sub.active span{background:#aaa;border-color:#aaa;color:#fff;border-radius:2px 2px 0 0}
#menu .sub.active span:before{font-weight:700}
#menu .sub.active span:after{content:"\f106"}
.food h2{border-bottom:1px solid #ddd;padding:0 0 10px}
.food h2 a{font-size:0}
.food h2 a:before{content:"\f1c1";font-family:"Font Awesome 5 Free";font-weight:700;font-size:20px;color:#ff6600;margin:0 5px 0 0;transition:all .3s ease}
.food h2 a:hover:before{color:#3c8dbc}
.food h2 span{font-size:12px;font-style:italic}
.food h2 span:before{content:"-";margin:0 5px 0 0}
.food article{margin:50px 0 0}
.food article>h3{background:#666;display:inline-block;font-size:14px;color:#fff;margin:0;padding:10px 20px;border-radius:3px 3px 3px 0}
.food article h3:before{content:"\f2e7";font-family:"Font Awesome 5 Free";font-weight:700;margin:0 10px 0 0}
.food article aside{border:1px solid #ccc;border-top-color:transparent;border-right-color:transparent;font-size:18px;padding:15px 20px;position:relative;border-radius:0 0 0 3px}
.food article p{font-family:'Indie Flower',cursive;line-height:150%}
.food article .ingredient{font-family:Roboto,sans-serif;font-size:12px;display:block;color:#3c8dbc;margin:0 0 30px}
.food article .ingredient:last-child{margin:0}
.food article .comment{border-bottom:1px solid #3c8dbc;border-radius:2px 2px 0 0;font-size:12px;float:right;position:relative;top:-26px}
.food article .comment:before{content:"\f075";font-weight:inherit}
.info{position:relative;margin:0 0 20px}
.info h2{margin:0 0 5px}
.info p a{font-size:14px;font-weight:500}
.info a:hover{text-decoration:none}
.info a.email:before,.info a.tel:before{font-family:"Font Awesome 5 Free";font-weight:700;margin:0 10px 0 0}
.info a.tel:before{content:"\f095"}
.info a.email:before{content:"\f0e0"}
.info [type=search]{margin:20px 0 0}
.button{position:absolute;top:0;right:0}
.button .btn{display:block;margin:0 0 10px;width: 120px;}
.info .tableScroll{margin:0}
.tableScroll table tr td a.btn {margin-bottom: 4px;}
.info table.legend{margin:30px 0 0;min-width:420px;display:none}
.info table.legend td,.info table.legend th{border:1px solid #aaa;font-size:12px;padding:5px;text-align:center}
.info table.legend span{display:block;margin:0}
.info .next,.info .prev{float:left;font-size:12px;margin:50px 0 10px}
.info .next{float:right}
.info .next:hover,.info .prev:hover{color:#f39c12}
.info .next:after,.info .prev:before{content:"\f100";font-family:"Font Awesome 5 Free";font-weight:700;margin:0 3px 0 0}
.info .next:after{content:"\f101";margin:0 0 0 3px}

article.student{width:100%;}

form.student{display:flex;flex-wrap:wrap;width:100%;justify-content:space-between;font-size:13px}
form.student > div{width:48%;}
form.student h3{width:100%;font-family: Roboto,sans-serif;text-transform:uppercase;font-weight:600;}
form.student label.title{display:block;width:100%;margin:0 0 10px;font-weight: 500;border:0;padding:0;}
form.student label{padding: 12px 10px;display: block;border: 2px solid #E6E6E6;width: 100px;margin:2px 4px 2px 0;font-weight: 400;}
form.student > div.age label{width:125px}
form.student > div.age label:first-child{width:100%;}
form.student > div.age label:last-child{margin:2px 0;}
form.student > div div.age, form.student div div.presence{width: 100%;display: flex;flex-wrap: wrap;margin:0 0 15px;}
form.student > div div.age {margin-top: -35px;}
form.student > div div input{display:none}
form.student > div:nth-of-type(1) input, input.field{width:100%;border: 2px solid #E6E6E6;border-radius: 0;font-weight: 400;color: inherit;margin: 0 0 10px;padding: 12px 10px;line-height: normal;transition: border-color 0.2s ease, outline 0.2s ease;}
form.student > div:nth-of-type(1) input:focus, form.student div select:focus{outline: none !important;;border: 2px solid #FF6600;}
form.student .regime_container {display: flex; gap: 10px; align-items: center}
form.student .pescetarien {cursor: pointer; padding: 12px 10px;display: block;border: 2px solid #E6E6E6;width: 100px;margin:0 0 15px 0;font-weight: 400;}
form.student .pescetarien.active {background: #FFD0B0; border: 2px solid #FF6600;}
form.student > div select{-webkit-appearance:none;-moz-appearance:none;height: 45px; width: 100%;border-radius:0;border: 2px solid #E6E6E6;background-size: 7%;background-image: url(../img/icon-arrow-dropdown.svg);background-repeat: no-repeat;background-position: right;;margin:0 0 15px;font-weight: 400;color: inherit;padding: 12px 10px;line-height: normal;transition: border-color 0.2s ease, outline 0.2s ease;}
form.student > div input[type="email"]{margin: 0 0 15px}
form.student label.checked {background:#FFD0B0;border: 2px solid #FF6600;}
.presence > label:not(.title){width:60px!important}
form.student > div:last-child{margin: 20px 0 0 auto;width: 100%;}
form.student > div span.btn:hover{border:2px solid #4c99c6;}
article.student > div{float:left;margin-right:20px}
article.student > p{margin: 6px 5px 20px 0;float: left;}
article.student > span,form.student > div > span.btn, form.student > div a.cancel{display:block;padding: 12px 0;border-radius: 0;border: 2px solid #1e7eb5;text-align: center;width:130px;}
article.student > span{border: 2px solid #b50023;background-color:#b9314b;color:#FFF;height: 14px;}
article.student > span:hover{background-color:#b50023;}
form.student > div a.cancel{border: 2px solid #e45b00;background-color:#ff6601;color:#FFF;height: 14px;text-decoration:none;}
form.student > div a.cancel:hover{background-color:#e45b00}
article.student > span{height: 15px;margin: 2px 0;padding: 12px;width: 15px;float:right;}
article.student > span:before{margin:0;}
form.student > div > span.btn{float:right;}
form.student > div a.cancel{float:left;}
form.student > span{margin:0 0 5px;}
form.student > span:before{content:"\f015";font-family: "Font Awesome 5 Free";font-weight: 700;margin:0 5px 0 0;}
form.student > div > span.btn:active{position: inherit;}
#presence{border-right:1px solid #e8ded4;border-left:1px solid #e8ded4;min-width:950px}
#presence>tr:nth-child(odd) td{background:#faf7f5}
#presence>tr:last-child td{background:#c5aa91;border-color:#c5aa91;font-style:italic;font-size:10px;padding:5px;text-align:center}
#presence th{background:#5a4430;border-bottom:none;color:#fff;position:relative}
#presence th:first-child{text-align:center;min-width: 160px;}
#presence th span{display:block;font-size:10px;font-weight:300;margin:2px 0 0;text-transform:none}
#presence th sup{background:#392b1e;font-size:10px;font-weight:500;color:#fff;border-radius:2px;position:absolute;top:6px;left:80px;padding:5px}
#presence th sup:before{content:"\f183";font-family:"Font Awesome 5 Free";font-weight:700;display:block;margin:0 0 3px;text-align:center}
#presence td{font-size:11px;width:15%}
#presence td:first-child{border-right:1px solid #e8ded4;width:25%}
#presence td:first-child .name{display:inline-block;position:relative;top:4px;font-size:14px;text-overflow:ellipsis;white-space:nowrap;overflow:hidden;max-width:138px;text-transform:capitalize;text-decoration:none}
#presence td:first-child .inactif{text-decoration: line-through;}
#presence td:first-child a.name:before{content:"\f002";font-family:"Font Awesome 5 Free";font-weight:700;font-size:10px;margin:0 5px 0 0;position:relative;top:-1px}
#presence td:first-child .name span{background:#3c8dbc;color:#fff}
#presence td:first-child .age{font-size:10px}
#presence td:first-child .age:before{content:"/";font-size:14px;margin:0 3px}
#presence .effectChange{transition:all .5 ease;animation:effectChange 1s ease}
@keyframes effectChange{0%{background:#f39c12;color:#fff}
}
#presence .presence.edit{cursor:pointer}
#presence .presence:before,.legend .presence:before{content:"";font-family:"Font Awesome 5 Free";font-weight:700;font-size:10px;color:#fff;background:#aaa;display:inline-block;border-radius:50%;padding:5px 6px;height:12px;width:10px;text-align:center}
#presence .presence.dispo:before,.legend .presence.dispo:before{background:#55a62d}
#presence .presence.dispo.edit:before,.legend .presence.dispo.edit:before{background:#f39c12}
#presence .presence.lock:before,.legend .presence.lock:before{content:"\f023"}
#presence .presence.edit:before,.legend .presence.edit:before{content:"\f303";color:#333}
#presence .presence.close:before,.legend .presence.close:before{content:"\f056";background:#ff6600}
#presence .presence.dispo.edit:hover:before,#presence .presence.edit:hover:before{background:#c87f0a;color:#fff}
#presence .presence.edit:hover:before{background:#555}
#presence .regime{display:inline-block;position:relative;top:4px;margin:0 0 0 5px;max-width:94px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#presence .allergenes{position:relative;float: right;top:5.5px;max-width:94px;overflow:hidden;font-family:"Font Awesome 5 Free";font-weight:700;color:#da1919}
#presence .allergenes:before{content:"\f071"}
#presence .allergenes:hover{cursor:pointer;color:#ff6600}
#presence .box{display:inline}
#presence .box:hover .regime{color:#f39c12;cursor:pointer}
#presence select{margin:0 0 10px}
.datepicker{border: 1px solid #ccc;border-radius: 0 3px 3px 0!important;padding: 10px;width: 120px;height: 29px;}
.datepicker::placeholder{font-size:13px}
label.fa-calendar-alt{background:#fff;border:1px solid #ccc;border-radius:3px 0 0 3px;float:left;margin:0 -1px 0 0;height:27px;line-height:25px;width:30px;text-align:center;cursor:pointer}
label.fa-calendar-alt:hover{border-color:#aaa;color:#3c8dbc}
.popup:not(.open){display:none}
.popup{background:rgba(0,0,0,.6);border:none;display:flex;position:fixed;top:0;right:0;bottom:0;left:0;padding:0 20px;width:100%;box-sizing:border-box;z-index:2;transition:all .5s ease}
.popup .close{background:#5fba32;border-radius:inherit;font-size:16px;font-weight:400;padding:10px 20px;position:absolute;right:0;left:0;bottom:-39px;text-align:center}
.popup .close:hover{background:#6bca3c}
.popup .close:active{top:inherit}
.popup .center{max-width:230px;text-align:center}
.popup>div,.popup>form{background:#fff;margin:-40px auto 0;padding:30px 30px 20px;max-width:300px;width:100%;position:relative;align-self:center;opacity:0;animation:anim .5s ease forwards}

.loader div {
    padding: 12px 0px 20px;
    max-width: 230px!important;
}

@keyframes anim{0%{margin-top:-200px}
100%{opacity:1}
}
.popup>div.allergene{}
.popup .error,.popup .success{background:#55a62d;font-size:18px;color:#fff;text-align:center}
.popup .error,.popup .success .add-another-student {
	font-size: 15px;
	font-weight: 400;
	background: #5fb932;
	border: 2px solid #6bca3c;
	padding: 11px;
	margin: 10px auto -4px;
	display: block;
	border-radius: 20px;
	width: 200px;
	text-decoration: none;
}

.popup .error,.popup .success .add-another-student:hover {
	color: #FFF;
	background: #6bca3c;
}
.popup .error{background:#ff6600}
.popup .error .close{background:#b9314b}
.popup .error .close:hover{background:#ca3a55}
.popup .error abbr:before,.popup .success abbr:before{content:"\f164";font-family:"Font Awesome 5 Free";font-weight:700;font-size:20px;background:#55a62d;border-radius:50%;position:absolute;top:-25px;right:0;left:0;margin:0 auto;padding:10px;width:20px;box-shadow:0 0 3px rgba(0,0,0,.5)}
.popup .error abbr:before{content:"\f165";background:#ff6600}


.error{background: rgba(0,0,0,.6);border: none;display: none;position: fixed;top: 0;right: 0;bottom: 0;left: 0;padding: 0 20px;width: 100%;box-sizing: border-box;z-index: 2;transition: all .5s ease;}
.error div{background: #b22222;font-size: 18px;color: #fff;text-align: center;    margin: -40px auto 0;padding: 30px 30px 20px;max-width: 300px;width: 100%;position: relative;align-self: center;opacity: 0;animation: anim .5s ease forwards;}
.error div abbr:before{content: "\f00d";font-family: "Font Awesome 5 Free";font-weight: 700;font-size: 20px;background: #b22222;border-radius: 50%;position: absolute;top: -25px;right: 0;left: 0;margin: 0 auto;padding: 10px;width: 20px;box-shadow: 0 0 3px rgba(0,0,0,.5);}
.error div span{background: #d82e2e;border-radius: inherit;font-size: 16px;font-weight: 400;padding: 10px 20px;position: absolute;right: 0;left: 0;bottom: -39px;text-align: center;}
/* Modif 06.09.2018 ABR*/
.error div a.back{background: #d82e2e;border-radius: inherit;font-size: 16px;font-weight: 400;padding: 10px 20px;position: absolute;right: 0;left: 0;bottom: -39px;text-align: center;}
.error div a.back:hover{background: #b22222;border-radius: inherit;font-size: 16px;font-weight: 400;padding: 10px 20px;position: absolute;right: 0;left: 0;bottom: -39px;text-align: center;}
div.show{display:flex;}
.error a.back,.error a.cancel-add, .error a.force-add {display:none;}
.error a.cancel-add, a.force-add {width: 40%;background: #d82e2e;border-radius: inherit;font-size: 16px;font-weight: 400;padding: 10px 20px;position: absolute;bottom: -39px;text-align: center;}
.error a.cancel-add {left:0;}
.error a.force-add {right:0;}
.error a.cancel-add:hover, .error a.force-add:hover{background: #b22222;}
.error div a.back:active, .error a.cancel-add:active, .error a.force-add:active{position: absolute;top: unset;}
.error a.show{display:block;}
/* Modif 06.09.2018 ABR*/
.popup .add{background:#407e22;border-radius:3px;display:block;font-size:14px;font-weight:inherit;margin:20px auto 0;padding:10px;width:120px;position:static}
.popup .add:hover{background:#366a1d}
.popup .spinner{display:block;font-size:20px;text-align:center}
.popup h3{background:#666;display:block;font-size:20px;color:#fff;border-radius:inherit;margin:-30px -30px 20px;padding:20px 30px}
.popup.classe-erase h3{width: 100%;
	font-family: Roboto,sans-serif;
	text-transform: uppercase;
	font-weight: 600;}
.popup h3 span{font-family: "Font Awesome 5 Free";float:right;font-weight:700;font-size: 25px;cursor:pointer}
.popup h3 span:hover{color:#ff6600}
.popup h3 span:before{content:"\f00d"}
.popup label{display:inline-block;font-weight:400;margin:0 0 5px;font-size:14px}
.popup textarea{border:1px solid #ccc;font-size:12px;margin:0 0 15px;min-height:120px;width:100%;resize:none;box-sizing:border-box}
.popup textarea:hover{border-color:#aaa}
.popup textarea:focus{border-color:#3c8dbc}
.popup .send{float:right;border-radius:2px}
.popup .center .btn{display:inline-block;font-size:16px;font-weight:500;margin:0;padding:10px 20px}
.studentAllergene>div{max-width: 1080px;min-width: 220px;}
.allergeneDescription span{margin:5px 0;font-weight:bold;font-size:13px}
.allergeneDescription p{text-align: justify; margin: 0 0 15px 0}
.br-wrapper{float:left}
.br-wrapper a{text-decoration:none}
.br-wrapper a.br-active:after,.br-wrapper a.br-selected:after,.br-wrapper a:hover:after{font-weight:700}
.br-wrapper a:after{content:"\f005";font-family:"Font Awesome 5 Free";color:#edb867}
footer{font-size:12px;padding:30px 20px;text-align:center}
footer a{background:url(../img/lpj.svg) no-repeat;display:inline-block;height:32px;width:32px;margin:10px 0 0}

/***LOGIN*****/
#login{position:absolute;top:0;right:0;left:0;bottom:0;margin:auto;height:380px}
#login main{background:#fff;display:flex;margin:0 auto;padding:0;max-width:400px;position:relative}
#login main h1,#login main h2{text-align:center}
#login main h1 img { width: 170px; height: 122.58px;}
#login main h3{
	font-size:12px;
	color:#ff6600;
	margin:0 0 20px;
	text-transform: none
	}

#login main input[type=email],#login main input[type=password]{border:1px solid #ddd;padding:12px 10px;width:100%;-webkit-border-radius:0}
#login main .btn{float:right;color:#fff;margin:-35px 0 0;padding:10px 20px;border-radius:inherit}
#login main .btn:hover{background-color:#ff6600}

#login.reset .btn{
	background:url(../img/icons/refresh.svg) 95% 50% no-repeat #337ab7;
	float:inherit;
	display:block;
	margin:10px 0 0;width:100%;
	text-align:center;
	box-sizing:border-box
	}
#login.reset div label:before{
	content:"\f023";
	font-weight:700
	}

#login .back{position:absolute;top:5px;left:5px;font-size:10px;color:#fff;text-decoration:none;transition:all .5s ease}
#login .back:before{content:"\f100";font-family:"Font Awesome 5 Free";font-weight:700;font-size:12px;color:#222;margin:0 3px 0 0;position:relative;top:.6px}
#login .back:hover,#login .back:hover:before{color:#ff6600}
#login section{font-size:12px;margin:0;padding:30px;width:100%;box-shadow:0 2px 3px rgba(0,0,0,.1);box-sizing:border-box}
#login section h2{font-size:14px;font-weight:300;margin:10px 0 20px}
#login form{position:relative}
#login div:nth-child(1){margin:0 0 10px}
#login .email div,#login div:nth-child(1),#login div:nth-child(2){display:flex}
#login .email label,#login div:nth-child(1) label,#login div:nth-child(2) label{display:inline-block;border:1px solid #eee;font-size:0;margin:0 -1px 0 0;padding:12px 0;width:16%;text-align:center}
#login .email label:before,#login div:nth-child(1) label:before,#login div:nth-child(2) label:before{content:"\f007";font-family:"Font Awesome 5 Free";font-size:14px}
#login div:nth-child(2) label:before{content:"\f084";font-weight:700}
#login .email div:nth-child(1) label:before{content:"\f0e0"}

#login .error{position:absolute;font-style:italic;color:red}
#login section a{display:inline-block;color:#ff6600;margin:25px 0 5px}
#login article{background:#5a4430;color:#fff;padding:50px 30px;text-align:center;box-sizing:border-box}
#login article h2{margin:20px 0}
#login article a{display:inline-block;border:1px solid #392b1e;border-radius:3px;font-size:12px;font-weight:400;margin:20px 0 0;padding:10px 20px;text-transform:uppercase;transition:all .3s ease-out}
#login article a:hover{background:#fff;border-color:#fff;color:#5a4430;text-decoration:none}
#login article br{margin:0 0 5px}
@media screen and (max-width:767px){#login{position:inherit;height:inherit;margin:20px 20px 0;min-width:280px}
#login main{display:inherit}
#login main h3{text-align:center}
#login section{padding:30px 20px}
#login article h2{margin-top:inherit}
}
@media screen and (max-width:350px){#login main img{height:inherit;width:100%}
}

/***END LOGIN*****/

@media screen and (min-width:1180px){#presence.fixed tr:nth-child(1){position:fixed;top:0;display:table;max-width:1040px;width:100%;z-index:1}
#presence.fixed tr:nth-child(1) th:nth-child(1){width:25%}
#presence.fixed tr:nth-child(2) td{padding:60px 10px 10px}
}
@media screen and (max-width:1140px){#menu{margin-top:60px}
#presence td:first-child .name,#presence td:first-child a{max-width:120px}
}
@media screen and (max-width:1023px){#menu{float:inherit;margin:30px 0 0 50px}
#menu ul{display:block}
#menu>ul:nth-child(2){margin:10px 0}
}
@media screen and (max-width:780px){form.student > div.age label:last-child{margin:2px 4px 2px 0}
}
@media screen and (max-width:680px){form.student > div{width:100%;}
}
@media screen and (max-width:630px){section>.btn{display:inline-block;float:inherit;margin:10px 5px 0 0}
#content>div{padding:40px 20px}
#menu{margin-left:20px}
.button{position:inherit;margin:20px 0 0}
.button .btn{display:inline-block}
#presence tr:last-child td{text-align:left}
input[type=date]{height:29px}
}
@media screen and (max-width:495px){#tabs li a{font-size:12px;padding:10px;width:73.3px;text-align:center;word-break:keep-all}
.food article h3{display:block;text-align:center}
.food article div{font-size:16px}
.popup>div,.popup>form{padding:30px 20px 20px}
.popup h3{margin:-30px -20px 20px;padding:15px 20px}
.popup textarea{min-height:70px}
article.student > div,article.student > span,article.student > p{float:none;}
}
@media screen and (max-width:400px){.button .btn{display:block}
.food article p{padding-bottom:10px}
form.student label{width: 119px}
form.student > div > span.btn, form.student > div a.cancel{width: 114px}
}
@media screen and (max-width:335px){
form.student > div div.age, form.student div div.presence{justify-content:space-between}
form.student label{width:94px;margin: 0 0 4px;}
}
/*!
 * Datepicker v0.6.5
 * https://github.com/fengyuanchen/datepicker
 *
 * Copyright (c) 2014-2018 Chen Fengyuan
 * Released under the MIT license
 *
 * Date: 2018-03-31T06:16:43.444Z
 */.datepicker-container{background-color:#fff;direction:ltr;font-size:12px;left:0;line-height:30px;position:fixed;top:0;-ms-touch-action:none;touch-action:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:210px;z-index:-1;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none}
.datepicker-container:after,.datepicker-container:before{border:5px solid transparent;content:" ";display:block;height:0;position:absolute;width:0}
.datepicker-dropdown{border:1px solid #ccc;box-shadow:0 3px 6px #ccc;box-sizing:content-box;position:absolute;z-index:1}
.datepicker-inline{position:static}
.datepicker-top-left,.datepicker-top-right{border-top-color:#39f}
.datepicker-top-left:after,.datepicker-top-left:before,.datepicker-top-right:after,.datepicker-top-right:before{border-top:0;left:10px;top:-5px}
.datepicker-top-left:before,.datepicker-top-right:before{border-bottom-color:#39f}
.datepicker-top-left:after,.datepicker-top-right:after{border-bottom-color:#fff;top:-4px}
.datepicker-bottom-left,.datepicker-bottom-right{border-bottom-color:#39f}
.datepicker-bottom-left:after,.datepicker-bottom-left:before,.datepicker-bottom-right:after,.datepicker-bottom-right:before{border-bottom:0;bottom:-5px;left:10px}
.datepicker-bottom-left:before,.datepicker-bottom-right:before{border-top-color:#39f}
.datepicker-bottom-left:after,.datepicker-bottom-right:after{border-top-color:#fff;bottom:-4px}
.datepicker-bottom-right:after,.datepicker-bottom-right:before,.datepicker-top-right:after,.datepicker-top-right:before{left:auto;right:10px}
.datepicker-panel>ul{margin:0;padding:0;width:102%}
.datepicker-panel>ul:after,.datepicker-panel>ul:before{content:" ";display:table}
.datepicker-panel>ul:after{clear:both}
.datepicker-panel>ul>li{background-color:#fff;cursor:pointer;float:left;height:30px;list-style:none;margin:0;padding:0;text-align:center;width:30px}
.datepicker-panel>ul>li:hover{background-color:#e5f2ff}
.datepicker-panel>ul>li.muted,.datepicker-panel>ul>li.muted:hover{color:#999}
.datepicker-panel>ul>li.highlighted{background-color:#e5f2ff}
.datepicker-panel>ul>li.highlighted:hover{background-color:#cce5ff}
.datepicker-panel>ul>li.picked,.datepicker-panel>ul>li.picked:hover{color:#39f}
.datepicker-panel>ul>li.disabled,.datepicker-panel>ul>li.disabled:hover{background-color:#fff;color:#ccc;cursor:default}
.datepicker-panel>ul>li.disabled.highlighted,.datepicker-panel>ul>li.disabled:hover.highlighted{background-color:#e5f2ff}
.datepicker-panel>ul>li[data-view="month next"],.datepicker-panel>ul>li[data-view="month prev"],.datepicker-panel>ul>li[data-view="year next"],.datepicker-panel>ul>li[data-view="year prev"],.datepicker-panel>ul>li[data-view="years next"],.datepicker-panel>ul>li[data-view="years prev"],.datepicker-panel>ul>li[data-view=next]{font-size:18px}
.datepicker-panel>ul>li[data-view="month current"],.datepicker-panel>ul>li[data-view="year current"],.datepicker-panel>ul>li[data-view="years current"]{width:150px}
.datepicker-panel>ul[data-view=months]>li,.datepicker-panel>ul[data-view=years]>li{height:52.5px;line-height:52.5px;width:52.5px}
.datepicker-panel>ul[data-view=week]>li,.datepicker-panel>ul[data-view=week]>li:hover{background-color:#fff;cursor:default}
.datepicker-hide{display:none}



.class-content{
	display: flex;
	flex-wrap: wrap;
	margin-top: 30px;
	border: 1px solid #CCC;
	width: 100%;
}

.class-content .classes {
	width: 30%;
	padding: 10px;
	box-sizing: border-box;
	border-right: 1px solid #CCC;
	position: relative;
}

.class-content .classes .new-class-content {
	position: relative;
}

.class-content .classes .new-class-content input {
	width: 100%;
	outline: none;
	border: 2px solid #E6E6E6;
	border-radius: 0;
	font-weight: 400;
	color: inherit;
	padding: 12px 86px 12px 10px;
	line-height: normal;
	transition: border-color 0.2s ease, outline 0.2s ease;
}

.class-content .classes .new-class-content button {
	position: absolute;
	right: 0;
	height: 44px;
	color: #FFF;
	background: #3c8dbc;
	border: 2px solid #2578a9;
	padding: 5px 10px;
	outline: none;
	cursor: pointer;
}

.class-content .classes .new-class-content button:hover {
	background: #4c99c6;
}

.class-content .classes .new-class-content button i {
	font-size: 11px;
	margin-right: 5px;
	top: -1px;
	position: relative;
}

.class-content .classes .new-class-content .warning {
	font-size: 13px;
	font-weight: bold;
	text-align: center;
	background: red;
	padding: 5px;
	margin-top: 4px;
	color: #FFF;
	display: none;
}

.class-content .students {
	width: 70%;
	box-sizing: border-box;
	padding: 10px;
}

.class-content .students .info {
	font-size: 14px;
	font-weight: 500;
	text-align: center;
	line-height: 46px;
	color: #8a8a8a;
	background: #e6e6e6;
	border-radius: 4px;
	margin: 0;
}

.class-content .classes h3,
#ClassList tr td,
.students .classContent > h3 {
	width: 100%;
	font-family: Roboto,sans-serif;
	text-transform: uppercase;
	font-weight: 600;
	margin: 20px 0 10px;
}

.students .classContent > h3 {
	font-size: 20px;
}

#ClassList {
	min-width: unset;
	border: 2px solid #e6e6e6;
	margin-top: 10px;
}

#ClassList tr:hover,
#ClassList tr.actif {
	background: #ff6600;
	color: #FFF;
}

#ClassList tr td {
	padding: 12px 10px;
	font-weight: 500;
	margin: 0;
	text-transform: unset;
	border: 2px solid #e6e6e6;
	cursor: move;
}

#ClassList tr td i {
	margin-right: 10px;
}


.classContent {
	display: flex;
	flex-wrap: wrap;
}

.classContent.actif {
	display: block;
}

.classContent .table {
	width: 100%;
	border: 1px solid #cccccc;
	border-bottom: none;
}

.classContent .student {
	padding: 10px;
	border-bottom: 1px solid #e8ded4;
}

.classContent .student p {
	display: inline-block;
	position: relative;
	top: 4px;
	font-size: 14px;
	line-height: 20px;
	text-overflow: ellipsis;
	white-space: nowrap;
	overflow: hidden;
	text-transform: capitalize;
	text-decoration: none;
}

.classContent .student p .age {
	font-size: 10px;
}

.classContent .student button {
	float: right;
	background: #FFF;
	border: 1px solid #3c8dbc;
	color: #3c8dbc;
	font-size: 12px;
	font-weight: 400;
	display: inline-block;
	padding: 5px 10px;
	border-radius: 2px;
	cursor: pointer;
}

.classContent .student button i {
	margin-right: 5px;
}

.classContent .student button.remove {
	background: #ff6600;
	color: #FFF;
	border: 1px solid #ff6600;
	width: 90px;
}

.classContent .student.available button.remove {
	display: none;
}
.classContent .student.used button.add {
	display: none;
}

.student-filters .student-search {
	float: right;
}

.student-filters .filter {
	background: transparent;
	width: 110px;
	margin-right: 5px;
	font-weight: 600;
	color: #cccccc;
	border: 1px solid #cccccc;
	outline: none;
	cursor: pointer;
	text-align: center;
}

.student-filters .filter i {
	margin-right: 5px;
}

.student-filters .filter.actif,
.student-filters .filter:hover {
	background: #ff6600;
	border: 1px solid #ff6600;
	color: #FFF;
}

.del-class{
	color: #FFF;
	position: relative;
	background: #b9314b;
	border: 1px solid #b9314b;
	margin-top: 10px;
	cursor: pointer;
	outline: none;
}

.del-class:hover{
	background: #b50023;
	border: 1px solid #b50023;
}

.del-class i {
	margin-right: 5px;
}

.class-filter label {
	position: absolute;
	left: 10px;
	bottom: 49px;
	color: #000;
	font-weight: normal;
	text-transform: none;
}

.selectClass {
	width: 100%;
	background: #fff;
	outline: none;
	font-size: 13px;
	margin-top: 10px!important;
	color: #000;
	border-radius: 4px;
	cursor: pointer;
	position: relative;
	bottom: -10px;
	height: 34px;
}

.selectClass option  {
	color: #000;
}

.classtr {
	height: 89px;
}

.classtr th {
	background: #f1f1f1!important;
	border-top: 1px solid #e8ded4;
}

.all-presence {
	margin-bottom: 4px;
}

.all-presence,
.all-absent {
	font-size: 12px;
	width: 100%;
	border: none;
	cursor: pointer;
	outline: none;
	border-radius: 4px;
	line-height: 12px;
	color: #333;
	background: #FFF;
	text-align: left;
}


.all-presence:before,
.all-absent:before {
	font-family: "Font Awesome 5 Free";
	font-weight: 700;
	font-size: 10px;
	content: "\f303";
	color: #333;
	background: #aaa;
	display: inline-block;
	border-radius: 50%;
	padding: 5px 6px;
	margin-right: 5px;
	height: 12px;
	width: 10px;
	text-align: center;

}

.all-presence:before {
	background: #f39c12;
}
/*
.all-presence {
	color: #333;
	background: #f39c12;
}*/

.all-presence:hover,
.all-presence:hover:before {
	background: #f39c12;
	color: #fff;
}
/*
.all-absent {
	color: #333;
	background: #aaa;
}*/

.all-absent:hover,
.all-absent:hover:before {
	color: #FFF;
	background: #aaa;
}

.all-lock {
	text-align: center;
	color: #aaaaaa;
	font-size: 17px;
}

.all-lock i {
	background: #FFF;
	width: 18px;
	border-radius: 50%;
	height: 18px;
	padding: 9px;
}

.last-min-cancel {
	outline: none;
	background: #FFF;
	border: none;
	padding-right: 0;
	position: relative;
	top: 2px;
	color: lightgray;
	cursor: pointer;
}

.last-min-cancel:hover {
	color: red;
}

.last-min-cancel + .regime {
	max-width: 77px!important;
}

.canceled .last-min-cancel {
	color: red;
}

.canceled .regime {
	color: red;
	text-decoration: line-through;
}

.print-day {
	position: absolute;
	left: 100px;
	top: 10px;
	width: 29px;
	height: 29px;
	border: none;
	background: transparent;
	font-size: 14px;
	color: lightgrey;
	cursor: pointer;
	outline: none;
}

.print-day:hover {
	color: #ff6600;
}

tr.student td .classe {
	display: block;
	padding-left: 15px;
	font-weight: 500;
	color: #aaaaaa;
}

#recuAjax {
	width: 100%;
	text-align: left;
}

.lock-btn {
	pointer-events: none!important;
}
