/*----------------------------propriétés générales et propres à la page 1---------------------------*/



/*-----caractéristiques de base pour toutes les pages-----*/



header h1{
	font-size: 50px;
	color: black;
	text-align: center;
}


p {
	padding-top: 20px;
	padding-bottom: 20px;
	margin: 50px auto;
}

body {
  font-family: "Bahnschrift", "Bahnschrift", CSS;
  color:black;
  background-color: rgb(249, 235, 234);/* pink background */
  margin: 1;
  display: grid;
  grid-template-rows: auto 1fr auto;
  font-size: 25px;
  align-items: start;
  min-height: 100vh;
  line-height: 1.6;
  margin-right: 50px;
  margin-left: 50px;
  text-align: justify; 
}

/*---fin caractéristiques de base pour toutes les pages-----*/




/*caractéristiques du menu*/

#menu {
	z-index: 999;
	padding: 50px;
	position: sticky;
}

h2 {
	font-size: 35px;
	text-align: center;
}


header p {
	font-size: 25px;
	text-align: center;
	color: black;
}

/*fin caractéristiques du menu*/





/*information sur la ligne (hr)*/
hr {
	position: relative;
	top: 70px;
	height: 5px;
	background: rgb(255, 255, 255);
	margin-bottom: 100px;
}

/*tiret pour créer une séparation*/

.separation {
	color: white;
	text-align: center;
}



/* -------------slider ------------*/

.slides {
	display: flex;
	align-items: center;
	flex-direction: row;
	width: calc(500*6);
	animation: glisse 30s infinite ease;
}

 
.slide {
	float: left;
	/*opacity: 0.9; /* opacité des images*/
	margin:auto;
	border-radius: 30px;"
}


.slider{
	width:1200px;
	overflow: hidden;
	margin: 120px auto;
}


@keyframes glisse {

	0% {
		transform: translateX(0);
	}
	
	10% {
		transform: translateX(0);
	}
	
	25% {
		transform: translateX(-1200px);
	}
	35% {
		transform: translateX(-1200px);
	}
	
	50% {
		transform: translateX(-2400px);
	}
	60% {
		transform: translateX(-2400px);
	}
	75% {
		transform: translateX(-3600px);
	}
	85% {
		transform: translateX(-3600px);
	}
	100% {
		transform: translateX(0);
	}
}

/* fin du slider */




/* haut de page */

#menu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
  background-color: #6C5FA7;
}

#menu li {
  float: left;
}

#menu li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

#menu li a:hover {
  background-color: #A495C6;
}

#menu .active {
  background-color: #6B3779;
}



/* fin du haut de page */


/*pied de page*/

footer {
  display: flex;
  flex-flow: row wrap;
  padding: 30px 30px 20px 30px;
  color: #fff;
  background-color: #6C5FA7;

}

.legal {
  color: #fff;
  margin-left: 1000px;
}


/*fin du pied de page*/




/*----------------------------propriétés propres à la page 2---------------------------*/

/*propriétés des images*/

#écosystème_électrique {
	width: auto;
	height: auto;
	display: block;
	margin-left: auto;
	margin-right: auto;
	border-radius: 30px;
	margin-bottom: 60px;
	margin-top: 60px;
}


#serveur {
	width: 600px;
	height: auto;
	display: block;
	margin-left: auto;
	margin-right: auto;
	border-radius: 8px;
	margin-bottom: 50px;
	margin-top: 50px;
}
	
#energie_du_soleil {
	width: auto;
	height: auto;
	display: block;
	margin-left: auto;
	margin-right: auto;
	border-radius: 50px;
	margin-bottom: 30px;
	margin-top: 50px;
}

/*propriétés du tableau*/

table {
	border: 2px solid;
	text-align: center;
	margin: 50px auto;
	margin-bottom: 120px;
	width: 80%;
}

th {
	height: 70px;
	background-color: #6C5FA7;
	color: white;
}
th, td {
	padding: 15px;
	text-align: center;
}

tr:hover {background-color: #E0BBE4;}

/*----------------------------propriétés propres à la page 3---------------------------*/

/*propriétés d'image*/

#obsolescence_programmée {
	width: auto;
	height: auto;
	display: block;
	margin-left: auto;
	margin-right: auto;
	border-radius: 30px;
	margin-bottom: 120px;
	margin-top: 120px;
}



/*----------------------------------------------------------------------------------fin du fichier CSS----------------------------------------------------------------------------*/