body{
	background: green;
}
.container{
	width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}
.row{
	display: flex;
	justify-content: center;
}
.hexagon{
	position: relative;
	height: 6vh;
	width: 6vh;
	clip-path: polygon(25% 5%, 75% 5%, 100% 50%, 75% 95%, 25% 95%, 0% 50%);
	margin: 2px -3px 2px -3px;
	padding: 0;
	background-color: white;
}
.hexagon:hover{
	opacity: 0.8;
}
.lower, .blank{
	top: 25px;
}
.blank{
	background-color: green
}
.player{
	background: url("/images/player.png") no-repeat fixed left 9px bottom 9px/28px;
}
.player-with-ball{ 
	background: url("/images/player.png") no-repeat fixed left 9px bottom 9px/28px, url("/images/ball.png") no-repeat fixed right 12px bottom 3px/13px;
}
.r{
	background-color: red;
}
.b{
	background-color: cyan;
}