/* Extracted from index.php so no CSS is inline (AldoMedia build standard). */
body, div, h1, h2, h3, span, p { font-family: Verdana, Arial, Helvetica, sans-serif; }
html { height: 100%; }
body {
  height: 100%;
  margin: 0;
  overflow: hidden;              /* disable scrollbars */
  font-size: 10pt;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
/* scroll bars on webkit & >= Mac OS X Lion */
::-webkit-scrollbar { background-color: rgba(0, 0, 0, .5); width: .75em; }
::-webkit-scrollbar-thumb { background-color: rgba(255, 255, 255, .5); }

#container { width: 100%; height: 100%; overflow: hidden; }
.urlbar-hack { width: 1px; height: 1px; }
.tour-back {
  position: absolute; top: 12px; left: 12px; z-index: 9999;
  background: #000; color: #fff; border: 1px solid #fff;
  padding: 9px 16px; font: 700 12px/1 Verdana, Arial, sans-serif;
  letter-spacing: .06em; text-transform: uppercase; text-decoration: none;
}
.tour-back:hover, .tour-back:focus { background: #fff; color: #000; }
.tour-back:focus-visible { outline: 3px solid #ffd34d; outline-offset: 2px; }

/* Until the visitor starts the tour, the page is just a poster image and a
   button. tour-start.js drops .tour-booting once the panorama has painted. */
#tour-poster { position: fixed; inset: 0; z-index: 1; }
#tour-poster img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 72%; display: block; }

.tour-intro {
  position: fixed; z-index: 2; inset: 0;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 4px; padding: 24px; text-align: center;
  background: rgba(0, 0, 0, .62); color: #fff;
}
.tour-intro h1 {
  margin: 0 0 6px; font: 700 clamp(22px, 5vw, 34px)/1.2 Verdana, Arial, sans-serif;
  text-transform: uppercase; letter-spacing: .04em;
}
.tour-intro p { margin: 0 0 14px; max-width: 46ch; font-size: 15px; line-height: 1.5; }
.tour-intro .tour-note { font-size: 13px; color: #e2e2e2; margin: 16px 0 0; }
.tour-intro a { color: #fff; text-decoration: underline; }
.tour-btn {
  min-height: 48px; padding: 13px 30px; cursor: pointer;
  background: #fff; color: #000; border: 2px solid #fff;
  font: 700 14px/1 Verdana, Arial, sans-serif; letter-spacing: .08em; text-transform: uppercase;
}
.tour-btn:hover, .tour-btn:focus { background: transparent; color: #fff; }
.tour-btn:focus-visible { outline: 3px solid #ffd34d; outline-offset: 3px; }
.tour-btn[disabled] { opacity: .8; cursor: progress; }

body:not(.tour-booting) #tour-poster,
body:not(.tour-booting) .tour-intro { display: none; }