@charset "UTF-8";
.link-arrow:hover::before {
  transition-timing-function: cubic-bezier(0.4, 0.82, 0.63, 0.2);
  transition: opacity 0.56s, height 0.56s, transform 0.56s, background 0.3s, font-size 0s;
}

.link-arrow::before {
  transition-timing-function: cubic-bezier(0.4, 0.82, 0.63, 0.2);
  transition: opacity 0.28s, height 0.28s, transform 0.28s, background 0.22s, font-size 0s;
}

.link-arrow:hover::before {
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform-style: preserve-3d;
}

/* * ----------  GLOBAL LAYOUT  ---------- */
:root {
  --header-h: 0px; /* Default fallback for layouts without header height JS */
}

html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

header {
  flex: 0 0 auto;
  width: 100%;
}

picture {
  display: block;
  line-height: 0;
}

/* main: at least full‐screen minus header, but will grow with content */
main#main-content {
  /* ensure it never “shrinks” smaller than the viewport under header */
  min-height: calc(100vh - var(--header-h)) !important;
  height: auto !important;
}

/* footer simply follows main in the flex flow */
footer {
  flex: 0 0 auto;
  width: 100%;
}

/* * ============ Custom classes ============ */
.padding-top-xl {
  padding-top: 96px !important;
}

