/* Additions to the preserved original stylesheet. */
.container { box-shadow: 0 0 20px #000; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid #f6ac55; outline-offset: 4px; }
.skip-link { position: absolute; left: 1rem; top: -10rem; z-index: 10; padding: .8rem; background: #fff; color: #111; }
.skip-link:focus { top: 1rem; }
img { max-width: 100%; height: auto; }
iframe { max-width: 100%; }
form input[type="email"], form input[type="tel"] { box-sizing: border-box; width: 95%; background: #111; color: #fff; border: 1px solid #333; padding: .2em; font: inherit; }
button { font: inherit; padding: .5em 1em; color: #fff; background: #303e4c; border: 1px solid #98a6b3; border-radius: 3px; cursor: pointer; }
button:hover { background: #465b6e; }
legend { color: #ccc; padding: 0 .5em; }
.viewer { color: #fff; background: #111; border: 1px solid #555; border-radius: 6px; max-width: min(94vw, 1000px); padding: 1rem; }
.viewer::backdrop { background: rgba(0,0,0,.88); }
.viewer figure { margin: 1rem 0 0; text-align: center; }
.viewer img { max-height: 72vh; object-fit: contain; }
.viewer figcaption { padding: .5rem; }
.viewer-controls { display: flex; justify-content: space-between; gap: .5rem; }
@media (max-width: 900px) {
  div.container { width: 100%; }
  img.photoassets { right: 0; margin-left: 1rem; }
}
@media (max-width: 700px) {
  html { font-size: 75%; }
  div.container { display: flex; flex-direction: column; background-size: 100% auto; }
  div.header { height: 40vw; min-height: 150px; max-height: 280px; }
  div.header * { height: 100%; }
  div.navigation { order: 1; box-sizing: border-box; width: 100%; padding: 0 1.25rem 1.25rem; float: none; }
  div.navigation ul { display: flex; flex-wrap: wrap; gap: .5rem 1rem; }
  div.navigation ul li { padding: .3rem 0 .3rem 12px; }
  div.content { order: 2; box-sizing: border-box; float: none; width: 100%; padding: 0 1.25rem; }
  div.news { display: none; }
  img.photoassets { width: 42%; }
  div.gallery { display: flex; flex-wrap: wrap; gap: 8px; }
  div.lightbox a { margin: 0; }
  fieldset { padding: 1em 0; }
  dl dt { width: 27%; }
}
@media (max-width: 380px) {
  img.photoassets { width: 100%; max-width: 250px; float: none; margin: 1rem 0; }
}
