/*loadingSymbol.css*/

.loading-symbol{
	display: none;
}
/*While verifying form input, the loading symbol will show*/
.game-state-1 .loading-symbol {
	display: block;
	
	border: 2vw solid #aaa0;
	border-top: 2vw solid #3ae;
	border-radius: 50%;
	
	width: 25vw;
	height: 25vw;
	margin: 0 auto;
	
	animation: spin 2s linear infinite;
}

@keyframes spin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}


/*Rules here will only apply to screens whose width 
is greater than 600px*/
@media only screen and (min-width: 601px) {
.game-state-1 .loading-symbol{
	border-width: 10px;
	
	width: 100px;
	height: 100px;
}
}