:root {
  --couleur-principal:#ffffff;
  --couleur-secondaire:#dfdfdf;
  --couleur-titre: #000000;
  --couleur-texte: #000000;
  --couleur-hover: #6f6f6f;
}
html{
    background-image: url("../src/images/fondCarte.jpg");
}
h1 {
  color: var(--couleur-titre)
}

main {
  background-color: var(--couleur-principal);
  margin-left: auto;
  margin-right: auto;
  margin-bottom : 0px;
  margin-top : 0px;
  max-width: 70em;

  border: solid;
  border-color : var(--couleur-texte);
  border-radius: 25px;

}
main>*{
    align-self: center;
    justify-content: justify;
    font-family:'Courier New', Courier, monospace;

}

#haut {
  max-width: 100%;
}
.droite, .gauche {
  display: flex;
  flex-direction: row;
}

figure {
  max-width: 100%;
  padding: 0px;
  margin: 0px;
}

footer > nav {
  background-color: var(--couleur-principal);
  text-align : center;
}
a {
  color: var(--couleur-texte);
  text-decoration: none;
}
#boutnav {
  color: var(--couleur-texte) ;
}

footer > nav >*:hover {
  color : var(--couleur-titre-hover);
  font-size: 1.1em;
}

#boutnav:hover {
  color : var(--couleur-titre-hover);
  cursor: pointer;
  font-size: 1.1em;
}
#selection {
  background-color: var(--couleur-principal);
  border: solid;
}
.liens {
  color : var(--couleur-texte);
}
/*Version portrait telephone et tablette*/
@media (hover :none) and (orientation: portrait) {

  main {
    text-align:center;
    border-radius : 50px;

    max-width: 50em;
    max-height: 125em;
  }

  h2 {
    text-align:center;
    padding : 0px;
    margin : 0px;
    font-size : 5em;
  }
  figcaption {
    font-size : 2em;
  }
  p {
    justify-content: justify;
    font-size:2em;
  }
  footer {
    margin-top : 5em;
  }
}
/*Version paysage telephone et tablette (plus adapté aux tablettes)*/
@media (hover :none) and (orientation: landscape) {
  main {
    border-radius : 50px;

    max-width: 50em;
    max-height: 50em;
  }
  h2 {
    text-align:center;
    padding : 0px;
    margin : 0px;
    font-size : 3em;
  }
  figcaption {
    font-size : 2em;
  }
  p {
    font-size:2em;
  }
  .boutnav {
    margin : 0px;
  }

  footer {
    margin-top : 1em;
  }
}