/*  ---------------------------------------styles.css---------------------------------------------- */
/*  ----------------------------------------------------------------------------------------------- */


* { margin: 0;  padding: 0;  border: none;  outline: none;  background: none;  text-decoration: none;}
::-moz-focus-inner { border:0;}
html { height: 100%;}
body { width: 100%;  height: 100%;  font-size: 12px;  font-family: "times new roman", serif;  background-color: rgb(50,50,50);  text-align: center;}
a { touch-action: manipulation;}

input[type="text"], input[type="password"] { margin: 5px 0 10px 0;  padding:3px 10px 3px 10px;  color: rgb(50,50,50);  font-weight: bold;  font-family: "Trebuchet MS",Helvetica,Arial,sans-serif;  background-color: rgb(245,245,245);  border:1px solid rgb(100,100,100);  border-radius:2px;  box-shadow:1px 1px 2px rgb(190,190,190) inset;}
input[type="text"]:focus, input[type="password"]:focus { border-color: rgb(28,122,157);  box-shadow: 0 0 6px rgb(11,62,198);  background-color: white;}
input[type="password"] { font-family: caption;}
.inputerreur, .inputerreur[type="text"], .inputerreur[type="password"] { border-color: rgb(157,28,28);  box-shadow: 0 0 4px rgb(198,11,11);}
.inputerreur:focus, .inputerreur[type="text"]:focus, .inputerreur[type="password"]:focus { border-color: rgb(157,28,28);  box-shadow: 0 0 6px rgb(198,11,11);}

.page { position: relative;  width: 100%;  height: 100%;  overflow: hidden;}
.page_inner { position: relative;  left: 0;  height: 100%;  padding-top: 50px;  box-sizing: border-box;}
.derouleur { position: relative;  height: 100%;  overflow-y: auto;}

.notallowed { cursor: not-allowed;}

.icon::before { display: inline-block;  margin-right: 15px;  font-family: Flaticon;  font-style: normal;  font-weight: normal;  font-variant: normal;  text-transform: none;  line-height: 1;  -webkit-font-smoothing: antialiased;}
.icon2::before { display: inline-block;  margin-right: 15px;  font-family: Human;  font-style: normal;  font-weight: normal;  font-variant: normal;  text-transform: none;  line-height: 1;  -webkit-font-smoothing: antialiased;}

@media only screen and (max-width: 800px) {
	.page_inner { padding-top: 70px;}
}


/*  -------------------------------------------------------------------------------------------------------- */
/*  -----------------------------------------Connexion------------------------------------------------------ */


.connexion { padding-top: 5%;  width: 100%;  height: 100%;  text-align: center;  background-position: 40% 75%;  background-repeat: no-repeat;  box-sizing: border-box;}
.connexion .logo { text-align: center;}
.connexion .logo img { width: 120px;}
.connexion .title { margin: 20px 0 50px 0;  font-family: Republica;  font-size: 65px;  color: rgb(150,150,150);  text-shadow: 2px 2px 0 rgba(140,140,140,0.5), -2px -2px 1px rgb(0,0,0);}
.connexion .title .version { position: relative;  left: 232px;  bottom: 27px;  display: block;  font-family: Republica;  font-size: 14px;  color: rgb(90,90,90);  text-shadow: none;}
.connexion .mdperreur { display: inline-block;  margin: 0 auto 20px auto;  padding: 0 20px 0 15px;  height: 35px;  line-height: 35px;  background-color: rgb(83,14,14);  border: 1px solid rgb(146,0,41);  border-radius: 20px;  color: rgb(234,204,212);  font-weight: bold;  font-size: 16px;  visibility: hidden;  box-sizing: inherit;}
.connexion .input { display: block;  position: relative;  margin: 0 auto 0 auto;  width: 350px;  box-sizing: border-box;}
.connexion .input #pass { display: block;  padding: 0 30px 0 80px;  width: 100%;  height: 50px;  font-size: 20px;  color: rgb(150,150,150);  line-height: 50px;  border: 2px inset black;  border-radius: 25px;  background-color: rgba(115,115,115,0.5);  border: none;  box-shadow: none;  box-sizing: inherit;  transition: background-color 0.2s, border 0.2s;}
.connexion .input #pass:-webkit-autofill { -webkit-box-shadow: 0 0 0 100px rgb(207,205,214) inset;} /*pour Chrome*/
.connexion .input #pass + .icon-pass { display: flex;  align-items: center;  position: absolute;  top: 0;  left: 0;  padding-left: 35px;  width: 100%;  height: 100%;  font-size: 24px;  color: rgb(150,150,150);  pointer-events: none;  box-sizing: inherit;  transition: color 0.2s;}
.connexion .input #pass.wrong { border: 1px solid rgb(177,0,49);  background-color: rgba(107,2,50,0.15);}
.connexion .input #pass.wrong + .icon-pass::before { color: rgb(150,71,71);}

.connexion .input #login { display: block;  position: absolute;  top: 0;  left: 0;  margin-top: 70px;  width: 100%;  height: 50px;  font-family: Lato, sans-serif;  font-size: 22px;  font-weight: bold;  color: rgb(202,171,234);  line-height: 50px;  border-radius: 25px;  background-color: rgba(115,57,195,0.8);  border: none;  box-shadow: none;  box-sizing: inherit;  transition: background-color 0.2s, color 0.2s;  cursor: pointer;}
.connexion .input #login:hover { background-color: rgba(192,171,234,0.8);  color: rgb(83,32,152);}

@media only screen and (max-width: 800px) {
	.connexion { padding-top: 10%;  min-height: 1200px;  background-position: 50% 65%;}
	.connexion .title { margin-bottom: 90px;  font-size: 70px;}
	.connexion .title .version { left: 252px;  bottom: 30px;}
	.connexion .mdperreur { margin-bottom: 40px;  height: 40px;  line-height: 40px;  font-size: 17px;}
	.connexion .input { width: 500px;}
	.connexion .input #pass { height: 80px;  padding-left: 90px;  font-size: 28px;  line-height: 80px;  border-radius: 40px;}
	.connexion .input .icon-pass { padding-left: 30px;  font-size: 32px;}

	.connexion .input #login { margin-top: 120px;  height: 80px;  font-size: 34px;  line-height: 80px;  border-radius: 40px;}
}


/*  -------------------------------------------------------------------------------------------------------- */
/*  --------------------------------------Maintenance du site----------------------------------------------- */


.contenu { padding-top: 3%;  width: 100%;  height: 100%;  text-align: center;  background-position: 40% 75%;  background-repeat: no-repeat;  box-sizing: border-box;}
.contenu .logo { text-align: center;}
.contenu .logo img { width: 100px;}
.contenu .title { margin: 15px 0 80px 0;  font-family: Republica;  font-size: 40px;  color: rgb(150,150,150);  text-shadow: 1px 1px 0 rgba(140,140,140,0.5), -1px -1px 1px rgb(0,0,0);}
#maj { margin-bottom: 50px;  width: 100%;  font-family: Lato;  color: rgb(220,220,220);  text-align: center;}
#maj .etat { font-size: 50px;  font-weight: bold;  text-shadow: 1px 1px 4px rgb(234,192,255);}
#maj .desc { margin-top: 30px;  font-weight: bold;  font-size: 20px;}
#telechargement { width: 100%;}
#telechargement img { width: 300px;}


