.animate {
  position: relative;
  display: inline-block;
}
.animate .item,
.animate .item2,
.animate .item3,
.animate .item4,
.animate .item5 {
  position: relative;
  opacity: 0;
  transition: 1s ease-out;
}
.animate .item2 {
  transition: 1.5s ease-out;
}
.animate .item3 {
  transition: 2s ease-out;
}
.animate .item4 {
  transition: 4s ease-out;
}
.animate .item5 {
  transition: 5s ease-out;
}
.animate .ease-top {
  top: -100%;
}
.animate .ease-left {
  left: -100%;
}
.animate .ease-left2 {
  left: -200%;
}
.animate .ease-left3 {
  left: -300%;
}
.animate .ease-right {
  right: -100%;
}
.animate .ease-bottom {
  bottom: -100%;
}
.animate.visible .item,
.animate.visible .item2,
.animate.visible .item3,
.animate.visible .item4,
.animate.visible .item5 {
  opacity: 1;
}
.animate.visible .ease-top {
  top: 0;
}
.animate.visible .ease-left,
.animate.visible .ease-left2,
.animate.visible .ease-left3 {
  left: 0;
}
.animate.visible .ease-right {
  right: 0;
}
.animate.visible .ease-bottom {
  bottom: 0;
}

/*# sourceMappingURL=animate.css.map */