@media (max-width: 1024px) {
  .lg-padding-top-xl {
    padding-top: 96px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-top-xl.md-padding-top-xl {
    padding-top: 96px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-top-xl.sm-padding-top-xl.sm-padding-top-xl {
    padding-top: 96px !important;
  }
}
.margin-top-xl {
  margin-top: 96px !important;
}

@media (max-width: 1024px) {
  .lg-margin-top-xl {
    margin-top: 96px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-top-xl.md-margin-top-xl {
    margin-top: 96px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-top-xl.sm-margin-top-xl.sm-margin-top-xl {
    margin-top: 96px !important;
  }
}
.padding-top-lg {
  padding-top: 48px !important;
}

@media (max-width: 1024px) {
  .lg-padding-top-lg {
    padding-top: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-top-lg.md-padding-top-lg {
    padding-top: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-top-lg.sm-padding-top-lg.sm-padding-top-lg {
    padding-top: 48px !important;
  }
}
.margin-top-lg {
  margin-top: 48px !important;
}

@media (max-width: 1024px) {
  .lg-margin-top-lg {
    margin-top: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-top-lg.md-margin-top-lg {
    margin-top: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-top-lg.sm-margin-top-lg.sm-margin-top-lg {
    margin-top: 48px !important;
  }
}
.padding-top-md {
  padding-top: 24px !important;
}

@media (max-width: 1024px) {
  .lg-padding-top-md {
    padding-top: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-top-md.md-padding-top-md {
    padding-top: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-top-md.sm-padding-top-md.sm-padding-top-md {
    padding-top: 24px !important;
  }
}
.margin-top-md {
  margin-top: 24px !important;
}

@media (max-width: 1024px) {
  .lg-margin-top-md {
    margin-top: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-top-md.md-margin-top-md {
    margin-top: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-top-md.sm-margin-top-md.sm-margin-top-md {
    margin-top: 24px !important;
  }
}
.padding-top-sm {
  padding-top: 12px !important;
}

@media (max-width: 1024px) {
  .lg-padding-top-sm {
    padding-top: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-top-sm.md-padding-top-sm {
    padding-top: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-top-sm.sm-padding-top-sm.sm-padding-top-sm {
    padding-top: 12px !important;
  }
}
.margin-top-sm {
  margin-top: 12px !important;
}

@media (max-width: 1024px) {
  .lg-margin-top-sm {
    margin-top: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-top-sm.md-margin-top-sm {
    margin-top: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-top-sm.sm-margin-top-sm.sm-margin-top-sm {
    margin-top: 12px !important;
  }
}
.padding-top-none {
  padding-top: 0 !important;
}

@media (max-width: 1024px) {
  .lg-padding-top-none {
    padding-top: 0 !important;
  }
}
@media (max-width: 768px) {
  .md-padding-top-none.md-padding-top-none {
    padding-top: 0 !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-top-none.sm-padding-top-none.sm-padding-top-none {
    padding-top: 0 !important;
  }
}
.margin-top-none {
  margin-top: 0 !important;
}

@media (max-width: 1024px) {
  .lg-margin-top-none {
    margin-top: 0 !important;
  }
}
@media (max-width: 768px) {
  .md-margin-top-none.md-margin-top-none {
    margin-top: 0 !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-top-none.sm-margin-top-none.sm-margin-top-none {
    margin-top: 0 !important;
  }
}
.padding-right-xl {
  padding-right: 96px !important;
}

@media (max-width: 1024px) {
  .lg-padding-right-xl {
    padding-right: 96px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-right-xl.md-padding-right-xl {
    padding-right: 96px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-right-xl.sm-padding-right-xl.sm-padding-right-xl {
    padding-right: 96px !important;
  }
}
.margin-right-xl {
  margin-right: 96px !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-xl {
    margin-right: 96px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-xl.md-margin-right-xl {
    margin-right: 96px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-xl.sm-margin-right-xl.sm-margin-right-xl {
    margin-right: 96px !important;
  }
}
.padding-right-lg {
  padding-right: 48px !important;
}

@media (max-width: 1024px) {
  .lg-padding-right-lg {
    padding-right: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-right-lg.md-padding-right-lg {
    padding-right: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-right-lg.sm-padding-right-lg.sm-padding-right-lg {
    padding-right: 48px !important;
  }
}
.margin-right-lg {
  margin-right: 48px !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-lg {
    margin-right: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-lg.md-margin-right-lg {
    margin-right: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-lg.sm-margin-right-lg.sm-margin-right-lg {
    margin-right: 48px !important;
  }
}
.padding-right-md {
  padding-right: 24px !important;
}

@media (max-width: 1024px) {
  .lg-padding-right-md {
    padding-right: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-right-md.md-padding-right-md {
    padding-right: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-right-md.sm-padding-right-md.sm-padding-right-md {
    padding-right: 24px !important;
  }
}
.margin-right-md {
  margin-right: 24px !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-md {
    margin-right: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-md.md-margin-right-md {
    margin-right: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-md.sm-margin-right-md.sm-margin-right-md {
    margin-right: 24px !important;
  }
}
.padding-right-sm {
  padding-right: 12px !important;
}

@media (max-width: 1024px) {
  .lg-padding-right-sm {
    padding-right: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-right-sm.md-padding-right-sm {
    padding-right: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-right-sm.sm-padding-right-sm.sm-padding-right-sm {
    padding-right: 12px !important;
  }
}
.margin-right-sm {
  margin-right: 12px !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-sm {
    margin-right: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-sm.md-margin-right-sm {
    margin-right: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-sm.sm-margin-right-sm.sm-margin-right-sm {
    margin-right: 12px !important;
  }
}
.padding-right-none {
  padding-right: 0 !important;
}

@media (max-width: 1024px) {
  .lg-padding-right-none {
    padding-right: 0 !important;
  }
}
@media (max-width: 768px) {
  .md-padding-right-none.md-padding-right-none {
    padding-right: 0 !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-right-none.sm-padding-right-none.sm-padding-right-none {
    padding-right: 0 !important;
  }
}
.margin-right-none {
  margin-right: 0 !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-none {
    margin-right: 0 !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-none.md-margin-right-none {
    margin-right: 0 !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-none.sm-margin-right-none.sm-margin-right-none {
    margin-right: 0 !important;
  }
}
.padding-bottom-xl {
  padding-bottom: 96px !important;
}

@media (max-width: 1024px) {
  .lg-padding-bottom-xl {
    padding-bottom: 96px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-bottom-xl.md-padding-bottom-xl {
    padding-bottom: 96px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-bottom-xl.sm-padding-bottom-xl.sm-padding-bottom-xl {
    padding-bottom: 96px !important;
  }
}
.margin-bottom-xl {
  margin-bottom: 96px !important;
}

@media (max-width: 1024px) {
  .lg-margin-bottom-xl {
    margin-bottom: 96px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-bottom-xl.md-margin-bottom-xl {
    margin-bottom: 96px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-bottom-xl.sm-margin-bottom-xl.sm-margin-bottom-xl {
    margin-bottom: 96px !important;
  }
}
.padding-bottom-lg {
  padding-bottom: 48px !important;
}

@media (max-width: 1024px) {
  .lg-padding-bottom-lg {
    padding-bottom: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-bottom-lg.md-padding-bottom-lg {
    padding-bottom: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-bottom-lg.sm-padding-bottom-lg.sm-padding-bottom-lg {
    padding-bottom: 48px !important;
  }
}
.margin-bottom-lg {
  margin-bottom: 48px !important;
}

@media (max-width: 1024px) {
  .lg-margin-bottom-lg {
    margin-bottom: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-bottom-lg.md-margin-bottom-lg {
    margin-bottom: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-bottom-lg.sm-margin-bottom-lg.sm-margin-bottom-lg {
    margin-bottom: 48px !important;
  }
}
.padding-bottom-md {
  padding-bottom: 24px !important;
}

@media (max-width: 1024px) {
  .lg-padding-bottom-md {
    padding-bottom: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-bottom-md.md-padding-bottom-md {
    padding-bottom: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-bottom-md.sm-padding-bottom-md.sm-padding-bottom-md {
    padding-bottom: 24px !important;
  }
}
.margin-bottom-md {
  margin-bottom: 24px !important;
}

@media (max-width: 1024px) {
  .lg-margin-bottom-md {
    margin-bottom: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-bottom-md.md-margin-bottom-md {
    margin-bottom: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-bottom-md.sm-margin-bottom-md.sm-margin-bottom-md {
    margin-bottom: 24px !important;
  }
}
.padding-bottom-sm {
  padding-bottom: 12px !important;
}

@media (max-width: 1024px) {
  .lg-padding-bottom-sm {
    padding-bottom: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-bottom-sm.md-padding-bottom-sm {
    padding-bottom: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-bottom-sm.sm-padding-bottom-sm.sm-padding-bottom-sm {
    padding-bottom: 12px !important;
  }
}
.margin-bottom-sm {
  margin-bottom: 12px !important;
}

@media (max-width: 1024px) {
  .lg-margin-bottom-sm {
    margin-bottom: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-bottom-sm.md-margin-bottom-sm {
    margin-bottom: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-bottom-sm.sm-margin-bottom-sm.sm-margin-bottom-sm {
    margin-bottom: 12px !important;
  }
}
.padding-bottom-none {
  padding-bottom: 0 !important;
}

@media (max-width: 1024px) {
  .lg-padding-bottom-none {
    padding-bottom: 0 !important;
  }
}
@media (max-width: 768px) {
  .md-padding-bottom-none.md-padding-bottom-none {
    padding-bottom: 0 !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-bottom-none.sm-padding-bottom-none.sm-padding-bottom-none {
    padding-bottom: 0 !important;
  }
}
.margin-bottom-none {
  margin-bottom: 0 !important;
}

@media (max-width: 1024px) {
  .lg-margin-bottom-none {
    margin-bottom: 0 !important;
  }
}
@media (max-width: 768px) {
  .md-margin-bottom-none.md-margin-bottom-none {
    margin-bottom: 0 !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-bottom-none.sm-margin-bottom-none.sm-margin-bottom-none {
    margin-bottom: 0 !important;
  }
}
.padding-left-xl {
  padding-left: 96px !important;
}

@media (max-width: 1024px) {
  .lg-padding-left-xl {
    padding-left: 96px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-left-xl.md-padding-left-xl {
    padding-left: 96px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-left-xl.sm-padding-left-xl.sm-padding-left-xl {
    padding-left: 96px !important;
  }
}
.margin-left-xl {
  margin-left: 96px !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-xl {
    margin-left: 96px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-xl.md-margin-left-xl {
    margin-left: 96px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-xl.sm-margin-left-xl.sm-margin-left-xl {
    margin-left: 96px !important;
  }
}
.padding-left-lg {
  padding-left: 48px !important;
}

@media (max-width: 1024px) {
  .lg-padding-left-lg {
    padding-left: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-left-lg.md-padding-left-lg {
    padding-left: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-left-lg.sm-padding-left-lg.sm-padding-left-lg {
    padding-left: 48px !important;
  }
}
.margin-left-lg {
  margin-left: 48px !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-lg {
    margin-left: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-lg.md-margin-left-lg {
    margin-left: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-lg.sm-margin-left-lg.sm-margin-left-lg {
    margin-left: 48px !important;
  }
}
.padding-left-md {
  padding-left: 24px !important;
}

@media (max-width: 1024px) {
  .lg-padding-left-md {
    padding-left: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-left-md.md-padding-left-md {
    padding-left: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-left-md.sm-padding-left-md.sm-padding-left-md {
    padding-left: 24px !important;
  }
}
.margin-left-md {
  margin-left: 24px !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-md {
    margin-left: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-md.md-margin-left-md {
    margin-left: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-md.sm-margin-left-md.sm-margin-left-md {
    margin-left: 24px !important;
  }
}
.padding-left-sm {
  padding-left: 12px !important;
}

@media (max-width: 1024px) {
  .lg-padding-left-sm {
    padding-left: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-left-sm.md-padding-left-sm {
    padding-left: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-left-sm.sm-padding-left-sm.sm-padding-left-sm {
    padding-left: 12px !important;
  }
}
.margin-left-sm {
  margin-left: 12px !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-sm {
    margin-left: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-sm.md-margin-left-sm {
    margin-left: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-sm.sm-margin-left-sm.sm-margin-left-sm {
    margin-left: 12px !important;
  }
}
.padding-left-none {
  padding-left: 0 !important;
}

@media (max-width: 1024px) {
  .lg-padding-left-none {
    padding-left: 0 !important;
  }
}
@media (max-width: 768px) {
  .md-padding-left-none.md-padding-left-none {
    padding-left: 0 !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-left-none.sm-padding-left-none.sm-padding-left-none {
    padding-left: 0 !important;
  }
}
.margin-left-none {
  margin-left: 0 !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-none {
    margin-left: 0 !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-none.md-margin-left-none {
    margin-left: 0 !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-none.sm-margin-left-none.sm-margin-left-none {
    margin-left: 0 !important;
  }
}
.padding-x-xl {
  padding-left: 96px !important;
}

@media (max-width: 1024px) {
  .lg-padding-x-xl {
    padding-left: 96px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-x-xl.md-padding-x-xl {
    padding-left: 96px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-x-xl.sm-padding-x-xl.sm-padding-x-xl {
    padding-left: 96px !important;
  }
}
.padding-x-xl {
  padding-right: 96px !important;
}

@media (max-width: 1024px) {
  .lg-padding-x-xl {
    padding-right: 96px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-x-xl.md-padding-x-xl {
    padding-right: 96px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-x-xl.sm-padding-x-xl.sm-padding-x-xl {
    padding-right: 96px !important;
  }
}
.padding-y-xl {
  padding-top: 96px !important;
}

@media (max-width: 1024px) {
  .lg-padding-y-xl {
    padding-top: 96px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-y-xl.md-padding-y-xl {
    padding-top: 96px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-y-xl.sm-padding-y-xl.sm-padding-y-xl {
    padding-top: 96px !important;
  }
}
.padding-y-xl {
  padding-bottom: 96px !important;
}

@media (max-width: 1024px) {
  .lg-padding-y-xl {
    padding-bottom: 96px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-y-xl.md-padding-y-xl {
    padding-bottom: 96px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-y-xl.sm-padding-y-xl.sm-padding-y-xl {
    padding-bottom: 96px !important;
  }
}
.margin-x-xl {
  margin-left: 96px !important;
}

@media (max-width: 1024px) {
  .lg-margin-x-xl {
    margin-left: 96px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-x-xl.md-margin-x-xl {
    margin-left: 96px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-x-xl.sm-margin-x-xl.sm-margin-x-xl {
    margin-left: 96px !important;
  }
}
.margin-x-xl {
  margin-right: 96px !important;
}

@media (max-width: 1024px) {
  .lg-margin-x-xl {
    margin-right: 96px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-x-xl.md-margin-x-xl {
    margin-right: 96px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-x-xl.sm-margin-x-xl.sm-margin-x-xl {
    margin-right: 96px !important;
  }
}
.margin-y-xl {
  margin-top: 96px !important;
}

@media (max-width: 1024px) {
  .lg-margin-y-xl {
    margin-top: 96px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-y-xl.md-margin-y-xl {
    margin-top: 96px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-y-xl.sm-margin-y-xl.sm-margin-y-xl {
    margin-top: 96px !important;
  }
}
.margin-y-xl {
  margin-bottom: 96px !important;
}

@media (max-width: 1024px) {
  .lg-margin-y-xl {
    margin-bottom: 96px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-y-xl.md-margin-y-xl {
    margin-bottom: 96px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-y-xl.sm-margin-y-xl.sm-margin-y-xl {
    margin-bottom: 96px !important;
  }
}
.padding-x-lg {
  padding-left: 48px !important;
}

@media (max-width: 1024px) {
  .lg-padding-x-lg {
    padding-left: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-x-lg.md-padding-x-lg {
    padding-left: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-x-lg.sm-padding-x-lg.sm-padding-x-lg {
    padding-left: 48px !important;
  }
}
.padding-x-lg {
  padding-right: 48px !important;
}

@media (max-width: 1024px) {
  .lg-padding-x-lg {
    padding-right: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-x-lg.md-padding-x-lg {
    padding-right: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-x-lg.sm-padding-x-lg.sm-padding-x-lg {
    padding-right: 48px !important;
  }
}
.padding-y-lg {
  padding-top: 48px !important;
}

@media (max-width: 1024px) {
  .lg-padding-y-lg {
    padding-top: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-y-lg.md-padding-y-lg {
    padding-top: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-y-lg.sm-padding-y-lg.sm-padding-y-lg {
    padding-top: 48px !important;
  }
}
.padding-y-lg {
  padding-bottom: 48px !important;
}

@media (max-width: 1024px) {
  .lg-padding-y-lg {
    padding-bottom: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-y-lg.md-padding-y-lg {
    padding-bottom: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-y-lg.sm-padding-y-lg.sm-padding-y-lg {
    padding-bottom: 48px !important;
  }
}
.margin-x-lg {
  margin-left: 48px !important;
}

@media (max-width: 1024px) {
  .lg-margin-x-lg {
    margin-left: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-x-lg.md-margin-x-lg {
    margin-left: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-x-lg.sm-margin-x-lg.sm-margin-x-lg {
    margin-left: 48px !important;
  }
}
.margin-x-lg {
  margin-right: 48px !important;
}

@media (max-width: 1024px) {
  .lg-margin-x-lg {
    margin-right: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-x-lg.md-margin-x-lg {
    margin-right: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-x-lg.sm-margin-x-lg.sm-margin-x-lg {
    margin-right: 48px !important;
  }
}
.margin-y-lg {
  margin-top: 48px !important;
}

@media (max-width: 1024px) {
  .lg-margin-y-lg {
    margin-top: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-y-lg.md-margin-y-lg {
    margin-top: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-y-lg.sm-margin-y-lg.sm-margin-y-lg {
    margin-top: 48px !important;
  }
}
.margin-y-lg {
  margin-bottom: 48px !important;
}

@media (max-width: 1024px) {
  .lg-margin-y-lg {
    margin-bottom: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-y-lg.md-margin-y-lg {
    margin-bottom: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-y-lg.sm-margin-y-lg.sm-margin-y-lg {
    margin-bottom: 48px !important;
  }
}
.padding-x-md {
  padding-left: 24px !important;
}

@media (max-width: 1024px) {
  .lg-padding-x-md {
    padding-left: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-x-md.md-padding-x-md {
    padding-left: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-x-md.sm-padding-x-md.sm-padding-x-md {
    padding-left: 24px !important;
  }
}
.padding-x-md {
  padding-right: 24px !important;
}

@media (max-width: 1024px) {
  .lg-padding-x-md {
    padding-right: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-x-md.md-padding-x-md {
    padding-right: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-x-md.sm-padding-x-md.sm-padding-x-md {
    padding-right: 24px !important;
  }
}
.padding-y-md {
  padding-top: 24px !important;
}

@media (max-width: 1024px) {
  .lg-padding-y-md {
    padding-top: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-y-md.md-padding-y-md {
    padding-top: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-y-md.sm-padding-y-md.sm-padding-y-md {
    padding-top: 24px !important;
  }
}
.padding-y-md {
  padding-bottom: 24px !important;
}

@media (max-width: 1024px) {
  .lg-padding-y-md {
    padding-bottom: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-y-md.md-padding-y-md {
    padding-bottom: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-y-md.sm-padding-y-md.sm-padding-y-md {
    padding-bottom: 24px !important;
  }
}
.margin-x-md {
  margin-left: 24px !important;
}

@media (max-width: 1024px) {
  .lg-margin-x-md {
    margin-left: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-x-md.md-margin-x-md {
    margin-left: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-x-md.sm-margin-x-md.sm-margin-x-md {
    margin-left: 24px !important;
  }
}
.margin-x-md {
  margin-right: 24px !important;
}

@media (max-width: 1024px) {
  .lg-margin-x-md {
    margin-right: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-x-md.md-margin-x-md {
    margin-right: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-x-md.sm-margin-x-md.sm-margin-x-md {
    margin-right: 24px !important;
  }
}
.margin-y-md {
  margin-top: 24px !important;
}

@media (max-width: 1024px) {
  .lg-margin-y-md {
    margin-top: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-y-md.md-margin-y-md {
    margin-top: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-y-md.sm-margin-y-md.sm-margin-y-md {
    margin-top: 24px !important;
  }
}
.margin-y-md {
  margin-bottom: 24px !important;
}

@media (max-width: 1024px) {
  .lg-margin-y-md {
    margin-bottom: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-y-md.md-margin-y-md {
    margin-bottom: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-y-md.sm-margin-y-md.sm-margin-y-md {
    margin-bottom: 24px !important;
  }
}
.padding-x-sm {
  padding-left: 12px !important;
}

@media (max-width: 1024px) {
  .lg-padding-x-sm {
    padding-left: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-x-sm.md-padding-x-sm {
    padding-left: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-x-sm.sm-padding-x-sm.sm-padding-x-sm {
    padding-left: 12px !important;
  }
}
.padding-x-sm {
  padding-right: 12px !important;
}

@media (max-width: 1024px) {
  .lg-padding-x-sm {
    padding-right: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-x-sm.md-padding-x-sm {
    padding-right: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-x-sm.sm-padding-x-sm.sm-padding-x-sm {
    padding-right: 12px !important;
  }
}
.padding-y-sm {
  padding-top: 12px !important;
}

@media (max-width: 1024px) {
  .lg-padding-y-sm {
    padding-top: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-y-sm.md-padding-y-sm {
    padding-top: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-y-sm.sm-padding-y-sm.sm-padding-y-sm {
    padding-top: 12px !important;
  }
}
.padding-y-sm {
  padding-bottom: 12px !important;
}

@media (max-width: 1024px) {
  .lg-padding-y-sm {
    padding-bottom: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-padding-y-sm.md-padding-y-sm {
    padding-bottom: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-y-sm.sm-padding-y-sm.sm-padding-y-sm {
    padding-bottom: 12px !important;
  }
}
.margin-x-sm {
  margin-left: 12px !important;
}

@media (max-width: 1024px) {
  .lg-margin-x-sm {
    margin-left: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-x-sm.md-margin-x-sm {
    margin-left: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-x-sm.sm-margin-x-sm.sm-margin-x-sm {
    margin-left: 12px !important;
  }
}
.margin-x-sm {
  margin-right: 12px !important;
}

@media (max-width: 1024px) {
  .lg-margin-x-sm {
    margin-right: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-x-sm.md-margin-x-sm {
    margin-right: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-x-sm.sm-margin-x-sm.sm-margin-x-sm {
    margin-right: 12px !important;
  }
}
.margin-y-sm {
  margin-top: 12px !important;
}

@media (max-width: 1024px) {
  .lg-margin-y-sm {
    margin-top: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-y-sm.md-margin-y-sm {
    margin-top: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-y-sm.sm-margin-y-sm.sm-margin-y-sm {
    margin-top: 12px !important;
  }
}
.margin-y-sm {
  margin-bottom: 12px !important;
}

@media (max-width: 1024px) {
  .lg-margin-y-sm {
    margin-bottom: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-margin-y-sm.md-margin-y-sm {
    margin-bottom: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-y-sm.sm-margin-y-sm.sm-margin-y-sm {
    margin-bottom: 12px !important;
  }
}
.padding-x-none {
  padding-left: 0 !important;
}

@media (max-width: 1024px) {
  .lg-padding-x-none {
    padding-left: 0 !important;
  }
}
@media (max-width: 768px) {
  .md-padding-x-none.md-padding-x-none {
    padding-left: 0 !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-x-none.sm-padding-x-none.sm-padding-x-none {
    padding-left: 0 !important;
  }
}
.padding-x-none {
  padding-right: 0 !important;
}

@media (max-width: 1024px) {
  .lg-padding-x-none {
    padding-right: 0 !important;
  }
}
@media (max-width: 768px) {
  .md-padding-x-none.md-padding-x-none {
    padding-right: 0 !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-x-none.sm-padding-x-none.sm-padding-x-none {
    padding-right: 0 !important;
  }
}
.padding-y-none {
  padding-top: 0 !important;
}

@media (max-width: 1024px) {
  .lg-padding-y-none {
    padding-top: 0 !important;
  }
}
@media (max-width: 768px) {
  .md-padding-y-none.md-padding-y-none {
    padding-top: 0 !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-y-none.sm-padding-y-none.sm-padding-y-none {
    padding-top: 0 !important;
  }
}
.padding-y-none {
  padding-bottom: 0 !important;
}

@media (max-width: 1024px) {
  .lg-padding-y-none {
    padding-bottom: 0 !important;
  }
}
@media (max-width: 768px) {
  .md-padding-y-none.md-padding-y-none {
    padding-bottom: 0 !important;
  }
}
@media (max-width: 576px) {
  .sm-padding-y-none.sm-padding-y-none.sm-padding-y-none {
    padding-bottom: 0 !important;
  }
}
.margin-x-none {
  margin-left: 0 !important;
}

@media (max-width: 1024px) {
  .lg-margin-x-none {
    margin-left: 0 !important;
  }
}
@media (max-width: 768px) {
  .md-margin-x-none.md-margin-x-none {
    margin-left: 0 !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-x-none.sm-margin-x-none.sm-margin-x-none {
    margin-left: 0 !important;
  }
}
.margin-x-none {
  margin-right: 0 !important;
}

@media (max-width: 1024px) {
  .lg-margin-x-none {
    margin-right: 0 !important;
  }
}
@media (max-width: 768px) {
  .md-margin-x-none.md-margin-x-none {
    margin-right: 0 !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-x-none.sm-margin-x-none.sm-margin-x-none {
    margin-right: 0 !important;
  }
}
.margin-y-none {
  margin-top: 0 !important;
}

@media (max-width: 1024px) {
  .lg-margin-y-none {
    margin-top: 0 !important;
  }
}
@media (max-width: 768px) {
  .md-margin-y-none.md-margin-y-none {
    margin-top: 0 !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-y-none.sm-margin-y-none.sm-margin-y-none {
    margin-top: 0 !important;
  }
}
.margin-y-none {
  margin-bottom: 0 !important;
}

@media (max-width: 1024px) {
  .lg-margin-y-none {
    margin-bottom: 0 !important;
  }
}
@media (max-width: 768px) {
  .md-margin-y-none.md-margin-y-none {
    margin-bottom: 0 !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-y-none.sm-margin-y-none.sm-margin-y-none {
    margin-bottom: 0 !important;
  }
}
.width-5 {
  width: 5% !important;
}

@media (max-width: 1024px) {
  .lg-width-5 {
    width: 5% !important;
  }
}
@media (max-width: 768px) {
  .md-width-5.md-width-5 {
    width: 5% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-5.sm-width-5.sm-width-5 {
    width: 5% !important;
  }
}
.width-10 {
  width: 10% !important;
}

@media (max-width: 1024px) {
  .lg-width-10 {
    width: 10% !important;
  }
}
@media (max-width: 768px) {
  .md-width-10.md-width-10 {
    width: 10% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-10.sm-width-10.sm-width-10 {
    width: 10% !important;
  }
}
.width-15 {
  width: 15% !important;
}

@media (max-width: 1024px) {
  .lg-width-15 {
    width: 15% !important;
  }
}
@media (max-width: 768px) {
  .md-width-15.md-width-15 {
    width: 15% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-15.sm-width-15.sm-width-15 {
    width: 15% !important;
  }
}
.width-20 {
  width: 20% !important;
}

@media (max-width: 1024px) {
  .lg-width-20 {
    width: 20% !important;
  }
}
@media (max-width: 768px) {
  .md-width-20.md-width-20 {
    width: 20% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-20.sm-width-20.sm-width-20 {
    width: 20% !important;
  }
}
.width-25 {
  width: 25% !important;
}

@media (max-width: 1024px) {
  .lg-width-25 {
    width: 25% !important;
  }
}
@media (max-width: 768px) {
  .md-width-25.md-width-25 {
    width: 25% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-25.sm-width-25.sm-width-25 {
    width: 25% !important;
  }
}
.width-30 {
  width: 30% !important;
}

@media (max-width: 1024px) {
  .lg-width-30 {
    width: 30% !important;
  }
}
@media (max-width: 768px) {
  .md-width-30.md-width-30 {
    width: 30% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-30.sm-width-30.sm-width-30 {
    width: 30% !important;
  }
}
.width-33 {
  width: 33% !important;
}

@media (max-width: 1024px) {
  .lg-width-33 {
    width: 33% !important;
  }
}
@media (max-width: 768px) {
  .md-width-33.md-width-33 {
    width: 33% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-33.sm-width-33.sm-width-33 {
    width: 33% !important;
  }
}
.width-35 {
  width: 35% !important;
}

@media (max-width: 1024px) {
  .lg-width-35 {
    width: 35% !important;
  }
}
@media (max-width: 768px) {
  .md-width-35.md-width-35 {
    width: 35% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-35.sm-width-35.sm-width-35 {
    width: 35% !important;
  }
}
.width-40 {
  width: 40% !important;
}

@media (max-width: 1024px) {
  .lg-width-40 {
    width: 40% !important;
  }
}
@media (max-width: 768px) {
  .md-width-40.md-width-40 {
    width: 40% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-40.sm-width-40.sm-width-40 {
    width: 40% !important;
  }
}
.width-45 {
  width: 45% !important;
}

@media (max-width: 1024px) {
  .lg-width-45 {
    width: 45% !important;
  }
}
@media (max-width: 768px) {
  .md-width-45.md-width-45 {
    width: 45% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-45.sm-width-45.sm-width-45 {
    width: 45% !important;
  }
}
.width-50 {
  width: 50% !important;
}

@media (max-width: 1024px) {
  .lg-width-50 {
    width: 50% !important;
  }
}
@media (max-width: 768px) {
  .md-width-50.md-width-50 {
    width: 50% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-50.sm-width-50.sm-width-50 {
    width: 50% !important;
  }
}
.width-55 {
  width: 55% !important;
}

@media (max-width: 1024px) {
  .lg-width-55 {
    width: 55% !important;
  }
}
@media (max-width: 768px) {
  .md-width-55.md-width-55 {
    width: 55% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-55.sm-width-55.sm-width-55 {
    width: 55% !important;
  }
}
.width-60 {
  width: 60% !important;
}

@media (max-width: 1024px) {
  .lg-width-60 {
    width: 60% !important;
  }
}
@media (max-width: 768px) {
  .md-width-60.md-width-60 {
    width: 60% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-60.sm-width-60.sm-width-60 {
    width: 60% !important;
  }
}
.width-65 {
  width: 65% !important;
}

@media (max-width: 1024px) {
  .lg-width-65 {
    width: 65% !important;
  }
}
@media (max-width: 768px) {
  .md-width-65.md-width-65 {
    width: 65% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-65.sm-width-65.sm-width-65 {
    width: 65% !important;
  }
}
.width-66 {
  width: 66% !important;
}

@media (max-width: 1024px) {
  .lg-width-66 {
    width: 66% !important;
  }
}
@media (max-width: 768px) {
  .md-width-66.md-width-66 {
    width: 66% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-66.sm-width-66.sm-width-66 {
    width: 66% !important;
  }
}
.width-70 {
  width: 70% !important;
}

@media (max-width: 1024px) {
  .lg-width-70 {
    width: 70% !important;
  }
}
@media (max-width: 768px) {
  .md-width-70.md-width-70 {
    width: 70% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-70.sm-width-70.sm-width-70 {
    width: 70% !important;
  }
}
.width-75 {
  width: 75% !important;
}

@media (max-width: 1024px) {
  .lg-width-75 {
    width: 75% !important;
  }
}
@media (max-width: 768px) {
  .md-width-75.md-width-75 {
    width: 75% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-75.sm-width-75.sm-width-75 {
    width: 75% !important;
  }
}
.width-80 {
  width: 80% !important;
}

@media (max-width: 1024px) {
  .lg-width-80 {
    width: 80% !important;
  }
}
@media (max-width: 768px) {
  .md-width-80.md-width-80 {
    width: 80% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-80.sm-width-80.sm-width-80 {
    width: 80% !important;
  }
}
.width-85 {
  width: 85% !important;
}

@media (max-width: 1024px) {
  .lg-width-85 {
    width: 85% !important;
  }
}
@media (max-width: 768px) {
  .md-width-85.md-width-85 {
    width: 85% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-85.sm-width-85.sm-width-85 {
    width: 85% !important;
  }
}
.width-90 {
  width: 90% !important;
}

@media (max-width: 1024px) {
  .lg-width-90 {
    width: 90% !important;
  }
}
@media (max-width: 768px) {
  .md-width-90.md-width-90 {
    width: 90% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-90.sm-width-90.sm-width-90 {
    width: 90% !important;
  }
}
.width-95 {
  width: 95% !important;
}

@media (max-width: 1024px) {
  .lg-width-95 {
    width: 95% !important;
  }
}
@media (max-width: 768px) {
  .md-width-95.md-width-95 {
    width: 95% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-95.sm-width-95.sm-width-95 {
    width: 95% !important;
  }
}
.width-100 {
  width: 100% !important;
}

@media (max-width: 1024px) {
  .lg-width-100 {
    width: 100% !important;
  }
}
@media (max-width: 768px) {
  .md-width-100.md-width-100 {
    width: 100% !important;
  }
}
@media (max-width: 576px) {
  .sm-width-100.sm-width-100.sm-width-100 {
    width: 100% !important;
  }
}
.margin-left-5 {
  margin-left: 5% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-5 {
    margin-left: 5% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-5.md-margin-left-5 {
    margin-left: 5% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-5.sm-margin-left-5.sm-margin-left-5 {
    margin-left: 5% !important;
  }
}
.margin-right-5 {
  margin-right: 5% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-5 {
    margin-right: 5% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-5.md-margin-right-5 {
    margin-right: 5% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-5.sm-margin-right-5.sm-margin-right-5 {
    margin-right: 5% !important;
  }
}
.margin-left-10 {
  margin-left: 10% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-10 {
    margin-left: 10% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-10.md-margin-left-10 {
    margin-left: 10% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-10.sm-margin-left-10.sm-margin-left-10 {
    margin-left: 10% !important;
  }
}
.margin-right-10 {
  margin-right: 10% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-10 {
    margin-right: 10% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-10.md-margin-right-10 {
    margin-right: 10% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-10.sm-margin-right-10.sm-margin-right-10 {
    margin-right: 10% !important;
  }
}
.margin-left-15 {
  margin-left: 15% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-15 {
    margin-left: 15% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-15.md-margin-left-15 {
    margin-left: 15% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-15.sm-margin-left-15.sm-margin-left-15 {
    margin-left: 15% !important;
  }
}
.margin-right-15 {
  margin-right: 15% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-15 {
    margin-right: 15% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-15.md-margin-right-15 {
    margin-right: 15% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-15.sm-margin-right-15.sm-margin-right-15 {
    margin-right: 15% !important;
  }
}
.margin-left-20 {
  margin-left: 20% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-20 {
    margin-left: 20% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-20.md-margin-left-20 {
    margin-left: 20% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-20.sm-margin-left-20.sm-margin-left-20 {
    margin-left: 20% !important;
  }
}
.margin-right-20 {
  margin-right: 20% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-20 {
    margin-right: 20% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-20.md-margin-right-20 {
    margin-right: 20% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-20.sm-margin-right-20.sm-margin-right-20 {
    margin-right: 20% !important;
  }
}
.margin-left-25 {
  margin-left: 25% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-25 {
    margin-left: 25% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-25.md-margin-left-25 {
    margin-left: 25% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-25.sm-margin-left-25.sm-margin-left-25 {
    margin-left: 25% !important;
  }
}
.margin-right-25 {
  margin-right: 25% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-25 {
    margin-right: 25% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-25.md-margin-right-25 {
    margin-right: 25% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-25.sm-margin-right-25.sm-margin-right-25 {
    margin-right: 25% !important;
  }
}
.margin-left-30 {
  margin-left: 30% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-30 {
    margin-left: 30% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-30.md-margin-left-30 {
    margin-left: 30% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-30.sm-margin-left-30.sm-margin-left-30 {
    margin-left: 30% !important;
  }
}
.margin-right-30 {
  margin-right: 30% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-30 {
    margin-right: 30% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-30.md-margin-right-30 {
    margin-right: 30% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-30.sm-margin-right-30.sm-margin-right-30 {
    margin-right: 30% !important;
  }
}
.margin-left-33 {
  margin-left: 33% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-33 {
    margin-left: 33% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-33.md-margin-left-33 {
    margin-left: 33% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-33.sm-margin-left-33.sm-margin-left-33 {
    margin-left: 33% !important;
  }
}
.margin-right-33 {
  margin-right: 33% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-33 {
    margin-right: 33% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-33.md-margin-right-33 {
    margin-right: 33% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-33.sm-margin-right-33.sm-margin-right-33 {
    margin-right: 33% !important;
  }
}
.margin-left-35 {
  margin-left: 35% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-35 {
    margin-left: 35% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-35.md-margin-left-35 {
    margin-left: 35% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-35.sm-margin-left-35.sm-margin-left-35 {
    margin-left: 35% !important;
  }
}
.margin-right-35 {
  margin-right: 35% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-35 {
    margin-right: 35% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-35.md-margin-right-35 {
    margin-right: 35% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-35.sm-margin-right-35.sm-margin-right-35 {
    margin-right: 35% !important;
  }
}
.margin-left-40 {
  margin-left: 40% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-40 {
    margin-left: 40% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-40.md-margin-left-40 {
    margin-left: 40% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-40.sm-margin-left-40.sm-margin-left-40 {
    margin-left: 40% !important;
  }
}
.margin-right-40 {
  margin-right: 40% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-40 {
    margin-right: 40% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-40.md-margin-right-40 {
    margin-right: 40% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-40.sm-margin-right-40.sm-margin-right-40 {
    margin-right: 40% !important;
  }
}
.margin-left-45 {
  margin-left: 45% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-45 {
    margin-left: 45% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-45.md-margin-left-45 {
    margin-left: 45% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-45.sm-margin-left-45.sm-margin-left-45 {
    margin-left: 45% !important;
  }
}
.margin-right-45 {
  margin-right: 45% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-45 {
    margin-right: 45% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-45.md-margin-right-45 {
    margin-right: 45% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-45.sm-margin-right-45.sm-margin-right-45 {
    margin-right: 45% !important;
  }
}
.margin-left-50 {
  margin-left: 50% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-50 {
    margin-left: 50% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-50.md-margin-left-50 {
    margin-left: 50% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-50.sm-margin-left-50.sm-margin-left-50 {
    margin-left: 50% !important;
  }
}
.margin-right-50 {
  margin-right: 50% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-50 {
    margin-right: 50% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-50.md-margin-right-50 {
    margin-right: 50% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-50.sm-margin-right-50.sm-margin-right-50 {
    margin-right: 50% !important;
  }
}
.margin-left-55 {
  margin-left: 55% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-55 {
    margin-left: 55% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-55.md-margin-left-55 {
    margin-left: 55% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-55.sm-margin-left-55.sm-margin-left-55 {
    margin-left: 55% !important;
  }
}
.margin-right-55 {
  margin-right: 55% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-55 {
    margin-right: 55% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-55.md-margin-right-55 {
    margin-right: 55% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-55.sm-margin-right-55.sm-margin-right-55 {
    margin-right: 55% !important;
  }
}
.margin-left-60 {
  margin-left: 60% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-60 {
    margin-left: 60% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-60.md-margin-left-60 {
    margin-left: 60% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-60.sm-margin-left-60.sm-margin-left-60 {
    margin-left: 60% !important;
  }
}
.margin-right-60 {
  margin-right: 60% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-60 {
    margin-right: 60% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-60.md-margin-right-60 {
    margin-right: 60% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-60.sm-margin-right-60.sm-margin-right-60 {
    margin-right: 60% !important;
  }
}
.margin-left-65 {
  margin-left: 65% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-65 {
    margin-left: 65% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-65.md-margin-left-65 {
    margin-left: 65% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-65.sm-margin-left-65.sm-margin-left-65 {
    margin-left: 65% !important;
  }
}
.margin-right-65 {
  margin-right: 65% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-65 {
    margin-right: 65% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-65.md-margin-right-65 {
    margin-right: 65% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-65.sm-margin-right-65.sm-margin-right-65 {
    margin-right: 65% !important;
  }
}
.margin-left-66 {
  margin-left: 66% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-66 {
    margin-left: 66% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-66.md-margin-left-66 {
    margin-left: 66% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-66.sm-margin-left-66.sm-margin-left-66 {
    margin-left: 66% !important;
  }
}
.margin-right-66 {
  margin-right: 66% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-66 {
    margin-right: 66% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-66.md-margin-right-66 {
    margin-right: 66% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-66.sm-margin-right-66.sm-margin-right-66 {
    margin-right: 66% !important;
  }
}
.margin-left-70 {
  margin-left: 70% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-70 {
    margin-left: 70% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-70.md-margin-left-70 {
    margin-left: 70% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-70.sm-margin-left-70.sm-margin-left-70 {
    margin-left: 70% !important;
  }
}
.margin-right-70 {
  margin-right: 70% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-70 {
    margin-right: 70% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-70.md-margin-right-70 {
    margin-right: 70% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-70.sm-margin-right-70.sm-margin-right-70 {
    margin-right: 70% !important;
  }
}
.margin-left-75 {
  margin-left: 75% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-75 {
    margin-left: 75% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-75.md-margin-left-75 {
    margin-left: 75% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-75.sm-margin-left-75.sm-margin-left-75 {
    margin-left: 75% !important;
  }
}
.margin-right-75 {
  margin-right: 75% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-75 {
    margin-right: 75% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-75.md-margin-right-75 {
    margin-right: 75% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-75.sm-margin-right-75.sm-margin-right-75 {
    margin-right: 75% !important;
  }
}
.margin-left-80 {
  margin-left: 80% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-80 {
    margin-left: 80% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-80.md-margin-left-80 {
    margin-left: 80% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-80.sm-margin-left-80.sm-margin-left-80 {
    margin-left: 80% !important;
  }
}
.margin-right-80 {
  margin-right: 80% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-80 {
    margin-right: 80% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-80.md-margin-right-80 {
    margin-right: 80% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-80.sm-margin-right-80.sm-margin-right-80 {
    margin-right: 80% !important;
  }
}
.margin-left-85 {
  margin-left: 85% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-85 {
    margin-left: 85% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-85.md-margin-left-85 {
    margin-left: 85% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-85.sm-margin-left-85.sm-margin-left-85 {
    margin-left: 85% !important;
  }
}
.margin-right-85 {
  margin-right: 85% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-85 {
    margin-right: 85% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-85.md-margin-right-85 {
    margin-right: 85% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-85.sm-margin-right-85.sm-margin-right-85 {
    margin-right: 85% !important;
  }
}
.margin-left-90 {
  margin-left: 90% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-90 {
    margin-left: 90% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-90.md-margin-left-90 {
    margin-left: 90% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-90.sm-margin-left-90.sm-margin-left-90 {
    margin-left: 90% !important;
  }
}
.margin-right-90 {
  margin-right: 90% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-90 {
    margin-right: 90% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-90.md-margin-right-90 {
    margin-right: 90% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-90.sm-margin-right-90.sm-margin-right-90 {
    margin-right: 90% !important;
  }
}
.margin-left-95 {
  margin-left: 95% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-95 {
    margin-left: 95% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-95.md-margin-left-95 {
    margin-left: 95% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-95.sm-margin-left-95.sm-margin-left-95 {
    margin-left: 95% !important;
  }
}
.margin-right-95 {
  margin-right: 95% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-95 {
    margin-right: 95% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-95.md-margin-right-95 {
    margin-right: 95% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-95.sm-margin-right-95.sm-margin-right-95 {
    margin-right: 95% !important;
  }
}
.margin-left-100 {
  margin-left: 100% !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-100 {
    margin-left: 100% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-100.md-margin-left-100 {
    margin-left: 100% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-100.sm-margin-left-100.sm-margin-left-100 {
    margin-left: 100% !important;
  }
}
.margin-right-100 {
  margin-right: 100% !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-100 {
    margin-right: 100% !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-100.md-margin-right-100 {
    margin-right: 100% !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-100.sm-margin-right-100.sm-margin-right-100 {
    margin-right: 100% !important;
  }
}
.height-50 {
  height: 50px !important;
}

@media (max-width: 1024px) {
  .lg-height-50 {
    height: 50px !important;
  }
}
@media (max-width: 768px) {
  .md-height-50.md-height-50 {
    height: 50px !important;
  }
}
@media (max-width: 576px) {
  .sm-height-50.sm-height-50.sm-height-50 {
    height: 50px !important;
  }
}
.height-100 {
  height: 100px !important;
}

@media (max-width: 1024px) {
  .lg-height-100 {
    height: 100px !important;
  }
}
@media (max-width: 768px) {
  .md-height-100.md-height-100 {
    height: 100px !important;
  }
}
@media (max-width: 576px) {
  .sm-height-100.sm-height-100.sm-height-100 {
    height: 100px !important;
  }
}
.height-150 {
  height: 150px !important;
}

@media (max-width: 1024px) {
  .lg-height-150 {
    height: 150px !important;
  }
}
@media (max-width: 768px) {
  .md-height-150.md-height-150 {
    height: 150px !important;
  }
}
@media (max-width: 576px) {
  .sm-height-150.sm-height-150.sm-height-150 {
    height: 150px !important;
  }
}
.height-200 {
  height: 200px !important;
}

@media (max-width: 1024px) {
  .lg-height-200 {
    height: 200px !important;
  }
}
@media (max-width: 768px) {
  .md-height-200.md-height-200 {
    height: 200px !important;
  }
}
@media (max-width: 576px) {
  .sm-height-200.sm-height-200.sm-height-200 {
    height: 200px !important;
  }
}
.height-250 {
  height: 250px !important;
}

@media (max-width: 1024px) {
  .lg-height-250 {
    height: 250px !important;
  }
}
@media (max-width: 768px) {
  .md-height-250.md-height-250 {
    height: 250px !important;
  }
}
@media (max-width: 576px) {
  .sm-height-250.sm-height-250.sm-height-250 {
    height: 250px !important;
  }
}
.height-300 {
  height: 300px !important;
}

@media (max-width: 1024px) {
  .lg-height-300 {
    height: 300px !important;
  }
}
@media (max-width: 768px) {
  .md-height-300.md-height-300 {
    height: 300px !important;
  }
}
@media (max-width: 576px) {
  .sm-height-300.sm-height-300.sm-height-300 {
    height: 300px !important;
  }
}
.height-350 {
  height: 350px !important;
}

@media (max-width: 1024px) {
  .lg-height-350 {
    height: 350px !important;
  }
}
@media (max-width: 768px) {
  .md-height-350.md-height-350 {
    height: 350px !important;
  }
}
@media (max-width: 576px) {
  .sm-height-350.sm-height-350.sm-height-350 {
    height: 350px !important;
  }
}
.height-400 {
  height: 400px !important;
}

@media (max-width: 1024px) {
  .lg-height-400 {
    height: 400px !important;
  }
}
@media (max-width: 768px) {
  .md-height-400.md-height-400 {
    height: 400px !important;
  }
}
@media (max-width: 576px) {
  .sm-height-400.sm-height-400.sm-height-400 {
    height: 400px !important;
  }
}
.height-450 {
  height: 450px !important;
}

@media (max-width: 1024px) {
  .lg-height-450 {
    height: 450px !important;
  }
}
@media (max-width: 768px) {
  .md-height-450.md-height-450 {
    height: 450px !important;
  }
}
@media (max-width: 576px) {
  .sm-height-450.sm-height-450.sm-height-450 {
    height: 450px !important;
  }
}
.height-500 {
  height: 500px !important;
}

@media (max-width: 1024px) {
  .lg-height-500 {
    height: 500px !important;
  }
}
@media (max-width: 768px) {
  .md-height-500.md-height-500 {
    height: 500px !important;
  }
}
@media (max-width: 576px) {
  .sm-height-500.sm-height-500.sm-height-500 {
    height: 500px !important;
  }
}
.height-550 {
  height: 550px !important;
}

@media (max-width: 1024px) {
  .lg-height-550 {
    height: 550px !important;
  }
}
@media (max-width: 768px) {
  .md-height-550.md-height-550 {
    height: 550px !important;
  }
}
@media (max-width: 576px) {
  .sm-height-550.sm-height-550.sm-height-550 {
    height: 550px !important;
  }
}
.height-600 {
  height: 600px !important;
}

@media (max-width: 1024px) {
  .lg-height-600 {
    height: 600px !important;
  }
}
@media (max-width: 768px) {
  .md-height-600.md-height-600 {
    height: 600px !important;
  }
}
@media (max-width: 576px) {
  .sm-height-600.sm-height-600.sm-height-600 {
    height: 600px !important;
  }
}
.height-650 {
  height: 650px !important;
}

@media (max-width: 1024px) {
  .lg-height-650 {
    height: 650px !important;
  }
}
@media (max-width: 768px) {
  .md-height-650.md-height-650 {
    height: 650px !important;
  }
}
@media (max-width: 576px) {
  .sm-height-650.sm-height-650.sm-height-650 {
    height: 650px !important;
  }
}
.height-700 {
  height: 700px !important;
}

@media (max-width: 1024px) {
  .lg-height-700 {
    height: 700px !important;
  }
}
@media (max-width: 768px) {
  .md-height-700.md-height-700 {
    height: 700px !important;
  }
}
@media (max-width: 576px) {
  .sm-height-700.sm-height-700.sm-height-700 {
    height: 700px !important;
  }
}
.height-750 {
  height: 750px !important;
}

@media (max-width: 1024px) {
  .lg-height-750 {
    height: 750px !important;
  }
}
@media (max-width: 768px) {
  .md-height-750.md-height-750 {
    height: 750px !important;
  }
}
@media (max-width: 576px) {
  .sm-height-750.sm-height-750.sm-height-750 {
    height: 750px !important;
  }
}
.height-800 {
  height: 800px !important;
}

@media (max-width: 1024px) {
  .lg-height-800 {
    height: 800px !important;
  }
}
@media (max-width: 768px) {
  .md-height-800.md-height-800 {
    height: 800px !important;
  }
}
@media (max-width: 576px) {
  .sm-height-800.sm-height-800.sm-height-800 {
    height: 800px !important;
  }
}
.height-auto {
  height: auto !important;
}

@media (max-width: 1024px) {
  .lg-height-auto {
    height: auto !important;
  }
}
@media (max-width: 768px) {
  .md-height-auto.md-height-auto {
    height: auto !important;
  }
}
@media (max-width: 576px) {
  .sm-height-auto.sm-height-auto.sm-height-auto {
    height: auto !important;
  }
}
@media (max-width: 400px) {
  .xs-height-50.xs-height-50.xs-height-50.xs-height-50 {
    height: 50px !important;
  }
  .xs-height-100.xs-height-100.xs-height-100.xs-height-100 {
    height: 100px !important;
  }
  .xs-height-150.xs-height-150.xs-height-150.xs-height-150 {
    height: 150px !important;
  }
  .xs-height-200.xs-height-200.xs-height-200.xs-height-200 {
    height: 200px !important;
  }
  .xs-height-250.xs-height-250.xs-height-250.xs-height-250 {
    height: 250px !important;
  }
  .xs-height-300.xs-height-300.xs-height-300.xs-height-300 {
    height: 300px !important;
  }
  .xs-height-350.xs-height-350.xs-height-350.xs-height-350 {
    height: 350px !important;
  }
  .xs-height-400.xs-height-400.xs-height-400.xs-height-400 {
    height: 400px !important;
  }
  .xs-height-450.xs-height-450.xs-height-450.xs-height-450 {
    height: 450px !important;
  }
  .xs-height-500.xs-height-500.xs-height-500.xs-height-500 {
    height: 500px !important;
  }
  .xs-height-550.xs-height-550.xs-height-550.xs-height-550 {
    height: 550px !important;
  }
  .xs-height-600.xs-height-600.xs-height-600.xs-height-600 {
    height: 600px !important;
  }
  .xs-height-650.xs-height-650.xs-height-650.xs-height-650 {
    height: 650px !important;
  }
  .xs-height-700.xs-height-700.xs-height-700.xs-height-700 {
    height: 700px !important;
  }
  .xs-height-750.xs-height-750.xs-height-750.xs-height-750 {
    height: 750px !important;
  }
  .xs-height-800.xs-height-800.xs-height-800.xs-height-800 {
    height: 800px !important;
  }
  .xs-height-auto.xs-height-auto.xs-height-auto.xs-height-auto {
    height: auto !important;
  }
}
.min-height-50 {
  min-height: 50px !important;
}

.min-height-100 {
  min-height: 100px !important;
}

.min-height-150 {
  min-height: 150px !important;
}

.min-height-200 {
  min-height: 200px !important;
}

.min-height-250 {
  min-height: 250px !important;
}

.min-height-300 {
  min-height: 300px !important;
}

.min-height-350 {
  min-height: 350px !important;
}

.min-height-400 {
  min-height: 400px !important;
}

.min-height-450 {
  min-height: 450px !important;
}

.min-height-500 {
  min-height: 500px !important;
}

.min-height-550 {
  min-height: 550px !important;
}

.min-height-600 {
  min-height: 600px !important;
}

.min-height-650 {
  min-height: 650px !important;
}

.min-height-700 {
  min-height: 700px !important;
}

.min-height-750 {
  min-height: 750px !important;
}

.min-height-800 {
  min-height: 800px !important;
}

@media (max-width: 576px) {
  .sm-min-height-50.sm-min-height-50.sm-min-height-50 {
    min-height: 50px !important;
  }
  .sm-min-height-100.sm-min-height-100.sm-min-height-100 {
    min-height: 100px !important;
  }
  .sm-min-height-150.sm-min-height-150.sm-min-height-150 {
    min-height: 150px !important;
  }
  .sm-min-height-200.sm-min-height-200.sm-min-height-200 {
    min-height: 200px !important;
  }
  .sm-min-height-250.sm-min-height-250.sm-min-height-250 {
    min-height: 250px !important;
  }
  .sm-min-height-300.sm-min-height-300.sm-min-height-300 {
    min-height: 300px !important;
  }
  .sm-min-height-350.sm-min-height-350.sm-min-height-350 {
    min-height: 350px !important;
  }
  .sm-min-height-400.sm-min-height-400.sm-min-height-400 {
    min-height: 400px !important;
  }
  .sm-min-height-450.sm-min-height-450.sm-min-height-450 {
    min-height: 450px !important;
  }
  .sm-min-height-500.sm-min-height-500.sm-min-height-500 {
    min-height: 500px !important;
  }
  .sm-min-height-550.sm-min-height-550.sm-min-height-550 {
    min-height: 550px !important;
  }
  .sm-min-height-600.sm-min-height-600.sm-min-height-600 {
    min-height: 600px !important;
  }
  .sm-min-height-650.sm-min-height-650.sm-min-height-650 {
    min-height: 650px !important;
  }
  .sm-min-height-700.sm-min-height-700.sm-min-height-700 {
    min-height: 700px !important;
  }
  .sm-min-height-750.sm-min-height-750.sm-min-height-750 {
    min-height: 750px !important;
  }
  .sm-min-height-800.sm-min-height-800.sm-min-height-800 {
    min-height: 800px !important;
  }
}
.margin-auto {
  margin: auto !important;
}

@media (max-width: 1024px) {
  .lg-margin-auto {
    margin: auto !important;
  }
}
@media (max-width: 768px) {
  .md-margin-auto.md-margin-auto {
    margin: auto !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-auto.sm-margin-auto.sm-margin-auto {
    margin: auto !important;
  }
}
.margin-left-auto {
  margin-left: auto !important;
}

@media (max-width: 1024px) {
  .lg-margin-left-auto {
    margin-left: auto !important;
  }
}
@media (max-width: 768px) {
  .md-margin-left-auto.md-margin-left-auto {
    margin-left: auto !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-left-auto.sm-margin-left-auto.sm-margin-left-auto {
    margin-left: auto !important;
  }
}
.margin-right-auto {
  margin-right: auto !important;
}

@media (max-width: 1024px) {
  .lg-margin-right-auto {
    margin-right: auto !important;
  }
}
@media (max-width: 768px) {
  .md-margin-right-auto.md-margin-right-auto {
    margin-right: auto !important;
  }
}
@media (max-width: 576px) {
  .sm-margin-right-auto.sm-margin-right-auto.sm-margin-right-auto {
    margin-right: auto !important;
  }
}
.max-width-100 {
  max-width: 100px !important;
}

@media (max-width: 1024px) {
  .lg-max-width-100 {
    max-width: 100px !important;
  }
}
@media (max-width: 768px) {
  .md-max-width-100.md-max-width-100 {
    max-width: 100px !important;
  }
}
@media (max-width: 576px) {
  .sm-max-width-100.sm-max-width-100.sm-max-width-100 {
    max-width: 100px !important;
  }
}
.max-width-125 {
  max-width: 125px !important;
}

@media (max-width: 1024px) {
  .lg-max-width-125 {
    max-width: 125px !important;
  }
}
@media (max-width: 768px) {
  .md-max-width-125.md-max-width-125 {
    max-width: 125px !important;
  }
}
@media (max-width: 576px) {
  .sm-max-width-125.sm-max-width-125.sm-max-width-125 {
    max-width: 125px !important;
  }
}
.max-width-150 {
  max-width: 150px !important;
}

@media (max-width: 1024px) {
  .lg-max-width-150 {
    max-width: 150px !important;
  }
}
@media (max-width: 768px) {
  .md-max-width-150.md-max-width-150 {
    max-width: 150px !important;
  }
}
@media (max-width: 576px) {
  .sm-max-width-150.sm-max-width-150.sm-max-width-150 {
    max-width: 150px !important;
  }
}
.max-width-175 {
  max-width: 175px !important;
}

@media (max-width: 1024px) {
  .lg-max-width-175 {
    max-width: 175px !important;
  }
}
@media (max-width: 768px) {
  .md-max-width-175.md-max-width-175 {
    max-width: 175px !important;
  }
}
@media (max-width: 576px) {
  .sm-max-width-175.sm-max-width-175.sm-max-width-175 {
    max-width: 175px !important;
  }
}
.max-width-200 {
  max-width: 200px !important;
}

.max-width-250 {
  max-width: 250px !important;
}

.max-width-300 {
  max-width: 300px !important;
}

.max-width-400 {
  max-width: 400px !important;
}

.max-width-500 {
  max-width: 500px !important;
}

.max-width-600 {
  max-width: 600px !important;
}

.max-width-700 {
  max-width: 700px !important;
}

.max-width-800 {
  max-width: 800px !important;
}

.max-width-900 {
  max-width: 900px !important;
}

.max-width-1000 {
  max-width: 1000px !important;
}

.max-width-1100 {
  max-width: 1100px !important;
}

.max-width-1200 {
  max-width: 1200px !important;
}

.max-width-1300 {
  max-width: 1300px !important;
}

.max-width-1400 {
  max-width: 1400px !important;
}

.max-width-1500 {
  max-width: 1500px !important;
}

.min-width-150 {
  min-width: 150px !important;
}

.min-width-200 {
  min-width: 200px !important;
}

.min-width-250 {
  min-width: 250px !important;
}

.min-width-300 {
  min-width: 300px !important;
}

.min-width-400 {
  min-width: 400px !important;
}

.min-width-500 {
  min-width: 500px !important;
}

.min-width-600 {
  min-width: 600px !important;
}

.min-width-700 {
  min-width: 700px !important;
}

.min-width-800 {
  min-width: 800px !important;
}

.min-width-900 {
  min-width: 900px !important;
}

.min-width-1000 {
  min-width: 1000px !important;
}

.min-width-1100 {
  min-width: 1100px !important;
}

.min-width-1200 {
  min-width: 1200px !important;
}

.min-width-1300 {
  min-width: 1300px !important;
}

.min-width-1400 {
  min-width: 1400px !important;
}

.min-width-1500 {
  min-width: 1500px !important;
}

@media (max-width: 768px) {
  .md-max-width-500 {
    max-width: 500px;
  }
}

.height-full {
  height: 100%;
}

.width-fit-content {
  width: fit-content;
}

.border-radius-none {
  border-radius: 0 !important;
}

.border-radius-8 {
  border-radius: 8px !important;
}

.border-radius-12 {
  border-radius: 12px !important;
}

.border-radius-16 {
  border-radius: 16px !important;
}

.border-radius-20 {
  border-radius: 20px !important;
}

.border-radius-24 {
  border-radius: 24px !important;
}

.border-radius-32 {
  border-radius: 32px !important;
}

.box-shadow-soft {
  box-shadow: 0 0 6px 0 rgba(0, 0, 0, 0.1) !important;
}

.box-shadow-soft-lg {
  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.15) !important;
}

.overflow-hidden {
  overflow: hidden !important;
}

/* Background-image position/size/repeat utilities. Override the
   default inline styles applied by blocks that set background-image. */
.background-position-top-left {
  background-position: top left !important;
}

.background-position-top-right {
  background-position: top right !important;
}

.background-position-top-center {
  background-position: top center !important;
}

.background-position-bottom-left {
  background-position: bottom left !important;
}

.background-position-bottom-right {
  background-position: bottom right !important;
}

.background-position-bottom-center {
  background-position: bottom center !important;
}

.background-position-center {
  background-position: center !important;
}

.background-size-cover {
  background-size: cover !important;
}

.background-size-contain {
  background-size: contain !important;
}

.background-size-auto {
  background-size: auto !important;
}

.background-size-stretch-x {
  background-size: 100% auto !important;
}

.background-size-stretch-y {
  background-size: auto 100% !important;
}

.background-size-40px {
  background-size: 40px auto !important;
}

@media (max-width: 1024px) {
  .lg-background-size-40px {
    background-size: 40px auto !important;
  }
}
@media (max-width: 768px) {
  .md-background-size-40px.md-background-size-40px {
    background-size: 40px auto !important;
  }
}
@media (max-width: 576px) {
  .sm-background-size-40px.sm-background-size-40px.sm-background-size-40px {
    background-size: 40px auto !important;
  }
}
.background-size-50px {
  background-size: 50px auto !important;
}

@media (max-width: 1024px) {
  .lg-background-size-50px {
    background-size: 50px auto !important;
  }
}
@media (max-width: 768px) {
  .md-background-size-50px.md-background-size-50px {
    background-size: 50px auto !important;
  }
}
@media (max-width: 576px) {
  .sm-background-size-50px.sm-background-size-50px.sm-background-size-50px {
    background-size: 50px auto !important;
  }
}
.background-size-60px {
  background-size: 60px auto !important;
}

@media (max-width: 1024px) {
  .lg-background-size-60px {
    background-size: 60px auto !important;
  }
}
@media (max-width: 768px) {
  .md-background-size-60px.md-background-size-60px {
    background-size: 60px auto !important;
  }
}
@media (max-width: 576px) {
  .sm-background-size-60px.sm-background-size-60px.sm-background-size-60px {
    background-size: 60px auto !important;
  }
}
.background-size-80px {
  background-size: 80px auto !important;
}

@media (max-width: 1024px) {
  .lg-background-size-80px {
    background-size: 80px auto !important;
  }
}
@media (max-width: 768px) {
  .md-background-size-80px.md-background-size-80px {
    background-size: 80px auto !important;
  }
}
@media (max-width: 576px) {
  .sm-background-size-80px.sm-background-size-80px.sm-background-size-80px {
    background-size: 80px auto !important;
  }
}
.background-size-100px {
  background-size: 100px auto !important;
}

@media (max-width: 1024px) {
  .lg-background-size-100px {
    background-size: 100px auto !important;
  }
}
@media (max-width: 768px) {
  .md-background-size-100px.md-background-size-100px {
    background-size: 100px auto !important;
  }
}
@media (max-width: 576px) {
  .sm-background-size-100px.sm-background-size-100px.sm-background-size-100px {
    background-size: 100px auto !important;
  }
}
.background-size-120px {
  background-size: 120px auto !important;
}

@media (max-width: 1024px) {
  .lg-background-size-120px {
    background-size: 120px auto !important;
  }
}
@media (max-width: 768px) {
  .md-background-size-120px.md-background-size-120px {
    background-size: 120px auto !important;
  }
}
@media (max-width: 576px) {
  .sm-background-size-120px.sm-background-size-120px.sm-background-size-120px {
    background-size: 120px auto !important;
  }
}
.background-size-150px {
  background-size: 150px auto !important;
}

@media (max-width: 1024px) {
  .lg-background-size-150px {
    background-size: 150px auto !important;
  }
}
@media (max-width: 768px) {
  .md-background-size-150px.md-background-size-150px {
    background-size: 150px auto !important;
  }
}
@media (max-width: 576px) {
  .sm-background-size-150px.sm-background-size-150px.sm-background-size-150px {
    background-size: 150px auto !important;
  }
}
.background-size-200px {
  background-size: 200px auto !important;
}

@media (max-width: 1024px) {
  .lg-background-size-200px {
    background-size: 200px auto !important;
  }
}
@media (max-width: 768px) {
  .md-background-size-200px.md-background-size-200px {
    background-size: 200px auto !important;
  }
}
@media (max-width: 576px) {
  .sm-background-size-200px.sm-background-size-200px.sm-background-size-200px {
    background-size: 200px auto !important;
  }
}
.background-size-250px {
  background-size: 250px auto !important;
}

@media (max-width: 1024px) {
  .lg-background-size-250px {
    background-size: 250px auto !important;
  }
}
@media (max-width: 768px) {
  .md-background-size-250px.md-background-size-250px {
    background-size: 250px auto !important;
  }
}
@media (max-width: 576px) {
  .sm-background-size-250px.sm-background-size-250px.sm-background-size-250px {
    background-size: 250px auto !important;
  }
}
.background-no-repeat {
  background-repeat: no-repeat !important;
}

.background-repeat {
  background-repeat: repeat !important;
}

.gap-none {
  gap: 0 !important;
}

.gap-1 {
  gap: 1rem !important;
}

.gap-2 {
  gap: 2rem !important;
}

.gap-3 {
  gap: 3rem !important;
}

.gap-4 {
  gap: 4rem !important;
}

.gap-5 {
  gap: 5rem !important;
}

.gap-4 {
  gap: 4px !important;
}

.gap-8 {
  gap: 8px !important;
}

.gap-12 {
  gap: 12px !important;
}

.gap-16 {
  gap: 16px !important;
}

.gap-20 {
  gap: 20px !important;
}

.gap-24 {
  gap: 24px !important;
}

.gap-28 {
  gap: 28px !important;
}

.gap-32 {
  gap: 32px !important;
}

.gap-36 {
  gap: 36px !important;
}

.gap-40 {
  gap: 40px !important;
}

.gap-48 {
  gap: 48px !important;
}

.gap-64 {
  gap: 64px !important;
}

.float-right {
  float: right !important;
}

.float-left {
  float: left !important;
}

.flex {
  display: flex;
}

.flex-column {
  flex-direction: column;
}

.items-left {
  justify-content: flex-start;
}

.items-center {
  justify-content: center;
}

.items-right {
  justify-content: flex-end;
}

.space-evenly {
  justify-content: space-evenly;
}

.space-around {
  justify-content: space-around;
}

.align-start {
  align-items: flex-start;
}

.align-center {
  align-items: center;
}

.align-end {
  align-items: flex-end;
}

.align-self-start {
  align-self: flex-start !important;
}

@media (max-width: 1024px) {
  .lg-align-self-start {
    align-self: flex-start !important;
  }
}
@media (max-width: 768px) {
  .md-align-self-start.md-align-self-start {
    align-self: flex-start !important;
  }
}
@media (max-width: 576px) {
  .sm-align-self-start.sm-align-self-start.sm-align-self-start {
    align-self: flex-start !important;
  }
}
.align-self-center {
  align-self: center !important;
}

@media (max-width: 1024px) {
  .lg-align-self-center {
    align-self: center !important;
  }
}
@media (max-width: 768px) {
  .md-align-self-center.md-align-self-center {
    align-self: center !important;
  }
}
@media (max-width: 576px) {
  .sm-align-self-center.sm-align-self-center.sm-align-self-center {
    align-self: center !important;
  }
}
.align-self-end {
  align-self: flex-end !important;
}

@media (max-width: 1024px) {
  .lg-align-self-end {
    align-self: flex-end !important;
  }
}
@media (max-width: 768px) {
  .md-align-self-end.md-align-self-end {
    align-self: flex-end !important;
  }
}
@media (max-width: 576px) {
  .sm-align-self-end.sm-align-self-end.sm-align-self-end {
    align-self: flex-end !important;
  }
}
.vertical-center {
  display: flex;
  align-items: center;
}

.br-sm-down, .br-md-down, .br-lg-down {
  display: none;
}

@media (max-width: 1024px) {
  .br-lg-down {
    display: inline;
  }
}
@media (max-width: 768px) {
  .br-md-down {
    display: inline;
  }
}
@media (max-width: 576px) {
  .br-sm-down {
    display: inline;
  }
}
@media (max-width: 1024px) {
  .break-before-lg-down::before {
    content: "\a";
    white-space: pre;
  }
}
@media (max-width: 768px) {
  .break-before-md-down::before {
    content: "\a";
    white-space: pre;
  }
}
@media (max-width: 576px) {
  .break-before-sm-down::before {
    content: "\a";
    white-space: pre;
  }
}
.vertical-top {
  display: flex;
  align-items: flex-start;
}

@media (max-width: 1024px) {
  .lg-vertical-top {
    align-items: flex-start !important;
  }
}
@media (max-width: 768px) {
  .md-vertical-top.md-vertical-top {
    align-items: flex-start !important;
  }
}
@media (max-width: 576px) {
  .sm-vertical-top.sm-vertical-top.sm-vertical-top {
    align-items: flex-start !important;
  }
}
.height-full {
  height: 100% !important;
}

.width-full {
  width: 100% !important;
}

.width-auto {
  width: auto !important;
}

.display-none {
  display: none;
}

.line-height-200 {
  line-height: 200%;
}

.object-fit-fill {
  object-fit: fill !important;
}

.object-fit-cover {
  object-fit: cover !important;
}

.object-fit-contain {
  object-fit: contain !important;
}

.object-fit-none {
  object-fit: none !important;
}

.object-position-center {
  object-position: center !important;
}

@media (max-width: 1024px) {
  .lg-object-position-center {
    object-position: center !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-center.md-object-position-center {
    object-position: center !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-center.sm-object-position-center.sm-object-position-center {
    object-position: center !important;
  }
}
.object-position-top {
  object-position: top !important;
}

@media (max-width: 1024px) {
  .lg-object-position-top {
    object-position: top !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-top.md-object-position-top {
    object-position: top !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-top.sm-object-position-top.sm-object-position-top {
    object-position: top !important;
  }
}
.object-position-bottom {
  object-position: bottom !important;
}

@media (max-width: 1024px) {
  .lg-object-position-bottom {
    object-position: bottom !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-bottom.md-object-position-bottom {
    object-position: bottom !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-bottom.sm-object-position-bottom.sm-object-position-bottom {
    object-position: bottom !important;
  }
}
.object-position-left {
  object-position: left !important;
}

@media (max-width: 1024px) {
  .lg-object-position-left {
    object-position: left !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-left.md-object-position-left {
    object-position: left !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-left.sm-object-position-left.sm-object-position-left {
    object-position: left !important;
  }
}
.object-position-right {
  object-position: right !important;
}

@media (max-width: 1024px) {
  .lg-object-position-right {
    object-position: right !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-right.md-object-position-right {
    object-position: right !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-right.sm-object-position-right.sm-object-position-right {
    object-position: right !important;
  }
}
.object-position-top-left {
  object-position: top left !important;
}

@media (max-width: 1024px) {
  .lg-object-position-top-left {
    object-position: top left !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-top-left.md-object-position-top-left {
    object-position: top left !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-top-left.sm-object-position-top-left.sm-object-position-top-left {
    object-position: top left !important;
  }
}
.object-position-top-right {
  object-position: top right !important;
}

@media (max-width: 1024px) {
  .lg-object-position-top-right {
    object-position: top right !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-top-right.md-object-position-top-right {
    object-position: top right !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-top-right.sm-object-position-top-right.sm-object-position-top-right {
    object-position: top right !important;
  }
}
.object-position-bottom-left {
  object-position: bottom left !important;
}

@media (max-width: 1024px) {
  .lg-object-position-bottom-left {
    object-position: bottom left !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-bottom-left.md-object-position-bottom-left {
    object-position: bottom left !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-bottom-left.sm-object-position-bottom-left.sm-object-position-bottom-left {
    object-position: bottom left !important;
  }
}
.object-position-bottom-right {
  object-position: bottom right !important;
}

@media (max-width: 1024px) {
  .lg-object-position-bottom-right {
    object-position: bottom right !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-bottom-right.md-object-position-bottom-right {
    object-position: bottom right !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-bottom-right.sm-object-position-bottom-right.sm-object-position-bottom-right {
    object-position: bottom right !important;
  }
}
.object-position-x-10 {
  object-position: 10% 50% !important;
}

@media (max-width: 1024px) {
  .lg-object-position-x-10 {
    object-position: 10% 50% !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-x-10.md-object-position-x-10 {
    object-position: 10% 50% !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-x-10.sm-object-position-x-10.sm-object-position-x-10 {
    object-position: 10% 50% !important;
  }
}
.object-position-x-20 {
  object-position: 20% 50% !important;
}

@media (max-width: 1024px) {
  .lg-object-position-x-20 {
    object-position: 20% 50% !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-x-20.md-object-position-x-20 {
    object-position: 20% 50% !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-x-20.sm-object-position-x-20.sm-object-position-x-20 {
    object-position: 20% 50% !important;
  }
}
.object-position-x-30 {
  object-position: 30% 50% !important;
}

@media (max-width: 1024px) {
  .lg-object-position-x-30 {
    object-position: 30% 50% !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-x-30.md-object-position-x-30 {
    object-position: 30% 50% !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-x-30.sm-object-position-x-30.sm-object-position-x-30 {
    object-position: 30% 50% !important;
  }
}
.object-position-x-40 {
  object-position: 40% 50% !important;
}

@media (max-width: 1024px) {
  .lg-object-position-x-40 {
    object-position: 40% 50% !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-x-40.md-object-position-x-40 {
    object-position: 40% 50% !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-x-40.sm-object-position-x-40.sm-object-position-x-40 {
    object-position: 40% 50% !important;
  }
}
.object-position-x-60 {
  object-position: 60% 50% !important;
}

@media (max-width: 1024px) {
  .lg-object-position-x-60 {
    object-position: 60% 50% !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-x-60.md-object-position-x-60 {
    object-position: 60% 50% !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-x-60.sm-object-position-x-60.sm-object-position-x-60 {
    object-position: 60% 50% !important;
  }
}
.object-position-x-70 {
  object-position: 70% 50% !important;
}

@media (max-width: 1024px) {
  .lg-object-position-x-70 {
    object-position: 70% 50% !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-x-70.md-object-position-x-70 {
    object-position: 70% 50% !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-x-70.sm-object-position-x-70.sm-object-position-x-70 {
    object-position: 70% 50% !important;
  }
}
.object-position-x-80 {
  object-position: 80% 50% !important;
}

@media (max-width: 1024px) {
  .lg-object-position-x-80 {
    object-position: 80% 50% !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-x-80.md-object-position-x-80 {
    object-position: 80% 50% !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-x-80.sm-object-position-x-80.sm-object-position-x-80 {
    object-position: 80% 50% !important;
  }
}
.object-position-x-90 {
  object-position: 90% 50% !important;
}

@media (max-width: 1024px) {
  .lg-object-position-x-90 {
    object-position: 90% 50% !important;
  }
}
@media (max-width: 768px) {
  .md-object-position-x-90.md-object-position-x-90 {
    object-position: 90% 50% !important;
  }
}
@media (max-width: 576px) {
  .sm-object-position-x-90.sm-object-position-x-90.sm-object-position-x-90 {
    object-position: 90% 50% !important;
  }
}
.background-white {
  background-color: white;
}

.text-wrap {
  overflow-wrap: anywhere;
  word-break: break-word;
}

@media (min-width: 769px) {
  .full-page {
    min-height: 100vh;
  }
}

/* + Colors */
.color-rmkblue {
  color: #004186;
}

.color-white {
  color: #fff;
}

.color-black {
  color: #000;
}

/* Strip top + bottom margins from <p> children. Useful for tightly stacking
   rich-text paragraphs (e.g. multi-line address blocks) where the default
   1em margin pushes them apart. Apply to a wrapper, not the <p> itself. */
.paragraphs-tight p {
  margin: 0 !important;
}

/* + Font Family */
.font-family-open-sans {
  font-family: "Open Sans", sans-serif;
}

/* + Button Styles */
.button-square-accent-green, .button-square-orange, .button-square-blue, .button-square-lightblue {
  width: 214px;
  height: 50px;
  margin: 24px 24px 32px 0;
  display: inline-block;
  transition: 0.22s;
  box-shadow: 1px 4px 4px rgba(2, 2, 2, 0);
}
.button-square-accent-green, .button-square-orange, .button-square-blue, .button-square-lightblue, .button-square-accent-green p, .button-square-orange p, .button-square-blue p, .button-square-lightblue p {
  margin: 0;
  color: #fff;
  padding: 0 !important;
  font-size: 1.2em;
  font-weight: 800;
  text-align: center !important;
  line-height: 50px !important;
  text-transform: uppercase;
  max-width: 100% !important;
}
.button-square-accent-green:hover, .button-square-orange:hover, .button-square-blue:hover, .button-square-lightblue:hover {
  transform: translateY(-2px);
  box-shadow: 1px 4px 4px rgba(2, 2, 2, 0.12);
}

.button-square-lightblue {
  background: #00aeef;
}

.button-square-blue {
  background: #004186;
}
.button-square-blue:hover {
  background: #1e5794;
}

.button-gyford-blue {
  display: inline-block;
  box-sizing: border-box;
  background: #2A7F99;
  color: #fff;
  padding: 9px 28px;
  font-size: 14px;
  line-height: 1.5;
  font-weight: 700;
  text-transform: uppercase;
  text-decoration: none;
  transition: background 0.22s, box-shadow 0.22s;
}
.button-gyford-blue:hover {
  background: #226880;
  color: #fff;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.button-gyford-ocean-blue, .button-gyford-white-blue, .button-gyford-light-sky, .button-gyford-white {
  display: inline-flex;
  box-sizing: border-box;
  padding: 9px 28px;
  justify-content: center;
  align-items: center;
  gap: 10px;
  color: #063F48;
  text-align: center;
  font-size: 20px;
  font-weight: 900;
  line-height: 21px;
  text-transform: uppercase;
  text-decoration: none;
  transition: background 0.22s, box-shadow 0.22s;
}
.button-gyford-ocean-blue:hover, .button-gyford-white-blue:hover, .button-gyford-light-sky:hover, .button-gyford-white:hover {
  color: #063F48;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
}

.button-gyford-white {
  background: #FFFFFF;
}
.button-gyford-white:hover {
  background: #F0F0F0;
}

.button-gyford-light-sky {
  background: #B3E5F3;
}
.button-gyford-light-sky:hover {
  background: #9CD8E8;
}

.button-gyford-white-blue {
  background: #FFFFFF;
  color: #2A7F99;
}
.button-gyford-white-blue:hover {
  background: #F0F0F0;
  color: #2A7F99;
}

.button-gyford-ocean-blue {
  background: #2A7F99;
  color: #FFFFFF;
  font-weight: 700;
}
.button-gyford-ocean-blue:hover {
  background: #226880;
  color: #FFFFFF;
}

@media (max-width: 576px) {
  .button-gyford-white,
  .button-gyford-light-sky,
  .button-gyford-white-blue {
    font-size: 14px;
    line-height: 16px;
    padding: 8px 18px 6px 18px;
  }
}
.icon-download::before {
  content: "";
  display: inline-block;
  width: 24px;
  height: 20px;
  margin-right: 10px;
  vertical-align: middle;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z'/></svg>") no-repeat center/contain;
  mask: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z'/></svg>") no-repeat center/contain;
}

.button-square-orange {
  background: #fc7f10;
}
.button-square-orange:hover {
  background: #ff9c52;
}

.button-square-accent-green {
  background: #6B8E19;
  color: white;
}

/* + Box Shadows */
.box-shadow-sm {
  box-shadow: 0 2px 4px rgba(2, 2, 2, 0.16);
}

.box-shadow-md {
  box-shadow: 0 4px 8px rgba(2, 2, 2, 0.2);
}

.box-shadow-lg {
  box-shadow: 0 8px 16px rgba(2, 2, 2, 0.24);
}

/* * ============ Shared Block Styles ============ */
.block {
  width: 100%;
}

.block:first-child {
  margin-top: 0;
}

.block:last-child {
  margin-bottom: 0;
}

.page-builder {
  width: 100%;
}

/* * ============ Rich text specific styles ============ */
.link-arrow {
  font-weight: 700;
  color: #004186;
  position: relative;
  display: inline-block;
}

.link-arrow::before {
  position: absolute;
  content: "";
  display: none;
  background: url("../images/icons/arrowblue.png") no-repeat center center;
  background-size: 100% 100%;
  right: -52px;
  top: 50%;
  transform: translateY(-50%);
  height: 28px;
  width: 50px;
}

.link-arrow:hover::before {
  transform: translateY(-50%) translateX(6px) !important;
  display: block;
}

.link-arrow.blue::before {
  background: url("../images/icons/arrowblue.png") no-repeat center center;
  background-size: 100% 100%;
  width: 50px;
  top: 50%;
  transform: translateY(-50%);
  right: -55px;
}

.link-arrow.blue:hover::before {
  transform: translateY(-50%) translateX(6px) !important;
}

/* Side image: float next to text */
figure.image.image-style-side,
img.image-style-side {
  float: left;
  max-width: 40%;
  margin: 0 0.9rem 0.6rem 0;
}

figure.image.image-style-align-right,
img.image-style-align-right {
  float: right;
  margin-left: 15px;
}

figure.image.image-style-align-left,
img.image-style-align-left {
  float: left;
  margin-right: 15px;
}

/* Mobile: drop floats so image becomes full-width above text */
@media (max-width: 700px) {
  figure.image.image-style-side,
  img.image-style-side,
  figure.image.image-style-align-right,
  img.image-style-align-right,
  figure.image.image-style-align-left,
  img.image-style-align-left {
    float: none;
    max-width: 100%;
    margin: 0.5rem 0;
  }
}
/* * Rich Text - Stolen from Rowlam */
.fadeinslide {
  -webkit-animation: fadeinslide 0.5s;
  animation: fadeinslide 0.5s;
  visibility: visible !important;
  transition-timing-function: cubic-bezier(0.45, 0.09, 0.01, 0.98);
}

.fadeindelay {
  -webkit-animation: fadeindelay 0.8s;
  animation: fadeindelay 0.8s;
  visibility: visible !important;
}

.headerlinks h3.title {
  font-size: calc(1.75vw + 1.75vh) !important;
}

.font-weight-normal {
  font-weight: 400 !important;
}

.font-bold {
  font-weight: 700 !important;
}

/* Font-size utilities (px) — with lg/md/sm responsive variants */
.font-size-12 {
  font-size: 12px !important;
}

@media (max-width: 1024px) {
  .lg-font-size-12 {
    font-size: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-font-size-12.md-font-size-12 {
    font-size: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-font-size-12.sm-font-size-12.sm-font-size-12 {
    font-size: 12px !important;
  }
}
.font-size-14 {
  font-size: 14px !important;
}

@media (max-width: 1024px) {
  .lg-font-size-14 {
    font-size: 14px !important;
  }
}
@media (max-width: 768px) {
  .md-font-size-14.md-font-size-14 {
    font-size: 14px !important;
  }
}
@media (max-width: 576px) {
  .sm-font-size-14.sm-font-size-14.sm-font-size-14 {
    font-size: 14px !important;
  }
}
.font-size-16 {
  font-size: 16px !important;
}

@media (max-width: 1024px) {
  .lg-font-size-16 {
    font-size: 16px !important;
  }
}
@media (max-width: 768px) {
  .md-font-size-16.md-font-size-16 {
    font-size: 16px !important;
  }
}
@media (max-width: 576px) {
  .sm-font-size-16.sm-font-size-16.sm-font-size-16 {
    font-size: 16px !important;
  }
}
.font-size-18 {
  font-size: 18px !important;
}

@media (max-width: 1024px) {
  .lg-font-size-18 {
    font-size: 18px !important;
  }
}
@media (max-width: 768px) {
  .md-font-size-18.md-font-size-18 {
    font-size: 18px !important;
  }
}
@media (max-width: 576px) {
  .sm-font-size-18.sm-font-size-18.sm-font-size-18 {
    font-size: 18px !important;
  }
}
.font-size-20 {
  font-size: 20px !important;
}

@media (max-width: 1024px) {
  .lg-font-size-20 {
    font-size: 20px !important;
  }
}
@media (max-width: 768px) {
  .md-font-size-20.md-font-size-20 {
    font-size: 20px !important;
  }
}
@media (max-width: 576px) {
  .sm-font-size-20.sm-font-size-20.sm-font-size-20 {
    font-size: 20px !important;
  }
}
.font-size-24 {
  font-size: 24px !important;
}

@media (max-width: 1024px) {
  .lg-font-size-24 {
    font-size: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-font-size-24.md-font-size-24 {
    font-size: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-font-size-24.sm-font-size-24.sm-font-size-24 {
    font-size: 24px !important;
  }
}
.font-size-28 {
  font-size: 28px !important;
}

@media (max-width: 1024px) {
  .lg-font-size-28 {
    font-size: 28px !important;
  }
}
@media (max-width: 768px) {
  .md-font-size-28.md-font-size-28 {
    font-size: 28px !important;
  }
}
@media (max-width: 576px) {
  .sm-font-size-28.sm-font-size-28.sm-font-size-28 {
    font-size: 28px !important;
  }
}
.font-size-32 {
  font-size: 32px !important;
}

@media (max-width: 1024px) {
  .lg-font-size-32 {
    font-size: 32px !important;
  }
}
@media (max-width: 768px) {
  .md-font-size-32.md-font-size-32 {
    font-size: 32px !important;
  }
}
@media (max-width: 576px) {
  .sm-font-size-32.sm-font-size-32.sm-font-size-32 {
    font-size: 32px !important;
  }
}
.font-size-36 {
  font-size: 36px !important;
}

@media (max-width: 1024px) {
  .lg-font-size-36 {
    font-size: 36px !important;
  }
}
@media (max-width: 768px) {
  .md-font-size-36.md-font-size-36 {
    font-size: 36px !important;
  }
}
@media (max-width: 576px) {
  .sm-font-size-36.sm-font-size-36.sm-font-size-36 {
    font-size: 36px !important;
  }
}
.font-size-40 {
  font-size: 40px !important;
}

@media (max-width: 1024px) {
  .lg-font-size-40 {
    font-size: 40px !important;
  }
}
@media (max-width: 768px) {
  .md-font-size-40.md-font-size-40 {
    font-size: 40px !important;
  }
}
@media (max-width: 576px) {
  .sm-font-size-40.sm-font-size-40.sm-font-size-40 {
    font-size: 40px !important;
  }
}
.font-size-48 {
  font-size: 48px !important;
}

@media (max-width: 1024px) {
  .lg-font-size-48 {
    font-size: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-font-size-48.md-font-size-48 {
    font-size: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-font-size-48.sm-font-size-48.sm-font-size-48 {
    font-size: 48px !important;
  }
}
/* Paragraph-scoping font-size utilities — forces font-size on <p>
   children. Use when inheritance from a parent's font-size doesn't
   reach <p> (e.g. CKEditor inline overrides, or specific p rules
   higher in the cascade). Apply to the WRAPPER, not the <p>. */
.p-font-size-12 p {
  font-size: 12px !important;
}

@media (max-width: 1024px) {
  .lg-p-font-size-12 p {
    font-size: 12px !important;
  }
}
@media (max-width: 768px) {
  .md-p-font-size-12.md-p-font-size-12 p {
    font-size: 12px !important;
  }
}
@media (max-width: 576px) {
  .sm-p-font-size-12.sm-p-font-size-12.sm-p-font-size-12 p {
    font-size: 12px !important;
  }
}
.p-font-size-14 p {
  font-size: 14px !important;
}

@media (max-width: 1024px) {
  .lg-p-font-size-14 p {
    font-size: 14px !important;
  }
}
@media (max-width: 768px) {
  .md-p-font-size-14.md-p-font-size-14 p {
    font-size: 14px !important;
  }
}
@media (max-width: 576px) {
  .sm-p-font-size-14.sm-p-font-size-14.sm-p-font-size-14 p {
    font-size: 14px !important;
  }
}
.p-font-size-16 p {
  font-size: 16px !important;
}

@media (max-width: 1024px) {
  .lg-p-font-size-16 p {
    font-size: 16px !important;
  }
}
@media (max-width: 768px) {
  .md-p-font-size-16.md-p-font-size-16 p {
    font-size: 16px !important;
  }
}
@media (max-width: 576px) {
  .sm-p-font-size-16.sm-p-font-size-16.sm-p-font-size-16 p {
    font-size: 16px !important;
  }
}
.p-font-size-18 p {
  font-size: 18px !important;
}

@media (max-width: 1024px) {
  .lg-p-font-size-18 p {
    font-size: 18px !important;
  }
}
@media (max-width: 768px) {
  .md-p-font-size-18.md-p-font-size-18 p {
    font-size: 18px !important;
  }
}
@media (max-width: 576px) {
  .sm-p-font-size-18.sm-p-font-size-18.sm-p-font-size-18 p {
    font-size: 18px !important;
  }
}
.p-font-size-20 p {
  font-size: 20px !important;
}

@media (max-width: 1024px) {
  .lg-p-font-size-20 p {
    font-size: 20px !important;
  }
}
@media (max-width: 768px) {
  .md-p-font-size-20.md-p-font-size-20 p {
    font-size: 20px !important;
  }
}
@media (max-width: 576px) {
  .sm-p-font-size-20.sm-p-font-size-20.sm-p-font-size-20 p {
    font-size: 20px !important;
  }
}
.p-font-size-24 p {
  font-size: 24px !important;
}

@media (max-width: 1024px) {
  .lg-p-font-size-24 p {
    font-size: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-p-font-size-24.md-p-font-size-24 p {
    font-size: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-p-font-size-24.sm-p-font-size-24.sm-p-font-size-24 p {
    font-size: 24px !important;
  }
}
.p-font-size-28 p {
  font-size: 28px !important;
}

@media (max-width: 1024px) {
  .lg-p-font-size-28 p {
    font-size: 28px !important;
  }
}
@media (max-width: 768px) {
  .md-p-font-size-28.md-p-font-size-28 p {
    font-size: 28px !important;
  }
}
@media (max-width: 576px) {
  .sm-p-font-size-28.sm-p-font-size-28.sm-p-font-size-28 p {
    font-size: 28px !important;
  }
}
.p-font-size-32 p {
  font-size: 32px !important;
}

@media (max-width: 1024px) {
  .lg-p-font-size-32 p {
    font-size: 32px !important;
  }
}
@media (max-width: 768px) {
  .md-p-font-size-32.md-p-font-size-32 p {
    font-size: 32px !important;
  }
}
@media (max-width: 576px) {
  .sm-p-font-size-32.sm-p-font-size-32.sm-p-font-size-32 p {
    font-size: 32px !important;
  }
}
.p-font-size-36 p {
  font-size: 36px !important;
}

@media (max-width: 1024px) {
  .lg-p-font-size-36 p {
    font-size: 36px !important;
  }
}
@media (max-width: 768px) {
  .md-p-font-size-36.md-p-font-size-36 p {
    font-size: 36px !important;
  }
}
@media (max-width: 576px) {
  .sm-p-font-size-36.sm-p-font-size-36.sm-p-font-size-36 p {
    font-size: 36px !important;
  }
}
.p-font-size-40 p {
  font-size: 40px !important;
}

@media (max-width: 1024px) {
  .lg-p-font-size-40 p {
    font-size: 40px !important;
  }
}
@media (max-width: 768px) {
  .md-p-font-size-40.md-p-font-size-40 p {
    font-size: 40px !important;
  }
}
@media (max-width: 576px) {
  .sm-p-font-size-40.sm-p-font-size-40.sm-p-font-size-40 p {
    font-size: 40px !important;
  }
}
.p-font-size-48 p {
  font-size: 48px !important;
}

@media (max-width: 1024px) {
  .lg-p-font-size-48 p {
    font-size: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-p-font-size-48.md-p-font-size-48 p {
    font-size: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-p-font-size-48.sm-p-font-size-48.sm-p-font-size-48 p {
    font-size: 48px !important;
  }
}
/* Line-height utilities (px) — with lg/md/sm responsive variants */
.line-height-16 {
  line-height: 16px !important;
}

@media (max-width: 1024px) {
  .lg-line-height-16 {
    line-height: 16px !important;
  }
}
@media (max-width: 768px) {
  .md-line-height-16.md-line-height-16 {
    line-height: 16px !important;
  }
}
@media (max-width: 576px) {
  .sm-line-height-16.sm-line-height-16.sm-line-height-16 {
    line-height: 16px !important;
  }
}
.line-height-18 {
  line-height: 18px !important;
}

@media (max-width: 1024px) {
  .lg-line-height-18 {
    line-height: 18px !important;
  }
}
@media (max-width: 768px) {
  .md-line-height-18.md-line-height-18 {
    line-height: 18px !important;
  }
}
@media (max-width: 576px) {
  .sm-line-height-18.sm-line-height-18.sm-line-height-18 {
    line-height: 18px !important;
  }
}
.line-height-20 {
  line-height: 20px !important;
}

@media (max-width: 1024px) {
  .lg-line-height-20 {
    line-height: 20px !important;
  }
}
@media (max-width: 768px) {
  .md-line-height-20.md-line-height-20 {
    line-height: 20px !important;
  }
}
@media (max-width: 576px) {
  .sm-line-height-20.sm-line-height-20.sm-line-height-20 {
    line-height: 20px !important;
  }
}
.line-height-22 {
  line-height: 22px !important;
}

@media (max-width: 1024px) {
  .lg-line-height-22 {
    line-height: 22px !important;
  }
}
@media (max-width: 768px) {
  .md-line-height-22.md-line-height-22 {
    line-height: 22px !important;
  }
}
@media (max-width: 576px) {
  .sm-line-height-22.sm-line-height-22.sm-line-height-22 {
    line-height: 22px !important;
  }
}
.line-height-24 {
  line-height: 24px !important;
}

@media (max-width: 1024px) {
  .lg-line-height-24 {
    line-height: 24px !important;
  }
}
@media (max-width: 768px) {
  .md-line-height-24.md-line-height-24 {
    line-height: 24px !important;
  }
}
@media (max-width: 576px) {
  .sm-line-height-24.sm-line-height-24.sm-line-height-24 {
    line-height: 24px !important;
  }
}
.line-height-28 {
  line-height: 28px !important;
}

@media (max-width: 1024px) {
  .lg-line-height-28 {
    line-height: 28px !important;
  }
}
@media (max-width: 768px) {
  .md-line-height-28.md-line-height-28 {
    line-height: 28px !important;
  }
}
@media (max-width: 576px) {
  .sm-line-height-28.sm-line-height-28.sm-line-height-28 {
    line-height: 28px !important;
  }
}
.line-height-30 {
  line-height: 30px !important;
}

@media (max-width: 1024px) {
  .lg-line-height-30 {
    line-height: 30px !important;
  }
}
@media (max-width: 768px) {
  .md-line-height-30.md-line-height-30 {
    line-height: 30px !important;
  }
}
@media (max-width: 576px) {
  .sm-line-height-30.sm-line-height-30.sm-line-height-30 {
    line-height: 30px !important;
  }
}
.line-height-32 {
  line-height: 32px !important;
}

@media (max-width: 1024px) {
  .lg-line-height-32 {
    line-height: 32px !important;
  }
}
@media (max-width: 768px) {
  .md-line-height-32.md-line-height-32 {
    line-height: 32px !important;
  }
}
@media (max-width: 576px) {
  .sm-line-height-32.sm-line-height-32.sm-line-height-32 {
    line-height: 32px !important;
  }
}
.line-height-40 {
  line-height: 40px !important;
}

@media (max-width: 1024px) {
  .lg-line-height-40 {
    line-height: 40px !important;
  }
}
@media (max-width: 768px) {
  .md-line-height-40.md-line-height-40 {
    line-height: 40px !important;
  }
}
@media (max-width: 576px) {
  .sm-line-height-40.sm-line-height-40.sm-line-height-40 {
    line-height: 40px !important;
  }
}
.line-height-48 {
  line-height: 48px !important;
}

@media (max-width: 1024px) {
  .lg-line-height-48 {
    line-height: 48px !important;
  }
}
@media (max-width: 768px) {
  .md-line-height-48.md-line-height-48 {
    line-height: 48px !important;
  }
}
@media (max-width: 576px) {
  .sm-line-height-48.sm-line-height-48.sm-line-height-48 {
    line-height: 48px !important;
  }
}
.line-height-56 {
  line-height: 56px !important;
}

@media (max-width: 1024px) {
  .lg-line-height-56 {
    line-height: 56px !important;
  }
}
@media (max-width: 768px) {
  .md-line-height-56.md-line-height-56 {
    line-height: 56px !important;
  }
}
@media (max-width: 576px) {
  .sm-line-height-56.sm-line-height-56.sm-line-height-56 {
    line-height: 56px !important;
  }
}
/* Composite heading utilities — typical heading-scale defaults
   (size + weight + line-height). Pair with .text-uppercase or a
   color utility for further variation. */
.font-h1 {
  font-size: 48px !important;
  font-weight: 700 !important;
  line-height: 56px !important;
}

.font-h2 {
  font-size: 36px !important;
  font-weight: 700 !important;
  line-height: 40px !important;
}

.font-h3 {
  font-size: 24px !important;
  font-weight: 700 !important;
  line-height: 30px !important;
}

.font-h4 {
  font-size: 20px !important;
  font-weight: 700 !important;
  line-height: 24px !important;
}

.rich-h1-20 h1 {
  font-size: 20px !important;
  line-height: 24px !important;
}

.rich-h1-22 h1 {
  font-size: 22px !important;
  line-height: 26px !important;
}

.rich-h1-24 h1 {
  font-size: 24px !important;
  line-height: 26px !important;
}

.rich-h1-28 h1 {
  font-size: 28px !important;
  line-height: 32px !important;
}

.rich-h1-32 h1 {
  font-size: 32px !important;
  line-height: 36px !important;
}

.rich-h1-36 h1 {
  font-size: 36px !important;
  line-height: 40px !important;
}

.rich-h1-40 h1 {
  font-size: 40px !important;
  line-height: 44px !important;
}

.rich-h1-48 h1 {
  font-size: 48px !important;
  line-height: 52px !important;
}

.rich-h1-56 h1 {
  font-size: 56px !important;
  line-height: 60px !important;
}

.rich-h1-64 h1 {
  font-size: 64px !important;
  line-height: 68px !important;
}

.rich-h1-72 h1 {
  font-size: 72px !important;
  line-height: 76px !important;
}

.rich-h1-85 h1 {
  font-size: 85px !important;
  line-height: 90px !important;
}

@media (max-width: 1024px) {
  .lg-rich-h1-20 h1 {
    font-size: 20px !important;
    line-height: 24px !important;
  }
  .lg-rich-h1-22 h1 {
    font-size: 22px !important;
    line-height: 26px !important;
  }
  .lg-rich-h1-24 h1 {
    font-size: 24px !important;
    line-height: 26px !important;
  }
  .lg-rich-h1-28 h1 {
    font-size: 28px !important;
    line-height: 32px !important;
  }
  .lg-rich-h1-32 h1 {
    font-size: 32px !important;
    line-height: 36px !important;
  }
  .lg-rich-h1-36 h1 {
    font-size: 36px !important;
    line-height: 40px !important;
  }
  .lg-rich-h1-40 h1 {
    font-size: 40px !important;
    line-height: 44px !important;
  }
  .lg-rich-h1-48 h1 {
    font-size: 48px !important;
    line-height: 52px !important;
  }
  .lg-rich-h1-56 h1 {
    font-size: 56px !important;
    line-height: 60px !important;
  }
  .lg-rich-h1-64 h1 {
    font-size: 64px !important;
    line-height: 68px !important;
  }
  .lg-rich-h1-72 h1 {
    font-size: 72px !important;
    line-height: 76px !important;
  }
  .lg-rich-h1-85 h1 {
    font-size: 85px !important;
    line-height: 90px !important;
  }
}
@media (max-width: 768px) {
  .md-rich-h1-20.md-rich-h1-20 h1 {
    font-size: 20px !important;
    line-height: 24px !important;
  }
  .md-rich-h1-22.md-rich-h1-22 h1 {
    font-size: 22px !important;
    line-height: 26px !important;
  }
  .md-rich-h1-24.md-rich-h1-24 h1 {
    font-size: 24px !important;
    line-height: 26px !important;
  }
  .md-rich-h1-28.md-rich-h1-28 h1 {
    font-size: 28px !important;
    line-height: 32px !important;
  }
  .md-rich-h1-32.md-rich-h1-32 h1 {
    font-size: 32px !important;
    line-height: 36px !important;
  }
  .md-rich-h1-36.md-rich-h1-36 h1 {
    font-size: 36px !important;
    line-height: 40px !important;
  }
  .md-rich-h1-40.md-rich-h1-40 h1 {
    font-size: 40px !important;
    line-height: 44px !important;
  }
  .md-rich-h1-48.md-rich-h1-48 h1 {
    font-size: 48px !important;
    line-height: 52px !important;
  }
  .md-rich-h1-56.md-rich-h1-56 h1 {
    font-size: 56px !important;
    line-height: 60px !important;
  }
  .md-rich-h1-64.md-rich-h1-64 h1 {
    font-size: 64px !important;
    line-height: 68px !important;
  }
  .md-rich-h1-72.md-rich-h1-72 h1 {
    font-size: 72px !important;
    line-height: 76px !important;
  }
  .md-rich-h1-85.md-rich-h1-85 h1 {
    font-size: 85px !important;
    line-height: 90px !important;
  }
}
@media (max-width: 576px) {
  .sm-rich-h1-20.sm-rich-h1-20.sm-rich-h1-20 h1 {
    font-size: 20px !important;
    line-height: 24px !important;
  }
  .sm-rich-h1-22.sm-rich-h1-22.sm-rich-h1-22 h1 {
    font-size: 22px !important;
    line-height: 26px !important;
  }
  .sm-rich-h1-24.sm-rich-h1-24.sm-rich-h1-24 h1 {
    font-size: 24px !important;
    line-height: 26px !important;
  }
  .sm-rich-h1-28.sm-rich-h1-28.sm-rich-h1-28 h1 {
    font-size: 28px !important;
    line-height: 32px !important;
  }
  .sm-rich-h1-32.sm-rich-h1-32.sm-rich-h1-32 h1 {
    font-size: 32px !important;
    line-height: 36px !important;
  }
  .sm-rich-h1-36.sm-rich-h1-36.sm-rich-h1-36 h1 {
    font-size: 36px !important;
    line-height: 40px !important;
  }
  .sm-rich-h1-40.sm-rich-h1-40.sm-rich-h1-40 h1 {
    font-size: 40px !important;
    line-height: 44px !important;
  }
  .sm-rich-h1-48.sm-rich-h1-48.sm-rich-h1-48 h1 {
    font-size: 48px !important;
    line-height: 52px !important;
  }
  .sm-rich-h1-56.sm-rich-h1-56.sm-rich-h1-56 h1 {
    font-size: 56px !important;
    line-height: 60px !important;
  }
  .sm-rich-h1-64.sm-rich-h1-64.sm-rich-h1-64 h1 {
    font-size: 64px !important;
    line-height: 68px !important;
  }
  .sm-rich-h1-72.sm-rich-h1-72.sm-rich-h1-72 h1 {
    font-size: 72px !important;
    line-height: 76px !important;
  }
  .sm-rich-h1-85.sm-rich-h1-85.sm-rich-h1-85 h1 {
    font-size: 85px !important;
    line-height: 90px !important;
  }
}
.text-center {
  text-align: center !important;
}

.text-left {
  text-align: left !important;
}

.text-right {
  text-align: right !important;
}

.text-uppercase {
  text-transform: uppercase !important;
}

.text-underline {
  text-decoration: underline !important;
}

.text-no-underline {
  text-decoration: none !important;
}

/* Responsive text-align utilities — repeated class names give the
   smaller breakpoints higher specificity so they override the larger. */
@media (max-width: 1024px) {
  .lg-text-center {
    text-align: center !important;
  }
  .lg-text-left {
    text-align: left !important;
  }
  .lg-text-right {
    text-align: right !important;
  }
}
@media (max-width: 768px) {
  .md-text-center.md-text-center {
    text-align: center !important;
  }
  .md-text-left.md-text-left {
    text-align: left !important;
  }
  .md-text-right.md-text-right {
    text-align: right !important;
  }
}
@media (max-width: 576px) {
  .sm-text-center.sm-text-center.sm-text-center {
    text-align: center !important;
  }
  .sm-text-left.sm-text-left.sm-text-left {
    text-align: left !important;
  }
  .sm-text-right.sm-text-right.sm-text-right {
    text-align: right !important;
  }
}
.small-letter-spacing {
  letter-spacing: -3px;
}

.font-size-1em {
  font-size: 1em;
}

.font-size-2em {
  font-size: 2em;
}

.font-size-3em {
  font-size: 3em;
}

.margin-bottom-none {
  margin-bottom: 0;
}

/* * ============= Block - Main  ============= */
.block--main {
  position: relative;
}

.block--main.has-bg:after {
  content: "";
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-image: var(--bg-url);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  opacity: 0.07;
  z-index: 0;
  pointer-events: none;
}

/* * ============ Block - Image ============ */
.block--image {
  text-align: center;
  margin: 3rem 0;
}

.block--image .standalone-image {
  display: flex;
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

.block--image caption {
  margin-top: 1rem;
  font-size: 0.9rem;
  color: #666;
  font-style: italic;
}

/* * ============ Block - Image Grid ============ */
.block--image-grid__wrapper {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
  justify-content: center;
}

.block--image-grid__item {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* Make the anchor act like a vertical card */
.block--image-grid__link {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  text-decoration: none;
  color: inherit;
  gap: 0.5rem;
}

/* Lock image box to configured pixel size regardless of caption width */
.block--image-grid__media img,
.block--image-grid__media picture,
.block--image-grid__media .standalone-image {
  width: var(--grid-img-w);
  height: var(--grid-img-h);
  object-fit: contain; /* pairs fine with your 'stretch' mode */
  display: block;
  margin: 0 auto;
}

/* Label style */
.block--image-grid__caption {
  text-align: center;
  margin-top: 0.5rem;
  font-weight: 600;
  line-height: 1.2;
}

/* * ============ Block - Video ============ */
.block--video {
  text-align: center;
  margin: 3rem 0;
}

.block--video .standalone-video {
  width: 100%;
  height: auto;
  max-width: 100%;
  display: block;
  margin-inline: auto;
}

/* * ===== Video Embed ===== */
.block--video-embed__wrapper {
  margin: auto;
}

.video-embed__ratio {
  position: relative;
  width: 100%;
  aspect-ratio: 16/9;
  overflow: hidden;
  border-radius: 8px;
}

.video-embed__iframe,
.video-embed__poster,
.video-embed__thumb {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.video-embed__thumb {
  object-fit: cover;
  display: block;
}

.video-embed__poster {
  cursor: pointer;
}

.video-embed__play {
  position: absolute;
  inset: 0;
  margin: auto;
  width: 68px;
  height: 68px;
  border-radius: 50%;
  border: 0;
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
  font-size: 28px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.video-embed__heading {
  padding-bottom: 12px;
}

.video-embed__description {
  padding-top: 12px;
}

/* Aspect-ratio utilities */
.ar-16-9 {
  aspect-ratio: 16/9;
}

.ar-4-3 {
  aspect-ratio: 4/3;
}

.ar-1-1 {
  aspect-ratio: 1/1;
}

.ar-9-16 {
  aspect-ratio: 9/16;
} /* vertical */
@supports not (aspect-ratio: 1/1) {
  .video-embed__ratio {
    padding-bottom: 56.25%;
  }
  .ar-4-3 {
    padding-bottom: 75%;
  }
  .ar-1-1 {
    padding-bottom: 100%;
  }
  .ar-9-16 {
    padding-bottom: 177.78%;
  }
}
/* * ============ Block - Quote with Image ============ */
.basic-image-block {
  position: relative;
  overflow: hidden;
  min-height: 500px;
}

.basic-image-block__picture {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.basic-image-block__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.basic-image-block__content {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  max-width: 1200px;
  z-index: 1;
  color: white;
  line-height: 1.3;
  padding: 0 1rem;
  text-align: center;
}

.basic-image-block__content h2 {
  font-size: 3rem;
  font-weight: 700;
  margin-bottom: 1rem;
}

.basic-image-block__content p {
  font-size: 1.5rem;
  margin-bottom: 0.75rem;
}

/* Responsive adjustments */
@media (max-width: 768px) {
  .basic-image-block {
    min-height: 400px;
  }
  .basic-image-block__content {
    padding: 0 1.5rem;
  }
  .basic-image-block__content h2 {
    font-size: 2rem;
  }
  .basic-image-block__content p {
    font-size: 1.2rem;
  }
}
/* * ============ Block - Column - Multi ============ */
.block--column-multi {
  display: grid;
  gap: 2rem;
}

/* Column layout variations */
.block--column-multi.block--layout-1fr {
  grid-template-columns: 1fr;
}

/* ============ Block - Accordion ============ */
.block--accordion__heading {
  /* Typography intentionally not set — drive via customCssClassesHeading. */
  margin: 0 0 16px;
}

.block--accordion__wrapper {
  display: flex;
  flex-direction: column;
}

.block--accordion__item {
  border-bottom: 1px solid #e4e4e4;
  scroll-margin-top: calc(var(--header-h, 0px) + 1rem);
}

.block--accordion__question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 12px 0;
  cursor: pointer;
  list-style: none;
  user-select: none;
}
.block--accordion__question::-webkit-details-marker {
  display: none;
}

.block--accordion__marker {
  position: relative;
  width: 14px;
  height: 14px;
  flex-shrink: 0;
}
.block--accordion__marker::before, .block--accordion__marker::after {
  content: "";
  position: absolute;
  background: currentColor;
  transition: transform 0.22s ease, opacity 0.22s ease;
}
.block--accordion__marker::before {
  top: 50%;
  left: 0;
  right: 0;
  height: 2px;
  transform: translateY(-50%);
}
.block--accordion__marker::after {
  top: 0;
  bottom: 0;
  left: 50%;
  width: 2px;
  transform: translateX(-50%);
}

.block--accordion__item[open] .block--accordion__marker::after {
  transform: translateX(-50%) scaleY(0);
}

.block--accordion__answer {
  overflow: hidden;
  transition: height 0.3s ease;
}

.block--accordion__answer-inner {
  padding: 0 0 16px;
}

/* ============ Block - Contact List ============ */
.block--contact-list__heading {
  /* Typography intentionally not set — drive via customCssClassesHeading. */
  margin: 0 0 16px;
}

.block--contact-list__wrapper {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.block--contact-list__card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  padding: 20px 24px;
  background: #f3f3f3;
  border-radius: 8px;
}

.block--contact-list__content {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0; /* allow flex shrink so long URLs don't push button off-row */
}

.block--contact-list__name {
  margin: 0 0 6px;
  font-size: 16px;
  font-weight: 700;
  line-height: 22px;
}

.block--contact-list__row {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 14px;
  line-height: 20px;
  color: inherit;
  text-decoration: none;
}

.block--contact-list__row:hover .block--contact-list__row-text {
  text-decoration: underline;
}

.block--contact-list__icon {
  flex-shrink: 0;
}

.block--contact-list__button {
  flex-shrink: 0;
  /* Visual styling intentionally not set — drive via customCssClassesButton
     (e.g. `button-gyford-blue min-width-150 text-center`). */
}

/* Below the sm breakpoint (576px), stack the card vertically: name + rows
   on top, button centered below — instead of the horizontal text-left /
   button-right layout that needs more horizontal room. */
@media (max-width: 576px) {
  .block--contact-list__card {
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
  }
  .block--contact-list__button {
    align-self: center;
  }
}
/* ============ Block - Card Grid ============ */
.block--card-grid__heading {
  /* Typography is intentionally not set — pass utility classes
     (e.g. font-h2 text-uppercase text-gyford-ocean-blue) via the
     block's customCssClasses, or override via gyford CSS. */
  margin: 0 0 16px;
}

.block--card-grid__wrapper {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 40px;
}

.block--card-grid__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.15);
  padding: 24px 16px;
  text-decoration: none;
  color: inherit;
  transition: transform 0.22s ease, box-shadow 0.22s ease;
}
.block--card-grid__item.is-link:hover {
  box-shadow: 0 4px 16px 0 rgba(0, 0, 0, 0.18);
}
.block--card-grid__item .block--card-grid__title,
.block--card-grid__item .block--card-grid__body {
  transition: color 0.22s ease;
}

/* Image wrappers are always centered flex containers (so the
   icon sits centered whether or not a hover image is present). */
.block--card-grid__media-default,
.block--card-grid__media-hover {
  display: flex;
  align-items: center;
  justify-content: center;
}

/* Hover image swap */
.block--card-grid__media.has-hover {
  position: relative;
}
.block--card-grid__media.has-hover .block--card-grid__media-default,
.block--card-grid__media.has-hover .block--card-grid__media-hover {
  transition: opacity 0.22s ease;
}
.block--card-grid__media.has-hover .block--card-grid__media-hover {
  position: absolute;
  inset: 0;
  opacity: 0;
  pointer-events: none;
}

.block--card-grid__item:hover .block--card-grid__media.has-hover .block--card-grid__media-default {
  opacity: 0;
}
.block--card-grid__item:hover .block--card-grid__media.has-hover .block--card-grid__media-hover {
  opacity: 1;
}

.block--card-grid__media {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: 16px;
  background: #333; /* Neutral default; sites override with brand color. */
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -4px rgba(0, 0, 0, 0.1);
  margin-bottom: 16px;
}
.block--card-grid__media img {
  max-width: 60%;
  max-height: 60%;
  object-fit: contain;
}

.block--card-grid__title {
  text-align: center;
  font-size: 20px;
  font-weight: 700;
  line-height: 30px;
  text-transform: uppercase;
  margin: 0 0 8px;
}

.block--card-grid__body {
  text-align: center;
  font-size: 16px;
  font-weight: 400;
  line-height: 22px;
  margin: 0;
}

@media (max-width: 1024px) {
  .block--card-grid__wrapper {
    grid-template-columns: repeat(2, 1fr);
  }
}
@media (max-width: 640px) {
  .block--card-grid__wrapper {
    grid-template-columns: 1fr;
  }
}
/* Default card grid: flex, 4 per row. Each card's width is derived from the
   row (a quarter minus the gaps between cards), not from its content, so the
   cards stay uniform and the horizontal gap equals the vertical row gap.
   flex-grow 0 keeps every card that width — a partial last row stays the
   same size and centers (justify-content: center) rather than stretching.
   Steps to 2-up, then 1-up. --card-gap drives both the gap and the width
   math, so change it in one place. The stack/horizontal variants keep their
   own layouts (this is scoped to neither). */
.block--card-grid:not(.card-grid--stack):not(.card-grid--horizontal) .block--card-grid__wrapper {
  --card-gap: 40px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--card-gap);
}
.block--card-grid:not(.card-grid--stack):not(.card-grid--horizontal) .block--card-grid__item {
  box-sizing: border-box;
  flex: 0 1 calc((100% - 3 * var(--card-gap)) / 4);
}
@media (max-width: 1024px) {
  .block--card-grid:not(.card-grid--stack):not(.card-grid--horizontal) .block--card-grid__item {
    flex-basis: calc((100% - var(--card-gap)) / 2);
  }
}
@media (max-width: 640px) {
  .block--card-grid:not(.card-grid--stack):not(.card-grid--horizontal) .block--card-grid__item {
    flex-basis: 100%;
  }
}

/* Stack variant — vertically-stacked cards (one per row, full width).
   Apply `card-grid--stack` to the block's customCssClasses. The wrapper
   gap defaults to 12px; override via gap-* utilities on customCssClassesWrapper. */
.block--card-grid.card-grid--stack .block--card-grid__wrapper {
  display: flex;
  flex-direction: column;
  grid-template-columns: none;
  gap: 12px;
}

/* Horizontal variant — list-style layout for download lists, etc.
   Apply `card-grid--horizontal` to the block's customCssClasses. */
.block--card-grid.card-grid--horizontal .block--card-grid__wrapper {
  grid-template-columns: 1fr;
  gap: 12px;
}
.block--card-grid.card-grid--horizontal .block--card-grid__item {
  flex-direction: row;
  align-items: center;
  justify-content: flex-start;
  padding: 12px 16px;
  text-align: left;
  background: #f3f3f3;
  box-shadow: none;
  border-radius: 8px;
  gap: 16px;
}
.block--card-grid.card-grid--horizontal .block--card-grid__media {
  width: 32px;
  height: 32px;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  margin: 0;
  flex-shrink: 0;
  transition: background 0.22s ease;
}
.block--card-grid.card-grid--horizontal .block--card-grid__media img {
  max-width: 100%;
  max-height: 100%;
}
.block--card-grid.card-grid--horizontal .block--card-grid__title {
  text-align: left;
  font-size: 14px;
  line-height: 18px;
  text-transform: none;
  margin: 0 0 2px;
  color: inherit;
}
.block--card-grid.card-grid--horizontal .block--card-grid__body {
  text-align: left;
  font-size: 12px;
  line-height: 16px;
  margin: 0;
}

.block--column-multi.block--layout-1fr-1fr {
  grid-template-columns: 1fr 1fr;
}

.block--column-multi.block--layout-2fr-1fr {
  grid-template-columns: 2fr 1fr;
}

.block--column-multi.block--layout-1fr-2fr {
  grid-template-columns: 1fr 2fr;
}

.block--column-multi.block--layout-3fr-2fr {
  grid-template-columns: 3fr 2fr;
}

.block--column-multi.block--layout-2fr-3fr {
  grid-template-columns: 2fr 3fr;
}

.block--column-multi.block--layout-1fr-1fr-1fr {
  grid-template-columns: 1fr 1fr 1fr;
}

.block--column-multi.block--layout-1fr-2fr-1fr {
  grid-template-columns: 1fr 2fr 1fr;
}

.block--column-multi.block--layout-1fr-1fr-stacked {
  grid-template-columns: 1fr 1fr;
  grid-template-rows: 1fr 1fr;
}
.block--column-multi.block--layout-1fr-1fr-stacked .column:nth-child(1) {
  grid-row: 1/3; /* Span both rows */
}
.block--column-multi.block--layout-1fr-1fr-stacked .column:nth-child(2) {
  grid-row: 1;
}
.block--column-multi.block--layout-1fr-1fr-stacked .column:nth-child(3) {
  grid-row: 2;
}

/* Column dividers */
.block--column-multi.block--divider-line .column:not(:last-child) {
  border-right: 1px solid #ddd;
  padding-right: 2rem;
}

.block--column-multi.block--divider-dotted .column:not(:last-child) {
  border-right: 1px dotted #999;
  padding-right: 2rem;
}

.block--column-multi .column p {
  width: auto !important;
  max-width: none !important;
}

/* Responsive Design */
@media (max-width: 768px) {
  /* Stack columns on mobile */
  .block--column-multi {
    grid-template-columns: 1fr !important;
    grid-template-rows: auto !important;
    gap: 1.5rem;
  }
  .block--column-multi.block--layout-1fr-1fr-stacked .column {
    grid-row: auto !important;
  }
  /* Rotate dividers on mobile — border-right (between side-by-side cols)
     becomes border-bottom (between stacked rows) so the divider stays
     visible after the column-multi collapses. :not(:last-child) matches
     the desktop selector's specificity so this reset actually wins. */
  .block--column-multi.block--divider-line .column:not(:last-child) {
    border-right: none;
    padding-right: 0;
    border-bottom: 1px solid #ddd;
    padding-bottom: 2rem;
  }
  .block--column-multi.block--divider-dotted .column:not(:last-child) {
    border-right: none;
    padding-right: 0;
    border-bottom: 1px dotted #999;
    padding-bottom: 2rem;
  }
  /* divider-narrow — apply alongside the divider type (set via the
     Divider field) to render the mobile divider as a 75% wide centered
     line via ::after instead of a full-width border. */
  .block--column-multi.divider-narrow .column:not(:last-child) {
    border-bottom: none;
    padding-bottom: 0;
  }
  .block--column-multi.divider-narrow .column:not(:last-child)::after {
    content: "";
    display: block;
    width: 75%;
    margin: 2rem auto 0;
  }
  .block--column-multi.block--divider-line.divider-narrow .column:not(:last-child)::after {
    border-top: 1px solid #ddd;
  }
  .block--column-multi.block--divider-dotted.divider-narrow .column:not(:last-child)::after {
    border-top: 1px dotted #999;
  }
}
h3 {
  display: block !important;
  margin-bottom: 0 !important;
}

/* * ============ Block - Column - Single w/ Image ============ */
.block--column-single-with-image {
  display: grid;
  align-items: stretch;
}

.block--column-single-with-image.block--image-right .image-container {
  order: 2;
}

.block--column-single-with-image.block--image-right .content-container {
  order: 1;
}

.block--column-single-with-image .content-container {
  font-size: 1.1rem;
  line-height: 1.6;
  height: 100%;
}

.block--column-single-with-image .image-container,
.block--column-single-with-image .image-container picture {
  height: 100%;
}

.block--column-single-with-image .image-container picture {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.block--column-single-with-image .image-container img {
  width: 100%;
  height: 100%;
  display: block;
  border-radius: 8px;
  object-fit: cover;
  object-position: center;
}

.block--column-single-with-image .caption {
  margin-top: 0.5rem;
  font-size: 0.9rem;
  color: #666;
  font-style: italic;
}

.block--column-single-with-image .content-container p {
  width: auto !important;
  max-width: none !important;
}

/* Responsive Design */
@media (max-width: 768px) {
  /* Stack columns on mobile */
  .block--column-single-with-image {
    grid-template-columns: 1fr !important;
    gap: 1.5rem;
  }
  .block--column-single-with-image.block--image-right .image-container,
  .block--column-single-with-image.block--image-right .content-container {
    order: unset;
  }
}
/* ============ Block - Hero ============ */
.block--hero {
  position: relative;
  height: calc(100vh - var(--header-h));
  overflow: hidden;
  /* ---- Dots themes (arrows are not themed) ---- */
}
.block--hero.hero--orange .hero-dot {
  background: #5f6c79;
}
.block--hero.hero--orange .hero-dot:hover {
  border-color: rgba(253, 126, 20, 0.8);
  background: rgba(253, 126, 20, 0.25);
}
.block--hero.hero--orange .hero-dot.is-active {
  background: #fc7f10;
  border-color: #fc7f10;
}

/* Slides */
.hero-slide {
  display: none;
  position: relative;
  opacity: 0;
  height: calc(100vh - var(--header-h));
  transition: opacity 0.4s ease-in-out;
}
.hero-slide.is-active {
  display: block;
  opacity: 1;
  overflow: hidden;
}
.hero-slide.is-hidden {
  display: none;
}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce) {
  .hero-slide {
    transition: none;
  }
}
/* Background image layer */
.hero-image {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  z-index: 0;
}
.hero-image img {
  object-fit: cover;
}
.hero-image picture {
  display: block;
  width: 100%;
  height: 100%;
}

/* Opt-in: stretch the hero image to fill the .hero-image container
   (width AND height). Combined with the default object-fit: cover, the
   image scales + crops to cover the slide at any viewport size. Apply
   the class to the Hero block's "Images CSS" field (lands on the
   .hero-image wrapper, affects every slide), or to per-slide "Slide
   Image CSS" (lands directly on the <img>). */
.hero-full-h-w img,
img.hero-full-h-w {
  width: 100%;
  height: 100%;
}

/* Opt-in: make the hero's .slide-text wrapper fill the entire slide AND
   stack its children (rich text + buttons) vertically, centered. Apply
   via the Hero block's "Content Container CSS" field. Overrides the
   default `.slide-text { position: absolute; top: 5%; left: 5%; }`. */
.slide-text.hero-content-fill-center {
  position: absolute;
  inset: 0;
  top: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 5%;
}

/* Mobile: stack hero CTAs vertically with a consistent small gap.
   Scoped to .hero-content-fill-center so only this opt-in pattern gets
   the stacking — other sites' heroes keep their existing button flow. */
@media (max-width: 576px) {
  .hero-content-fill-center .slide-buttons {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding-left: 0;
  }
  .hero-content-fill-center .slide-buttons a {
    margin: 0;
  }
}
@media (min-width: 1920px) {
  .button-pin-right-xxl {
    position: absolute !important;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
  }
  .button-pin-left-xxl {
    position: absolute !important;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
  }
  .xxl-margin-left-5 {
    margin-left: 5% !important;
  }
  .xxl-margin-left-10 {
    margin-left: 10% !important;
  }
  .xxl-margin-left-15 {
    margin-left: 15% !important;
  }
  .xxl-margin-left-20 {
    margin-left: 20% !important;
  }
  .xxl-margin-left-25 {
    margin-left: 25% !important;
  }
  .xxl-margin-left-30 {
    margin-left: 30% !important;
  }
  .xxl-margin-left-33 {
    margin-left: 33% !important;
  }
  .xxl-margin-left-35 {
    margin-left: 35% !important;
  }
  .xxl-margin-left-40 {
    margin-left: 40% !important;
  }
  .xxl-margin-left-45 {
    margin-left: 45% !important;
  }
  .xxl-margin-left-50 {
    margin-left: 50% !important;
  }
  .xxl-margin-left-55 {
    margin-left: 55% !important;
  }
  .xxl-margin-left-60 {
    margin-left: 60% !important;
  }
  .xxl-margin-left-65 {
    margin-left: 65% !important;
  }
  .xxl-margin-left-66 {
    margin-left: 66% !important;
  }
  .xxl-margin-left-70 {
    margin-left: 70% !important;
  }
  .xxl-margin-left-75 {
    margin-left: 75% !important;
  }
  .xxl-margin-left-80 {
    margin-left: 80% !important;
  }
  .xxl-margin-left-85 {
    margin-left: 85% !important;
  }
  .xxl-margin-left-90 {
    margin-left: 90% !important;
  }
  .xxl-margin-left-95 {
    margin-left: 95% !important;
  }
  .xxl-margin-left-100 {
    margin-left: 100% !important;
  }
  .xxl-margin-left-none {
    margin-left: 0 !important;
  }
  .xxl-margin-left-auto {
    margin-left: auto !important;
  }
}
/* Slide content */
.slide-text {
  position: absolute;
  top: 5%;
  left: 5%;
  z-index: 1;
}
.slide-text.mainwrap {
  left: 0;
  right: 0;
  margin: 0 auto;
  padding: 0;
}
.slide-text p {
  margin: 0;
}

.slide-buttons {
  margin-top: 1rem;
}
.slide-buttons a {
  display: inline-block;
  margin-right: 0.5rem;
  text-decoration: none;
}

@media (max-width: 576px) {
  .block--hero .slide-buttons {
    padding-left: 24px;
  }
}
/* * ============= Navigation Arrows (redesigned) ============= */
.hero-arrow {
  --size: 44px;
  --bg: rgba(0, 0, 0, 0.72);
  --bg-hover: rgba(0, 0, 0, 0.88);
  --ring: #fff;
  --icon: #fff;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  inline-size: var(--size);
  block-size: var(--size);
  border: none;
  border-radius: 50%;
  background: var(--bg);
  cursor: pointer;
  z-index: 10;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.25s ease, opacity 0.25s ease;
  padding: 0;
  /* shaft (desktop) */
  /* head (triangle, desktop) */
}
.hero-arrow::before, .hero-arrow::after {
  content: "";
  position: absolute;
  pointer-events: none;
  background: none;
}
.hero-arrow::before {
  width: 16px;
  height: 2px;
  background-color: var(--icon);
  border-radius: 2px;
  left: calc(50% - 2px);
  top: 50%;
  transform: translate(-50%, -50%);
}
.hero-arrow::after {
  width: 0;
  height: 0;
  border-top: 6px solid transparent;
  border-bottom: 6px solid transparent;
  border-left: 10px solid var(--icon);
  left: calc(50% + 2px);
  top: 50%;
  transform: translateY(-50%);
}
.hero-arrow:hover {
  background: var(--bg-hover);
}
.hero-arrow:focus-visible {
  outline: 2px solid var(--ring);
  outline-offset: 2px;
}
.hero-arrow--prev {
  left: 20px;
  transform: translateY(-50%) scaleX(-1);
}
.hero-arrow--next {
  right: 20px;
}

/* ===== MD: <768px — use the former "mobile" sizing ===== */
@media (max-width: 768px) {
  .hero-arrow {
    --size: 36px;
  }
  .hero-arrow--prev {
    left: 10px;
  }
  .hero-arrow--next {
    right: 10px;
  }
  .hero-arrow::before {
    width: 12px;
    height: 2px;
    border-radius: 2px;
  }
  .hero-arrow::after {
    border-top: 4px solid transparent;
    border-bottom: 4px solid transparent;
    border-left: 7px solid var(--icon);
  }
}
/* ===== SM: <576px — ~half of desktop size ===== */
@media (max-width: 576px) {
  .hero-arrow {
    --size: 22px;
  }
  .hero-arrow--prev {
    left: 6px;
  }
  .hero-arrow--next {
    right: 6px;
  }
  .hero-arrow::before {
    width: 8px;
    height: 1px;
    border-radius: 1px;
  }
  .hero-arrow::after {
    border-top: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-left: 5px solid var(--icon);
  }
}
/* ================== Dots ================== */
.hero-dots {
  position: absolute;
  left: 50%;
  bottom: 30px;
  transform: translateX(-50%);
  display: flex;
  gap: 12px;
  z-index: 10;
}

.hero-dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.6);
  background: transparent;
  cursor: pointer;
  transition: all 0.25s ease;
}
.hero-dot:hover {
  border-color: rgba(255, 255, 255, 0.8);
  background: rgba(255, 255, 255, 0.3);
}
.hero-dot:focus-visible {
  outline: 2px solid #007cba;
  outline-offset: 2px;
}
.hero-dot.is-active {
  background: rgba(255, 255, 255, 0.9);
  border-color: rgba(255, 255, 255, 0.9);
}

@media (max-width: 576px) {
  .hero-dots {
    bottom: 20px;
  }
  .hero-dot {
    width: 10px;
    height: 10px;
  }
}
/* Screen Reader Only utility */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* * ============ Block - Rich Text ============ */
.block--rich-text p {
  margin-bottom: 0 !important;
}

/* Nested-list marker hierarchy. Browsers default every <ol> to `decimal`
   regardless of nesting depth, which renders three-level lists as "1, 1, 1"
   instead of the conventional "1, a, i". Restore the typographic hierarchy
   for rich-text and column-single bodies. Same for unordered lists
   (disc → circle → square). */
.block--rich-text ol,
.block--column-single ol {
  list-style-type: decimal;
}

.block--rich-text ol ol,
.block--column-single ol ol {
  list-style-type: lower-alpha;
}

.block--rich-text ol ol ol,
.block--column-single ol ol ol {
  list-style-type: lower-roman;
}

.block--rich-text ul,
.block--column-single ul {
  list-style-type: disc;
}

.block--rich-text ul ul,
.block--column-single ul ul {
  list-style-type: circle;
}

.block--rich-text ul ul ul,
.block--column-single ul ul ul {
  list-style-type: square;
}

/* * ============ Block - Buttons ============ */
.block--button__content {
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
}

/* * ============ Block - Slider ============ */
.pb-slider {
  --tile-w: 184px;
  --gap: 32px;
  --center-padding: 120px;
  position: relative;
  overflow: hidden;
}

.pb-slider__track {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: var(--tile-w);
  gap: var(--gap);
  padding: 0 var(--center-padding);
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: none;
  scrollbar-width: none;
}

.pb-slider__track::-webkit-scrollbar {
  display: none;
}

.pb-slider__slide {
  width: var(--tile-w);
  scroll-snap-align: center;
}

.pb-slider__slide picture,
.pb-slider__slide img {
  display: block;
  width: 100%;
  height: auto;
}

.block--slider[class*=height-] .pb-slider,
.block--slider[class*=height-] .pb-slider__track,
.block--slider[class*=height-] .pb-slider__slide {
  height: 100%;
}

.block--slider[class*=height-] .pb-slider__slide picture,
.block--slider[class*=height-] .pb-slider__slide img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.block--slider[class*=height-] .pb-slider__track {
  grid-auto-columns: max-content;
  align-items: center;
}

.block--slider[class*=height-] .pb-slider__slide {
  width: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* In height mode, the image uses HEIGHT as the driver */
.block--slider[class*=height-] .pb-slider__slide picture,
.block--slider[class*=height-] .pb-slider__slide img {
  height: 100%;
  width: auto;
  object-fit: contain;
  display: block;
}

@media (max-width: 1236px) {
  .pb-slider {
    --center-padding: 160px;
    --tile-w: 184px;
  }
}
@media (max-width: 1100px) {
  .pb-slider {
    --center-padding: 120px;
    --tile-w: 184px;
  }
}
@media (max-width: 991px) {
  .pb-slider {
    --center-padding: 60px;
    --tile-w: 160px;
  }
}
@media (max-width: 820px) {
  .pb-slider {
    --center-padding: 90px;
    --tile-w: 160px;
  }
}
@media (max-width: 600px) {
  .pb-slider {
    --center-padding: 140px;
    --tile-w: 140px;
  }
}
@media (max-width: 480px) {
  .pb-slider {
    --center-padding: 90px;
    --tile-w: 140px;
  }
}
@media (max-width: 400px) {
  .pb-slider {
    --center-padding: 55px;
    --tile-w: 120px;
  }
}
@media (max-width: 340px) {
  .pb-slider {
    --center-padding: 45px;
    --tile-w: 110px;
  }
}
/* * ============ Block - Product Preview ============ */
.block--product-preview .product-preview__card {
  display: flex;
  gap: 1.25rem;
  align-items: stretch;
}

.block--product-preview .product-preview__media {
  flex: 0 0 300px;
  max-width: 40vw;
  height: 180px;
}

.block--product-preview .product-preview__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.block--product-preview .product-preview__title {
  margin: 0 0 0.25rem 0;
}

.block--product-preview .product-preview__excerpt {
  line-height: 1.45;
}

@media (max-width: 768px) {
  .block--product-preview .product-preview__card {
    flex-direction: column;
  }
  .block--product-preview .product-preview__media {
    width: 100%;
    max-width: 100%;
    height: 200px;
    max-height: 200px;
  }
}
/* * ============ Block - Product Display ============ */
.block--product-display {
  margin: 3rem 0;
}

.product-display__wrapper {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 1.1rem;
}

@media (max-width: 768px) {
  .product-display__wrapper {
    justify-content: space-around;
  }
}
.product-display__card {
  display: flex;
  flex-direction: column;
  background: #fff;
  width: 175px;
}

.product-display__media {
  position: relative;
  width: 100%;
  height: 225px;
  aspect-ratio: 1/1;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: none;
}

.product-display__media picture,
.product-display__media img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.product-display__image--border {
  border: 1px solid #000;
}

.product-display__image--placeholder {
  width: 100%;
  height: 100%;
  background: repeating-linear-gradient(45deg, #eee, #eee 10px, #e2e2e2 10px, #e2e2e2 20px);
}

.product-display__content {
  padding: 0.25rem;
  height: 75px;
}

.product-display__sku {
  margin: 0 0 0.25rem;
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.2;
}

.product-display__name {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.4;
}

.product-display__media {
  position: relative;
}

.product-display__annotation {
  position: absolute;
  top: 4px;
  left: 6px;
  color: #00aeef;
  font-size: 1.5rem;
  font-weight: bold;
  user-select: none;
  pointer-events: none;
  z-index: 1;
  line-height: 1;
}

/* * ============ Block - Resources List ============ */
.resources-list__wrapper {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

/* * ============ Block - HubSpot Form ============ */
/* === HubSpot form (page-builder) — scoped defaults === */
.block--hubspot-form .hs-form,
.block--hubspot-form .pb-hs.hs-form {
  text-align: left !important;
  width: 100%;
  --pb-hs-gap: .75rem;
  --pb-hs-control-h: 44px;
  --pb-hs-pad-x: .75rem;
}

.block--hubspot-form .hs-form .hs-form-field {
  width: auto !important;
  margin: 0 0 0.75rem !important;
  min-width: 0;
}

/* Labels above fields, left aligned */
.block--hubspot-form .hs-form .hs-form-field > label {
  display: block !important;
  margin: 0 0 0.35rem;
  font-weight: 600;
  text-align: left !important;
}

.block--hubspot-form .hs-form .input {
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

.block--hubspot-form .hs-form input[type=text],
.block--hubspot-form .hs-form input[type=email],
.block--hubspot-form .hs-form input[type=tel],
.block--hubspot-form .hs-form input[type=url],
.block--hubspot-form .hs-form input[type=number],
.block--hubspot-form .hs-form input[type=search],
.block--hubspot-form .hs-form select {
  display: block;
  width: 100% !important;
  max-width: 100% !important;
  box-sizing: border-box;
  border: 1px solid #ccc;
  background: #fff;
  border-radius: 0;
  text-align: left !important;
  height: var(--pb-hs-control-h);
  padding: 0 var(--pb-hs-pad-x);
  line-height: normal;
}

.block--hubspot-form .hs-form textarea {
  display: block;
  box-sizing: border-box;
  border: 1px solid #ccc;
  background: #fff;
  border-radius: 0;
  text-align: left !important;
  min-height: 140px;
  padding: 0.5rem var(--pb-hs-pad-x);
}

.block--hubspot-form .hs-form fieldset.form-columns-2,
.block--hubspot-form .hs-form fieldset.form-columns-3 {
  border: 0;
  margin: 0 0 1rem;
  padding: 0;
  display: grid;
  gap: var(--pb-hs-gap);
}

.block--hubspot-form .hs-form fieldset.form-columns-2 {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.block--hubspot-form .hs-form fieldset.form-columns-3 {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.block--hubspot-form .hs-form fieldset[class^=form-columns-] .hs-form-field {
  margin: 0 !important;
  min-width: 0;
}

.block--hubspot-form .hs-form .inputs-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.block--hubspot-form .hs-form .inputs-list > li {
  display: flex;
  align-items: baseline;
  gap: 0.5rem;
}

.block--hubspot-form .hs-form .actions,
.block--hubspot-form .hs-form .hs-recaptcha,
.block--hubspot-form .hs-form .grecaptcha-badge {
  text-align: left !important;
}

@media (max-width: 640px) {
  .block--hubspot-form .hs-form fieldset.form-columns-2,
  .block--hubspot-form .hs-form fieldset.form-columns-3 {
    grid-template-columns: 1fr;
  }
}
input.hs-button.primary.large {
  height: 30px;
  line-height: 30px !important;
}

.actions {
  display: flex;
  justify-content: center;
}

/* Subtle focus state (inputs/selects/textareas only) */
.block--hubspot-form .hs-form input:not([type=checkbox]):not([type=radio]):focus,
.block--hubspot-form .hs-form select:focus,
.block--hubspot-form .hs-form textarea:focus {
  border-color: var(--rmklightblue, #00aeef);
  box-shadow: 0 0 0 2px rgba(0, 174, 239, 0.2);
  outline: none;
}

/* Error state: only after HubSpot validation adds .error on the field wrapper */
.error {
  border-color: #c62828 !important;
  box-shadow: 0 0 0 2px rgba(198, 40, 40, 0.18);
}

/* Block - Login — neutral base. Sites theme via a modifier class
   passed in Custom CSS Classes (e.g. `block--login--gyford`). */
.block--login {
  display: flex;
  justify-content: center;
  padding: 56px 16px 80px;
}

.block--login__card {
  width: 100%;
  max-width: 460px;
}

.block--login__heading {
  color: #1a1a1a;
  text-align: center;
  font-size: 28px;
  line-height: 1.2;
  font-weight: 700;
  margin: 0 0 24px;
}

.block--login__signed-in {
  background: #f7f8fa;
  border: 1px solid #d0d5da;
  border-radius: 4px;
  padding: 16px;
  margin: 0;
  text-align: center;
  line-height: 1.5;
}

.block--login__signed-in p {
  margin: 0 0 6px;
}

.block--login__signed-in p:last-child {
  margin-bottom: 0;
}

.block--login__signed-in a {
  text-decoration: underline;
}

.block--login__access-denied-message {
  margin: 0 0 8px;
  padding: 8px 12px;
  background: #fff3cd;
  border: 1px solid #f5d585;
  border-radius: 4px;
  color: #6a4f00;
  font-weight: 700;
}

.block--login__form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

.block--login__field {
  position: relative;
}

.block--login__input {
  width: 100%;
  height: 48px;
  padding: 0 16px;
  border: 1px solid #d0d5da;
  border-radius: 4px;
  background: #f7f8fa;
  font-size: 15px;
  color: #1a1a1a;
  outline: none;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
  box-sizing: border-box;
}

.block--login__input:focus {
  border-color: #4a4a4a;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.08);
}

.block--login__input::placeholder {
  color: #8a8f94;
}

.block--login__field--password .block--login__input {
  padding-right: 48px;
}

.block--login__toggle {
  position: absolute;
  top: 50%;
  right: 12px;
  transform: translateY(-50%);
  background: none;
  border: 0;
  padding: 4px;
  cursor: pointer;
  color: #6f7271;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.block--login__toggle:hover {
  color: #1a1a1a;
}

.block--login__eye[hidden] {
  display: none;
}

.block--login__error {
  margin: 4px 0 0;
  color: #c0392b;
  font-size: 14px;
}

.block--login__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 4px 0 8px;
}

.block--login__forgot {
  color: #1a1a1a;
  font-weight: 700;
  text-decoration: none;
}

.block--login__forgot:hover {
  text-decoration: underline;
}

.block--login__remember {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: #6f7271;
  font-size: 14px;
  cursor: pointer;
}

.block--login__remember input[type=checkbox] {
  width: 16px;
  height: 16px;
  accent-color: #1a1a1a;
}

:where(.block--login__submit) {
  background: #1a1a1a;
  color: #ffffff;
  border: 0;
  border-radius: 4px;
  font-weight: 700;
  letter-spacing: 0.5px;
  cursor: pointer;
  transition: background 0.15s ease;
}

:where(.block--login__submit:hover) {
  background: #333333;
}

.block--login__signup {
  text-align: center;
  margin: 8px 0 0;
  color: #6f7271;
  font-size: 15px;
}

.block--login__signup-link {
  color: #1a1a1a;
  font-weight: 700;
  text-decoration: underline;
}

@media (max-width: 576px) {
  .block--login {
    padding: 32px 16px 56px;
  }
  .block--login__heading {
    font-size: 24px;
  }
  /* Forgot Password? + Remember me sit on one row at desktop; on narrow
     viewports let them stack instead of forcing a horizontal overflow. */
  .block--login__row {
    flex-wrap: wrap;
    gap: 8px 12px;
  }
}
/* Extra-narrow phones (~iPhone SE / 360–480 viewports) — shrink the
   section padding so the form card always has breathing room. */
@media (max-width: 480px) {
  .block--login {
    padding: 24px 12px 48px;
  }
  .block--login__card {
    /* Belt-and-braces: never let the card request a width larger than
       the viewport, regardless of any min-width utility the editor may
       have set via Custom CSS Classes - Card. */
    min-width: 0;
    max-width: 100%;
  }
}

/*# sourceMappingURL=shared.css.map */
