@charset "utf-8";
/* CSS Document */
/*-------------------------------------DEF DES LIENS-----------------------*/
  A:link { text-decoration: none ; color:darkblue ; }
  A:visited { color:#009fe3 ; font-style: italic; font-weight: 800 ; }
  A:hover {color:red; font-weight: 500 ; }	
/*-------------------------------------FIN DEF DES LIENS-----------------------*/
::-webkit-scrollbar { width: 24px; }
::-webkit-scrollbar-track { background: #f0f0f0; }
::-webkit-scrollbar-thumb { background: cyan; border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: darkcyan }

* { scrollbar-color: #1e3a6e white; scrollbar-width: large; }

/* adaptation des images à la taille de l'écran */
img {
    max-width: 100%;
    height: auto;
}



body {
    font-family: 'Lucida Grande', 'Lucida Sans Unicode', 'Lucida Sans', 'DejaVu Sans', Verdana, 'sans-serif';
}

.bloc-commentaire {
	background-color: #e0f7fa;
	border-radius: 10px;
	max-width: 66.66%;
	margin: 0 auto 1.5em;
	padding: 0.8em 1.5em;
	font-size: 16px;
	font-style: italic;
	text-align: center;
}

h1{
	font-size:36px;
    margin-right: 1em;
	color: slategrey ;
	}
h1::before {
  content: "▣ ";
color:crimson;	
}	
h2{
	font-weight: 100;
	font-style: italic;
	font-size:16px;
	text-align: justify;
	margin-right: 2em;
	margin-left:2em;

	}
h3{
	font-weight: 600;
	font-style: italic;
	font-size:16px;
	text-align: justify;
	margin-right: 2em;
	margin-left:2em;
	}
h4{
	font-weight: 100;
	font-size:16px;
	text-align: justify;
	margin-right: 2em;
	margin-left:2em;
	}
	
	

/* ── Image insérée dans le texte, alignée à gauche ──
   Réutilisable sur toute page, quelle que soit la largeur de l'image :
   ajoutez simplement la classe "img-align-figure" sur la balise <img>,
   à l'endroit du texte où l'image doit apparaître. Le texte qui suit
   s'aligne sur le bord droit de l'image tant qu'il est à sa hauteur,
   puis revient automatiquement à la marge habituelle une fois sous
   l'image (comportement natif du float, qui s'adapte à n'importe
   quelle largeur d'image sans réglage supplémentaire). */
.img-align-figure {
	float: left;
	margin: 0 1.5em 1em 0;
}

/* Facultatif : à ajouter sur l'élément qui doit obligatoirement se
   retrouver sous l'image (par exemple si un titre suivant ne doit
   jamais se placer à côté d'elle). */
.img-align-clear {
	clear: left;
}
/* Image centrée, sur sa propre ligne.
   "text-align: center" ne fonctionne que sur les enfants d'un bloc :
   posé directement sur l'image (qui est un élément inline), il n'a
   aucun effet. Il faut donc transformer l'image elle-même en bloc
   (display: block) puis la centrer avec des marges gauche/droite
   automatiques (margin: 0 auto). "clear: both" évite en plus qu'elle
   ne vienne se caler à côté d'une image flottante précédente
   (.img-align-figure) au lieu de se centrer sur toute la largeur. */
.img-align-centre {
	display: block;
	clear: both;
	margin: 1.5em auto;
}