* {
	margin: 0;
	padding: 0;


}


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


}

	section {
		width: 16.6666666666666667%;
		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: salmon;
    }
		.red:hover {
			background-color: peachpuff;
    	}	

	.pink {
		background-color: peachpuff;
	}
		.pink:hover {
		background-color: salmon;
		}
	.orange {
		background-color: orange;
	}
		.orange:hover {
		background-color: yellow;
		}
	.green {
		background-color: teal;
	}
		.green:hover {
		background-color: limegreen;
	}
	.yellow {
		background-color: yellow;

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

	}
	.limegreen  {
		background-color: limegreen;

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

	}
	.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;

	}



h1 {font-family: "Avenir";
 	color: pink;
 	font-size: 24pt;
 	text-align: right;
}