/* =============================================================================
      COLORS v20261016: the main palette of the site, change them here to experiment
      ========================================================================== */
:root {
  --color-accent:       #19868d;  /* blue: top bar, footer, selected menu item, buttons */
  --color-accent-light: #00b9c5;  /* light blue: links, hover, focus */
  --color-panel:        #484848;  /* gray: menu buttons, borders */
  --color-page:         #282828;  /* dark background */
  --color-muted:        #959595;  /* gray text */
  --color-text:         #ffffff;  /* white text */
}

* {
  margin: 0;
  padding: 0;
}
a {
  text-decoration: none;
  color: var(--color-accent-light); /*#00bac6*/
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
nav,
section,
summary {
  display: block;
}

/**
 * Correct `inline-block` display not defined in IE 8/9.
 */

audio,
canvas,
video {
  display: inline-block;
}

/* ==========================================================================
   Base
   ========================================================================== */

/**
 * 1. Prevent system color scheme's background color being used in Firefox, IE,
 *    and Opera.
 * 2. Prevent system color scheme's text color being used in Firefox, IE, and
 *    Opera.
 * 3. Set default font family to sans-serif.
 * 4. Prevent iOS text size adjust after orientation change, without disabling
 *    user zoom.
 */

html {
  background: #fff; /* 1 */
  color: #000; /* 2 */
  font-family: sans-serif; /* 3 */
  -webkit-text-size-adjust: 100%; /* 4 */
  overflow-x: hidden;
  width: 100%;
}

/**
 * Remove default margin.
 */

body {
  margin: 0;
  overflow-x: hidden;
  width: 100%;
}

/* ==========================================================================
   Links
   ========================================================================== */

/**
 * Show a branded focus ring for keyboard navigation only.
 */

a:focus-visible {
  outline: 2px solid var(--color-accent-light);
  outline-offset: 2px;
}

/* ==========================================================================
   Typography
   ========================================================================== */

/**
 * Address variable `h1` font-size and margin within `section` and `article`
 * contexts in Firefox 4+, Safari 5, and Chrome.
 */

h1 {
  font-size: 2em;
}

/**
 * Address style set to `bolder` in Firefox 4+, Safari 5, and Chrome.
 */

b,
strong {
  font-weight: bold;
}

/**
 * Address inconsistent and variable font size in all browsers.
 */

small {
  font-size: 100%;
}

/**
 * Address differences between Firefox and other browsers.
 */

hr {
  box-sizing: content-box;
  height: 0;
}

/**
 * Correct font family set oddly in Safari 5 and Chrome.
 */

code,
kbd,
pre,
samp {
  font-family: monospace, serif;
  font-size: 1em;
}

/**
 * Improve readability of pre-formatted text in all browsers.
 */

pre {
  white-space: pre-wrap;
}

/* ==========================================================================
   Forms
   ========================================================================== */

/**
 * 1. Correct font family not being inherited in all browsers.
 * 2. Correct font size not being inherited in all browsers.
 * 3. Address margins set differently in Firefox 4+, Safari 5, and Chrome.
 */

button,
input,
select,
textarea {
  font-family: inherit; /* 1 */
  font-size: 100%; /* 2 */
  margin: 0; /* 3 */
/*  max-width: 200px; */
}

/**
 * Address inconsistent `text-transform` inheritance for `button` and `select`.
 * All other form control elements do not inherit `text-transform` values.
 * Correct `button` style inheritance in Chrome, Safari 5+, and IE 8+.
 * Correct `select` style inheritance in Firefox 4+ and Opera.
 */

button,
select {
  text-transform: none;
}

/* Normalize button appearance and curso across browsers */

button,
input[type="button"], /* 1 */
input[type="reset"],
input[type="submit"] {
  -webkit-appearance: button; /* 2 */
  cursor: pointer; /* 3 */
}

/**
 * Re-set default cursor for disabled elements.
 */

button[disabled],
html input[disabled] {
  cursor: default;
}

/**
 * Remove Firefox's native inner border/padding on buttons (::-moz-focus-inner)
 */

button::-moz-focus-inner,
input::-moz-focus-inner {
  border: 0px;
  padding: 0;
}

/**
 * 1. Remove default vertical scrollbar in IE 8/9.
 * 2. Improve readability and alignment in all browsers.
 */

textarea {
  overflow: auto; /* 1 */
  vertical-align: top; /* 2 */
}

/* ==========================================================================
   Tables
   ========================================================================== */

/**
 * Remove most spacing between table cells.
 */

table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* ===== Primary Styles ========================================================
   Author: Fredy Munevar
   ========================================================================== */

html,
body {
  background-color: #1b1b1b;
  color: var(--color-text);
}

body {
  background: #1b1b1b url("bg.jpg");
  font-family: Arial, Helvetica, sans-serif;
  font-size: 0.75em;
}

.center {
  max-width: 1280px;
  height: 100%;
  background: var(--color-page) url("bg.jpg"); /* v20261016 experiment: tiled pattern also behind the site (was: #282828) */
  margin: 0 auto;
  box-shadow: 0 7px 16px 2px rgba(0, 0, 0, 0.46);
}

/* =============================================================================
      HEADER
      ========================================================================== */
header#site-header #site-banner {
  box-shadow: 0 5px 8px rgba(0, 0, 0, 0.95);
  height: 120px;
  margin-bottom: 17px;
}

