/* ••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••
•••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••
•••••••••••••••••••••••••••••••••••••••••OO••••••••••••••••••••••••••••••••••••••••
•••••••••••••••••••••••••••••••••••••••••OO••••••••••••••••••••••••••••••••••••••••
•••••••••••••••••••••••••••••••••••••••••OO••••••••••••••••••••••••••••••••••••••••
••••••••••••••••••••••••••••••••••••••••OOOO•••••••••••••••••••••••••••••••••••••••
••••••••••••••••••••••••••••••••••••••••OOOO•••••••••••••••••••••••••••••••••••••••
••••••••••••••••••••••••••••••••••••••••OOOO•••••••••••••••••••••••••••••••••••••••
••••••••••••••••••••••••••••••••••••••••OOOO•••••••••••••••••••••••••••••••••••••••
•••••••••••••••••••••••••••••••••••••••OOOOOO••••••••••••••••••••••••••••••••••••••
•••••••••••••••••••••••••••••••••••••••OOOOOO••••••••••••••••••••••••••••••••••••••
•••••••••••••••••••••••••••••••••••••••OOOOOO••••••••••••••••••••••••••••••••••••••
••••••••O••••••••••••••••••••••••••••••OOOOOO••••••••••••••••••••••••••••O•••••••••
•••••••••OO•••••••••••••••••••••••••••OOOOOOOO•••••••••••••••••••••••••OO••••••••••
•••••••••••OOO••••••••••••••••••••••••OOOOOOOO••••••••••••••••••••••OOO••••••••••••
•••••••••••••OOOO•••••••••••••••••••••OOOOOOOO•••••••••••••••••••OOOO••••••••••••••
•••••••••••••••OOOOOO•••••••••••••••••OOOOOOOO••••••••••••••••OOOOOO•••••••••••••••
•••••••••••••••••OOOOOOO•••••••••••••OOOOOOOOOO•••••••••••••OOOOOO•••••••••••••••••
•••••••••••••••••••OOOOOOO•••••••••••OOOOOOOOOO••••••••••OOOOOOO•••••••••••••••••••
••••••••••••••••••••••OOOOOOOO•••••••OOOOOOOOOO•••••••OOOOOOOO•••••••••••••••••••••
•••••••••••••••••••••••OOOOOOOOOO••••OOOOOOOOOO••••OOOOOOOOO•••••••••••••••••••••••
•••••••••••••••••••••••••OOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOOO•••••••••••••••••••••••••
••••••••••••••••••••••••••••OOOOOOOOOOOOOOOOOOOOOOOOOOOO•••••••••••••••••••••••••••
••••••••••••••••••••••••••••••OOOOOOOOOOOOOOOOOO000000•••••••••••••••••••••••••••••
••••••••••••••••••••••••••••••••OOOOOOOOOOOOOOOOOOOO•••••••••••••••••••••••••••••••
•••••••••••••••••••••••••••••••••OOOOOOOOOOOOOOOOOO••••••••••••••••••••••••••••••••
•••••••••••••••••••••••••••••••••••OOOOOOOOOOOOOO••••••••••••••••••••••••••••••••••
•••••••••••••••••••••••••••••••••••••OOOOOOOOOO••••••••••••••••••••••••••••••••••••
•••••••••••••••••••••••••••••••••••••••OOOOOO••••••••••••••••••••••••••••••••••••••
•••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••
•••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••
••••••••••••••••••••••••••••••••••••••DESIGN BY••••••••••••••••••••••••••••••••••••
••••••••••••••••••••••••••••••••••••MARCELO LAYERA•••••••••••••••••••••••••••••••••
•••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••
•••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••••• */

/* CSS RESET */

* {
	margin: 0;
	padding: 0;
}

header#canvas {
	width: 51.6vw;
	height: 51.6vw;
	padding: .96vw;
	margin: 2vh auto 2vh auto;
}

	section	{
		width: 20%;
		height: 100%;
		float: left;
	}

		article {
			width: 100%;
			height: 20%;
			margin-top: 100%
		}

		article#center {
			width: 100%;
			height: 60%;
			margin-top: 100%
		}


/* CSS NAMED COLOR CLASSES */

.gold {
	background-color: #ffbe00;
}

	.gold:hover {
	background-color: #660038;
}

.maroon {
	background-color: #660038;
}

	.maroon:hover {
	background-color: #7db016;
}

.yellowgreen {
	background-color: #7db016;
}

	.yellowgreen:hover {
	background-color: #ffbe00;
}

.black {
	background-color: #333333;
}

	.black:hover {
		background-color: #bfbfbf;
	}