html, body {
  --main-color: #000e26;
  --complement-color: #0063c3;
  --highlighted-element-color: #009dff;
  /*Custom variable, used for home page*/
  --side-menu-width: 25rem;
}

.clickable:hover, a:hover, button:not(:disabled):hover, .link:hover {
}

/* - Navigation menu styling - */
/* External links get an icon */
a[href^="https://"]::after {
  content: "";
  width: 0.75rem;
  height: 0.75rem;
  margin-left: 0.125rem;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='white' viewBox='0 0 512 512'%3E%3Cpath d='M288 24c0 13.3 10.7 24 24 24h118.1l-231 231c-9.4 9.4-9.4 24.6 0 33.9s24.6 9.4 33.9 0l231-231v118.1c0 13.3 10.7 24 24 24s24-10.7 24-24V24c0-13.3-10.7-24-24-24H312c-13.3 0-24 10.7-24 24zM80 96C35.8 96 0 131.8 0 176v256c0 44.2 35.8 80 80 80h256c44.2 0 80-35.8 80-80v-88c0-13.3-10.7-24-24-24s-24 10.7-24 24v88c0 17.7-14.3 32-32 32H80c-17.7 0-32-14.3-32-32V176c0-17.7 14.3-32 32-32h88c13.3 0 24-10.7 24-24s-10.7-24-24-24H80z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
}

/* -- Top bar styling -- */
.logo-wrapper .logo.clickable {
  filter: none !important;
}

.top-bar {
  border-bottom: 2px solid #002e7c;
  background: linear-gradient(to bottom, #001539 0%, var(--main-color) 50%, var(--main-color) 100%);
}

.top-bar-contents {
  display: grid !important;
  grid-template-rows: 1fr;
  padding-bottom: 0 !important;
  gap: 0.25rem !important;
}

.top-bar .nav-item {
  padding-bottom: .5rem !important;
}

  .top-bar .nav-item:nth-child(n+5) {
    display: none !important;
  }

.top-bar .nav .nav-link {
  color: var(--background-color);
  gap: 0 !important;
}

.top-bar .nav-link.active,
.top-bar .nav-link-list-item.active {
  background-color: rgba(255, 255, 255, 0.2) !important;
}

  .top-bar .nav-link.active .text-element,
  .top-bar .nav-link-list-item.active .text-element {
    border-bottom: solid 1.5px white;
  }

.top-bar .nav-link .text-element {
  margin-right: 0.25rem;
}

.top-bar .navigation-search-bar {
  display: flex;
  row-gap: 1rem;
  margin-left: auto;
  align-items: center;
  background-color: var(--complement-color);
  padding: 1rem .75rem 1rem .75rem;
  border-bottom-left-radius: 0;
  border-bottom-right-radius: 0;
  width: var(--side-menu-width);
}

  .top-bar .navigation-search-bar input,
  .top-bar .navigation-search-bar .search-input {
    width: 100%;
  }

  .top-bar .navigation-search-bar .search-form-buttons button.highlight {
    display: inline-block !important;
  }

  .top-bar .navigation-search-bar .search-form-buttons button {
    display: none;
  }

.top-bar .nav-link .text-element,
.top-bar .nav-link-list-item .text-element {
  padding: 0 !important;
  margin-left: 0 !important;
  border-radius: 0;
  font-weight: 700;
  display: flex;
  align-items: center;
  min-height: var(--icon-size);
}

.top-bar .nav-link .icon {
  margin-top: 0;
  margin-bottom: 0;
}

  .top-bar .nav-link .icon:first-of-type {
    display: none !important;
  }

.top-bar .search-form-buttons-wrapper {
  margin: 0 !important;
  width: unset !important;
}

/* -- Mobile bar styling -- */

.mobile-bar .nav-link .icon:first-of-type {
  min-width: unset;
  width: unset;
  margin-left: 0.5rem;
  margin-right: 0.5rem;
}

  .mobile-bar .nav-link .icon:first-of-type svg {
    display: none !important;
  }

.mobile-bar .navigation-search-bar {
  display: none;
}

.mobile-bar .nav-item {
  padding-bottom: 0 !important;
}

  .mobile-bar .nav-item:nth-child(n+5) {
    display: none !important;
  }


.logo-wrapper {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: max-content !important;
}

.footer-content {
  width: max-content;
  grid-row: 1;
  padding: 1rem 2rem 0 .75rem;
  max-width: var(--site-max-width);
  width: 100%;
  margin: 0 auto;
}

ul.nav.flex-column {
  width: 100%;
  max-width: var(--site-max-width);
}

a.logo.clickable {
  width: 100%;
}

/* Top row styling */
.main > div.top-row {
  display: none;
}

/* Content styling */
.custom-page h1 {
  color: var(--complement-color, #111827);
  font-size: 1.6rem;
  letter-spacing: 1px;
  border-bottom: 1px solid #0063c333;
  border-radius: 0;
  margin: 0 0 0.5rem 0;
  line-height: 1.5em;
}

div.museum-logo img.icon {
  width: auto;
  max-width: calc(var(--icon-size) * 2.5);
  height: auto;
  max-height: var(--icon-size);
  margin: 0 0.5rem;
}

/* Gallery museum logo */
table.table.record-list.gallery tr.table-row {
  position: relative;
}

  table.table.record-list.gallery tr.table-row .museum-logo {
    position: absolute;
    right: calc(var(--icon-size) + 2rem);
    top: 1.25rem;
  }

@media (min-width: 871px) {
  /* Get rid of gap between menu and content */
  div.content:has(.custom-page#home-page) {
    padding-top: 0 !important;
  }
}