/* =========================================================
   BREADCRUMBS: tighten the above/breadcrumb section
   ========================================================= */
#g-above,
#g-above.jl-section,
#g-above > .jl-container,
#g-above .jl-container,
#g-above .g-content,
#g-above .platform-content {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  min-height: 0 !important;
}

.mod-breadcrumbs__wrapper,
.mod-breadcrumbs__wrapper .breadcrumb {
  margin: 0 !important;
  padding-top: 0 !important;
  padding-bottom: 0 !important;
  line-height: 1.1 !important;
}

/* =========================================================
   J2STORE / J2COMMERCE CHECKOUT: mobile layout cleanup
   ========================================================= */
@media (max-width: 768px) {

  .j2store-checkout-layout .radio,
  .j2store-checkout-layout .radio label,
  .j2store-checkout-layout .payment-method,
  .j2store-checkout-layout .shipping-method,
  .j2store-checkout-layout .j2store-payment-method,
  .j2store-checkout-layout .j2store-shipping-method,
  .j2store-checkout-layout .payment-method label,
  .j2store-checkout-layout .shipping-method label,
  .j2store-checkout-layout .j2store-payment-method label,
  .j2store-checkout-layout .j2store-shipping-method label,
  .j2store-checkout-layout #payment-method label,
  .j2store-checkout-layout #payment-methods label,
  .j2store-checkout-layout .j2store-payment-methods label {
    display: block !important;
    float: none !important;
    clear: both !important;
    width: 100% !important;
    white-space: normal !important;
    text-align: left !important;
    margin: 0 0 10px 0 !important;
  }

  .j2store-checkout-layout .j2store-payment-methods ul,
  .j2store-checkout-layout .j2store-payment-methods ol,
  .j2store-checkout-layout #payment-method ul,
  .j2store-checkout-layout #payment-methods ul {
    list-style: none !important;
    padding-left: 0 !important;
    margin-left: 0 !important;
  }

  .j2store-checkout-layout .j2store-payment-methods li,
  .j2store-checkout-layout #payment-method li,
  .j2store-checkout-layout #payment-methods li {
    display: block !important;
    width: 100% !important;
    float: none !important;
    clear: both !important;
    margin: 0 0 12px 0 !important;
  }

  .j2store-checkout-layout .j2store-payment-methods li *,
  .j2store-checkout-layout #payment-method li *,
  .j2store-checkout-layout #payment-methods li * {
    float: none !important;
  }

  .j2store-checkout-layout input[type="radio"] {
    float: left !important;
    vertical-align: top !important;
    margin: 6px 10px 0 0 !important;
  }

  .j2store-checkout-layout .payment-method label img,
  .j2store-checkout-layout .j2store-payment-method label img,
  .j2store-checkout-layout .payment-method img,
  .j2store-checkout-layout .j2store-payment-method img {
    display: block !important;
    float: none !important;
    clear: both !important;
    width: auto !important;
    max-width: 150px !important;
    height: auto !important;
    margin: 8px 0 8px 34px !important;
  }

  .j2store-checkout-layout .payment-method span,
  .j2store-checkout-layout .j2store-payment-method span,
  .j2store-checkout-layout .payment-method small,
  .j2store-checkout-layout .j2store-payment-method small,
  .j2store-checkout-layout .payment-method div,
  .j2store-checkout-layout .j2store-payment-method div {
    display: block !important;
    float: none !important;
    width: auto !important;
    margin-left: 34px !important;
  }

  .j2store-checkout-layout img {
    max-width: 100% !important;
    height: auto !important;
  }

  .j2store-checkout-layout textarea,
  .j2store-checkout-layout input[type="text"],
  .j2store-checkout-layout input[type="email"],
  .j2store-checkout-layout input[type="tel"],
  .j2store-checkout-layout select {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  .j2store-checkout-layout .btn,
  .j2store-checkout-layout button,
  .j2store-checkout-layout input[type="submit"] {
    max-width: 100% !important;
    white-space: normal !important;
  }
}

/* =========================================================
   MOBILE: DISABLE IMAGE HOVER OVERLAYS
   ========================================================= */