header#site-header #site-banner > a > img {
  height: 120px;
}

header#site-header .inner-center {
  border: 2px groove var(--color-panel);
  width: 930px;
  margin: 0 auto;
  text-align: center;
  border-left: none;
  border-right: none;
}

header#site-header .inner-center article.half-wrap {
  font-size: 1.133em;
  display: inline-block;
  vertical-align: top;
  width: 45%;
  padding: 1%;
}

header#site-header .inner-center article.half-wrap:first-child {
  font-size: 1.133em;
  border: 2px groove var(--color-panel);
  border-top: none;
  border-bottom: none;
  border-left: none;
}

header#site-header .page-update {
  color: var(--color-panel);
  font-size: 1.133em;
  text-align: center;
  padding: 6px 0;
}

header#site-header nav#site-nav {
  border: none; /* v20261016: no separator line between the main menu and the submenu (was 2px groove #484848, bottom only) */
  margin: 0 auto;
  text-align: center;
  font-size: 1em;
  font-weight: bold;
  text-transform: uppercase;
  border-top: none;
  border-right: none;
  border-left: none;
  padding: 6px 0;
}

header#site-header nav#site-nav ul {
  list-style: none;
  display: flex;
  flex-direction: row;
  justify-content: center;
  flex-wrap: wrap;
  padding: 0 20px;
}

header#site-header nav#site-nav ul li {
  vertical-align: top;
  margin: 2px;
}

header#site-header nav#site-nav ul li a {
  display: block;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.17),
    inset 0 1px 0 1px rgba(255, 255, 255, 0.16);
  background: var(--color-panel); /* original: #19868d */
  color: var(--color-text);
  font-size: 1.167em;
  padding: 7px 12px;
  width: 90px; /* original: only 105px, no height */
}

header#site-header nav#site-nav ul li a:hover {
  background: var(--color-accent-light);
}

header#site-header nav#site-nav ul li .nav1_selected {
  background: var(--color-accent);
}

/* =============================================================================
      FOOTER
      ========================================================================== */
footer#site-foot {
  box-shadow: inset 0 5px 5px rgba(0, 74, 79, 0.75);
  background: var(--color-accent);
}

footer#site-foot section ul {
  display: inline-block;
  vertical-align: top;
  width: 45%;
  /* v20261016: fixed top/bottom space (a % padding is computed from the page width, so it grew on wide screens) */
  padding: 6px 2%;
  list-style: none;
}

footer#site-foot section ul li {
  color: var(--color-accent-light);
  border-bottom: 1px dashed #b3eef2;
  padding: 10px 0;
}

/* v20261016: the dashed line only between the lines, not after the last one */
footer#site-foot section ul li:last-child {
  border-bottom: none;
}

footer#site-foot section ul li a {
  color: var(--color-text);
}

footer#site-foot section ul:first-child {
  border-right: 1px dashed #b3eef2;
}

/* =============================================================================
      CONTENT
      ========================================================================== */

.standard {
  width: 100%;
  color: var(--color-muted);
}

.standard a {
  color: var(--color-text);
}

