@charset "utf-8";
/* CSS Document */

/* CSS RESET */

	* {
		margin: 0;
		padding: 0;
	}

/* SEMANITC TAGS */
body {
	padding-top:20vh;
}

main {
	width: 48vw;
	height: 30vw;
	background-color: black;
	margin-left: auto;
  	margin-right: auto;
}

figure {
	width: 1.5vw;
	height:30vw;
	display: inline-block;
	  	float:left;
}

.maroon {
	background-color:maroon;
}

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

.red {
	background-color: red;
}

.red:hover {
	background-color: lime;
}

.blue {
	background-color:blue;
}

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

.olive {
	background-color: olive;
}

.olive:hover {
	background-color:fuchsia;
}

.orange {
	background-color:orange;
}

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

.purple {
	background-color:purple;
}

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

.fuchsia {
	background-color: fuchsia;
}

.fuchsia:hover {
	background-color: maroon;
}

.black {
	background-color:black;
}

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

.white {
	background-color:white;
}

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

.teal {
	background-color:teal;
}

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

.aqua {
	background-color: aqua;
}

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