:root {
	--bgColor: #FFF9DE; 
	--fgColor: #A6D0DD;
	--headerColor: #FF6969;
	--gamesColor: #FFD3B0;
}

.header {
	margin-left: 0%;
	margin-right: 0%;
	margin-top: 0%;
}

body {
	background-color:  var(--bgColor);
}

h1 {
	text-align: center;
	color: #FFF9DE;
	padding-top: 22px;
	font-size: 48px;
	font-family: fantasy;
	font-weight: 400;
}

.grid {
  display: flex;
  margin: -10px;
  height: 1080px;
}

.left, .right {
  width: 20%;
}

.middle {
  width: 60%;
  min-width: 960px;
  background-color:  var(--fgColor);
}

.header {
	border-radius: 10px;
	width: 96%;
	margin: 2%;
	height: 105px;
	background-color:  var(--headerColor);
}

.game-container
{	
	display: block;
	margin: 0 auto;
	width: 96%;
	height: 96%;
	border: none;
}

@media only screen and (max-width: 1024px) {
	.left, .right {
	  width: 0%;
	}

	.middle {
  	width: 100%;
	}
}

dialog {
  background: darkgrey;
  border: none;
 	border-radius: 10px;
  width: 60%;
  min-width: 968px;
  height: 660px;
}