* {
	margin: 0;
	padding: 0;

}

header#canvas {
	width: 78.2vw;
	height: 52vw;
	margin: 2vw auto 0 auto;
}

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

	article {
		width: 60%;
		height: 80%;
		margin-left: 20%;
		margin-top: 40%;
	}

		figure {
			width: 15%;
			height: 97.5%;
			float: left;
			margin-left: 8%;
			margin-top: 6;
		}

/* CSS NAMED COLOR CLASSES */

.red {
	background-color: tomato;
}
	.red:hover {
		background-color: peachpuff;
		}

.pink {
	background-color: peachpuff;
}

	.pink:hover {
		background-color: tomato;
		}

.orange {
	background-color: orange;
}
	
	.orange:hover {
		background-color: yellow;
		}

.yellow {
	background-color: yellow;
}

	.yellow:hover {
		background-color: orange;
		}

.green {
	background-color: darkcyan;
}
	.green:hover {
		background-color: limegreen;
		}

.limegreen {
	background-color: limegreen;
}
	.limegreen:hover {
		background-color: darkcyan;
		}

.cyan {
	background-color: powderblue;
}
	.cyan:hover {
		background-color: blue;
		}
.blue {
	background-color: blue;
}
	.blue:hover {
	background-color: powderblue;
	}
.purple {
	background-color: darkorchid;
}

	.purple:hover {
	background-color: black;
	}

.black {
	background-color: black;
}
	    .black:hover {
		background-color: darkorchid;
		}

