/* ---- Static-site overrides for Triviant ---- */

/* Background slider (replaces the jQuery bjqs plugin) */
#banner-fade { position: absolute !important; top: 0; left: 50%; margin-left: -970px;
  width: 1940px; height: 550px; z-index: -3; }
#banner-fade ul.bjqs { display: block; position: relative; width: 1940px; height: 550px;
  margin: 0; padding: 0; list-style: none; overflow: hidden; }
#banner-fade li.bjqs-slide,
#banner-fade ul.bjqs > li { position: absolute; top: 0; left: 0; display: block;
  width: 1940px; height: 550px; opacity: 0; transition: opacity 1s ease-in-out; }
#banner-fade ul.bjqs > li.is-active { opacity: 1; }
#banner-fade ul.bjqs > li img { width: 1940px; height: 550px; object-fit: cover; display: block; }
.header { min-height: 360px; }

/* Make the old fixed-width grid usable on small screens */
img { max-width: 100%; height: auto; }

@media (max-width: 980px) {
  .grid { width: 100% !important; min-width: 0 !important; max-width: 100% !important;
    padding: 0 16px; }
  [class*='col-'] { width: 100% !important; float: none !important; padding-right: 0 !important; }
  #banner-fade { display: none; }
  .header { min-height: 0; background: #1c1c1c; }
  .header .grid-pad { padding-top: 16px; }
  nav.menu { float: none; }
  ul.main-nav { display: flex; flex-wrap: wrap; gap: 4px 18px; padding: 10px 0 0; }
  .mood { margin-top: 24px; }
}
