* {
	max-width: 100%;
}
html, body {
	margin: 0;
	padding: 0;
	width: 100vw;
	min-height: 100vh;
	background-image: linear-gradient(180deg, #eeeeff, #aaaaff);
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.6vw;
}

.BOX_Pad {
	padding: 1rem;
}

.ROW_New {
	clear: both;
}
.PAGE_New {
	clear: both;
}


#BOX_Grid {
	position: relative;
	width: 100vw;
	height: 90vh;
}

.BOX_Square {
	position: absolute;
	width: calc(10vw - 2px);
	height: calc(9vh - 2px);
	border: 1px solid #6666cc;
	background-color: none;
	color: #ffffff;
	text-align: center;
	font-size: 2.5vh;
	font-weight: bold;
	text-decoration: none;
	z-index: 1000;
}
	.BOX_Square:hover, .BOX_Square.Catch {
		background-color: rgba(128, 128, 128, .5);
		cursor: pointer;
	}


#BOX_Ball {
	position: absolute;
	width: calc(10vw - 4px);
	height: calc(9vh - 4px);		
	border: 2px solid #666666;
	border-radius: 1vw;
	font-size: 8vh;
	text-align: center;
	font-weight: bold;
	transition: all 1s;
	transition-timing-function: ease-out);
	z-index: 100;
}


#BOX_Controls {
	position: relative;
	width: calc(100vw - 4px);
	height: calc(10vh - 4px);
	background-color: #eeeeee;
	border: 2px solid #999999;
	border-top-left-radius: 2vw;
	border-top-right-radius: 2vw;
	z-index: 1000;
}
		
		
#LAB_Feedback {
	position: absolute;
	left: 25vw;
	top: 1vh;
	width: 50vw;
	text-align: center;
	color: #ff0000;
	font-size: 3vh;
	font-weight: bold;
}