@font-face {
  font-family: "kindergarten";
  src: url("../fonts/kindergarten.ttf");
}

@font-face {
  font-family: "caca";
  src: url("../fonts/EingrantchMono-Medium.ttf");
}

@font-face {
  font-family: "sous titre";
  src: url("../fonts/JetBrainsMono-VariableFont_wght.ttf");
}



body {
  background-color: #F3E6E1;
}

h1 {
  color: black;
  text-align: center;
  font-family: kindergarten;
  font-size: 300%;
  margin-top: -6%;
}
h2{
  color: black;
  text-align: center;
  font-family: sous titre;
  font-size: 100%;

}

h3{
  color: whitesmoke;
  text-align: center;
  font-family: sous titre;
  font-size: 100%;

}

h4{
  color: black;
  text-align: center;
  font-family: caca;
  font-size: 100%;
  text-align: left;
  margin-top: 30%;
  text-align: justify;
  margin-left:10%;
}

p {
  font-family: sous titre;
  font-size: 70%;
  text-align: justify-all;
    margin-left:10%;

}


/* Mise en forme barre de navigation */
.topnav {
  background-color: none;
  overflow: hidden;
  font-family: "sous titre";
  text-align: center;
  display: flex; /* Utilisation de flexbox */
  justify-content: center; /* Centre les éléments horizontalement */
  margin-top: 7%;
}

/* Style liens dans la barre de navigation */
.topnav a {
  color: black;
  text-align: center;
  padding-left: 1%;
  padding-right: 1%;
  padding-bottom: 1%;
  padding-top: 4%;
  text-decoration: none;
  font-size: transform: scale(0,5);
}

/* Couleurs des liens au survol */
.topnav a:hover {
  background-color: whitesmoke;
  color: black;
}

/* Pour centrer l'image au milieu de la page */
.container {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 0%;
}

.image img {
  transform: scale(0.9); /* Réduit la taille de l'image à 50% */
  /* Tu peux ajouter ici d'autres styles nécessaires pour l'image */
}