@extends('template.'.config('settings.template').'.content.master')
@section('content')
<style>
    @media only screen and (max-width: 676px) {
        #home-hero {
            background-color: #9699AA;
            background-image: url('{{ asset('template/images/alpaka-hero.jpg') }}');
            background-position: center;
            background-size: cover;
        }
    }
    @media only screen and (min-width: 676px) {
        #home-hero {
            background-color: #9699AA;
            background-image: url('{{ asset('template/images/alpaka-hero.jpg') }}');
            background-position: center;
            background-size: cover;
        }
    }
</style>
<link rel="stylesheet" href="{{ asset('template/css/pages/main.css') }}">
<div class="row">
    <div id="home-hero" class="shadow-lg">
        <div class="d-none d-md-block">
            <br>
            <br>
            <br>
            <br>
            <br>
            <br>
            <br>
            <br>
            <br>
            <br>
            <br>
            <br>
        </div>

        <div id="city_headline">
            <h1><strong>Alpakas</strong> vom <strong>Konradenhof</strong></h1>
            <h2 class="shadow">Gaisheim, Moosbach</h2>
        </div>

        <div class="d-none d-md-block">
            <br>
        </div>
        <div class="d-none d-lg-block">
            <br>
            <br>
            <br>
        </div>
    </div>

    </div> <!-- header_static -->

<section class="mt-2 mb-5">
    <div class="row">
        <div class="col-12">
            <h2 id="latest_jobs" class="mt-5 mb-4">Willkommen auf dem  <strong>Konradenhof</strong>!</h2>

        </div>
        <div class="col-12 col-md-7">
            <p style="font-size: 22px;">
                Gutmütig, intelligent und neugierig – Alpakas sind einfach zauberhaft. Eine Wanderung mit Alpakas ist Balsam für die Seele!
                Nach einer kurzen Einführung in die Welt der Paarhufer dürfen Sie die Tiere kennenlernen. Fernab von Autolärm und der Hektik des Alltags erfahren Sie die positive, beruhigende Wirkung der friedvollen, ausgeglichenen und dennoch aufgeweckten Tiere auf uns Menschen. Ein Wollknäuel mit großen Teddyaugen zu streicheln begeistert nicht nur Kinder.
                <br>
        </div>
        <div class="col-12 col-md-4 offset-md-1 text-center">
            <img class="img-fluid mx-auto d-block rounded" src="https://picsum.photos//300/350">
            <small class="fst-italic mt-1">Petra und Martin Bäumler</small>
        </div>
        
    </div>
</section>

<section class="mt-2">
    <div class="row">
            <h2 id="latest_jobs" class="mt-5 mb-4">Aktuelle <strong>Neuigkeiten</strong></h2>
            @foreach($nachrichten as $nach)
            <div class="col-12 col-md-4" style="padding-bottom: 1rem;">
                <div class="card" style="background-color: #f8f8f8;">
                    @if ($nach->image)
                        <img class="rounded-top img-fluid" src="{{ asset('uploads/' . $nach->image) }}">
                    @else
                        <img class="rounded-top img-fluid" src="{{ asset('template/images/konradenhof-placeholder.jpg') }}">

                    @endif
                    <div class="card-body">
                        <div class="row">



                            <div class="col-12">
                                <h5 class="card-title" style="margin-top: 20px;">
                                    <a href="{{ route_content($nach) }}" onclick="gtag('event', 'See Job', {'event_category' : 'Home', 'event_label' : '{{$nach->title}}'});">
                                        {{$nach->title}}
                                    </a>
                                </h5>
                            </div>
                            <div class="col-12">
                                <small class="card-subtitle mb-2 text-muted" title="{{date('d.m.Y', strtotime($nach->created_at))}}">  {{ $nach->created_at->diffForHumans() }}</small>
                            </div>
                            <div class="col-12 mt-2">

                                Lorem ipsum dolor sit amet, consectetur adipisicing elit. A asperiores consectetur consequuntur, eos exercitationem itaque iusto modi quibusdam quidem quisquam quos sunt voluptas voluptate! Architecto deleniti magni nulla possimus quaerat!
                            </div>

                            <div class="col-12 col-lg-12 text-end ">
                                <br>
                                <a class="btn btn-sm btn-ci" href="{{ route_content($nach) }}" onclick="gtag('event', 'See Job', {'event_category' : 'Home', 'event_label' : '{{$nach->title}}'});">
                                    Mehr lesen
                                    <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" class="bi bi-chevron-right" viewBox="0 0 16 16">
                                        <path fill-rule="evenodd" d="M4.646 1.646a.5.5 0 0 1 .708 0l6 6a.5.5 0 0 1 0 .708l-6 6a.5.5 0 0 1-.708-.708L10.293 8 4.646 2.354a.5.5 0 0 1 0-.708z" />
                                    </svg>
                                </a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            @endforeach
            <div style="margin: auto;text-align: center;    display: table; overflow: scroll;">
                {!! $nachrichten->fragment("latest_jobs")->render() !!}
            </div>
    </div>
