.spectacles-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  gap: 15px;
  padding: 10px;
  max-width: 1050px;
  margin: 0 auto;
  /* border: 1px dashed #8080806b; */
}

.divspectacle {
    width: calc(100% / 6 - 15px); /* 6 colonnes */
    max-width: 185px; /* Limite la taille */
    display: flex;
    flex-direction: column;
}

/* Responsive : 3 par ligne quand l'écran est < 800px */
@media (max-width: 800px) {
    .divspectacle {
        width: calc(100% / 3 - 15px); /* 3 colonnes */
    }
}

/* Responsive : 2 par ligne quand l'écran est < 500px */
/*
@media (max-width: 500px) {
    .divspectacle {
        width: calc(100% / 2 - 15px);
    }
}
*/

.divspectacle .image {
  width: 100%;
  aspect-ratio: 2 / 3;
  overflow: hidden;
  border-radius: 6px;
}

.divspectacle img {
  width: 100%;
  height: 100%;
  margin: 0px;
  padding: 0px;
  object-fit: cover;
}

.divspectacle a > img{
  filter: grayscale(0);
  transition: 700ms all;
}

.divspectacle a:hover > img{
  filter: grayscale(1);
  transition: 700ms all;
}

.infos {
  text-align: left;
  font-family: Lato;
  padding-top: 6px;
}

.divspectacle h3 {
  font-size: 12px !important;
  color: #263b47 !important;
  margin: 5px 0px !important;
  text-align: left;
  font-family: 'Poppins Regular';
}

.divspectacle p {
  font-size: 10px;
  color: #ffffff;
  margin: 0px;
  background-color: #8c8d62;
  padding: 4px;
  width: fit-content;
  border-radius: 3px;
  line-height: normal;
}

.divspectacle a {
    text-decoration: none;
    color: #000;
}
