@media(max-width:767px){.elementor-11 .elementor-element.elementor-element-0cc159c{margin:47px -66px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;}.elementor-11 .elementor-element.elementor-element-0cc159c.elementor-element{--align-self:center;}}/* Start custom CSS for html, class: .elementor-element-0cc159c *//* =========================================================
   SIZAR — MOBILE MENU BUTTON
   ========================================================= */

.elementor-11 .elementor-element.elementor-element-0cc159c .sizar-menu-trigger {

    border: 0 !important;
    outline: 0 !important;
    background: transparent !important;

    /*
     * Standaardkleur.
     * Hierdoor blijft de knop ook in de Elementor-editor zichtbaar.
     */
    --sizar-menu-icon-color: #ffffff !important;

    display: flex !important;

    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;

    gap: 6px !important;

    cursor: pointer;

    -webkit-tap-highlight-color: transparent;

    position: relative !important;

    z-index: 100000 !important;

    /*
     * POSITIE
     *
     * Voorlopig niets verschuiven.
     * Elementor bepaalt de positie.
     */

    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;

    margin: 0 !important;

    transform: none !important;
}


/* =========================================================
   LIJNEN
   ========================================================= */

.elementor-11 .elementor-element.elementor-element-0cc159c .sizar-menu-trigger span {

    display: block !important;

    width: 24px !important;
    height: 1.5px !important;

    background:
        var(--sizar-menu-icon-color)
        !important;

    transform-origin: center;

    transition:
        transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),
        width 0.35s ease,
        opacity 0.25s ease;
}


/* =========================================================
   OPEN — X
   ========================================================= */

.elementor-11 .elementor-element.elementor-element-0cc159c .sizar-menu-trigger.is-open
span:first-child {

    transform:
        translateY(3.75px)
        rotate(45deg);
}


.elementor-11 .elementor-element.elementor-element-0cc159c .sizar-menu-trigger.is-open
span:last-child {

    transform:
        translateY(-3.75px)
        rotate(-45deg);
}


/* =========================================================
   OPEN — ICOON ZWART
   ========================================================= */

body:has(.sizar-menu-trigger.is-open)
.sizar-menu-trigger {

    --sizar-menu-icon-color: #000000 !important;
}


/* =========================================================
   HOVER
   ========================================================= */

@media (hover: hover) {

    .elementor-11 .elementor-element.elementor-element-0cc159c .sizar-menu-trigger:hover
    span:first-child {

        width: 28px !important;
    }


    .elementor-11 .elementor-element.elementor-element-0cc159c .sizar-menu-trigger:hover
    span:last-child {

        width: 20px !important;
    }

}


/* =========================================================
   LOGO — ZWART BIJ OPEN
   ========================================================= */

body:has(.sizar-menu-trigger.is-open)
.sizar-header-logo,
body:has(.sizar-menu-trigger.is-open)
.sizar-header-logo * {

    position: relative;

    z-index: 100000 !important;

    color: #000000 !important;

    -webkit-text-fill-color: #000000 !important;

    fill: #000000 !important;

    stroke: #000000 !important;
}


/* =========================================================
   ALLEEN MOBIEL
   ========================================================= */

@media (min-width: 768px) {

    .elementor-11 .elementor-element.elementor-element-0cc159c {

        display: none !important;
    }

}/* End custom CSS */