/* Desktop rules and artwork remain in the original, unchanged my.css. */
.lili-sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
  border: 0;
}

/* Retain keyboard focus without changing the normal appearance. */
a:focus-visible, button:focus-visible, area:focus-visible {
  outline: 2px solid #fff;
  outline-offset: 3px;
}

/* Narrow screens keep the same header, colours, artwork and columns.
   Tables containing side-by-side poems scroll within the content panel. */
@media (max-width: 980px) {
  #topsection { height: auto; }
  #topsection img[usemap] { max-width: 100%; height: auto; }
  #topsection .innertube { margin-bottom: 16px; }
  #contentcolumn { width: 80%; margin: 0 10%; }
  #leftcolumn { width: 9%; }
  #rightcolumn { width: 9%; margin-left: -9%; }
  #leftcolumn img, #rightcolumn img { max-width: 100%; height: auto; }
  #contentcolumn > .innertube { min-width: 0; }
  #contentcolumn table { display: block; max-width: 100%; overflow-x: auto; }
  #contentcolumn img { max-width: 100%; height: auto; box-sizing: border-box; }
  #contentcolumn a.highslide img { max-width: min(200px, 100%); }
  body.lili-press img { max-width: calc(100vw - 48px); height: auto; }
  #footer { box-sizing: border-box; }
}