/* LES VARIABLES */

*{
--rouge-drapeau : rgb(228,3,3);
--orange-drapeau : rgb(255,140,0);
--jaune-drapeau : rgb(255,237,0);
--vert-drapeau : rgb(0,128,38);
--bleu-drapeau : rgb(0,77,135);
--violet-drapeau : rgb(117,7,135);
--couleur-text : #111;
}

body {
	/*page*/

	margin:0px auto;
  	background-color: #f7f7f7;
  	/*police*/
	font-size: 1rem;
	line-height: 1.7rem;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: var(--couleur-text) ;
  }


/* LE HEADER */

header{
	/*faire un dégradé */	
  background: linear-gradient(to right, var(--rouge-drapeau), var(--orange-drapeau), var(--jaune-drapeau) ,var(--vert-drapeau) ,var(--bleu-drapeau), var(--violet-drapeau)); 
  /*aligner titre, sous titre */
  display: flex;
  flex-direction: column;
  align-items: center;

}

header h1 {
	text-transform: uppercase;}

header a{
	/*retirer effet bleu souligné */
	text-decoration: none;
	color: var(--couleur-text);
}


/*MENU PRINCIPAL */

nav ul{
	list-style: none; /*pas de puce*/
}

nav ul{
	/*Le menu est une flexbox*/
	display: flex;
	justify-content: space-evenly;
}

nav ul li{
	/*ligne en doussous */
  border-bottom: solid;
}

nav ul li.rouge{
border-bottom-color:var(--rouge-drapeau);
}

nav ul li.orange{
border-bottom-color:var(--orange-drapeau);
}

nav ul li.jaune{
border-bottom-color:var(--jaune-drapeau);
}

nav ul li.vert{
border-bottom-color:var(--vert-drapeau);
}

nav ul li.bleu{
border-bottom-color:var(--bleu-drapeau);
}

nav ul li.violet{
border-bottom-color:var(--violet-drapeau);
}

nav a {
	/*retirer effet bleu souligné */
	text-decoration: none;
	color: var(--couleur-text);
	}
	
nav a:hover {
	text-decoration: underline;
	font-size: 1.2rem;
}

nav a.rouge:hover {
	color: var(--rouge-drapeau);
	text-decoration: var(--rouge-drapeau) underline;
}

nav a.orange:hover {
	color: var(--orange-drapeau);
	text-decoration: var(--orange-drapeau) underline;
}

nav a.jaune:hover {
	color: var(--jaune-drapeau);
	text-decoration: var(--jaune-drapeau) underline;
}

nav a.vert:hover {
	color: var(--vert-drapeau);
	text-decoration: var(--vert-drapeau) underline;
}

nav a.bleu:hover {
	color: var(--bleu-drapeau);
	text-decoration: var(--bleu-drapeau) underline;
}

nav a.violet:hover {
	color: var(--violet-drapeau);
	text-decoration: var(--violet-drapeau) underline;
}


/* Le MAIN */

main {
	margin-left: 5%;
	margin-right: 5%;
}


/* Main page principale */

.index_flex{
	display:flex;
	flex-direction: row;
	flex-wrap: wrap;
	justify-content: space-around;
}

section.bordure{
  border: solid;
  padding: 1rem;
  border-radius: 2em;
  margin: 0.5rem;
}

section.rouge{
	border-color: var(--rouge-drapeau);
}

section.orange{
	border-color: var(--orange-drapeau);
}

section.jaune{
	border-color: var(--jaune-drapeau);
}

section.vert{
	border-color: var(--vert-drapeau);
}

section.bleu{
	border-color: var(--bleu-drapeau);
}

section.violet{
	border-color: var(--violet-drapeau);
}

/*Main article */

h2.titre_article{
	margin-top: 2rem;
	text-align: center;
}

section.a_propos_article {
	text-align: center;
}

section.a_propos_article ul li {
	font-size: 0.7rem;
	display:inline;}

hr.titre_article{
	border-top: 1px solid red var(--couleur-text);}
	
figure.image_a_la_une{
  display: flex;
  flex-direction: column;
  align-items: center; }

img.image_a_la_une{
	max-width : 600px;
	height : auto;
}
  
figcaption.image_a_la_une{
	font-size: 0.8rem;
	font-style: italic; }

pre.requete{
	font-size: 0.8rem;
	margin-left:5%;
	padding: 0.5rem;
	border: solid 1px pink;
	background: rgb(220,220,220);
	width:min-content;}

.iframe_sparql{
	border: solid 1px pink;
	margin-left:5%;
	margin-right:5%; 
	height: 70vh;
	width: 90%;	
	align-items: center;
}

/* LE FOOTER */

footer{
	display: flex;
	justify-content: space-evenly;
	border-top: solid 4px #ddd;
	background-color: #eee;
	border-bottom: solid 2px #ddd; }

footer ul{
	list-style: none; /*pas de puce*/
	}

footer a{
	/*retirer effet bleu souligné */
	text-decoration: none;
	color: var(--couleur-text);
	}