/* Layout colours from the original Helix template params, plus Joomla 6 chrome. */
@media (min-width: 1400px) {
  .container { max-width: 1140px; }
}
#sp-top-bar { background-color: #f5f5f5; color: #999; }
#sp-top2 { text-align: right; }
#sp-top-bar img { width: 16px !important; height: auto !important; display: inline !important; }
#sp-bottom { background-color: #f5f5f5; padding: 100px 0; }
#sp-position6 { padding: 40px 0; text-align: center; }
#sp-position6 .sp-module-title { text-align: left; }

/* Original CSS hides the logo on retina unless a @2x file exists. */
#sp-header .sp-default-logo { display: block !important; }
#sp-header .sp-retina-logo { display: none !important; }

.skip { position: absolute; left: -9999px; }
.skip:focus { left: 10px; top: 10px; background: #fff; padding: 10px; z-index: 100; }

.page-header,
.com-content-article .page-header {
  border: 0;
  margin: 0 0 18px;
  padding: 0;
}
.page-header h1,
.com-content-article .page-header h1 {
  font-size: 24px;
  font-weight: 400;
  line-height: 1.2;
  margin: 0;
}
.article-info,
.pagenavigation { display: none; }

.mod-login .form-control,
.mod-login input[type=text],
.mod-login input[type=password] {
  height: 34px;
  border-radius: 0;
}
.mod-login .input-group-text,
.mod-login .input-password-toggle {
  border: 1px solid #ccc;
  background: #eee;
  padding: 6px 10px;
}
.visually-hidden,
.mod-login .visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}
.mod-login .form-check { margin: 8px 0; }
.mod-login .btn-primary { width: 100%; border-radius: 0; }
.form-links { list-style: none; padding: 0; margin: 12px 0 0; }
.form-links > li { border: 0 !important; }
.form-links > li > a:before { display: none !important; }

#flatcal_minical,
#flatcal_minical table { width: 100% !important; }
#flatcal_minical td { text-align: center; padding: 3px; }

.pivo-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 16px 0; }
.pivo-gallery:empty { display: none; }
.pivo-gallery img { width: 100%; aspect-ratio: 4/3; object-fit: cover; }
.pivo-video { aspect-ratio: 16/9; width: 100%; border: 0; }
.pivo-table-wrap { overflow: auto; }
.pivo-table-wrap table { width: 100%; }
.pivo-table-wrap th,
.pivo-table-wrap td { padding: 4px 10px; vertical-align: top; }
.music-table td:nth-child(n+3),
.music-table th { white-space: nowrap; }
.music-table td:nth-child(2) { min-width: 14em; }
.music-table tbody tr:nth-child(even) { background: #f6f6f6; }
.missing { color: #888; }

.pivo-offcanvas { display: none; float: right; }
.pivo-offcanvas > summary {
  list-style: none;
  cursor: pointer;
  line-height: 87px;
  font-size: 20px;
  color: #fff;
}
.pivo-offcanvas > summary::-webkit-details-marker { display: none; }
.pivo-offcanvas-panel {
  position: absolute;
  right: 0;
  top: 90px;
  width: min(320px, 90vw);
  background: #fff;
  box-shadow: 0 3px 8px rgba(0,0,0,.2);
  padding: 16px;
  z-index: 50;
  text-align: left;
}
.pivo-offcanvas-panel .nav { list-style: none; padding: 0; margin: 0; }
.pivo-offcanvas-panel .nav a { display: block; padding: 8px 0; color: #141414; }
.pivo-offcanvas-panel .nav ul { list-style: none; padding-left: 14px; margin: 0; }

/* Items without a page of their own (separators and headings) only open their submenu. */
.sp-megamenu-parent .nav-header,
.pivo-offcanvas-panel .nav-header { cursor: default; }
.pivo-offcanvas-panel .nav-header { display: block; padding: 8px 0; color: #141414; font-weight: 700; }
.sp-megamenu-parent > li > .nav-header {
  display: inline-block;
  padding: 10px;
  font-size: 14px;
  letter-spacing: 1px;
  color: #fff;
  font-weight: 500;
}
.sp-megamenu-parent .sp-dropdown li.sp-menu-item > .nav-header { display: block; padding: 10px; color: #141414; }
.sp-megamenu-parent .sp-dropdown .sp-dropdown-items .sp-has-child > .nav-header:after { font-family: "FontAwesome"; content: " \f105"; float: right; }
/* Keyboard users open dropdowns by focusing into them. */
.sp-megamenu-parent .sp-has-child:focus-within > .sp-dropdown { display: block; opacity: 1; visibility: visible; }
.sp-megamenu-parent a:focus-visible,
.sp-megamenu-parent .nav-header:focus-visible,
.pivo-offcanvas > summary:focus-visible { outline: 2px solid #fff; outline-offset: 2px; }
.pivo-offcanvas > summary { min-width: 44px; text-align: center; }

/* Wide content tables (contacts, rosters) scroll instead of being cut off on phones. */
.com-content-article__body table,
.item-page table,
.blog-item table { display: block; max-width: 100%; overflow-x: auto; width: auto !important; height: auto !important; }
.com-content-article__body img,
.item-page img { max-width: 100%; height: auto; }

.pivo-gallery--teaser { grid-template-columns: minmax(0, 1fr); max-width: 480px; }

/* Joomla 6 pagination glyphs are not part of the legacy IcoMoon subset. */
.pagination [class^="icon-angle"]:before { font-family: FontAwesome; }
.pagination .icon-angle-double-left:before { content: "\f100"; }
.pagination .icon-angle-left:before { content: "\f104"; }
.pagination .icon-angle-right:before { content: "\f105"; }
.pagination .icon-angle-double-right:before { content: "\f101"; }

/* com_users screens (login, reset, remind, profile) inside the legacy grid. */
.com_users .control-group { display: block; margin-bottom: 12px; }
.com_users .control-label,
.com_users .controls { float: none; width: auto; margin: 0; }
.com_users .controls input.form-control,
.com_users .controls .input-group { width: 100%; max-width: 420px; }
.com_users .input-group { display: flex; flex-wrap: nowrap; }
.com_users .btn { max-width: 100%; white-space: normal; }
.com_users .com-users-methods-list img,
.com_users .com-users-methods-list-method-image img,
.com_users [class*="mfa"] img { max-width: 64px; height: auto; }

.com-pivo h1 { font-size: 24px; font-weight: 400; margin: 0 0 18px; }

@media (max-width: 1199px) {
  .pivo-offcanvas { display: block; }
  .sp-megamenu-parent { display: none !important; }
  #sp-header { position: relative; z-index: 30; }
}
@media (max-width: 991px) {
  .pivo-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  * { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
}