*{
	padding: 0;
	margin: 0;
}

header{
	width: 48.25vw;
	height: 57.7vw;
	margin: auto;
	background-color: #d3d3d3;
}
	
	section{
	width: 91.8%;
	height: 88.1%	;
	margin: auto;
	float: left;
	margin-top: 2.9%;
	margin-left: 4.2%;
		
	}
		article{
			width: 0.933%;
			height: 100%;
			float: left;
		}

		h1{
						text-align: center;
						font-family: sans-serif;
						margin: auto;
						margin-top: 2vh;
						margin-left: 3vw;
						font-size: 30pt;
					}

		#goback{
			margin-left: 42.5%;
			margin-top: -8vh;
			max-height: 15vh;
			max-width: auto;
			animation: hide 5s;
					}

					@keyframes hide{
						0%		{opacity: 0;}
						90%		{opacity: 0;}
						100%	{opacity: 1;}
					}
		}
.gray{
	background-color: #d3d3d3;
}
	.gray:hover{
	background-color: #768cb3;
}

	.lightblue{
		background-color: #768cb3;
	}	
		.lightblue:hover{
		background-color: #333237;
		}

		.purple{
			background-color: #778ab2;
		}
			.purple:hover{
			background-color: #d3d3d3;
			}

		.blue{
			background-color: #5a94a6;
		}
			.blue:hover{
			background-color: #b97763;
			}
		.yellow{
			background-color: #c39250;
		}
			.yellow:hover{
			background-color: #d3d1ce;
			}
		.orange{
			background-color: #b97763;
			width: 0.934%;
		}
			.orange:hover{
			background-color: #778ab2;
			}
		.black{
			background-color: #333237;
			width: 0.957%;
		}
			.black:hover{
			background-color: #5a94a6;
			}
		.white{
			background-color: #d3d1ce;
		}
			.white:hover{
			background-color: #c39250;
			}