@charset "utf-8";
.effect_in {
  border-radius: 8px;
  font-size: 18px;
  text-align: center;
  opacity: 0;
  transition: all 0.7s ease-out;
}
.from-left {
  transform: translateX(-60px);
}
.from-left.active {
  opacity: 1;
  transform: translateX(0);
}
.from-right {
  transform: translateX(60px);
}
.from-right.active {
  opacity: 1;
  transform: translateX(0);
}
.fade-up {
  transform: translateY(60px);
}
.fade-up.active {
  opacity: 1;
  transform: translateY(0);
}
.rotate-in {
  transform: rotate(-15deg) scale(0.9);
}
.rotate-in.active {
  opacity: 1;
  transform: rotate(0deg) scale(1);
}
.zoom-in {
  transform: scale(0.8);
}
.zoom-in.active {
  opacity: 1;
  transform: scale(1);
}