p.explications{
margin-bottom:50px;
line-height:12px;
}
#label-for-tSOLCAL{
align-self: center;
width: 265px;
}
#label-for-natEch{
  align-self: center;
  width: 180px;
}
#label-for-sensEch{
align-self: center;
width: 180px;
}
#label-for-toxEch{
align-self: center;
width: 180px;
}


input:invalid {
  color: #f00;
}
.decaleInput{
    margin-top: 15px;
}

select#nomGroupe{
  width: 100px;
}

div#demandeFormation{
  text-align:center;
  background-color: #bababa;
  margin-bottom: 30px;
}
.ismall{
  max-width:75px;
}
.imedium{
max-width:200px;
}

#label-for-Tbeg{
  align-self: center;
  width: 150px;
}

#label-for-rampeT{
align-self: center;
width: 150px;
}
#label-for-Tend{
align-self: center;
width: 150px;
}
#label-for-caloAnaMSSpec{
align-self: center;
width: 100px;
}

#label-for-TbegDSC{
align-self: center;
width: 150px;
}
#label-for-rampeTDSC{
align-self: center;
width: 150px;
}
#label-for-TendDSC{
align-self: center;
width: 150px;
}

#label-for-mITC{
align-self: center;
width: 285px;
}
#label-for-CITC{
align-self: center;
width: 285px;
}

#label-for-nITC{
align-self: center;
width: 285px;
}

#label-for-mSOLCAL{
align-self: center;
width: 265px;
}
#label-for-CSOLCAL{
align-self: center;
width: 265px;
}

#label-for-tSOLCAL{
align-self: center;
width: 265px;
}

#label-for-mC80{
align-self: center;
width: 265px;
}
#label-for-vC80{
align-self: center;
width: 265px;
}

#label-for-tC80{
align-self: center;
width: 265px;
}

#label-for-tempC80{
align-self: center;
width: 100px;
}
#label-for-dureeC80{
align-self: center;
width: 70px;
}

#label-for-TmossEx{
align-self: center;
}


#label-for-nbAnalyseSIC{
align-self: center;
width: 220px;
}
#label-for-freqSIC{
align-self: center;
width: 220px;
}
#label-for-gTempSIC{
align-self: center;
width: 220px;
}
#label-for-gHumSIC{
align-self: center;
width: 220px;
}
#label-for-gTempHumSIC{
align-self: center;
width: 220px;
}


#label-for-pasTempSIC{
align-self: center;
width: 80px;
}
#label-for-pasTempHumSIC{
align-self: center;
width: 80px;
}

#label-for-pasHumSIC{
align-self: center;
width: 80px;
}

#label-for-N2SIC{
align-self: center;
width: 220px;
}

#label-for-nbDepMet{
align-self: center;
width: 210px;
}
#label-for-facesMet{
align-self: center;
width: 210px;
}
#label-for-ciblesMet{
align-self: center;
width: 210px;
}
#label-for-epMet{
align-self: center;
width: 210px;
}
.vcenter{
align-self: center;
margin-bottom:0.5rem;
}
#caloAnaMSSpec{
width: 100%;
}




.espV{
height: 20px;
}




#mode-emploi{
color: black;
}
.selectLi{
  font-weight:bold;
  background-color: #bababa;
}
.clotLi{
  font-style: italic;
  color: #cccccc;
}

/*Style datatable*/



tr.odd  { background-color: #E2E4FF; }
tr.even { background-color: white; }
.greyClass{
    background-color: #bababa;
    color: black;
 }
.greenClass{
background-color: #00ba00;
color: yellow;
}
i.blanc{
color:white;
}

.devisAFaire{
color: yellow;
font-size:bold;
}
.devisEffectue{
color:orange;
font-size: bold;
}
.devisPaye{
color:white;
}
/*Formulaires*/
.erreur{
color: red;
font-size: 14pt;
}
input.erreurInput{
 border: solid red 2pt;
}
.tres_long
{
    width: 330px;
}
.btn-Exps{
  min-height: 62px;
  padding-left:5px!important;
  padding-right:0px!important;
  padding-top:0px;
  padding-bottom:0px;
  margin-left: 5px;

}
.btn-Exps>div{
padding-left:0px;
padding-right:0px;
}
.col-Exps{
padding-right:5px!important;
}
.long
{
    width: 150px;
}

.hspace{
    margin-left: 25px;
    margin-right: 25px;
    background: #5050ff;
    color: yellow;
}

.largeW{
min-width: 500px;
max-width: 1000px;
margin: 0 auto; /* Added */
float: none; /* Added */
margin-bottom: 10px; /* Added */
}
.vlargeW{
min-width: 800px;
max-width: 1200px;
margin: 0 auto; /* Added */
float: none; /* Added */
margin-bottom: 10px; /* Added */
}
/* Sticky footer styles
-------------------------------------------------- */
html {
  position: relative;
  min-height: 100%;
}
body {
  margin-bottom: 60px; /* Margin bottom by footer height */
}
.footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 60px; /* Set the fixed height of the footer here */
  background-color: #f5f5f5;
}

