/*ajustememnt du nombre d'image par ligne*/

.gallery3{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  grid-template-rows: auto;
  grid-auto-flow: dense;
}

.gallery4{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem;
  grid-template-rows: auto;
  grid-auto-flow: dense;
}


.gallery3 img, 
.gallery4 img{
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.horizontal{
    grid-column: span 2;
}


@media screen and (max-width: 1023px) {
    .gallery3,
    .gallery4{
      grid-template-columns: repeat(2, 1fr);
    }

}

@media screen and (max-width: 767px) {
    .gallery3,
    .gallery4{
      grid-template-columns: repeat(1, 1fr);
    }

    .horizontal{
        grid-column: span 1;
      }
}


/*ajustememnt de la taille des images fausse_verti*/

.fausse_verti21{
  grid-column:  span 2;
}

.fausse_verti11,
.fausse_verti12{
  grid-column: span 1;
}


@media screen and (max-width: 1023px) {
    .fausse_verti12{
      grid-column: span 2;
    }

    .fausse_verti21,
    .fausse_verti11{ 
      grid-column: span 1;
      }


}

@media screen and (max-width: 767px) {
    .horizontal,
    .fausse_verti12,
    .fausse_verti11,
    .fausse_verti21,
    .gallery img {
        grid-column: auto;
    }
}