@media only screen and (max-width: 760px) {
	.contenu { background-position: 25% 85%;}
	#maj { margin-bottom: 70px;}
	#maj .etat { font-size: 60px;}
	#maj .desc { font-size: 25px;}
}


/*  -------------------------------------------------------------------------------------------------------- */
/*  ----------------------------------------Border-Top : Menu----------------------------------------------- */


.vacBordertop { position: fixed;  width: 100%;  height: 50px;  min-width: 740px;  text-align: left;  background-color: black;  box-shadow: 0 1px 10px rgb(0,5,56);  -webkit-transition: all 0.5s;  -moz-transition: all 0.5s;  transition: all 0.5s;   z-index: 2;}
.vacBordertop::before { display: inline-block;  width: 30px;  height: 100%;  background-color: rgb(115,57,195);  content: "";  vertical-align: top;}
#menu_icon { position: absolute;  top: 0;  left: 0;  padding: 0 20px 0 50px;  height: 100%;  color: rgb(240,240,240); cursor: pointer;  line-height: 50px;}
#menu_icon::before { height: 100%;  font-size: 38px;  line-height: 50px;}
#titre { position: absolute;  top: 0;  width: 100%;  height: 100%;  text-align: center;}
#titre p { margin: 0 auto;  width: 550px;  text-align: center;  white-space: nowrap;}
#titre p a { display: inline-block;  height: 100%;  font-family: arial, sans-serif;  color: rgb(230,230,230);  line-height: 50px;  vertical-align: top;}
#titre p a:hover { color: rgb(200,200,200);}
#titre p .home { font-size: 16px;  font-weight: bold;}
#titre p .home.cpt { padding-right: 20px;  font-size: 18px;}
#titre p .icon-home::before { font-size: 22px;}
#titre p .icon-compteur::before { font-size: 24px;}
#titre p .calendar::before { margin: 0 0 0 30px;  padding-top: 12px;  font-size: 20px;}
#titre p .prev, #titre p .next, #titre p .calendar { height: 50px;}
#titre p .prev::before { margin: 0;  padding: 5px 50px 0 50px;  font-size: 35px;}
#titre p .next::before { margin: 0;  padding: 5px 50px 0 50px;  font-size: 35px;}

#alertes { position: absolute;  top: 0;  right: 0;  padding: 0 50px 0 0;  height: 100%;  font-family: Lato;  font-weight: bold;  color: rgb(225,225,225);  font-size: 13px;  line-height: 50px;  cursor: pointer;}
#alertes span { color: rgb(245,245,245);  text-align: right;}
#alertes .icon-error::before { color: rgb(230,127,127);}
#alertes .icon-avert::before { color: rgb(214,191,123);}
#alertes .icon::before { position: relative;  top: 2px;  padding-left: 12px;  font-family: Flaticon;  font-size: 17px;}

#alex { position: absolute;  top: -2px;  width: 100%;  text-align: center;  z-index: 2;}
#alex #cal { margin: 0 auto;  width: 750px;  box-shadow: 0 5px 10px 2px rgb(20,20,20);}


@media only screen and (max-width: 800px) {
    .vacBordertop { height: 70px;}
	.vacBordertop::before { width: 25px;}
	#menu_icon { line-height: 70px;}
	#menu_icon::before { font-size: 50px;  line-height: 70px;}
	#titre p {width: 480px;}
	#titre p a { line-height: 70px;}
	#titre p .home { font-size: 25px;}
	#titre p .home.cpt { padding: 0;  font-size: 27px;}
	#titre p .icon-home::before { font-size: 28px;}
	#titre p .icon-compteur::before { font-size: 30px;}
	#titre p .calendar::before { margin: 0 30px 0 30px;  padding-top: 20px;  font-size: 28px;}
	#titre p .prev, #titre p .next, #titre p .calendar { height: 70px;}
	#titre p .prev::before { padding: 10px 40px 0 5px;  font-size: 45px;}
	#titre p .next::before { padding: 10px 5px 0 10px;  font-size: 45px;}
	
	#alertes { padding: 0;  font-size: 15px;  line-height: normal;}
	#alertes.smartAlert { padding-top: 18px;}
	#alertes span { display: block;  padding: 0 10px 0 0;  width: 165px;  height: 35px;  color: rgb(245,245,245);  line-height: 35px;}
	#alertes .icon::before { top: 2px;  font-size: 20px;}
	
	#alex #cal { width: 680px;}
}


/*  -------------------------------------------------------------------------------------------------------- */
/*  --------------------------------------Border-Bottom : infos--------------------------------------------- */


.borderbottom { position: absolute;  bottom: 0;  left: 0;  display: block;  margin-top: 15px;  width: 100%;  height: 50px;  background-color: black;}
.borderbottom p { display: inline-block;  margin: 10px 20px 0 20px;  vertical-align: top;  font-family: arial, sans-serif;  font-size: 14px;  color: rgb(189,153,153);  font-style: italic;}
.borderbottom p span { text-transform: uppercase;}
.borderbottom p img { margin-right: 10px;  width: 30px;  height: 30px;  vertical-align: middle;}

.borderbottom #nocss { display: none;}


/*  -------------------------------------------------------------------------------------------------------- */
/*  --------------------------------------Menu => multi-level----------------------------------------------- */


#menu { position: absolute;  top: 50px;  left: 0;  display: none;  width: 320px;  height: 100%;  font-family: Lato;  font-weight: lighter;  text-align: left;  -webkit-transform: translate(-100%, 0);  -moz-transform: translate(-100%, 0);  transform: translate(-100%, 0);  z-index: 1;  -webkit-box-sizing: border-box;  -moz-box-sizing: border-box;  box-sizing: border-box;}
#menu a { color: rgb(240,240,240);}
#menu a:hover, #menu a:focus { color: white;}
#menu .prochain::after { display: inline-block;  margin-left: 15px;  font-family: Lato;  font-weight: lighter;  font-style: italic;  color: rgb(243,219,219);  font-size: 13px;  content: '- Bientôt -';}
#menu .m_niveau { position: absolute;  top: 0;  left: 0;  width: 100%;  height: 100%;  background-color: rgb(128,104,187);  -webkit-transform: translate(-100%, 0);  -moz-transform: translate(-100%, 0);  transform: translate(-100%, 0);}

.page_inner::after, #menu .m_niveau::after, #menu .m_niveau::before { position: absolute;  top: 0;  right: 0;  width: 0;  height: 0;  content: '';  opacity: 0;}
.page_inner::after, #menu .m_niveau::after { background: rgba(0,0,0,0.75);  -webkit-transition: opacity 0.3s, width 0.1s 0.3s, height 0.1s 0.3s;  -moz-transition: opacity 0.3s, width 0.1s 0.3s, height 0.1s 0.3s;  transition: opacity 0.3s, width 0.1s 0.3s, height 0.1s 0.3s;}
.page_inner.pushed::after, #menu .m_niveau.overlay::after { width: 100%;  height: 100%;  opacity: 1;  -webkit-transition: opacity 0.3s;  -moz-transition: opacity 0.3s;  transition: opacity 0.3s;}
#menu .m_niveau::after { z-index: -1;}
#menu .m_niveau.overlay.m_niveau::before { width: 100%;  height: 100%;  background: transparent;  opacity: 1;}
.page_inner, #menu .m_niveau { -webkit-transition: all 0.5s;  -moz-transition: all 0.5s;  transition: all 0.5s;}