.navbar-center{
/*  position: absolute;*/
/*    width: 100%;*/
    left: 0px;
    top: 12px;
    text-align: center;
    color: black !important;
    font-weight: bold;
    font-size:18pt;
}
/* Custom page CSS
 * Not required for template or sticky footer method.
 * -------------------------------------------------- */

body > .container {
  padding: 60px 15px 0;
}
.container .text-muted {
  margin: 20px 0;
}

.footer > .container {
  padding-right: 15px;
  padding-left: 15px;
}

code {
  font-size: 80%;
}

.loginbox{
    margin-top:50px;
}
.forgot{
    float:right; 
    font-size: 80%; 
    position: relative; 
    top:-10px
}
.mbc{
    margin-bottom: 25px;
}
.mt{
    margin-top: 10px;
}
.hid{
    display: none;
}
.pt{
    padding-top: 30px;
}
/* MESSAGE */

div.msg { padding: 10px 16px; margin: 0 0 15px 215px; border: 1px solid; }
div.msg.succes { background: #e8ffe9; border-color: #a2d5a3; }
div.msg.erreur { background: #ffe9e9; border-color: #ec9a9a; }
div.msg2 {
    margin-top: 20px;
    font-size: 14pt;
}
div.msg2.succes { background: #e8ffe9; border-color: #a2d5a3; }
div.msg2.erreur { background: #ffe9e9; border-color: #ec9a9a; }

div.msg ul { padding: 0 0 0 20px; margin: 0; }

.centered{
text-align: center;
}
#GroupListAjax{
  width: 100%!important;
}
.redClass{
color:red;
}
.uploadifive-button {
	float: left;
	margin-right: 10px;
}
#queue {
	border: 1px solid #E5E5E5;
	height: 100px;
	overflow: auto;
	margin-bottom: 10px;
	padding: 0 3px 3px;
	width: 300px;
}
#uploadTot{
width:100%;
}
#infoCompose{
/*width:50%;*/
}
#infoPicture{
/*border: solid white 1px;
width:49%;*/
}
.img-wraps {
    position: relative;
    display: inline-block;
    max-width: 80%;
    font-size: 0;
}
.img-wraps .closes {
    position: absolute;
    top: 5px;
    right: 8px;
    z-index: 100;
    background-color: #FFF;
    padding: 4px 3px;
    
    color: #000;
    font-weight: bold;
    cursor: pointer;
   
    text-align: center;
    font-size: 22px;
    line-height: 10px;
    border-radius: 50%;
    border:1px solid red;
}
.img-wraps:hover .closes {
    opacity: 1;
}
.img-wraps .dwnld {
    position: absolute;
    top: 5px;
    left: 8px;
    z-index: 100;
    background-color: #FFF;
    padding: 4px 3px;

    color: #000;
    font-weight: bold;
    cursor: pointer;

    text-align: center;
    font-size: 22px;
    line-height: 10px;
    border-radius: 50%;
    border:1px solid red;
}

.multi-wrapper .selected-wrapper{
  background-color:rgb(80, 80, 255)!important; 
}
.multi-wrapper .selected-wrapper:hover{
  background-color:rgb(90, 90, 255)!important; 
}
.multi-wrapper .non-selected-wrapper{
 background-color:rgb(120, 120, 255)!important;
font-weight: bold; 
}
a.item.selected{
color: yellow!important;
font-weight: bold;
}

.multi-wrapper .item:hover{
color: yellow!important;
font-weight: bold;
background-color:rgb(140, 140, 255)!important; 
}
.navbar-brand{
background-color:white;
}
.cache{
visibility: hidden;
}
.btn-outline-secondary{
background-color: #f0ad4e!important;
}

.charte{
text-align: center;
padding-bottom: 15px;
border-bottom: solid white 2px;
}
.charte-haut{
text-align: center;
padding-top: 25px;
padding-bottom: 10px;
border-top: solid white 2px;
}
.charte-titre{
text-align: center;
font-weight: bold;
}
.lien-charte{
color: #bde2e6;
font-size: 18pt;
text-decoration: underline;
}
.lien-charte:visited{
color: #bde2e6;
font-size: 18pt;
text-decoration: underline;
}
.lien-charte:hover{
color: #bde2e6;
font-size: 18pt;
text-decoration: underline;
}

.select2-results__option {
  background-color: #ffffa0!important;
  color: grey!important;
}
.select2-container--default .select2-results__option[aria-selected=true]{
  background-color: white!important;
  color: black!important;
  font-weight: bold;
}

