.h1, 
.h2,
.h3, 
.image, 
.video,
.figcaption {
	font-family: 'Lato',Verdana,Geneva,'Bitstream Vera Sans','DejaVu Sans',sans-serif;
}


/* --- Titre de niveau h1 --- */
.h1 {
	font-size: 1.9em;
	color: #ffffff;
	background-color: #6a4b9f;
	/*background-image: linear-gradient(to top, #6a4b9f 55% , skyblue);*/
	margin:35px 0;
	/*box-shadow: 2px 2px 3px rgba(0,0,0,.3);*/
	padding: 10px 0 10px 20px;
	/*text-shadow: -1px -1px 0px rgba(0,0,0,.1);*/
	
}

/* --- Titre de niveau h2 --- */
.h2 {
	font-size: 1.5em;
	font-weight: bold;
	color: #6a4b9f;
	/*background-color: #EBEBEB;*/
	margin:25px 0;
	padding: 10px;
}
/* --- Titre de niveau h3 --- */
.h3 {
	font-weight: bold;
	color: #8e8e8e;
	font-size: 1.4em;
	margin:25px 0;
	padding: 10px;
}


/* --- p en gras et en italique --- */
.p-italicBold {
	font-style: italic;
	font-weight: bold;
}

/* --- p en italique --- */
.p-italique {
	font-style: italic;
}

/* --- parametrage des liens --- */
.link-upl-p10 a {
	color: #ee370d;
}

.link-upl-p10 a:hover,
.link-upl-p10 a:active,
.link-upl-p10 a:focus,
.link-upl-p10 a:visited {
	color:#ee370d;
}

/* --- parametrage des images (class image) --- */
.image, .video {
	padding: 5px 0 30px 0;
	max-width: 100%;
	max-height: 100%;
	text-align: center;

}

/* --- Legendes des images --- */
.figcaption {
	margin:0 20px 20px 20px;
	padding: 5px;
	color: gray;
	background-color: #e6e6ff;
	border-top: 1px solid #6a4b9f;
}

/* --- Exposant --- */ 
.exposant-upl-p10 {
	font-size: .7em;
	position: relative;
	top:-.7em;
	left:-10px;
	color: #3c3c3c;

}

.bluebold {
	color: #6a4b9f;
	font-weight: bold;
}

/* --- Skills ou mise en evidence --- */
.rappel-skills {
	background-color: #e6e6ff;
	width: 80%;
	border-left:1px solid #6a4b9f;
	margin:20px;
	padding:20px;
}

/* --- Parametrage des icones de Font Awesome  = class fas_fa --- */
.fas_fa {
	color: #6a4b9f;
	font-size: 1.5em;
	display: inline;
	float: left;
	padding:0 10px;
	position: relative;
	top: -5px;
	clear: left;
}


.fa-fa-quote {
	font-size: 1.5em;
	color: #6a4b9f;
	padding: 0 0 20px 0;

}

.quote-text {
	padding-left: 20px;
	font-style: italic;
}

/* --- Deplacer le texte sur la droite  --- */
.indent {
	padding-left: 20px;
}

.indent-40px {
	padding-left: 40px;
}


/* --- Parametrage des listes Ã  puces avec FA --- */
.li {
	list-style-type: none;
	padding: 0 5px;
}

.li span {
	padding: 0 15px;
	color: #6a4b9f;
}


/* ---   Parametrage du tropmbinoscope   --- */
.img-text-trombi {
	overflow:hidden; /* empeche le depassement des flottants */
	padding-left: 113px; /* Largeur de l'image 111px + gouttiere 2x1px */
	
	background-image:url(file:/static/trombi-gen.png) no-repeat;
	margin: 20px ;
}
	
.image-trombi {
	float: left;
    margin-left: -113px;
	padding:0 20px;	
}
/* ---   Fin du parametrage du trombinoscope   --- */


/* ====== INFOBULLE - Glossaire ========= */
a.glossaire {
   position: relative;
   color: #6a4b9f;
   text-decoration: none;
   border-bottom: 2px gray dotted; /* On souligne le texte. */

}

a.glossaire span {
   display: none; /* On masque l'infobulle. */
}

a.glossaire:hover,
a.glossaire:active {
   background: none; /* Correction d'un bug d'Internet Explorer. */
   z-index: 500; /* On definit une valeur pour l'ordre d'affichage. */
   cursor: help; /* On change le curseur par defaut par un curseur d'aide. */
}

a.glossaire:hover span,
a.glossaire:active span,
a.glossaire:focus span,
a.glossaire:visited span {
   display: inline; /* On affiche l'infobulle. */
   position: fixed !important;
   white-space: nowrap; /* On change la valeur de la propriete white-space pour qu'il n'y ait pas de retour a la ligne non desiree. */
   top: 70px; /* On positionne notre infobulle. */
   left: 20px;
   width: auto;
   background: rgba(0,0,0,.8);
   color: #fff;
   padding: 15px;
   border-radius: 3px;
   box-shadow: 0 0 2px rgba(0,0,0,.7);
}

/* ===============Fin de INFOBULLE ========== */

/* ======== infobulle mobile vertical ========*/

@media (max-width: 767px) {
	a.glossaire:hover span,
	a.glossaire:active span,
	a.glossaire:focus span,
	a.glossaire:visited span {
	   z-index: 500;
	   float: right;
	   clear: right;
	}
}