#menu > .m_niveau, #menu > .m_niveau.open { box-shadow: none;  -webkit-transform: translate(0, 0);  -moz-transform: translate(0, 0);  transform: translate(0, 0);}
#menu.m_cover .m_niveau.open { -webkit-transform: translate(0, 0);  -moz-transform: translate(0, 0);  transform: translate(0, 0);}
#menu.m_cover .m_niveau.open > ul > li > .m_niveau:not(.open) { -webkit-transform: translate(-100%, 0);  -moz-transform: translate(-100%, 0);  transform: translate(-100%, 0);}

#menu ul { margin: 0;  padding: 0;  list-style: none;}
#menu.m_cover h2 { margin: 0;  padding: 1em;  text-transform: uppercase;  font-family: Lato;  font-weight: bold;  letter-spacing: 1px;  font-size: 17px;  color: rgba(0,0,0,0.5);  text-shadow: 0 0 1px rgba(0,0,0,0.1);}
#menu.m_cover h3 { margin: 0;  padding: 1em;  text-transform: uppercase;  font-family: Lato;  font-weight: bold;  letter-spacing: 1px;  font-size: 17px;  color: rgba(0,0,0,0.7);  text-shadow: 0 0 1px rgba(0,0,0,0.1);  background-color: rgba(0,0,0,0.1);}
#menu.m_cover h3.icon-error { background-color: rgba(218,5,5,0.2);}
#menu.m_cover h3.icon-avert { background-color: rgba(255,247,0,0.36);}
#menu.m_cover h3.icon-admin, #menu.m_cover h3.icon-gestion, #menu.m_cover h3.icon-export { background-color: rgba(255,153,0,0.4);}
#menu.m_cover h3.icon-emploi { background-color: rgba(5,218,139,0.2);}
#menu.m_cover h3.icon-link { background-color: rgba(255,0,212,0.2);}
#menu ul li > a { display: block;  padding: 15px 0 15px 45px;  box-shadow: inset 0 -1px rgba(0,0,0,0.2);  text-shadow: 0 0 1px rgba(255,255,255,0.1);  font-size: 20px;  cursor: pointer;  -webkit-transition: background 0.3s, box-shadow 0.3s;  -moz-transition: background 0.3s, box-shadow 0.3s;  transition: background 0.3s, box-shadow 0.3s;}
#menu ul li::before { position: absolute;  left: 10px;  padding-top: 20px;  color: rgba(50,50,50,0.3);  font-size: 20px;  z-index: -1;}
#menu .m_niveau > ul > li:first-child > a, #menu hr + li > a { box-shadow: inset 0 -1px rgba(0,0,0,0.2), inset 0 1px rgba(0,0,0,0.2);}
#menu ul li a:hover, #menu .m_niveau > ul > li:first-child > a:hover { background-color: rgba(0,0,0,0.2);  box-shadow: inset 0 -1px rgba(0,0,0,0);}
#menu .m_niveau.overlay > ul > li > a, #menu .m_niveau.overlay > ul > li:first-child > a { box-shadow: inset 0 -1px rgba(0,0,0,0);}
#menu .m_niveau > ul > li:first-child > a:hover, #menu .m_niveau.overlay > ul > li:first-child > a { box-shadow: inset 0 -1px rgba(0,0,0,0), inset 0 1px rgba(0,0,0,0);}
#menu ul li > a span { padding-left: 10px;  font-size: 18px;}
#menu .retour { position: relative;  display: block;  padding: 14px;  color: white;  text-transform: uppercase;  letter-spacing: 1px;  font-family: Lato;  font-weight: bold;  font-size: 13px;  background-color: rgba(0,0,0,0.1);  box-shadow: inset 0 1px rgba(0,0,0,0.1);  -webkit-transition: background 0.3s;  -moz-transition: background 0.3s;  transition: background 0.3s;}
#menu .retour::after { position: absolute;  right: 10px;  font-family: Flaticon;  content: "\f276";  font-size: 17px;  color: rgba(0,0,0,0.3);}
#menu .m_niveau.overlay > .retour, #menu .m_niveau.overlay > .retour::after { background: transparent;  box-shadow: none;  color: transparent;}

#menu p { display: block;  padding: 15px 0 15px 45px;  color: rgb(230,230,230);  box-shadow: inset 0 -1px rgba(0,0,0,0.2);  text-shadow: 0 0 1px rgba(255,255,255,0.1);  font-size: 14px;}
#menu .m_niveau > h3 + p{ box-shadow: inset 0 1px rgba(0,0,0,0.2), inset 0 -1px rgba(0,0,0,0.2);}


@media only screen and (max-width: 800px) {
	#menu { top: 70px;  width: 400px;}
	#menu .icon::before { margin-right: 20px;}
	#menu .prochain::after { margin-left: 20px;  font-size: 15px;}	
	#menu.m_cover h2 { font-size: 18px;}
	#menu.m_cover h3 { font-size: 19px;}
	#menu ul li > a { padding: 20px 0 20px 55px;  font-size: 25px;  box-shadow: inset 0 -1px rgba(0,0,0,0.3);}
	#menu ul li::before { left: 15px;  padding-top: 25px;  font-size: 25px;}
	#menu .m_niveau > ul > li:first-child > a, #menu hr + li > a { box-shadow: inset 0 -1px rgba(0,0,0,0.3), inset 0 1px rgba(0,0,0,0.3);}
	#menu .retour { padding: 20px;  font-size: 16px;  box-shadow: inset 0 1px rgba(0,0,0,0.2);}
	#menu .retour::after { right: 15px;  font-size: 20px;}	
	#menu p { color: rgb(240,240,240);  box-shadow: inset 0 -1px rgba(0,0,0,0.3);  font-size: 20px;}
	#menu .m_niveau > h3 + p{ box-shadow: inset 0 1px rgba(0,0,0,0.3), inset 0 -1px rgba(0,0,0,0.3);}
}


/*  -------------------------------------------------------------------------------------------------------------------- */
/*  ----------------------------------------Mise en page des conteneurs------------------------------------------------- */
	
	
.content { position: relative;}
.content_inner { position: relative;  margin: 0 auto 0 auto;  width: 730px;  text-align: center;}


/*  ---------------------------------------------------------------------------------------------------------------------- */
/*  ----------------------------------------Mise en page autour de la VAC------------------------------------------------- */


.content #nowVac { position: relative;  display: inline-block;  width: 730px;  background-color: white;  border-radius: 0 0 4px 4px;  box-shadow: 0 0 15px 6px black;  z-index: 0;}
.content #nowVac.animate { transition: all linear 0.5s;  -webkit-transition: all linear 0.5s;  -moz-transition: all linear 0.5s;}


