.choix {
width:20%;
float:left;
}

.ct-horizontal {
  margin:6px 0 0 -20px;
}
.demandeevent {
  padding:3px 0 0 3px !important;
  background: url('../images/zebrures3.png');
  /*
      ICI LES ZEBRURES

  */
}
#cmdp {
  margin-bottom:15px;
}

.rd6 {
  position:relative;
  border-radius:6px;
}

.rdtitle {
  position:absolute;
  top:0;
  right:0;
  font-weight: bold;
  padding:3px 7px 3px 3px;
  border-radius:0 6px 0 0;
}

.rd6 .input-field {
  margin-top:25px;
}

.pad8 {
  padding:8px !important;
}

#titforsmall a.btn-small, #commentFichierHeures .pa.btn-small {
    transform: scale(0.6);
}

.epts_autres {
  display:block;
  width:70%;
  margin-left:40px;
}
table.epts {
  margin-left:70px;
}
table.epts td {
text-align:center}

tr.bb {
  border-bottom:1px solid #eee;
}
.collapsible-header {
  position:relative !important;
}
.aucunhoraire {
  display:block;
  position:absolute;
  right:0;
  margin-right:10px;
}

.modalHeuresAnim {
  width:100vw !important;
  margin-left:20% !important;
  bottom:15% !important;
}

.updateheuresanim {
  display:block;
  position:absolute;
  right:60px;
}

.excelDGferme {
  cursor: not-allowed;
}

.heuresAnimTotal {
  display:block;
  position:absolute;
  left:60%;
  padding:4px;
  border-radius:4px;
}
.heuresAnimGlobal {
  display:block;
  position:absolute;
  left:40%;
  padding:4px;
  border-radius:4px;
}
.texteBarre {
  text-decoration: line-through;
}

.modifligneconges {
  display:none;
}

.iw40px {
  width:40px !important;
}
.iw20px {
  width:20px !important;
}
.iw30px {
  width:30px !important;
}
.iw50px {
  width:50px !important;
}
.iw70px {
  width:70px !important;
}
.iw100px {
  width:100px !important;
}
.iw70pc {
    width:70% !important;
}



input[type="text"].declheures {
  width:35px;
  line-height:25px;
  height:25px;
  text-align:center;
  border:none !important;
  border-bottom:1px solid #ccc !important;
  border-radius:0 !important;
  background:none !important;
}

.legende {
  line-height:30px;
  height:30px;
  font-size:0.9em;
  display: inline-flex;
    vertical-align: middle;
}
.legende i:first-child {
  margin-left:0px;
}
.legende i {
  margin-left:20px;
}

.bigout {

  background: #00bcd4;
  background: -moz-linear-gradient(to bottom right,  #00bcd4 0%, #00bcd4 50%, #f44336 50%, #f44336 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(to bottom right,  #00bcd4 0%,#00bcd4 50%,#f44336 50%,#f44336 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom right,  #00bcd4 0%,#00bcd4 50%,#f44336 50%,#f44336 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00bcd4', endColorstr='#f44336',GradientType=0 ); /* IE6-9 */


}

#listFermeturesTab td, #listVacancesTab td {
  height:25px !important;
  vertical-align: middle !important;
  padding:0 !important;

}

span.motifHeures {
  display:block;
  font-size:0.8em;
  margin-top:-10px !important;
}

.smalltexte {
  font-size:0.9em !important;
}

.smalltexte a.btn-small {
  transform: scale(0.7);
}

.joursDeConge {
  margin-right:10px;
}

input[type="text"].red {
  background:#ef5350 !important;
  border-bottom:none !important;
}
input[type="text"].black {
  background:#000 !important;
  color:#fff !important;
  border-bottom:none !important;
}
#decompteheures {
  height:45px;
  line-height: 45px;
  border-radius:4px;
  border:1px solid #ccc;
  font-size:1.5em;
}

li.active div.active {
  background:#b71c1c !important;
  color:#fff !important;
}

input[type="text"].chpSoldeConge {
  width:30px !important;
}

.horaires-demande-rtt {
  display:none;
}
.valid-horaires-demande-rtt {
  display:block;
  margin-top:7px !important;
}

.toast {
  padding:20px 40px 20px 40px;
  box-shadow:0px 0px 15px rgba(2,2,2,0.5);
  border-radius:10px;
}

table .radius5 {
  border-radius:5px;
}

.upperFiche {

}

ul#dropdown1 {
  width:200px !important;
}
.contenu-modal {
  margin-top:30px;
}
.nav-wrapper a.brand-logo {
  padding:0 20px 0 20px;
}

#connectwindow .card-title {
  text-transform: uppercase;
}

@keyframes clignote {
  0% {
    color: #f44336;
  }
  50% {
    color: #f44336;
  }
  100% {
    color: #fff;
  }
}

@keyframes clignote2 {
  0% {
    transform: rotate(0deg);
    color: #f44336;
  }
  10% {
    transform: rotate(-8deg);
    color: #f44336;
  }
  20% {
    transform: rotate(8deg);
    color: #f44336;
  }
  30% {
    transform: rotate(-8deg);
    color: #f44336;
  }
  40% {
    transform: rotate(8deg);
    color: #f44336;
  }
  50% {
    transform: rotate(0deg);
    color: #f44336;
  }
  100% {
    transform: rotate(0deg);
    color: #fff;
  }
}

