<header class="top-header">

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

        <div class="grid-col col-4 col-sm-3">
            <figure class="hamburger-icon" data-href="top-header-hamburger-icon">
                <img src="/img/structure/hamburger-menu.png"/>
            </figure>
        </div>

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

        <div class="grid-col col-4 col-sm-3 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">
                <a href="https://www.facebook.com/ouddorpduin/" target="_blank"><img src="/img/structure/icons/facebook.png" alt="Facebook " class="nav-icon"></a>
            </div>
        </div>

        <img src="/img/structure/tooltip-facebook.png" alt="Ga naar facebookpagina van Ouddorp Duin" class="facebook-tooltip">

    </div>

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

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

</header>