body {
	background-color: #fff;
	font-family: sans-serif;
	text-align: center;
}

button {
	font-size: 1rem;
	width: 6rem;
	height: 2rem;
	border: 0;
	cursor: pointer;
	margin:0.4em;
}

SELECT {font-size:1em;}

input {
	font-size: 1.1rem;
	width:10em;
	height: 2rem;
	padding: 0.4rem;
	background-color:  #dad8af;
	border: none;
}

table {
	margin-top: 8rem;
	border-spacing: 1%;
	margin: 0 auto;
	max-height:80%;
	background:#222;
}

td {
	width: 50px;
	padding-top: 6%;
	background-color: rgb(200,200,200);
	border-radius: 1%;
}

td.type2 {
	background-color: rgb(174, 174, 174);
}

td.row-highlighted {
	background-color: rgb(140,140,140);
}

td:hover {
	background-color: rgb(150,150,150);
}

td.selected, td.type2.selected {
	background-color: orange;
	animation-name: flash;
	animation-duration: 0.4s;
}

@keyframes flash {
	from {
		background-color: rgb(255, 255, 100);
	}

	to {
		background-color: orange;
	}
}

canvas {
	z-index: -100;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 15%;
}

.loading {
	position:fixed;
    width:500px;
    height:160px;
    line-height: 160px;
    margin:-210px auto auto -250px;
    top:50%;
    left:50%;
    text-align: center;
    font-size: 1.6rem;
    background-color: rgb(85, 85, 85);
    color: white;
    border-radius: 1.5rem;
}