@keyframes tremblage {
  0% {
    transform: rotate(0deg)  translateY(-55%);

  }
  10% {
    transform: rotate(-5deg) translateY(-55%);

  }
  20% {
    transform: rotate(5deg) translateY(-55%);

  }
  30% {
    transform: rotate(-5deg) translateY(-55%);

  }
  40% {
    transform: rotate(5deg) translateY(-55%);

  }
  50% {
    transform: rotate(-5deg) translateY(-55%);

  }
  60% {
    transform: rotate(5deg) translateY(-55%);
  }
  70% {
    transform: rotate(-5deg) translateY(-55%);
  }
  80% {
    transform: rotate(5deg) translateY(-55%);
  }
  90% {
    transform: rotate(-5deg) translateY(-55%);
  }
  100% {
    transform: rotate(0deg) translateY(-55%);
  }

}

@keyframes rotaction {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes rotaction2 {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(-360deg);
  }
}

@keyframes zoomin {
  0% {
    transform: scale(0);
		transform-origin: top left;
  }
  100% {
    transform: scale(1);
		transform-origin: top left;

  }
}
@keyframes zoomout {
  0% {
    transform: scale(1);
		transform-origin: top left;

  }
	100% {
		transform: scale(0);
		transform-origin: top left;

	}
}
@keyframes slidein {
  from {
    margin-top: -90%;
		opacity:0.5;
  }

  to {
    margin-top: 0;
    opacity: 1;
  }
}

@keyframes slideFromRight {
  from {
    margin-left: 80%;
  }

  to {
    margin-left: 0;
  }
}

@keyframes editGreen {
  0% {
    background:#FFF;
  }
  50% {
		background:#8bc34a;
  }
	100% {
		background:#FFF;
  }
}

@keyframes editRed {
  0% {
    background:#FFF;
  }
  50% {
		background:#FF0000;
  }
	100% {
		background:#FFF;
  }
}

@keyframes slideToRight {
  from {
    margin-left: 0;
  }

  to {
    margin-left: 60%;
  }
}

@keyframes refusRight {
  0% {
    margin-left: 0;
  }

  30% {
    margin-left: 5%;
  }
	90% {
		margin-left:7%;
	}
	100% {
		margin-left:0;
	}
}

@keyframes slideToleft {
  from {
    margin-left: 0;
  }

  to {
    margin-left: -60%;
  }
}

@keyframes refusLeft {
  0% {
    margin-left: 0;
  }

  30% {
    margin-left: -5%;
  }
	90% {
		margin-left:-7%;
	}
	100% {
		margin-left:0;
	}
}

@keyframes bounceOut {
  20% {
    -webkit-transform: scale3d(.9, .9, .9)  translateY(-55%);
    transform: scale3d(.9, .9, .9)  translateY(-55%);
  }

  50%, 55% {
    opacity: 1;
    -webkit-transform: scale3d(1.1, 1.1, 1.1)  translateY(-55%);
    transform: scale3d(1.1, 1.1, 1.1)  translateY(-55%);
  }

  to {
    opacity: 0;
    -webkit-transform: scale3d(.3, .3, .3)  translateY(-55%);
    transform: scale3d(.3, .3, .3)  translateY(-55%);
  }
}


body {

}

h6 {
	font-size: 1.3em;
}

.material-tooltip li {
       list-style:none;
     }
.material-tooltip li:before {
            content:"à ";
          }

.news {
  padding-top:20px !important;
}

.titremaj {
  color:#e91e63;
  padding:7px 7px 7px 25px;
  margin-bottom:10px;
  margin-left:-15px;
}
li.info {
  line-height: 25px;
  border-bottom:1px solid #999;
  padding:4px;
  list-style: none;
  padding-left:10px;
}

li.info:last-child {
  border-bottom:0;
}

li.info::before {
  position:absolute;
  float:left;
  display:block;
  height:6px;
  width:6px;
  border-radius: 50%;
  content:" ";
  background:#e91e63;
  margin:9px 0 0 -15px;
}

#lecontrat td, table.etpsAnimTab td {

  padding:5px !important;
}

table.etpsAnimTab td div.switch {
  transform: scale(0.8);
}

#lecontrat input {

  margin-bottom:5px !important;

}

#activationCompte {


}

.divider {
	margin-top:30px;
	margin-bottom:30px;
}

.bgflou {
  background:url('../images/logolemon_moyen.svg') no-repeat bottom right #FFF;
}

.quitourne {
  animation: rotaction 1.2s linear infinite;
}

.tremblage {
  animation: tremblage 1.2s linear;
}

.bounceOut {
  animation: bounceOut 1s linear;

}

.quitourne2 {
  animation: rotaction2 1.2s linear infinite;
}

.clignoterouge {
  animation: clignote2 1.2s alternate infinite;
}

.slideToleft {
	animation: slideToleft 1.5s linear ;
}

.slideToRight {
	animation: slideToRight 1.5s linear ;
}

.refusLeft {
	animation: refusLeft 1s linear ;
}

