body {
  font-family: "Sofia Sans";
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  min-height: 100vh;

  font-size: var(--base-font-size);
  color: var(--font-color-base);
}

a {
  cursor: pointer;
  text-decoration: none;
  outline: none;
  color: var(--font-color-base);
}

b {
  font-weight: 800;
}

img {
  width: 100%;
  height: 100%;
}

p {
  margin: calc(var(--base-padding)*0.5) 0;
  margin-bottom: var(--base-padding);
}

h1,
h2,
h3,
h5,
h6 {
  margin: 0;
  font-weight: 600;
  padding: var(--base-padding) 0;
}

ul,
ol {
  margin: 0 calc(var(--base-padding)*2);
  padding: var(--base-padding) 0;
}

h1 {
  font-size: var(--h1-font-size);
  color: #6f6f6f;
}

h1 .fa-fw {
  padding-right: var(--base-padding);
}

h2 {
  padding-top: calc(var(--base-padding)*0.75);
  border-top: dashed #6f6f6f 1.5px;
  font-size: var(--h2-font-size);
}

.ff-container-content h2::before {
  font-family: "Font Awesome 7 Free";
  content: "\f061";
  padding-right: var(--base-padding);
}

.ff-container-content h3::before {
  font-family: "Font Awesome 7 Free";
  content: "\f138";
  padding-right: var(--base-padding);
}

button i {
  padding: 0 5px
}

sup {
  font-weight: 100;
  font-size: 10pt;
}