/* 
================================================================================
Feuille de style pour toutes les pages

@author Esabora
@version v 2.86 - 13/09/2022 - Arnaldo
================================================================================
*/ 

html,
body 
{
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
}

dialog
{
	border: none;
	padding: 0;
	margin: 0;
	max-width: none;
	max-height: none;
}

iframe
{
	border: none;
}

a img 
{
	border: 0;
}

a:link,
a:visited,
a:active,
a:hover 
{
	text-decoration: none;
}

p,
.p 
{
	margin: 4px;
}

textarea.ea-textarea 
{
	margin : 0;
    padding : 0 1px;
}

input[type=text], 
input[type=password] 
{
	padding:1px 2px;
}

textarea 
{
	resize:none;
}

select {
	background-color:#fff;
}

.clear 
{
	clear: both;
	display:block; /* Si on utilise cette classe sur un élement inline */
}

label.erreur 
{
	background-color: rgba(255, 255, 255, 0.8);
	color: red;
	font-weight: bold;
}

td.erreur,
td.erreur a:link,
td.erreur a:hover,
td.erreur a:hover 
{
	font-weight: bold;
	color: red;
}

/* Placeholders : couleur des textes */
input.ea-password::placeholder,
input.ea-text::placeholder,
textarea.ea-textarea::placeholder
{
	opacity:1;
	color:#A9A9A9;
}

::-ms-clear, /* Supprime la croix pour vider le champ (IE, Propriété non standard) */
::-ms-reveal /* Supprime l'oeil pour visualiser le mot de passe (IE, Propriété non standard) */
{
    display: none;
	width:0;
	height:0;
}

div.conteneur 
{
	overflow:hidden;
}

div.fondCorps 
{
	background-color: #FFFFFF;	
	box-shadow: 2px 8px 8px #555; 
}

html.liste 
{
	height: 98.5%;
	overflow: hidden;
}

div.hg 
{
	font-weight: bold;
}

.majus 
{
	text-transform: uppercase;
}

/* alignement des numériques */
.num 
{
	text-align: right;
}

.ea-attach .num
{
	text-align: left;
}

th.entete.num 
{
	text-align: right;
	margin-left: auto;
	margin-right: auto;
}

table.btbandeau,
table.frame,
table.champs,
table.champsg,
table.boutons 
{
	border: 0;
	padding-bottom: 0;
	padding-left: 0;
	padding-right: 0;
	padding-top: 0;
}

table.btbandeau,
table.frame,
table.champs,
table.champsg 
{
	border-collapse: collapse;
}

table.boutons 
{
	border-collapse: separate;
}

/* centrage IE et mozilla */
table.champs,
table.boutons 
{
	margin-left: auto;
	margin-right:auto;
	text-align: left; 
}

table.center
{
	margin-left: auto;
	margin-right:auto;
}

table.pad0 td
{
	padding: 0;
}

table.pad1 td
{
	padding: 1px;
}

/* décalage pour les champs au sein d'une table "champsg" */
table.champsg input,
table.champsg select 
{
	margin-top: 0;
	margin-bottom: 0;
}

/* a supprimer après changer la classe */
input.libel,
input.ea-link-label 
{
	border-width:0;
}

/* a supprimer après changer la classe */
textarea.libel,
textarea.ea-link-label 
{
	overflow:auto;
	border-width:0;
}

td.centre2 
{
	text-align: center;
}

td.gofiche,
td.gofiche a:link,
td.gofiche a:visited,
td.gofiche a:active,
td.gofiche a:hover,
span.gofiche a:link,
span.gofiche a:visited,
span.gofiche a:active,
span.gofiche a:hover
{
	text-decoration: underline;
}

td.hg_menugene 
{
    text-align: center;
}

.ea-label 
{
	color:#000;
}

.ea-label-left
{
	display:block;
	text-align:left;
}

.ea-label-right
{
	display:block; 
	text-align:right;
}

.ea-label-noalign
{
	display:block;
}

ul.mh2
{
	display:none;
}

/* Couleur branche d'entité jointure interne */
span.join a, 
.join .ea-icon.warning
{
	color: #e96b26;
}

/* 
================================================================================
Logo
================================================================================
*/
   
div.logo 
{
	position: absolute;
	background: #fff;
	z-index:13;
	top:0;
	left:24px;
	padding:5px 5px;
	border-bottom:3px solid #282f31;
	box-shadow: inset 0 -2px #eee;
}

img.logoImg 
{
	width:70px;
}

/* 
================================================================================
Boutons
================================================================================
*/

input.boutons,
input.boutons:hover 
{
	cursor:pointer;
}

input.boutons:disabled, 
input.boutons:hover:disabled
{
	background-color : #e0e0e0;
    border: 1px solid #b1b1b1;
    color: #b1b1b1;
    cursor: default;
    background-image:none;
}

input.boutons:disabled, 
input.boutons:hover:disabled
{
	background-color : #e0e0e0;
    border: 1px solid #b1b1b1;
    color: #b1b1b1;
    cursor: default;
}

input.btbd,
input.btsearch,
input.btraz,
input.btbd:hover,
input.btsearch:hover,
input.btraz:hover 
{
	cursor:pointer;
	padding: 0px 0px 2px 0px;
}

/* boutons dans le bandeau d'une zone liste */
.ea-bannerzonebts-list  
{
	position:absolute;
	top:30px;
	width:100%;
}

/* boutons dans le bandeau d'une zone fiche */
.ea-bannerzonebts-unik 
{
	position:relative;
	margin-top:4px;
}

/* Bouton Ajouter sur le bandeau d'une zone */
.btAjoutZone 
{
	position:absolute;
	top:0;
	left:0;
	cursor:pointer;
}

.ea-bannerzonebts-unik .btAjoutZone,  /* Bouton Ajouter sur le bandeau d'une zone fiche */
.ea-bannerzonebts-list .btAjoutZone, /* Bouton Ajouter sur le bandeau d'une zone liste */
.btAjoutImportXMLZone /* Bouton Ajouter xml sur le bandeau d'une zone */
{
	position:static;
	display:inline-block;
	margin-right:5px;
	vertical-align:top;
}

/* Boutons de navigation sous le bandeau des zones du bas d'écran */
.btnavtab 
{
	position: absolute;	
	bottom: 0px;
	left: 0px;
	width: 98%;
	text-align: center;
	margin-left: auto;
	margin-right: auto;	/* centrage IE et mozilla */
}

.btchps 
{
	border-style:none;
	border-width:0;
	cursor:pointer;
	height:18px;
	margin:0;
	padding:0;
	width:18px;
}

.gbt 
{
	text-align: center;
}

input.btn 
{
	cursor: pointer;
	font-weight: bold;
	padding: 0;
	width: 18px;
	height: 18px;
}

input.btbd,
input.btsearch,
input.btraz,
input.btbd:hover,
input.btsearch:hover,
input.btraz:hover,
.btdiv,
.bton,
.btoff 
{
	width: 100px;
}

.bton,
.btoff,
input.btbd,
input.boutons,
input.btsearch,
input.btraz 
{
	line-height: 15px;
	height:20px;
}

.btoff,
input.btbd,
input.btsearch,
input.btraz 
{
	width: 100px;
}

a.ea_button,
button.bouton,
.btoff,
input.btbd,
input.boutons,
input.btsearch,
input.btraz,
button.bouton:hover,
.btdiv:hover,
input.btbd:hover,
input.boutons:hover,
input.btraz:hover,
input.btsearch:hover,
input.btraz:hover,
.bton 
{
	border-radius:4px;
	cursor:pointer;
}

button.boutons:hover
{
	cursor:pointer;
}

.zoneposrelative .ea-ctlbuttons input.boutons,
.zoneposrelative .ea-ctlbuttons button.boutons
{
	line-height: 12px;
	height: 24px;
	padding: 5px 15px 5px 15px;
	text-transform: uppercase;
}

.zoneposrelative .ea-ctlbuttons button.boutons.ea-icon::before
{
	font-size: 12px;
}

/* boutons valider des templates fiches */
#dvvalann 
{
	white-space: nowrap;
	z-index:1;
}

.ea-tpl-btcancel,
.ea-tpl-btsave,
.ea-tpl-btback 
{
	border:none;
	border-radius: 4px;
	cursor:pointer;
	line-height: 15px;
	height: 20px;
	color:#fff;
	border-radius : 25px;
	padding:0 8px;
}

.zoneposrelative .ea-tpl-btcancel,
.zoneposrelative .ea-tpl-btsave,
.zoneposrelative .ea-tpl-btback
{
	height: auto;
	padding: 5px 15px 5px 15px;
	text-transform: uppercase;
}

.zoneposrelative .ea-tpl-btback
{
	padding-top: 4px;
	padding-bottom: 4px;
}

.ea-tpl-btcancel:hover,
.ea-tpl-btsave:hover
{
	font-weight:bold;
}

.ea-tpl-btcancel 
{
	background-color: #F03434;
}

.ea-tpl-btsave 
{
	background-color: #26A65B;
}

input.btsearch-highlight.btsearch-highlight,
input.btsearch-highlight.btsearch-highlight:hover
{
	border-color:#26A65B;
	color:#fff;
	background-color: #26A65B;
}
input.btsearch-highlight.btsearch-highlight:hover {
	font-weight:bold;
}
/* 
================================================================================
Liste -	Entetes
================================================================================
*/

.entete,
a:hover.entete,
a:active.entete,
a:link.entete,
a:visited.entete 
{
    border: 0px;
	padding: 2px;
	white-space: nowrap;
}

a:hover.entete,
a:active.entete,
a:link.entete,
a:visited.entete 
{
   height: 20px;
}

a:link.liste_entete,
a:visited.liste_entete,
a:hover.liste_entete,
td.entete a:link,
td.entete a:visited,
td.entete a:hover 
{
	text-decoration: none;
}

th.entete 
{
	text-align: left;
}

.ea-bt-ascdesc
{
	background-color: transparent;
	color: inherit;
	border: 0;
	padding:0;
	cursor: pointer;
}

.ea-colchoix-btselall
{
	background-color: transparent;
	color: inherit;
	border: 0;
	padding:0;
	cursor: pointer;
}

/* 
================================================================================
Autres
================================================================================
*/

/* Utilisateur connecté */
#userConnected
{
	position:absolute;
	top:36px;
	right:35px;
	height:23px;
	line-height:23px;
	z-index:9;
}

#userConnected span
{
	vertical-align: top;
}

.userconnected-profil
{
	margin-left: 5px;
}

.skiplinks
{
	position: relative;
	z-index: 14;
}

.skiplinks a:link,
.skiplinks a:hover,
.skiplinks a:active,
.skiplinks a:visited
{
	position: absolute;
	padding: 6px 20px;
	border-radius: 0px 0px 10px 10px;
	background-color: black;
	color: white;
	text-decoration: underline;
	font-size: 16px;	
	transform: translateY(-100%);
	transition: transform 0.3s;
}

.skiplinks a:focus 
{
	transform: translateY(0%);
}

a.ea-bt-logout 
{
	display: inline-block;
	height: 18px;
	margin-top: 2px;
	border-radius: 4px;
	position:absolute;
	top:4px;
	right:4px;
	z-index:12;
}

.ea-bt.ea-bt-logout:before 
{
	font-size:15px;
	color:#dadada;
	line-height:15px;
}

.ea-bt.ea-bt-logout:hover:before 
{
	font-size:16px;
}

.titbtg 
{
    border: 0px;
	vertical-align: bottom;
	padding-bottom:5px;
}

/* fieldset */
.fldset 
{
	padding : 2px 4px;
	margin: 0 0 0 4px;
	border-width:1px;
}

/* Boutons du popup */
a.fl.menuButton.menuButton0 
{
	height: 9px;
	width: 110px;
}

/* 
================================================================================
Titres contrôleur
================================================================================
*/

.titre_controleur_noir,
.titre_controleur_rouge,
.titre_controleur_bleu 
{
	font-weight: bold;
	line-height:1;
}

.agdalabel 
{
	font-weight: bold;
}

.inactif 
{
	cursor: default;
}

/* 
================================================================================
Listes et Filtre Arbo
================================================================================ 
*/

td.liste1, 
td.liste2 
{
	padding: 4px 2px;
	vertical-align: top;
	border: 1px solid;
}

table.liste 
{
	border-collapse: collapse;
	empty-cells: show;
}

table.liste th a,
th.entete,
th.entete a,
th.entete .ea-bt-ascdesc,
td.entete,
td.entete a,
a.entete:hover,
a.entete:active,
a.entete:link,
a.entete:visited 
{
    font-weight:bold;
    color:#000;
    background:transparent;
    border:none;
}

table.liste tr.opened
{
	font-weight: bold;
}

table.liste tr.opened .ea-icon
{
	font-weight: normal;
}

.corps-liste-popup 
{
	position: absolute;
	top:20px;
	left: 20px;
	overflow: auto;
}

.corps-liste-popup.zonesrelative form  
{
	height:100%;
}

.corps-liste-zone 
{
	position: absolute;
	top: 0px;
	left: 0px;
	height: 100%;
	width: 100%;
}

#eadvlist 
{
	position:relative;
	overflow:auto;
	max-height:100%;
	padding-right:1px; /* Sinon IE9 met parfois un scroll sur la table enfant de ce div */
}

.ea-list-pager #eadvlist
{
	max-height:calc(100% - 31px);
}

.filtreArbo 
{
    padding-left: 3px;
    padding-right: 3px;
    text-align: left;
}

.filtreArbo .fl 
{
	float: none; /* Pour annuler la classe fl */
}

.filtreArbo .show 
{
	visibility: visible;
	display: block;
}

.filtreArbo .hide 
{
	visibility: hidden;
	display: none;
}

.filtreArbo .m 
{
	margin-bottom:1px;
	margin-top:1px;
	padding-bottom:1px;
	padding-top:1px;
}