section#content-wrap {
  padding: 15px 27px 0 27px;
  display: grid;
  grid-template-columns: 200px 1fr;
  /* v20261016: rows 1-2 (the two sidebars) as tall as their content, row 3 takes the rest of the main box height */
  grid-template-rows: auto auto 1fr;
  /* v20261016: space only between the columns; between the sidebar widgets their margin-bottom is enough */
  column-gap: 10px;
  row-gap: 0;
}

article#content, aside.sidebar {
  min-width: 0;
}

/* v20261016: the sidebars don't stretch to fill their grid row */
aside.sidebar {
  align-self: start;
}

article#content {
  border: 2px groove var(--color-panel);
  flex-shrink: 1;
  grid-row: span 3 / span 3; /* v20250516: previous span 2 / span 2 */
  margin-top: 0px; /* original 0px, v20250516: 10px */
  margin-bottom: 10px; /* new value 20260725 */
}

aside.sidebar .widget {
  border: 2px groove var(--color-panel);
  margin-bottom: 10px;
}

aside.sidebar .widget h1 {
  border: 2px groove var(--color-panel);
  color: var(--color-accent-light);
  text-align: center;
  text-transform: uppercase;
  font-size: 1.583em;
  line-height: 24px; /* v20261016: fixed height, same as .system-selection-area td */
  border-top: none;
  border-left: none;
  border-right: none;
  padding: 11px 0;
}

aside.sidebar .widget p {
  color: var(--color-muted);
  border-bottom: 1px dashed var(--color-panel);
  padding: 8px;
}

/* v20261016: inner space also for the shout header lines ("nickname » date") and the form areas,
   like the <p> lines (the shout text below a header line is a <p>, so no bottom space here) */
aside.sidebar .widget > div:not([class]) {
  padding: 8px 8px 0 8px;
}

aside.sidebar .widget > div[align="center"] {
  padding: 8px;
}

aside.sidebar .widget p:last-child {
  border: none;
}

aside.sidebar .widget p a,
aside.sidebar .widget p span {
  color: var(--color-text);
  display: block;
}

aside.sidebar .widget p a:hover {
  text-decoration: underline;
}

aside.sidebar .shoutno {
  color: #b12f2f;
  font-weight: bold;
  padding: 8px;
}

aside.sidebar .shoutok {
  color: #7fff00;
  font-weight: bold;
  padding: 8px;
}

.subtitle-area {
  border-bottom: 1px solid var(--color-panel);
  border-top: none;
  border-right: none;
  border-left: none;
}

/* v20261016: no separator line under the submenu in the header (the page label in the main box keeps its line) */
header#site-header .subtitle-area {
  border-bottom: none;
}

.subtitle-area tr td {
  color: var(--color-accent-light);
  text-align: center;
  font-size: 1.583em;
  font-weight: bold;
  padding: 11px 0;
}

.subtitle-area tr td a {
  color: var(--color-text);
  font-size: 0.583em;
}

.subtitle-area form {
  color: var(--color-text);
  font-size: 0.583em;
}

.system-selection-area {
  min-width: 100%;
  border-bottom: 2px groove var(--color-panel); /* v20261016: same as the sidebar widget titles (was 1px solid) */
  border-top: none;
  border-right: none;
  border-left: none;
}

.system-selection-area tr td {
  color: var(--color-accent-light);
  text-align: center;
  padding: 11px 0;
  height: 24px; /* v20261016: same content height as the sidebar widget titles */
}

.system-selection-area form {
  color: var(--color-accent-light);
  text-align: center;
  font-size: 0.583em;
  font-weight: bold;
  padding: 11px 0;
}

@media (max-width: 600px) {
  .system-selection-area select {
    width: 60%;
  }
}

.info-table {
  min-width: 100%;
  border: none;
  border-collapse: collapse;
}

.info-table tr td {
  border: 1px solid var(--color-page);
  color: var(--color-text);
  padding: 4px;
}

.info-table tr.alternate1 {
  background-color: #1c5a5c;
}

.info-table tr.alternate2 {
  background-color: #26797a;
}

.info-table tr.grey {
  background-color: #5f8383;
}

.info-table tr.titlef {
  font-weight: bold;
  background-color: #134647;
  color: var(--color-text);
}

.info-table tr td a {
  color: var(--color-text);
}

.info-table tr td a:hover {
  text-decoration: underline;
}

.info-table tr td.edited {
  background-color: #d51515;
  color: var(--color-text);
}

.info-table tr td.grey {
  background-color: #5f8383;
  color: var(--color-text);
}