@media (max-width: 768px) {

  .jl-content-grid .jl-overlay,
  .jl-content-grid .jl-transition-toggle,
  .jl-content-grid .jl-inline,
  .jl-content-grid [class*="overlay"],
  .jl-content-grid [class*="hover"],
  .jl-content-grid [class*="uk-overlay"],
  .jl-content-grid [class*="jl-overlay"] {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
    transition: none !important;
    pointer-events: none !important;
  }

  .jl-content-grid img,
  .jl-content-grid .jl-image,
  .jl-content-grid .jl-card-image {
    transform: none !important;
    animation: none !important;
    transition: none !important;
  }

  .jl-content-grid a,
  .jl-content-grid .jl-panel,
  .jl-content-grid .jl-card,
  .jl-content-grid .jl-grid-item {
    overflow: visible !important;
  }
}

/* =========================================================
   LOGO + NAVIGATION ALIGNMENT
   ========================================================= */
#jllogo-8015-particle {
  text-align: center !important;
}

#jllogo-8015-particle .jl-logo {
  display: inline-block !important;
  margin-top: 12px !important;
  margin-bottom: 8px !important;
}

#g-navigation {
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}

/* desktop nav centered */
@media (min-width: 769px) {
  #g-navigation .jl-navbar {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    text-align: center !important;
  }

  #g-navigation .jl-navbar-nav {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    gap: 25px !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }

  #g-navigation .jl-navbar-nav > li {
    float: none !important;
  }

  #g-navigation .jl-navbar-center,
  #g-navigation .jl-navbar-center-left,
  #g-navigation .jl-navbar-center-right {
    display: flex !important;
    justify-content: center !important;
    width: 100% !important;
  }
}

/* =========================================================
   MOBILE NAV: LOGO CENTER + HAMBURGER LEFT
   ========================================================= */
@media (max-width: 768px) {

  #jllogo-8015-particle {
    text-align: center !important;
    width: 100% !important;
  }

  #jllogo-8015-particle .jl-logo {
    display: inline-block !important;
    margin: 12px auto 8px auto !important;
  }

  #g-navigation .jl-navbar {
    position: relative !important;
    display: block !important;
    text-align: center !important;
  }

  #g-navigation .jl-navbar-nav {
    display: none !important;
  }

  #g-navigation .jl-navbar-toggle,
  #g-navigation .jl-menu-toggle,
  #g-navigation .uk-navbar-toggle,
  #g-navigation a[class*="toggle"],
  #g-navigation button[class*="toggle"] {
    position: absolute !important;
    left: 10px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 10 !important;
  }

  #g-navigation .g-container,
  #g-navigation .jl-container,
  #g-navigation .g-content {
    text-align: center !important;
  }
}

/* =========================================================
   PAGE BACKGROUND
   ========================================================= */
body,
#g-page-surround {
  background: #f3f3f3 !important;
}

/* =========================================================
   FULL WIDTH HERO BAND
   ========================================================= */
.dark-hero-heading {
  background: #2f2f2f !important;
}

.dark-hero-heading > .g-container,
.dark-hero-heading > .jl-container,
.dark-hero-heading .g-container,
.dark-hero-heading .jl-container,
.dark-hero-heading .g-content,
.dark-hero-heading .platform-content {
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  margin: 0 auto !important;
}

.dark-hero-heading .g-content {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
  padding: 50px 20px !important;
}

.dark-hero-heading .g-content,
.dark-hero-heading .platform-content,
.dark-hero-heading [id*="jlheading"],
.dark-hero-heading .jl-heading,
.dark-hero-heading .jl-heading-content,
.dark-hero-heading .jl-heading-subtitle,
.dark-hero-heading .jl-heading-title {
  text-align: center !important;
  justify-content: center !important;
  align-items: center !important;
}

.dark-hero-heading,
.dark-hero-heading *,
.dark-hero-heading h1,
.dark-hero-heading h2,
.dark-hero-heading h3,
.dark-hero-heading h4,
.dark-hero-heading h5,
.dark-hero-heading h6,
.dark-hero-heading p,
.dark-hero-heading span,
.dark-hero-heading div {
  color: #ffffff !important;
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.dark-hero-heading h1,
.dark-hero-heading h2,
.dark-hero-heading h3,
.dark-hero-heading h4,
.dark-hero-heading h5,
.dark-hero-heading h6,
.dark-hero-heading .jl-heading-title {
  font-size: 28px !important;
  font-weight: 600 !important;
  line-height: 1.3 !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
}

.dark-hero-heading p,
.dark-hero-heading .jl-heading-subtitle {
  margin-top: 10px !important;
  margin-bottom: 0 !important;
}

/* =========================================================
   J2STORE PRODUCT IMAGE: DISABLE JS HOVER ZOOM
   ========================================================= */
.zoomImg {
  display: none !important;
}