html, body {
  background-color: #FFFFFF;
}

.image-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.7s; /* Just to make the adjustment smooth */
}
.image-wrapper img {
  height: 90%;
}

@media (max-height: 199px) {
  .image-wrapper img {
    height: 90px;
  }
}
@media (min-height: 200px) and (max-height: 299px) {
  .image-wrapper img {
    height: 190px;
  }
}
@media (min-height: 300px) and (max-height: 399px) {
  .image-wrapper img {
    height: 290px;
  }
}
@media (min-height: 400px) and (max-height: 499px) {
  .image-wrapper img {
    height: 390px;
  }
}
@media (min-height: 500px) and (max-height: 599px) {
  .image-wrapper img {
    height: 490px;
  }
}
@media (min-height: 600px) and (max-height: 699px) {
  .image-wrapper img {
    height: 590px;
  }
}
@media (min-height: 700px) and (max-height: 799px) {
  .image-wrapper img {
    height: 690px;
  }
}
@media (min-height: 800px) and (max-height: 899px) {
  .image-wrapper img {
    height: 790px;
  }
}
@media (min-height: 900px) and (max-height: 999px) {
  .image-wrapper img {
    height: 890px;
  }
}
@media (min-height: 1000px) and (max-height: 1099px) {
  .image-wrapper img {
    height: 990px;
  }
}
@media (min-height: 1100px) {
  .image-wrapper img {
    height: 1090px;
  }
}

/*# sourceMappingURL=niveau.css.map */