* {
	margin: 0;
	padding: 0;
}


header#canvas {
	width: 50vw;
	height: 42.5vw;
	background-color: gainsboro;
	padding-top: 3%;
}
    
    main {
    	width: 83%;
    	height: 6%;
    	margin-left: 7.5%;
    }

    aside {
    	width: 83%;
    	height: 7%;
    	margin-left: 7.5%;
    	padding-top: 3%;
    	box-shadow: 0px 20px 5px grey;
    }

    nav {
    	width: 100%;
    	height:50%;
    }

    footer {
    	width: 50vw;
    	height: 3.5vw;
    }
	section {
		width: 83%;
		height: 30%;
		margin-left: 7.5%;
		padding-top: 6%

	}

		article {
			width: 80%;
			height: 80%;
			margin-left: 10%;
			padding-top: 0.5%;
		} 

			figure {
				width: 97%;
				height: 20%;
				margin-left: 1.5%;
				margin-top: 1%;
			}

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

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

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

.yellowgreen {
	background-color: yellowgreen;
}
	.yellowgreen:hover {
		background-color: palevioletred;
	}

.palevioletred  {
	background-color: palevioletred;
}
	.palevioletred:hover {
		background-color: yellowgreen;
	}

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

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

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

.darkgrey {
	background-color: darkgrey;
}