.info-table tr td.yellow {
  background-color: #DDA621;
  color: var(--color-text);
}

.info-table tr td.unread {
  background-color: #b95757;
  color: var(--color-text);
}

/*.info-table tr td input[type="text"],*/
/*.info-table tr td textarea,*/

.info-table tr td fieldset {
  display: inline-block;
  vertical-align: top;
  width: 44%;
  height: 17px;
  background: var(--color-panel);
  color: var(--color-accent-light);
  border: none;
  padding: 10px;
  margin: 5px;
}

/*
.info-table tr td textarea {
  width: 93%;
  height: 150px;
  resize: none;
}
*/

.info-table tr td fieldset {
  width: 48%;
  border: none;
  background: none;
  padding: 0;
  position: relative;
}

.info-table tr td fieldset select {
  width: 100%;
  height: 37px;
  border: 1px solid black;
  position: absolute;
}

.info-table tr td fieldset .select {
  background: var(--color-panel) url("select.png") no-repeat top right;
  color: var(--color-text);
  font-weight: bold;
  text-transform: uppercase;
  text-align: left;
  display: block;
  position: absolute;
  overflow: hidden;
  width: 80%;
  height: 27px;
  line-height: 2.3em;
  font-weight: normal;
  text-transform: none;
  color: var(--color-muted);
  background-size: 37px;
  padding: 5px 50px 5px 8px;
}

.info-table tr td input[type="button"] {
  display: inline-block;
  vertical-align: top;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.17),
    inset 0 1px 0 1px rgba(255, 255, 255, 0.16);
  background: var(--color-accent);
  color: var(--color-text);
  font-size: 1.167em;
  border: 1px solid var(--color-page);
  text-transform: uppercase;
  padding: 10px 12px;
}

.info-table tr td input[type="button"]:hover {
  background: var(--color-accent-light);
}

.info-table tr.info td ul span {
  color: var(--color-muted);
  display: block;
}

.info-table tr.info td .button {
  display: inline-block;
  vertical-align: top;
  box-shadow: 0 1px 1px rgba(0, 0, 0, 0.17),
    inset 0 1px 0 1px rgba(255, 255, 255, 0.16);
  background: var(--color-accent);
  color: var(--color-text);
  font-size: 1.167em;
  border: 1px solid var(--color-page);
  padding: 7px 12px;
}

.info-table tr.info td .button:hover {
  background: var(--color-accent-light);
}

.info-table tr.info td span {
  color: var(--color-panel);
}

.info-table tr.info td h3 {
  color: var(--color-muted);
  margin: 0.6em 0;
}

.info-table tr.info td small {
  color: var(--color-accent-light);
  font-style: italic;
}

/* =============================================================================
      HOME
      ========================================================================== */

form {
  display: inline;
}

/* 
 * ========================================
 * style elements
 * ========================================
 */

.tableWrap {
  /*width: 542px;*/
  width: 100%;
  word-wrap: break-word;
  table-layout: fixed;
  text-align: left;
  border: 0px;
  border-collapse: collapse;
}

.tableWrap tr td {
  border: 0px;
  border-collapse: collapse;
}

.RecordTable {
  width: 100%;
}

.RecordTable td {
  word-wrap: break-word;
}

.TableTitle {
  font-weight: bold;
  padding-top: 10px;
  background-color: #112238;
  color: var(--color-text);
}

.TableData {
  background-color: #29384b;
}

.releaseStatusOK {
  background-color: #144901;
  font-size: 0.9em;
}

.releaseStatusBAD {
  background-color: #a54c06;
  font-size: 0.9em;
}

.releaseStatusORA {
  background-color: #b3984f;
  font-size: 0.9em;
}

.releaseStatusBLU {
  background-color: #567f92;
  font-size: 0.9em;
}

.releaseStatusOK a,
.releaseStatusBAD a,
.releaseStatusORA a,
.releaseStatusBLU a {
  color: var(--color-text);
  text-decoration: none;
}

.SearchLinkTitle a {
  color: #ffea57;
  font-weight: bold;
  padding-top: 10px;
}

.green {
  background-color: #429b1b;
  color: var(--color-text);
}

.red {
  background-color: #b60000;
  color: var(--color-text);
}

.orange {
  background-color: #dda621;
  color: var(--color-text);
}

.magenta {
  background-color: #8b008b;
  color: var(--color-text);
}

