/* Application styles */

:root {
  --cell-size: 32px;
}

table.board {
  border-collapse: collapse;
  table-layout: fixed;
  width: calc(var(--cell-size) * 30);
  background-color: #f0f2f2;
  /* disable selection, it breaks flow of the game if done accidentally*/
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
}

table.board td {
  border: 1px solid black;
  width: var(--cell-size);
  height: var(--cell-size);
  text-align: center;
  font-weight: bold;
}

table.board td.ch {
  background-color: #9b9e9e;
  padding: 0;
  box-sizing: border-box;
  font-size: 120%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
}

table.board td.ch:hover {
  background-color: #cbcbcb;
}

/* Colors of numbers */

table.board td.c1 {
  color: blue;
}
table.board td.c2 {
  color: green;
}
table.board td.c3 {
  color: red;
}
table.board td.c4 {
  color: darkblue;
}
table.board td.c5 {
  color: maroon;
}
table.board td.c6 {
  color: cyan;
}
table.board td.c7 {
  color: purple;
}
table.board td.c8 {
  color: grey;
}