.filtreArbo .im
{
	margin-right:4px;
}

.filtreArbo td 
{
	white-space:normal;
}

.filtreArbo td 
{
	white-space:normal;
}

.filtreArbo .selected a 
{
	font-weight: bold;
}

div.conteneur form div.corpsg div#eaListBox div.filtreArbo div.cb div.fl table tbody tr td.formulaire_label a,
div.conteneur form div.corpsg div#eaListBox div.filtreArbo div.cb div.fl table tbody tr td.ea-label a 
{
    margin-left: 4px;
}

/* Définitions en commun */
#eaFiltreArbo, 
#eaListPager 
{
	text-align:left;
	vertical-align:top;
	display: inline-block;
}

#eaFiltreArbo 
{
    height: 100%;
    overflow: auto;
    padding-top: 22px;
    position: relative;
}

#eaListPager 
{
	height:95%;
	overflow:visible; /* Sinon on ne voit pas la pagination */
}

#dvsuivprec 
{
	position:relative;
	text-align:center;
	margin-top:5px;
}

#eaListBox #eaBtNavPrec
{
	margin-right:20px;
}

#eaListBox .liste td
{ /* Force le retour à la ligne, pour ne pas être hérité du nowrap d'un parent */ 
	white-space: normal; 
}

#eaListBox
{ /* Pour les templates liste */
	white-space: nowrap;
}

#eaListBox #dvpatient,
#eaListBox #dvvalann 
{
	display:none;
	text-align:center;
	margin-top: 10px;
}

#eaListBox #eaBtNavPrec,
#eaListBox #eaBtNavSuiv 
{
	font-size:0;
}

input.saischeck,
.ea-colchoix-item
{
	height:13px;
	padding-top:0px;
	padding-bottom:0px;
	margin-top:0px;
	margin-bottom:0px;
}

table tr td a.arbBtExpCol img.im 
{ /* Alignement vertical du plus/moins */
	margin-top: 0px;
}

table tr td a.arbBtExpCol 
{ /* Alignement vertical du plus/moins */
	margin-top: 3px;
}

.arbBtExpCol 
{
	width: 12px;
	height: 12px;
	overflow: hidden;
	display: inline-block;
	margin-right: 5px;
}

.arbBtExpCol img 
{
	position: relative;
}

.arbBtExpCol img:hover 
{
	left: -12px;
}

.cb.m.selected a 
{
	font-weight: bold;
}

tr.selected td 
{
	font-weight: bold;
}

tr.selected td .ea-icon:before 
{
	font-weight: normal;
}

/* iframe pour une liste arborescente multi-entités */
#eaListArbo 
{
	width: 100%;
	height: 100%;
	border: none;
}

/* 
================================================================================
Listes - Filtres de recherche
================================================================================ 
*/

.ea-filter-search-box 
{
	display: inline-block;
	padding: 4px;
	min-height: 43px;
	border-style: solid;
	border-width: 1px;
	box-shadow: 1px 1px 2px #777;
	border-color: #c0c0c0;	
}

.ea-filter-search-box.collapsed 
{
	min-height: 15px;
}

.ea-filter-search-box.collapsed .ea-box 
{
	display: none;
}

.ea-filter-box 
{
	display: inline-block;
	margin-right: 40px;	
}

.ea-search-box 
{
	width: 100px;
	display: inline-block;
	vertical-align: top;
}

.ea-toggle-search-box 
{
	float: right;
    vertical-align: top;
}

.ea-search-message 
{
	display: none;
	float: right;
	margin-top: 2px;
}

.ea-search-message.collapsed 
{
	display: inline-block;
}


/* 
================================================================================
Elements controleur (menu gauche)
================================================================================
*/

a.menuButton,
.menuButton,
a.menuSubButton,
.menuSubButton,
a.menuButtonON,
a.menuSubButtonON
{
    cursor: pointer;
	position:relative;
	display:block;
	width:110px;
	padding:5px 1px 5px 1px;
	line-height:11px;
	box-sizing: border-box;
	background-color: transparent; 	/* pour balise button */
	text-align: left; 				/* pour balise button */
}

.ea-options-box .menuSubButton
{
	box-sizing: content-box;
	left: 0;
}

.menuButton:disabled
{
	opacity: 0.4;
	cursor: default;
	pointer-events: none;
}

a.menuButton0,
.menuButton0
{
	position:relative;
	margin-top:-1px;
}

.ea-ctl a.menuButton0,
.ea-ctl .menuButton0
{
	margin-top: 0;
}

.menuSection
{
	position:relative;
	margin-bottom:0px;
	padding:0px 0 2px 0;
	width:100%;
	line-height:1.4;
}

.comboMenu
{
	margin-left: 1px;
	width:98.8%;
}

.menusep
{
	position:relative;
	height:10px;
}

.menusep2
{
	position:relative;
	height:4px;
}

#divoptions a 
{
	left:0;
}
 
/*icones dans les boutons de controleur */
.buttonctliconbox 
{
	width:17px;
	height:17px;
	display:inline-block;
	margin-right:4px;
	border-radius:50%;
	text-align:center;
}

.buttonctlicon 
{
	margin-top:13%;
	height:76%;
}
.ea-ctl-middle #btPrecMC {
	margin-right:2px;
}
.ea-ctl-middle #btSuivMC {
	margin-left:-13px;
}
.ea-ctl-middle .cptMC {
	display:inline-block;
	margin-right:15px;
}
/*
================================================================================
Fil d'ariane
================================================================================
*/

#breadcrumb 
{
	position:absolute;
	z-index:2;
	left:150px;
	top:42px;
	white-space: nowrap;
}

#breadcrumb > ol
{
	list-style-type: none;
	margin: 0;
	padding: 0;
}

#breadcrumb > ol > li
{
	display: inline-block;
}

#breadcrumbshowmore .bold,
#breadcrumb .bold 
{
	font-weight:bold;
	cursor:default;
}

#breadcrumb,
#breadcrumbLink,
#breadcrumb .bold,
a.breadcrumbLink
{
	letter-spacing: 0;
}

#breadcrumbLink:hover,
a.breadcrumbLink:hover
{
	text-decoration:none;
}

.breadcrumbsep 
{
	margin: 0 5px;
}

#breadcrumbshowmore 
{
	cursor:default;
	padding-right: 2px;
}

#breadcrumbshowmore .ea-icon 
{
	text-align:center;
	vertical-align: top;
}

#breadcrumbshowmore .ea-icon:before 
{
	margin:0;
	font-size:10px;
}

#breadcrumblinkshidden 
{
	position:absolute;
	background-color:#fff;
	border-style:solid;
	border-width:1px;
	white-space: nowrap;
	padding: 4px;
	list-style-type: none;
	font-size: 12px;
}

#breadcrumblinkshidden a 
{
	display:block;
}

/* 
================================================================================
Bandeau d'une zone d'écran
================================================================================
*/

.bd 
{
	line-height: 19px;
	width: 100%;
	height: 19px;
	line-height:19px;
	text-align: center;
	position: absolute;
	border-bottom-width:1px;
	border-bottom-style: solid;
	font-weight:bold;
	text-transform:uppercase;
	white-space: nowrap;
}

.bd .ea-combo,
.bd .ea-label
{
	text-transform: none;
}

.ea-bannerzone 
{
    padding-top: 30px;
    padding-bottom: 5px;
    text-align: left;
}

.ea-bannerzone-list,
.ea-bannerzone-unik 
{
	padding-top: 3px;
    padding-bottom: 3px;
	text-align: left;
}

.ea-bannerzone-unik 
{
	position:relative;
}

.bd.listarbo 
{
	position: static;
}

/* Boutons Prec/Suiv sur le bandeau zone liste */
.ea-dvselprecsuiv 
{
	position: absolute; 
	top: 0;
	right: 0;
}
.ea-dvselprecsuiv .ea_bt_selprec 
{
	margin-right: 2px;
}

/* zone scrollable pour champs sous un bandeau */
.chpssbd 
{
    height: 93%;
    left: 0;
    margin-top: 19px;
    overflow: auto;
    position: absolute;
    top: 0;
    width: 100%;
}

/* 
================================================================================
Conteneur de zones d'écran
================================================================================
*/
.contzone 
{
	position: absolute;
	top: 0px;
	left: 0px;
	height: 100%;
	width: 100%;
}

/* 
================================================================================
Champ couleur
================================================================================
*/

.eaChpColor
{
	display: inline-block;
	vertical-align: middle;
	height:18px; 
	width:50px; 
	border:1px solid #ccc;
}

.ea-color-box .eaChpColor
{
	position:absolute; 
	top:0px; 
	left:0px;
}

.eaPalette
{
	position :absolute;
	border: 1px solid black;
	z-index: 2;
}

.eaPalette-item
{
	width:15px; 
	cursor:pointer;
}

.titrehgm 
{
	position: absolute;
	left: 660px;
	top: 43px;
	height: 30px;
	width: 55%;
	font-weight:bold;
}

.eacheckbox
{
	margin-left:0;	/* FF */
	padding-left:0; /* IE */
	width:13px		/* Sinon IE7 ne vide pas l'espacement à gauche */
}

.ea-menu-sep 
{
	border-bottom: 1px solid #808080;
    margin: 0 2px 1px;
    padding-top: 1px;
}

/* 
================================================================================
formulaires sans tableau de mise en forme ni position:absolute
================================================================================
*/

form div.gf
{
	overflow: hidden;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
	margin-left: 0;
	margin-right: 0;
}

form div.gf label 
{
	float: left;
	text-align: left;
}

form div.gf label.radio 
{
	float: none;
}

/* Div Autocomplétion Champ bouée */
.autocomplete
{
	position:absolute;
	overflow:auto;
	border:1px solid #353535;
	z-index:10;
	background-color:#fff;
}

.autocomplete ul 
{
	list-style-type:none;
	padding:0;
	margin:0;
}

.autocomplete ul li a 
{
	padding:2px;
	display:block;
}

.autocomplete ul li a .eabold 
{
	font-weight:bold;
}

/* 
================================================================================
Formulaires - Champs
================================================================================
*/

/* TODO: Retirer ces styles dans les helpers ? */ 
.contzone .ea-text-box, .divcont-unik .ea-text-box,
.contzone .ea-textarea-box, .divcont-unik .ea-textarea-box,
.contzone .ea-password-box, .divcont-unik .ea-password-box,
.contzone .ea-combo-box, .divcont-unik .ea-combo-box,
.contzone .ea-checkbox-box, .divcont-unik .ea-checkbox-box,
.contzone .ea-color-box, .divcont-unik .ea-color-box,
.contzone .ea-date-box, .divcont-unik .ea-date-box,
.contzone .ea-upload-box, .divcont-unik .ea-upload-box,
.contzone .ea-geomk-box, .divcont-unik .ea-geomk-box,
.contzone .ea-html-box, .divcont-unik .ea-html-box,
.contzone .ea-map-box, .divcont-unik .ea-map-box,
.contzone .ea-photo-box, .divcont-unik .ea-photo-box,
.contzone .ea-pic-box, .divcont-unik .ea-pic-box,
.contzone .ea-link-box, .divcont-unik .ea-link-box,
.contzone .ea-hypertext-box, .divcont-unik .ea-hypertext-box,
.contzone .ea-map-box, .divcont-unik .ea-map-box,
.contzone .ea-text-boxfield, .divcont-unik .ea-text-boxfield,
.contzone .ea-textarea-boxfield, .divcont-unik .ea-textarea-boxfield,
.contzone .ea-password-box, .divcont-unik .ea-password-box,
.contzone .ea-combo-boxfield, .divcont-unik .ea-combo-boxfield,
.contzone .ea-checkbox-boxfield, .divcont-unik .ea-checkbox-boxfield,
.contzone .ea-color-boxfield, .divcont-unik .ea-color-boxfield,
.contzone .ea-date-boxfield, .divcont-unik .ea-date-boxfield,
.contzone .ea-upload-boxfield, .divcont-unik .ea-upload-boxfield,
.contzone .ea-geomk-boxfield, .divcont-unik .ea-geomk-boxfield,
.contzone .ea-html-boxfield, .divcont-unik .ea-html-boxfield,
.contzone .ea-map-boxfield, .divcont-unik .ea-map-boxfield,
.contzone .ea-photo-boxfield, .divcont-unik .ea-photo-boxfield,
.contzone .ea-pic-boxfield, .divcont-unik .ea-pic-boxfield,
.contzone .ea-link-boxfield, .divcont-unik .ea-link-boxfield,
.contzone .ea-hypertext-boxfield, .divcont-unik .ea-hypertext-boxfield,
.contzone .ea-map-boxfield, .divcont-unik .ea-map-boxfield,
.contzone .ea-energy-chart-box, .divcont-unik .ea-energy-chart-box
{
	position: absolute;
}

.ea-geomk-box,
.ea-pic-box
{
	white-space: nowrap;
}

.ea-date-boxfield,
.ea-upload-boxfield,
.ea-text-boxfield,
.ea-link-boxfield
{
	white-space: nowrap;
}

.ea-textarea-boxfield
{
	white-space: normal;
}

.ea-date-boxfield 
{
	position: relative;
}

.ea-attach {
	line-height: 0; /* Supprime la hauteur minimale sur l'élément et ses enfants */
}

.ea-attach *:not(div) {
	line-height: normal; /* Restaure la hauteur minimale sur les enfants, sauf div */
}

.ea-attach, 
.ea-attach-fieldset
{
	box-sizing: border-box;
}

.ea-attach *,
.ea-attach-fieldset * 
{
	box-sizing: inherit;
}

