body {
  background: #eee;
  font-family: Arial;
}

.game-area {
  display: flex;
  margin: auto;
}

@media (max-aspect-ratio: 1/1){
  .game-area {
    width: 100%
  }
}

@media (min-aspect-ratio: 1/1){
  .game-area {
    width: 75%
  }
}

#log-area {
  flex: 3;
}

#log {
  height: 600px;
  overflow: auto;
  background-color: #fff;
}

.stat-header-self {
  font-weight: bold;
  font-size: 150%;
  min-width:250px;
}

.stat-header {
  font-weight: bold;
  font-size: 150%;
  min-width:130px;
}

.stat-line {
  font-weight: normal;
  font-size: 12pt;
}

.stat-container {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  text-align: right;
  flex: 1;
}

.button-container {
  display: flex;
  flex-wrap: wrap;
  flex-direction: column;
  flex: 1;
}

.action-button {
  font-size: 24px;
  width: 200px;
  height: 75px;
}