.image-wrapper {
  display: flex;
}
.image-wrapper picture {
  display: flex;
  width: 100%;
  height: 100%;
}
.image-wrapper img {
  height: 100%;
}

img.image-ratio {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 1.65;
}

@media (min-width: 480px) {
  img.image-ratio-unset-sm {
    width: inherit;
    object-fit: unset;
    aspect-ratio: initial;
  }
}
@media (min-width: 768px) {
  img.image-ratio-unset-md {
    width: inherit;
    object-fit: unset;
    aspect-ratio: initial;
  }
}
@media (min-width: 992px) {
  img.image-ratio-unset-lg {
    width: inherit;
    object-fit: unset;
    aspect-ratio: initial;
  }
}
@media (min-width: 1296px) {
  img.image-ratio-unset-xl {
    width: inherit;
    object-fit: unset;
    aspect-ratio: initial;
  }
}
@media (min-width: 1620px) {
  img.image-ratio-unset-xxl {
    width: inherit;
    object-fit: unset;
    aspect-ratio: initial;
  }
}
.image-face-56 {
  width: 56px;
  border-radius: 1000px;
}
