/*Animation keyframes*/
@keyframes fadeIn {
  from {
    opacity: 0;
  } to {
    opacity: 1;
  }
}
@keyframes flyLeft {
  from {
    opacity: 0;
    transform: translate3d(25%, 0, 0);
  } to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
@keyframes flyRight {
  from {
    opacity: 0;
    transform: translate3d(-25%, 0, 0);
  } to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
@keyframes flyUp {
  from {
    opacity: 0;
    transform: translate3d(0, 25%, 0);
  } to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
@keyframes flyDown {
  from {
    opacity: 0;
    transform: translate3d(0, -25%, 0);
  } to {
    opacity: 1;
    transform: translate3d(0%, 0, 0);
  }
}
@keyframes flyIn {
  from {
    opacity: 0;
    transform: scale(0.75);
  } to {
    opacity: 1;
    transform: scale(1);
  }
}
@keyframes glideLeft {
  from {
    opacity: 0;
    transform: translate3d(25%, 0, 0);
  } to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
@keyframes glideRight {
  from {
    opacity: 0;
    transform: translate3d(-25%, 0, 0);
  } to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
@keyframes glideUp {
  from {
    opacity: 0;
    transform: translate3d(0, 25%, 0);
  } to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
@keyframes glideDown {
  from {
    opacity: 0;
    transform: translate3d(0, -25%, 0);
  } to {
    opacity: 1;
    transform: translate3d(0%, 0, 0);
  }
}
@keyframes glideIn {
  from {
    opacity: 0;
    transform: scale(0.75);
  } to {
    opacity: 1;
    transform: scale(1);
  }
}
/*End Animation keyframes*/
.main-container .animate {
  opacity: 0;
}
.main-container .fly-left.triggered {
  animation: flyLeft 1s ease-out 0s 1 normal;
}
.main-container .fly-right.triggered {
  animation: flyRight 1s ease-out 0s 1 normal;
}
.main-container .fly-up.triggered {
  animation: flyUp 1s ease-out 0s 1 normal;
}
.main-container .fly-down.triggered {
  animation: flyDown 1s ease-out 0s 1 normal;
}
.main-container .fly-in.triggered {
  animation: flyIn 1s ease-out 0s 1 normal;
}
.main-container .glide-left.triggered {
  animation: glideLeft 1s ease-out 0s 1 normal;
}
.main-container .glide-right.triggered {
  animation: glideRight 1s ease-out 0s 1 normal;
}
.main-container .glide-up.triggered {
  animation: glideUp 1s ease-out 0s 1 normal;
}
.main-container .glide-down.triggered {
  animation: glideDown 1s ease-out 0s 1 normal;
}
.main-container .glide-in.triggered {
  animation: glideIn 1s ease-out 0s 1 normal;
}
.main-container .glitch {
  opacity: 0;
}
.main-container .glitched {
  opacity: 1;
}
.main-container .triggered {
  animation: fadeIn 1s ease-in-out 0s 1 normal;
  opacity: 1;
}