/**                                      
    __     _ _        _____         ___         
 __|  |_ _| |_|___   |   __|___ ___|  _|___ ___ 
|  |  | | | | | .'|  |   __|   | . |  _| -_|  _|
|_____|___|_|_|__,|  |_____|_|_|_  |_| |___|_|  
                               |___| 
    ***/
@charset "UTF-8";

	* {
		margin: 0;
		padding: 0;
		color: #000;
	}


/* Canvas */

	main#canvas {
		width: 68.6vw;
		height: 45.65vw;
		margin: 5.6vh auto 0 auto;
	}



/* ARTIST CREDIT */

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



/* HTML5 SEMANTIC TAGS */

	section {
		width: 100%;
		height: 150%;
		float: center;
	}

	article {
		width: 100%;
		height: 100%;
		float: center;
	}

	figure {
		width: 2.38%;
		height: 100%;
		float: left;
	}



/* CSS COLOR CLASSES */


	.olivedrab {
		background-color: #6b8e23;
	}

	.gold {
		background-color: gold;
	}

	.black {
		background-color: black;
	}

	.red {
		background-color: red;
	}

	.blue {
		background-color: blue;
	}

	.dimgrey {
		background-color: dimgrey;
	}

	.redbrown {
		background-color: #a52a2a;
	}

	.pink {
		background-color: pink;
	}

	.green {
		background-color: green;
	}


/* CSS PSEUDO-CLASS HOVER STATES */

	.olivedrab:hover {
		background-color: gold;
	}

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

	.black:hover {
		background-color: #a52a2a;
	}

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

	.blue:hover {
		background-color: #6b8e23;
	}

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

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

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

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