:root {
  --light-color: rgba(204,204,238,1);
  --dim-color: rgba(51,51,85,1);
  --dark-color: rgba(34,34,51,1);
}
@font-face {
  font-family: "Acme";
  src: url(fonts/Acme-Regular.ttf) format("truetype");
}
* {
  box-sizing: border-box;
}
html body {
  margin: 0;
  background-color: var(--dark-color);
  font-family: 'Arial';
  color: var(--light-color);
}

nav-bar {
  display: flex;
  width: 100%;
  background-color: var(--dim-color);
  box-shadow: rgba(0, 0, 0, 0.17) 0px -23px 25px 0px inset, rgba(0, 0, 0, 0.15) 0px -36px 30px 0px inset, rgba(0, 0, 0, 0.1) 0px -79px 40px 0px inset, rgba(0, 0, 0, 0.06) 0px 2px 1px, rgba(0, 0, 0, 0.09) 0px 4px 2px, rgba(0, 0, 0, 0.09) 0px 8px 4px, rgba(0, 0, 0, 0.09) 0px 16px 8px, rgba(0, 0, 0, 0.09) 0px 32px 16px;
  font-family: 'Acme';
  margin-bottom: 1rem;
}

nav-bar::part(navbar) {
  max-width: 1024px;
  margin: auto;
}
nav-bar a,
nav-bar::part(toggle) {
  padding: 1rem;
  text-decoration: none;
  color: var(--light-color);
}

nav-bar::part(toggle-line) {
  background-color: var(--light-color);
}

nav-bar .link {
  text-decoration: none;
  color: var(--light-color);
  white-space: nowrap;
  display: flex;
  align-items: center;
  justify-content: right;
  gap: 0.25rem;
}
nav-bar .link:hover {
  background-color: var(--dark-color);
}

nav-bar .link.active {
  background-color: var(--dark-color);
}

.main-content {
  max-width: 1024px;
  margin: auto;
}

.section-header {
  text-align: center;
  color: var(--light-color);
  font-family: 'Acme';
}

.content-card {
  padding: 1rem;
  background-color: var(--dim-color);
  box-shadow: rgba(0, 0, 0, 0.25) 0px 54px 55px, rgba(0, 0, 0, 0.12) 0px -12px 30px, rgba(0, 0, 0, 0.12) 0px 4px 6px, rgba(0, 0, 0, 0.17) 0px 12px 13px, rgba(0, 0, 0, 0.09) 0px -3px 5px;
}
.content-title {
  font-family: 'Acme';
  font-size: 2rem;
  text-align: center;
  margin: unset;
}
.content-subtitle {
  font-size: 1rem;
  font-style: italic;
  text-align: center;
}
.content-link {
  color: inherit;
}

/* List items */
.list-items {
  list-style: none;
  padding: 0;
}

.list-item:not(:last-child) {
  margin-bottom: 1em;
}
.list-item-title {
  width: 100%;
  text-align: left;
  font-family: Acme;
  font-weight: bold;
}
.list-item-line {
  display: flex;
}
.list-item-subtitle {
  width: 100%;
  text-align: left;
  font-style: italic;
}
.list-item-value {
  width: 100%;
  text-align: right;
  font-style: italic;
}

@media print {
  html body {
    padding-top: 0px;
    color: var(--dark-color);
  }
  a {
    padding-top: 0px;
    color: var(--dark-color);
  }
  .content-card {
    box-shadow: none !important;
  }
  nav-bar {
    display: none;
  }
}