#overlay {
	position: fixed; /* Sit on top of the page content */
	display: none; /* Hidden by default */
	width: 100%; /* Full width (cover the whole page) */
	height: 100vh;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0,0,0,0.65); /* Black background with opacity */
	z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
}
@media screen and (orientation:portrait) {
	#overlay {
		height: 100vh; /* Fallback for browsers that do not support Custom Properties */
		height: calc(var(--vh, 1vh) * 100);
	}
}
.centeralize_overlay{
	height: 100%;
	display: flex;
	align-content: center;
	justify-content: center;
	flex-direction: column;
}

/*#####################           overlay content*/

.gameover_text{
	color: #B9BBBE;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 8vh;
	margin-bottom: 2.5vh;
	font-family: "comic sans ms", serif;
}

@media screen and (orientation:portrait) {
	.gameover_text {
		font-size: 8vw;
	}
}

.right_ans_text{
	color: #B9BBBE;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 6vh;
	margin-bottom: 0.5vh;
	font-family: "comic sans ms", serif;
}

@media screen and (orientation:portrait) {
	.right_ans_text {
		font-size: 7vw;
	}
}

.score_highscore_text{
	color: #B9BBBE;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 1.5vh;
	font-size: 4vh;
	font-family: "comic sans ms", serif;
}

@media screen and (orientation:portrait) {
	.score_highscore_text {
		font-size: 5vw;
	}
}

/*#######################             button*/

.restart_button{
	font-family: monospace, serif;

	background-color: #36393F;
	border: 0;
	outline: none;
	color: #B9BBBE;
	border-radius: 20px;

	font-size: 8vh;

	padding: 15px;
	padding-left: 30px;
	padding-right: 30px;

	margin: 0 auto;
	margin-top: 5vh;

	display: flex;
	justify-content: center;
	align-content: center;
}

.restart_button:active{
	background-color: #2E3034;
}

.restart_button_fix{
	min-width: 0;

	display: flex;
	justify-content: center;
}

@media screen and (orientation:portrait) {
	.restart_button {
		font-size: 8vw;
	}
}
