footer {
  --footer-background: var(--accent);
  --footer-text: #fff;
  --footer-link: var(--footer-text);
}

.night footer {
  --footer-background: #004d40;
}

footer {
  /* display: grid; */
  /* grid-gap: 1em; */
  /* grid-template-columns: repeat(3, 1fr); */
  /* grid-template-areas: "info nav stats"; */
  /* padding: 5vw; */
  padding: 3em;
  background: var(--footer-background);
  color: var(--footer-text);
}

footer a {
  color: var(--footer-link);
}

footer a:hover {
  color: var(--footer-link);
  text-decoration: underline;
}

footer div#footer_info div#footer_links svg {
  height: 1em;
  width: 1em;
}

footer div#footer_info div#footer_links a {
  /* font-variant: small-caps; */
  /* margin-right: 0.25em; */
}

footer div#pagination {
  /* text-align: center; */
}

footer div#projects .project {
  display: inline-block;
}

footer div#projects .project:not(:last-child) {
  margin-right: 0.5em;
}

footer div#projects .project a {
  display: block;
}

footer div#projects .project img {
  --size: 2.5em;
  height: var(--size);
  width: var(--size);
  border-radius: 100%;
}

@media screen and (max-width: 600px) {
  footer {
    /* grid-template-areas: "nav" "info"; */
  }

  footer div#footer_info {
    /* grid-area: info; */
  }

  footer div#footer_info div#footer_description {
    display: none;
  }

  footer div#footer_info div#footer_links {
    margin-bottom: 2em;
  }

  footer div#footer_info div#footer_links a {
    /* text-transform: uppercase; */
    margin-right: 0.5em;
  }

  footer div#pagination {
    /* grid-area: nav; */
  }

  footer div#stats {
    /* grid-area: stats; */
    /* display: none; */
  }

  footer div#projects .project:not(:last-child) {
    margin-right: 0.35em;
  }

  footer div#projects .project img {
    --size: 2em;
  }
}

@media screen and (min-width: 600px) {
  footer {
    display: grid;
    grid-gap: 1em;
    /* grid-template-columns: repeat(2, 1fr); */
    grid-template-columns: repeat(2, auto);
  }

  footer div#footer_info {

  }

  footer div#footer_info div#footer_links {
    margin-top: 1em;
  }

  footer div#footer_info div#footer_links a {
    font-variant: small-caps;
    margin-right: 0.25em;
  }

  footer div#pagination {
    /* text-align: center; */
    grid-column: 1 / -1;
  }

  footer div#projects {
    text-align: right;
  }

  /* footer div#stats {
    text-align: right;
  }

  footer div#stats .stats_row div {
    display: inline-block;
  }

  footer div#stats .stats_row[for=years], footer div#stats .stats_row[for="num themes"], footer div#stats .stats_row[for="num pages"] {
    display: none;
  } */
}