* {
	margin:0px;
	padding:0px;
}
body {
margin:0px;
padding:0px;
font-family: 'Lexend', sans-serif;

background-color:#F5F5F5;
}
html {
margin:0px;
padding:0px;
}
a {
text-decoration:none;
color:black;
}

header {
height:80px;
line-height:80px;
width:100%;
background-color:#233239;
border-bottom:solid 4px #38515C;
vertical-align:middle;
-webkit-box-shadow: 2px 5px 5px 0px rgba(199,204,208,1);
-moz-box-shadow: 2px 5px 5px 0px rgba(199,204,208,1);
box-shadow: 2px 5px 5px 0px rgba(199,204,208,1);
}
footer {
margin-top:50px;
}
.colorwhite {
    color:white;
}
.footeraccueil {
    height:50px;
    margin-top:100px;
    line-height:50px;
    vertical-align:middle;
    text-align:center;
    background-color:white;
}
.logosite {
margin-left:50px;
vertical-align:middle;
}
.lienmenu {
color:#A2AAAD;
}
.elementmenu {
height:45px;
line-height:45px;
vertical-align:middle;
color:#A2AAAD;
 font-family: 'Rubik', sans-serif;

 background-color:#34474E;
 margin-bottom:2px;
 }
 .elementmenu:hover {
 background-color:#00ACC4;
 color:white;
 }
 .elementmenusurligne {
 background-color:#233239;
 }
.elementmenu img{
padding-left:20px;
padding-right:20px;
vertical-align:middle;
}
.elementmenu i{
padding-left:20px;
padding-right:20px;
vertical-align:middle;
}
.titrepage {
color:#777777;
background-color:white;
 font-family: 'Lexend', sans-serif;
 padding:15px;
 width:90%;
 margin:auto;
 -webkit-box-shadow: 2px 2px 5px 0px rgba(199,204,208,1);
-moz-box-shadow: 2px 2px 5px 0px rgba(199,204,208,1);
box-shadow: 2px 2px 5px 0px rgba(199,204,208,1);
margin-top:15px;
border-radius:5px;

}
.blocsalarie {
background-color:white;
border:solid 1px #B7B7B7;
border-radius:2px;
 font-family: 'Lexend', sans-serif;
}
.blocsalariepadding {
padding:15px;
}
.blocsalarieprenomnom {
text-align:center;
font-weight:bold;
font-size:110%;
}
.blocsalariefonction {
text-align:center;
font-size:90%;
}
.blocsalariebouton {
margin-top:5px;
margin-bottom:5px;
background-color:#A1ABAC;
font-size:80%;
padding:5px;
color:#233239;
vertical-align:middle;
}
.blocsalariebouton:hover {
background-color:#00ACC4;
color:white;
}
.blocsalariebouton img {
vertical-align:middle;
}
.listesalaries {
padding:20px;
}
.lignechamps {
padding-top:20px;
padding-bottom:20px;
border-bottom:solid 1px #EAEAEA;
 font-family: 'Lexend', sans-serif;
}
.intitulechamps {
font-weight:bold;
text-transform: uppercase;
color:#233239;
margin-bottom:5px;
}
.boutonvalidation {
background-color:#00ACC4;
color:white;
padding:15px;
border:0;
font-size:120%;
}
.champsinputtext {
width:100%;
font-size:120%;
padding:10px;
border:0;
border:solid 2px #E9E9E9;
}
.champslignevalidation {
margin-top:40px;
}
 /* Customize the label (the container) */