.refusRight {
	animation: refusRight 1s linear ;
}

.zoomin {
	animation-duration: 0.5s;
  animation-name: zoomin;
}

.zoomout {
	animation-duration: 0.5s;
  animation-name: zoomout;
}

.slideFromRight {
	width:30%;
	animation-duration: 0.7s;
  animation-name: slideFromRight;
}

#citron {
	position:absolute;
	top:50%;
	left:50%;
	margin-top:-200px;
	margin-left:-200px;
	width:400px;
	height:400px;
	z-index:3;
}

#blackout {
	display:flex;
	z-index:9999;
	position:absolute;
	min-width:100%;
	width:100%;
	min-height:100%;
	height:0;
	background:url('../images/black.png');
}
.titremaj .new {
  margin-top:0px !important;
}
table.users tr {
	border-top:1px solid #999;
}

table.users thead tr td {
	font-weight: bold;
}

table.users thead tr {
	border-top:none;
}


table.users tr td.droits {
}

label {
	padding-left:5px;
}
tr.admin1 {
	background-color:#eee;
}

tr.anim0 {
	background-color:#fff;
}

.alert {
	padding:15px;
}
@keyframes slideinopen {
  from {
    margin-top: 100%;
		opacity:0.5;
  }

  to {
    margin-top: 0;
    opacity: 1;
  }
}

#ouverture {
	position:absolute;
	top:0;
	left:0;
	z-index:1;
	position:absolute;
	min-width:100%;
	width:100%;
	min-height:100%;
	height:100%;
}

.blackout {
	animation-duration: 2s;
  animation-name: slidein;
}

.opening {
	animation-duration: 2s;
  animation-name: slideinopen;
}

.profile-image-login {

  border:6px solid #FFF;
}



h1, h2, h3, h4, h5, h6 {
  font-family: "Roboto", sans-serif;
  font-weight:200;
}
h4 {
  font-size:2em;
}
h5 {
  font-size:1.7em;
  font-weight:300 !important;
}
h2 {
  font-size:2.5em;
}

.bitter {
  font-family: 'Bitter', sans-serif ! important;
}

/* CALENDRIER */
.picker__date-display {
  background-color:#e53935;
}
.picker__weekday-display {
  background-color:#e53935;
}
.picker__day--selected, .picker__day--selected:hover, .picker--focused .picker__day--selected {
  background-color:#e53935;
  color:#fff !important;
}
.picker__today, .picker__clear, .picker__close, .picker__day--today {
  color:#e53935 !important;
}

.fc-left h2 {
  text-transform: uppercase;
  font-size:1.5em;
}


.dispositifs {
  padding:5px;
  font-family: 'PT Sans Narrow', sans-serif;
  font-size:1em;
  font-weight:600;
	background:#eee;

}

.dispositifs i {
	vertical-align: top;
	margin-top:-5px !important;
}

.dispositifNom {
  font-size:1.3em;
  font-weight: bold;
  padding:0 0 5px 5px;
}
.dispositifNom>.nomJour {
	font-family :"PT Sans Narrow";
}
#thePlanning {
  position:absolute;
  z-index: 999;
  width: 94%;
  min-width: 94%;
  min-height: 98%;
  top:2%;
  left:3%;
  padding:30px;
  background: #FFF;
  border:1px solid #000;

}

.jour_disp {
	padding:10px;
}
.jour_disp ul {
	display:block;
	width:100%;
	clear:both;
}
.lj {
  border-radius:0;
  min-height:100%;
  height:100%;
	border-right:1px solid #999;
}
.lj:last-child {
	border:none;
}
.jourdate {
  /*border-right:30px solid #000;*/
}
.jourdate::before {
  content:' ';
}
label input:focus {
color:#000 !important;
}
label {
	color: #000 !important;
}

.input-field input:focus {
border-bottom: 0px solid #000 !important;
box-shadow: 0 1px 0 0 #000 !important;
}

input[type="checkbox"].filled-in:checked + label:after{
     border: 2px solid #e53935;
     background-color: #e53935;
}


#detail_anim input[type="checkbox"].filled-in:checked + label:after{
     border: 2px solid #e53935;
     background-color: #e53935;
}
#btnAjoutDateUnique {
	margin-top:-40px;
	margin-left:none !important;
}
#datesuniques input[type="checkbox"].filled-in:checked + label:after, #semaines input[type="checkbox"].filled-in:checked + label:after, #vacances input[type="checkbox"].filled-in:checked + label:after, #intervenants_affectes input[type="checkbox"].filled-in:checked + label:after{
     border: 2px solid #1e88e5;
     background-color: #1e88e5;
}


input[type=text]#login, input[type=password]#password {
	background:#FFF !important;
}
input[type=text]{
	padding-left:5px !important;
}
.modal input[type=text] {
	width:70%;
}

.modal .input-field {
	margin-top:40px;
}

texarea.message {
	min-height:200px !important;
	border:1px solid #999;
	rows:100%;
}

