.container {
  display: grid;
  grid-template-areas:
          "player1container acceptcontainer player2container"
          "leather leather leather"
          "fabric fabric fabric"
          "spice spice spice"
          "silver silver silver"
          "gold gold gold"
          "diamond diamond diamond"
          "menu menu menu";

  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(8, 1fr);
}

@media screen and (orientation: landscape){
  /*.container {display: none; }*/
}
.group {
 &.leather { grid-area: leather; }
 &.fabric { grid-area: fabric; }
 &.spice { grid-area: spice; }
 &.silver { grid-area: silver; }
 &.gold { grid-area: gold; }
 &.diamond { grid-area: diamond; }
}

.player1container {grid-area: player1container; }
.player2container {grid-area: player2container;}
#menu { grid-area: menu; }