* {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

section{
	width:12vw;
	height:100vw;
	float: left;
	text-align: center;
	font-family: sans-serif;
	font-size: 30pt;
}

.cyan{
	background-color: cyan;
}

.blue{
	background-color: blue;
}

.red{
	background-color: red;
}

.orange{
	background-color: orange;
}

.yellow{
	background-color: yellow;
}

.purple{
	background-color: purple;
}

.magenta{
	background-color: magenta;
}

.green{
	background-color: green;
}

/* HERE ARE CSS3 ANIMATIONS */

@keyframes fade-in {
	0% {opacity: 0;}
	100% {opacity: 1;}
}

	.fade-in{
		animation-name: fade-in;
		animation-duration: 1s;
		animation-fill-mode: backwards;
	}

		.fade-two{
			animation-delay: 1s;
		}

		.fade-three{
			animation-delay: 2s;
		}

		.fade-four{
			animation-delay: 3s;
		}

		.fade-five{
			animation-delay: 4s;
		}

		.fade-six{
			animation-delay: 5s;
		}

		.fade-seven{
			animation-delay: 6s;
		}

		.fade-eight{
			animation-delay: 7s;
		}