/*
          /\  /\ 
        =(  ^.^ )= 
         __m__m__
			Everything is going to be okay!
			ok-studio.com
*/			

/* =CSS Reset= */

	* {
		margin: 0;
		padding: 0;
	}

/* =Divs= */	

main#canvas {
	width: 53vw;
	height: 62vw;
	margin: 2vw auto 0 auto;
}

section#left {
	height: 90%;
	width: 44%;
	float: left;
}

article#left {
	height: 90%;
	width: 75%;
	float: left;
}

figure#left {
	height: 88%;
	width: 68%;
	float: left;
}

figcaption#left {
	height: 87%;
	width: 47%;
	float: left;
}

section#right {
	height: 90%;
	width: 44%;
	float: right;
}

article#right {
	height: 90%;
	width: 75%;
	float: right;
}

figure#right {
	height: 88%;
	width: 68%;
	float: right;
}

figcaption#right {
	height: 87%;
	width: 47%;
	float: right;
}

/* =Color Classes= */	

.navy {
	background-color: #1d2855;
}

.orange {
	background-color: #c84f24;
}

.lime {
	background-color: #7eb041;
}

.yellow {
	background-color: #edc815;
}

.crimson {
	background-color: #c34546;
}

/* =CSS Pseudo-Class Hover States= */	

.navy:hover {
	background-color: #c84f24;
}

.orange:hover {
	background-color: #7eb041;
}

.lime:hover {
	background-color: #edc815;
}

.yellow:hover {
	background-color: #c34546;
}

.crimson:hover {
	background-color: #1d2855;
}