/*  -------------------------------------------------------------------------------------------------------- */
/*  --------------------------------------Page erreur----------------------------------------------- */


#pageerreur { margin: 0 auto;  width: 100%;  max-width: 1000px;  font-family: Lato;  text-align: center;}
#pageerreur .e-txt1 { margin: 60px 0;  color: rgb(80,80,80);  font-size: 120px;  text-shadow: 1px 1px 2px rgb(200,200,200);  font-weight: bold;}
#pageerreur .e-txt2 { color: rgb(120,120,120);  font-size: 30px;  font-weight: bold;}
#pageerreur .e-txt3 { margin-top: 30px;  color: rgb(105,105,105);  font-size: 20px;  font-weight: bold;  font-style: italic;}
#pageerreur .e-img { margin-top: 100px;}

@media only screen and (max-width: 800px) {
	#pageerreur .e-txt1 { margin: 80px 0 60px 0;  font-size: 130px;}
	#pageerreur .e-txt3 { margin-top: 40px;  font-size: 22px;}
	#pageerreur .e-img { margin-top: 120px;}
	#pageerreur .e-img img { width: 720px;}
}


/*  -------------------------------------------------------------------------------------------------------- */
/*  ---------------------------------------Style de la VAC-------------------------------------------------- */
	
	
#vac { padding: 5px 15px 15px 15px;}
#vac .entete { padding: 37px 0 0 45px;  width: 652px;  height: 46px;  background: url('../images/modeles/entete.jpg') center center no-repeat;  text-align: left;}
#vac .entete .title { font-size: 16px;  font-weight: bold;}
#vac .numCycle { padding: 0 0 5px 5px;  font-size: 14px;  font-weight: bold;  text-align: left;}
#vac .numCycle span { font-size: 17px;  font-weight: bold;  color:rgb(180,0,0);}
#vac .t1 { border: 2px solid black;  border-collapse: separate;  border-spacing: 2px;  table-layout: fixed;}
#vac .t1 table { border: none;  border-collapse: collapse;  table-layout: fixed;}


/*  ------------------------------------Style des balises TH------------------------------------------------ */	


#vac .t1 th { vertical-align: top;  font-size: 13px;}
#vac .t1 .vac1th { position: relative;  width: 279px;}
#vac .t1 .vac2th { position: relative;  width: 285px;}
#vac .t1 .prep { position: relative;  width: 124px;}
#vac .t1 th table th { padding: 2px 0;  width: 91px;  height: 65px;  border: 2px solid black;}
#vac .t1 th table .prep2 { padding-top: 4px;  width: 120px;  height: 63px;  font-size: 17px;}
#vac .t1 th table .nuit { width: 97px;  border-left-width: 1px;}	
#vac .t1 th table .briefoui  { display: block;  position: absolute;  top: 35px;  width: 89px;  text-align: center;  color: rgb(0,150,0);  font-size: 12px;  background-color: rgb(235,235,235);  border: 1px solid rgb(215,215,215);  z-index: 1;}
#vac .t1 th table .briefnon { display: block;  position: absolute;  top: 35px;  width: 89px;  text-align: center;  color: rgb(180,0,0);  font-size: 12px;  background-color: rgb(235,235,235);  border: 1px solid rgb(215,215,215);  z-index: 1;}	
#vac .t1 th table th span { font-weight: normal;  font-size: 11px;}
#vac .t1 .prep table .prep2 span { font-size: 12px;}


/*  ----------------------------Style des balises TD premier tableau----------------------------------------- */	


#vac .t1 .vac1 { width: 279px;}
#vac .t1 .vac2 { width: 285px;}
#vac .t1 .nom { width: 124px;}
#vac .t1 .nom .td2Rel { position: relative;  width: 124px;}
#vac .t1 .comment { width: 688px;  height: 145px;  border: 2px solid black;  vertical-align: top;}
#vac .t1 .comment .td4Rel { position: relative;  width: 688px;  height: 145px;}
#vac .t1 .comment .commentairesVAC { padding: 15px;  text-align: left;  font-size: 14px;  color: rgb(50,50,50);  line-height: 1.4;}
#vac .t1 .comment .commentairesVAC img { vertical-align: middle;}
#vac .t1 .repas { width: 688px;  height: 100px;  text-align: left;  border: 2px solid black;}

	
/*  ----------------------------Style des balises TD deuxième tableau----------------------------------------- */	


#vac .t1 td table tr { border-top: 1px solid black;  border-bottom: 1px solid black;  border-left: 2px solid black;  border-right: 2px solid black;}
#vac .t1 .repas table tr { border: none;}
#vac .t1 td table .trAbs { display: none;}
#vac .t1 td table td { position: relative;  width: 91px;  height: 18px;  font-family: arial, sans-serif;  text-align: center;  vertical-align: middle;  overflow: hidden;  white-space: nowrap;}
#vac .t1 td table td .icon::before, #vac .t1 td table td .icon2::before { margin: 0 5px;  padding-top: 1px;  font-size: 16px;  color: rgb(130,130,130);}
#vac .t1 td table td .icon-congesex::before { color: rgba(100,100,100,0.6);}
#vac .t1 td table td .d0 { width: 21px;  height: 18px;  line-height: 18px;}
#vac .t1 td table td .d1 { width: 91px;  height: 18px;  line-height: 18px;}
#vac .t1 td table td .d2 { width: 75px;  height: 18px;  line-height: 18px;}
#vac .t1 td table td .td1Rel { position: relative;  width: 91px;  height: 18px;  line-height: 18px;}
#vac .t1 td table td .td3Rel { position: relative;  width: 75px;  height: 18px;  line-height: 18px;}
#vac .t1 .nom table td { width: 120px;  height: 18px;}
#vac .t1 .nom table td .d0 { width: 120px;  height: 18px;  line-height: 18px;}
#vac .t1 .vac2 table tr > td:first-child + td + td { width: 75px;}
#vac .t1 .vac2 table tr > td:first-child + td + td + td { width: 21px;}
#vac .t1 td table td img { width: 18px;  height: 18px;  vertical-align: middle;}
#vac .t1 td table td span { display: inline-block;  height: 18px;  color: rgb(70,70,70);  font-size: 12px;  font-weight: bold;  vertical-align: top;}
#vac .t1 td table td .heure { color: rgb(0,150,0);}
#vac .t1 td table td .heure sup { line-height: 12px;  vertical-align: top;}
#vac .t1 td table td .cds2 { color: rgb(200,0,0);}
#vac .t1 td table td .vic { color: rgb(70,70,70);  font-size: 11px;}
#vac .t1 td table td .astr { color: rgb(70,70,70);  font-size: 13px;}
#vac .t1 td table td .astr2 { color: rgb(82,49,0);  font-size: 12px;}
#vac .t1 td table td .recup  { color: rgb(90,90,90);  font-size: 12px;}
#vac .t1 td table td .imgRepas { margin: 0 5px;}
#vac .t1 td table td .rempla { color: rgb(22,94,212);  font-size: 11px;}
#vac .t1 td table td .recDir { color: rgb(50,50,50);  font-size: 11px;}
#vac .t1 td table td .extraTxt { padding-left: 5px;  color: rgb(100,100,100);  font-size: 11px;}
#vac .t1 td table td .videDet { background: repeating-linear-gradient(53deg, rgb(230,230,230), rgb(235,235,235) 20px, rgb(210,210,210) 20px, rgb(220,220,220) 35px);}

