/*gestion du fond de la page*/

body{
  background-image: url('Intersex-inclusive_pride_flag.svg');
  background-size: cover; /* Fait en sorte que l'image couvre tout l'écran */
  background-position: center; /* Centre l'image */
  background-attachment: fixed; /* Créé un effet de parallaxe */
  height: 100vh; /* Fait en sorte que le body prenne toute la hauteur de la fenêtre */
  margin: 0; /* Supprime les marges par défaut */
}

body::after{
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  size:100%;
  height: 100vh; /* Fait en sorte que le body prenne toute la hauteur de la fenêtre */
  background-color: rgba(255, 255, 255, 0.8); /* Couleur blanche avec 0 % d'opacité */
  z-index: 1; /* Assurer que l'overlay soit au-dessus de l'image */
}

body * {
    position: relative; /* Positionner le texte au-dessus de l'overlay */
    z-index: 2; /* Assurer que le texte soit au-dessus de l'overlay */
}

/* alignement de la page*/
header{
  text-align:center;
}

main, footer{
  max-width:90%;
  margin:auto;
  padding:3rem;
}

.flexsimple{
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-evenly;
}

/*taille des objets*/
.vignette{
	max-width:500px;
    height:auto;
}

.plaque{
  background-color: #d3d3d3;
  padding:1rem;
}

iframe{
  width:60vw;
  height: 30vh;
  border: 1px solid black;
}

/*responsive*/

@media screen and (max-width: 540px) {

.vignette{
	max-width:90%;
    height:auto;
}

iframe{
  max-width:90%;
  max-height: auto;
}
}