body, html {
  font-family: sans-serif;
  height: 100%;
  margin: 0;
  padding: 0;
}
.footer {
  border: 2px solid black;
  padding: 0.25em 0.5em;
}
#irreligious-game {
  display: flex;
  align-items: stretch;
  position: relative;
  height: 100%;
  margin: 0;
  padding: 0;
}
#resource-section {
  flex-basis: 75%;
  margin: 0.25em 0.5em;
  overflow: auto;
}
#logging-section {
  flex-basis: 25%;
  overflow: auto;
  background-color: #eee;
  border: 2px solid black;
  margin: 0.25em 0.5em;
  padding: 0.25em 0.5em;
}
#logging-section div p {
  margin: 0 0 0.25em 0;
  padding: 0;
}
.resource-type-container {
  display: flex;
  flex-wrap: wrap;
}
.resource {
  min-width: 12em;
  border: 2px solid black;
  padding: 0.25em 0.5em;
  margin: 0 0.5em 0.5em 0;
}
.resource.locked {
  opacity: 0.25;
}
#resource-container-religion .resource {
  background-color: #ccf;
}
#resource-container-job .resource {
  background-color: #fcf;
}
#resource-container-purchasable .resource {
  background-color: #cfc;
}
#resource-container-infrastructure .resource {
  background-color: #fcc;
}
#resource-container-passive .resource {
  background-color: #ffc;
}
#resource-container-research .resource {
  background-color: #cff;
}