.page.campaign .cards {
  display: flex;
  flex-direction: column;
  gap: 2rem 0rem;
}
.page.campaign .card {
  border-top: 1rem solid #713f12;
  position: relative;
  border-bottom: 0.1rem solid #713f12;
  background-color: #dbca9a;
}
.page.campaign .card.guardian {
  border-top-color: #324a6e;
}
.page.campaign .card.survivor {
  border-top-color: #cd1c18;
}
.page.campaign .card.seeker {
  border-top-color: #ffa62b;
}
.page.campaign .card .header {
  display: flex;
  justify-content: start;
  align-items: center;
  gap: 0px 1rem;
  background-color: #dbca9a;
  padding: 1rem;
  border-bottom: 1px solid black;
}
.page.campaign .card .header h3 {
  font-size: 1.2rem;
}
.page.campaign .card .header .icon {
  max-height: 2rem;
  height: auto;
  width: auto;
  border-radius: 0.375rem;
}
.page.campaign .card .body {
  padding: 1rem;
}
.page.campaign .card .body .character {
  display: flex;
}
.page.campaign .card .body .photo {
  border-radius: 0.25rem;
  height: 8rem;
  width: 8rem;
}
.page.campaign .card .body h4 {
  font-size: 1rem;
  text-transform: uppercase;
  margin-top: 1.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid black;
}
.page.campaign .card .body a {
  text-decoration: underline;
  text-decoration-style: solid;
  text-decoration-thickness: 2px;
}
.page.campaign .card .character .props {
  width: 100%;
  margin-left: 1rem;
}
.page.campaign .card .character .props tr td:nth-child(2) {
  text-align: right;
}