.blue {
  background-color: #567f92;
  color: var(--color-text);
}

.status_green {
  background-color: #429b1b;
  color: var(--color-text);
  font-size: 1.2em;
}

.status_red {
  background-color: #b60000;
  color: var(--color-text);
  font-size: 1.2em;
}

.status_yellow {
  background-color: #dda621;
  color: var(--color-text);
  font-size: 1.2em;
}

.status_blue {
  background-color: #567f92;
  color: var(--color-text);
  font-size: 1.2em;
}

.file1 {
  background-color: #2d3e53;
}

.file2 {
  background-color: #314359;
}

.first_file1 {
  background-color: #2d3e53;
  border-top: 1px solid white;
}

.first_file2 {
  background-color: #314359;
  border-top: 1px solid white;
}

/* Errors */

.errors {
  background-color: #fff;
  background-position: 100% 63%;
  position: relative;
  width: 100%;
  border: 1px solid #cd0000;
  color: #cd0000;
  font-weight: bold;
  margin-bottom: 10px;
}

.errors h2 {
  width: 100%;
  position: relative;
  background-color: #cd0000;
  color: var(--color-text);
  text-align: left;
  margin-bottom: 5px;
  font-size: 2em;
  font-weight: bold;
}

.error {
  color: #ff0000;
  font-weight: bold;
}

/* Show record */

.romname_section {
  background-color: #112238;
  color: var(--color-text);
  font-size: 20px;
  font-weight: bold;
}

/* Tickets */

.tickets_section {
  background-color: #112238;
  color: var(--color-text);
  font-size: 19px;
  font-weight: bold;
}

#tickets-title-green a {
  color: #6aa64c;
  text-decoration: none;
  font-size: 13pt;
  font-weight: bold;
  word-break: break-all;
}

#tickets-title-red a {
  color: #ff7777;
  text-decoration: none;
  font-size: 13pt;
  font-weight: bold;
  word-break: break-all;
}

#tickets-title-yellow a {
  color: #ffea57;
  text-decoration: none;
  font-size: 13pt;
  font-weight: bold;
  word-break: break-all;
}

#tickets-message {
  word-break: break-all;
}

#tickets-detail {
  font-size: 8pt;
  color: var(--color-text);
  font-weight: bold;
}

/* Show courier text */

#pre {
  margin: 0;
  padding: 0;
  font-size: 12px;
  font-family: "Courier New";
  color: var(--color-text);
}

/* sort */

.sort_button {
  border: 0px;
  background: url("../media/icons/swap_vert_16dp_FFFFFF_FILL0_wght400_GRAD0_opsz20.svg");
  cursor: pointer;
  width: 16px;
  height: 16px;
  color: #000; /* Fallback for older browsers */
  color: rgba(0, 0, 0, 0);
}

.sort_button_asc {
  border: 0px;
  background: url("../media/icons/keyboard_arrow_up_16dp_FFFFFF_FILL0_wght400_GRAD0_opsz20.svg");
  cursor: pointer;
  width: 16px;
  height: 16px;
  color: #000; /* Fallback for older browsers */
  color: rgba(0, 0, 0, 0);
}

.sort_button_desc {
  border: 0px;
  background: url("../media/icons/keyboard_arrow_down_16dp_FFFFFF_FILL0_wght400_GRAD0_opsz20.svg");
  cursor: pointer;
  width: 16px;
  height: 16px;
  color: #000; /* Fallback for older browsers */
  color: rgba(0, 0, 0, 0);
}

/* tiny shoutbox buttons */

input.tinydel {
  border: none;
  cursor: pointer;
  display: inline-block;
  text-indent: -3000px;
  background: url("../media/icons/close_12dp_EA3323_FILL0_wght400_GRAD0_opsz20.svg") no-repeat 50% 50%;
  width: 12px;
  height: 12px;
}

input.tinyok {
  border: none;
  cursor: pointer;
  display: inline-block;
  text-indent: -3000px;
  background: url("../media/icons/check_12dp_75FB4C_FILL0_wght400_GRAD0_opsz20.svg") no-repeat 50% 50%;
  width: 12px;
  height: 12px;
}

input.tinyban {
  border: none;
  cursor: pointer;
  display: inline-block;
  text-indent: -3000px;
  background: url("../media/icons/block_12dp_EA3323_FILL0_wght400_GRAD0_opsz20.svg") no-repeat 50% 50%;
  width: 12px;
  height: 12px;
}

