*{
	margin: 0;
	padding: 0;
}

main#canvas{
	width: 52.2vw;
	height: 52.5vw;
}

section.orange {
	width: 45%; 
	height: 90%;
	float: left;
}

section.orange-two {
	width: 45%; 
	height: 90%;
	float: right;
}
article.green{
	width: 75%;
	height: 85%;
	float: left;
}

article.green-two{
	width: 75%;
	height: 85%;
	float: right;

}

figure.gold-one{

	width: 65%;
	height: 85%;
	float: left;
}

figure.red{
	
	width: 50%;
	height: 80%;
	float: left;

}

figure.gold-two{
	
	width: 65%;
	height: 85%;
	float: right;

}

figure.red-two{
	width: 50%;
	height: 80%;
	float: right;
}

.orange-two{
	background-color: orange;
}

.green-two{
	background-color: limegreen;
}

.gold-two{
	background-color: gold;
}

.red-two{
	background-color: tomato;
}

.red {
	background-color: tomato;
}

.orange{
	background-color: orange;
}

.gold-one{
	background-color: gold;
}

.green{
	background-color: limegreen;
}

.blue{
	background-color: blue;
}



/*CSS Hover*/

.orange-two:hover{
	background-color: gold;
}

.green-two:hover{
	background-color: blue;
}

.gold-two:hover{
	background-color: tomato;
}

.red-two:hover{
	background-color: orange;
}

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

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

.gold-one:hover{
	background-color: tomato;
}

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

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