body
{
	background-color:#fff;
	overflow-y:hidden;
	margin:0;
}

header, footer
{
	width:100%;
	text-align:center;
	background-color:#ccc;
}

.return, .reset
{
	position:absolute;
	outline:none;
	right:20px;
	top:5px;
}

.reset
{
	right:0px;
	left:20px;
}

h1
{
	margin:0;
	width:max-content;
	padding:0.67em 0;
	display:inline-block;
}

main, .tile, .move_top, .move_left, .move_right, .move_bottom, .box, .game_over
{
	display:flex;
	align-items:center;
	justify-content:center;
}

.game
{
	display:flex;
	position:relative;
	flex-flow:row;
	font-family:monospace;
	box-sizing:border-box;
	border-radius:5px;
}

.game_over
{
	background-color:#000000a8;
	position:absolute;
	border-radius:5px;
	font-size:35px;
	color:#fff;
	z-index:-1;
	opacity:0;
	transition:opacity .3s ease-in-out;
}

form
{
	text-align:center;
	position:absolute;
	line-height:26px;
	font-size:13px;
	top:57%;
}

.row
{
	display:flex;
	flex-flow:column;
	box-sizing:border-box;
	width:100%;
	height:100%;
}

.box
{
	box-sizing:border-box;
	border:1px solid #999;
	border-radius:2px;
	width:100%;
	height:100%;
}

.tile
{
	box-sizing:border-box;
	border-radius:2px;
	font-size:0px;
	width:100%;
	height:100%;
}

.move_top, .move_left, .move_right, .move_bottom
{
	position:absolute;
	border-radius:5px;
	box-sizing:border-box;
	border:2px solid #aaa;
	background-color:#ddd;
}

.move_top:hover, .move_left:hover, .move_right:hover, .move_bottom:hover
{
	border:2px solid #bbb;
	background-color:#eee;
}

.move_top::before, .move_left::before, .move_right::before, .move_bottom::before
{
	content:'';
	width:0px;
	height:0px;
	position:absolute;
}

.move_top::before
{
	border-top:0;
	border-left:10px solid transparent;
	border-right:10px solid transparent;
	border-bottom:17.5px solid #555;
}

.move_left::before
{
	border-top:10px solid transparent;
	border-left:0;
	border-right:17.5px solid #555;
	border-bottom:10px solid transparent;
}

.move_right::before
{
	border-top:10px solid transparent;
	border-left:17.5px solid #555;
	border-right:0;
	border-bottom:10px solid transparent;
}

.move_bottom::before
{
	border-top:17.5px solid #555;
	border-left:10px solid transparent;
	border-right:10px solid transparent;
	border-bottom:0;
}

.top_scores
{
	padding-top:0.67em;
	font-weight:700;
	font-size:25px;
}

.top_scores+ol
{
	margin:0;
}

.top_scores+ol li
{
	padding-top:5px;
}

footer
{
	position:absolute;
	bottom:0;
}