fieldset.partieOperateur {
    border: 1px groove #ddd !important;
    padding: 0 1.4em 1.4em 1.4em !important;
    margin: 0 0 1.5em 0 !important;
    -webkit-box-shadow:  0px 0px 0px 0px #000;
            box-shadow:  0px 0px 0px 0px #000;
}

legend.partieOperateur {
    font-size: 1.2em !important;
    font-weight: bold !important;
    text-align: left !important;
    width:inherit; /* Or auto */
    padding:0 10px; /* To give a bit of padding on the left and right */
    border-bottom:none;
}

fieldset.resultatsExp {
    border: 2px groove #0000aa !important;
    padding: 0 1.4em 1.4em 1.4em !important;
    margin: 0 0 1.5em 0 !important;
    -webkit-box-shadow:  0px 0px 0px 0px #000;
            box-shadow:  0px 0px 0px 0px #000;
}

legend.resultatsExp {
    font-size: 1.2em !important;
    font-weight: bold !important;
    color: #0000aa !important;
    text-align: left !important;
    width:inherit; /* Or auto */
    padding:0 10px; /* To give a bit of padding on the left and right */
    border-bottom:none;
}

.rouge{
color:red!important;
background-color: yellow;
height: 40px;
padding-top: 2px!important;
padding-bottom: 2px!important;
}
#avtMS.rouge{
height:60px;
}

.themeMass thead th {
    background-color: rgb(78, 93, 108);
    color: yellow;
    border-left: solid white 2px;
}
.themeMass tbody th {
    color: yellow;
}
.themeMass tbody td {
   border-left: solid white 2px;
}

.groshr{
  border-top: 2px solid white;
  margin-bottom: 10px;
  margin-top: 4px;
}
.tresGrosHR{
border-top: 4px solid white;
margin-bottom: 20px;
margin-top: 10px;

}

.consentement{
text-align: center;
font-size: 22pt;
font-weight: bold;
margin-bottom: 15px;
}
.textConsentement{
text-align: justify;
text-indent: 1.5em;
font-size: 12pt;
margin-top: 5px;
}
.colcache{
display: none;
width:30%;
}
.tableMasse{
width: 800px;

}
.Ltooltip{
    max-width: 650px!important;
    /* If max-width does not work, try using width instead */
    width: 650px!important; 

}
.tooltip-wide + .tooltip > .tooltip-inner {
     max-width: 100%;
}
.tooltip-inner2{
    max-width: 800px!important;
    width: 800px!important;
    text-align: left!important;
}
.tooltip-inner3{
    max-width: 450px!important;
    width: 450px!important;
    text-align: left!important;
}

.circle-color{
color:#4e5d6c;
background-color:white;
}
.zeroheight{
  border: 0px!important;
  margin: 0px!important;
  font-size: 1px!important;
   line-height: 0px!important;
  visibility: hidden;
}
.nomFichier{
  color: black;
  font-size: 8pt!important;
  padding-left: 2px;
  background:white;
  border: solid black 1px;
}
.bigBord{
    border: solid black 2px;
}
.bigBord2{
    border-top: solid black 2px;
    border-left: solid black 2px;
    border-right: solid black 2px;
}
.moyenBord{
    border-left: solid black 2px;
    border-right: solid black 2px;
}
.moyenBord2{
    border-left: solid black 2px;
    border-right: solid black 2px;
    border-bottom: solid black 2px;
}
.nbre{
    color: blue;
    text-align: right;
    margin-left: 20px;
    padding-left: 20px;
}
.payee{
 /*   color: #009900;*/
  color: white;
}
.enAttente{
 /*   color: red;*/
color: #DF691A;
}
.titreTableau{
    text-align: center;
    background: white;
    caption-side: top;
    color: #d9534f;
    padding: 5px;
    border: solid  #d9534f 1px;
    margin-top: 0.75rem;
/*    margin-bottom:1px;*/
}

#HabilitationsL{
width:100%;
border: solid #0000aa 3px;
}
#HabilitationsL th{
   background: #4E5D6C;
   color: white;
   font-weight: bold;

}
.notif{
    position: fixed;
    top: 60px;
    right: 0;
}
.notifS{
    position: fixed;
    top: 70px;
    z-index: 1000;
    right: 0;
}
.notifs2{
    position: absolute;
    top: 70px;
    right: 0;
}
#Factures{
    width: 100%;
}

.month:hover{
    color: red!important;
}
.month.focused{
    color: red;
}
th.clear:hover{
    color:red;
}
.close{
position: absolute;
left: 5px;
}
h4#myModalLabel{
margin-left: 25px;
color: rgb(223, 105, 26);
text-align: center;
}
.decal{
margin-left:35px;
}
.calRed{
}
.GrDesactive{
  color: blue;
}
.champLSro{
  background: grey;
}

