.gameGrid{
  width: 100vw;
  height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background: url("../images/felt.jpg");
}
.gameGrid h1 {
  font-family: Georgia, 'Times New Roman', Times, serif;
  font-size: 50px;
  line-height: 70px;
  color: gold;
  text-shadow: 2px 2px 2px black;
}
.gameGrid h2 {
  font-family: Georgia, 'Times New Roman', Times, serif;
  font-size: 30px;
  line-height: 50px;
  color: goldenrod;
}
.splash {
  display: block;
  width: 400px;
  height: 400px;
  padding: 20px 20px;
  font-family: Georgia, 'Times New Roman', Times, serif;
  font-size: 23px;
  line-height: 28px;
  text-align: justify;
  cursor: pointer;
  background: rgba(0,0,0,0.5);
  color: goldenrod;
  border-radius: 20px;
  box-shadow: 3px 3px 3px grey;
}
.splash:hover{
  box-shadow: none;
  background: rgba(0,0,0,0.6);
}
.grid{
  width: 400px;
  height: 400px;
  display: none;
  flex-wrap: wrap;
  background-color: #dcd6bc;
  border: 10px solid #dcd6bc;
  border-radius: 20px;
}
.grid div{
  width: 40px;
  height: 40px;
  outline: 1px solid #444;
  text-align: center;
  line-height: 40px;
  cursor: pointer;
  font-size: 23px;
}
.valid {
  height: 40px;
  width: 40px;
  border: 5px solid;
  background: #bbb;
  border-color: #f5f3eb #bab7a9 #bab7a9 #fff9db;
  box-sizing: border-box;

}
.checked {
  height: 40px;
  width: 40px;
  border: 2px solid;
  background-color: #cecab7;
  border-color: #9c998d;
  box-sizing: border-box;
}
.bomb {
  background: #bbb;
  height: 40px;
  width: 40px;
  border: 5px solid;
  border-color: #f5f3eb #bab7a9 #bab7a9 #fff9db;
  box-sizing: border-box;
}
.one {
  color: blue;
}
.two {
  color: green;
}
.three {
  color: red;
}
.four{
  color: darkblue;
}
.five{
  color: rgb(0, 75, 0);
}
.six{
  color: darkred;
}
.seven{
  color: cyan;
}
.eight{
  color: purple;
}