:root {
    --couleur1=rgb(251, 252, 255);
    --couleur2=rgb(48, 133, 249);
    --couleur3=rgb(60, 164, 249);
}



body
{
	background-color: rgb(255, 190, 70);/*  couleur orange clair */
	font-size: 1.5em;
	padding: 0;
	margin: 0;
}

#bloc_page /*dimensions et marges de la page*/
{
    width: auto;
    margin: 0;
    padding: 0;
}

header
{	
	background-color: rgb(255, 255, 255);/*  couleur vert plus foncé */
	width: 100%;
	max-height: 10%;
	padding: 0;
	margin: 0;
	border-bottom: 2px black solid;
}

.banderolle_de_navigation_titre
{	
	height: 5%;
	/*background-image: url(head.svg);*/
	background-repeat: no-repeat;
	background-size: 100%;
	padding: 0;

}

.connection
{	text-align: right;
	font-size: 1.5em;
	text-decoration: underline;
	margin-right: 10px;
}

#logo_baniere
{
	width: 200px;
}
.titre_site_logo
{	
	display: flex;/*utilisation de flexbox pour mettre en page les blocs d'acceuil*/
	flex-direction: row-reverse;/*blocs en lignes*/
	flex-wrap: no-wrap;/*aller à la ligne si plus de place*/
	justify-content: center;
	align-items: center;
}
.haut_de_page
{	
	display: flex;/*utilisation de flexbox pour mettre en page les blocs d'acceuil*/
	flex-direction: row-reverse;/*blocs en lignes*/
	flex-wrap: no-wrap;/*aller à la ligne si plus de place*/
	justify-content: center;
	align-items: center;
}

div 
{	padding: 0;
	margin: 0;
}

section
{	display: flex;/*utilisation de flexbox pour mettre en page les blocs d'acceuil*/
	flex-direction: column;/*blocs en lignes*/
	flex-wrap: wrap;/*aller à la ligne si plus de place*/
	justify-content: flex-start;
	align-items: flex-start;
	border: 2px black outset;
}

section ul
{	
	list-style-type: none;
	padding: 0px;
	margin: 10px;
	
}

nav ul
{	
	list-style-type: none;
	display: flex;/*utilisation de flexbox pour mettre en page les blocs d'acceuil*/
	flex-direction: row;/*blocs en lignes*/
	flex-wrap: wrap;/*aller à la ligne si plus de place*/
	justify-content: space-around;
	align-items: flex-end;
	
	
}

nav ul li
{	
	padding: 5px;
	/*border: 2px black solid;*/
	font-size: 1.5em;
}


.introduction, .signature_complete
{
	font-size: 1.1em;
	margin: 10px;
}

.conteneur_des_blocs_sections
{
	display: flex; /*utilisation de flexbox pour mettre en page les blocs d'acceuil*/
	flex-direction: row;/*blocs en lignes*/
	flex-wrap: wrap;/*aller à la ligne si plus de place*/
	justify-content: space-around;
	align-items: center;
}

.conteneur_des_blocs_sections_chapitre
{
	display: flex; /*utilisation de flexbox pour mettre en page les blocs d'acceuil*/
	flex-direction: column;/*blocs en lignes*/
	flex-wrap: wrap;/*aller à la ligne si plus de place*/
	justify-content: flex-start;
	align-items: center;
}

.conteneur_des_blocs_sections_chapitre section
{width: 90%;}

section
{
	background-color: rgb(60, 164, 249);/*  couleur vert clair */
	width: 45%;
	padding: 0px;/*marges intérieures*/
	margin: 30px;/*marges extérieures*/
	font-size: 1.5em;
	border: 2px black solid;

}


footer
{	
	align-self: center;
	text-align: center;
	padding: 0;
	margin: 0;
	width: 100%;
	background-color: rgb(48, 133, 249);
	border-top: 2px black solid;
}



h1, h2, h3
{ 
	text-align: center;
	font-weight: bold;
	margin: 0px;
 }
 h1
 {	font-size: 5em;
 }

h2
 {	font-size: 1.8em;
 }

.signature
{	text-align: right;
	font-style: italic;
}

.logo_flottant
{	
	width: 50px;
}

.signature_complete
{	display: flex; /*utilisation de flexbox pour mettre en page les blocs d'acceuil*/
	flex-direction: row;/*blocs en lignes*/
	flex-wrap: wrap;/*aller à la ligne si plus de place*/
	justify-content: flex-end;
	align-items: flex-end;}

a
{	color: black;
	text-decoration: none;
}


p.bienvenue{text-align: center;}

 p
 {	text-align: justify;
 	text-indent:  40px;
 	padding: 5px;
 	margin: 10px;
 }
 footer p 
 {	padding: 5px;
 	margin: 0px;
 }

#pied_de_page
{
	display: flex;/*utilisation de flexbox pour mettre en page les blocs d'acceuil*/
	flex-direction: column;/*blocs en lignes*/
	flex-wrap: wrap;/*aller à la ligne si plus de place*/
	justify-content: center;
	align-items: center;
	height: 200px
}