.ea-attach.ea-text-box,
.ea-attach.ea-textarea-box,
.ea-attach.ea-password-box,
.ea-attach.ea-combo-box,
.ea-attach.ea-checkbox-box,
.ea-attach.ea-color-box,
.ea-attach.ea-date-box,
.ea-attach.ea-upload-box,
.ea-attach.ea-geomk-box,
.ea-attach.ea-photo-box,
.ea-attach.ea-html-box,
.ea-attach.ea-pic-box,
.ea-attach.ea-link-box,
.ea-attach.ea-hypertext-box,
.ea-attach.ea-map-box,
.ea-attach-fieldset.ea-fieldset-box
{
	background: white;
	border: 1px solid #ccc;
}

.ea-attach-fieldset > .fldset 
{
	border: none;
	padding:0;
	margin:0;
}

.ea-attach .ea-label,
.ea-attach-fieldset .ea-legend
{
	color: #777; /* A mettre plutot dans le thème ! */
	border: 1px solid transparent;
	display: inline-block;
	padding: 1px 2px;
	white-space: normal;
}

.ea-attach > .ea-text-boxfield,
.ea-attach > .ea-textarea-boxfield,
.ea-attach > .ea-password-boxfield,
.ea-attach > .ea-combo-boxfield,
.ea-attach > .ea-checkbox-boxfield,
.ea-attach > .ea-color-boxfield,
.ea-attach > .ea-date-boxfield,
.ea-attach > .ea-upload-boxfield,
.ea-attach > .ea-geomk-boxfield,
.ea-attach > .ea-html-boxfield,
.ea-attach > .ea-map-boxfield,
.ea-attach > .ea-photo-boxfield,
.ea-attach > .ea-pic-boxfield,
.ea-attach > .ea-link-boxfield,
.ea-attach > .ea-hypertext-boxfield,
.ea-attach > .ea-map-boxfield
{
	position: relative;
}

.ea-attach > .ea-upload-boxfield > .ea-upload-boxbt,
.ea-attach > .ea-geomk-boxfield > .ea-geomk-boxbt
{
	position: absolute;
}

.ea-attach > .ea-text-boxfield > .ea-text, 
.ea-attach > .ea-password-boxfield > .ea-password, 
.ea-attach > .ea-textarea-boxfield > .ea-textarea, 
.ea-attach > .ea-date-boxfield > .ea-date-day,
.ea-attach > .ea-date-boxfield > .ea-date-month,
.ea-attach > .ea-date-boxfield > .ea-date-year,
.ea-attach > .ea-date-boxfield > .ea-date-boxhour > .ea-date-hour,
.ea-attach > .ea-date-boxfield > .ea-date-boxhour > .ea-date-min, 
.ea-attach > .ea-link-boxfield > div > .ea-text,
.ea-attach > .ea-link-boxfield > div > .ea-date-day,
.ea-attach > .ea-link-boxfield > div > .ea-date-month,
.ea-attach > .ea-link-boxfield > div > .ea-date-year,
.ea-attach > .ea-upload-boxfield > .ea-combo,
.ea-attach > .ea-combo-boxfield > .ea-combo,
.ea-attach > .ea-combo-boxfield > .ea-multiple,
.ea-attach > .ea-geomk-boxfield > .ea-combo,
.ea-attach > .ea-checkbox-boxfield > .ea-checkbox,
.ea-attach > .ea-hypertext-boxfield > .ea-text
{
	border-color: transparent;
}

.ea-attach .ea-label,
.ea-attach .ea-text,
.ea-attach .ea-textarea,
.ea-attach .ea-password,
.ea-attach .ea-combo,
.ea-attach .ea-multiple,
.ea-attach .eaChpColor
{
	width: 100%;
}

.ea-attach .ea-html-boxfield .ea-tinymce iframe,
.ea-attach .ea-html-boxfield .htmleditorpreview 
{
	border-left-color: transparent;
	border-right-color: transparent;
	border-bottom-color: transparent;
	box-sizing: border-box !important;
}

.ea-attach > .ea-date-boxfield > .ea-label 
{
	width: 106px;
}

.ea-attach.ea-photo-box,
.ea-attach.ea-map-box
{
	padding: 0 5px 5px 5px;
}

.ea-attach.ea-color-box .eaChpColor
{
	position: relative;
	top: 0;
	left: 0;
	border: none;
	display: inline-block;
	width: calc(100% - 10px);
	margin-left: 5px;
	margin-bottom: 5px;
}

.ea-attach.ea-color-box .ea-bt 
{
	position: absolute;
	right: -25px;
	margin:0;
}

.ea-hypertext-boxfield > .ea-bt-modify,
.ea-hypertext-boxfield > .ea-icon.ea-bt.edit 
{
	position: absolute;
	bottom: 0;
	right: -20px;
}

.ea-attach > .ea-hypertext-boxfield > .ea-text 
{
	margin-bottom: 3px;
}

.ea-attach > .ea-hypertext-boxfield > .ea-hypertext-dvlink
{
	padding: 1px 2px;
	border: 1px solid transparent;
	overflow: hidden;
	text-overflow: ellipsis;
	margin-bottom: 1px;
}

.ea-hypertext-boxfield > .ea-hypertext-dvlink
{
	white-space: nowrap;
}

.ea-attach > .ea-geomk-boxfield > .ea-geomk-boxbt
{
	bottom: 0;
	margin-left: 5px;
}

.ea-attach > .ea-geomk-boxfield > .ea-geomk-boxbt *
{
	vertical-align: bottom;
}

.ea-attach.ea-link-box > div > div 
{
	position: relative;
}

.ea-attach .ea-textarea 
{
	margin : 0;
    padding : 1px 2px;
}

.ea-attach > .ea-pic-boxfield > .fieldiconprev
{
	border: none;
}

.ea-attach > .ea-pic-boxfield > .ea-bt.choose
{
	position: absolute;
	bottom: 0;
	right: -20px;
}

.ea-attach > .ea-pic-boxfield > .ea-bt.erase
{
	position: absolute;
	bottom: 0;
	right: -40px;
}

.ea-attach .ea-text-suffix
{
	visibility: hidden;
	font-size: 12px;
}

.ea-attach .ea-bt-showpassword,
.ea-box .ea-bt-showpassword
{
	position: absolute;
	top: 0;
	right: 0;
	line-height: 1.4;
	color: #999;
	font-size: 13px;
	padding: 0 4px;
	border: none; 
	background: none;
	cursor: pointer;
}

.ea-bt-showpassword.ea-icon:before
{
	margin: 0;
}

.ea-date-day, 
.ea-date-month,
.ea-date-hour, 
.ea-date-min
{
	width: 1.8em;
}

.ea-date-year
{
	width: 3em;
}

input.ea-date-day, 
input.ea-date-month,
input.ea-date-hour, 
input.ea-date-min,
input.ea-date-year 
{
	padding:0.08em 0.16em;
}

.ea-date-boxhour
{
	display: inline-block;
}

input.ea-date-hour,
input.ea-date-min,
input[type=text],
input[type=password],
textarea,
select,
input.ea-text,
input.ea-date-day,
input.ea-date-month,
input.ea-date-year,
select:disabled,
textarea:disabled,
input:disabled,
div.htmleditorpreview
{
	border:1px solid #ccc;
	border-radius:2px;
}

textarea.ea-link-label,
input[type=text].ea-link-label,
input.ea-link-label:focus,
textarea.ea-link-label:focus
{
	border:none !important;
	outline:none !important;
	cursor:default;
	white-space: normal;
}

textarea.ea-link-label,
textarea.ea-link-label:focus 
{
	white-space: pre-line;
}

select:disabled,
textarea:disabled,
input:disabled 
{
	background:#f9f9f9;
	color:#565656;
}

.ea-tinymce.inactif div.htmleditorpreview,
.ea-tinymce.inactif div.htmleditorpreview:focus,
select.inactif,
select.inactif:focus,
textarea.inactif:focus,
textarea.inactif,
input[type=text].inactif:focus,
input[type=text].inactif,
div.inactif 
{
	outline:none;
	background:#f9f9f9;
}

.ea-tinymce.inactif div.htmleditorpreview,
.ea-tinymce.inactif div.htmleditorpreview:focus,
textarea.inactif:focus,
textarea.inactif,
input[type=text].inactif:focus,
input[type=text].inactif,
select.inactif,
select.inactif:focus,
div.inactif
{
	border:1px dotted #ccc;
}

div.inactif 
{
	padding-left: 1px;
	padding-right: 1px;
}

/* conditions de saisie */	
.ea-box-readonly.opacity {
	opacity: 0.4;
}
.ea-box-readonly.opacity textarea,
.ea-box-readonly.opacity input[type=text],
.ea-box-readonly.opacity select
{
	cursor: default;
}
.ea-box-readonly.readonly textarea,
.ea-box-readonly.readonly input[type=text],
.ea-box-readonly.readonly select
{
	background-color: #ddd;
	cursor: default;
}
.ea-box-readonly .ea-link-boxbt,
.ea-box-readonly .ea-icon.ea-bt.choose,
.ea-box-readonly .ea-icon.ea-bt.datepicker,
.ea-box-readonly .ea-multiple-boxbt,
.ea-box-readonly .ea-bt-small-add,
.ea-box-readonly .ea-bt-small-del
{
	display: none;
}

/* Les séparateur ne doivent pas changer de taille quand on change de police/langue */
.ea-date-sep, 
.ea-date-sep-hour-min 
{
	font-family: Verdana;
}

/* Pour les textes libres au format HTML */
.ea-freetext 
{
	white-space: nowrap;
}

.ea-freetext p 
{
	margin: 0;
}

/* pour les champs DM */
.ea-upload-boxfield .ea-combo 
{
	vertical-align: middle;
}

.ea-upload-boxbt 
{
	display: inline-block;
	vertical-align: middle;
}

.ea-text-boxfield 
{
	white-space: nowrap;
}

.ea-radio 
{
	margin: 0 3px;
}

.ea-radio-sep 
{
	margin: 2px 0;
}

/* Champ carte */
.ea-map 
{
	border: 1px solid #ccc;
	border-radius: 2px;
}

.ea-map-boxbt 
{
	position: absolute;
	top: -19px; /* Vérifier dans tous les thèmes si ok !!! */
	right: 0px;
}

.ea-fulltexttooltip 
{
	position:absolute;
	background-color: #3C4C53;
	padding:5px;
	border-radius: 6px;
	text-align:center;
	color: #fff;
}

.ea-fulltexttooltip:before 
{
	content: "";
	position: absolute;
	top: -5px;
	left: 50%;
	margin-left: -5px;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-bottom: 5px solid #3C4C53;
}

/* 
================================================================================
Champs de formulaires - Alignement
================================================================================
*/

.ea-box .ea-label, 
.ea-box .ea-text, 
.ea-box .ea-radio, 
.ea-box .ea-combo, 
.ea-box .ea-checkbox,
.ea-box .ea-bt-inputhelp, 
.ea-box .ea-bt-choose, 
.ea-box .ea-bt-add, 
.ea-box .ea-bt-open, 
.ea-box .ea-bt-del,
.ea-box .ea-date-day,
.ea-box .ea-date-month,
.ea-box .ea-date-year,
.ea-box .date-sep-day-month,
.ea-box .date-sep-month-year,
.ea-box .ea-date-hour,
.ea-box .ea-date-min,
.ea-box .date-sep-hour-min,
.ea-box .ea-bt-calend,
.ea-box .btraz, 
.ea-box .btsearch,
.ea-box .colorPicker,
.ea-box .ea-bt-zoomfield,
.ea-box .ea-file,
.ea-box .ea-link-boxfield,
.ea-box .ea-date-boxcriteria,
.ea-box .eaChpColor
{
	vertical-align: middle;
}

.ea-box .ea-label,
.ea-box .ea-link-boxbt,
.ea-box .eaChpColor
{
	display: inline-block;
}

.ea-box .ea-link-boxbt 
{
	margin:0;
}

.ea-box .link-info-box 
{
	display: inline-block;
    vertical-align: top;
	margin-left: 5px;
}

.ea-box .btraz, 
.ea-box .btsearch 
{
	margin-top: 0;
	margin-bottom: 2px;
	margin-left: 0;
	margin-right: 0;
}

.ea-box .eaChpColor
{
	position: relative;
}


/* 
================================================================================
Champs en erreur
================================================================================
*/

input.erreur,
textarea.erreur,
select.erreur, 
input[type="text"].inactif.erreur,
input[type="text"].inactif.erreur:focus,
textarea.inactif.erreur,
textarea.inactif.erreur:focus,
select.inactif.erreur, 
select.inactif.erreur:focus,
input.ea-modif.erreur,
select.ea-modif.erreur,
textarea.ea-modif.erreur,
input.ea-modif.erreur:focus,
select.ea-modif.erreur:focus,
textarea.ea-modif.erreur:focus,
iframe.erreur,
.ea-color-boxfield.erreur
{
	background-color: #FF7400;
}

.ea-checkbox.ea-modif.erreur,
.ea-checkbox.erreur 
{
	outline:2px solid #FF7400;
}

.ea-bt-showpassword.erreur
{
	color: #333;
}

div.erreur 
{
	color: #d2440d;
}
	
/* 
================================================================================
Menu utilisateur (Mon menu)
================================================================================
*/ 

div.shortCuts table td a
{
	color:#000;
	cursor:pointer;
}

div.shortCuts table tr td.eaShortcutItem 
{
    transition: all 100ms linear;
}

div.shortCuts table tr td.eaShortcutItem:hover 
{
	border-color:#000 !important;
	background-color: #fff !important;
}

div.shortCuts table td.title 
{
	height: 30px;
}

div.shortCuts table td 
{
	border-radius:3px;
}

#tbmsg 
{
	top:20px;
}

/* 
================================================================================
Pictos
================================================================================
*/ 

.btsais 
{
	left: 0px;
	width: 100%;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
}   

button.ea-bt {
	border-style: none;
	background-color: transparent;
	padding: 0;
}

