:root {
  --font-size-tiny: 8pt;
  --font-size-small: 10pt;
  --font-size-normal: 12pt;
  --font-size-large: 16pt;
  --font-size-huge: 20pt;
  --font-size-kaboom: 26pt;
}

.single-layout > h1,
.single-layout > main {
  padding: 0 var(--spacing);
}

.single-layout > header > nav {
  flex-direction: column;
}

.single-layout > header > nav ul {
  flex-wrap: wrap;
  gap: calc(0.5 * var(--spacing));
}

#portal-listing-list-page .listings-topic-filter {
  float: none;
}

#portal-listing-list-page .listings {
  padding-left: 0;
}

#portal-listing-list-page .listings .listing {
  padding-left: 0;
  padding-top: 20vh;
}

#portal-listing-list-page .listings .listing::before {
  display: block;
  width: 100%;
  height: 20vh;
  float: none;
}

#portal-listing-list-page .listings .listing header {
  margin-top: var(--spacing);
}

#portal-listing-list-page .listings .listing.with-thumbnail > * {
  margin-left: 0;
}

#portal-listing-list-page .category-navigation .filters {
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

#portal-listing-list-page .category-navigation .filters > label {
  width: 100%;
  margin-right: 0;
}

#portal-listing-list-page .listings-topic-filter {
  width: 100%;
}

#portal-listing-list-page .listing-filters {
  float: unset;
  width: 100%;
}

footer {
  flex-direction: column;
}

.single-layout > footer ul {
  flex-direction: row;
  flex-wrap: wrap;
}

.single-layout > footer .author {
  text-align: center;
}

#portal-blog-post-list-page article.post::before {
  position: unset;
  width: 100%;
  display: block;
  margin-bottom: var(--spacing);
}

#portal-blog-post-list-page article.post {
  padding-left: 0;
}

#portal-listing-list-page .overview ul {
  grid-template-columns: auto;
}

#portal-welcome-page article[data-with-image] {
  padding-left: 0;
}

#portal-welcome-page article[data-with-image]::before {
  position: static;
  display: block;
  width: 100%;
}

#portal-welcome-page article[data-with-image] h3 {
  position: static;
  display: block;
  width: auto;
  height: auto;
  font-size: unset;
  margin: var(--spacing) 0;
}

#portal-welcome-page article[data-with-image] a {
  text-align: right;
}
