/* Hugo-specific presentation adjustments. */
.home .grid-container table {
  margin-left: auto;
  margin-right: auto;
  border-collapse: separate;
  border-spacing: 0.75rem 0.25rem;
}

.home .grid-container th,
.home .grid-container td {
  padding: 0.35rem 1.25rem;
  text-align: left;
}

/* Child-page navigation uses compact, square Teletext-style buttons. */
.item5 ul.bottommenu > li.bottommenu {
  box-sizing: border-box;
  margin: 0 0.25vw;
  border: 2px solid cyan;
  border-radius: 0;
  background: #111;
}

.item5 ul.bottommenu > li.bottommenu > a {
  padding: 0.35vw 0.75vw;
  border-radius: 0;
  text-align: center;
}

.item5 ul.bottommenu > li.bottommenu:hover {
  background: #333;
}

/* Give embedded games the remaining viewport and avoid nested scrollbars. */
.grid-container > .embedded-page {
  box-sizing: border-box;
  width: 100%;
  height: calc(100dvh - 9rem);
  min-height: 60vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.grid-container > .embedded-page > iframe {
  display: block;
  box-sizing: border-box;
  width: 90%;
  height: 90%;
  max-width: 800px;
  max-height: 800px;
  border: 0;
  overflow: hidden;
}

/* Games which resize themselves can opt out with `fluid="true"`. */
.grid-container > .embedded-page > iframe.game-frame--fluid {
  max-width: none;
  max-height: none;
}

/* Page-content links, including calls to action such as “Play on browser”. */
.grid-container > div[style*="grid-row: 3"] a:link {
  color: cyan;
}

.grid-container > div[style*="grid-row: 3"] a:visited {
  color: magenta;
}

.grid-container > div[style*="grid-row: 3"] .teaser a.recentlink:link {
  color: darkblue;
}

.grid-container > div[style*="grid-row: 3"] .teaser a.recentlink:visited {
  color: black;
}
