.viewmore {
  padding: 1em;
  border: 1px solid #c8c0c3;
}

.viewmore + .viewmore {
  border-top: 0;
}

.viewmore > a {
  display: block;
  border: 0;
  padding: 1em;
  margin: -1em;
  transition: background-color 200ms linear, color 200ms linear;
  background-color: #fff;
}

.viewmore > a.toggle-on {
  background-color: #1d374a;
  color: #fff;
}

.viewmore h3 {
  font-size: 1.25em;
  font-weight: bold;
  font-family: inherit;
  margin: 1.5em 0 1em;
}

.viewmore .staff {
  margin: 0;
}

.viewmore .staff .row {
  margin: 0 -15px;
}

.viewmore .viewmore-content > :first-child {
  margin-top: 2em;
}

article .viewmore-content {
  height: auto;
  max-height: 0;
  transition: max-height 400ms linear;
}

article .viewmore-content.shown {
  height: auto;
  max-height: 3000px;
}

.viewmore > a::after {
  content: var(--fa-angle-down);
  font-family: Icons;
  float: right;
}

.viewmore > a.toggle-on::after {
  content: var(--fa-angle-up);
}