.LSc{
    text-align: center;
    background: white;
    caption-side: top;
    color: #d9534f;
    padding: 5px;
    border: solid  #d9534f 1px;
    margin-top: 0.75rem;
   /* margin-bottom:1px;*/
    font-size: 18px;

}
.refreshIcon{
   margin-left: 15px;
   padding: 5px;
   background: lightgrey;
   color: rgb(223, 105, 26);
   border: solid #d9534f 1px;
   box-shadow: 2px 2px;
}
h2.centree{
text-align: center;
color: rgb(223, 105, 26);
}
.img-thumbnail{
        background-color: white!important;
}  
span.type_industrie{
  color: orange;
}
span.type_acad{
   color: rgb(30, 225, 30);

}
span.revoquee{
   color: red;
   text-decoration: line-through;
}
td.day:hover{
  color: orange;
}
#fprecisions{
border: solid orange 2px;
padding: 5px;
}
#Messages{
background: white;
color: black;
}
.dateM{
font-size: 10pt;
font-style: oblique;
}
.auteurM{
font-size: 10pt;
font-style: oblique;
font-weight: bold;
}

/* needed to position the spinner correctly */
.loading {
    position: relative;
}

/* credit: http://stephanwagner.me/only-css-loading-spinner */
@keyframes spinner {
    to { transform: rotate(360deg); }
}
@-webkit-keyframes spinner {
    to { -webkit-transform: rotate(360deg); }
}
.spinner {
    min-width: 24px;
    min-height: 24px;
}
.spinner:before {
    content:'Loading…';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 16px;
    height: 16px;
    margin-top: -10px;
    margin-left: -10px;
}
.spinner:not(:required):before {
    content: '';
    border-radius: 50%;
    border-top: 2px solid #03ade0;
    border-right: 2px solid transparent;
    animation: spinner .6s linear infinite;
    -webkit-animation: spinner .6s linear infinite;
}
.justLR{
    display: flex;
    justify-content: space-between;
}
.floatL{
float:left;
}
.floatR{
float:right;
}
.codeLS{
color: black;
margin-left:15px;
margin-top:-30px;
padding-bottom: 20px;
}

div#ListeAbonnes{
    height:450px;
}


div#validations{
  margin-bottom: 10px;
  text-align: center;
}
li.globalValid{
 color: red;
 font-weight: bold;
}
#progress{
height: 30px;
}
#progresValid{
width:0%;
}


.tooltip-wide + .tooltip > .tooltip-inner {
     max-width: 100%;
}
.small-liste{
  text-align: left;
  font-size:10pt;
}
span.GrTrim{
  color: #0000AA!important;
 font-weight: bold;
}
i.GrTrim{
 color: #202020;
}

.MayBe{
color:#0000AA;
};




/****************************************************************************************************************************/
/*                                                Animation du texte                                                        */
/*                                                    inspiré de                                                            */
/* https://medium.com/cloud-native-the-gathering/how-to-use-css-to-fade-in-and-fade-out-html-text-and-pictures-f45c11364f08 */
/****************************************************************************************************************************/

@-webkit-keyframes fadeOutMotd {
    0% { opacity: 1;}
    99% { opacity: 0.01;width: 100%; height: 100%;}
    100% { opacity: 0;width: 0; height: 0;}
}  
@keyframes fadeOutMotd {
    0% { opacity: 1;}
    99% { opacity: 0.01;width: 100%; height: 100%;}
    100% { opacity: 0;width: 0; height: 0;}
}

span.fade-out-motd{
    -webkit-animation: fadeOutMotd 1s;
    -moz-animation: fadeOutMotD ease 1s;
    -o-animation: fadeOutMotD ease 1s;
    -ms-animation: fadeOutMotD ease 1s;
    animation: fadeOutMotd 1s;
    animation-fill-mode: forwards;
}


span.fade-in-motd {
    animation: fadeInMotD ease 1s;
    animation-fill-mode: forwards;
  -webkit-animation: fadeInMotD ease 1s;
  -moz-animation: fadeInMotD ease 1s;
  -o-animation: fadeInMotD ease 1s;
  -ms-animation: fadeInMotD ease 1s;
}

@keyframes fadeInMotD {
    0% { opacity: 0;}
    99% { opacity: 0.99;width: 100%; height: 100%;}
    100% { opacity: 1;width: 0; height: 0;}
}

@-moz-keyframes fadeInMotD {
    0% { opacity: 0;}
    99% { opacity: 0.99;width: 100%; height: 100%;}
    100% { opacity: 1;width: 0; height: 0;}
}

@-webkit-keyframes fadeInMotD {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

@-o-keyframes fadeInMotD {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
  }
}

@-ms-keyframes fadeInMotD {
  0% {
    opacity:0;
  }
  100% {
    opacity:1;
}