.cluster {
  position: absolute;
  background: rgba(white, 0.6);
  border-radius: 50%;
  box-shadow: 1px 1px 3px rgba(black, 0.3);
}

.cluster-content {
  position: absolute;
  background: rgba(white, 0.6);
  border-radius: 50%;
  box-shadow: 1px 1px 3px rgba(black, 0.3);
  top: 8px;
  right: 8px;
  bottom: 8px;
  left: 8px;
}

.cluster-wrapper-outer {
  display: table;
  width: 100%;
  height: 100%;
}

.cluster-wrapper-inner {
  overflow: hidden;
  display: table-cell;
  text-align: center;
  vertical-align: middle;
}

.cluster-value {
  display: inline-block;
  width: 50%;
  padding-right: 3px;
  float: left;
  clear: both;
  text-align: right;
  font-weight: 600;
  font-size: 17px;
  line-height: 19px;
  height: 19px;
}

.cluster-icon {
  position: relative;
  display: inline-block;
  top: 2px;
  left: 1px;
  text-align: left;
  width: 50%;
  float: right;

  img {
    // Override toxic global styling rule, specified in solawi.ch CSS.
    // TODO: Make sure solawi.ch does not use !important for global styling rules!
    height: 14px !important;
  }
}

.depot {
  color: $blue;
}

.farm {
  color: $orange;
}

.initiative {
  color: $purple;
}