/* thumb button */

input.thumb {
  border: none;
  cursor: pointer;
  display: inline-block;
  text-indent: -3000px;
  background: url("../media/icons/thumb_up_off_FILL1_wght400_GRAD0_opsz48.svg") no-repeat 50% 50%;
  width: 14px;
  height: 14px;
}

.warning-top {
  background: #f99;
  border: 1px solid red;
  padding: 2px;
  margin: 2px 0;
  width: auto;
  text-align: center;
  color: var(--color-text);
  font-weight: bold;
}

.top_linkbar {
  color: var(--color-text);
  text-align: center;
  background: var(--color-accent);
  display: flex;
  align-items: center;
  padding: 0 27px; /* v20261016: same side space as the header and the content */
}

.top_linkbar a {
  color: var(--color-text);
}

/* v20261016: links on the left, login/user box on the right (both were centered in their half,
   so the space on the left of the links was different from the space on the right of the form) */
.linkbar-links {
  width: 50%;
  text-align: left;
}

.linkbar-links + .linkbar-links {
  text-align: right;
}

/* showrecord: scrollbar area for file list */

.scroll-file-list {
  max-height: 300px;
  overflow-y: scroll;
}

/* search: dump status dots */

.dump-status-tag-nodump {
  background-color: #ffa07a;
  border: 1px dotted black;
}

.dump-status-tag-private {
  background-color: #696969;
  border: 1px dotted black;
}

.dump-status-tag-bad {
  background-color: #b22222;
  border: 1px dotted black;
}

.dump-status-tag-untrusted {
  background-color: #daa520;
  border: 1px dotted black;
}

.dump-status-tag-trusted {
  background-color: #4682b4;
  border: 1px dotted black;
}

.dump-status-tag-verified {
  background-color: #3cb371;
  border: 1px dotted black;
}

.info-table-wrapper {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

@media screen and (min-width: 1280px) {
  .info-table tr td {
    padding: 6px 10px;
  }
}

@media screen and (max-width: 750px) {
  section#content-wrap {
    gap: 11px;
    grid-template-columns: 1fr;
    grid-template-rows: none; /* v20261016: one column, normal rows */
    padding: 15px 15px 0 15px;
  }

  .top_linkbar {
    color: var(--color-text);
    text-align: center;
    background: var(--color-accent);
    flex-direction: column;
  }

  .linkbar-links {
    flex-basis: 100%;
    width: 100%;
    margin: 8px 0;
  }

  /* v20261016: on small screens both parts stay centered */
  .top_linkbar {
    padding: 0 15px;
  }

  .linkbar-links,
  .linkbar-links + .linkbar-links {
    text-align: center;
  }

  .linkbar-links a {
    font-size: 14px;
    margin: 0 4px;
  }

  .mobile-scroll {
    overflow-x: scroll;
    max-width: 100vw;
  }

  .tableWrap {
    table-layout: auto;
  }
}

/* =============================================================================
      HEADER LAYOUT v20261016: logo on the left (sidebar width), main menu + submenu on its right
      (wide screens only; on screens up to 750px the header stays stacked)
      ========================================================================== */
@media screen and (min-width: 751px) {
  header#site-header {
    display: grid;
    grid-template-columns: 200px 1fr; /* same columns as section#content-wrap */
    grid-template-rows: auto auto;
    column-gap: 10px;
    align-items: center;
    padding: 15px 27px 0 27px; /* same side padding as section#content-wrap: the logo is above the sidebar */
  }

  header#site-header #site-banner {
    grid-column: 1;
    grid-row: 1 / span 2;
    height: auto;
    margin-bottom: 0;
    box-shadow: none;
  }

  header#site-header #site-banner > a > img {
    display: block;
    width: 100%;
    height: auto;
  }

  header#site-header nav#site-nav {
    grid-column: 2;
    grid-row: 1;
    align-self: end;
  }

  header#site-header .subtitle-area {
    grid-column: 2;
    grid-row: 2;
    align-self: start;
  }

  /* pages without a submenu: the main menu is vertically centered next to the logo */
  header#site-header:not(:has(.subtitle-area)) nav#site-nav {
    grid-row: 1 / span 2;
    align-self: center;
  }
}