#vac .t1 td table .abs { background-color: rgb(191,166,166);}
#vac .t1 td table .abs .exces { color: rgb(190,0,0);  font-weight: bold;}


/*  --------------------------------Mise en forme des cellules repas--------------------------------------------- */


#vac .t1 .repas table .image { width: 164px;  height: 100px;  border-right: 1px solid black;}
#vac .t1 .repas table .image img { width: 110px;  height: 98px;}
#vac .t1 .repas table .title { height: 19px;  font-weight: bold;  font-size: 14px;  text-align: center;  vertical-align: middle;  border-bottom: 1px solid black;}
#vac .t1 .repas table .nomsR { padding: 5px 0 0 10px;  width: 164px;  height: 75px;  text-align: left;  vertical-align: top;}
#vac .t1 .repas table .nomsR p { font-size: 14px;  line-height: 20px;}
#vac .t1 .repas table .nomsR p span { display: block;  margin-bottom: 4px;  font-weight: bold;  text-decoration: underline;}


/*  -------------------------------------------------------------------------------------------------------- */
/*  --------------------------------------Édition des fiches VAC-------------------------------------------- */	


.ecranOp { position: fixed;  top: 0;  left: 0;  width: 100%;  height: 100%;  background: rgba(0,0,0,0.7);  opacity: 0;  transition: opacity ease-in 0.2s;  pointer-events: none;  z-index: 3;}
.ecranOp_act { opacity: 1;  transition: opacity ease-out 0.2s;  pointer-events: auto;}
.controleursEd, .commentsEd, .journeeEd, .resultatEd { position: fixed;  top: 15%;  left: 50%;  padding: 0 15px 15px 15px;  background-color: rgb(194,188,214);  border-radius: 4px;  z-index: 4;}
#editionNoms { position: absolute;  top: 0;  width: 100%;  height: 100%;  background-color: rgba(255,255,255,0.2);  cursor: pointer;  z-index: 2;}
#editionNoms:hover { background-color: rgba(70,70,70,0.7);}
#editionComment { position: absolute;  top: 0;  width: 100%;  height: 100%;  background-color: rgba(255,255,255,0.2);  cursor: pointer;  z-index: 2;}
#editionComment:hover { background-color: rgba(70,70,70,0.7);}
.editionJour { position: absolute;  top: 0;  width: 100%;  height: 100%;  background-color: rgba(255,255,255,0.2);  z-index: 2;}
.editionJour:hover { background-color: rgba(70,70,70,0.7);}
.editionJour p { display: block;  width: 100%;  height: 100%;  cursor: pointer;}

.notallowed { cursor: not-allowed;}

@media only screen and (max-width: 800px) {
	.controleursEd, .commentsEd, .journeeEd, .resultatEd { border-radius: 15px;}
}


/*  --------------------------------Résultat de l'édition des cellules de la VAC------------------------------------ */


.echec { margin: 12px 0 10px 0;  font-family: arial, sans-serif;}
	

/*  --------------------------------------Édition des Contrôleurs-------------------------------------------- */


.ui-widget-content { background: rgb(212,208,228);  font-family: arial, sans-serif;  font-size: 12px;  font-weight: bold;}
.ui-widget.ui-widget-content { border: 1px solid rgb(144,131,180);  border-top: none;}
.ui-widget-content .ui-state-active { background: transparent url('../images/jquery/ui-bg_inset-hard_75_999999_1x100.png') 50% 50% repeat-x;  border: none;  font-size: 12px;}
.ui-selectmenu-icon.ui-icon { margin-top: 1px;}
.ui-selectmenu-text { margin-top: 2px;}

.controleursEd { margin-left: -500px;  padding: 0 0 10px 0;  width: 1000px;  min-height: 650px;}
.controleursEd form { position: relative;  text-align: left;}
.controleursEd input[type="text"] { font-family: arial, sans-serif;  font-size: 12px;  color: rgb(80,80,80);  background-color: rgb(228,225,230);}
.controleursEd input.bgDonnees { background-color: rgb(219,234,236);}
.controleursEd .entete { padding: 25px 0 10px 0;  width: 100%;}
.controleursEd .entete p { display: inline-block;  vertical-align: middle;}
.controleursEd .entete .title { padding-left: 35px;  width: 700px;  font-family: Republica;  font-size: 26px;  color: rgb(69,56,99);}
.controleursEd .entete .envoyer { width: 200px;}
.controleursEd .entete .envoyer input[type="submit"] { display: block;  width: 100%;  height: 45px;  font-family: Lato, sans-serif;  font-size: 20px;  font-weight: bold;  color: rgb(251,244,255);  line-height: 45px;  border-radius: 25px;  background-color: rgba(115,57,195,0.8);  border: none;  box-shadow: none;  box-sizing: inherit;  cursor: pointer;  transition: background-color 0.2s, color 0.2s;}
.controleursEd .entete .envoyer input[type="submit"]:hover { background-color: rgba(240,232,255,0.8);  color: rgb(83,32,152);}
.controleursEd .listing { height: 570px;  width: 100%;  overflow: auto;}
.controleursEd .listing .subtitle { margin: 30px 0 30px 0;  padding: 8px 0 8px 20px;  font-family: Republica;  font-size: 24px;  color: rgb(139,131,187);  background-image: linear-gradient(40deg, rgb(194,188,214) 43%,rgba(92,86,142,0.55));}
.controleursEd .listing .subtitle2 { margin: 30px 0 15px 50px;  font-family: Republica;  font-size: 16px;  color: rgb(105,138,185);}
.controleursEd .listing div { position: relative;  padding: 1px 15px 1px 55px; font-family: arial, sans-serif;  font-size: 12px;  color: rgb(20,20,20);  overflow: hidden;  transition: height cubic-bezier(0.15, 0, 0, 1) 0.5s;}
.controleursEd .listing div.div-reduce { height: 38px;}
.controleursEd .listing div.div-expand { height: 113px;}
.controleursEd .listing #div { margin-bottom: 30px;}
.controleursEd .listing div .maskDes { display: none;  position: absolute;  right: 0;  width: 100%;  height: 100%;  background-color: rgba(194,188,214,0.9);  z-index: 5;}
.controleursEd .listing div .desactiver, .controleursEd .listing div .ajouter { display: flex;  position: absolute;  top: 1px;  left: 10px;  width: 40px;  height: 100%;  text-align :center;  z-index: 5;}
.controleursEd .listing div .desactiver span, .controleursEd .listing div .ajouter span { margin: auto;}
.controleursEd .listing div .ajouter .icon-adduser { color: rgb(94,81,125);  font-size: 25px;}
.controleursEd .listing div .desactiver span .icon-suppr { color: rgb(130,0,0);  font-size: 18px;  cursor: pointer;}
.controleursEd .listing div .desactiver span .icon-suppr::before { margin: 0;}
.controleursEd .listing div .desactiver span .icon-suppr + input[type="checkbox"] { display: none;}

