
.image-cycle-image1, .image-cycle-image2, .image-cycle-mask1, .image-cycle-mask2, .image-cycle-image-placeholder {
  width: 100%;
  height: 100%;
  position: absolute;
  bottom: 0; /* px */
  right: 0; /* px */
  background-repeat: no-repeat;
}
.image-cycle-image1, .image-cycle-image2, .image-cycle-image-placeholder {
  background-size: auto 100%;
}
.image-cycle-image-placeholder {
  opacity: 0;
  transition: opacity 1s ease;
}
.image-cycle-image-show {
  opacity: 1;
}
.image-cycle-image1 {
  z-index: 1;
}
.image-cycle-image2 {
  background-position: bottom right;
  bottom: -10%;
  z-index: 2;
  box-sizing: border-box;
  /* border-bottom: solid 1px white; */
}
.image-cycle-mask1 {
  z-index: 3;
  height: 100%;
  background-position: bottom left;
  background-size: contain;
  background-image: url('/static/img/image-mask-face-right.svg');
}

.image-cycle-mask2 {
  z-index: 3;
  height: 100%;
  background-position: bottom right;
  bottom: -10%;
  background-size: contain;
  background-image: url('/static/img/image-mask-face-left.svg');
}

