body {
  background: #111;
  color: #eee;
  height: 100%;
  width: 100%;
  font-family: sans-serif;
}

button {
  background: #222;
  color: #eee;
}

#selector-combat {
  display: none;
}

.compass-button {
  width: 100px;
  height: 100px;
  font-size: 18px;
}

.active-compass-button {

}

.inactive-compass-button {
  background: #111;
}

.action-button {
  width: 100px;
  height: 100px;
  font-size: 18px;
}

.active-action-button {

}

.inactive-action-button {
  background: #111;
}

.combat-button {
  width: 100px;
  height: 100px;
  font-size: 18px;
}

.active-combat-button {

}

.inactive-combat-button {
  background: #111;
}

#log {
  background: #222;
  width: 100%;
  height: 100%;
  flex: 3;
}

#stats {
  float: right;
  flex: 1;
}

.stat-line {

}

#game-and-stats {
  margin: auto;
  height: 500px;
  width: 700px;
  display: flex;
}

#footer {
  width: 500px;
  margin: auto;
}

.selector {
  display: flex;
}