* {
  padding: 0;
  margin: 0;
  /* border: 1px solid red; */
}

body{
  display: table;
  margin: 0 auto;
  background-color: #222;
}

#gameOverDiv {
  position: absolute;
  padding: 10px;
  margin: 0;
  z-index: 10;
  font-size: 40px;
  background-color: white;
  visibility: hidden;
}

#game{
  padding: 2rem;
  display: flex;
  justify-content: center;
}

.grid {
  /* put things in a row */
  display: grid;
  gap: 1rem;
  grid-auto-flow: column;
  margin: 0 0 1rem 0;
}

#playfield {
  background: #000;
  display: block;
  margin: 0 auto;
}

#pausedGame {
  position: absolute;
  padding: 10px;
  margin: 0;
  z-index: 10;
  font-size: 40px;
  margin-left: center;
  color: white;
  visibility: hidden;
}

#holdArea {
  background: #000;
}

#holdHeader {
  font-size: 18px;
  color: whitesmoke;
  text-align: center;
}

#nextQueue {
  background: #000;
}

#nextHeader {
  font-size: 18px;
  color: whitesmoke;
  text-align: center;
}

button {
  display: block;
}

#resetBtn {
  background-color: gray;
  display: block;
  margin: auto;
  margin-top: 10px;
  font-size: 16px;
}

#controls {
  color: whitesmoke;
  position: relative;
}