.controleursEd .listing div fieldset { display: inline-block;  border-radius: 8px;}
.controleursEd .listing div p { display: inline-block;  vertical-align: middle;}
.controleursEd .listing div .edit { margin-left: 20px;  padding-top: 1%;  font-size: 18px;  color: rgb(127,111,165);  cursor: pointer;}

.controleursEd .listing div .identite { width: 490px;  height: 38px;  vertical-align: middle;}
.controleursEd .listing div .identite .noms, .controleursEd .listing div .identite .prenoms { margin: 6px 10px 0 10px;  padding: 2px 10px 2px 10px;  height: 20px;  width: 200px;  font-weight: bold;  border: 1px solid rgb(179,170,189);  border-radius: 4px;}
.controleursEd .listing div .identite .noms:focus, .controleursEd .listing div .identite .prenoms:focus { box-shadow: 0 0 6px rgb(11,62,198);  background-color: rgb(245,241,247);}
.controleursEd .listing div .identite .inputerreur { border: 1px solid rgb(190,0,0);  box-shadow: 0 0 4px rgb(198,11,11);  background-color: rgb(255,210,210);}

.controleursEd .listing div .infos { padding: 0 10px;  height: 30px;  width: 340px;  border: 2px solid rgb(127,111,165);  vertical-align: middle;  background-color: rgb(212,208,228);}
.controleursEd .listing div .infos .icon-statut::before { position: relative;  top: 3px;  font-size: 18px;  color: rgb(127,111,165);}
.controleursEd .listing div .infos .ui-selectmenu-button.ui-button { height: 20px;  font-family: arial, sans-serif;  font-weight: bold;  color: rgb(80,80,80);  font-size: 12px;  background: none;  border: none;  box-shadow: none;}
.controleursEd .listing div .infos p[id*="statInfo"] { margin-top: 3px;  text-align: center;}
.controleursEd .listing div .infos p[id*="pcInfo"] { margin: 3px 0 0 8px;  text-align: center;}
.controleursEd .listing div .infos p[id*="pcInfo"] input[type="text"] { margin: 0 5px;  padding: 2px;  width: 58px;  height: 15px;  font-size: 11px;  border: 1px solid rgb(204,204,204);}
.controleursEd .listing div .infos p[id*="pcInfo"] input[type="text"]:focus { box-shadow: 0 0 3px rgb(11,62,198);  background-color: rgb(245,241,247);}
.controleursEd .listing div .infos p[id*="pcInfo"] input[type="text"].inputerreur { border: 1px solid rgb(190,0,0);  box-shadow: 0 0 4px rgb(198,11,11);  background-color: rgb(255,210,210);}

.controleursEd .listing div .infosup { margin: 5px 0 0 10px;  padding: 5px 10px;  width: 820px;  border: 2px solid rgb(127,111,165);  vertical-align: middle;  background-color: rgb(212,208,228);}
.controleursEd .listing div .infosup .icon-equipe::before { margin-right: 17px;  font-size: 16px;  color: rgb(127,111,165);}
.controleursEd .listing div .infosup p[id*="equipeInfo"] { text-align: center;}
.controleursEd .listing div .infosup p[id*="equipeInfo"] input[type="radio"] { position: relative;  top: 2px;  margin: 0 10px;}
.controleursEd .listing div .infosup .icon-power::before { margin-right: 17px;  font-size: 16px;  color: rgb(127,111,165);}
.controleursEd .listing div .infosup p[id*="affectInfo"] { margin-left: 50px;  text-align: center;}
.controleursEd .listing div .infosup p[id*="affectInfo"] label { margin: 0;}
.controleursEd .listing div .infosup p[id*="affectInfo"] input[type="text"] { margin: 0 5px;  padding: 2px;  width: 58px;  height: 15px;  font-size: 11px;  border: 1px solid rgb(204,204,204);}
.controleursEd .listing div .infosup p[id*="affectInfo"] input[type="text"]:focus { box-shadow: 0 0 3px rgb(11,62,198);  background-color: rgb(245,241,247);}
.controleursEd .listing div .infosup p[id*="affectInfo"] input[type="text"].inputerreur { border: 1px solid rgb(190,0,0); box-shadow: 0 0 4px rgb(198,11,11);  background-color: rgb(255,210,210);}
.controleursEd .listing div .infosup p[id*="affectInfo"] em { margin-right: 10px;}

.controleursEd .listing div .infosup .icon-detach::before { font-size: 18px;  color: rgb(127,111,165);}
.controleursEd .listing div .infosup p[id*="detInfo"] { margin-top: 10px;  text-align: center;}
.controleursEd .listing div .infosup p[id*="detInfo"] input[type="text"] { margin: 0 5px;  padding: 2px;  width: 58px;  height: 15px;  font-size: 11px;  border: 1px solid rgb(204,204,204);}
.controleursEd .listing div .infosup p[id*="detInfo"] input[type="text"]:focus { box-shadow: 0 0 3px rgb(11,62,198);  background-color: rgb(245,241,247);}
.controleursEd .listing div .infosup p[id*="detInfo"] input[type="text"].inputerreur { border: 1px solid rgb(190,0,0); box-shadow: 0 0 4px rgb(198,11,11);  background-color: rgb(255,210,210);}
.controleursEd .listing div .infosup .icon-maternite::before { font-size: 18px;  color: rgb(127,111,165);}
.controleursEd .listing div .infosup p[id*="matInfo"] { margin: 10px 0 0 40px;}
.controleursEd .listing div .infosup p[id*="matInfo"] input[type="text"] { margin: 0 5px;  padding: 2px;  width: 58px;  height: 15px;  font-size: 11px;  border: 1px solid rgb(204,204,204);}
.controleursEd .listing div .infosup p[id*="matInfo"] input[type="text"]:focus { box-shadow: 0 0 3px rgb(11,62,198);  background-color: rgb(245,241,247);}
.controleursEd .listing div .infosup p[id*="matInfo"] input[type="text"].inputerreur { border: 1px solid rgb(190,0,0); box-shadow: 0 0 4px rgb(198,11,11);  background-color: rgb(255,210,210);}
.controleursEd .listing div .infosup p[id*="matInfo"] label[for*="relache"] { margin-left: 10px;}


.controleursEd .entete .title .icon-refus { margin-left: 20px;  font-size: 30px;  color: rgb(152,25,25);}
.controleursEd .entete .echec { margin: 0;}
.controleursEd .entete .echec p { display: block;  margin: 10px 0 0 30px;  color: rgb(152,25,25);  font-weight: bold;  font-size: 14px;}
.controleursEd .entete .echec p strong { color: rgb(100,0,0);}
.controleursEd .entete .echec p::before{ content: "*  ";  color: rgb(100,0,0);}

