.footer {
  text-align: center;
  padding: var(--spacer);
  padding-top: calc(var(--spacer) * 2);
  color: var(--text-color-light);
  line-height: var(--spacer);
}

@media (min-width: 40rem) and (min-height: 500px) {
  .footer {
    position: fixed;
    width: 100%;
    border: 0;
    z-index: 0;
    bottom: 0;
  }
}

.copyright {
  margin-top: calc(var(--spacer) / var(--line-height));
  font-size: var(--font-size-mini);
  color: var(--text-color-light);
}

.copyright p {
  margin-bottom: 0;
}

.copyright a {
  color: var(--text-color-light);
  margin-left: var(--spacer);
}

.copyright a:hover {
  color: var(--link-color);
}

.copyright a:first-child {
  margin-left: 0;
}

.copyright svg {
  width: var(--font-size-small);
  height: var(--font-size-small);
  margin-right: calc(var(--spacer) / 8);
  margin-bottom: -0.15rem;
  display: inline-block;
  stroke: var(--text-color-light);
  opacity: 0.7;
}