<header id="top">
        <span class="overlay animation-part">
        </span>

    <div class="grid-row">
        <section class="content grid-col col-6">
            <span class="content-overlay animation-part"></span>

            <div class="logo-wrapper">

                <a class="logo" href="/">
                    <img class="icon" alt="logo" src="/img/logo-beeldmerk.svg">
                    <img class="full-logo" alt="logo" src="/img/logo.svg">
                </a>

                <div class="logo-text">
                    <a href="/">
                        <img alt="logo text" src="/img/logo-text.svg"/>
                    </a>
                </div>

                <div class="breadcrumb-placeholder">
                    @include('layouts.partials.breadcrumb')
                </div>

            </div>

            <h1>{{$page->translation->name}}</h1>
            <div class="text">
                {{$page->translation->description}}
            </div>

            @if(isset($page->translation->button) && $page->translation->button != '' && $page->code_name != 'webshop')
                <a class="button scroll-to internalLink" href="#block-1">{{$page->translation->button}}</a>
            @elseif($page->code_name == 'webshop')
                <a class="button" href="{{ Config::get('business.webshopLink') }}">@lang('translations.visitWebshop')</a>
            @endif



        </section>

        @yield('sideHeader')

    </div>

    <figure class="header-image">
        @if(isset($page->images) && $page->images->count() != 0)
            <span class="large" style="background-image: url('{{$page->images->first()->large_image_url}}')"></span>
            <span class="medium" style="background-image: url('{{$page->images->first()->medium_image_url}}')"></span>
            <span class="small" style="background-image: url('{{$page->images->first()->small_image_url}}')"></span>
        @endif
    </figure>

</header>