*{
	margin: 0 ;
	padding: 0;
}

header#canvas {
	width: 78.2vw;
	height: 52vw;
	background-color: red;
	margin: 5vw auto 0 auto;
}

	section{
		width: 16.66666667%;
		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: tomato;
	}
		.pink:hover { 
			background-color: red;
	}
	.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;
	}