#githubRibbon {
	position: absolute;
	right: 0;
	top: 0;
	margin: 0;
	padding: 0;
}

@media (max-width: 1030px) {
	#githubRibbon {
		display: none;
	}
}

body {
	text-align: center;
}

#gameTitle {
	margin: 0;
	font-size: 200%;
}

#gameArea {
	display: inline-block;
	user-select: none;
}

#statusArea {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	margin: 0.5ex 2ex;
}

#statusArea div {
	text-align: left;
}

#gameBoard {
	position: relative;
	display: grid;
	grid-template-rows: repeat(4, 1fr);
	grid-template-columns: repeat(4, 1fr);
	max-width: 100vw;
}

#gameBoard .imgWrapper {
	margin: 0.5ex;
	line-height: 0;
	background-color: #ddd;
	position: relative;
}

#gameBoard img {
	width: 100%;
	height: 100%;
	max-height: calc((100vh - 9em) / 4);
}

#gameBoard img:not(.prevImg) {
	position: relative;
	z-index: 1;
}

#gameBoard img.prevImg {
	position: absolute;
	top: 0;
	left: 0;
}

#startButton {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 40%;
	height: 25%;
	font-size: 150%;
	z-index: 2;
}

#gameBoard:not(.gameInitial) #startButton {
	display: none;
}

#countdownArea {
	position: absolute;
	top: 50%;
	transform: translate(0, -50%);
	font-size: 500%;
	width: 100%;
	z-index: 2;
}

#gameBoard:not(.gameCountdown) #countdownArea {
	display: none;
}

#finishArea {
	position: absolute;
	top: 50%;
	transform: translate(0, -50%);
	font-size: 500%;
	width: 100%;
	z-index: 2;
}

#gameBoard:not(.gameFinish) #finishArea {
	display: none;
}

#retryButton {
	position: absolute;
	top: 25%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 40%;
	height: 25%;
	font-size: 150%;
	z-index: 2;
}

#gameBoard:not(.gameResult) #retryButton {
	display: none;
}

#postButton {
	position: absolute;
	top: 75%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 40%;
	height: 25%;
	font-size: 150%;
	z-index: 2;
}

#postLink {
	display: none;
}

#gameBoard:not(.gameResult) #postButton {
	display: none;
}

#loadErrorArea {
	position: absolute;
	top: 50%;
	transform: translate(0, -50%);
	font-size: 200%;
	width: 100%;
	z-index: 2;
}

#gameBoard:not(.gameLoadError) #loadErrorArea {
	display: none;
}
