/* The original desktop theme is preserved. These rules add accessible controls
   and adapt its fixed-width layout to smaller screens. */
#content:focus { outline: none; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 3px solid #2066a1; outline-offset: 2px; }
#skip-nav a:focus { left: 12px; top: 8px; position: fixed; z-index: 100; background: white; padding: 8px; }
#artwork-viewer { max-width: calc(100vw - 40px); max-height: calc(100vh - 40px); margin: auto; padding: 10px; border: 5px solid #821623; background: #fff; color: #222; box-sizing: border-box; }
#artwork-viewer::backdrop { background: rgb(0 0 0 / 75%); }
#artwork-viewer .viewer-toolbar { display: flex; align-items: center; gap: 12px; padding-bottom: 10px; }
#artwork-viewer button { padding: 5px 10px; cursor: pointer; }
#artwork-viewer figure { margin: 0; }
#viewer-image { display: block; max-width: 100%; max-height: calc(100vh - 155px); width: auto; height: auto; margin: 0 auto; }
#viewer-caption { padding-top: 8px; font-size: 14px; }
.section-contact #content-top .content { color: black; font-size: 18px; }
.section-contact #content-top .content a { color: #a9343d; }
[hidden] { display: none !important; }
@media (max-width: 1017px) {
  #page { width: auto; margin: 0; }
  h1#site-name a { width: 100%; height: clamp(105px, 15vw, 150px); background-size: cover; background-position: left center; }
  #header #search { top: 8px; right: 8px; }
  #main { display: flex; flex-direction: column; }
  #navigation { order: -2; float: none; margin: 0; width: 100%; height: auto; box-sizing: border-box; }
  #navigation ul { display: flex; flex-wrap: wrap; }
  #navigation ul li, #navigation ul li a { float: none; }
  #navigation ul li a { display: block; height: auto; padding: 7px; }
  #navigation ul li a:hover, #navigation ul li a.active { height: auto; padding: 7px; border: 3px solid #a9343d; }
  #content { float: none; width: auto; margin: 0; }
  #content-inner.center { margin-left: 0; margin-right: 0; padding: 12px; }
  #sidebar-left { order: -1; float: none; width: auto; margin: 0; padding: 0 12px; }
  #sidebar-left .block { margin-top: 10px; }
  #sidebar-left .catalog > li > ul { display: flex; flex-wrap: wrap; gap: 5px 22px; }
  #sidebar-left .catalog > li > ul > li { max-width: 230px; }
  #content img { max-width: 100%; height: auto; box-sizing: border-box; }
  .views-view-grid { table-layout: fixed; }
  .category-grid-products table { table-layout: fixed; }
  .category-grid-products td { overflow-wrap: anywhere; }
  input.form-text, textarea { max-width: 100%; box-sizing: border-box; }
  #content-header h1 { overflow-wrap: anywhere; }
  #content-area a { overflow-wrap: anywhere; }
}
@media (max-width: 540px) {
  #header #search { position: static; padding: 5px; background: #821623; text-align: right; }
  h1#site-name a { height: 112px; background-size: auto 112px; }
  .category-grid-products td { padding: 8px 3px; }
  .views-view-grid td { padding: 0; }
  #content-top .view-content .field-content a img { padding: 1px; }
  #artwork-viewer { max-width: calc(100vw - 16px); }
}