.input-field input[type=text], .input-field input[type=text]:focus + label:after {
    font-family: 'PT Sans Narrow', sans-serif;
    font-size:1.5em;
    color:#464646;
     border : 1px solid #999;
     box-shadow: 0 0px 0 0 #000;
     padding-left:10px;
   }
	 .input-field input[type=text]:focus + label {
		 color:#999;
	 }
   .input-field input[type=password] {
     padding-left:10px;
     border : 1px solid #999;
     box-shadow: 0 0px 0 0 #000;
   }
   .input-field input[type=text]+label, .input-field input[type=password]+label {
        padding-left : 10px;
        margin-top:-5px;

      }
			input[type=text]:focus, input[type=password]:focus {

			     border-bottom: none !important;

			   }

      .loginLogo {
        margin-top:-40px;
      }

      .loginCard {
        margin-top:50vh;
        transform: translateY(-55%);
        z-index:999;
        border-radius:7px;
      }

      .loginCard2 {
        margin-top:40vh;
        transform: translateY(-50%);
        z-index:999;
        border-radius:7px;

      }




      .login-form input[type="text"]:not(.browser-default), .login-form input[type="password"]:not(.browser-default) {
        width:70% !important;

      }
      .login-form input[type="text"]:not(.browser-default):focus, .login-form input[type="password"]:not(.browser-default):focus {
        border-bottom:none;
        box-shadow:0 1px 0 0 #000;
      }

      .champlog {
        margin-left:-15px !important;
      }

      .login-form .btn {
        width:70% !important;
        margin-left:15% !important;
      }

input.validAnim+label {
        font-family: 'PT Sans Narrow', sans-serif;
        font-size:1.2em;
        color:#464646;
      }
			input.validAnim+label::first-letter {
			        text-transform: uppercase;
			      }

input[type=text].onEdit {
	background:#ccc;
	border:none;
	padding:7px;
	color:#000 !important;
	}

  #ligneOptionsAnim .inline {
    width:300px !important;
    margin-top:15px;
  }
  #ligneOptionsAnim select option {
    font-size:1em;
  }

input.autocomplete {
	width:60% !important;
}


input.autocomplete > a {
	float:left;
}
[type="radio"].datePlanning:checked + label:before {
	background:#fbc02d;
}
[type="radio"].datePlanning:checked + label:after {
	background:#fbc02d;
	border:1px solid #fbc02d;
}

[type="radio"].radiomail:checked + label:before {
	background:#d81b60;
}
[type="radio"].radiomail:checked + label:after {
	background:#d81b60;
	border:1px solid #d81b60;
}

/* //// COLORATION SWITCH ////////
*/

.switch label input[type=checkbox]:checked+.lever:after {
    background-color: #1e88e5 !important;
}
.switch label input[type=checkbox]:checked+.lever {
    background-color: #bbdefb !important;
}


.switchparasol {
  line-height: 25px;
  vertical-align: middle;
}

.switchparasol i {
  margin-top:5px;
}

td.casetotal {
  border:1px solid #000;
}

#liste_disp tr {
  border-top:1px solid #000;
}

.listeAlerteContrats td {
  vertical-align: middle;
  padding:0;
  height:38px;
  line-height:38px;
}
.infobulledisp, .infobulledispm {
z-index:9999;
position:relative;
display:none;
}

.infobulledispc {
z-index:9999;
position:relative;
display:none;
}

/*
.infobulledisp::before, .infobulledispm::before, .infobulledispc::before {
  position:absolute;
  content:' ';
  left:0;
  top:50%;
  margin-top:-12px;
  margin-left:-24px;
  width:24px;
  height:24px;
  background:url('../images/chevron-left.svg') no-repeat top left;
  background-size:cover;
}
*/

.infobulledisp ul.collection, .infobulledispm ul.collection, .infobulledispc ul.collection {
  border:3px solid #000;
  position:relative;
}

.switch label input[type=checkbox].parasol:checked+.lever:after {
    background-color: #000 !important;
    transform: scale(0.9);
    border:none;
    margin-top:-1px;
    margin-left:2px;


}
.switch label input[type=checkbox].parasol:checked+.lever:before {
    background-color: none !important;
    transform: scale(0.9);
    border:none !important;
    margin-top:-1px;
    margin-left:2px;

}

.switch label input[type=checkbox].parasol+.lever:after {
    background-color: #ccc !important;
    transform: scale(0.9);
    margin-top:-2px;
    margin-left:-4px;

}
.switch label input[type=checkbox].parasol+.lever:before {
    background-color: none !important;
    transform: scale(0.9);
    border:none !important;
    margin-top:-2px;
    margin-left:-4px;

}

.switch label input[type=checkbox].parasol+.lever {
    background-color: #fff !important;
    border:1px solid #ccc;
    margin-top:-15px;
}

.switch label input[type=checkbox].parasol:checked+.lever {
    background-color: #fff !important;
    border:1px solid #000;
    margin-top:-15px;

}



.switch label input[type=checkbox].monplanning:checked+.lever:after {
    background-color: #fbc02d !important;
}
.switch label input[type=checkbox].monplanning:checked+.lever {
    background-color: #fff59d !important;
}

.switch label input[type=checkbox].activAdmin:checked+.lever:after {
    background-color: #00897b !important;
}
.switch label input[type=checkbox].activAdmin:checked+.lever {
    background-color: #b2dfdb !important;
}