@media only screen and (max-width: 999px) {
	.ui-widget-content { font-size: 13px;}
	.ui-widget-content .ui-state-active { font-size: 14px;}
	.ui-selectmenu-icon.ui-icon { margin-top: 3px;}
	.ui-selectmenu-text { margin-top: 0;}
	
	.controleursEd { margin-left: -45%;  width: 90%;  height: 820px;}
	.controleursEd input[type="text"] { font-size: 13px;}
	.controleursEd .entete .title { padding-left: 30px;  width: 65%;  font-size: 28px;}
	.controleursEd .entete .envoyer { width: 25%;}
	.controleursEd .entete .envoyer input[type="submit"] { width: 100%;  height: 50px;  font-size: 24px;  line-height: 50px;  border-radius: 24px;}
	.controleursEd .listing { height: 660px;}
	.controleursEd .listing .subtitle { margin: 20px 0 10px 0;  padding-left: 30px;  font-size: 22px;}
	.controleursEd .listing .subtitle2 { margin: 10px 0 10px 50px;  font-size: 18px;}
	.controleursEd .listing div { padding: 1px 0 1px 50px;  font-size: 14px;}
	.controleursEd .listing div.div-reduce { height: 44px;}
	.controleursEd .listing div.div-expand { height: 220px;}
	.controleursEd .listing div .desactiver, .controleursEd .listing div .ajouter { top: 0;  left: 10px;  width: 30px;}
	.controleursEd .listing div .ajouter .icon-adduser { font-size: 25px;}
	.controleursEd .listing div .desactiver span .icon-suppr { font-size: 22px;}
	
	.controleursEd .listing div .edit { margin-left: 10px;  padding-top: 3px;  font-size: 22px;}

	.controleursEd .listing div .identite { width: 38%;  height: 44px;  vertical-align: middle;}
	.controleursEd .listing div .identite .noms, .controleursEd .listing div .identite .prenoms { margin: 4px 2px 0 3px;  padding: 2px 1px 2px 5px;  height: 30px;  width: 44%;}
	
	.controleursEd .listing div .infos { margin-left: 2px;  padding: 0 5px;  height: 40px;  width: 52%;}
	.controleursEd .listing div .infos .icon-statut::before { top: 5px;  margin-right: 5px;  font-size: 22px;}
	.controleursEd .listing div .infos .ui-selectmenu-button.ui-button { width: 95px;  font-size: 14px;}
	.controleursEd .listing div .infos p[id*="statInfo"] { margin-top: 1px;}
	.controleursEd .listing div .infos p[id*="pcInfo"] { margin: 4px 0 0 2px;}
	.controleursEd .listing div .infos p[id*="pcInfo"] input[type="text"] { width: 75px;  height: 25px;  font-size: 12px;}
	
	.controleursEd .listing div .infosup { margin: 5px 0 0 1%;  padding: 1% 2%;  width: 87%;}
	.conrtoleursEd .listing div .infosup p { display: block;}
	.controleursEd .listing div .infosup .icon-equipe::before { margin-right: 20px;  font-size: 22px;}
	.controleursEd .listing div .infosup .icon-power::before { margin-right: 20px;  font-size: 22px;}
	.controleursEd .listing div .infosup p[id*="affectInfo"] { margin: 10px 0 0 0;}
	.controleursEd .listing div .infosup p[id*="affectInfo"] input[type="text"] { width: 75px;  height: 25px;  font-size: 12px;}

	.controleursEd .listing div .infosup .icon-detach::before { margin-right: 20px;  font-size: 22px;}
	.controleursEd .listing div .infosup p[id*="detInfo"] input[type="text"] { width: 75px;  height: 25px;  font-size: 12px;}
	.controleursEd .listing div .infosup .icon-maternite::before { font-size: 22px;}
	.controleursEd .listing div .infosup p[id*="matInfo"] { margin: 10px 0 0 0;}
	.controleursEd .listing div .infosup p[id*="matInfo"] input[type="text"] { margin: 0 3px;  width: 75px;  height: 25px;  font-size: 12px;}
	.controleursEd .listing div .infosup p[id*="matInfo"] label[for*="relache"] { margin-left: 8px;}

}


/*  --------------------------------------Édition des commentaires-------------------------------------------- */


.commentsEd	{ top: 25%;  margin-left: -415px;  padding: 0 15px 25px 15px;  width: 800px;  min-height: 330px;  overflow: auto;}
.commentsEd form { position: relative;  text-align: left;}
.commentsEd .entete { padding: 25px 0 10px 0;  width: 100%;}
.commentsEd .entete p { display: inline-block;  vertical-align: middle;}
.commentsEd .entete .title { padding-left: 20px;  width: 560px;  font-family: Republica;  font-size: 26px;  color: rgb(69,56,99);}
.commentsEd .entete .envoyer { width: 200px;}
.commentsEd .entete .envoyer input[type="submit"] { display: block;  width: 100%;  height: 45px;  font-family: Lato, sans-serif;  font-size: 20px;  font-weight: bold;  color: rgb(251,244,255);  line-height: 45px;  border-radius: 25px;  background-color: rgba(115,57,195,0.8);  border: none;  box-shadow: none;  box-sizing: inherit;  cursor: pointer;  transition: background-color 0.2s, color 0.2s;}
.commentsEd .entete .envoyer input[type="submit"]:hover { background-color: rgba(240,232,255,0.8);  color: rgb(83,32,152);}
.commentsEd .textArea { padding-top: 40px;}
.commentsEd .textArea .p_area { text-align: center;}
.commentsEd .textArea textarea { margin: 10px auto;  padding: 10px;  width: 690px;  height: 150px;  color: rgb(50,50,50);  font-family: "Trebuchet MS",Helvetica,Arial,sans-serif;  background-color: rgb(245,245,245);  border:1px solid rgb(100,100,100);  border-radius:2px;  box-shadow:1px 1px 2px rgb(190,190,190) inset;}


.commentsEd .entete .title .icon-refus { margin-left: 20px;  font-size: 30px;  color: rgb(152,25,25);}
.commentsEd .entete .echec { margin: 0;}
.commentsEd .entete .echec p { display: block;  margin: 10px 0 0 20px;  color: rgb(152,25,25);  font-weight: bold;  font-size: 14px;}
.commentsEd .entete .echec p strong { color: rgb(100,0,0);}
.commentsEd .entete .echec p::before{ content: "*  ";  color: rgb(100,0,0);}


@media only screen and (max-width: 800px) {
	.commentsEd { margin-left: -360px;  width: 690px;}
	.commentsEd .entete .title { padding-left: 5px;  width: 77%;  font-size: 27px;}
	.commentsEd .entete .envoyer { width: 150px;}
	.commentsEd .entete .envoyer input[type="submit"] { font-size: 22px;}
	.commentsEd .entete .echec p { margin: 15px 0 0 15px;  color: rgb(152,25,25);  font-weight: bold;  font-size: 15px;}
}


/*  --------------------------------------Édition des cellules de la VAC-------------------------------------------- */


