/* CSS Document */
@import "font-awesome.min.css";

* {margin: 0;padding: 0;font-family:Tahoma;font-size:1vw;}
HTML, BODY {height:100%;min-height:100%;position:relative; background:#f7f7f7;}
A {text-decoration:none;}
INPUT,SELECT,TEXTAREA {outline: 0; background:white; border: 1px solid #666;}
.clear {clear: both; display:block;}
.error {border: 1px solid red !important; background:#FCC !important;}
.error_info {color:red; font-size:0.5vw; width:auto !important; min-height:0 !important; border:0 !important; float:none !important; background:transparent !important; margin: 0 !important; padding:0 0 0 0.5vw !important; display: inline-block !important;}
.green {color:#3C0 !important;}
.red {color:red !important;}
.cobl {border: 1px solid grey; border-left: 5px solid salmon !important;}
.cformat {border: 1px solid grey; border-left: 5px solid #ffea84 !important;}
INPUT[type='text'].cobl {padding-left: 1px;}
INPUT[type='text']:read-only,select.read-only,select:disabled,TEXTAREA:read-only {
  background-color: #f0f0f0; /* Couleur de fond pour les champs readonly */
  color: #666666; /* Couleur du texte pour les champs readonly */
  border: 1px solid #cccccc; /* Bordure */
  cursor: not-allowed; /* Indique que le champ ne peut pas être modifié */
}


DEBUG {position:absolute; width:25%; left:50%; color:#0F0; z-index:2000; top:0; height: 2vw; line-height: 2vw;}

.diverreur {position:absolute; width:90%; padding:1vw; background:#FCC; border:2px solid red; left:5%;top:10%;}
.divwarning {position:absolute; width:90%; padding:1vw; background:#f7d576; border:2px solid #c64c00; left:5%;top:10%;}
.divwarning INPUT {padding:1vw;background:white;border:1px solid black;}

.warning_ie {display:none;width:100%;height:5rem;font-size:1rem; line-height:5rem; background:#003;border-bottom 1px black; color:red; font-weight:bold; text-align:center;position:absolute;bottom:0; z-index:20;}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {.warning_ie {display:block;}}
:root .warning_ie {display:block \0/IE9; }
.est_ie {display:none;}
.est_ie P {text-align:center;margin-top:20%;}
/*@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {.est_ie {display:block;}.pas_ie {display:none;}}*/
:root .est_ie {display:block\9;} :root .pas_ie {display:none\9;} /*IE 9/10*/

.bouton {border:1px solid black; background:white; padding:0.2vw 0.5vw;}

/* ############################################################ CONNEXION ############################################*/
#connexion { width:50%; min-height:30%; border:1px solid black; border-radius:0.5vw; box-shadow: 10px 5px 5px grey; background:white;position:absolute;top:30%;left:25%; padding-top:2%; padding-bottom:2%; text-align:center;}
#connexion LABEL {display:inline-block; min-width:20%;}
#connexion INPUT {border: 1px solid #348dc8; border-radius:0.8vw; padding-left:1vw;}
#connexion INPUT[type='submit'],#connexion INPUT[type='button'] {padding:0.5vw 1vw; border: 1px solid #348dc8; margin-right:1%;border-radius:0.8vw;}
#connexion P {margin-top:0.5vw;color:red;}

/* ############################################################ COOKIE ############################################*/
.txt_cookie {position: fixed; left: 0px; width:calc(100% - 1vw); z-index: 2147483647; background:#645862; color:white; line-height: 1.5vw; padding: 0.5vw; font-size: 1vw; bottom: 0;}
.txt_cookie BUTTON {float: right; display: block; padding: 5px 8px; min-width: 100px; margin-left: 5px; border-radius: 5px; cursor: pointer; color: #FFFFFF; background: rgb(241, 214, 0); border:0; text-align: center;}
.txt_cookie BUTTON:hover {color:black;}

/* ############################################################ CHECKBOX ############################################*/
.check_beau { -webkit-appearance: none; -moz-appearance: none; -ms-appearance: none; -o-appearance: none; appearance: none; position: relative; top: 0; right: 0; bottom: 0; left: 0; height: 2vw; width: 2vw !important; transition: all 0.15s ease-out 0s; background: #cbd1d8; border: none; color: #fff; cursor: pointer; display: inline-block; margin-right: 0rem; outline: none; position: relative; z-index: 10;}
.check_beau:hover {background: #9faab7;}
.check_beau:checked { background: #40e0d0;}
.check_beau:checked::before { height: 2vw; width: 2vw !important; position: absolute; content: '✔'; display: inline-block; font-size: 26.66667px; text-align: center; line-height: 2vw;}

.check_beau.reduit  {height: 1vw !important; width: 1vw !important;}
.check_beau.reduit:checked::before { height: 1vw !important; width: 1vw !important; line-height: 1vw !important; font-size: 0.7vw !important;}
.check_beau.check_red  {background:#900;}
.check_beau.check_red:checked  {background: #F30;}
.check_beau.check_ciel  {background:#9CC;}
.check_beau.check_ciel:checked  {background: #40e0d0;}

/* ############################################################ RADIOBOX ############################################*/
.radio_beau { display: none;}
.radio_beau + label { position: relative; padding-left: 1.3rem;}
.radio_beau + label::before,
.radio_beau + label::after { display: block; position: absolute; box-sizing: border-box; bottom: 0; left: 0; content:''; width: 1rem; height: 1rem;  border-radius: 1rem;}
.radio_beau + label::before { border: 1px solid #00B7E8; background-color: #eee;}
.radio_beau:checked + label::after { background-color: #00B7E8;}



/* ############################################################ HEADER ############################################*/
HEADER {
position: relative;
width: 100%;
margin: 0;
height: 2vw;
z-index: 100;
line-height:2vw;
background-color: rgb(51, 51, 51);
background-image: url('../IMAGES/etrace-logo.png');
background-repeat: no-repeat;
background-position: 0.8vw; 0.3vw;	
background-size:7%;
}
HEADER.fixe {position:fixed !important;}

HEADER UL {float:left;height:100%;color:white;display:block;width:55%;padding-left:10%;list-style: none; overflow: hidden; z-index:1000;}
HEADER UL LI {float: left; position:relative; padding-left:1.8vw;}
HEADER UL LI A::after,HEADER UL LI FONT::after { 
  content: " "; 
  display:block;
  z-index:2;
  position:absolute;
  top:0;
  left:100%;
  border-top: 1vw solid transparent; /* Go big on the size, and let overflow hide */
  border-bottom: 1vw solid transparent;
  border-left: 1vw solid #333333;
}
HEADER UL LI A::before,HEADER UL LI FONT::before { 
  content: " "; 
  display: block; 
  width: 0; 
  height: 0;
  border-top: 1vw solid transparent;       
  border-bottom: 1vw solid transparent;
  border-left: 1.2vw solid white;
  position: absolute;
  top:0;
  margin-left: 1px;
  left: 100%;
  z-index: 1; 
}
HEADER UL LI:nth-child(1) A::before       { background:#515050; }
HEADER UL LI:nth-child(2)       { background:#515050; }
HEADER UL LI:nth-child(2) A::after       { border-left:1vw solid #515050; }
HEADER UL LI:nth-child(3)       { background:#6d6c6c; }
HEADER UL LI:nth-child(3) A::after       { border-left:1vw solid #6d6c6c; }
HEADER UL LI:nth-child(2) FONT::after       {border-left:1vw solid #515050; }
HEADER UL LI:nth-child(3) FONT::after       {border-left:1vw solid #6d6c6c; }
HEADER UL LI:nth-child(4)       { background:#777; }
HEADER UL LI:nth-child(4) FONT::after       {border-left:1vw solid #777; }


HEADER P {float:left;height:100%;color:white; width:calc(20% - 4vw);}
HEADER A {color:white;}
HEADER > A {text-align:center; display:block; cursor: pointer; float:right;}
HEADER A:hover {background: -webkit-linear-gradient(#F7F7F7, red); 
background-clip: border-box;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;}

HEADER > A O {height:calc(100% - 0.3vw); width:2vw; display:block; color: #F7F7F7; font-size:1.3vw !important;border-right: none;border-left: 2px solid #757474;padding-top: 0.3vw;padding-bottom: 0.3vw;
background: -webkit-linear-gradient(#F7F7F7, #A6A6A6); 
background-clip: border-box;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;}
HEADER > A:hover O {background: -webkit-linear-gradient(#F7F7F7, red); 
background-clip: border-box;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;}

HEADER SELECT {max-width:10vw;}
HEADER .lang {margin-top:0.4vw;float:left; margin-right:0.4vw; width:1.3vw;}
HEADER #noel {display:none;}
HEADER .halloween {display:none;position:absolute;left:0; height:2vw;left:9rem;}


/* ############################################################ MODULES ############################################*/
MODULES {background:#EFEFEF url('../IMAGES/fond.jpg') center no-repeat; background-size:70%; width:60%; min-height:calc(87% - 3vw); display:block; left:15%; position:relative; border-left :3px solid #D3D3D3; border-right :3px solid #D3D3D3; padding:5%; padding-top:1%;}
MODULES UL {margin-top:5%;}
MODULES UL LI, .module_li {width:10vw;height:10vw;box-shadow: 1px 1px 12px #555;border:1px solid transparent; cursor:pointer; list-style:none; float:left; margin-left:1.5vw; margin-top:0.8vw; margin-bottom:0.8vw; background-repeat:no-repeat !important; background-position:center !important; background-size:70% !important;}
MODULES UL LI A {color:white;line-height:18vw; padding-left:0.5vw;}
.module_li SPAN {color:white;line-height:18vw;}
MODULES UL LI:hover, .module_li:hover {box-shadow: 1px 1px 12px red;border:1px solid black;}
.sortable {width:100%;}
.sortable A {color:white;}
.sortable A:hover {color:#3F0;}
.module_li SPAN:hover {color:red;}
.portlet-placeholder { border: 1px dotted black; margin: 0 1em 1em 0; width: 10vw;height: 10vw;float:left;list-style: none;margin-left: 1.5vw;margin-top: 0.8vw;margin-bottom: 0.8vw; }

/* ############################################################ TABLES ############################################*/
PAGE {background:#EFEFEF url('../IMAGES/fond.jpg') center no-repeat;  text-align:center; background-size:50%; width:calc(96% - 6px); min-height:calc(98% - 2vw); display:block; left:1%; position:relative; border-left :3px solid #D3D3D3; border-right :3px solid #D3D3D3; padding:1%; padding-top:1%; padding-bottom:0;}
PAGE.fixe {padding-top:3% !important;}

PAGE H2 {wdidth:100%;height:2vw; background:#CEF4FF; line-height:2vw; text-align:left; padding-left:1vw; margin-bottom:2%; border: 1px solid #348dc8; font-size:1vw; text-transform:uppercase;}
PAGE H2 O {float:right; margin-right:1vw; margin-top:0.5vw; font-size:1.5vw; color:black;}
PAGE H2 O:hover {background: -webkit-linear-gradient(#F7F7F7, red); 
background-clip: border-box;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;}

#VERSION {/*position:absolute;*/bottom:0; text-align:center;width:100%;display:inline-block; font-size:0.7vw;}
#VERSION A {font-size:0.7vw; color:black;}
#VERSION A:hover { text-decoration:underline;}

.datagrid {border-collapse: collapse; border: 1px solid #CCB; width: 100%; position:relative; margin:auto; margin-bottom:5%; }
.datagrid.enteteblock THEAD {z-index:1001 !important;}
.datagrid TR { border-bottom: 1px solid black;}
.datagrid TH { color: #348dc8; background: #ffffff; /*cursor:pointer;*/ border: 1px solid #ffffff; border-bottom: 3px solid #348dc8; text-align: center; padding: 0.5vw 1vw; font-style: italic; font-size: 0.7vw;}
.datagrid TH.criteres { white-space:normal; text-align:left;}
.datagrid .barre { border-right: 1px solid black;}
.datagrid TH DIV { font-size: 0.7vw;}
.datagrid TBODY TR { background-color: white;}
.datagrid TBODY TR:nth-child(2n+1) { background-color: rgb(221, 221, 221);}
.datagrid TABLE TBODY TR:nth-child(2n+1) { background-color:#999;}
.datagrid TD {padding: 0.2vw; border: 1px solid #E0E0E0; font-size:0.6vw; }
.datagrid TD.cen {text-align:center;}
.datagrid TD.c_b,.formview TD.c_b {text-align:center; font-weight:bold;}
.datagrid TD.btn {width:1vw;}
.datagrid TD B {font-size:0.7vw;color: #348dc8;}
.datagrid TH A,.datagrid TD A {color:black; padding-left:0.5vw; position:relative; cursor:pointer;}
.datagrid TH.btn A,.datagrid TD.btn A {padding-left:0;}
.datagrid TH A:hover,.datagrid TD A:hover {background: -webkit-linear-gradient(#F7F7F7, red); 
background-clip: border-box;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;}
.datagrid TH BUTTON.fa {float:left;margin-left:1vw;background:transparent;border:0;color:#348dc8; cursor:pointer; font-size:1vw;}
.datagrid .fa-circle-o {font-size:1.4vw;}
.datagrid TD A {font-size:1vw;}
.datagrid TD A.petit {font-size:0.6vw;}
.datagrid TD A P {color:red; position:absolute; top:2%; margin:auto; width:100%; text-align:center; font-size:0.7vw; left:2%;display:block; font-weight:bold;}
.datagrid TFOOT TD {background:white;}
.datagrid TFOOT TD * {font-size:0.8vw;}
.datagrid TFOOT TD SELECT {float:right;}
.tablesorter-pager.disabled {display: none;}
.tablesorter-pager .disabled { opacity: 0.5; filter: alpha(opacity=50);cursor: default;}
.tablesorter-pager img { vertical-align: middle; margin-right: 2px; cursor: pointer;}
.tablesorter-pager .pagedisplay { padding: 0 5px 0 5px; width: 50px; text-align: center;}
.vertical {writing-mode: vertical-rl;text-orientation: upright; font-weight:none;font-size: 0.7vw;margin: auto; width: 1vw;}
.datagrid TH INPUT[type='submit'] {padding:0.2vw 1vw; border: 1px solid #348dc8; margin-right:1%;}
.datagrid .critere_recherche {border:#039 1px solid; cursor:pointer; background:#EAF5FF; border-radius:0.5vw; display:inline-block; padding:0.2vw; margin-top:0.5vw;}
.datagrid .critere_recherche:hover {border:1px solid #090; background:#E1FFE9;}
.datagrid .critere_recherche A { cursor:pointer; position:relative; z-index:3; color:#348dc8; }
.datagrid .critere_recherche A:hover { color:red;}

.datagrid .tabint LABEL {width:20%; display:inline-block; font-size:0.8vw;}
.datagrid .tabint INPUT[type='text'] {font-size:0.8vw; width:3vw; text-align:center;}


.formview {border: 2px solid #CCB; width: 50%; min-height:calc(96vh - 2vw); margin-top:calc(-1% - 2px) !important; border-top:0; border-bottom:0; padding-top:2%; position:relative; margin:auto; background-color: white;}
.formview H1 {margin-top:-2%; margin-bottom:2%;}
.formview TABLE {border-collapse: collapse; width: 100%; position:relative; margin:auto; margin-bottom:3%;}
.formview TBODY TR {height:1vw;}
.formview TD {padding: 5px; border: 1px solid #348dc8; border-right:0; border-left:0; font-size:0.7vw;font-weight:bold;}
.formview TD.center { text-align:center;}
.formview TD.h1 { font-size:1.2rem; }
.formview .trumbowyg-box > * {font-weight:normal; font-size:initial;}
.formview .trumbowyg-box PAGE {width:auto;background:transparent;text-align:initial;min-height:auto;display:initial;border:0;padding:0;left:0;}
.formview TD:first-child {min-width:20%;}
.formview TD INPUT[type='text'],.formview TD INPUT[type='password'],.formview TD SELECT,.formview TD TEXTAREA {width:100%;}
.formview INPUT[type='button'] {float:left; padding:0.5vw 1vw; border: 1px solid #348dc8; margin-left:1%;}
.formview INPUT[type='submit'],.subformview {float:right; padding:0.5vw 1vw; border: 1px solid #348dc8; margin-right:1%;}
.formview INPUT[type='text'].spie_couleur {display:inline-block !important; position: absolute; left:4vw; width: 5vw; top:0.4vw;}

.formview .gal_image {background-size:100% !important; cursor:pointer; width:2vw; height:2vw; border:1px solid black; float:left;margin-left:0.5vw;margin-bottom:0.5vw;}
.formview .gal_image:hover {border-color:red;}

.trumbowyg-box TABLE TD {border:1px dashed black !important; font-weight:initial !important; font-size:initial !important;}
.trumbowyg-dropdown-table TD {width:1vw !important; min-width:inherit !important; height:1vw !important; border:1px solid black;}


.formview H2 {wdidth:100%;height:2vw; margin-top:4%; background:#CEF4FF; line-height:2vw; text-align:left; padding-left:1vw; margin-bottom:2%; border:0; border-top: 3px solid #EFEFEF; border-bottom: 3px solid #EFEFEF; font-size:1vw; text-transform:uppercase;}
.formview H2 O {cursor:pointer;}

.retour {float:left; padding:0.5vw 1vw; border: 1px solid #348dc8; margin-left:1%; background:white;}

.zone_blanche {width:100%; background:white;border-top: 3px solid #D3D3D3;border-bottom: 3px solid #D3D3D3; padding-top:0.5vw; padding-bottom:0.5vw;}
.zone_blanche INPUT[type='submit'] { padding:0.5vw 1vw; border: 1px solid #348dc8; margin-right:1%;}


.interface_client TD:first-child {width:30%;}

.pleine_page {border: 2px solid #CCB; width: calc(100% - 4px); text-align:left; min-height:calc(96vh - 2vw); margin-top:calc(-1% -2px) !important; border-top:0; border-bottom:0; position:relative; margin:auto; background-color: white;}
.pleine_page ZONE {display:none;}
.pleine_page H3 {wdidth:100%;height:2vw; background:#CEF4FF; line-height:2vw; text-align:left; padding-left:1vw; margin-top:1%; margin-bottom:1%; border: 1px solid #348dc8; border-left:0; border-right:0; font-size:1vw; text-transform:uppercase;}
.pleine_page H3 O { float:right; margin-right:1vw; margin-top:0.5vw; cursor:pointer;}
.pleine_page H4 { color:#999; font-size:1.2vw; font-family:Arial; margin-top:0.8vw; margin-bottom:0.8vw; padding-left:2%; }
.pleine_page UL { margin-left:3vw; padding-left:2%; }
.pleine_page UL LI { font-family:Arial;}


/* ############################################################ MODAL ############################################*/

.jquery-modal H1 {wdidth:100%;height:2vw; margin-top:4%; background:#FFE; line-height:2vw; text-align:left; padding-left:1vw; margin-bottom:2%; border:0; border-top: 3px solid #EFEFEF; border-bottom: 3px solid #EFEFEF; font-size:1vw; text-transform:uppercase;}
.jquery-modal TABLE {border-collapse: collapse; border: 1px solid #CCB; width: 100%; position:relative; margin:auto; margin-bottom:5%;}
.jquery-modal TABLE TR { border-bottom: 1px solid black;}
.jquery-modal TABLE TH { color: #348dc8; background: #ffffff; border: 1px solid #ffffff; border-bottom: 3px solid #348dc8; text-align: center; padding: 0.5vw 1vw;white-space: nowrap; font-style: italic; font-size: 0.7vw;}
.jquery-modal TABLE TH DIV { font-size: 0.7vw;}
.jquery-modal TABLE TBODY TR { background-color: white;}
.jquery-modal TABLE TBODY TR:nth-child(2n+1) { background-color: rgb(221, 221, 221);}
.jquery-modal TABLE TD {padding: 0.3vw; border: 1px solid #E0E0E0; font-size:0.6vw;}
.jquery-modal TABLE TD.cen {text-align:center;}
.jquery-modal TABLE TD.c_b {text-align:center; font-weight:bold;}
.jquery-modal TABLE TD.btn {width:1vw;}

.form_migration INPUT {width:100%;font-size:0.7vw;}
.form_migration TABLE TD:nth-child(1) {width:30%;}
.form_migration TABLE TD:nth-child(2) {width:70%; position:relative;}
.form_migration TABLE TD INPUT {width:100%;}
.form_migration TABLE TD SELECT {width:100%; font-size:0.7vw;}
.form_migration TABLE TD TEXTAREA {width:100%; height:8vw; font-size:0.7vw;}

/* ############################################################ SPECIFIQUE ############################################*/

.livraison_status { list-style:none;}
.livraison_status LI {float:left; margin-bottom:1%; }
.livraison_status LI A {width: 8vw; height: 2.3vw;line-height:1.5vw; text-align:right; font-size:1.5vw; background-repeat:no-repeat !important; background-position: 0.3vw 0.7vw !important; background-size:30% !important; color: white;padding: 0.8vw 1vw 0.8vw 0.5vw; border-radius: 4px;display: block; margin-right:0.5vw;}
.livraison_status LI A FONT {font-size:0.7vw;}
.livraison_status LI A SPAN {font-size:1.5vw;}
.livraison_status LI A:hover {-moz-box-shadow: 0px 0px 15px 0px #656565;
-webkit-box-shadow: 0px 0px 15px 0px #656565;
-o-box-shadow: 0px 0px 15px 0px #656565;
box-shadow: 0px 0px 15px 0px #656565;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#656565, Direction=NaN, Strength=15);}
.livraison_status LI A.actif {border:1px solid #667cff; height: calc(2.3vw - 2px);
-moz-box-shadow: 0px 0px 15px 0px #667cff;
-webkit-box-shadow: 0px 0px 15px 0px #667cff;
-o-box-shadow: 0px 0px 15px 0px #667cff;
box-shadow: 0px 0px 15px 0px #667cff;
filter:progid:DXImageTransform.Microsoft.Shadow(color=#667cff, Direction=NaN, Strength=15);}

.livraison_sens {float:right;}
.livraison_sens * {color:#686868 !important;}

.cacheur {position:absolute;background:#EFEFEF url('../IMAGES/fond.jpg') center no-repeat; text-align:center; background-size:50%; width:calc(94% - 6px);  min-height:calc(100% - 2vw); display:block; left:2%; z-index:2; border-left :3px solid #D3D3D3; border-right :3px solid #D3D3D3; padding:1%; padding-top:1%;}

.livraison_suivi {border-radius:0.5vw; background:white;position:relative;left:5%;border :2px solid #D3D3D3; top:48px; width:90%; padding:1rem; }
.livraison_suivi INPUT[type='button'] {float:left; padding:0.5vw 1vw; border: 1px solid #348dc8; margin-left:30px;}
.livraison_suivi INPUT[type='submit'] {float:right; padding:0.5vw 1vw; border: 1px solid #348dc8; margin-right:30px;}
.livraison_suivi BUTTON {float:right; padding:0.5vw 1vw; border: 1px solid #348dc8; margin-right:1%;}
.livraison_suivi .close {position:absolute; right:1vw; top:1vw; cursor:pointer;}
.livraison_suivi .close:hover {background: -webkit-linear-gradient(#F7F7F7, red);} 

.onglet_workflow {position:absolute;left: 9%; z-index:2;}
.onglet_workflow.fixe {margin-top:3% !important;}
.onglet_workflow LI {min-width:170px;height:56px;background:white;border-radius:1rem 1rem 0 0; border-bottom:0; list-style:none;top:10px;float:left;position:relative;}
.onglet_workflow LI.inactif {height:39px;}
.onglet_workflow LI DIV {width:calc(100% - 38px);height:100%;left:19px;background-image:url(../IMAGES/ONGLETS/centre.png);position:absolute;}
.onglet_workflow LI A {width:100%;height:100%;display:block; color:black; position:relative; line-height:49px;}
.onglet_workflow LI A::before {content: ''; width:19px; height:100%;background-image:url(../IMAGES/ONGLETS/gauche.png); position:absolute;top:0px;left:0;}
.onglet_workflow LI A::after {content: ''; width:19px; height:100%; background-image:url(../IMAGES/ONGLETS/droite.png); position:absolute;top:0px;right:0;}
.onglet_workflow LI.inactif A {color:#666 !important;}


.livraison_workflow {border-radius:0.5vw; background:white;position:relative;left:5%;border :2px solid #D3D3D3; top:48px; width:90%; padding-bottom:2rem; margin-bottom:5rem; text-align:left;}
.livraison_workflow.fixe {margin-top:3% !important;}
.livraison_workflow::after {content: ''; width:calc(100% - 38px); left:19px; height:18px; background-image:url(../IMAGES/ONGLETS/bas.png); position:absolute;bottom:0px;}
.livraison_workflow > DIV {width:calc(100% - 69px); min-height:10rem; margin-bottom:0.5rem; position:relative; padding-top:50px; padding-left:25px; padding-right:25px;}
.livraison_workflow > DIV.inactif {display:none;}
.livraison_workflow > DIV::before {content: ''; width:100%; height:18px; background-image:url(../IMAGES/ONGLETS/haut.png); position:absolute;top:1px;left:0;}
.livraison_workflow GAUCHE {width:19px; height:calc(100% - 38px); display:block; position:absolute; top:19px; left:0; z-index:5; }
.livraison_workflow GAUCHE::before {content: ''; width:19px; height:19px; display:block; position:absolute; top:-18px; right:0; background: url(../IMAGES/ONGLETS/lgh.png); }
.livraison_workflow GAUCHE::after {content: ''; width:19px; height:19px; display:block; position:absolute; bottom:-19px; right:0; background: url(../IMAGES/ONGLETS/lgb.png); }
.livraison_workflow DROITE {width:19px; height:calc(100% - 38px); display:block; position:absolute; top:19px; right:0; z-index:5; }
.livraison_workflow DROITE::before {content: ''; width:19px; height:19px; display:block; position:absolute; top:-18px; right:0; background: url(../IMAGES/ONGLETS/ldh.png); }
.livraison_workflow DROITE::after {content: ''; width:19px; height:19px; display:block; position:absolute; bottom:-19px; right:0; background: url(../IMAGES/ONGLETS/ldb.png); }
.livraison_workflow .close {position:absolute; right:1vw; top:1vw; cursor:pointer;}
.livraison_workflow .close:hover {background: -webkit-linear-gradient(#F7F7F7, red); 
background-clip: border-box;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;}
.livraison_workflow .etapes > DIV {width:6vw;height:6vw; border :1px solid white; float:left; margin-right:2%;}
.livraison_workflow .resume {float:left;border-radius:0.5vw; width:85%; height:4.5vw; background:#F7F7F7; border :1px solid #D3D3D3; padding:1vw; margin-bottom:2%; position:relative;}
.livraison_workflow .bloc {border-radius:0.5vw; display:block; width:95%; min-height:4.5vw; background:#fcfcfc; border :1px solid #D3D3D3; padding:1vw; margin-bottom:2%; position:relative;}
/*.livraison_workflow .bloc P {width:calc(92% - 6vw);min-height:5vw; border :1px solid #D3D3D3; float:left; background:#fcfcfc; margin-right:2%; padding:0.5vw; }
.livraison_workflow UL { list-style:none;}
.livraison_workflow UL LI {border-radius:0.5vw; width:97%; background:#F7F7F7; border :1px solid #D3D3D3; padding:1vw; margin-bottom:2%; position:relative;}
.livraison_workflow UL LI INPUT[type='radio'] {float:left; margin-top:3.5%;}
.livraison_workflow UL LI INPUT[type='text'] {width:80%;}*/
.livraison_workflow INPUT[type='button'] {float:left; padding:0.5vw 1vw; border: 1px solid #348dc8; margin-left:30px;}
.livraison_workflow INPUT[type='submit'] {float:right; padding:0.5vw 1vw; border: 1px solid #348dc8; margin-right:30px;}
.livraison_workflow BUTTON {float:right; padding:0.5vw 1vw; border: 1px solid #348dc8; margin-right:1%;}
/*.livraison_workflow UL LI LABEL {display:inline-block; min-width:20%;}*/

.livraison_workflow .bloc .tabform {width:100%; border-spacing :0.5vw;}
.livraison_workflow .bloc .tabform TR {margin-bottom:1.5vw;}
.livraison_workflow .bloc .tabform TD:first-child() {width:40%;}
.livraison_workflow .bloc .tabform TD * {width:100%;}


.livraison_workflow #signatureparent {float:none; display:inline-block; width:70%; background:white; height:auto;}
.livraison_workflow #signatureparent DIV {float:none; border:0; width:auto; height:auto;}
.livraison_workflow IMG#i {float:none; border:0; width:auto; height:auto; background:white;}
#signatureparent CANVAS {height:inherit !important; min-height:20rem !important; border: 1px solid black !important;}


.livraison_workflow LI INPUT[type='radio']{ position: absolute;visibility: hidden;}
.livraison_workflow .check {
display: block;
position: absolute;
border: 0.3vw solid #AAAAAA;
border-radius: 100%;
height: 1.5vw;
width: 1.5vw;
margin-top: 3%;
right: 0;
z-index: 5; cursor:pointer;
}
.livraison_workflow .check:hover {/*border: 5px solid #f19200;*/}
.livraison_workflow LI INPUT[type='radio']:checked ~ .check { /*border: 5px solid #0DFF92;*/background: #0DFF92;}
.livraison_workflow LI INPUT[type='radio']:checked ~ .check::before{background: #0DFF92;}
.livraison_workflow .check::before {
  display: block;
  position: absolute;
	content: '';
  border-radius: 100%;
  height: 1vw;
  width: 1vw;
  top: 0.25vw;
	left: 0.25vw;
  margin: auto;
	transition: background 0.25s linear;
	-webkit-transition: background 0.25s linear;
}

.livraison_workflow #soustexte * {border:0 !important; height:auto !important; min-height:0 !important;}

.livraison_workflow .TAB_ENCOURS {width:100%;}
.livraison_workflow .TAB_ENCOURS TH {border:1px solid grey; font-weight:bold;}
.livraison_workflow .TAB_ENCOURS TD {border:1px solid grey; text-align:center; font-size:0.8rem;}

.livraison_onglet {width:32% !important;color:grey;height:3rem !important; position:absolute; border:1px solid #D3D3D3 !important;bottom:-5rem; line-height:3rem; text-align:center;font-size:2rem; background:white; border-radius:0.5rem 0.5rem 0 0;}
.livraison_onglet.actif {color:black; background:#FC9;}
.livraison_zone_pv {margin-top:5rem;}

.notecovea {background:white; padding:1rem; border:1px solid black; padding-bottom:0.5rem; padding-top:0.5rem;}



.progressBarContainer {width: 90%; height: 1vw; margin:auto; background: rgba(8,102,220,.2); overflow: hidden; border-radius: 5px;}
.progressBarValue {height:100%;float: left;background: rgba(8,102,220,.75); text-align:center; font-size:0.7vw; font-weight:bold;color:white; line-height:1vw;}

.migration_cre {height:2w; padding-left:0.5vw; padding-right:0.5vw; border:1px solid #036; border-radius:0.5vw; color:white; float:left;margin-left:0.5vw; font-size:0.7vw;}
.migration_cre:hover {background:#F90 !important; cursor:pointer;}


.tache_workflow {border-radius:0.5vw; background:white;width:88%;position:relative;left:5%;top:5%;border :2px solid #D3D3D3; padding:1%; text-align:left;}
.tache_workflow FORM.bloc, .tache_workflow .bloc {border-radius:0.5vw; width:97%; position:relative; background:#F7F7F7; border :1px solid #D3D3D3; padding:1vw; margin-bottom:2%; margin-top:2%;}
.tache_workflow INPUT[type='submit'] {float:right; padding:0.2vw 0.5vw; border: 1px solid #348dc8; margin-right:1%;}
.tache_workflow INPUT[type='button'],.tache_workflow INPUT.buton,.tache_workflow BUTTON {float:left; padding:0.5vw 1vw; border: 1px solid #348dc8; margin-left:1%;}


.jcrop-holder {margin:auto !important;}
.pv_menu {float:left;width:20%;}
.pv_menu SECTION {width:100%; border:1px solid black; padding:1%;background:white; }
.pv_pdf {float:left;width:75%; margin-left:2%; position:relative; height:85%; background:#CCC;}
.pv_menu INPUT[type='button'],.pv_menu INPUT[type='submit'] {padding:0.5vw 1vw; border: 1px solid #348dc8; margin-left:1%;}
.pv_pdf BUTTON {padding:0.1vw 1vw; border: 1px solid #348dc8; margin-left:1%;}
.pv_pdf #old_zone {position:absolute;z-index:5;width:100px; height:100px; margin:auto;}
.pv_pdf #old_zone DIV {position:absolute; display:none; border:1px dashed black; font-size:0.7vw; opacity:0.7; text-align:left;}

.signepv {float:none; display:inline-block; width:68%; background:white; border:1px solid black; min-height:6vw;}
.signepv DIV {float:none; border:0; width:auto; height:auto;}

.tab_stock .article {width:auto;border-right:2px solid grey !important;}
.tab_stock THEAD TH,.tab_stock TFOOT TH {border-right:1px dashed grey !important; border-left:0; width:4vw; padding:0.5vw 0.1vw; white-space:normal;}
.tab_stock THEAD TR:last-child TH:last-child, .tab_stock .agence, .tab_stock TD {border-right:2px solid grey !important; border-left:1px solid grey;}
.tab_stock TD A {padding:0; display:inline-block;width:100%;position:relative;}
.tab_stock TD B {font-size:1vw; display:inline-block;width:100%;position:relative;}
.tab_stock TD O {position:absolute;left:2px;font-size:0.8vw;top:0.2vw;}
.tab_stock TBODY TR:last-child TD {border:1px solid grey;}
.tab_stock TBODY:nth-child(2n+1) TR TD {background :white;}
.tab_stock TBODY:last-child TR TD { background:#FFC !important; border:2px solid grey !important; font-size:1.2rem !important;}
.tab_stock .sdetail TD { background:#edfcfc !important;}
.tab_stock TR.an {background:#fcfcab !important;border-bottom: 1px solid grey !important;border-top: 2px solid grey !important;}
.tab_stock TR.an TD {text-align:center !important; font-size:0.9vw !important; font-weight:bold !important;}
.tab_stock TR.an_st {background:#fcfccc !important;border-top: 2px solid grey;border-bottom: 2px solid grey !important;}
.tab_stock TR.an_st TD {border-bottom: 2px solid grey !important;}

.tab_stock TR.mois {border-bottom: 2px solid #d3d3d3 !important; background:#a9fcfc !important;border-top: 2px solid grey !important;}
.tab_stock TR.mois TD {text-align:center !important;}
.tab_stock TR.mois_st {background:#cffcfc !important;border-bottom: 2px solid grey !important;border-top: 2px solid grey;}
.tab_stock TR.mois_st TD {font-size:0.7vw !important;}

.tab_stock TR.jour {background:#adf7c7 !important;border-top: 2px solid grey !important;}
.tab_stock TR.jour TD {text-align:center !important;}
.tab_stock TR.jour_st {background:#cff9de !important;border-bottom: 2px solid grey !important;border-top: 1px solid grey !important;}
.tab_stock TR.jour_st TD {font-size:0.7vw !important;}

.tab_stock TR.trsep {background:white !important; border:1px solid transparent !important;}
.tab_stock TR.trsep TD {background:transparent !important; border:1px solid transparent !important; height:1.5vw;}


.erreur_stock {border-radius: 0.5vw; width: 97%; position: relative; background: #F7F7F7; border: 0.1vw solid #D3D3D3; border-top:0; padding: 1vw; padding-top:2vw; margin-bottom: 2%; margin-top: 2%;}
.erreur_stock H1 {border-radius: 0.5vw 0.5vw 0 0; width: calc(100% - 1.1vw); color:#C30; position: relative; background:#FCC; border: 0.1vw solid #C30; position:absolute; margin-left:-1vw; margin-top:-2vw; padding: 0.5vw;}
.erreur_stock SPAN {color:red;font-size:1rem;}

.enquete_titre {background:#e5e5e5; color:#003; font-size:1.3rem; padding:0.3rem;}
.enquete TR TD {height:2rem;}
.enquete TR:nth-child(2n+1) {background:#fcf9f9;}


/* ############################################################ ONGLETS ############################################*/

TABLE.inventaire {}
TABLE.inventaire TH {width: 50%; background:#E0E0E0;}
TABLE.inventaire TH.grand {padding:0.5rem; text-align: center; padding-top: 1rem; padding-bottom: 1rem; font-size: 1rem;}
TABLE.inventaire TD {width: 50%; padding:0.5rem; text-align: center; padding-top: 1rem; padding-bottom: 1rem; font-size: 1rem;}
TABLE.inventaire TD DIV {font-size:0.8rem !important; margin-bottom:0.2rem; font-weight:normal !important;}
TABLE.inventaire TD DIV B {color:#090;font-size:0.8rem !important;}
TABLE.inventaire TD DIV O {color:#FC0;font-size:0.8rem !important;}
TABLE.inventaire TD DIV V {color:#C9F;font-size:0.8rem !important;}
TABLE.inventaire TD DIV Z {color:red;font-size:0.8rem !important;}

TABLE.inventaire TD .cadre {position: relative; border: 2px solid red; text-align: center; height: 20px; border-radius:10px; animation: clignotement 2s infinite;}
@keyframes clignotement { 0%, 100% {border-color: red; } 50% {border-color: transparent; }}
@keyframes clignotementT { 0%, 100% {border-bottom: 10px solid red; } 50% {border-bottom: 10px solid transparent; }}
TABLE.inventaire TD .cadre::before, TABLE.inventaire TD .cadre::after {animation: clignotementT 2s infinite;content: '';position: absolute; width: 0;height: 0;border-left: 10px solid transparent; border-right: 10px solid transparent; border-bottom: 10px solid red; }
TABLE.inventaire TD .cadre::before {top: 5px; left: -10px; transform: rotate(90deg); }
TABLE.inventaire TD .cadre::after {bottom: 5px; right: -10px; transform: rotate(270deg); }
.invbtnpal {padding:1rem;background:yellow;border:1px solid black;border-radius:20px; float:none !important;}
#listpal {display: flex;width:100%;flex-wrap:wrap;justify-content:start}
#listpal A {border:3px solid red; font-size: 1rem; padding: 0.5rem;margin: 0.5rem; height: auto; border-radius:5px;}
#listpal A.fait {border:3px solid green; background:#C7FFC6;  }


TABLE.inventaire TD.pagination {background:#FFC;border-bottom:1px solid grey; font-size:0.8rem; padding-bottom:0.5rem; padding-top:0.5rem;}
TABLE.inventaire TD.pagination B {cursor:pointer; font-size:0.8rem;}
TABLE.inventaire TD.pagination B:hover {color:red;}


/* ############################################################ COVEA ############################################*/


.covea_workflow {border-radius:0.5vw; background:white;width:88%;position:relative;left:5%;top:6%;border :2px solid #D3D3D3; padding:1%; text-align:left;}
.covea_workflow.fixe {margin-top:3% !important;}
.covea_workflow H1 {}
.covea_workflow .close {position:absolute; right:1vw; top:1vw; cursor:pointer;}
.covea_workflow .close:hover {background: -webkit-linear-gradient(#F7F7F7, red); 
background-clip: border-box;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;}
.covea_workflow UL { list-style:none; margin-top:2%;}
.covea_workflow UL LI {border-radius:0.5vw; width:97%; background:#F7F7F7; border :1px solid #D3D3D3; padding:1vw; margin-bottom:2%; position:relative;}
.covea_workflow UL LI > DIV {width:6vw;height:6vw; border :1px solid white; float:left; margin-right:2%;}
.covea_workflow UL LI P {width:calc(92% - 6vw);min-height:5vw; border :1px solid #D3D3D3; float:left; background:#fcfcfc; margin-right:2%; padding:0.5vw; }
.covea_workflow UL LI INPUT[type='radio'] {float:left; margin-top:3.5%;}
.covea_workflow UL LI INPUT[type='text'] {width:80%;}
.covea_workflow INPUT[type='button'] {float:left; padding:0.5vw 1vw; border: 1px solid #348dc8; margin-left:1%;}
.covea_workflow INPUT[type='submit'] {float:right; padding:0.5vw 1vw; border: 1px solid #348dc8; margin-right:1%;}
.covea_workflow BUTTON {float:right; padding:0.5vw 1vw; border: 1px solid #348dc8; margin-right:1%;}
.covea_workflow UL LI LABEL {display:inline-block; min-width:20%;}

.covea_workflow UL LI P .tabform {width:100%; border-spacing :0.5vw;}
.covea_workflow UL LI P .tabform TR {margin-bottom:1.5vw;}
.covea_workflow UL LI P .tabform TD:first-child() {width:40%;}
.covea_workflow UL LI P .tabform TD * {width:100%;}


.covea_workflow #signatureparent {float:none; display:inline-block; width:70%; background:white; height:auto;}
.covea_workflow #signatureparent DIV {float:none; border:0; width:auto; height:auto;}
.covea_workflow IMG#i {float:none; border:0; width:auto; height:auto; background:white;}
#signatureparent CANVAS {height:inherit !important; min-height:20rem !important; border: 1px solid black !important; width:100% !important;}


.covea_workflow LI INPUT[type='radio']{ position: absolute;visibility: hidden;}
.covea_workflow .check {
display: block;
position: absolute;
border: 0.3vw solid #AAAAAA;
border-radius: 100%;
height: 1.5vw;
width: 1.5vw;
margin-top: 3%;
right: 0;
z-index: 5; cursor:pointer;
}
.covea_workflow .check:hover {/*border: 5px solid #f19200;*/}
.covea_workflow LI INPUT[type='radio']:checked ~ .check { /*border: 5px solid #0DFF92;*/background: #0DFF92;}
.covea_workflow LI INPUT[type='radio']:checked ~ .check::before{background: #0DFF92;}
.covea_workflow .check::before {
  display: block;
  position: absolute;
	content: '';
  border-radius: 100%;
  height: 1vw;
  width: 1vw;
  top: 0.25vw;
	left: 0.25vw;
  margin: auto;
	transition: background 0.25s linear;
	-webkit-transition: background 0.25s linear;
}

.covea_workflow #soustexte * {border:0 !important; height:auto !important; min-height:0 !important;}

.covea_workflow .TAB_ENCOURS {width:100%;}
.covea_workflow .TAB_ENCOURS TH {border:1px solid grey; font-weight:bold;}
.covea_workflow .TAB_ENCOURS TD {border:1px solid grey; text-align:center; font-size:0.8rem;}



/* ############################################################ PLANNING ############################################*/

.planningMenu {float:left;width:15%;margin-right:1%;  min-height:100%; background:white;border: 1px solid #348dc8; padding:1vw;}
.export {border:1px solid grey; background:white;}
.export INPUT[type='submit'] { padding:0.2vw 0.5vw; border: 1px solid #348dc8; margin-right:1%; margin-top:1vw; margin-bottom:1vw;}
#datepicker {text-align:center;}

.planningMenu SPAN {padding:0.05vw; font-size:0.6vw; font-weight:bold; color:white; border:1px solid black; border-radius:0.2vw; margin-bottom:0.5vw;float:left;width:100%;}
.planningMenu LI {padding:0.05vw; font-size:0.8vw; position:relative; background:#EAFFFE; font-weight:bold; border:1px solid black; border-radius:0.2vw; margin-bottom:0.5vw;width:100%;list-style:none;}
.planningMenu LI INPUT {position:absolute;left:0.5vw; top:0.3vw;}

#zone_planning {float:left;width:84%; height:85%; background:white;border: 1px solid #348dc8; padding:1vw; position:relative;}
#zone_planning H3 {font-size:1.5vw; margin-bottom:1.5vw; display:block; height:2.3vw; }
#zone_planning H3 SPAN {padding-top:0.3vw;font-size:1.5vw; }

.wraper {width:100%; white-space: nowrap;font-size: 0; display:block; overflow: auto; position: relative;}
.tab_planning {width:100%;table-layout: fixed;border-collapse : separate;border-spacing : 0;}
.tab_planning THEAD TH {padding:0.2vw;font-size:0.5vw; border:1px solid #DDDDDD;margin:0; text-align:center; position:sticky;top: 0; background:white; z-index:5; cursor:pointer;}
.tab_planning THEAD TH:hover { text-decoration:underline;}
.tab_planning THEAD TH:nth-child(1) {width:10vw; height:1vw; font-weight:bold;border:0.1px solid #DDDDDD; vertical-align:top;padding:0.2vw;font-size:0.5vw;}
.tab_planning THEAD TH:nth-child(2) {width:0.2vw;background:#F3F3F3;border:0.1px solid #DDDDDD; padding:0;}
.tab_planning THEAD TH:first-child {left: 0;z-index: 6;}

.tab_planning TBODY TD {padding:0.2vw;font-size:0.5vw; border:1px solid #DDDDDD;margin:0; text-align:center;}
.tab_planning TBODY TD:nth-child(1) {width:10vw;font-weight:bold;border:1px solid #DDDDDD; vertical-align:middle; z-index:5; padding:0.2vw;font-size:0.7vw;position: -webkit-sticky; left: 0; background:white; position: sticky; text-align:left;}
.tab_planning TBODY TD:nth-child(2) {width:0.2vw;background:#F3F3F3;border:0.1px solid #DDDDDD; padding:0;}
.tab_planning .z {min-height:1.5vw;height:1.5vw; background:#F3F3F3; padding:0; vertical-align:top;}
.tab_planning .z:active {background:#D9EFFF;}
.tab_planning .z:hover {background:#FFC !important;}
.tab_planning .auj {background:#F1EEE0 !important; }
.tab_planning .we {background:#fce8e8; }
.tab_planning .drag {background:#6F9 !important; }
.tab_planning .resizing {border:  2px solid #88ff82 !important; }
.group {height:1.5vw; background:#999 !important; color:white; font-weight:bold !important; font-size:0.9vw !important; border-right: 1px solid #999 !important; border-left: 1px solid #999 !important;}

.tab_planning RDV {display:block;width:100%;height:1.6vw; position:relative; margin-bottom:0.2vw; line-height:0.7vw; cursor:pointer;}
.tab_planning RDV > DIV {border:2px solid transparent;height:100%;font-family: Arial, Helvetica, Sans-Serif; z-index:2; white-space: nowrap;text-overflow:clip; color:white;overflow:hidden; position:absolute;top:0;left:2px;border-left:2px solid black; font-size:0.7vw; font-weight:bold; text-align:left; padding-left:2px;}
.tab_planning RDV > DIV.resize {z-index:3 !important;}
.tab_planning RDV > DIV:hover {border:2px dotted;border-left:2px solid black;}

.pla_opaq {opacity:0.5 !important;}

.cachePlanning {width:100%;height:100%;position:fixed;top:0;left:0;opacity:0.7; background:#999; z-index:200;}
.fichePlanning {width:40%;position:fixed;top:10%;left:30%; background:white; border-radius:0.7vw; z-index:200;border: 2px solid #348dc8; padding:2vw; padding-bottom:1vw; padding-top:1vw;}
.fichePlanning H4 {font-size:1.5vw;width:100%;text-align:center;margin-bottom:1.5vw;}
.fichePlanning LABEL {width:5vw; margin-right:1vw;}
.fichePlanning SELECT, .fichePlanning INPUT, .fichePlanning TEXTAREA {width:calc(100% - 10vw); margin-bottom:1vw;}
.fichePlanning TEXTAREA {height:8vw;}
.fichePlanning .BTNPLA {margin-top:2vw;}
.fichePlanning .BTNPLA .ajouter {float:right;}

.tab_planning_mobile TH:nth-child(2) {background:#DDDDDD !important;}	
.tab_planning_mobile TH SPAN {float:left; line-height:2vw;}
.tab_planning_mobile TH BUTTON:nth-child(1) {float:left;margin-right:1.5vw; margin-left:30%;}
.tab_planning_mobile TH BUTTON:nth-child(3) {float:left;margin-left:1.5vw;}
.tab_planning_mobile TD:nth-child(1) {text-align:center !important;}	
.tab_planning_mobile TD.ligne {background:#DDDDDD !important;}	
.tab_planning_mobile TD { height:1vw !important;}	
.tab_planning_mobile RDV {height:auto; margin-top:-0.5vw;}
.tab_planning_mobile RDV DIV {width:15vw; white-space:normal;}

/* ############################################################ WORKFLOW ############################################*/

#zone_workflow {background:white; width:69%; padding:5%; height:200%; float:left; margin-left:1%;  position:relative; text-align:left;}
.wf_image {width:1vw;height:1vw; z-index: 2;}
.wf_chemin {box-shadow: 2px -2px 5px #999; border-radius:10px; border: 2px solid; position:absolute;z-index:2; transform-origin: top left;}
.wf_chemin:hover, .wf_boucle:hover{box-shadow: 5px 5px 10px #0F0;	cursor: pointer;}
.wf_boucle {width:40px; height:40px; box-shadow: 2px -2px 5px #999; border-radius:10px; border: 3px solid; position:absolute;z-index:2;}
.wf_boule {width:3.5vw; height:3.5vw; right:1px; position:absolute;z-index:5; border-radius:50px; box-shadow: 2px -2px 5px #999; text-align:center;}
.wf_boule IMG {margin-top:0.8vw;margin-left:0.2vw;width:2vw;height:2vw;}
.wf_etapes {box-shadow: 5px -3px 1px #999;border-radius:5px;width:6vw;height:50px;text-align:center;padding:0.5vw 1vw;position:absolute;z-index:5;}
.wf_etapes P {color:white;font-size:0.9vw;}
.wf_popup { display: none; position: fixed; bottom: 50%; left: 40%; border-radius: 3px; border:1px solid black; z-index: 9; height:10%; width:20%; background-color: #FFF;	}



/* ############################################################ TAGS ############################################*/

.tags {width:50%;height:50%;padding:1vw;border:1px solid black;position:absolute;z-index:50;background:white;top:25%;left:25%; overflow-y:scroll;}
.tags H1 O {float:right;margin-right:1vw;cursor:pointer;}
.tags TABLE {width:100%;}
.tags TH {border:1px dashed grey !important; background:#CCF; padding:0.5vw 0.1vw; white-space:normal; width:50%;}
.tags TBODY TR {display:none;}
.tags TD {padding:0.5vw 0.1vw; white-space:normal;}
.tags TR:nth-child(2n+1) TD {background:#F5F5F5;}
.tags .cat {display:table-row !important;}
.tags .cat TD {background:#E3FFD7 !important; text-align:center;}
.tags .cat TD O {float:right;margin-right:1vw;cursor:pointer;}


/* ############################################################ ONGLETS ############################################*/


.onglet { margin: 0px; padding: 0px; position: relative; text-align:left; border: 2px solid #CCB; width: 50%; margin-top:calc(-1% - 2px) !important; border-top:0; border-bottom:2px solid #CCB; padding-top:2%; position:relative; margin:auto; background-color: white; margin-bottom:1vw; z-index:3;}
.onglet li { display: inline-block; margin-left:1vw;}
.onglet a { display: block; border: 1px solid #cccccc; border-width: 1px 1px 0 1px; padding: 10px 15px; border-radius: 5px 5px 0 0; background-color: #fff; text-decoration: none; color: #fbaf31; transition-duration: 0.5s;}
.onglet a.act { background-color: #fbaf31; color: #fff;}
.onglet a:hover { background-color: #fbaf31;color: #fff;}
DIV.tab { display: none;}
DIV.tab-active { display: block;}



/* ############################################################ LOADERs ############################################*/

.lds-grid { display: inline-block; position: relative; width: 80px; height: 80px;}
.lds-grid div { position: absolute; width: 16px; height: 16px; border-radius: 50%; background: #000; animation: lds-grid 1.2s linear infinite;}
.lds-grid div:nth-child(1) { top: 8px; left: 8px; background:#F00; animation-delay: 0s;}
.lds-grid div:nth-child(2) { top: 8px; left: 32px; background:#06C; animation-delay: -0.4s;}
.lds-grid div:nth-child(3) { top: 8px; left: 56px; background:#0C3; animation-delay: -0.8s;}
.lds-grid div:nth-child(4) { top: 32px; left: 8px; background:#FF3; animation-delay: -0.4s;}
.lds-grid div:nth-child(5) { top: 32px; left: 32px; animation-delay: -0.8s;}
.lds-grid div:nth-child(6) { top: 32px; left: 56px; background:#F90; animation-delay: -1.2s;}
.lds-grid div:nth-child(7) { top: 56px; left: 8px; background:#C6C; animation-delay: -0.8s;}
.lds-grid div:nth-child(8) { top: 56px; left: 32px; background:#903; animation-delay: -1.2s;}
.lds-grid div:nth-child(9) { top: 56px; left: 56px; background:#CC0; animation-delay: -1.6s;}
@keyframes lds-grid {0%, 100% { opacity: 1;} 50% { opacity: 0.5;}}


/* ############################################################ Fomulaire PV ############################################*/

div.star-wrapper, div.thumbs-wrapper, div.smiley-wrapper { font-size: 2rem;}
div.star-wrapper i, div.thumbs-wrapper i, div.smiley-wrapper i{ cursor: pointer; margin-right:0.5rem; }

div.star-wrapper i.yellow, div.smiley-wrapper i.yellow { color: #FDD835;}
div.thumbs-wrapper i.red, div.smiley-wrapper i.red{ color: red;}
div.thumbs-wrapper i.green, div.smiley-wrapper i.green{ color: green;}