* {
	margin: 0;
	padding: 0;
}

main#canvas {
	width: 88.7vw;
	height: 100vw;
	background-color: yellow;
}

figcaption {
	width: 68.6vw;
	margin: 0.5vw auto 0 auto;
	font-size: 12pt;
	text-align: right;
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}

	section#lightpink {
		width: 11%;
		height: 87%;
		margin-left: 4%;
		margin-top: 3%;
		float: left;
		background-color: lightpink;
	}
			article#skyblue {
			width: 7.6923%;
			height: 100%;
			float: left;
		}

	section#pink {
		width: 11%;
		height: 87%;
		margin-left: 1%;
		margin-top: 3%;
		float: left;
		background-color: pink;
	}
			article#blue{
			width: 7.6923%;
			height: 100%;
			float: left;
		}

	section#hotpink {
		width: 8.5%;
		height: 87%;
		margin-left: 1%;
		margin-top: 3%;
		float: left;
		background-color: hotpink;
	}
			article#darkblue {
			width: 10%;
			height: 100%;
			float: left;
		}

	section#deeppink {
		width: 7.5%;
		height: 87%;
		margin-left: 1%;
		margin-top: 3%;
		float: left;
		background-color: deeppink;
	}

			article#deepskyblue {
			width: 12.5%;
			height: 100%;
			float: left;
		}

	section#yellowgreen {
		width: 9.5%;
		height: 87%;
		margin-left: 1%;
		margin-top: 3%;
		float: left;
		background-color: yellowgreen;
	}
			article#rebeccapurple {
			width: 8.33333%;
			height: 100%;
			float: left;
		}

	section#limegreen {
		width: 8%;
		height: 87%;
		margin-left: 1%;
		margin-top: 3%;
		float: left;
		background-color: limegreen;
	}

		article#purple {
			width: 11.11111%;
			height: 100%;
			float: left;
		}

	section#lightgreen {
		width: 6%;
		height: 87%;
		margin-left: 1%;
		margin-top: 3%;
		float: left;
		background-color: lightgreen;
	}
			article#mediumpurple {
			width: 14.285714%;
			height: 100%;
			float: left;
		}

	section#green {
		width: 7%;
		height: 87%;
		margin-left: 1%;
		margin-top: 3%;
		float: left;
		background-color: green;
	}
			article#black {
			width: 11.111111%;
			height: 100%;
			float: left;
		}

	section#forestgreen {
		width: 16%;
		height: 87%;
		margin-left: 1%;
		margin-top: 3%;
		float: left;
		background-color: forestgreen;
	}
			article#white {
			width: 5.55555556%;
			height: 100%;
			float: left;
		}




	.skyblue {
		background-color: skyblue;
	}

	.blue {
		background-color: blue;
	}

	.darkblue {
		background-color: darkblue;
	}

	.deepskyblue {
		background-color: deepskyblue;
	}

	.purple {
		background-color: purple;
	}

	.mediumpurple {
		background-color: mediumpurple;
	}

	.rebeccapurple {
		background-color: rebeccapurple;
	}

	.white {
		background-color: white;
	}

	.black {
		background-color: black;
	}



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

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

	.darkblue:hover {
		background-color: rebeccapurple;
	}

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

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

	.mediumpurple:hover {
		background-color: deepskyblue;
	}

	.rebeccapurple:hover {
		background-color: darkblue;
	}

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

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