.h2-p8p10-mn, 
.h3-p8p10-mn, 
.image, 
.video,
.figcaption-p8p10-mn {
	font-family: 'Lato',Verdana,Geneva,'Bitstream Vera Sans','DejaVu Sans',sans-serif;
}


/* --- Titre de niveau h2 --- */
.h2-p8p10-mn {
	font-size: 1.8em;
	color: #EBEBEB;
	background-color: tomato;
	background-image: linear-gradient(to top, tomato 55% , coral);
	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,.3);*/
	
}

/* --- Titre de niveau h3 --- */
.h3-p8p10-mn {
	font-size: 1.5em;
	color: tomato;
	/*background-color: #EBEBEB;*/
	margin:25px 0;
	padding: 10px;
}
/* --- Titre de niveau h4 --- */
.h4-p8p10-mn {
	font-weight: bold;
}


/* --- p en gras et en italique --- */
.p-italicBold-p8p10-mn {
	font-style: italic;
	font-weight: bold;
}

/* --- p en italique --- */
.p-italique-p8p10-mn {
	font-style: italic;
}

/* --- paramètrage des images (class image) --- */
.image, .video {
	padding: 5px 0 30px 0;
	max-width: 100%;
	max-height: 100%;
	text-align: center;

}

/* --- Légendes des images --- */
.figcaption-p8p10-mn {
	margin:0 20px 20px 20px;
	padding: 5px;
	color: gray;
	background-color: linen;
	border-top: 1px solid tomato;
}

/* --- Exposant --- */ 
.exposant-p8p10-mn {
	font-size: .7em;
	position: relative;
	top:-.7em;

}


/* ---  --- */
.rappel-skills {
	background-color: linen;
	width: 80%;
	border-left:1px solid tomato;
	margin:20px;
	padding:20px;
}

/* --- Paramètrage des icones de Font Awesome  = class fas_fa --- */
.fas_fa {
	color: tomato;
	font-size: 1.5em;
	display: inline;
	float: left;
	padding:0 10px;
	position: relative;
	top: -5px;
	clear: left;
}


.fa-fa-quote-p8p10-mn {
	font-size: 1.5em;
	color: tomato;
	padding: 0 0 20px 0;

}

.quote-text-p8p10-mn {
	padding-left: 20px;
	font-style: italic;
}

/* --- Déplacer le texte sur la droite  --- */
.indent-p8p10-mn {
	padding-left: 20px;
}


/* --- Paramètrage des listes à puces avec FA --- */
.li-p8p10-mn {
	list-style-type: none;
	padding: 0 5px;
}

.li-p8p10-mn span {
	padding: 0 15px;
	color: tomato;
}


/* ---   Paramètrage du tropmbinoscope   --- */
.img-text-trombi-p8p10-mn {
	overflow:hidden; /* empêche le dépassement des flottants */
	padding-left: 113px; /* Largeur de l'image 111px + gouttière 2x1px */
	
	background-image:url(file:/static/trombi-gen.png) no-repeat;
	margin: 20px ;
}
	
.image-trombi-p8p10-mn {
	float: left;
    margin-left: -113px;
	padding:0 20px;	
}
/* ---   Fin du paramètrage du tropmbinoscope   --- */


/* ====== INFOBULLE - Gloassaire ========= */
a.glossaire {
   position: relative;
   color: tomato;
   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 définit une valeur pour l'ordre d'affichage. */
   cursor: help; /* On change le curseur par défaut 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 propriété white-space pour qu'il n'y ait pas de retour à la ligne non désiré. */
   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;
	}
}