.overlayMenu {
  position:absolute;
  left:4.5em;
  top:1em;
  right:4.5em;
  background: var(--menu-background);
  color: var(--menu-font-color);
  border:1px solid var(--menu-border-color);
  z-index:2;
  padding-left: 4px;
  padding-right: 4px;
  padding-bottom: 4px;
  border-radius: var(--menu-border-radius);
}

.overlayMenu .KeyboardMenu {
  position: relative;
  border:0;
}

.overlayMenu h2 {
  font-size: 10px;
  font-weight: normal;
  color: var(--menu-font-color);
  margin:0;
  padding: 2px 0;
  text-align:center;
  border-bottom: 1px solid white;
}

.TitleScreen .DescriptionBox {
  display: none;
}

/* .KeyboardMenu .option {
  pointer-events: none;
}

.KeyboardMenu .option:last-child,
.KeyboardMenu .option:nth-last-child(2) {
  pointer-events: auto;
} */

.SettingsPanel {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 4px 2px;
}

.SettingsRow {
  display: flex;
  align-items: center;
  gap: 4px;
}

.SettingsLabel {
  font-family: "Press Start 2P", sans-serif;
  font-size: 7px;
  color: var(--menu-font-color, #fff);
  width: 34px;
  flex-shrink: 0;
}

.SettingsSlider {
  -webkit-appearance: none;
  appearance: none;
  flex: 1;
  min-width: 0;
  height: 8px;
  border-radius: 0;
  background: #000;
  border: 1px solid #fff;
  outline: none;
  cursor: pointer;
  image-rendering: pixelated;
}

.SettingsSlider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 8px;
  height: 14px;
  border-radius: 0;
  background: #fff;
  cursor: pointer;
  border: none;
}

.SettingsSlider::-moz-range-thumb {
  width: 8px;
  height: 14px;
  border-radius: 0;
  background: #fff;
  cursor: pointer;
  border: none;
}

.SettingsValue {
  font-family: "Press Start 2P", sans-serif;
  font-size: 6px;
  color: var(--menu-font-color, #fff);
  width: 22px;
  text-align: right;
  flex-shrink: 0;
}

.SettingsBackButton {
  font-family: "Press Start 2P", sans-serif;
  font-size: 7px;
  background: none;
  border: 1px solid #fff;
  color: #fff;
  padding: 3px 6px;
  cursor: pointer;
  align-self: flex-start;
  margin-top: 2px;
  border-radius: 0;
}

.SettingsBackButton:hover,
.SettingsBackButton:focus {
  background: #fff;
  color: #000;
  outline: none;
}
