body {
	margin: 0;
	padding: 0;
	text-align: center;
	font: 0.75em/1.4em Arial, Helvetica, sans-serif;
	background-color: #FFF;
}

*:focus{
	outline: 4px solid #26619c;
}

button{
	cursor: pointer;
}

h2 {
	font-size: 12px;
	padding-left: 0.6em;
}

p{
	padding: 1px 0;
}
	
.bulle{
    position: absolute;   
    visibility: hidden;
	border: 1px solid #006699; 
	padding: 10px;
    font-family: Verdana, Arial;
    font-size: 10px;
	background-color: #DAE1E9;
}

div#bandeau {	
	height: 40px;
	background-color: #DAE1E9;
}	

a.lien { 
	font-family: Arial, Helvetica, sans-serif; 
	font-size: 12px; 
	font-style: normal;
	font-weight: normal;
	color: #006699; 
	text-decoration: none; 
}
	
P.titre_rubrique {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	color: #006699;
}	

.text {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #224771;
}

.text_gras-it {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: italic;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	color: #224771;
}

.txt_relief {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	color: #003366;
}

.titre_onglet {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	color: #003366;
}

.rubrique {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	color: #003366;
}
	
.glossaire {
	/*font-family: times, verdana, sans-serif ;*/
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	/* background-color: #EEFFFF ;
	color: #224771;*/
	color: #003366;
	text-decoration: underline ; 
}
	
A.lieninvisible { 	
	font-family: Arial, Helvetica, sans-serif; 
	font-size: 10px; 
	color: #006699; 
	text-decoration: none; 
	font-style: normal; 
	background-color: #F0F0EA;
}	
	
/* **************************** */
/* styles info bulle  */
/* ***************************** */
.bulle_titre {
	background-color: #FFF;
	text-align: left;
	padding-left: 5px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	color: #003366;
}
	
.bulle_texte  {
	background-color: #FFF;
	text-align: left;
	padding-left: 5px;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-right: 5px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #003366;
}
	

/* *************************/
/* classes pages d'aide */
/* *************************/
.hlp_bouton{
	background: #fff;        
	border-style: solid;
	border-width: thin;        
	border-color: #8E8E8E;
	display: inline-flex;
}
.hlp_disclose_btn{
	border: none; 
	background: none; 
	line-height: 12px; 
	padding: 0; 
	width: 22px; 
	height: 22px;
}
.hlp_disclose_btn img{
	vertical-align: middle;
}
.hlp_playlink{
	line-height: 1.4em;
	display: inline-block;
	margin-bottom: .5em;
}
.hlp_playlink img{
	margin-right: .5em;
	vertical-align: bottom;
}
.ima-zonebuttonbar-button, .ima-popup-button{
	font-family: Verdana,Arial,Helvetica,sans-serif;
	background-color: #26619c;
	border: 1px solid transparent;
	border-radius: .3em;
	color: #fff;
	margin: 2px 0.5em;
	padding: 0 5px !important;
	display: inline-block;
	font-size: 12px;
	line-height: 22px;
}
.ima-popup-button{
	color: #26619c;
	border: 1px solid #818181;
	font-weight: bold;
	background: white;
}
.ima-zonebuttonbar-button img, .ima-popup-button img{
	vertical-align: middle;
}
.t-underline{
	text-decoration: underline;
}
.p-0{
	padding: 0 !important;
}
.v-bot{
	vertical-align: bottom;
}
.v-middle{
	vertical-align: middle;
}
.d-flex{
	display: flex;
}
.flex{
	flex: 1 1 auto;
}

.hlp_bandeau {
	/* container du bandeau de haut de page */
	height: 43px;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 5px;
	background-color: #FFF;
	width: 95%
}
.hlp_titreG {
	/* container de la partie à gauche du titre */
	float: left;
	padding-left: 5px;
	padding-right: 5px;
}
.hlp_titreD {
	/* container de la partie à droite du titre */
	float: right;
	padding-top: 10px;
	padding-left: 5px;
	padding-right: 5px;
}
		
.hlp_titre_bandeau {
	/* titre de la page d'aide */
	padding-top: 10px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #006699;
}
.hlp_cale_contenu {
	/* container cale entre chaque entrée de paragraphe */
	background-color: #FFF;
	height: 10px;
}	
	
div#hlp_contenu {	
	background-color: #FFF;
	margin-left: 20px;
	padding-right: 30px;
	height: auto;
	/*border: 1px solid #006699; */
}
	
.hlp_objet {
	/* container de présentation de l'objet de la page d'aide*/
	height: auto;
	text-align: left;
	padding-left: 10px; 
	padding-right: 18px;
	padding-top: 5px;
	padding-bottom: 5px;
	background-color: #FFF;
	border-left: solid #8E8E8E 8px;
	/*border-bottom: solid #8E8E8E 1px;*/
	width: 95%;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #003366;
}
	
.hlp_bloc {
	/* container de chaque bloc paragraphe */
	/*border: solid #8E8E8E 1px;*/
	height:auto;
	padding-left: 10px;
	padding-right: 30px; 
	padding-top: 5px;
	padding-bottom: 5px;
	background-color: #eaf1ff;
	width: 95%;
}
	
.hlp_intro {
	/* bloc introdu paragraphe */
	text-align:left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #003366;
	background-color: #FFF;
	padding-top: 3px;
	padding-left: 18px;
	padding-right: 5px;
	padding-bottom: 5px;
	width: 97%;
}
	
.hlp_bloctexte {
	/* bloc de texte du paragraphe */
	text-align:left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #003366;
	background-color: #F7F7EF;
	padding-top: 3px;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 5px;
	width: 100%;
}
	
