/*
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
*/
/* 
    Created on : 29-nov-2019, 11:56:51
    Author     : guido
*/

svg:not(:root) {
    overflow: hidden;
}

/*--------------------------------------------------------------
12.0 Navigation
--------------------------------------------------------------*/
/* harde aanpak .w3-bar */

.w3-bar {
    overflow: visible !important;

}

.navigation-top {
    background: #fff;
    border-bottom: 1px dashed #eee;
    border-top: 1px dashed #eee;
    font-size: 16px;
    font-size: 1rem;
    position: relative;
    min-height: 46px;
}

.navigation-top .wrap {
    max-width: 1000px;
    padding: 0;
}

.navigation-top a {
    color: #222;
    font-weight: 400;
    letter-spacing: 1px;
    -webkit-transition: color 0.2s;
    transition: color 0.2s;
}

.navigation-top .current-menu-item>a,
.navigation-top .current_page_item>a {
    color: #767676;
}

.main-navigation {
    clear: both;
    display: block;
}

.main-navigation ul {

    list-style: none;
    margin: 0;
    padding: 0 1.5em;
    text-align: left;
}

/* Hide the menu on small screens when JavaScript is available.
 * It only works with JavaScript.
 */

.js .main-navigation ul,
.main-navigation .menu-item-has-children>a>.icon,
.main-navigation .page_item_has_children>a>.icon,
.main-navigation ul a>.icon {
    display: none;
}

.main-navigation>div>ul {
    border-top: 1px solid #eee;
    padding: 0.75em 1.695em;
}

.js .main-navigation.toggled-on>div>ul {
    display: block;
}

.main-navigation ul ul {
    padding: 0 0 0 1.5em;
}

.main-navigation ul ul.toggled-on {
    display: block;
}

.main-navigation ul ul a {
    letter-spacing: 0;
    padding: 0.4em 0;
    position: relative;
    text-transform: none;
}

.main-navigation li {
    border-bottom: 1px solid #eee;
    position: relative;
}

.main-navigation li li,
.main-navigation li:last-child {
    border: 0;
}

.main-navigation a {
    display: block;
    padding: 0.5em 0;
    text-decoration: none;
    color: #2c2c2c;

}

.main-navigation a:hover {
    color: #000000;
    border-bottom: none;

}



/* Menu toggle */

.menu-toggle {
    background-color: transparent;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: #222;
    display: none;
    font-size: 14px;
    font-size: 0.875rem;
    font-weight: 800;
    line-height: 1.5;
    margin: 1px auto 2px;
    padding: 1em;
    text-shadow: none;
}

/* Display the menu toggle when JavaScript is available. */

.js .menu-toggle {
    display: block;
}

.main-navigation.toggled-on ul.nav-menu {
    display: block;
}

.menu-toggle:hover,
.menu-toggle:focus {
    background-color: transparent;
    -webkit-box-shadow: none;
    box-shadow: none;
}

.menu-toggle:focus {
    outline: thin solid;
}

.menu-toggle .icon {
    margin-right: 0.5em;
    top: -2px;
}

.toggled-on .menu-toggle .icon-bars,
.menu-toggle .icon-close {
    display: none;
}

.toggled-on .menu-toggle .icon-close {
    display: inline-block;
}

/* Dropdown Toggle */

.dropdown-toggle {
    background-color: transparent;
    border: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    color: #222;
    display: block;
    font-size: 16px;
    right: -0.5em;
    line-height: 1.5;
    margin: 0 auto;
    padding: 0.5em;
    position: absolute;
    text-shadow: none;
    top: 0;
}

.dropdown-toggle:hover,
.dropdown-toggle:focus {
    background: transparent;
}

.dropdown-toggle:focus {
    outline: thin dotted;
}

.dropdown-toggle.toggled-on .icon {
    -ms-transform: rotate(-180deg);
    /* IE 9 */
    -webkit-transform: rotate(-180deg);
    /* Chrome, Safari, Opera */
    transform: rotate(-180deg);
}

/* Scroll down arrow */

