.autoplayvideo__container {
  position: relative;
  display: flex;
  overflow: hidden; }

.autoplayvideo__video {
  position: absolute;
  z-index: 1;
  height: 100%;
  width: 100%; }

.autoplayvideo__video > div {
  animation-fill-mode: both;
  animation-duration: 1s;
  animation-timing-function: ease-in;
  animation-name: fadein; }

@keyframes fadein {
  0% {
    opacity: 0; }
  100% {
    opacity: 1; } }

picture {
  position: absolute;
  z-index: 0;
  height: 100%;
  width: 100%; }
  picture img {
    height: 100%;
    width: 100%;
    object-fit: cover; }

.autoplayvideo__aspect, .autoplayvideo__aspect--square, .autoplayvideo__aspect--4x3, .autoplayvideo__aspect--16x9, .autoplayvideo__aspect--1-85x1, .autoplayvideo__aspect--2-39x1 {
  position: relative;
  width: 100%; }
  .autoplayvideo__aspect:after, .autoplayvideo__aspect--square:after, .autoplayvideo__aspect--4x3:after, .autoplayvideo__aspect--16x9:after, .autoplayvideo__aspect--1-85x1:after, .autoplayvideo__aspect--2-39x1:after {
    content: "";
    display: block;
    padding-bottom: 100%; }

.autoplayvideo__aspect--square .autoplayvideo__video > div {
  margin: -40%; }

.autoplayvideo__aspect--4x3:after {
  padding-bottom: 75%; }

.autoplayvideo__aspect--4x3 .autoplayvideo__video > div {
  margin: -40%; }

.autoplayvideo__aspect--16x9:after {
  padding-bottom: 56.25%; }

.autoplayvideo__aspect--16x9 .autoplayvideo__video > div {
  margin: 0%; }

.autoplayvideo__aspect--1-85x1:after {
  padding-bottom: 54%; }

.autoplayvideo__aspect--1-85x1 .autoplayvideo__video > div {
  margin: 0%; }

.autoplayvideo__aspect--2-39x1:after {
  padding-bottom: 41.8%; }

.autoplayvideo__aspect--2-39x1 .autoplayvideo__video > div {
  margin: 0%; }

.xd-image-container {
  width: 100%;
  position: relative;
  background-color: #efefef; }
  .xd-image-container:after {
    content: "";
    display: block;
    padding-bottom: 100%; }

.xd-image-container__crop, .xd-image-container__crop--square, .xd-image-container__crop--circle, .xd-image-container__crop--4x3, .xd-image-container__crop--3x2, .xd-image-container__crop--16x9, .xd-image-container__crop--1-85x1, .xd-image-container__crop--2x1, .xd-image-container__crop--2-39x1, .xd-image-container__crop--3x1, .xd-image-container__crop--4x1, .xd-image-container__crop--5x1, .xd-image-container__crop--6x1 {
  position: relative;
  width: 100%; }
  .xd-image-container__crop:after, .xd-image-container__crop--square:after, .xd-image-container__crop--circle:after, .xd-image-container__crop--4x3:after, .xd-image-container__crop--3x2:after, .xd-image-container__crop--16x9:after, .xd-image-container__crop--1-85x1:after, .xd-image-container__crop--2x1:after, .xd-image-container__crop--2-39x1:after, .xd-image-container__crop--3x1:after, .xd-image-container__crop--4x1:after, .xd-image-container__crop--5x1:after, .xd-image-container__crop--6x1:after {
    content: "";
    display: block;
    padding-bottom: 100%; }

.xd-image-container__crop--circle {
  border-radius: 50%;
  overflow: hidden; }

.xd-image-container__crop--4x3:after {
  padding-bottom: 75%; }

.xd-image-container__crop--3x2:after {
  padding-bottom: 66%; }

.xd-image-container__crop--16x9:after {
  padding-bottom: 56.25%; }

.xd-image-container__crop--1-85x1:after {
  padding-bottom: 54%; }

.xd-image-container__crop--2x1:after {
  padding-bottom: 50%; }

.xd-image-container__crop--2-39x1:after {
  padding-bottom: 41.8%; }

.xd-image-container__crop--3x1:after {
  padding-bottom: 33%; }

.xd-image-container__crop--4x1:after {
  padding-bottom: 25%; }

.xd-image-container__crop--5x1:after {
  padding-bottom: 20%; }

.xd-image-container__crop--6x1:after {
  padding-bottom: 18%; }