*{
	margin: 0;
	padding: 0;

}

header#canvas {
	width: 78vw;
	height: 52vw;
	margin-top: 2vw;
	margin-left: 3vw;
}

section {
	width: 16.66666666%;
	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;

}
.orange {
	background-color: orange;

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

}
.green{
	background-color: green;
}

.green:hover {
	background-color: darkcyan;

}
.yellow {
	background-color: yellow;

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


}
.limegreen{
	background-color: limegreen;

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

}
.cyan {
	background-color: cyan;

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

}
.pink{
	background-color: peachpuff;

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

}