.swichMonPlanning {
	padding-top:10px !important;
}



.editOk {
	animation-name: editGreen;
	animation-duration: 2s ;
}

.editWrong {
	animation-name: editRed;
	animation-duration: 2s ;
}

ul.dropdown-content li>span  {
  font-family: 'PT Sans Narrow', sans-serif;
  font-size:1.2em;
  color:#656565 !important;
}
ul.dropdown-content li.active>span  {
  font-family: 'PT Sans Narrow', sans-serif;
  font-size:1.2em;
  color:#000;
}

.dropdown-content.select-dropdown li.active span label::before {
  border-right:2px solid #FF0000 !important;
  border-bottom:2px solid #FF0000 !important;
  border-top:1px solid #FFF transparent !important;
  border-left:1px solid #FFF transparent !important;
}

.dropdown-content li span label::after {
  border-right:1px solid #999 !important;
  border-bottom:1px solid #999 !important;
  border-top:1px solid #999  !important;
  border-left:1px solid #999  !important;
}

.dropdown-content li.active {
  background: #f7f7f7 !important;
}

.input-field .dropdown-content [type="checkbox"]+label {
  top: -11px !important; /* previously 1px; */
 }

.modal {
  width:60% !important;
}

.input40 {
  width : 40px !important;
}

#conv_resultat {
  font-size:2.5em;
  background:#000;
  color:#FFF;
  text-align:center;
  padding:5px;
  border-radius:4px;
}

/* LE Planning */

li.listePlannings {
}
.miseAdispPlanning, .nomPlanning {
float:left;
}
.supprplanning {

}


.titre-dispositif-planning {
  font-size:1em;
  font-weight: bold;
	font-family: 'Roboto';
	color:#FFF;
	padding:5px;
}
.horaires-planning {
  text-align:right;
  font-size:0.8em;
  color:#999;
  padding:3px;
}

.spec {
  font-size:0.5em;
  color:#000;
  float:right;
  padding-right:5px;
  text-overflow: clip;
}


.dispositif-planning ul {
  margin-top:-10px;
  margin-left:0px;
}
.dispositif-planning ul li {
  font-family: 'PT Sans Narrow', sans-serif;
  font-size:1.1em;
  border-bottom:1px solid #999;
  padding:0 0 0 5px;

}

.dispositif-planning ul li:first-child {
  border-top:1px solid #999;

}
.dispositif-planning ul li.chevauchement {
  background:#eee;
}


.retoursave {
  padding:5px;
  font-family: 'PT Sans Narrow', sans-serif;
  font-size:1.5em;
}

.apsmatin::before {
	position:absolute;
	margin-top:-25px;
	margin-left:-20px;
	content:"-";
	background:#ffea00;
	color:#ffea00;
	height:20px;
	width:20px;
	min-height:20px;
	min-width:20px;
}

.apsmat::before {
	position:absolute;
	margin-top:-25px;
	margin-left:-20px;
	content:"-";
	background:#64b5f6;
	color:#64b5f6;
	height:20px;
	width:20px;
	min-height:20px;
	min-width:20px;
}

.apselem::before {
	position:absolute;
	margin-top:-25px;
	margin-left:-20px;
	content:"-";
	background:#880e4f;
	color:#880e4f;
	height:20px;
	width:20px;
	min-height:20px;
	min-width:20px;
}

.caelmat::before {
	position:absolute;
	margin-top:-25px;
	margin-left:-20px;
	content:"-";
	background:#26a69a;
	color:#26a69a;
	height:20px;
	width:20px;
	min-height:20px;
	min-width:20px;
}
.caelelem::before {
	position:absolute;
	margin-top:-25px;
	margin-left:-20px;
	content:"-";
	background:#0277bd;
	color:#0277bd;
	height:20px;
	width:20px;
	min-height:20px;
	min-width:20px;
}
.tapmat::before {
	position:absolute;
	margin-top:-25px;
	margin-left:-20px;
	content:"-";
	background:#ff9800;
	color:#ff9800;
	height:20px;
	width:20px;
	min-height:20px;
	min-width:20px;
}
.tapelem::before {
	position:absolute;
	margin-top:-25px;
	margin-left:-20px;
	content:"-";
	background:#a1887f;
	color:#a1887f;
	height:20px;
	width:20px;
	min-height:20px;
	min-width:20px;
}

.indeter::before {
	position:absolute;
	margin-top:-25px;
	margin-left:-20px;
	content:"-";
	background:#eee;
	color:#eee;
	height:20px;
	width:20px;
	min-height:20px;
	min-width:20px;
}

.encadrement a {
	padding:2px 6px 2px 6px;
	border-top-left-radius: 50%;


}
.encadrement {
	text-align:right;
}

.m1 {

}
.coul {

}
.cartouche {
	padding:7px; float:left; margin-left:5px; margin-top:5px;
}
.cartouche:hover {
	background: #000 !important;
}
.cartouche::first-letter, .collection-item div::first-letter, span.nomanim::first-letter {
	text-transform: uppercase;
}
a.editanim:hover i {
	color:#2196f3;
}
.suppranim, .supprdisp {
	float:right;
}

