/* Auteur : Adrien Risse 
   Date : 19.12.2019
   Description : Feuille CSS du site 
   */
   /* Ceci va centré tout les titres H1 */
h1 , h2 {
  text-align : center;
}
/* cela va mettre une image de fond
et mettre la police en arial 
*/
body {
  color : white;
  padding-left : 15em;
  padding-right : 15em;
  padding-bottom : 1em;
  padding-top : 1em;
  background-size : cover;
  background-image : url(../images/joueur2.jpg);
  font-family: Arial, Helvetica, sans-serif;  
}
.contenuPrincipal {
  margin-left: auto;
  margin-right: auto;
  background-color: black;
  padding: 0.5em;
}
.contenuAcceuil {
  text-align: justify;
  font-size: 1.3em;
}
/* le contenu des pages va utiliser 75% de la page
*/
.elemContenu{
  padding-right: 2em;
  padding-left: 2em;
  width : 75%;
  min-width : 200px;
}
/* cela défini la taille de l'image
*/
.imageAcceuil {
  width : 60%;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
/* Cela met une image de fond sur la page des équipes
*/
#bodyEquipe {
  background-color : white;
  background-image : url(../images/fondEquipe.jpg);
}
/* le menu de navigation va utiliser 25% de la page*/
.menu-verticalAcceuil {
  width : 25%;
  min-width : 200px;
}
/* cela définit la taille des caractères dans le tableau
*/
.menu-verticalAcceuil a {
  background-color: #eee;
  color: black;
  display: block;
  padding: 0.5em;
  text-decoration: none;
  text-align: left;    
  font-size: 17pt;
}
/* Cela va définir la taille des images dans le div équipe 
*/
.equipe {
  display : flex;
  width : 20%;
  padding-left : 5em;
}
table, td , th { 
border: 1px solid white;
border-collapse: collapse;
}
a {
font-size : 1.5em;
}
.equipes {
  display : flex;
  flex-wrap : wrap;
}
.conteneur {
  display : flex;
}
.img {
  width : 50%;
  display: block;
  margin-right: auto;
  margin-left: auto;
}
.img img {
  width : 8em;
}

li  {
  display: block;
  color: white;
  padding: 2px 1px;
  text-decoration: none;
}
 a:hover:not(.active) {
  background-color: #585858;
  color: white;
}

.contenuAcceuil {
  display : flex;
}
 .tableau {
width : 45em;
display : flex;
 }   
 /* Cela va centrer les pieds de page 
 */
footer {
  text-align : center;
  margin-top : 5em;
}
.imageVideo {
  width : 45%;
}
a.active {
  background-color: #585858;
  color: white;
}
th {
  font-size : 2em;
}
.division {
  font-size : 1.5em;
}
.imagePresident{
  width : 20em;
}
.imageLogo {
  width : 10em;
}

.pdpAccueil {
  margin-top : 8em;
}
/* adaptation pour laptop*/
@media screen and (max-width : 1440px) {
  body {
    padding-left : 5em;
    padding-right : 5em;
  }
  .menu-verticalFonctionnement {
    margin-left : 40%;
  }
  .menu-verticalHistoire {
    width : 40%;
  }
  .menu-source {
    margin-left : 62em;
  }
}
@media screen and (max-width : 1300px) {
  body {
    padding-left : 0em;
    padding-right : 0em;
  }
}
/* adaptation pour iPad */
@media screen and (max-width : 1024px) {
  body {
    padding-left : 2em;
    padding-right : 2em;
  }

  
}
/* adaptation pour natel */
@media screen and (max-width : 500px) {
  body {
    padding-left : 0em;
    padding-right : 0em;
    font-size : 0.8em;
  }

     
}