/* TheatreBooks — restored 1975-era bookstore site.
   Desktop rendering is kept identical to the original table layout.
   Only the h1 normalisation below and the max-width:900px block are additions. */

html { -webkit-text-size-adjust: 100%; }
body { background: #ffffff; color: #000000; }
a { color: #000077; }
a:visited { color: #005555; }
a:active { color: #000077; }

/* the original page heading was an <h2>; it is promoted to <h1> for document
   outline, so it must keep the exact <h2> metrics */
h1 { font-size: 1.5em; margin: .83em 0; font-weight: bold; }
/* the masthead logo carries the document title on the home page */
h1.logo { display: inline; margin: 0; padding: 0; font-size: 1em; font-weight: normal; }
#main { display: inline; }

span.di { color: inherit; }

.dform input, .dform select, .dform textarea { background: #f4f4f4; color: #555; }
.dform { margin: 0; }

.skip {
  position: absolute; left: 8px; top: -70px;
  display: inline-block; padding: 12px 16px; min-height: 44px;
  background: #660000; color: #fff; z-index: 99;
}
.skip:focus {
  position: static; left: auto; width: auto; height: auto;
  display: inline-block; padding: 8px 14px; background: #660000; color: #fff;
}

@media (max-width: 900px) {
  html, body { overflow-x: hidden; }
  body { margin: 0; padding: 10px 12px 28px; }

  /* linearise the fixed-width layout tables */
  table, thead, tbody, tfoot, tr, th, td {
    display: block !important;
    width: auto !important;
    height: auto !important;
    max-width: 100% !important;
    box-sizing: border-box;
  }
  table { overflow-x: auto; border-collapse: collapse; margin: 0 0 6px; }
  td, th { padding: 2px 0 !important; text-align: left !important; }

  img { max-width: 100%; height: auto; }
  /* spacer shims are meaningless once linearised */
  img[src$="/spacer.gif"], img[src$="/blue.gif"] { display: none !important; }

  body, p, td, th, li, div, font, blockquote, span, dd, dt, small {
    font-size: 16px !important;
    line-height: 1.55 !important;
  }
  font[size="1"], .fine, small { font-size: 16px !important; }
  h1 { font-size: 25px !important; line-height: 1.25 !important; }
  h2 { font-size: 21px !important; line-height: 1.3 !important; }
  h3 { font-size: 19px !important; line-height: 1.3 !important; }
  blockquote { margin: 0 0 0 10px !important; }

  /* touch targets: vertical padding on inline anchors grows the hit box
     without disturbing the line box */
  a { padding-top: 14px; padding-bottom: 14px; word-break: break-word; }
  td > a, td > p > a, td > font > a, td > blockquote > p > a,
  td > p > strong > a, td > strong > a, td > b > a, td > div > a, li > a {
    display: inline-block; min-height: 46px; padding: 13px 2px;
  }
  td > a > img, td > p > a > img { vertical-align: middle; }
  .skip { padding: 12px 16px; }

  /* the button-image nav strips read as a stacked menu */
  table[border="1"] td { border-bottom: 1px solid #d8d8d8; }
}

@media (max-width: 900px) and (prefers-reduced-motion: no-preference) {
  html { scroll-behavior: smooth; }
}
