#container, #controlcontainer, #infopanel, #roundstatus{
  display: flex;
  justify-content: center;
  align-items: center;
}

#minesweeper{
  border: 0.3vw black solid;
  border-spacing: 0px;
  position: relative;
  display: none;
}

.cell {
  border: 0.2vw outset gray;
  background-color: lightgray;
  text-align: center;
  width: 2vw;
  height: 2.4vw;
  padding: 0;
}

.cell.open {
  background-color: darkgray;
  border-style: inset;
}

.cellContent {
  width: 2vw;
  height: 2vw;
  font-size: 1.5vw;
  overflow: hidden;
  font-weight: bold;
  line-height: 2vw;
  user-select: none;
  margin: 0;
}

#controlcontainer{
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 0.2vw;
}

#joincode{
  width: 4vw;
}

#gamecontrols > input{
  width: 3vw;
}

.mine{
  background-color: red;
}

.exploded{
  background: repeating-linear-gradient(    45deg,    red,    red 10px,    darkgray 10px,    darkgray 20px  );
}

#gameid, #players, #prevMove, #gametimer, #zoomfactor{
  margin-left: 1em;
  margin-right: 1em;
}

p[data-player-colour="1"], .cellContent[data-player-colour="1"] {
  color: blue;
}

p[data-player-colour="2"], .cellContent[data-player-colour="2"] {
  color: green;
}

p[data-player-colour="3"], .cellContent[data-player-colour="3"] {
  color: red;
}

p[data-player-colour="4"], .cellContent[data-player-colour="4"] {
  color: purple;
}

p[data-player-colour="5"], .cellContent[data-player-colour="5"] {
  color: maroon;
}

p[data-player-colour="6"], .cellContent[data-player-colour="6"] {
  color: turquoise;
}

p[data-player-colour="7"], .cellContent[data-player-colour="7"] {
  color: black;
}

p[data-player-colour="8"], .cellContent[data-player-colour="8"] {
  color: gray;
}

.cell.open > .mine1 {
  color: blue;
}

.cell.open > .mine2 {
  color: green;
}

.cell.open > .mine3 {
  color: red;
}

.cell.open > .mine4 {
  color: purple;
}

.cell.open > .mine5 {
  color: maroon;
}

.cell.open > .mine6 {
  color: turquoise;
}

.cell.open > .mine7 {
  color: black;
}

.cell.open > .mine8 {
  color: gray;
}

.playername {
  display: inline;
  margin-right: 1em;
}

.mouseCursor{
  position: absolute;
  width: 1.5vw;
  height: 2.2vw;
  background-size: 1.5vw;
  pointer-events: none;
}