.fc-day-top {
	font-weight: bold;
}

.outil {
	display:flex;
	justify-content: center;
  align-items: center;
	border-radius: 50%;
  width: 3rem;
  height: 3rem;
	background:#ff6d00;
}

.outils {
}
.connection {
		background-size: contain;
}

#tab_conges tr, #tab_animateurs tr {
	margin-top:2px !important;
	transition: background-color 0.5s linear !important;
}

#tab_conges tr:hover, #tab_animateurs tr:hover {
	transition: background-color 0.5s linear !important;
	border-top:1px solid #999;
	border-bottom:1px solid #999;
}

#tab_animateurs tr.nonHover:hover, #tab_conges tr.nonHover:hover {
	background:none !important;
	border:none !important;

}
.general {
	margin-top:30px;
}

.nav-wrapper {
	box-shadow: none !important;
}

.contenuAdmin {
	margin-top:100px !important;
}



.textHome {

}

.homeContent {
	min-height: 90%;
	height:90%;
}
td.couleurAnim {
	padding:-5px;
	background-size: 90% 90%;
}


@keyframes bouncing-loader {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 0.1;
    transform: translateY(-1rem);
  }
}
.bouncing-loader {
  display: flex;
  justify-content: center;
}
.bouncing-loader > div {
  width: 1rem;
  height: 1rem;
  margin: 3rem 0.2rem;
  background: #8385aa;
  border-radius: 50%;
  animation: bouncing-loader 0.6s infinite alternate;
}
.bouncing-loader > div:nth-child(2) {
  animation-delay: 0.2s;
}
.bouncing-loader > div:nth-child(3) {
  animation-delay: 0.4s;
}

#nuancier {
	position:absolute;
	z-index:145;
	display:none;
	background:#FFF;
	border:1px solid #ccc;
}
.fermernuancier {
	margin-top:-15px;
	margin-left:15px;
}
.constant-width-to-height-ratio {
  background: #333;
  width: 20%;
}

.constant-width-to-height-ratio::before {
  content: '';
  padding-top: 100%;
  float: left;
}
.constant-width-to-height-ratio::after {
  content: '';
  display: block;
  clear: both;
}
.menuppal {
	padding:10px 0 10px 0 !important;

}
.scrollToTop a:hover {
	background:#ffeb3b !important;
	color:#000 !important;
}

#couleurValidee {
margin-top:75px;
}

td.fc-today {
	background: #eee !important;
}
td.fc-today span.fc-day-number {
	color:#fff !important;
	background:#000 !important;
	padding:3px 10px 3px 10px;
	border-radius:50%;
}

li.tap-target-origin {
	list-style: none !important;
}
a.help {
	color:#777 !important;

}
a.help:hover {
	color:#ff6f00 !important;
}

.dropdown-button:hover {
  background:none;
}
a.editLock {
		color:#777 !important;
}
a.editLock:hover {
		color:#f13737 !important;
}

a.settings {
		color:#777 !important;
}
a.settings:hover {
		color:#078cf2 !important;
}

a.forward {
	color:#777 !important;
}
a.forward:hover {
	color:#ff9000 !important;
}


.logoHelp {
	display:block;
	position:absolute;
	top:0;
	left:0;
	width:150px;
	min-width: 150px;
	height: 150px;
	min-height: 150px;
	background: url('../images/lemon_help.svg') no-repeat top left;
	position: fixed;
}

.bgTransparent {
	background: rgba(0,0,0,0);
}


/* LES GRAPHIQUES */
.ct-legend li {
	font-size:0.8em;

}
.ct-legend {
	background:#FFF;
	float:left;
	width:auto;

}

.ct-legend li::before {
    width: 12px;
    height: 12px;
    position: absolute;
    content: '';
    border: 3px solid transparent;
    border-radius: 50%;
		margin-left:-15px;
		display:block;
		margin-top:3px;
}

.ct-series-b .ct-bar {
	stroke:#3bb4c6 !important;
}

.ct-legend .ct-series-0:before {
           background-color: #d70206 !important;
           border-color: #d70206;
       }
       .ct-legend .ct-series-1:before {
           background-color: #3bb4c6;
           border-color: #3bb4c6;
       }
       .ct-legend .ct-series-2:before {
           background-color: #f4c63d;
           border-color: #f4c63d;
       }
       .ct-legend .ct-series-3:before {
           background-color: #d17905;
           border-color: #d17905;
       }
       .ct-legend .ct-series-4:before {
           background-color: #453d3f;
           border-color: #453d3f;
       }

.nomjour {
  margin-top : 10px;
  display:none;
	color:#000;
	font-size:1.2em;
	font-weight:normal;
	background:#4dd0e1;
	padding:7px;
  border-radius:4px;
}

.nombrejour {
  margin-top : 10px;
  display:none;
	color:#000;
	font-size:1.2em;
	font-weight:normal;
	background:#ffc107;
	padding:7px;
  border-radius:4px;
}