.ea-bt-small-shared,
.ea-bt-small-add,
.ea-bt-small-del,
.ea-bt-shared,
.ea-bt-inputhelp,
.ea-bt-choose,
.ea-bt-add,
.ea-bt-calend,
.ea-bt-copy, 
.ea-bt-modify,
.ea-bt-open,
.ea-bt-maxea,
.ea-bt-del,
.ea-bt-paste,
.ea-bt-index,
.ea-bt-today,
.ea-bt-next,
.ea-bt-previous,
.ea-bt-title,
.ea-bt-zoomfield
{
  	border-radius:2px;
}

.ea-bt-small-shared,
.ea-bt-small-add,
.ea-bt-small-del 
{
	width: 12px;
	height: 12px;
	overflow: hidden;
	display: inline-block;
	cursor: pointer;

	border: 0;
	padding: 0;
}

.ea-bt-small-shared img:hover,
.ea-bt-small-add img:hover,
.ea-bt-small-del img:hover 
{
	left: -12px;
}

.ea-bt-shared,
.ea-bt-inputhelp,
.ea-bt-choose,
.ea-bt-add,
.ea-bt-calend,
.ea-bt-copy, 
.ea-bt-modify,
.ea-bt-open,
.ea-bt-maxea,
.ea-bt-del,
.ea-bt-paste,
.ea-bt-index,
.ea-bt-today,
.ea-bt-zoomfield,
.ea-calend-bt-next-week,
.ea-calend-bt-previous-week,
.ea-calend-bt-previous-month,
.ea-calend-bt-next-month,
.agStart,
.agEnd
{
	width: 18px;
	height: 18px;
	overflow: hidden;
	display: inline-block;
	cursor: pointer;
	border:0;
	padding:0;
}

.ea-bt-add-xml 
{
	width: 53px;
	height: 18px;
}

.ea-bt-title 
{
	text-transform: none;
	padding: 0 11px;
	line-height: 24px;
	height: 24px;
	display: inline-block;
	border-radius:4px;
	cursor: pointer;
	border:0;
}

.ea-bt-mail img,
.bthelp img,
.bthelp_popup img,
.ea-bt-small-shared img,
.ea-bt-small-add img,
.ea-bt-small-del img,
.ea-bt-shared img,
.ea-bt-inputhelp img,
.ea-bt-choose img,
.ea-bt-add img,
.ea-bt-calend  img,
.ea-bt-copy img,
.ea-bt-modify img,
.ea-bt-open img,
.ea-bt-maxea img,
.ea-bt-del img,
.ea-bt-paste img,
.ea-bt-index img,
.ea-bt-today img,
.ea-bt-print img,
.ea-bt-shared img,
.ea-bt-zoomfield img,
.ea-calend-bt-next-week img,
.ea-calend-bt-previous-week img,
.ea-calend-bt-previous-month img,
.ea-calend-bt-next-month img,
.agStart img,
.agEnd img
{
	position: relative;
}

.ea-bt-title img 
{
	vertical-align: middle;
}

.ea-bt-shared img:hover,
.ea-bt-inputhelp img:hover,
.ea-bt-choose img:hover,
.ea-bt-add img:hover,
.ea-bt-calend  img:hover,
.ea-bt-copy img:hover,
.ea-bt-modify img:hover,
.ea-bt-open img:hover,
.ea-bt-maxea img:hover,
.ea-bt-del img:hover,
.ea-bt-paste img:hover,
.ea-bt-index img:hover,
.ea-bt-today img:hover,
.ea-bt-zoomfield img:hover,
.ea-calend-bt-next-week img:hover,
.ea-calend-bt-previous-week img:hover,
.ea-calend-bt-previous-month img:hover,
.ea-calend-bt-next-month img:hover,
.agStart img:hover,
.agEnd img:hover
{
	left: -18px;
}

.ea-bt.history2.evid 
{
	border:1px solid #ff0d00;
}

.ea-bt-add-xml img:hover 
{
	left: -53px;
}

.ea-bt-title:hover img 
{
	vertical-align: top;
}

.ea-bt-title.ea-icon:before
{
	position: relative;
}

.ea-bt-title:hover.ea-icon:before 
{
  top: -2px;
}

.btdansliste .ea-bt-shared, 
.btdansliste .ea-bt-maxea, 
.ea-lst-cellbt .ea-bt-shared,
.ea-lst-cellbt .ea-bt-maxea
{
	margin-left: 1px;
}

a.eaBtSelection 
{
	display:inline-block
}

.bthelp 
{
	display: block;
	position: absolute;
	overflow: hidden;
	top: 46px;
	width:44px;
	height:18px;
	z-index:11;
	height:24px;
	width:24px;
	top:80px;
	right:35px;
}

.bthelp img 
{
	position:relative;
}

.bthelp:hover img 
{
	left:-24px;
}

.ea-bt-mail 
{
	width: 22px;
	height: 14px;
	overflow: hidden;
	display: block;
}

.ea-bt-mail img:hover 
{
	left: -22px;
}

.ea-bt-print 
{
	height: 16px;
	overflow: hidden;
	display: inline-block;
	background: none;
	border: 0;
	padding:0;
	cursor: pointer;	
}

.ea-bt-print img 
{
	vertical-align: text-top;
}

.ea-bt-print img:hover 
{
	top: -16px;
}

a.ea-bt-print:hover 
{
	color: orange;
}

.ea-bt-next 
{
    right: 20px;
}

.ea-bt-next, 
.ea-bt-previous 
{
    background: none repeat scroll 0 0 black;
    cursor: pointer;
    display: inline-block;
    height: 18px;
    overflow: hidden;
    top: 5px;
    width: 27px;
}

/* boutons documents liés dans les listes*/
.liste .ea-bt-shared,
.liste .ea-bt-add,
.liste .ea-bt-copy, 
.liste .ea-bt-maxea,
.liste .ea-bt-del 
{
	margin-right:2px;
}

.ea-icon.no-margin:before
{
	margin-right:0;
}

.ea-bt.ea-bt-title 
{
	width:auto;
}

.ea-bt.ea-bt-title:before,
.ea-bt.ea-bt-title:hover:before 
{
	color:inherit;
	float: none;
	font-size:12px;
}

.ea-bt.ea-bt-title:hover:before 
{
	vertical-align: top;
}

/* Bouton ayant l'apparence d'un lien */
.ea-bt-link {
	border: 0;
	padding: 0;
	cursor: pointer;
	background-color: transparent;
	/*color:inherit;*/
	font-size: inherit;
	font-family: inherit;
	font-weight: inherit;
	text-decoration: underline;
}

/* 
================================================================================
Statistiques
================================================================================
*/

#divexportexcel,
#props,
#propsexcel,
#tabs 
{
	border: 1px solid white;
	margin-top: 10px;
	padding: 5px;
}

#props,
#propsexcel 
{
	border-style:dashed;
	border-color:red;
}

#tabs input,
#divexportexcel input[type=text],
#propsexcel input[type=text] 
{
	width:100px;
}

#props input 
{
	width:80px;
}

#divexportexcel select,
#propsexcel select,
#tabs select 
{
	margin-left:0;
	width:105px;
}

#divexportexcel input.boutons,
#divexportexcel input.boutons:hover,
#props input.boutons, 
#props input.boutons:hover,
#propsexcel input.boutons, 
#propsexcel input.boutons:hover,
#tabs input.boutons, 
#tabs input.boutons:hover 
{
    width: 100px;
}

/* 
================================================================================
Agenda
================================================================================
*/

div.calendrier .calendrier_lettre 
{
	color:#fff;
	background-color:#000;
}

table.calendrier 
{
	background-color:#fff;
}

div.calendrier td.calendrier_jourSem 
{
	color:#7e8b8c;
}

td.calendrier_weekend 
{
	color:#DAB751;
}

div.calendrier td.calendrier_existe 
{
	background-color:#d67641;
	color:#fff;
}

.calendrier_jour_sem
{
	font-size: 14px;
}

a.agendalien 
{
	text-decoration : underline;
}

.ea-ctl-titles.agenda #libhis1,
.ea-ctl-titles.agenda #libhis2,
.ea-ctl-titles.agenda #libhis4,
.ea-ctl-titles.agenda #libhis5 
{
	position: absolute;
}

.ea-ctl-titles.agenda #libhis1,
.ea-ctl-titles.agenda #libhis4 
{
	top: 5px;
}

.ea-ctl-titles.agenda #libhis2,
.ea-ctl-titles.agenda #libhis5 
{
	top: 18px;
}

.ea-ctl-titles.agenda #libhis1,
.ea-ctl-titles.agenda #libhis2 
{
	left: 60px;
}

.ea-ctl-titles.agenda #libhis4,
.ea-ctl-titles.agenda #libhis5 
{
	right: 0px;
}

/* 
================================================================================
Choix d'un moyen - Titres hérités d'un dossier
================================================================================
*/

.ea-ctl-titles.moyen #libhis1,
.ea-ctl-titles.moyen #libhis2,
.ea-ctl-titles.moyen #libhis4,
.ea-ctl-titles.moyen #libhis5 
{
	position: absolute;
}

.ea-ctl-titles.moyen #libhis1,
.ea-ctl-titles.moyen #libhis4 
{
	top: 5px;
}

.ea-ctl-titles.moyen #libhis2,
.ea-ctl-titles.moyen #libhis5 
{
	top: 18px;
}

.ea-ctl-titles.moyen #libhis1,
.ea-ctl-titles.moyen #libhis2 
{
	left: 60px;
}

.ea-ctl-titles.moyen #libhis4,
.ea-ctl-titles.moyen #libhis5 
{
	right: 0px;
}

/* 
================================================================================
Popup Photos
================================================================================
*/
	
tr td.ea-photo-popup-title 
{
	height: 20px;
	padding-right: 2px;
	padding-top: 2px;
}

tr td.ea-photo-popup-title div#zoomTitle 
{
	color: white;
	font-size: 12px;
	height: 22px;
	line-height: 20px;
}

div#divzoom 
{
	box-shadow: 5px 5px 15px #888888;
}

div#divzoom tr 
{
	background-color: white;
}

.ea-photo-popup-close 
{
	width: 16px;
	height: 16px;
	overflow: hidden;
	display: inline-block;
	float: right;
	cursor: pointer;
	margin-right: 2px;
	margin-top: 2px;
}

.ea-photo-popup-close img 
{
	position: relative;
}

.ea-photo-popup-close img:hover 
{
	left: -16px;
}

/* 
================================================================================
Saisie via deux SELECT multiple (Evénements favoris / Droits d'accès menus) 
================================================================================
*/	

option.drtacquis, 
option.ea-selected 
{
	color: #7e8b8c;
}

option.drtpossible, 
option.ea-possible 
{
	color: red;
}

/* 
================================================================================
Barres de progression - Paramétrage
================================================================================
*/
   
