/* 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;
}

.fade_in.delay_1 {
  -webkit-animation-delay: 1.5s;
  -moz-animation-delay: 1.5s;
  animation-delay: 1.5s;
}

.floating {
    animation-name: floating;
    animation-duration: 9s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    margin-left: 0;
    margin-top: 0;
}

.floating2 {
    animation-name: floating2;
    animation-duration: 12s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    margin-left: 0;
    margin-top: 0;
}

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

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


/* 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; }
}

/* Internet Explorer */
@-ms-keyframes fadein {
    from { opacity: 0; }
    to   { opacity: 1; }
}

@keyframes floating {
    0% { transform: translate(0, 0); }
    50%  { transform: translate(200px, 200px) scale(2); }
    100%   { transform: translate(0, 0); }
}

@keyframes floating2 {
    0% { transform: translate(0, 0); }
    50%  { transform: translate(-450px, 170px) scale(2.7); }
    100%   { transform: translate(0, 0); }
}