#trail-map-wrapper, #trail-map {
  width: 100%;
  height: 100%;
  background-color: rgb(50,56,69);
  cursor: zoom-in;
}
.shaded {
  opacity: 0.2;
}
.overlay {
  display: none !important;
  border: 1px solid black;
  transform: rotate(-54deg);
}
.show-overlays .overlay {
  display: block !important;
}
.overlay:hover {
  background-color: rgba(255, 255, 255, 0.3);
  mix-blend-mode: hard-light;
}
.test-grid {
  background-color: rgba(0, 0, 200, 0.3);
}
.trail-sign {
  background-color: var(--tomato);
  color: white;
  display: none !important;
}
.show-overlays .trail-sign {
  display: block !important;
}
.trail-sign:before {
  right: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(128,0, 0, 0);
  border-right-color: var(--tomato);
  border-width: 0.68em;
  margin-top: -0.68em;
}
.trail-sign a, .trail-sign a:visited, .trail-sign a:hover {
  color: white;
  text-decoration: none;
  font-family: LeagueSpartan;
  padding: 2px;
}
.focused {
  border: 3px solid var(--tomato);
}
@media (max-width: 799px) {
  .hide-when-narrow {
    display: none;
  }
}
@media (max-height: 560px) {
  .hide-when-short {
    display: none;
  }
}