.journeeEd { top: 25%;  margin-left: -288px;  padding: 0 15px 25px 15px;  width: 546px;  min-height: 170px;  overflow: auto;}
.journeeEd #journeeEd_opt { text-align: center;}
.journeeEd #journeeEd_opt .title0 { margin: 20px 15px 20px 15px;  font-family: Republica;  font-size: 24px;  color: rgb(69,56,99);  text-shadow: 1px 1px 1px rgb(205,234,237);}
.journeeEd #journeeEd_opt .title0 span { display: block;  margin-top: 15px;  font-size: 15px;  color: rgb(105,138,185);}

.journeeEd form { position: relative;  text-align: left;}
.journeeEd input[type="text"] { font-family: arial, sans-serif;  color: rgb(80,80,80);  background-color: rgb(228,225,230);}
.journeeEd .entete { padding: 25px 0 10px 0;  width: 100%;}
.journeeEd .entete p { display: inline-block;  vertical-align: middle;}
.journeeEd .entete .title { width: 390px;  font-family: Republica;  font-size: 26px;  color: rgb(69,56,99);}
.journeeEd .entete .envoyer { width: 150px;}
.journeeEd .entete .envoyer input[type="submit"] { display: block;  width: 100%;  height: 45px;  font-family: Lato, sans-serif;  font-size: 20px;  font-weight: bold;  color: rgb(251,244,255);  line-height: 45px;  border-radius: 25px;  background-color: rgba(115,57,195,0.8);  border: none;  box-shadow: none;  box-sizing: inherit;  cursor: pointer;  transition: background-color 0.2s, color 0.2s;}
.journeeEd .entete .envoyer input[type="submit"]:hover { background-color: rgba(240,232,255,0.8);  color: rgb(83,32,152);}
.journeeEd .textArea { padding: 20px 0 15px 0;}
.journeeEd .textArea #journeeEd_opt .option { display: inline-block;  margin: 0 15px 20px 15px;  padding: 5px;  width: 155px;  font-size: 13px;  color: rgb(64,69,97);  text-align: center;  font-weight: bold;  cursor: pointer;  border-radius: 8px;  background-color: rgb(212,208,228);}
.journeeEd .textArea #journeeEd_opt .option:hover { background-color: rgb(250,250,250);}
.journeeEd .textArea #journeeEd_opt .option.select { color: rgb(123,19,19);  box-shadow: inset 1px 1px 2px rgb(66,14,14);  background-color: rgb(255,255,255);  background: linear-gradient(to bottom right, white, rgb(235,230,245));}
.journeeEd .textArea fieldset { margin: 0 10px;  border-radius: 8px;  border: 2px solid rgb(127,111,165);  background-color: rgb(212,208,228);}
.journeeEd .textArea fieldset legend { display: block;  margin-left: 15px;  padding: 0 5px;  font-family: arial, sans-serif;  font-size: 17px;  font-weight: bold;  color: rgb(105,138,185);}
.journeeEd .textArea .field_content { display: flex;  padding: 10px 15px;  min-height: 75px;  justify-content: center;  align-items: center;  box-sizing: border-box;}
.journeeEd .textArea .field_content .p_area, .journeeEd .textArea .field_content .infos_area, .journeeEd .textArea .field_content .periode_area, .journeeEd .textArea .field_content .ro_area { font-size: 15px;  color: rgb(60,60,60);  text-align: center;}
.journeeEd .textArea .field_content .infos_area, .journeeEd .textArea .field_content .periode_area { width: 60%;}
.journeeEd .textArea .field_content .infos_area strong { padding: 0 10px;}
.journeeEd .textArea .field_content .periode_area input[type="text"] { margin: 0 10px;  padding: 2px;  width: 60px;  height: 15px;  font-size: 12px;  border: 1px solid rgb(204,204,204);}
.journeeEd .textArea .field_content .periode_area input[type="text"]:focus { box-shadow: 0 0 3px rgb(11,62,198);  background-color: rgb(245,241,247);}
.journeeEd .textArea .field_content .periode_area input[type="text"].inputerreur { border: 1px solid rgb(190,0,0); box-shadow: 0 0 4px rgb(198,11,11);  background-color: rgb(255,210,210);}
.journeeEd .textArea .field_content .ro_area,  .journeeEd .textArea .field_content .p_area { display: flex;  margin: 0 15px;  justify-content: center;  align-items: center;  line-height: 0;}
.journeeEd .textArea .field_content .ro_area input { margin-left: 15px;}
.journeeEd .textArea .field_content .mce-container,.journeeEd .textArea .field_content .mce-container *,.journeeEd .textArea .field_content .mce-widget,.journeeEd .textArea .field_content .mce-widget *,.journeeEd .textArea .field_content .mce-reset { height: 18px;}
.journeeEd .textArea .field_content .mce-tinymce { margin-left: 15px;  border: 1px solid rgb(204,204,204);}
.journeeEd .textArea .field_content .mce-last { border: none;}


.journeeEd .entete .title .icon-refus { margin-left: 20px;  font-size: 30px;  color: rgb(152,25,25);}
.journeeEd .entete .echec p { display: block;  margin: 10px 0 0 12px;  color: rgb(152,25,25);  font-weight: bold;  font-size: 14px;}
.journeeEd .entete .echec p strong { color: rgb(100,0,0);}
.journeeEd .entete .echec p::before{ content: "*  ";  color: rgb(100,0,0);}


@media only screen and (max-width: 800px) {
	.journeeEd { margin-left: -315px;  width: 600px;}
	.journeeEd input[type="text"] { font-size: 13px;}
	.journeeEd .entete .title { width: 74%;  font-size: 27px;}
	.journeeEd .entete .envoyer { width: 130px;}
	.journeeEd .entete .envoyer input[type="submit"] { font-size: 22px;}
	.journeeEd .textArea #journeeEd_opt .option { padding: 10px;  width: 170px;}
	.journeeEd .textArea #journeeEd_opt .option:hover { }
	.journeeEd .textArea #journeeEd_opt .option.select {}
	.journeeEd .textArea fieldset { border-radius: 10px;}
	.journeeEd .textArea fieldset legend { margin-left: 20px;  font-size: 18px;}
	.journeeEd .textArea .field_content .p_area, .journeeEd .textArea .field_content .infos_area, .journeeEd .textArea .field_content .periode_area, .journeeEd .textArea .field_content .ro_area{ font-size: 17px;}
	.journeeEd .textArea .field_content .periode_area input[type="text"] { width: 75px;  height: 25px;  font-size: 12px;}
	.journeeEd .textArea .field_content .mce-container,.journeeEd .textArea .field_content .mce-container *,.journeeEd .textArea .field_content .mce-widget,.journeeEd .textArea .field_content .mce-widget *,.journeeEd .textArea .field_content .mce-reset { height: 25px;  font-size: 16px}
	#editor2 p { font-size: 14px;}
}


/*  -----------------------------------------Résultat de l'édition----------------------------------------------- */


.resultatEd 	{ top: 35%;  margin-left: -262px;  padding: 35px 20px;  width: 520px;  background-color: rgb(244,241,255);}
.resultatEd p { font-family: Lato;  font-size: 25px;  font-weight: bold;  text-align: center;  color: rgb(90,90,90);}
.resultatEd p.icon-valide::before { margin-right: 20px;  font-size: 28px;  color: rgb(14,138,14);}