/* fade in class */
.fade_in {
	-webkit-animation: fadein 1.5s; /* Safari, Chrome and Opera > 12.1 */
	-moz-animation: fadein 1.5s; /* Firefox < 16 */
	-ms-animation: fadein 1.5s; /* Internet Explorer */
	-o-animation: fadein 1.5s; /* Opera < 12.1 */
	animation: fadein 1.5s;
}

.delay_2s {
	animation-delay: 2s;
}

/* run class */
.run {
	-webkit-animation: run 0.5s; /* Safari, Chrome and Opera > 12.1 */
	-moz-animation: run 0.5s; /* Firefox < 16 */
	-ms-animation: run 0.5s; /* Internet Explorer */
	-o-animation: run 0.5s; /* Opera < 12.1 */
	animation: run 0.5s;
}

/* reveal effect items */
.reveal {
  position: relative;
  transform: translateY(80px);
  opacity: 0;
  transition: 0.5s all ease;
}

.reveal.active {
  transform: translateY(0);
  opacity: 1;
}

.reveal_up {
  animation: reveal_up 1.5s cubic-bezier(0.77, 0, 0.175, 1);
}

.zoom_out {
	 animation: zoom-out 12s ease-out ;
}

/* animations */
@keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; animation-play-state:paused; }
}

/* Firefox < 16 */
@-moz-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; animation-play-state:paused; }
}

/* Safari, Chrome and Opera > 12.1 */
@-webkit-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; animation-play-state:paused; }
}

@keyframes run {
	from {  opacity: 0; left: -50%; }
	to   {  opacity: 1; left: 0; animation-play-state:paused; }
}


@keyframes reveal_up {
  from {  opacity: 0; transform: translate(0,100%); }
  to { opacity: 1; transform: translate(0,0);  }
}


@keyframes zoom-out {
  0% {
    transform: scale(1.3, 1.3);
  }
  100% {
    transform: scale(1, 1);
  }
}