.logo {
  margin-bottom: 1.66em;
  margin-left: 0.1em;
  width: 50%;
}

.logoSVG {
  fill: var(--logo-color);
}

.logoSVG:hover {
  fill: var(--accent-color);
}

.logo a:hover {
  background: none;
}

.main-container {
  display: flex;
  width: 100%;
  --height: 100%;
  min-height: 100%;
}

.main-container > div {
  align-items: stretch;
}

.main-left-panel {
  background-color: var(--page-bg-color);
  width: 600px;
}

.main-panel-inner {
  padding: 2em;
  padding-top: 2em;
}

.main-right-panel {
  background-color: var(--panel-bg-color);
  display: flex;
  flex: 1 1 0;
}

.main-right-panel-bg {
  display: block;
  flex: 1 1 0;
  background-image: url("/img/1977_19.svg");
  background-size: 51vh;
  background-position: left top;
}

.main-cta {
  text-align: center;
}

.menu-button {
  margin-bottom: 1.33em;
  text-align: right;
}

.btn {
  font-size: 1.1em;
  font-weight: bold;
  letter-spacing: -0.03em;
  color: var(--white);
  background-color: var(--black);
  border-radius: 2em;
  padding: 0.5em 1.1em;
  text-decoration: none;
  display: inline-block;
  margin: 1.2em auto 1.1em auto;
  text-align: center;
}

.btn-inv {
  color: var(--black);
  background-color: var(--white);
}

.btn-secondary {
  color: var(--inline-link-color);
  background-color: var(--paragraph-color);
}

.btn:hover {
  background-color: var(--accent-color);
  color: var(--white);
}

.menu {
  display: flex;
  flex-wrap: wrap;
  margin: 1.8em 0 2.2em 0;
  justify-content: center;
}

.menu-item {
  font-size: 0.8em;
  font-weight: normal;
  line-height: 1;
  text-decoration: none;
  text-transform: lowercase;
  background-color: var(--menu-item-color);
  color: rgba(0, 0, 0, 0.877);
  padding: 0.2em 0.8em;
  margin: 0.22em 0.2em;
  letter-spacing: 0.03em;
  padding-bottom: 0.24em;
}

.menu-item.selected {
  background-color: var(--accent-color);
  color: white;
}

.inline-link {
  --font-family: "Courier New", Courier, monospace;
  font-size: 0.9em;
  background-color: var(--inline-link-color);
  color: var(--white);
  text-decoration: none;
  white-space: nowrap;
  padding: 0.08em 0.4em;
  text-transform: capitalize;
}

.inline-link:hover {
  background-color: var(--inline-link-hover-color);
  color: var(--white);
}

.foot {
  font-size: 0.74em;
  text-align: center;
  color: var(--paragraph-color);
}

.footer-link {
  display: block;
  font-size: 0.8em;
  margin: 2.2em 0 0 0;
}

.footer-link a {
  color: rgba(255, 255, 255, 0.5);
  color: var(--paragraph-color);
}

@media only screen and (max-width: 600px) {
  .main-right-panel {
    display: none;
  }

  .main-left-panel {
    width: 100%;
  }

  .main-panel-inner {
    padding: 6vw;
  }
}