/* ==========================================================================
   Menu / Header
   ========================================================================== */

#sp-menu > .sp-column {
  height: 70%;
}

/* Logo na scroll (sticky header) */
#sp-header.header-sticky .logo-image {
  height: 115px;
  margin-top: -45px;
}

/* Logo achter menubalk na scroll (voorkomt overlap) */
.sticky-wrapper.is-sticky #sp-header #sp-logo {
  overflow: hidden;
}
#sp-header .logo {
  position: relative;
}

/* Mobiel logo */
@media (max-width: 576px) {
  .logo-image-phone {
    height: 94px !important;
    margin-top: -4px;
  }
}

/* ==========================================================================
   Menu-item kleuren (desktop + offcanvas), per positie in de lijst
   ========================================================================== */

.sp-megamenu-parent > li:nth-child(n) > a,
.offcanvas-menu .offcanvas-inner ul > li:nth-child(n) > a {
  color: #8ac53f;
}

.sp-megamenu-parent > li:nth-child(2n) > a,
.offcanvas-menu .offcanvas-inner ul > li:nth-child(2n) > a {
  color: #2ab0ba;
}

.sp-megamenu-parent > li:nth-child(3n) > a,
.offcanvas-menu .offcanvas-inner ul > li:nth-child(3n) > a {
  color: #f1c712;
}

.sp-megamenu-parent > li:nth-child(4n) > a,
.offcanvas-menu .offcanvas-inner ul > li:nth-child(4n) > a {
  color: #ed117d;
}

.sp-megamenu-parent > li:nth-child(5n) > a,
.offcanvas-menu .offcanvas-inner ul > li:nth-child(5n) > a {
  color: #92278f;
}

.sp-megamenu-parent > li:nth-child(6n) > a,
.offcanvas-menu .offcanvas-inner ul > li:nth-child(6n) > a {
  color: #00a651;
}

/* Onderstreping menu-items bij hover/active */
.sp-megamenu-parent > li > a::before,
.sp-megamenu-parent > li > span::before {
  content: '';
  position: absolute;
  display: block;
  bottom: -11px;
  left: 0;
  background-color: #92278f;
  height: 5px;
  width: 0;
  transition: width 0.3s;
}
.sp-megamenu-parent > li:hover > a::before,
.sp-megamenu-parent > li:hover > span::before,
.sp-megamenu-parent > li.active > a::before {
  width: 100%;
}

/* ==========================================================================
   Offcanvas menu
   ========================================================================== */

/* Fix zichtbaarheid offcanvas menu */
.offcanvas {
  visibility: visible;
}

/* Lettergrootte offcanvas menu-items */
.offcanvas-menu .offcanvas-inner .sp-module ul > li a {
  font-size: 22px;
}

/* ==========================================================================
   Overig
   ========================================================================== */

/* Menu footer */
#sppb-addon-e6b0815b-fa5b-4b09-b022-6b44bab73e86 {
  font-size: 19px;
  line-height: 8px;
  margin-top: 9px;
}

/* Twitter/X-icoon vervangen */
.fa-twitter::before {
  content: url("http://www.domeintest.eu/speeltuin/images/x-twitter.svg");
  width: 14px;
  height: 14px;
  display: inline-block;
  vertical-align: -0.125em;
}