.site-header .menu-scroll-down {
    display: none;
}

@media screen and (min-width: 601px) {
    /* Navigation */

    .navigation-top {
        bottom: 0;
        font-size: 14px;
        font-size: 0.875rem;
        left: 0;

        right: 0;
        width: 100%;
        z-index: 3;
    }

    .navigation-top .wrap {
        max-width: 1000px;
        /* The font size is 14px here and we need 50px padding in ems */
        padding: 0.75em 3.4166666666667em;
    }

    .navigation-top nav {
        margin-left: -1.25em;
    }

    .site-navigation-fixed.navigation-top {
        bottom: auto;
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
        width: 100%;
        z-index: 7;
    }

    .admin-bar .site-navigation-fixed.navigation-top {
        top: 32px;
    }

    /* Main Navigation */

    .js .menu-toggle,
    .js .dropdown-toggle {
        display: none;
    }

    .main-navigation {
        width: auto;
    }

    .js .main-navigation ul,
    .js .main-navigation ul ul,
    .js .main-navigation>div>ul {
        display: block;
    }

    .main-navigation ul {
        background: transparent;
        padding: 0;
    }

    .main-navigation>div>ul {
        border: 0;
        margin-bottom: 0;
        padding: 0;
    }

    .main-navigation li {
        border: 0;
        display: inline-block;
        /* background-color: #fff; */

    }

    .main-navigation li li {
        display: block;
    }

    .main-navigation a {
        padding: 8px 16px;
        text-decoration: none !important;
        border-bottom: none;
    }

    .main-navigation ul ul {
        background: #f5fdf8;
        border: 1px dashed #bbb;
        left: -999em;
        padding: 0;
        position: absolute;
        top: 100%;
        z-index: 99999;
    }

    .main-navigation ul li.menu-item-has-children:before,
    .main-navigation ul li.menu-item-has-children:after,
    .main-navigation ul li.page_item_has_children:before,
    .main-navigation ul li.page_item_has_children:after {
        border-style: solid;
        border-width: 0 6px 6px;
        content: "";
        display: none;
        height: 0;
        position: absolute;
        right: 1em;
        bottom: -1px;
        width: 0;
        z-index: 100000;
    }

    .main-navigation ul li.menu-item-has-children.focus:before,
    .main-navigation ul li.menu-item-has-children:hover:before,
    .main-navigation ul li.menu-item-has-children.focus:after,
    .main-navigation ul li.menu-item-has-children:hover:after,
    .main-navigation ul li.page_item_has_children.focus:before,
    .main-navigation ul li.page_item_has_children:hover:before,
    .main-navigation ul li.page_item_has_children.focus:after,
    .main-navigation ul li.page_item_has_children:hover:after {
        display: block;
    }

    .main-navigation ul li.menu-item-has-children:before,
    .main-navigation ul li.page_item_has_children:before {
        border-color: transparent transparent #bbb;
        bottom: 0;
    }

    .main-navigation ul li.menu-item-has-children:after,
    .main-navigation ul li.page_item_has_children:after {
        border-color: transparent transparent #fff;
    }

    .main-navigation ul ul li:hover>ul,
    .main-navigation ul ul li.focus>ul {
        left: 100%;
        right: auto;
        top: 0px;
    }

    .main-navigation ul ul a {
        padding: 0.75em 1.25em;
        width: 16em;
    }

    .main-navigation li li {
        -webkit-transition: background-color 0.2s ease-in-out;
        transition: background-color 0.2s ease-in-out;
    }

    .main-navigation li :hover,
    ,
    .main-navigation li li.focus {
        background: #d8fbe554;

        color: #000000;
    }

    .main-navigation li li:hover {
        background: #b5d5c154;
    }

    .main-navigation li li a {

        background: #e0f1f5bf;
        -webkit-transition: color 0.3s ease-in-out;
        transition: color 0.3s ease-in-out;
    }

    .main-navigation li li.focus>a,
    .main-navigation li li:focus>a,
    .main-navigation li li:hover>a,
    .main-navigation li li a:hover,
    .main-navigation li li a:focus,
    .main-navigation li li.current_page_item a:hover,
    .main-navigation li li.current-menu-item a:hover,
    .main-navigation li li.current_page_item a:focus,
    .main-navigation li li.current-menu-item a:focus {
        color: #000000;
        border: 1px dashed #bbb;
    }

    .main-navigation ul li:hover>ul,
    .main-navigation ul li.focus>ul {
        left: 0.5em;
        right: auto;
    }

    .main-navigation .menu-item-has-children>a>.icon,
    .main-navigation .page_item_has_children>a>.icon {
        display: inline;
        left: 5px;
        position: relative;
        top: -1px;
    }

    .main-navigation ul ul .menu-item-has-children>a>.icon,
    .main-navigation ul ul .page_item_has_children>a>.icon {
        margin-top: -9px;
        left: auto;
        position: absolute;
        right: 1em;
        top: 50%;
        -webkit-transform: rotate(-90deg);
        /* Chrome, Safari, Opera */
        -ms-transform: rotate(-90deg);
        /* IE 9 */
        transform: rotate(-90deg);
    }

    .main-navigation ul ul ul {
        left: -999em;
        margin-top: -1px;
        top: 0;
    }

    .main-navigation ul ul li.menu-item-has-children.focus:before,
    .main-navigation ul ul li.menu-item-has-children:hover:before,
    .main-navigation ul ul li.menu-item-has-children.focus:after,
    .main-navigation ul ul li.menu-item-has-children:hover:after,
    .main-navigation ul ul li.page_item_has_children.focus:before,
    .main-navigation ul ul li.page_item_has_children:hover:before,
    .main-navigation ul ul li.page_item_has_children.focus:after,
    .main-navigation ul ul li.page_item_has_children:hover:after {
        display: none;
    }

    .site-header .site-navigation-fixed .menu-scroll-down {
        display: none;
    }

}