.card>button {
    background: none;
    border: none;
    position: absolute;
    top: 15px;
    right: 10px;
    font-size: 20px;
    color: #fff;
	}

	.numPageActive {
		border-radius: 50% !important;
	}
	td {
		vertical-align: top;
	}
	.td30 {
		width:30%;
	}

	.td50 {
		width:50%;
	}

	.td10 {
		width:10%;
	}

	.td20 {
		width:20%;
	}

	.td25 {
		width:25%;
	}

	.td40 {
		width:40%;
	}

  .td90 {
		width:90% !important;
	}

.tdactions {
	vertical-align :middle;
}
	ul.autocomplete-content {
		position:absolute;
		width:100%;
		z-index:777;
	}
img.right {
	display:none;
}
.mailerror {
	background: #f44336;
	border:1px solid #ccc;
	padding:3px;

}
.mailok {
	background: #fff;
	border:1px solid #ccc;
	padding:3px;


}
.va {
	vertical-align: middle;
}

.editable {
	padding:7px;
	text-decoration: underline;
}

.tiny-text {
	display:inline-block;
	font-size:0.6em;
	margin-top:-10px;
}

/* TESTS */
.heigher {
	min-height:100%;
}
.page {
	position:absolute;
	top:0;
	min-height:100%;
	height:100%;
	min-width:50%;
	width:50%
}

.gauche {
		left:0;
		box-shadow: 5px 0px 10px rgba(100,100,100,0.5);
		border-right:1px solid #999;
		z-index:200;

}

.champ {
	margin-top:30%;
}

input[type=text]#login {
	background-color:#ccc;

}
input[type=text]#login:focus {
	border-bottom:none !important;
	background:#ccc;

}

.gauche .opener {
	position:absolute;
	top:45%;
	left:100%;
	margin-left:-50px;
	width:100px;
	height:100px;
	cursor:pointer;
}
.droite {
	left:50%;
	box-shadow: -5px 0px 10px rgba(100,100,100,0.5);
	z-index:199;

}

.listeAnimateursChoisisPlanning {
	margin-top:10px !important;
}

.chiffre {
	padding:3px 7px 3px 7px;
	border-radius:20px;
}

img.imgaccueil {
	margin-top:-50px;
	width:50%;
	height:50%;
}

.shape-separator {
  position: relative;
  height: 48px;
  background: #333;
}
.shape-separator::after {
  content: '';
  background-image: url(data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjQgMjQiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgZmlsbC1ydWxlPSJldmVub2RkIiBjbGlwLXJ1bGU9ImV2ZW5vZGQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIHN0cm9rZS1taXRlcmxpbWl0PSIxLjQxNCI+PHBhdGggZD0iTTEyIDEybDEyIDEySDBsMTItMTJ6IiBmaWxsPSIjZmZmIi8+PC9zdmc+);
  position: absolute;
  width: 100%;
  height: 24px;
  bottom: 0;
}

#navHome {
	z-index:998;
}

#mobile-demo {
  z-index:998;
}

a.button-collapse {
  padding:0 10px 0 10px;
}
a.button-collapse:hover {
  color:#fdd835;
}

.i1, .i2 {
	z-index:777;
}

.i2 {
	height:30%;
}

#modal_ajout_dest li {
    cursor: pointer;
}

.barConges {
	display:inline-block;
	float:left;
	text-align:center;
}

.congespris {
  transition:all;
	border-radius:5px 0 0 5px;
}

.congesAprendre {
  transition:all;
	border-radius:0 5px 5px 0;
	background:#eee;
}
.ecart20 {
	padding-top:20px !important;
	padding-bottom:30px !important;
}

.radiusLeft {
	border-radius:5px 5px 5px 5px;
}

.nombre {
	padding:3px 7px 3px 7px;
	border-radius:20px;
}

.fingroup {
	border-right:1px solid #ccc;
}
.fingroup:last-of-type {
	border:none !important;
}
a.envoiMail {
	color:#000;
}
a.envoiMail:hover {
	color:#e91e63;
}

textarea.materialize-textarea, textarea {
	height: 6rem;
	border:1px solid #999;

}

.btn-small {
    transform: scale(0.8);
}

table.list td {
  border-top:1px solid #999;
}

tr.viewed {
  background:#eee;
}

table.tableconges thead {
	background:#fff;
  border-top:none;
}
table.tableconges thead td {
  border-top:none;
  font-weight: bold;
  border-right:none;
  border-left:none;
}


table.tableconges thead tr {
	height:30px !important;
}

table.tableconges tbody tr:last-child td {
	border-bottom:none;
}


table.tableconges tbody tr, table.tableconges tbody tr td {
  height:40px;
	margin:0;
	padding:7px 5px 1px 5px ;
  border-right:none;
  border-left:none;

}

table.tableconges td {
	border:1px solid #ccc;
}

#pageparametres .card {
  padding:0;
}
#pageparametres .card-content {
  padding:20px;
}
#pageparametres .card-title {
  padding:10px;
  top:0px;
  border-radius:5px 5px 0 0;
  width:100%;
}

#pageparametres .card-title h5 {
  text-transform: uppercase;
  font-size:1em;
  margin-left:25px;
}




#pagedispositifs .card {
  padding:0;
}
#pagedispositifs .card-content {
  padding:20px;
}
#pagedispositifs .card-title {
  padding:10px;
  top:0px;
  border-radius:5px 5px 0 0;
  width:100%;
}

