:root {
  --flipcard-transition-duration: 0.33s;
  --flipcard-transition-easing-function: ease-in;
}
.Flipcard,
.Flipcard-back,
.Flipcard-flipper,
.Flipcard-front {
  outline: 0;
  -webkit-box-shadow: none;
  box-shadow: none;
}
.Flipcard-back,
.Flipcard-front {
  z-index: 0;
  overflow-x: hidden;
}
@-moz-document url-prefix() {
  .Flipcard {
    perspective: none !important;
  }
}
.Flipcard {
  -webkit-perspective: 1000px;
  perspective: 1000px;
  width: 100%;
}
.Flipcard-flipper {
  -webkit-transition: var(--flipcard-transition-duration, 0.33s)
    var(--flipcard-transition-easing-function, ease-in);
  transition: var(--flipcard-transition-duration, 0.33s)
    var(--flipcard-transition-easing-function, ease-in);
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  position: relative;
}
.Flipcard-back,
.Flipcard-front {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transition: opacity var(--flipcard-transition-duration, 0.33s)
      var(--flipcard-transition-easing-function, ease-in),
    -webkit-transform var(--flipcard-transition-duration, 0.33s) var(--flipcard-transition-easing-function, ease-in);
  transition: opacity var(--flipcard-transition-duration, 0.33s)
      var(--flipcard-transition-easing-function, ease-in),
    -webkit-transform var(--flipcard-transition-duration, 0.33s) var(--flipcard-transition-easing-function, ease-in);
  transition: transform var(--flipcard-transition-duration, 0.33s)
      var(--flipcard-transition-easing-function, ease-in),
    opacity var(--flipcard-transition-duration, 0.33s)
      var(--flipcard-transition-easing-function, ease-in);
  transition: transform var(--flipcard-transition-duration, 0.33s)
      var(--flipcard-transition-easing-function, ease-in),
    opacity var(--flipcard-transition-duration, 0.33s)
      var(--flipcard-transition-easing-function, ease-in),
    -webkit-transform var(--flipcard-transition-duration, 0.33s) var(--flipcard-transition-easing-function, ease-in);
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-transform: rotateY(0);
  transform: rotateY(0);
  position: absolute;
  top: 0;
  left: 0;
}
.Flipcard-front {
  z-index: 2;
  -webkit-transform: rotateY(0);
  transform: rotateY(0);
}
.Flipcard-back {
  -webkit-transform: rotateY(-180deg);
  transform: rotateY(-180deg);
}
.Flipcard--horizontal.Flipcard--flipped > .Flipcard-front {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
}
.Flipcard--horizontal.Flipcard--flipped > .Flipcard-back {
  -webkit-transform: rotateY(0);
  transform: rotateY(0);
}