body {
	background-color: #F7F3E9;
}
.grid {
	display: grid;
}

#board {
	width: 500px;
	height: 500px;
	grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
	grid-template-rows: auto;
    margin: auto;
    box-shadow: 0 10px 10px -5px rgb(85, 117, 113);
    border: 4vw solid transparent;
}

.square{
	width: 60px;
	height: 60px;
	line-height: 12vw;
	text-align: center;
	justify-content: center;
	align-items: center;
	font-size: 2.5rem;
	line-height: 56px;
	padding: 2px;
}

.black-square {
	background-color: #5EAAA8;

}

.white-square {
	background-color: #A3D2CA;
}

.p1 {
	color: grey;
	text-shadow: 0 5px #F4F4F4;
}

.p2 {
	color: #F4F4F4;
	text-shadow: 0 5px grey;
}