/* SVG Icons base styles */

.icon {
    display: inline-block;
    fill: currentColor;
    height: 1em;
    position: relative;
    /* Align more nicely with capital letters */
    top: -0.0625em;
    vertical-align: middle;
    width: 1em;
}

.main-navigation ul li:hover>ul,
.main-navigation ul li:focus>ul {
    display: block;
    left: 0;
    top: 100%;
}

.nav-drop-item a {
    text-decoration: none;
}


/* MENU DRIE */

.js .main-navigation-drie ul,
.main-navigation-drie .menu-item-has-children>a>.icon,
.main-navigation-drie .page_item_has_children>a>.icon,
.main-navigation-drie ul a>.icon {
    display: none;
}

.main-navigation-drie>div>ul {
    border-top: 1px solid #eee;
    padding: 0.75em 1.695em;
}

.js .main-navigation-drie.toggled-on>div>ul {
    display: block;
}

.main-navigation-drie ul ul {
    padding: 0 0 0 1.5em;
}

.main-navigation-drie ul ul.toggled-on {
    display: block;
}

.main-navigation-drie ul ul a {
    letter-spacing: 0;
    padding: 0.4em 0;
    position: relative;
    text-transform: none;
}

.main-navigation-drie a {
    display: block;
    padding: 0.5em 0;
    text-decoration: none;
    color: #ffffff;

}

.main-navigation-drie a:hover {
    color: #03befc;
    border-bottom: none;

}

@media screen and (min-width: 601px) {

    .main-navigation-drie li {
        border: 0;
        display: inline-block;
        /* background-color: #fff; */
    }

    .main-navigation-drie {
        width: auto;
    }

    .main-navigation-drie {
        clear: both;
        display: block;
    }


    .main-navigation-drie a {
        display: block;
        padding: 0.5em 0;
        text-decoration: none;
        color: #000000;

    }

    .main-navigation-drie a {
        padding: 8px 16px;
        text-decoration: none !important;
        border-bottom: none;
    }

    .main-navigation-drie li li {
        display: block;
    }

    .main-navigation-drie li {
        /* border-bottom: 1px solid #eee; */
        position: relative;
    }
}