.hlp_texte {
	/* texte de paragraphe */
	text-align: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #003366;
}
#container .content .hlp_texte{
	margin-top: 1em;
}
	
.hlp_titre_paragraphe {
	/* container de titre de paragraphe */
	background-color: #eaf1ff;
	padding-left: 10px;
	padding-top: 5px;
	padding-bottom: 5px;
	font-family: Arial, Helvetica, sans-serif;
	color: #006699;
	text-align: left;
	font-size: 14px;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
}
	
.hlp_titre {
	/* titre de paragraphe dans bloc texte */
	padding-left: 5px;
	padding-top: 5px;
	padding-bottom: 5px;
	font-family: Arial, Helvetica, sans-serif;
	color: #006699;
	text-align: left;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
}
	
.hlp_sous_titre {
	/* sous titre dans paragraphe */
	padding-bottom: 3px;
	/*background-color: eaf1ff;*/
	background-color: #fff;
	border-bottom: solid #8E8E8E 1px;
	/*border-top: solid #FFFFFF 3px;*/
	/*border-top: solid #8E8E8E 2px;*/
	font-weight: bold;
	/*color: #8E8E8E;*/
}
.hlp_partie {
	/* partie haute ou basse de l'écran */
	padding-bottom: 3px;
	padding-top: 3px;
	background-color: #fff;
	border-bottom: solid #8E8E8E 1px;
	border-top: solid #8E8E8E 1px;
	font-weight: bold;
}
	
.hlp_fin_partie {
	/* limiteur de fin de paragraphe */
	padding-bottom: 3px;
	border-top: solid #8E8E8E 2px;		
}
	
.hlp_indent {
	margin-left: 23px;
}
	
.hlp_indent20 {
	border-left: 20px;
	border-style: solid;
	border-color: #F7F7EF;
}
.hlp_indent40 {
	border-left: 40px;
	border-style: solid;
	border-color: #F7F7EF;
}
.hlp_indent60 {
	border-left: 60px;
	border-style: solid;
	border-color: #F7F7EF;
}
	
/*--------------------------------------------------
styles du glossaire
-------------------------------------------------------------*/
.gl_text {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #224771;
	background-color: #FFFFF9;
}
	
.gl_menu {
	float: left;
	width: auto;
	padding-left: 5px;
	padding-right: 5px;
	overflow: auto;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #003366;
	background-color: #F0F0EA;
	border-right: groove #DAE1E9 4px;
}
.gl_titre {
	/* titre du glossaire */
	width: auto;
	padding-left: 20px;
	padding-right: 5px;
	overflow: auto;
}
	
.gl_contenu {
	/* conteneur du contenu de glossaire */
	background-color: #E8EAF1;
	overflow: auto;
	margin-left: 20px;
	margin-right: 20px;
	height: auto;
	width: auto;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 14px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
}
	
.gl_alphabet {
	/* titre du glossaire */
	width: auto;
	padding-left: 30px;
	padding-right: 5px;
	padding-top: 10px;
	overflow: auto;
	color: #006699;
	font-size: 14px;
}
.gl_tit_rubrique {
	/* conteneur du titre de l'entrée */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: bold;
	font-variant: normal;
	color: #003366;
	background-color: #F0F0EA;
	padding-left: 20px;
	padding-top: 5px;
	padding-bottom: 5px;
}
.gl_cont_rubrique {
	/* conteneur du contenu de l'entrée */
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #003366;
	background-color: #FFFFF9;
	padding-left: 20px; 
	padding-top: 5px;
	padding-bottom: 5px;
}
	
/*-------------------------------------
	styles pour onglets
------------------------------------------*/
#container {
	position: relative;
	width: 100%;
	text-align: left;
	background-color: #F7F7EF;
}
#container * {
	margin: 0;
	padding: 0;
}
#container ul#menu {
	position: relative;
	width: 100%;
	font-weight: bold;
	display: flex;
}
#container ul#menu li {
	display: inline;
    flex: 1;
    max-width: 220px;
}
#container ul#menu li a {
 /* contenu des onglets */	
	text-align: center;
	display: block;
	height: 25px;
	line-height: 25px;
	text-decoration: none;
}

#container ul#menu li a:hover, #container ul#menu li a:focus {
	outline: none;
	box-shadow: inset 0px 4px 0px 0px #006699;
	color: #006699;	
}
#container ul#menu li:not(:first-child) a:hover, #container ul#menu li:not(:first-child) a:focus {
	border-left: 1px solid #006699;
    margin-left: -1px;
    padding-left: 1px;
}
#container h1, #container h2 {
	color: #224771;
	margin: 0.5em 0 0.5em 0;
	font-size: 1.0em;
}
#container .content {
	/* contenu de l'onglet  */
	padding: 1em 2em;
	margin: -2px 0 0 0;
	background-color: #F7F7EF;
	border: 1px solid #006699;
}
#container .content:focus {
	outline: none;
	box-shadow: inset 0 0 0 3px #006699;
}
#container hr {
	clear: both;
	visibility: hidden;
}
#container li:first-child a {
	border-left: solid #006699 1px;
}
#container a.current {
	/*onglet courant */
	margin: -2px 0 -1px 0;
	padding-top: 1px;
	padding-bottom: 1px;
	background-color: #F7F7EF;
	border-top: solid #006699 2px;
	border-right: solid #006699 3px;
	box-shadow: inset 0px 1px 0px 0px #006699;
	color: #006699;
}
#container a.ghost  {
  /* onglet inactif */
	background-color: #EAF1FF;
	border-right: solid #006699 1px;
	border-top: solid #006699 1px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-style: normal;
	line-height: normal;
	font-weight: normal;
	font-variant: normal;
	color: #000;
}
#container .on {
	display: block;
}
#container .off {
	display: none;
}