#pagedispositifs .card-title h5 {
  text-transform: uppercase;
  font-size:1em;
  margin-left:25px;
}

#identite_anim, #identite_disp {
  margin-top:0.6%;
  margin-left:1%;
  width:98%;
  margin-bottom:1%;
}

#detail_anim {
  border:1px solid #000;
}

#detail_disp {
  border:1px solid #000;

}

.chipo {
  display:inline-block;
  padding : 6px 18px 6px 12px !important;
}

.chipo .secondary-content {
  display:inline-block;
  float:right !important;
}

#detail_anim .card {
  padding:0;
}
#detail_anim .card-content {

}

#coordonneesAnim label {
  font-family: 'Roboto';
  font-size:1.1em;
  font-weight: bold;
  width:40%;
  display:block;
  float:left:
}

#detail_anim span {
  font-family: 'Roboto';

  font-size:1.1em;
}
h5.titreconges {
  width : 50%;
}

#detail_anim .card-title {
  padding:10px;
  top:0px;
  width:100%;
}






#pagemails .card {
  padding:0;
}
#pagemails .card-content {
  padding:20px;
}
#pagemails .card-title {
  padding:10px;
  top:0px;
  border-radius:5px 5px 0 0;
  width:100%;
}

#pagemails .card-title h5 {
  text-transform: uppercase;
  font-size:1em;
  margin-left:25px;
}

.simili-card-title {
  font-family: "Roboto", sans-serif;
  font-size:1.8em;
  font-weight: 100;
}









.blackoutlogo {
  margin: auto;
}



input[type=text], input[type=password] {
  background:#fff !important;
  border:1px solid #eee !important;
  border-radius: 4px !important;
}

input[type=text]:focus::after {
}
input[type=text]:focus, input[type=password]:focus {
  background:#fff !important;
  box-shadow: 0px 0 5px rgba(2,2,2,0.1) !important;
}

textarea.message {
  border:1px solid #eee !important;
  border-radius: 4px !important;

}

.chart-container {
  height:500px;
}


.demandeevent .fc-content .fc-title {
  background:#000;
}


/* -------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------- */
/* -------------------------------TELEPHONES--------------------------------------- */
/* -------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------- */

@media only screen and (max-width: 800px) {

  #chart_connections {
  }

  .material-tooltip {
    display:none !important;
  }

  .toast {

    border-radius:0px;
  }

	@keyframes slideToRight {
	  from {
	    margin-top: 0;
	  }

	  to {
	    margin-top: 100%;
	  }
	}

	@keyframes refusRight {
	  0% {
	    margin-top: 0;
	  }

	  30% {
	    margin-top: 5%;
	  }
		90% {
			margin-top:7%;
		}
		100% {
			margin-top:0;
		}
	}

	@keyframes slideToleft {
	  from {
	    margin-top: 0;
	  }

	  to {
	    margin-top: -100%;
	  }
	}

	@keyframes refusLeft {
	  0% {
	    margin-top: 0;
	  }

	  30% {
	    margin-top: -5%;
	  }
		90% {
			margin-top:-7%;
		}
		100% {
			margin-top:0;
		}
	}

	.slideToleft {
		animation: slideToleft 1.5s linear ;
	}

	.slideToRight {
		animation: slideToRight 1.5s linear ;
	}

	.refusLeft {
		animation: refusLeft 1s linear ;
	}

	.refusRight {
		animation: refusRight 1s linear ;
	}

	.page {
		position:absolute;
		min-height:50%;
		height:50%;
		min-width:100%;
		width:100%
	}
	.gauche {
			top:0;
			left:0;

			box-shadow: 0px 5px 10px rgba(100,100,100,0.5);
			border-bottom:1px solid #999;
			z-index:200;

	}

	.champ {

	}

	.login {
		margin-top:30%;
	}

	.password {
		margin-top:25%;
	}

	.gauche .opener {
		display:block;
		z-index:888;
		position:absolute;
		top:80%;
		left:50%;
		width:100px;
		height:100px;
		cursor:pointer;
	}
	.droite {
		top:50%;
		left:0;

		box-shadow: 0px -5px 10px rgba(100,100,100,0.5);
		z-index:199;

	}


	#nuancier {
		position:absolute;
		z-index:145;
		display:none;
		background:#FFF;
		border:1px solid #ccc;
		width:80%;
		height:auto;
	}
	.fermernuancier {
		margin-top:-15px;
		margin-left:15px;
	}
	.constant-width-to-height-ratio {

	}

	.constant-width-to-height-ratio::before {

	}
	.constant-width-to-height-ratio::after {

	}
	.modal {
	  width:90% !important;
		height:90% !important;
		min-width:90% !important;
		min-height:90% !important;
	}
	.modal input[type=text] {
		width:95%;
	}

#calendrierconges  h2 {
    text-transform: uppercase !important;
		font-size:1em;
	}

 .fc-scroller {
	 overflow:visible !important;
	 height:600px !important;
 }

 table.users td {
	 display:block;
	 float:left;
	 overflow:hidden;
	 max-width: 25% !important;
	 width: 25% !important;
	 text-overflow:clip !important;
 }
 table.users thead td {


 }

}
