html {
  background: #222;
  color: #999;
  font-family: sans-serif;
  text-align: center;
}

a {
  cursor: pointer;
}

.reset-game {
  font-size: 38px;
}

h1 {
  font-family: 'Just Me Again Down Here', cursive;
  font-weight: normal;
  font-size: 72px;
  margin: 0;
}

.board-settings {
  margin-top: -20px;
  margin-bottom: 20px;
}

.board-settings > a {
  font-family: 'Just Me Again Down Here', cursive;
  font-size: 24px;
  margin: 10px;
}
.board-settings > a.active {
  text-decoration: underline;
}

.board-size-panel {
  display: flex;
  width: 640px;
  margin: auto;
  margin-bottom: 30px;
}

.board-size-panel a {
  font-size: 22px;
  margin: 5px;
}

.board-info {
  margin: auto;
  display: flex;
  width: 300px;
}

.board-info > div {
  font-size: 28px;
  padding-top: 6px;
}

.reset-game {
  flex: 1;
  padding: 0;
}

.reset-game > div {
  font-size: 12px;
  margin-top: -3px;
  margin-bottom: 10px;
}

.reset-game > .smiley {
  color: #C5C66C;
  margin-top: -10px;
  margin-bottom: 0px;
  font-size: 40px;
}

.reset-game.game-lost > .smiley{
  transform: rotate(180deg);
  color: #B04A58;
  margin-top: -3px;
  margin-bottom: -10px;
}

.reset-game.game-won > .smiley{
  color: #33AB33;
}

.board {
  display: table;
  border-collapse: collapse;
  background: #222;
  border: 2px solid #565656;
  margin: auto;

  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  cursor: default;
}

.row {
  display: table-row;
}

.cell {
  display: table-cell;
  width: 25px;
  height: 25px;
  border: 1px solid black;
  text-align: center;
  vertical-align: middle;
}

div[class=cell]:hover {
  background-color: #2a2a2a;
}

.revealed {
  /*font-weight: bold;*/
  background-color: #1C1C1C;
  border: none;
}

.value-1 {
  color: #79A4BE;
}

.value-2 {
  color: #948ADD;
}

.value-3 {
  color: #CC6DEA;
}

.value-4 {
  color: #EE41AF;
}

.value-5, .value-6, .value-7, .value-8 {
  color: #EE4141;
}

.bomb {
  color: #B04A58;
  font-size: 0.8em;
}

.flagged {
  color: #bada55;
}