</section>

<section>
    <div class="row">
        <div class="col">
            <h2 class="mb-5">Über <strong>Alpakas</strong></h2>

            <p style="font-size: 19px;">

                Gutmütig, intelligent und neugierig – Alpakas sind einfach zauberhaft.
                <br>
                <br>

                Eine Wanderung mit Alpakas ist Balsam für die Seele! Nach einer kurzen Einführung in die Welt der Paarhufer dürfen Sie die Tiere kennenlernen.
                <br>
                <br>
                Fernab von Autolärm und der Hektik des Alltags erfahren Sie die positive, beruhigende Wirkung der friedvollen, ausgeglichenen und dennoch aufgeweckten Tiere auf uns Menschen.

                <br>
                <br>
                Ein Wollknäuel mit großen Teddyaugen zu streicheln begeistert nicht nur Kinder.
            </p>

        </div>
    </div>
    <div class="row text-center" style="font-size: 20px;">
        <div class="col-6 col-md-3 mb-5">
            <a href="{{url('/regensburg')}}">
                <img src="https://www.alpakafarm.com/sites/default/files/styles/display_04_400xstandard_16_9_crop/public/2019-03/AFS_Bild_Farm.jpg?itok=jAJ1z74g" class="img-fluid rounded border" loading="lazy">

                Ramona
            </a>
        </div>
        <div class="col-6 col-md-3 mb-5">
            <a href="{{url('/weiden')}}">
                <picture>
                    <img src="https://www.alpakafarm.com/sites/default/files/styles/display_04_400xstandard_16_9_crop/public/weissjung.jpg?h=1cf7100d?h=1cf7100d&amp;itok=BYKVbS4F" class="img-fluid rounded border" loading="lazy">
                </picture>
                Belinda
            </a>
        </div>
        <div class="col-6 col-md-3 mb-5">
            <a href="{{url('/amberg')}}">
                <img src="https://www.alpakafarm.com/sites/default/files/styles/display_04_400xstandard_16_9_crop/public/AFS_Head_Alpakas_2.jpg?h=a8426572?h=a8426572&amp;itok=FCQtYpaZ" class="img-fluid rounded border" loading="lazy">
                Manfred</a>
        </div>
        <div class="col-6 col-md-3 mb-5">
            <a href="{{url('/neumarkt')}}">
                <img src="https://www.alpakafarm.com/sites/default/files/styles/display_04_400xstandard_16_9_crop/public/AFS_Head_Alpakas_2_0.jpg?h=0dbd260c&itok=XZI1whIH" class="img-fluid rounded border" loading="lazy">
                Botschadl</a>
        </div>


</section>

<script>
    let results = [
        @foreach($authors as $author)
        {"name":`{{$author->name}}`, "url":"{{ route('author.get', [$author->slug]) }}", "keywords":"{{$author->search_terms}}"},
        @endforeach
        @foreach($lists as $list)
        {"name":"{{$list->name}}", "url":"{{ url('/'.$list->slug) }}", "keywords":"{{$list->search_terms}}"},
        @endforeach
    ];
</script>
<script src="{{asset('template/js/pages/main/methods.js')}}"></script>
<script src="{{asset('template/js/pages/main/events.js')}}"></script>
<script src="{{asset('template/js/pages/main/script.js')}}"></script>
@stop