<header class="fixed-header">

    <div class="grid-row row-align-top">

        <div class="grid-col col-4">

            {{-- Hamburger icon to expand menu --}}
            <figure class="hamburger-icon" data-href="fixed-header-hamburger-icon">
                <img src="/img/structure/hamburger-menu.png"/>
            </figure>

            {{-- Cross icon when menu is active --}}
            <figure hidden class="cross-icon" data-href="fixed-header-hamburger-icon">
                <img src="/img/structure/hamburger-menu.png"/>
            </figure>

        </div>

        <div class="grid-col col-4">
            <a href="/">
                <figure class="logo">
                    <img src="/img/structure/logo/logo-ouddorp-duin.png"/>
                </figure>
            </a>
        </div>

        <div class="grid-col col-4 right">
            <div class="menu-icons">
                {{--<img src="/img/structure/icons/search.png" alt="Search" class="nav-icon">--}}
                {{--<img src="/img/structure/icons/language.png" alt="Language" class="nav-icon">--}}
                {{--<img src="/img/structure/icons/login.png" alt="Login" class="nav-icon">--}}
                <img src="/img/structure/icons/share.png" alt="Share" class="nav-icon">
                <img src="/img/structure/icons/facebook.png" alt="Facebook " class="nav-icon">
            </div>
        </div>

    </div>

    @include('layouts.partials.header.mainNavigation')

    <div class="wave">
        <img src="/img/structure/wave.svg" alt="Wave">
    </div>

</header>