.jauge 
{
	/*background-color:#FFFFCC;*/
	z-index: 1;
	transition: width 250ms;
	border-radius: 8px;
	background: linear-gradient(to right, #0195fd, #87dbff); /* dégradé bleu */
}

.jaugeConteneur 
{
	/*border: 1px solid black;*/
	border: none;
	border-radius: 8px;
	background-color: #dcdcdc;
	overflow: hidden;
}

.progressBarContainer 
{
	display: none;
	height: 16px;
	/*border: 1px solid;*/
	position: relative;
	/*margin-left: auto; */
	/*margin-right: auto;*/
	/*border-radius: 2px;*/
	
	border: none;
	border-radius: 8px;
	margin-left: 0;
	margin-right: 0;
	background-color: #dcdcdc;
	max-width: 700px;
	overflow: hidden;
}

.progressBar 
{
	position: absolute;
	height: 16px;
	width: 0;
	left: 0;
	
	transition: width 250ms;
	border-radius: 8px;
	background: linear-gradient(to right, #fdcd01, #ffe887); /* dégradé jaune */
	background: linear-gradient(to right, #fd6a01, #ffb787); /* dégradé orange */
	background: linear-gradient(to right, #c59ae2, #88caff); /* dégradé bleu violet */
	background: linear-gradient(to right, #0195fd, #87dbff); /* dégradé bleu */
}

.progressBarCount 
{
	position: relative;
	text-align: center;
	z-index: 99;
    display: inline-block;
    width: 100%;
}

/* 
================================================================================
Editeur HTML TINYMCE PERSONNALISE
================================================================================
*/

div.htmleditorpreview 
{
	background-color:#fff;
}

.ea-tinymce iframe,
.ea-tinymce .tox-edit-area textarea 
{
	border: 1px solid #ccc;
    border-radius: 2px;
    background-color:#fff;
}

.ea-tinymce .tox 
{
	font-size:12px;
}

.ea-tinymce .tox .tox-tbtn,
.ea-tinymce .tox .tox-tbtn:hover,
.ea-tinymce .tox .tox-tbtn:focus
{
	border:1px solid #b1b1b1;
	border-radius: 3px;
}

.ea-tinymce .tox .tox-tbtn > * 
{
	opacity:0.5;
}

.ea-tinymce .tox-tinymce 
{
	border:none;
}

.ea-tinymce .tox-toolbar-overlord 
{
	background-color: transparent !important;
}

.ea-tinymce .tox .tox-edit-area 
{
	border: 1px solid #ccc;
	background-color:white;	
}

.ea-attach .ea-tinymce .tox-edit-area 
{
	border-left-color: transparent;
	border-right-color: transparent;
	border-bottom-color: transparent;  
}

.ea-tinymce .tox-toolbar__primary 
{
	background-color:transparent !important;
}

.ea-tinymce .tox .tox-tbtn 
{
	padding:1px 2px; 
	margin:0 0 2px 2px; 
	background-color:white; 
	height:26px;
}

.ea-tinymce .tox .tox-split-button 
{
	margin:0 0 2px 2px;
}

.ea-tinymce .tox .tox-tbtn--select 
{
	font-size:13px;
}

.ea-tinymce .tox .tox-tbtn .tox-icon 
{
	transform: scale(0.9);
}

.ea-tinymce .tox .tox-tbtn:hover,
.ea-tinymce .tox .tox-tbtn:focus 
{
	background-color : #e3e3e3;
}

.ea-tinymce .tox .tox-tbtn--enabled, 
.ea-tinymce .tox .tox-tbtn--enabled:hover 
{
	background-color: #dbdbdb;
}

.ea-tinymce .tox .tox-tbtn--disabled:hover 
{
	background-color:white;
}

.ea-tinymce.inactif .tox-editor-header 
{
	visibility:hidden; /* masquage toolbar quand inactif */
}

/* color box */
.tox .tox-swatch 
{
	width: 17px !important;
	height: 17px !important;
	margin: 1px;
}

.tox .tox-swatch:hover 
{
	transform: scale(0.9) !important;
}

.tox .tox-swatches-menu 
{
	overflow: visible !important;
}

/* TinyMCE - SMALL */ 
.ea-tinymce.small .tox-toolbar__primary 
{
	justify-content: flex-end;
}

.ea-tinymce.small .tox .tox-tbtn 
{
	height:22px; 
	width:22px
}

.ea-tinymce.small .tox .tox-split-button__chevron 
{
	width:16px
}

.ea-tinymce.small .tox .tox-tbtn--select 
{
	width:auto;
}

.ea-tinymce.small .tox .tox-tbtn .tox-icon 
{
	transform: scale(0.8);
}

/* 
================================================================================
Color Picker
================================================================================
*/

.pickerBox 
{
	background-color:#efefef;
	border-radius:4px;
	border:3px solid #ccc;
	/**La police sera toujours fixe pour le colorpicker**/
	font-family:Arial,helvetica;
	font-size:12px;
	box-shadow: 1px 0 4px 0 rgba(0, 0, 0, 0.2);
}

.pickerBox #paletteMessage  
{
	width:357px;
}

.pickerBox .currentColor 
{
    border: 2px solid grey;
    height: 15px;
    width: 32px;
    cursor:pointer;
}

.pickerBox .currentColor:hover 
{
	border-color: #bbb;
}

.pickerBox #eapalette-btClose
{
	background-color: #005f85;
}

.pickerBox input.eapalette-valann 
{
	background-color: #ffffcc;
	cursor:pointer;
	border:1px solid #330000;
	border-radius:3px;
	width:65px;
	padding:1px;
	text-shadow: 1px 1px 0 #fff;
}

.pickerBox input.eapalette-valann:hover 
{
	background-color: #c0c0c0;
}

.pickerBox input.eapalette-valann[disabled] 
{
	background-color: #eee;
	cursor:default;
	border-color:#eee;
}

.pickerBox #eapalette-refPosValider 
{
    padding-top:5px;
    text-align:center;
}

.pickerBox #eapalette-btValider 
{
	margin-right:2px;
}

.pickerBox .coul 
{
	width:15px;
	height:15px;
	cursor:pointer;
	float:left;
	position:relative;
	margin-right:1px;
	margin-bottom:1px;
	border-color: black;
    border-image: none;
    border-style: solid;
    border-width: 1px;
}

.pickerBox .coul:hover 
{
	border-color: #fff;
}

.pickerBox #recentcolorlist 
{
	margin-top:3px;
	height: 58px;
}

.pickerBox #inputColorBox 
{
	margin-top:8px;
	border:1px solid #ccc;
	border-radius:2px;
	background-color:#ddd;
	width: 110px;
}

.pickerBox #color 
{
	border:1px solid #ddd;
	border-radius:2px;
}

.pickerBox #emptyDefaultColor 
{
	background-color:#ddd;
	border-radius:2px;
	padding:2px;
	border:1px solid #ccc;
}

/*
================================================================================
Pagination - Général
================================================================================
*/

.ea-pager
{
	margin-top:10px;
	white-space: normal;

	display: flex;
	align-items: center;
	box-sizing: border-box;
}

.ea-pager > .pagerPagesList
{
	display: flex;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.ea-pager > .pagerPagesList > li
{
	margin: 2px;
	align-self: stretch;
}

.ea-pager .pagerPrevImage,
.ea-pager .pagerNextImage
{
	position:relative;
	top:4px;
}

.ea-pager .pagerPrevImage img,
.ea-pager .pagerNextImage img
{
	border:none;
}

.ea-pager .pagerCounterPages 
{
	line-height: 1.72em; /* pour l'alignement vertical avec le div qui entoure .pagerLimitBox */
}

.ea-pager a.pagerFirst, 
.ea-pager a.pagerPrev, 
.ea-pager a.pagerPage, 
.ea-pager a.pagerNext, 
.ea-pager a.pagerLast
{
	border: 1px solid #ccc;
	padding: 1px 2px 1px 2px;
	color: #312E2E;
	margin-right: 0px;
}

.ea-pager a.pagerFirst:hover, 
.ea-pager a.pagerPrev:hover, 
.ea-pager a.pagerPage:hover, 
.ea-pager a.pagerNext:hover, 
.ea-pager a.pagerLast:hover
{
	color: white;
	background-color: #312E2E;
	border-color: #555552;
}

.ea-pager .pagerCurrent
{
	font-weight: bold;
}

.ea-pager .pagerChangePage input[type="text"] 
{
	width: 40px;
	margin-right: 2px;
}

/*
================================================================================
Pagination - Vue "mix2"
================================================================================
*/

.ea-pager.mix2 > .pagerCounterPages
{
	white-space: nowrap;
	margin-right: 15px;
}

.ea-pager.mix2 > .pagerLimitBox
{
	white-space: nowrap;
	margin-left: 15px;
	flex-grow: 1;
	text-align: right;
}

/*
================================================================================
Pagination - Vue "mix2zones"
================================================================================
*/

.ea-pager.mix2zones > .pagerCounterPages
{
	white-space: nowrap;
}

.ea-pager.mix2zones > .pagerPagesList
{
	margin: 0 15px;
}

.ea-pager.mix2zones > .pagerLimitBox
{
	margin-left: auto;
	white-space: nowrap;
}

/* 
================================================================================
Changement de mot de passe - jauge de complexité 
================================================================================
*/

#complexitypswdprogress 
{
	display:block;
	background-color:#f5f5f5;
	height:15px;
	border-radius: 3px;
	box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1) inset;
	overflow:hidden;
}

#complexitypswdprogressbar 
{
	display:block;
	height:100%;
}

#complexitypswdinfo 
{
	display:block;
	text-align:center;
	margin-top:4px;
}

/* 
================================================================================
Bouton Lire plus/moins
================================================================================
*/

.ea-readMoreSection 
{
	display: none;
}

table.liste tr td .ea-readMore,
table.liste tr:hover td.liste1 .ea-readMore,
table.liste tr:hover td.liste2 .ea-readMore,
ul.treeview li.child .ea-readMore 
{
	padding: 1px 8px;
	margin-left: 5px;
	border-radius: 3px;
	white-space: nowrap;
	cursor: pointer;
	border: none;
}

/*
================================================================================
Classes pour cacher/masquer un élement

Laisser le "!important" sinon risque d'écrasement plus bas dans ce fichier
ou dans les fichiers CSS suivants
================================================================================
*/

.ea-hide
{
	display:none !important;
}

.ea-mask
{
	visibility:hidden !important;
}

/* Cache sur l'écran tout en restant visible aux lecteurs d'écrans */
.ea-vhide 
{
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

/*
================================================================================
Champs bouée
================================================================================
*/

.ea-link-box .ea-label 
{
	display: inline-block;
}

.ea-link-boxbt 
{
	display: inline-block; 
	vertical-align: top;
}

.ea-link-boxbt a 
{
	margin-left: 2px;
}

/* champ multiple bouée */
.ea-multiple-boxbt {top: -20px; right: 0; position: absolute;}
.ea-multiple-boxbt .ea-icon.ea-bt:before {font-size: 11px;}
.ea-multiple-boxbt .ea-icon.ea-bt:hover:before {font-size: 13px;}
		
.ea-link-label 
{
	position :absolute;
}

/* Bouton d'ouverture pour le menu utilisateur permanent */
#buttonOpenMenuUtil 
{
	cursor:pointer;
	position:absolute;
	z-index:12;
	top:3px;
	right:3px;
	width:40px;
	height:16px;
	background-color:#fff;
	border : 2px solid #cbd0d3;
	padding:2px;
	border-radius:2px;
}

#buttonOpenMenuUtil img 
{
	width:70%;
}

#buttonOpenMenuUtil span 
{
	display:block;
	height:100%;
	width:24%;
	background-color:#f1c40f;
	position:absolute;
	top:0;
	right:0;
	transition:all 0.2s ease-in-out;
}

#buttonOpenMenuUtil span img 
{
	width:50%;
	margin-top:5px;
	margin-left:25%;
}

#buttonOpenMenuUtil:hover span 
{
	background-color:rgb(245,214,87);
}

/*
================================================================================
Maps openstreetmap
================================================================================
*/

div.eaosmap 
{
	height:100%;
}

.loadmapstepbox 
{
  position: absolute;
  top: 40%;
  left: 40%;
  width : 250px;
  height: 60px;
  text-align: center;
  background-color: #eee;
  padding: 4px;
  border-radius:5px;
}

.loadmapstepbox .btstop 
{
	margin-top:5px;
}

.leaflet-popup-content 
{
	max-height: 390px;
	overflow:auto;
}

.leaflet-bar.ea-leafletbox 
{
	position: absolute;
	left: 10px;
}

.leaflet-bar a.ea-btnleaflet 
{
	cursor:pointer;
}

.leaflet-bar .ea-leafletimg 
{
	margin-top:4px
}

.leaflet-touch .leaflet-bar .ea-leafletimg 
{
    margin-top: 6px;
}

.eaosmap .leaflet-draw-toolbar a,
.leaflet-draw-toolbar a.ea-btnleaflet 
{
	background-image: url('../../core/lib/Ext/leaflet/draw/src/images/spritesheet.png');
}

div.geosearch-wait,
div.geosearch-modal 
{
	width:100%;
	height:100%;
	position:absolute;
}

div.geosearch-modal 
{
	cursor:wait;
	opacity: 0.3;
	background-color: #000;
}

.geosearch-loader 
{
	width:100px;
	height:100px;
	background-color:white;
	position:absolute;
	top:40%;
	display:table-cell;
	vertical-align:middle;
	left:45%;
	border-radius: 4px;
	box-shadow: 0 1px 5px rgba(0, 0, 0, 0.65);
}

.geosearch-loader img 
{
	margin-top:16px;
}

/* champ concerné par le panneau latéral ouvert (exemple date...)*/
.side-wrapper-sel
{
	box-shadow: 0 0 3px #ad0e24;
	border-color:#ad0e24 !important;
}

/* Bandeau section */
.bd-section 
{
	position: relative;
	background-color: #eee;
	border-radius: 2px;
	padding: 4px 5px;
	margin-bottom: 5px;
	margin-top: 5px;
}

.bd-section-small
{
	position: relative;
	background-color: #eee;
	border-radius: 2px;
	padding: 1px 4px;
	margin-bottom: 5px;
	margin-top: 5px;
}

/* 
================================================================================
Tooltip
================================================================================
*/

.ea-tooltip
{
	position: absolute;
	font-weight: normal;
	padding: 5px 3px;
	border-radius: 2px;
	text-align: center;
	line-height: 1;
	box-shadow: 0 0 3px rgba(0,0,0,0.2), 0 1px 2px rgba(0,0,0,0.5);
	pointer-events: none;
	font-size: 12px;
	white-space: nowrap;
}

.ea-bt-tooltip
{
	padding-top: 2px;
	padding-bottom: 2px;
}

.ea-tooltip:after
{
	content: "";
	position: absolute;
	height: 0;
	margin: 0 0 0 -6px;
	line-height: 0;
}

/* tooltip avec flèche en bas */
.ea-tooltip-bottom:after
{
	bottom: -6px;
	border-right-width: 5px;
	border-right-style: solid;
	border-right-color: transparent;
	border-left-width: 5px;
	border-left-style: solid;
	border-left-color: transparent;
	border-top-width: 6px;
	border-top-style: solid;
}

/* tooltip avec flèche à droite */
.ea-tooltip-right:after
{
	bottom: 5px;
	border-top-width: 5px;
	border-top-style: solid;
	border-top-color: transparent;
	border-bottom-width: 5px;
	border-bottom-style: solid;
	border-bottom-color: transparent;
	border-left-width: 7px;
	border-left-style: solid;
}

/* pour les champs MK */
.ea-geomk-boxfield .ea-combo 
{
	vertical-align:top;
}

.ea-geomk-boxbt 
{
	display: inline-block;
	vertical-align: top;
}

.ea-geomk-boxbt * 
{
	vertical-align: top;
}

a.previewgeomarqueur 
{
	display:inline-block;
	height:24px;
}

.ea-geomk-boxbt a.previewgeomarqueur 
{
	margin-top:-3px;
}

a.previewgeomarqueur img 
{
	height:100%;
	cursor:pointer;
}

/*
================================================================================
Boutons "circulaires" Plusieurs valeurs
================================================================================
*/

.ea-icon:before 
{
	margin-right:4px;
}

/*
================================================================================
Champs d'audit
================================================================================
*/

.ea-audit-box div
{
	line-height: 0;
}

.ea-audit-box > div:nth-child(2)
{
	margin-top:2px;
}


.ea-audit 
{
	font-size: 80%;
	line-height: normal;
}

.ea-bt 
{
	width:18px;
	height:18px;
	cursor:pointer;
	display: inline-block;
	vertical-align: top;
}

.ea-bt:before 
{
	font-size:16px;
	float: left;
	text-align:center;
	width: 18px;
	line-height:18px;
}

.ea-bt:hover:before 
{
	font-size:18px;
}

/*
================================================================================
Boutons icônes avec cadre utilisés notamment dans l'agenda pour les mini-calendriers
================================================================================
*/

.ea-bt-border 
{
	border-radius: 2px;
	border-style: solid;
	border-width: 1px;
}

/*
================================================================================
Liens hypertextes champs bouée
================================================================================
*/

a.ea-link-info,
a.ea-link-info:hover 
{
	text-decoration:underline;
	cursor:pointer;
	display:block;
	overflow:hidden;
	white-space: nowrap;
	height:17px;
}

/*
================================================================================
Champs icones : prévisualisation de l'icone
================================================================================
*/

.fieldiconprev 
{
	display:inline-block;
	border:1px dotted;
	width:28px;
	height:28px;
	vertical-align:top;
	text-align:center;
}

.fieldiconprev .ea-icon:before 
{
	width:28px;
	line-height:22px;
	float: left;
	font-size:22px;
}

.ea-icon.ea-icon-list:before,
.ea-icon.ea-icon-list:hover:before 
{
	font-size:22px;
}

/*
================================================================================
Picto type de dossier
================================================================================
*/

.pictotypdoss.ea-icon:before {
	font-size:22px;
}
.pictotypdoss {
	display:inline-block;
}
/*
================================================================================
Scrolling de la barre d'onglets
================================================================================
*/

.ea-scrolltabs > #menussch
{
	overflow: hidden;
	white-space: nowrap;
}

.ea-scrolltabs
{
	position: relative;
	width: 99%;
	width: calc(100% - 5px);
}

div.conteneur.nopanelleft .ea-scrolltabs ul.menu2 
{
	width: 100% !important;
}

.ea-scrolltabs:not(.ea-scroll-off) .lastLiVisible /* Elem avec class ea-scrolltabs mais pas ea-scroll-off */
{
	margin-right: 55px;
}

.bt-scroll
{
	display: block;
	position: absolute;
	bottom: 2px;
	z-index: 9;
	height: 20px;
	width: 24px;
	border: 1px solid #ccc;
	border-radius: 2px;
	box-sizing: border-box;
	background: rgba(243, 243, 243, 0.91);
	text-align: center;
}

.bt-scroll::before, 
.ea-bt:hover.bt-scroll::before 
{
	color: #5d5d5d;
	margin: 0;
	font-size: 12px;
}

#bt-scrollleft
{
	right: calc(1% + 25px)
}

.nopanelleft #bt-scrollleft
{
	right: calc(0px + 25px)
}

#bt-scrollright
{
	right: calc(1% + 2px);
}

.nopanelleft #bt-scrollright
{
	right: 2px;
}

.ea-bt.ea-btscroll-off::before,
.ea-bt:hover.ea-btscroll-off::before 
{
	color: #ccc;
	cursor: default;
}

/*
================================================================================
Bouton permettant d'agrandir/réduir les boutons de contrôleurs à gauche
================================================================================
*/

.ea-btexpandpanelleft 
{
	width:22px;
	height:22px;
	position:absolute;
	top:76px;
	cursor:pointer;
	left:10px;
	font-size:16px;
	background-color:rgba(255,255,255,0.7);
	border-radius:50%;
	border: none;
	padding: 0;
}

.ea-btexpandpanelleft:before 
{
	float:left;
	text-align:center;
	width:22px;
	line-height:22px;
}

.ea-btexpandpanelleft:hover 
{
	box-shadow:inset 0 -2px 0 rgba(0,0,0,.135);
}

/*
================================================================================
Affichage lorsque les boutons de contrôleurs à gauche sont réduits
================================================================================
*/

.btbandeau.collapsed .labelMenuButton,
.ea-icon.emptycollapsed:before,
a.menuButton.ea-icon.emptycollapsed:before,
.menuButton.ea-icon.emptycollapsed:before
{
	display:none;
}

.btbandeau.collapsed .ea-icon.emptycollapsed:before 
{
	display:block;
}

.btbandeau.collapsed .menuSection 
{
	visibility:hidden;
}

.btbandeau.collapsed .menuButton  
{
	width:42px;
}

.btbandeau.collapsed 
{
	width:55px;
}

.btbandeau.mouseoverexpanded 
{
	background-color:rgba(255,255,255,0.7);
	height:100%;
}

.btbandeau.collapsed .ea-ctl-panel-message 
{ 
	/* messages importants dans les blocs en rouge ou vert dans les controleurs*/
	width:18px;
}

.ea-ctl-panel-message.ea-icon.ellipsis-h:before 
{
	display:none;
}

.btbandeau.collapsed .ea-ctl-panel-message.ea-icon.ellipsis-h:before 
{
	display:block;
}

.btbandeau.collapsed .ea-ctl-panel-message span 
{
	display:none;
}

/*
================================================================================
Masquage des boutons de controleurs à gauche "Accueil" et "Retour"
(Ces boutons seront dans le menu utilisateur en haut)
================================================================================
*/

.menuButton.ea-icon.back,
.menuButton.ea-icon.home 
{
	display:none;
}

/*
================================================================================
Boutons contrôleur horizontaux
================================================================================
*/

.ea-ctl {
	display: flex;
	align-items: flex-end;
}

.ea-ctl-middle {
	justify-content: end;
}

.ea-ctlsavebox {
	white-space : nowrap;
}

div.conteneur div.ea-ctl-bottom 
{
	left: 20px;
	position: absolute;
	padding: 0;
	top: auto;
	bottom: 20px;
	width: calc(99% - 20px);
}

div.conteneur div.ea-ctl-bottom-right
{
	left: 20px;
	position: absolute;
	padding: 0;
	top: auto;
	bottom: 20px;
	width: calc(99% - 20px);
	justify-content: end;
}

/* Controleurs en mode "sans boutons à gauche" */
div.conteneur.nopanelleft div.fondCorps,
div.conteneur.tabstop div.fondCorps 
{
	left: 15px;
}

div.conteneur.nopanelleft div.corpsg,
div.conteneur.tabstop div.corpsg 
{
	width: calc(100% - 30px);
	left:20px;
	top:115px;
}

div.conteneur.nopanelleft.npllist div.corpsg  
{
	height: calc(100% - 115px - 47px); /* 100% - position top - hauteur boutons contrôleur en bas des listes */
}

/* 
================================================================================
Librairie animate.css
Version - 3.7.0 modifiée !
- on a retiré tout les CSS avec préfixe constructeurs (webkit))
- on a préfixé toutes les classes par "animate__" (idem V4 de animate.css)
http://daneden.me/animate
Licensed under the MIT license - http://opensource.org/licenses/MIT
Copyright (c) 2018 Daniel Eden
================================================================================
*/

@keyframes bounce {
  from,
  20%,
  53%,
  80%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
    transform: translate3d(0, 0, 0);
  }

  40%,
  43% {
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    transform: translate3d(0, -30px, 0);
  }

  70% {
    animation-timing-function: cubic-bezier(0.755, 0.05, 0.855, 0.06);
    transform: translate3d(0, -15px, 0);
  }

  90% {
    transform: translate3d(0, -4px, 0);
  }
}

.animate__bounce {
  animation-name: bounce;
  transform-origin: center bottom;
}

@keyframes flash {
  from,
  50%,
  to {
    opacity: 1;
  }

  25%,
  75% {
    opacity: 0;
  }
}

.animate__flash {
  animation-name: flash;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@keyframes pulse {
  from {
    transform: scale3d(1, 1, 1);
  }

  50% {
    transform: scale3d(1.05, 1.05, 1.05);
  }

  to {
    transform: scale3d(1, 1, 1);
  }
}

.animate__pulse {
  animation-name: pulse;
}

@keyframes rubberBand {
  from {
    transform: scale3d(1, 1, 1);
  }

  30% {
    transform: scale3d(1.25, 0.75, 1);
  }

  40% {
    transform: scale3d(0.75, 1.25, 1);
  }

  50% {
    transform: scale3d(1.15, 0.85, 1);
  }

  65% {
    transform: scale3d(0.95, 1.05, 1);
  }

  75% {
    transform: scale3d(1.05, 0.95, 1);
  }

  to {
    transform: scale3d(1, 1, 1);
  }
}

.animate__rubberBand {
  animation-name: rubberBand;
}

@keyframes shake {
  from,
  to {
    transform: translate3d(0, 0, 0);
  }

  10%,
  30%,
  50%,
  70%,
  90% {
    transform: translate3d(-10px, 0, 0);
  }

  20%,
  40%,
  60%,
  80% {
    transform: translate3d(10px, 0, 0);
  }
}

.animate__shake {
  animation-name: shake;
}

@keyframes headShake {
  0% {
    transform: translateX(0);
  }

  6.5% {
    transform: translateX(-6px) rotateY(-9deg);
  }

  18.5% {
    transform: translateX(5px) rotateY(7deg);
  }

  31.5% {
    transform: translateX(-3px) rotateY(-5deg);
  }

  43.5% {
    transform: translateX(2px) rotateY(3deg);
  }

  50% {
    transform: translateX(0);
  }
}

.animate__headShake {
  animation-timing-function: ease-in-out;
  animation-name: headShake;
}

@keyframes swing {
  20% {
    transform: rotate3d(0, 0, 1, 15deg);
  }

  40% {
    transform: rotate3d(0, 0, 1, -10deg);
  }

  60% {
    transform: rotate3d(0, 0, 1, 5deg);
  }

  80% {
    transform: rotate3d(0, 0, 1, -5deg);
  }

  to {
    transform: rotate3d(0, 0, 1, 0deg);
  }
}

.animate__swing {
  transform-origin: top center;
  animation-name: swing;
}

@keyframes tada {
  from {
    transform: scale3d(1, 1, 1);
  }

  10%,
  20% {
    transform: scale3d(0.9, 0.9, 0.9) rotate3d(0, 0, 1, -3deg);
  }

  30%,
  50%,
  70%,
  90% {
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
  }

  40%,
  60%,
  80% {
    transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
  }

  to {
    transform: scale3d(1, 1, 1);
  }
}

.animate__tada {
  animation-name: tada;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@keyframes wobble {
  from {
    transform: translate3d(0, 0, 0);
  }

  15% {
    transform: translate3d(-25%, 0, 0) rotate3d(0, 0, 1, -5deg);
  }

  30% {
    transform: translate3d(20%, 0, 0) rotate3d(0, 0, 1, 3deg);
  }

  45% {
    transform: translate3d(-15%, 0, 0) rotate3d(0, 0, 1, -3deg);
  }

  60% {
    transform: translate3d(10%, 0, 0) rotate3d(0, 0, 1, 2deg);
  }

  75% {
    transform: translate3d(-5%, 0, 0) rotate3d(0, 0, 1, -1deg);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.animate__wobble {
  animation-name: wobble;
}

@keyframes jello {
  from,
  11.1%,
  to {
    transform: translate3d(0, 0, 0);
  }

  22.2% {
    transform: skewX(-12.5deg) skewY(-12.5deg);
  }

  33.3% {
    transform: skewX(6.25deg) skewY(6.25deg);
  }

  44.4% {
    transform: skewX(-3.125deg) skewY(-3.125deg);
  }

  55.5% {
    transform: skewX(1.5625deg) skewY(1.5625deg);
  }

  66.6% {
    transform: skewX(-0.78125deg) skewY(-0.78125deg);
  }

  77.7% {
    transform: skewX(0.390625deg) skewY(0.390625deg);
  }

  88.8% {
    transform: skewX(-0.1953125deg) skewY(-0.1953125deg);
  }
}

.animate__jello {
  animation-name: jello;
  transform-origin: center;
}

@keyframes heartBeat {
  0% {
    transform: scale(1);
  }

  14% {
    transform: scale(1.3);
  }

  28% {
    transform: scale(1);
  }

  42% {
    transform: scale(1.3);
  }

  70% {
    transform: scale(1);
  }
}

.animate__heartBeat {
  animation-name: heartBeat;
  animation-duration: 1.3s;
  animation-timing-function: ease-in-out;
}

@keyframes bounceIn {
  from,
  20%,
  40%,
  60%,
  80%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }

  20% {
    transform: scale3d(1.1, 1.1, 1.1);
  }

  40% {
    transform: scale3d(0.9, 0.9, 0.9);
  }

  60% {
    opacity: 1;
    transform: scale3d(1.03, 1.03, 1.03);
  }

  80% {
    transform: scale3d(0.97, 0.97, 0.97);
  }

  to {
    opacity: 1;
    transform: scale3d(1, 1, 1);
  }
}

.animate__bounceIn {
  animation-duration: 0.75s;
  animation-name: bounceIn;
}

@keyframes bounceInDown {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    transform: translate3d(0, -3000px, 0);
  }

  60% {
    opacity: 1;
    transform: translate3d(0, 25px, 0);
  }

  75% {
    transform: translate3d(0, -10px, 0);
  }

  90% {
    transform: translate3d(0, 5px, 0);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.animate__bounceInDown {
  animation-name: bounceInDown;
}

@keyframes bounceInLeft {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  0% {
    opacity: 0;
    transform: translate3d(-3000px, 0, 0);
  }

  60% {
    opacity: 1;
    transform: translate3d(25px, 0, 0);
  }

  75% {
    transform: translate3d(-10px, 0, 0);
  }

  90% {
    transform: translate3d(5px, 0, 0);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.animate__bounceInLeft {
  animation-name: bounceInLeft;
}

@keyframes bounceInRight {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    transform: translate3d(3000px, 0, 0);
  }

  60% {
    opacity: 1;
    transform: translate3d(-25px, 0, 0);
  }

  75% {
    transform: translate3d(10px, 0, 0);
  }

  90% {
    transform: translate3d(-5px, 0, 0);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.animate__bounceInRight {
  animation-name: bounceInRight;
}

@keyframes bounceInUp {
  from,
  60%,
  75%,
  90%,
  to {
    animation-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
  }

  from {
    opacity: 0;
    transform: translate3d(0, 3000px, 0);
  }

  60% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }

  75% {
    transform: translate3d(0, 10px, 0);
  }

  90% {
    transform: translate3d(0, -5px, 0);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.animate__bounceInUp {
  animation-name: bounceInUp;
}

@keyframes bounceOut {
  20% {
    transform: scale3d(0.9, 0.9, 0.9);
  }

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

  to {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
}

.animate__bounceOut {
  animation-duration: 0.75s;
  animation-name: bounceOut;
}

@keyframes bounceOutDown {
  20% {
    transform: translate3d(0, 10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    transform: translate3d(0, -20px, 0);
  }

  to {
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }
}

.animate__bounceOutDown {
  animation-name: bounceOutDown;
}

@keyframes bounceOutLeft {
  20% {
    opacity: 1;
    transform: translate3d(20px, 0, 0);
  }

  to {
    opacity: 0;
    transform: translate3d(-2000px, 0, 0);
  }
}

.animate__bounceOutLeft {
  animation-name: bounceOutLeft;
}

@keyframes bounceOutRight {
  20% {
    opacity: 1;
    transform: translate3d(-20px, 0, 0);
  }

  to {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }
}

.animate__bounceOutRight {
  animation-name: bounceOutRight;
}

@keyframes bounceOutUp {
  20% {
    transform: translate3d(0, -10px, 0);
  }

  40%,
  45% {
    opacity: 1;
    transform: translate3d(0, 20px, 0);
  }

  to {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }
}

.animate__bounceOutUp {
  animation-name: bounceOutUp;
}

@keyframes fadeIn {
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}

.animate__fadeIn {
  animation-name: fadeIn;
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.animate__fadeInDown {
  animation-name: fadeInDown;
}

@keyframes fadeInDownBig {
  from {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.animate__fadeInDownBig {
  animation-name: fadeInDownBig;
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translate3d(-100%, 0, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.animate__fadeInLeft {
  animation-name: fadeInLeft;
}

@keyframes fadeInLeftBig {
  from {
    opacity: 0;
    transform: translate3d(-2000px, 0, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.animate__fadeInLeftBig {
  animation-name: fadeInLeftBig;
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translate3d(100%, 0, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.animate__fadeInRight {
  animation-name: fadeInRight;
}

@keyframes fadeInRightBig {
  from {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.animate__fadeInRightBig {
  animation-name: fadeInRightBig;
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.animate__fadeInUp {
  animation-name: fadeInUp;
}

@keyframes fadeInUpBig {
  from {
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.animate__fadeInUpBig {
  animation-name: fadeInUpBig;
}

@keyframes fadeOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.animate__fadeOut {
  animation-name: fadeOut;
}

@keyframes fadeOutDown {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(0, 100%, 0);
  }
}

.animate__fadeOutDown {
  animation-name: fadeOutDown;
}

@keyframes fadeOutDownBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(0, 2000px, 0);
  }
}

.animate__fadeOutDownBig {
  animation-name: fadeOutDownBig;
}

@keyframes fadeOutLeft {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(-100%, 0, 0);
  }
}

.animate__fadeOutLeft {
  animation-name: fadeOutLeft;
}

@keyframes fadeOutLeftBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(-2000px, 0, 0);
  }
}

.animate__fadeOutLeftBig {
  animation-name: fadeOutLeftBig;
}

@keyframes fadeOutRight {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(100%, 0, 0);
  }
}

.animate__fadeOutRight {
  animation-name: fadeOutRight;
}

@keyframes fadeOutRightBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(2000px, 0, 0);
  }
}

.animate__fadeOutRightBig {
  animation-name: fadeOutRightBig;
}

@keyframes fadeOutUp {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(0, -100%, 0);
  }
}

.animate__fadeOutUp {
  animation-name: fadeOutUp;
}

@keyframes fadeOutUpBig {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(0, -2000px, 0);
  }
}

.animate__fadeOutUpBig {
  animation-name: fadeOutUpBig;
}

@keyframes flip {
  from {
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, -360deg);
    animation-timing-function: ease-out;
  }

  40% {
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
    animation-timing-function: ease-out;
  }

  50% {
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
    animation-timing-function: ease-in;
  }

  80% {
    transform: perspective(400px) scale3d(0.95, 0.95, 0.95) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    animation-timing-function: ease-in;
  }

  to {
    transform: perspective(400px) scale3d(1, 1, 1) translate3d(0, 0, 0) rotate3d(0, 1, 0, 0deg);
    animation-timing-function: ease-in;
  }
}

.animate__animated.animate__flip {
  backface-visibility: visible;
  animation-name: flip;
}

@keyframes flipInX {
  from {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    animation-timing-function: ease-in;
  }

  60% {
    transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
    opacity: 1;
  }

  80% {
    transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
  }

  to {
    transform: perspective(400px);
  }
}

.animate__flipInX {
  backface-visibility: visible !important;
  animation-name: flipInX;
}

@keyframes flipInY {
  from {
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    animation-timing-function: ease-in;
    opacity: 0;
  }

  40% {
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    animation-timing-function: ease-in;
  }

  60% {
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1;
  }

  80% {
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
  }

  to {
    transform: perspective(400px);
  }
}

.animate__flipInY {
  backface-visibility: visible !important;
  animation-name: flipInY;
}

@keyframes flipOutX {
  from {
    transform: perspective(400px);
  }

  30% {
    transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
    opacity: 1;
  }

  to {
    transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
    opacity: 0;
  }
}

.animate__flipOutX {
  animation-duration: 0.75s;
  animation-name: flipOutX;
  backface-visibility: visible !important;
}

@keyframes flipOutY {
  from {
    transform: perspective(400px);
  }

  30% {
    transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
    opacity: 1;
  }

  to {
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    opacity: 0;
  }
}

.animate__flipOutY {
  animation-duration: 0.75s;
  backface-visibility: visible !important;
  animation-name: flipOutY;
}

@keyframes lightSpeedIn {
  from {
    transform: translate3d(100%, 0, 0) skewX(-30deg);
    opacity: 0;
  }

  60% {
    transform: skewX(20deg);
    opacity: 1;
  }

  80% {
    transform: skewX(-5deg);
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.animate__lightSpeedIn {
  animation-name: lightSpeedIn;
  animation-timing-function: ease-out;
}

@keyframes lightSpeedOut {
  from {
    opacity: 1;
  }

  to {
    transform: translate3d(100%, 0, 0) skewX(30deg);
    opacity: 0;
  }
}

.animate__lightSpeedOut {
  animation-name: lightSpeedOut;
  animation-timing-function: ease-in;
}

@keyframes rotateIn {
  from {
    transform-origin: center;
    transform: rotate3d(0, 0, 1, -200deg);
    opacity: 0;
  }

  to {
    transform-origin: center;
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

.animate__rotateIn {
  animation-name: rotateIn;
}

@keyframes rotateInDownLeft {
  from {
    transform-origin: left bottom;
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }

  to {
    transform-origin: left bottom;
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

.animate__rotateInDownLeft {
  animation-name: rotateInDownLeft;
}

@keyframes rotateInDownRight {
  from {
    transform-origin: right bottom;
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    transform-origin: right bottom;
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

.animate__rotateInDownRight {
  animation-name: rotateInDownRight;
}

@keyframes rotateInUpLeft {
  from {
    transform-origin: left bottom;
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }

  to {
    transform-origin: left bottom;
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

.animate__rotateInUpLeft {
  animation-name: rotateInUpLeft;
}

@keyframes rotateInUpRight {
  from {
    transform-origin: right bottom;
    transform: rotate3d(0, 0, 1, -90deg);
    opacity: 0;
  }

  to {
    transform-origin: right bottom;
    transform: translate3d(0, 0, 0);
    opacity: 1;
  }
}

.animate__rotateInUpRight {
  animation-name: rotateInUpRight;
}

@keyframes rotateOut {
  from {
    transform-origin: center;
    opacity: 1;
  }

  to {
    transform-origin: center;
    transform: rotate3d(0, 0, 1, 200deg);
    opacity: 0;
  }
}

.animate__rotateOut {
  animation-name: rotateOut;
}

@keyframes rotateOutDownLeft {
  from {
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    transform-origin: left bottom;
    transform: rotate3d(0, 0, 1, 45deg);
    opacity: 0;
  }
}

.animate__rotateOutDownLeft {
  animation-name: rotateOutDownLeft;
}

@keyframes rotateOutDownRight {
  from {
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    transform-origin: right bottom;
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.animate__rotateOutDownRight {
  animation-name: rotateOutDownRight;
}

@keyframes rotateOutUpLeft {
  from {
    transform-origin: left bottom;
    opacity: 1;
  }

  to {
    transform-origin: left bottom;
    transform: rotate3d(0, 0, 1, -45deg);
    opacity: 0;
  }
}

.animate__rotateOutUpLeft {
  animation-name: rotateOutUpLeft;
}

@keyframes rotateOutUpRight {
  from {
    transform-origin: right bottom;
    opacity: 1;
  }

  to {
    transform-origin: right bottom;
    transform: rotate3d(0, 0, 1, 90deg);
    opacity: 0;
  }
}

.animate__rotateOutUpRight {
  animation-name: rotateOutUpRight;
}

@keyframes hinge {
  0% {
    transform-origin: top left;
    animation-timing-function: ease-in-out;
  }

  20%,
  60% {
    transform: rotate3d(0, 0, 1, 80deg);
    transform-origin: top left;
    animation-timing-function: ease-in-out;
  }

  40%,
  80% {
    transform: rotate3d(0, 0, 1, 60deg);
    transform-origin: top left;
    animation-timing-function: ease-in-out;
    opacity: 1;
  }

  to {
    transform: translate3d(0, 700px, 0);
    opacity: 0;
  }
}

.animate__hinge {
  animation-duration: 2s;
  animation-name: hinge;
}

@keyframes jackInTheBox {
  from {
    opacity: 0;
    transform: scale(0.1) rotate(30deg);
    transform-origin: center bottom;
  }

  50% {
    transform: rotate(-10deg);
  }

  70% {
    transform: rotate(3deg);
  }

  to {
    opacity: 1;
    transform: scale(1);
  }
}

.animate__jackInTheBox {
  animation-name: jackInTheBox;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@keyframes rollIn {
  from {
    opacity: 0;
    transform: translate3d(-100%, 0, 0) rotate3d(0, 0, 1, -120deg);
  }

  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}

.animate__rollIn {
  animation-name: rollIn;
}

/* originally authored by Nick Pettit - https://github.com/nickpettit/glide */

@keyframes rollOut {
  from {
    opacity: 1;
  }

  to {
    opacity: 0;
    transform: translate3d(100%, 0, 0) rotate3d(0, 0, 1, 120deg);
  }
}

.animate__rollOut {
  animation-name: rollOut;
}

@keyframes zoomIn {
  from {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }

  50% {
    opacity: 1;
  }
}

.animate__zoomIn {
  animation-name: zoomIn;
}
@keyframes zoomInDown {
  from {
    opacity: 0;
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.animate__zoomInDown {
  animation-name: zoomInDown;
}

@keyframes zoomInLeft {
  from {
    opacity: 0;
    transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.animate__zoomInLeft {
  animation-name: zoomInLeft;
}

@keyframes zoomInRight {
  from {
    opacity: 0;
    transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.animate__zoomInRight {
  animation-name: zoomInRight;
}

@keyframes zoomInUp {
  from {
    opacity: 0;
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  60% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.animate__zoomInUp {
  animation-name: zoomInUp;
}

@keyframes zoomOut {
  from {
    opacity: 1;
  }

  50% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }

  to {
    opacity: 0;
  }
}

.animate__zoomOut {
  animation-name: zoomOut;
}

@keyframes zoomOutDown {
  40% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
    transform-origin: center bottom;
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.animate__zoomOutDown {
  animation-name: zoomOutDown;
}

@keyframes zoomOutLeft {
  40% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0);
  }

  to {
    opacity: 0;
    transform: scale(0.1) translate3d(-2000px, 0, 0);
    transform-origin: left center;
  }
}

.animate__zoomOutLeft {
  animation-name: zoomOutLeft;
}

@keyframes zoomOutRight {
  40% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(-42px, 0, 0);
  }

  to {
    opacity: 0;
    transform: scale(0.1) translate3d(2000px, 0, 0);
    transform-origin: right center;
  }
}

.animate__zoomOutRight {
  animation-name: zoomOutRight;
}

@keyframes zoomOutUp {
  40% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }

  to {
    opacity: 0;
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -2000px, 0);
    transform-origin: center bottom;
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}

.animate__zoomOutUp {
  animation-name: zoomOutUp;
}

@keyframes slideInDown {
  from {
    transform: translate3d(0, -100%, 0);
    visibility: visible;
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.animate__slideInDown {
  animation-name: slideInDown;
}

@keyframes slideInLeft {
  from {
    transform: translate3d(-100%, 0, 0);
    visibility: visible;
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.animate__slideInLeft {
  animation-name: slideInLeft;
}

@keyframes slideInRight {
  from {
    transform: translate3d(100%, 0, 0);
    visibility: visible;
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.animate__slideInRight {
  animation-name: slideInRight;
}

@keyframes slideInUp {
  from {
    transform: translate3d(0, 100%, 0);
    visibility: visible;
  }

  to {
    transform: translate3d(0, 0, 0);
  }
}

.animate__slideInUp {
  animation-name: slideInUp;
}

@keyframes slideOutDown {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    transform: translate3d(0, 100%, 0);
  }
}

.animate__slideOutDown {
  animation-name: slideOutDown;
}

@keyframes slideOutLeft {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    transform: translate3d(-100%, 0, 0);
  }
}

.animate__slideOutLeft {
  animation-name: slideOutLeft;
}

@keyframes slideOutRight {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    transform: translate3d(100%, 0, 0);
  }
}

.animate__slideOutRight {
  animation-name: slideOutRight;
}

@keyframes slideOutUp {
  from {
    transform: translate3d(0, 0, 0);
  }

  to {
    visibility: hidden;
    transform: translate3d(0, -100%, 0);
  }
}

.animate__slideOutUp {
  animation-name: slideOutUp;
}

.animate__animated {
  animation-duration: 1s;
  animation-fill-mode: both;
}

.animate__animated.animate__infinite {
  animation-iteration-count: infinite;
}

.animate__animated.animate__delay-1s {
  animation-delay: 1s;
}

.animate__animated.animate__delay-2s {
  animation-delay: 2s;
}

.animate__animated.animate__delay-3s {
  animation-delay: 3s;
}

.animate__animated.animate__delay-4s {
  animation-delay: 4s;
}

.animate__animated.animate__delay-5s {
  animation-delay: 5s;
}

.animate__animated.animate__fast {
  animation-duration: 800ms;
}

.animate__animated.animate__faster {
  animation-duration: 500ms;
}

.animate__animated.animate__slow {
  animation-duration: 2s;
}

.animate__animated.animate__slower {
  animation-duration: 3s;
}

@media (prefers-reduced-motion) {
  .animate__animated {
    animation: unset !important;
    transition: none !important;
  }
}

/* 
================================================================================
Autres animations
================================================================================
*/

/* tourne sur 360 degrés */
@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

.spin {
  animation-name: spin;
}


/* 
================================================================================
Nouvelle popups et alertes box (ea.js)
================================================================================
*/

.ea-pop-modal
{
	position: absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}

.ea-pop-modal /* theme */
{
	background-color: #0003;
	cursor: not-allowed;
}

.ea-pop
{
	position:absolute;
	box-sizing: border-box;
	overflow: auto;
	background-color: white;
	box-shadow: 0 5px 15px black;
	border-radius: 3px;
}

.ea-pop * 
{
	box-sizing: border-box;
}

.ea-pop > .ea-pop-content > .ea-icon:before
{
	margin-right:0;
}

.ea-pop-header
{
	height: 30px;
	padding: 5px 10px;
	font-size: 14px;
	background-color: #f1f1f1;
	color: white;
}

a.ea-pop-btclose:link
{
	float: right;
	font-size: 18px;
	color: white;
	opacity: 0.6;
}

a.ea-pop-btclose:hover
{
	opacity: 1;
}

.ea-pop-content
{
	overflow: auto;
	color: #222;
}

.ea-pop-footer
{
	height: 40px;
	overflow: auto;
	padding: 5px;
	text-align: center;
}

/* Boutons */
.ea-pop-bt
{
	margin: 10px 10px;
	padding: 3px 15px;
	border: 1px solid #e6e6e6;
	border-radius: 3px;
	background-color: #f6f6f6;
}

.ea-pop-bt:hover
{
	background-color: #ededed;
}

.ea-pop-bt:active
{
	background-color: #e1e1e1;
}

/* Contenu des alertBox, messagesBox... */
.ea-pop.alertbox > .ea-pop-content
{
	display: table;
	width: 100%;
	padding: 15px;
	color: #333;
	border-top: 5px solid;
}

.ea-pop.alertbox > .ea-pop-content > .ea-pop-icon.ea-icon
{
	display: table-cell;
	vertical-align: top;
	font-size: 25px;
	padding: 5px 10px 0 0;
}

.ea-pop.alertbox > .ea-pop-content > .ea-pop-msg
{
	display: table-cell; 
	padding: 0;
	vertical-align: middle;
	text-align: left;
}

.ea-pop.msgbox > .ea-pop-content 
{
	display: table;
	width: 100%;
	color: #333;
	text-align: center;
}

.ea-pop.msgbox > .ea-pop-content > .ea-pop-iconmsg.ea-icon
{
	display: table-cell;
	padding: 10px;
	width: 1px;
	font-size: 20px;
}

.ea-pop.msgbox > .ea-pop-content > .ea-pop-img
{
	display: table-cell;
	padding: 10px;
	width: 1px;
}

.ea-pop.msgbox > .ea-pop-content > .ea-pop-img > img
{
	width: 50px;
}

.ea-pop.msgbox > .ea-pop-content > .ea-pop-video
{
	display: table-cell;
	padding: 10px;
	width: 1px;
}

.ea-pop.msgbox > .ea-pop-content > .ea-pop-video > video
{
	width: 50px;
}

.ea-pop.msgbox > .ea-pop-content > .ea-pop-msg
{
	display: table-cell; 
	padding: 10px;
	vertical-align: middle;
	text-align: left;
}

/* Les différentes couleurs des alertes box */
.ea-pop.alertbox.neutral > .ea-pop-content 
{
    border-top-color: #444;
}

.ea-pop.alertbox.neutral > .ea-pop-content > .ea-icon 
{
	color: #444;
}

.ea-pop.alertbox.warning > .ea-pop-content 
{
    border-top-color: #ffc107;
}

.ea-pop.alertbox.warning > .ea-pop-content > .ea-icon 
{
	color: #ffc107;
}

.ea-pop.alertbox.info > .ea-pop-content 
{
    border-top-color: #428bca;
}

.ea-pop.alertbox.info > .ea-pop-content > .ea-icon 
{
	color: #428bca;
}

.ea-pop.alertbox.danger > .ea-pop-content 
{
    border-top-color: #d9534f;
}

.ea-pop.alertbox.danger > .ea-pop-content > .ea-icon 
{
	color: #d9534f;
}

.ea-pop.alertbox.success > .ea-pop-content 
{
    border-top-color: #5cb85c;
}

.ea-pop.alertbox.success > .ea-pop-content > .ea-icon 
{
	color: #5cb85c;
}

/* Popup IFRAME */
.ea-pop-iframe
{
	border: none;
	width: 100%;
	height: 100%;
}

.ea-pop.iframe > .ea-pop-content
{
	height: calc(100% - 30px); /* 30 => height header, 40 => height footer */
}

/* Largeurs pré-définies pour les alertbox */
.ea-pop.xxsmall{width:200px;}
.ea-pop.xsmall{width:300px;}
.ea-pop.small{width:450px;}
.ea-pop.medium{width:650px;}
.ea-pop.large{width:900px;}
.ea-pop.xlarge{width:1200px;}
.ea-pop.xxlarge{width:1600px;}

.ea-corps-popup
{
	position: relative;
	top: 20px;
	left: 20px;
	width: calc(100% - 40px);
	height: calc(100% - 40px);
}

/*
================================================================================
Fenêtre modale pour faire patienter l'utilisateur
================================================================================
*/

div.ea-wait-modal
{
	width:100%;
	height:100%;
	position:absolute;
	text-align:center;
	cursor:wait;
	opacity: 0.3;
	background: #000 url('../images/patienter.gif') center center no-repeat;
}

.ea-waitbox > video
{
	width: 150px;
}

/*
================================================================================
Onglets en erreur lors d'une validation globale
================================================================================
*/

ul.menu2 a.taberror,
ul.menu2 a.taberror.done,
ul.menu2 ul a.taberror:hover,
ul.menu2 ul a.taberror.active,
ul.menu2 ul a.taberror.active:hover 
{
	background-color: #ff6b6b;
	color: #fff;
	border-color:#ff6b6b;
}

ul.menu2 a.taberror.done 
{ 
	opacity:1;/*surcharge pour certains thèmes dont les onglets "avec contenu" apparaissent en transparence */
}

ul.menu2 a.taberror.path,
ul.menu2 a.taberror.active 
{
	color:inherit;
}

ul.menu2 a.taberror.path,
ul.menu2 a.taberror.path:hover,
ul.menu2 a.taberror:hover,
ul.menu2 a.taberror.active,
ul.menu2 a.taberror.active:hover,
ul.menu2 a.taberror.done.active,
ul.menu2 a.taberror.done.active:hover,
ul.menu2 li a.taberror.done:hover 
{
	border-color:#ff6b6b;
}

/*
================================================================================
Blocs contenant des messages importants dans les contrôleurs des écrans
================================================================================
*/

.ea-ctl-panel-message 
{
	border-radius: 7px;
	margin-left:10px;
	border-style:solid;
	border-width:1px;
	font-weight:bold;
	padding:5px;
	font-size:16px;
	color:#fff;
	font-family:Arial;
	width:105px;
}

.ea-ctl-panel-message.danger 
{
	border-color:#d33033;
	background-color:#ff5457;
	text-shadow: 0 1px 0 #871b1f;
}

.ea-ctl-panel-message.success 
{
	border-color:#00661a;
	background-color:#1abc9c;
	text-shadow: 0 1px 0 #00661a;
}

/*
================================================================================
Champs diagrammes énergétique
================================================================================
*/

.ea-energy-chart 
{
	height:100%;
}
.ea-energy-chart.cumul {
	white-space: nowrap;
}
.ea-energy-chart img {
	width:100%;
	height:100%;
}
.ea-energy-chart.cumul .energy-chart-values-box {
	border:1px solid black;
	float:left;
	position:relative;
	height:42px;
	box-sizing:border-box;
	border-top-left-radius: 3px;
	border-bottom-left-radius: 3px;
}
.ea-energy-chart.cumul img {
	width:auto;
	height:auto;
}
.ea-energy-chart.cumul table td {
	text-align:center;
}
.ea-energy-chart.cumul table tr td:first-child {
	border-right:1px solid black;
}
.ea-energy-chart.cumul .unit  {
	font-size:10px;
}
.ea-energy-chart.cumul .labels table tr td {
	border:none;
}
.ea-energy-chart.cumul .labels {
	position:absolute;
	top:-18px;
}
.ea-energy-chart.cumul .labels span {
	display:block;
	width:78px;
	font-size:10px;
}
.ea-energy-chart.cumul .value {
	height:16px;
	display:block;
	font-weight:bold;
	width:78px;
}
.energy-chart-values-box.letter {
	visibility: hidden;
}
.energy-chart-values-box.letterA {
	top:15px;
}
.energy-chart-values-box.letterB {
	top:39px;
}
.energy-chart-values-box.letterC {
	top:63px;
}
.energy-chart-values-box.letterD {
	top:87px;
}
.energy-chart-values-box.letterE {
	top:111px;
}
.energy-chart-values-box.letterF {
	top:135px;
}
.energy-chart-values-box.letterG {
	top:159px;
}
/*
================================================================================
Champs photos
================================================================================
*/

.photo 
{
	border: 1px solid #B4B4B4;
	display:block;
	cursor:pointer;
}


/*
================================================================================
Boite de champs dans une zone fiche
================================================================================
*/

div.ea-unikboxfields 
{
	position:relative;
	display:inline-block;
	vertical-align:top;
}

div.contzone.zoneposabsolute 
{
	/* les boîtes ne se positionne pas les unes en dessous des autres dans les zones en position absolue */
	white-space:nowrap;
}

div.zoneposabsolute .ea-label 
{
	white-space: normal;
}

/*
================================================================================
Liste avec entetes fixes :
L'application de sticky sur les entetes entraine des pb de bordure, il faut
obligatoirement remettre border-collapse sur separate puis appliquer une bordure sur deux.
================================================================================
*/

table.sticky 
{
	border-collapse: separate;
    border-spacing: 0;
}

table.sticky td.entete ,  
table.sticky th.entete 
{
    position: sticky;
    top: 0px;
	z-index: 1;
}

table.sticky td.liste1, 
table.sticky td.liste2 
{
	border-top: none;
	border-left: none;
}

/* Correctif 1ere colonne type bouton */
table.sticky td.ea-lst-cellbt:first-child 
{
    border-right: 1px solid;
}
table.liste .entete.ea-lst-cellbt,
table.liste .entete.erreur {
	border:none;
}

/*
================================================================================
Liste déroulante du bouton [Prochain évènement] dans un dossier
================================================================================
*/

.divBtNextEvtPlanact 
{
	position:relative; 
	z-index:1;
}

.divBtNextEvtPlanact .listNextPlanAct 
{
	display:none;
	position:absolute;
	top:0;
	max-height:250px;
	overflow:auto;
}

.divBtNextEvtPlanact .listNextPlanAct a 
{
	display:block;
	padding:8px 15px;
	cursor: pointer;
	width:200px;
}

.conteneur.nopanelleft .ea-ctl .divBtNextEvtPlanact 
{
	display: inline-block;
}

.conteneur.nopanelleft .ea-ctl .divBtNextEvtPlanact .listNextPlanAct 
{
	top:25px;
	left:10px;
}

/* Bases des adresses nationales : liste des rues */
#divadresseban 
{
	background-color:#FFFFFF;
	border:1px solid black;
}

/* Bouton permettant de rendre invisible/visible une zone */
.ea-bt-maskzonecontent 
{
	cursor:pointer;
}

.ea-bt-maskzonecontent:before 
{
	font-size:18px;
}

/**
Champ "feu tricolore"
**/
.ea-feutricolore-box {
	background-image: url("../../core/public/images/feutricolore-bg.svg");
	background-size:contain;
	background-repeat:no-repeat;
}
.ea-feutricolore-circles-wrapper {
	display:flex;
	flex-direction:column;
}
.ea-feutricolore-circle {
	border-radius:50%;
	background-color:#515151;
	margin:auto;
}
.ea-feutricolore-circle-red.active { 
	background-color:#ff473e;
}
.ea-feutricolore-circle-orange.active { 
	background-color:#ffb636;
}
.ea-feutricolore-circle-green.active { 
	background-color:#83bf4f;
}