.wonder-civ {
  border: black solid;
  margin: 1em;
  background-color: white;
}

.wonder-civ-wonder {
  background-position: center;
  background-size: cover;
}

.wonder-civ-structs {
  display: flex;
}
.wonder-civ-struct-col {
  display: flex;
  flex-direction: column;
}
.wonder-civ-struct-group {
  list-style-type: none;
  padding-left: 0;
  font-size: 0.8em;
  width: 12em;
}
.wonder-civ-struct {
  border: thin black solid;
  font-weight: bold;
}
.wonder-civ-struct-type-commerce { background-color: yellow; color: black; }
.wonder-civ-struct-type-culture { background-color: blue; color: white; }
.wonder-civ-struct-type-science { background-color: green; color: white; }
.wonder-civ-struct-type-basic-industry { background-color: brown; color: white; }
.wonder-civ-struct-type-advanced-industry { background-color: lightgray; color: black; }
.wonder-civ-struct-type-guild { background-color: purple; color: white; }
.wonder-civ-struct-type-military { background-color: red; color: white; }