@charset "utf-8";
/* CSS Document */

/* Assignment of animations */
.motion {
	position: relative;
}
.goup, .godown, .goleft, .goright, .fadein {
	-webkit-animation-play-state: paused;
    animation-play-state: paused;
}
.goup {
	animation-name: goup;
	animation-duration: 1s;
	position: relative;
	left: 0px;
}
.godown {
	animation-name: godown;
	animation-duration: 1s;
	position: relative;
	left: 0px;
}
.goleft {
	animation-name: goleft;
	animation-duration: 1s;
	position: relative;
	top: 0px;
}
.goright {
	animation-name: goright;
	animation-duration: 1s;
	position: relative;
	top: 0px;
}
.fadein {
	animation-name: fadein;
	animation-duration: 1s;
	position: relative;
	top: 0px;
}
/* END of assignment of animations */

/* Animations */

/* --- Go up --- */
@-webkit-keyframes goup {
    from {
		top: 10em;
		opacity: 0;
	}
    to {
		top: 0em;
		opacity: 1;
	}
}
@keyframes godown {
    from {
		top: 10em;
		opacity: 0;
	}
    to {
		top: 0em;
		opacity: 1;
	}
}

/* --- Go down --- */
@-webkit-keyframes godown {
    from {
		top: -10em;
		opacity: 0;
	}
    to {
		top: 0em;
		opacity: 1;
	}
}
@keyframes godown {
    from {
		top: -10em;
		opacity: 0;
	}
    to {
		top: 0em;
		opacity: 1;
	}
}

/* --- Go left --- */
@-webkit-keyframes goleft {
    from {
		left: 10em;
		opacity: 0;
	}
    to {
		left: 0em;
		opacity: 1;
	}
}
@keyframes goleft {
    from {
		left: 10em;
		opacity: 0;
	}
    to {
		left: 0em;
		opacity: 1;
	}
}

/* --- Go right --- */
@-webkit-keyframes goright {
    from {
		left: -10em;
		opacity: 0;
	}
    to {
		left: 0em;
		opacity: 1;
	}
}
@keyframes goright {
    from {
		left: -10em;
		opacity: 0;
	}
    to {
		left: 0em;
		opacity: 1;
	}
}

/* --- Fade In --- */
@-webkit-keyframes fadein {
    from {
		opacity: 0;
	}
    to {
		opacity: 1;
	}
}
@keyframes fadein {
    from {
		opacity: 0;
	}
    to {
		opacity: 1;
	}
}

/* END of animations */