body {
  background: green;
  background-image: url("../css/card-deck-css/images/Other/istockphoto-1303915114-612x612.jpeg");
  background-size: cover;
  /* background-position: center; */
  height: 100vh;
  font-family: Helvetica;
  display: grid;
  /* mobile first - single column */
  grid-template-rows: 100px 200px 100px 100px 100px;
  grid-template-columns: 6fr 5fr 2fr 2fr 2fr 2fr;
  /* grid-gap: 10vw; */
  text-align: center;
}

header {
  font-family: Helvetica;
  color: white;
  padding: 10px;
  display:grid;
  grid-column: 1;
  grid-row: 1;
  border: 2px solid grey;
  border-radius: 10px;
  outline: auto;
  background: black;
  /* height: 5vh; */
  /* bottom: 20px; */
}

#game-results {
  grid-column-start: 2;
  grid-column-end: 5;
  grid-row: 3;
  grid-gap: 10px;
  font-size: 35px;
  color: yellow;
  border: 2px solid grey;
  border-radius: 10px;
  outline: auto;
  background: black;
  padding: 15px;
  margin: 60px 50px -60px;
}

/* #start {
  height: 10vh;
  grid-column: 5;
  grid-row: 5;

} */

#play-buttons {
  display: grid;
  grid-column: 1;
  grid-row: 3;
  height: 15vh;
  width: 10vh;
  /* width: 200px; */
  justify-self: center;
  /* align-self: stretch; */
}

.player {
  font-size: 20px;
  grid-column-start: 2;
  grid-column-end: 5;
  grid-row: 5;
  color: white;
}

.dealer {
  font-size: 20px;
  color: white;
  grid-column-start: 2;
  grid-column-end: 5;
  grid-row: 1;
}

#dealer-hand {
  font-size: 28px;
  grid-column: 3;
  grid-row: 2;
}

#dealer-total {
  grid-column: 3;
  grid-row: 4;
  color: white;
}

#dealer-deck {
  grid-column: 2;
  grid-row: 1;
  border: 2px solid grey;
  border-radius: 10px;
  outline: auto;
  background: red;
  padding: 20px;
  margin: 0px 300px;
}

#player-deck {
  grid-column: 3;
  grid-row: 11;
  border: 2px solid grey;
  border-radius: 10px;
  outline: auto;
  background: blue;
  padding: 20px;
  margin: 0px 300px;
}

#player-hand {
  font-size: 28px;
  grid-column: 3;
  grid-row: 10; 
}

#player-total {
  grid-column: 3;
  grid-row: 9;
  color: white;
}
/* .hidden {
  display: none;
} */

button {
  /* display: grid; */
  /* margin: 50px 50px 30px 10px; */
  /* padding: 50px; */
  font-size: 16px;
  background: yellow;
  color: grey;
  border: 2px solid grey;
  border-radius: 10px;
  outline: none;
  
}

button:hover {
  background-color: rgb(228, 231, 20);
  color: white;
}

.card-deck {
  transform: translate(15vw, 5vh) rotate(-25deg);
}