/*
    max-height: 30vh;
    overflow-y
: scroll;
    scrollbar-color: #1b1b1b #444;
     width: 53%;*/


.ticTacToeContainer {
	position: relative;
}

.mainContainer {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.floatChild {
	position: absolute;
	top: 30px;
	left: 700px;
	width: 53%;
	border: 3px solid red;
}

.btnGame {
	font-size: 365%;
	font-family: "Lexend", monospace;
	border: 1px solid white;
	cursor: pointer;
	/*line-height: 6.25rem;*/
	text-align: center;
	align-content: center;
	aspect-ratio: 1;
}

.btnResetTurn {
	border: 4px solid white;
	font-size: 1.5rem;
	margin-top: 20px;

	&:hover {
		background-color: white;
		color: black;
	}
}

.margin {
	margin: -0.8rem;
	margin-top: 5px;
}

.turnNumber {
	font-size: 45px;
	margin-block-start: unset;
	margin-bottom: unset;
}

.textareaGame {
	width: 11rem;
}

.gameMovesUl {
	list-style-type: none;
	max-height: 45vh;
    overflow-y: scroll;
    scrollbar-color: #1b1b1b #444;
}

.scoreDiv {
	position: absolute;
	top: 30px;
	right: 700px;
	height: 100px;
	border: 3px solid #F00;
}

.score {
	font-size: 25px;
	margin-block-start: unset;
	margin-bottom: unset;
}

.scoreNumber {
	font-size: 35px;
	margin-block-start: unset;
	margin-bottom: unset;
	text-align: center;
}

@media (max-width: 1000px) {
	.floatChild {
		display: block;
		position: static;
		width: 62%;
		height: 100%;
		margin-inline: auto;
	}

	.gameMovesUl {
		padding: unset;
		max-height: 30vh;
	}

	.lastMoves {
		text-align: center;
	}

	.scoreDiv {
		display: block;
		position: static;
		margin-inline: auto;
	}

	.score {
		font-size: x-large;
	}

	.scoreNumber {
		font-size: 45px;
	}
}

@media (max-width: 600px) {
	.floatChild {
		display: none;
	}
}
