* {
	margin: 0;
	padding: 0;
}


header#canvas {
	width: 38.7vw;
	height: 38.5vw;
	background-color: red;
}

	header#left {
		width: 9.675vw;
		height: 38.5vw;
		float: left;
		background-color: black;
	}

		section {
			width: 100%;
			height: 25%;
		}

				article {
					width: 25%;
					height: 25%;
					float: left;
				}



/* CSS NAMED COLOR CLASSES*/


.blue {
	background-color: 717FDF;
}

.blue:hover{
	background-color: 908123;
}

.linen {
	background-color: EDE483;
}

.linen:hover{
	background-color: 131C83;
}

.teal {
	background-color: 2A5D5B;
}

.teal:hover{
	background-color: D5A3A6;
}

.orange {
	background-color: FD691C;
}

.orange:hover{
	background-color: 28C5FB;
}

.lime {
	background-color: D9DB02;
}

.lime:hover{
	background-color: 2822FC;
}

.burgundy {
	background-color: 5C2608;
}

.burgundy:hover{
	background-color: AADFFE;
}

.navy {
	background-color: 2A213A;
}

.navy:hover{
	background-color: D5DEC1;
}

.red {
	background-color: D83802;
}

.red:hover{
	background-color: 25C4F9;
}