.champsradio {
    display: block;
    position: relative;
    padding-left: 35px;
    margin-bottom: 12px;
    cursor: pointer;

    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default radio button */
.champsradio input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

/* Create a custom radio button */
.checkmark {
  position: absolute;
  top: 0;
  left: 0;
  height: 25px;
  width: 25px;
  background-color: #eee;
  border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.champsradio:hover input ~ .checkmark {
  background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.champsradio input:checked ~ .checkmark {
  background-color: #2196F3;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

/* Show the indicator (dot/circle) when checked */
.champsradio input:checked ~ .checkmark:after {
  display: block;
}

/* Style the indicator (dot/circle) */
.champsradio .checkmark:after {
  top: 9px;
  left: 9px;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: white;
} 
.formulaire {
width:90%;
margin:auto;
}
.blocconnexion {
font-size:90%;
background-color:white;
border:solid 1px #B7B7B7;
border-radius:5px;
margin:auto;
margin-top:100px;
width:90%;
max-width:400px;
}
.blocconnexionpadding {
padding:40px;
}
.champconnexion {
width:100%;
padding:10px;
border:solid 1px #EAEAEA;

}
.bouton {
background-color:#00ACC4;
color:white;
padding:15px;
border:0;
font-size:120%;
margin:auto;
margin-top:25px;
}
.boutontexte {

font-size:110%;
}
.ajouterposte {
background-color:white;
border:solid 1px #EAEAEA;
border-radius:5px;
padding:15px;
}
.champsinputtextpas100 {

padding:7px;
border:0;
border:solid 1px #34474E;
}
.tableau {
margin-bottom:25px;
background-color:white;
}
.lignetitre td{
color:white;
background-color:#233239;
}
.tableau td{
padding:15px;
}
.tableau td img {
padding-right:15px;
}
.identitesalarie {
width:100%;
background-color:white;
border:solid 1px #B7B7B7;

}
.identitesalarieicone {
width:120px;
display:inline-block;
text-align:center;
vertical-align:middle;

}
.identitesalarieicone img {
padding-top:15px;
padding-bottom:15px;
}
.identitesalarieintitule {

display:inline-block;

vertical-align:middle;
}
.textalignleft {
text-align:left;
}
.tableaudonnees {

background-color:white;
border:solid 1px #B7B7B7;

margin-top:25px;
}
.tableaudonneespadding {
padding:15px;
}
.listemissions {

background-color:white;
border:solid 1px #B7B7B7;

margin-top:25px;
}
.listemissionspadding {
padding:15px;
}
.tableaufiche {
width:100%;
}
.tableaufiche td{
padding:12px;
font-size:90%;
border-top:solid 1px #233239;
border-right:solid 1px #233239;
border-bottom:solid 1px #233239;
vertical-align:middle;
}
.tableaufiche td img{
vertical-align:middle;
}
.tableauficheintitule {
background-color:#233239;
color:white;
}
.margintop20 {
margin-top:20px;
}

.marginbottom20 {
margin-bottom:20px;
}

.datemission {
margin-top:15px;
background-color:white;
border:solid 1px #B7B7B7;
}
.datemissionpadding {
padding:10px;
}
.labelheure {
font-size:80%;
}
.labelheure > input{ /* HIDE RADIO */
    visibility: hidden; /* Makes input not-clickable */
    position: absolute; /* Remove input from document flow */
	display:inline-block;
}
.labelheure > input + div{ /* DIV STYLES */
    cursor:pointer;
    border:solid 5px #F5F5F5;
	background-color:#F5F5F5;
}

.labelheure > input:checked + div{ /* (RADIO CHECKED) DIV STYLES */

border:solid 5px #233239;
background-color:#233239;
opacity:1;
color:white;
}
.lignehoraire {
width:100%;
}
.centrer {
text-align:center;
}
.listemissionstable {
   border-collapse: collapse;
   border-radius:8px;
}
.listemissionstable td {
padding:12px;
border:solid 1px #E9E9E9;
}
.gris {
background-color:#F5F5F5;
}
.lignetitre {
background-color:#34474E;
color:white;
}
.date {
color:#8C8C8C;
}
.nommission {
color:#363636;
font-weight:bold;
}
.fondsombre {
color:white;
background-color:#38515C;
}
.fondblanc {
color:#38515C;
background-color:white;
}
.boutonicone {
font-size:220%;
}
.boutonajouter {
display:flex;
margin-top:20px;
}
.boutonajoutericone {
width:20%;
display:inline-block;
vertical-align:middle;
background-color:#233239;
padding:10px;
text-align:center;

-webkit-border-top-left-radius: 8px;
-webkit-border-bottom-left-radius: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-bottomleft: 8px;
border-top-left-radius: 8px;
border-bottom-left-radius: 8px;
}
.boutonajoutertexte {

display:inline-block;
vertical-align:middle;
background-color:#34474E;
color:white;
padding:10px;
 text-transform: uppercase;
 text-align:center;
 flex:1;
 font-size:90%;
 
 
 -webkit-border-top-right-radius: 8px;
-webkit-border-bottom-right-radius: 8px;
-moz-border-radius-topright: 8px;
-moz-border-radius-bottomright: 8px;
border-top-right-radius: 8px;
border-bottom-right-radius: 8px;
}
.redactioncontrat {

margin:2%;
background-color:white;
}
.formulairetextarea {
border:solid 1px #B7B7B7;
color: #34474E;
}
.formulairetextarea {
width:100%;
height:900px;
padding:10px;
}
.tableauvariable {
background-color:#233239;
color:white;
padding:10px;
}
.contenudroite {
font-size:90%;
}
.picto-item {
  position: relative;  /*les .picto-item deviennent référents*/

  border-radius: 50%;
}
.picto-item:hover:after,
.picto-item:focus:after {
  content: attr(aria-label);  /* on affiche aria-label */
  position: absolute;
  top: -2.4em;
  left: 50%;
  font-size:80%;
	transform: translateX(-50%); /* on centre horizontalement  */
  z-index: 1; /* pour s'afficher au dessus des éléments en position relative */
  white-space: nowrap;  /* on interdit le retour à la ligne*/
  padding: 5px 14px;
  background: #233239;
  color: #fff;
  border-radius: 4px;
}

/* on génère un second élément en :before pour la flèche */

[aria-label]:hover:before,
[aria-label]:focus:before {
  content: "▼";
  position: absolute;
  top: -1em;
	left: 50%;
	transform: translateX(-50%); /* on centre horizontalement  */
  font-size: 20px;
  color: #233239;
}

/* pas de contour durant le :focus */
[aria-label]:focus {
  outline: none;
}
.clearboth {
clear:both;
}
.relief {
 -webkit-box-shadow: 2px 2px 5px 0px rgba(199,204,208,1);
-moz-box-shadow: 2px 2px 5px 0px rgba(199,204,208,1);
box-shadow: 2px 2px 5px 0px rgba(199,204,208,1);
}
.carrousselbloc {
width:11%;
margin-right:0.1%;
display:inline-block;
vertical-align:top;
cursor:pointer;
height:110px;
 font-family: 'Rubik', sans-serif;
text-align:center;
color:#233239;
}
.barrecarroussel a {
color:#233239;
}
.carrousselbloc:hover:not(.dateselectionnee) {
background-color:#D5D8DB;
}
.dateselectionnee {
background-color:white;
font-weight:bold;
color:#00ACC4;

 -webkit-box-shadow: 0px -5px 5px 0px rgba(199,204,208,1);
-moz-box-shadow: 0px -5px 5px 0px rgba(199,204,208,1);
box-shadow: 0px -5px 5px 0px rgba(199,204,208,1);
}
.blocplanning {
 -webkit-box-shadow: -2px -2px 5px 0px rgba(199,204,208,1);
-moz-box-shadow: -2px -2px 5px 0px rgba(199,204,208,1);
box-shadow: -2px -2px 5px 0px rgba(199,204,208,1);
 width:95%;
 margin:auto;

 padding:10px;
background-color:white;
}
.barrecarroussel {
margin-top:20px;
}
.tableauplanning {
margin-top:50px;
margin-bottom:100px;
width:100%;
 border-collapse:collapse;
 display:none;
}
.displayblock {
display:table;
}
.tableauplanning td {
border:solid 1px #E5E5E5;
padding-top:10px;
padding-bottom:10px;
}
.tableauplanning th {
text-align:left;
font-weight:normal;
}
.labelheureplanning > input{ /* HIDE RADIO */
    visibility: hidden; /* Makes input not-clickable */
    position: absolute; /* Remove input from document flow */
	display:inline-block;
}
.labelheureplanning > input + div{ /* DIV STYLES */
    cursor:pointer;
width:25%;
display:inline-block;
vertical-align:middle;
background-color:#F5F5F5;
margin-top:5px;
margin-bottom:5px;
}
.labelheureplanning > input + div:hover{
height:30px;
margin-top:0px;
margin-bottom:0px;
	background-color:#D7D7D7;
	}
.labelheureplanning > input:checked + div{ /* (RADIO CHECKED) DIV STYLES */

background-color:#00ACC4;
opacity:1;
color:white;
}

.labelheureeffectif > input{ /* HIDE RADIO */
    visibility: hidden; /* Makes input not-clickable */
    position: absolute; /* Remove input from document flow */
	display:inline-block;
}
.labelheureeffectif > input + div{ /* DIV STYLES */
    cursor:pointer;
width:25%;
display:inline-block;
vertical-align:middle;
background-color:#F5F5F5;
margin-top:5px;
margin-bottom:5px;
}
.labelheureeffectif > input + div:hover{
height:30px;
margin-top:0px;
margin-bottom:0px;
	background-color:#D7D7D7;
	}
.labelheureeffectif > input:checked + div{ /* (RADIO CHECKED) DIV STYLES */

background-color:#38515C;
opacity:1;
color:white;
}

.labelheureselect > input + div{ /* DIV STYLES */

background-color:#AA1A00;
}
.labelheureunselect > input:checked + div{ /* (RADIO CHECKED) DIV STYLES */

background-color:#73AA00;
opacity:1;
color:white;
}
.heureheure {
height:20px;
}
.heurequartheure {
height:20px;
}
.datemois {
font-size:90%;
    cursor: pointer;
}
.datejour {
padding-top:10px;
    cursor: pointer;
}
.datenumero {
font-size:300%;
    cursor: pointer;
}
.paddingmissionvide {
width:100%;
text-align:center;
}
.paddingmissionvide td {
width:100%;
text-align:center;
}
.paddingmissionvide div {

margin-top:100px;
margin-bottom:100px;
}
.carrousselbloc i {
font-size:200%;
padding-top:30px;
  }
.blocvalide {
background-color:#EEF4E8;
width:50%;
margin:auto;
margin-top:25px;
border: solid 2px #C4D9AE;
border-radius:5px;
}
.blocinfo {
background-color:#E8EFF4;
width:50%;
margin:auto;
margin-top:25px;
border: solid 2px #ACC7DB;
border-radius:5px;
}
.blocvalidepadding {
padding:20px;
}
.couleurverte {
color:#759F4A;
}
.couleurrouge {
color:#A64444;
}
.couleurorange {
color:#B98931;
}
.taille120 {
font-size:140%;
}
.positionbasdroite {
position:fixed;
bottom:40px;
right:40px;
}
.boutonhorairesprevus {
padding:10px;
margin-bottom:25px;
border:solid 1px #D3D7D8;
border-radius:4px;
margin-right:10px;
vertical-align:top;
}
.boutonhorairesprevus  a{
color:#D3D7D8;
}
.boutonhorairesprevus:hover {
color:#00ACC4;
border:solid 1px #00ACC4;
}
.boutonhorairesprevus:hover a {
color:#00ACC4;
}
.boutonhorairesprevusselection {
border:solid 1px #34474E;
}
.boutonhorairesprevusselection a{
color:#34474E;
}
.carrecouleurlegende {
width:40px;
height:20px;
}
.carrecouleurlegendetxt {
padding-left:10px;
padding-right:10px;
}
.carrecouleurlegendetxt {
color:#788185;
}
.tiersaccueil {
background-color:white;
border:solid 1px #D5D8DB;
margin-top:20px;
}
.padding15 {
padding:15px;
}
.listeindex {
width:100%;
height:250px;
overflow-y: scroll;
}
.padding20 {
padding:20px;
}
.blochoraires {
background-color:white;
border:solid 1px #D5D8DB;
margin-top:20px;
}
.bloccontrat {
background-color:white;
border:solid 1px #D5D8DB;
margin-top:20px;
}

.jesuisdispo {
background-color:#EEF9EE;
}
.jenesaispas {
background-color:#FCF7EB;
}

.jesuisdispo input[type="radio"]:checked {
font-weight: bold; 

}
.jenesuispasdispo {
background-color:#F9EEEE;
}

.pulse-button {
  box-shadow: 0 0 0 0 rgba(224, 99, 54, 0.7);
  -webkit-animation: pulse 2s infinite cubic-bezier(0.66, 0, 0, 1);
  -moz-animation: pulse 2s infinite cubic-bezier(0.66, 0, 0, 1);
  -ms-animation: pulse 2s infinite cubic-bezier(0.66, 0, 0, 1);
  animation: pulse 2s infinite cubic-bezier(0.66, 0, 0, 1);
}

@-moz-keyframes pulse{
10%{}
30%{box-shadow: 0 0 0 60px rgba(224, 99, 54, 0);}
30.2%{box-shadow: 0 0 0 0 rgba(224, 99, 54, 0);}
}
@-ms-keyframes pulse{
10%{}
30%{box-shadow: 0 0 0 60px rgba(224, 99, 54, 0);}
30.2%{box-shadow: 0 0 0 0 rgba(224, 99, 54, 0);}
}
@keyframes pulse {
10%{}
30%{box-shadow: 0 0 0 60px rgba(224, 99, 54, 0);}
30.2%{box-shadow: 0 0 0 0 rgba(224, 99, 54, 0);}
}
.blocchargementcontrat {
margin-top:40px;
background-color:white;

margin-top:20px;
 -webkit-box-shadow: 2px 2px 9px 0px rgba(222,222,222,1);
-moz-box-shadow: 2px 2px 9px 0px rgba(222,222,222,1);
box-shadow: 2px 2px 9px 0px rgba(222,222,222,1);
-webkit-border-radius: 15px;
-webkit-border-top-left-radius: 0;
-moz-border-radius: 15px;
-moz-border-radius-topleft: 0;
border-radius: 15px;
border-top-left-radius: 0;
}

.box {
  width: 80%;
  margin: 0 auto;
  background: rgba(255,255,255,0.2);
  padding: 35px;
  border: 2px solid #fff;
  border-radius: 20px/50px;
  background-clip: padding-box;
  text-align: center;
}
.button {
  font-size: 1em;
  padding: 10px;
  color: #00ACC4;
  border: 2px solid #00ACC4;
  border-radius: 20px/50px;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s ease-out;
}
.button:hover {
  background: #00ACC4;
  color:white;
}
.vertvalide {
color:#2DCB70;
}

.liste table {
  position: relative;
}
.liste th {
padding-top:16px;
padding-bottom:16px;
padding-left:6px;
padding-right:6px;
background-color:#F4F4FB;
  position: sticky;
  top: 0;
  z-index:10;

-webkit-box-shadow: inset 0px -7px 14px -7px #DDDDE8; 
box-shadow: inset 0px -7px 14px -7px #DDDDE8;
color:#69708B;
text-align:left;
}

.lignetitre {
  background-color:#F4F4FB;
border-radius:8px;
-webkit-box-shadow: inset 0px -7px 14px -7px #DDDDE8; 
box-shadow: inset 0px -7px 14px -7px #DDDDE8;
}
.lignemois {
  background-color:#F4F4FB;
border-radius:8px;
-webkit-box-shadow: inset 0px -7px 14px -7px #DDDDE8; 
box-shadow: inset 0px -7px 14px -7px #DDDDE8;
}
.lignemois td {
padding-top:16px;
padding-bottom:16px;
padding-left:6px;
padding-right:6px;
background-color:#F4F4FB;
  position: sticky;
  top: 0;
  z-index:10;
font-weight:bold;
-webkit-box-shadow: inset 0px -7px 14px -7px #DDDDE8; 
box-shadow: inset 0px -7px 14px -7px #DDDDE8;
color:#69708B;
text-align:left;
}
.cadreblanctableau {
background-color:white;
padding:15px;
 -webkit-box-shadow: 2px 2px 9px 0px rgba(222,222,222,1);
-moz-box-shadow: 2px 2px 9px 0px rgba(222,222,222,1);
box-shadow: 2px 2px 9px 0px rgba(222,222,222,1);
-webkit-border-radius: 15px;
-webkit-border-top-left-radius: 0;
-moz-border-radius: 15px;
-moz-border-radius-topleft: 0;
border-radius: 15px;
border-top-left-radius: 0;
color:#45454E;
clear:both;
font-size:95%;
}
.cadreblanctableau a {
color:#45454E;
}

.champsinputtextgris {
width:100%;
font-size:120%;
padding:10px;
border-radius:4px;
background-color:#F7F8F9;
border:solid 1px #D7D7D7;
font-family: 'Rubik', sans-serif;
}

.tableauphotoidentite {
height:32px;
width:32px;
border-radius:50%;
border:solid 1px #B9B7CD;
vertical-align:middle;
}

.blocinforouge {
border: solid 1px #BD302D;
color:#2D1313;
background-color:#E9D3D3;
border-radius:5px;
}
.boutoncolore {
color:white;
background-color:#00ACC4;
}
.profiltableauhoraire {
border-collapse: collapse;
width:100%;
}
.profiltableauhoraire td{
padding:0;
margin:0;
border:0;
}
.heuretravaillee {
background-color:#00ACC4;
-webkit-box-shadow: inset 0px -4px 0px -2px #007484; 
box-shadow: inset 0px -4px 0px -2px #007484;
}
.profiltableauhoraireligne {
height:30px;
}
.bordsgauche {
-webkit-border-top-left-radius: 6px;
-webkit-border-bottom-left-radius: 6px;
-moz-border-radius-topleft: 6px;
-moz-border-radius-bottomleft: 6px;
border-top-left-radius: 6px;
border-bottom-left-radius: 6px;
}
.bordsdroit {
-webkit-border-top-right-radius: 6px;
-webkit-border-bottom-right-radius: 6px;
-moz-border-radius-topright: 6px;
-moz-border-radius-bottomright: 6px;
border-top-right-radius: 6px;
border-bottom-right-radius: 6px;
}
.caseheure {
height:10px;
}
.interlignehoraires {
height:10px;
}
.ligneborduregauche {
-webkit-box-shadow: inset 1px 0px 0px 0px #EEEEF7; 
box-shadow: inset 1px 0px 0px 0px #EEEEF7;
}
.blochoraireslien {
color:#69708B;
background-color:#ECECF5;
width:100%;
}
.blochorairesinfos {
border-bottom:solid 1px #ECECF5;
width:100%;
}
.lignemois {
color:#69708B;
background-color:#E9E9F1;
}
.affichagemois_fleche {
float:right;
margin-right:15px;
}
.pointerclick {
cursor:pointer;
}
.masquer {
display:none;
}
.affichagemois_nbrjours {
background-color:#69708B;
color:white;
border-radius:3px;
padding:4px;
}
.togglemois + i {
transform: rotate(90deg);
transition: transform 0.8s ease-in-out;
}
.togglemois:checked + i {
transform: rotate(0deg);

}
.accueilprofilvalide {
color:#00ACC4;
font-size:500%;
margin-top:50px;
margin-bottom:25px;
text-align:center;
}
.missionhoraires_heure {
    width:25%;
    text-align:center;
}
.missionhoraires_selection {
    width:75%;
}
.missionhoraires_consignes {
    padding:15px;
    padding-top:10px;
    padding-bottom:30px;
}
.index_barreaujourdhui {
    background-color:white;
    border-left:solid 4px #D5D8DB;
}
.index_barreaujourdhui_date {
    font-weight:bold;
    margin-right:20px;
    color:#69708B;
}
.index_barreaujourdhui_nbrmissions {
    
    font-size:90%;
}