@layout('content.master')
@section('content')
<div class="container">
    <section>
        <div class="row">
            <div class="col">
                <h1>Neuigkeiten</h1>
                <br>

                <br>
                <p class="fs-5">Balkonkraftwerke oder auch Steckersolaranlagen sind eine einfache Möglichkeiten Stromkosten zu senken. Tagsüber lässt sich dadurch der Grundverbrauch im Haushalt über den eigenerzeugten Strom abdecken.</p>
                <br>
                <br>
            </div>
        </div>


        <style>
            #list-filter-menue .form-check {
                min-height: 2.5rem;
            }
            #list-filter-menue .bg-light {
                background-color: #4285c836 !important;
            }

            a:hover .card-body{
                background-color: #edeff25e;
            }
        </style>


        <div class="row">
            <div id="list-filter-menue" class="d-none d-lg-block col-12 position-relative col-md-3 rounded-end" style="background-color: #9cbbd961; padding: 25px;">
                <div class="row">
                    <div class="col-12">
                        <h5 class="mt-2 mb-3 fw-bold">Region</h5>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="regensburg" id="flexCheckRegensburg">
                            <label class="form-check-label" for="flexCheckRegensburg">
                                Regensburg
                                <span class="badge bg-light text-dark">244 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="weiden" id="flexCheckWeiden">
                            <label class="form-check-label" for="flexCheckWeiden">
                                Weiden
                                <span class="badge bg-light text-dark">54 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="amberg" id="flexCheckAmberg">
                            <label class="form-check-label" for="flexCheckAmberg">
                                Amberg
                                <span class="badge bg-light text-dark">35 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="schwandorf" id="flexCheckSchwandorf">
                            <label class="form-check-label" for="flexCheckSchwandorf">
                                Schwandorf
                                <span class="badge bg-light text-dark">38 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="neumarkt" id="flexCheckNeumarkt">
                            <label class="form-check-label" for="flexCheckNeumarkt">
                                Neumarkt
                                <span class="badge bg-light text-dark">124 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="cham" id="flexCheckCham">
                            <label class="form-check-label" for="flexCheckCham">
                                Cham
                                <span class="badge bg-light text-dark">42 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="neustadt" id="flexCheckNeustadt">
                            <label class="form-check-label" for="flexCheckNeustadt">
                                Neustadt
                                <span class="badge bg-light text-dark">16 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="tirschenreuth" id="flexCheckTirschenreuth">
                            <label class="form-check-label" for="flexCheckTirschenreuth">
                                Tirschenreuth
                                <span class="badge bg-light text-dark">54 Jobs</span>
                            </label>
                        </div>
                        <h5 class="mt-5 mb-3 fw-bold">Art</h5>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="vollzeit" id="flexCheckVollzeit">
                            <label class="form-check-label" for="flexCheckVollzeit">
                                Mieten
                                <span class="badge bg-light text-dark">98 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="teilzeit" id="flexCheckTeilzeit">
                            <label class="form-check-label" for="flexCheckTeilzeit">
                                Kaufen
                                <span class="badge bg-light text-dark">12 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="minijob" id="flexCheckMinijob">
                            <label class="form-check-label" for="flexCheckMinijob">
                                Pachten
                                <span class="badge bg-light text-dark">1 Jobs</span>
                            </label>
                        </div>

                        <h5 class="mt-5 mb-3 fw-bold">Branche</h5>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="wissenschaft-ingenieurwesen" id="flexCheckWissenschaft &amp; Ingenieurwesen">
                            <label class="form-check-label" for="flexCheckWissenschaft &amp; Ingenieurwesen">
                                Wissenschaft &amp; Ingenieurwesen
                                <span class="badge bg-light text-dark">20 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="computer-it" id="flexCheckComputer &amp; IT">
                            <label class="form-check-label" for="flexCheckComputer &amp; IT">
                                Computer &amp; IT
                                <span class="badge bg-light text-dark">26 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="gesundheitswesen" id="flexCheckGesundheitswesen">
                            <label class="form-check-label" for="flexCheckGesundheitswesen">
                                Gesundheitswesen
                                <span class="badge bg-light text-dark">117 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="management" id="flexCheckManagement">
                            <label class="form-check-label" for="flexCheckManagement">
                                Management
                                <span class="badge bg-light text-dark">0 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="produktion-lager" id="flexCheckProduktion &amp; Lager">
                            <label class="form-check-label" for="flexCheckProduktion &amp; Lager">
                                Produktion &amp; Lager
                                <span class="badge bg-light text-dark">13 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="buchhaltung-finanzen" id="flexCheckBuchhaltung &amp; Finanzen">
                            <label class="form-check-label" for="flexCheckBuchhaltung &amp; Finanzen">
                                Buchhaltung &amp; Finanzen
                                <span class="badge bg-light text-dark">67 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="vertrieb-einzelhandel" id="flexCheckVertrieb &amp; Einzelhandel">
                            <label class="form-check-label" for="flexCheckVertrieb &amp; Einzelhandel">
                                Vertrieb &amp; Einzelhandel
                                <span class="badge bg-light text-dark">23 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="bauwesen" id="flexCheckBauwesen">
                            <label class="form-check-label" for="flexCheckBauwesen">
                                Bauwesen
                                <span class="badge bg-light text-dark">17 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="installation-wartung-instandsetzung" id="flexCheckInstallation, Wartung &amp; Instandsetzung">
                            <label class="form-check-label" for="flexCheckInstallation, Wartung &amp; Instandsetzung">
                                Installation, Wartung &amp; Instandsetzung
                                <span class="badge bg-light text-dark">28 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="verwaltung-buro" id="flexCheckVerwaltung &amp; Büro">
                            <label class="form-check-label" for="flexCheckVerwaltung &amp; Büro">
                                Verwaltung &amp; Büro
                                <span class="badge bg-light text-dark">14 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="bildung" id="flexCheckBildung">
                            <label class="form-check-label" for="flexCheckBildung">
                                Bildung
                                <span class="badge bg-light text-dark">15 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="transport-logistik" id="flexCheckTransport &amp; Logistik">
                            <label class="form-check-label" for="flexCheckTransport &amp; Logistik">
                                Transport &amp; Logistik
                                <span class="badge bg-light text-dark">8 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="personalwesen" id="flexCheckPersonalwesen">
                            <label class="form-check-label" for="flexCheckPersonalwesen">
                                Personalwesen
                                <span class="badge bg-light text-dark">1 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="gastronomie" id="flexCheckGastronomie">
                            <label class="form-check-label" for="flexCheckGastronomie">
                                Gastronomie
                                <span class="badge bg-light text-dark">0 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="reisen-unterhaltung" id="flexCheckReisen &amp; Unterhaltung">
                            <label class="form-check-label" for="flexCheckReisen &amp; Unterhaltung">
                                Reisen &amp; Unterhaltung
                                <span class="badge bg-light text-dark">0 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="kundenservice" id="flexCheckKundenservice">
                            <label class="form-check-label" for="flexCheckKundenservice">
                                Kundenservice
                                <span class="badge bg-light text-dark">12 Jobs</span>
                            </label>
                        </div>
                        <div class="form-check">
                            <input class="form-check-input check-branche" type="checkbox" value="offentlicher-dienst" id="flexCheckÖffentlicher Dienst">
                            <label class="form-check-label" for="flexCheckÖffentlicher Dienst">
                                Öffentlicher Dienst
                                <span class="badge bg-light text-dark">43 Jobs</span>
                            </label>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-12 col-md-9 ">
                <div class="row">


                    @foreach($contents as $indexContent => $content)
                        <div class="col-12 col-md-4 mb-4">
                            <div class="card shadow-sm" style="background-color: #2776b7;">
                                <img src="https://picsum.photos/200/100" class="card-img-top border-bottom">
                                <div class="card-body">
                                    <h2 class="card-title text-light">Immobilie Alpha</h2>
                                    <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Accusamus asperiores consequatur maxime nobis provident! Amet in laborum minus possimus reiciendis rem reprehenderit! Ducimus facere facilis illo odit omnis suscipit voluptatum?</p>

                                </div>
                            </div>
                        </div>
                    @endforeach




                        <div class="col-12 col-md-4 mb-4">
                            <a href="" class="text-decoration-none">
                                <div class="card shadow-sm bg-light">
                                    <img src="https://picsum.photos/200/100" class="card-img-top border-bottom">
                                    <div class="card-body">
                                        <h2 class="card-title h6">Immobilie Alpha</h2>
                                        <p class="text-dark text-muted" style="font-size: 12px;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. </p>

                                        <div class="text-end">
                                            <span  class="text-end text-decoration-none" style="font-size: 14px;">Mehr ansehen
                                                <svg style="width: 12px; fill: currentColor; margin-left: 2px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M311.03 131.515l-7.071 7.07c-4.686 4.686-4.686 12.284 0 16.971L387.887 239H12c-6.627 0-12 5.373-12 12v10c0 6.627 5.373 12 12 12h375.887l-83.928 83.444c-4.686 4.686-4.686 12.284 0 16.971l7.071 7.07c4.686 4.686 12.284 4.686 16.97 0l116.485-116c4.686-4.686 4.686-12.284 0-16.971L328 131.515c-4.686-4.687-12.284-4.687-16.97 0z"/></svg>
                                            </span>

                                        </div>

                                    </div>
                                </div>
                            </a>

                        </div>


                        <div class="col-12 col-md-4 mb-4">
                            <a href="" class="text-decoration-none">
                                <div class="card shadow-sm bg-light">
                                    <img src="https://picsum.photos/200/100" class="card-img-top border-bottom">
                                    <div class="card-body">
                                        <h2 class="card-title h6">Immobilie Alpha</h2>
                                        <p class="text-dark text-muted" style="font-size: 12px;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. </p>

                                        <div class="text-end">
                                            <span  class="text-end text-decoration-none" style="font-size: 14px;">Mehr ansehen
                                                <svg style="width: 12px; fill: currentColor; margin-left: 2px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M311.03 131.515l-7.071 7.07c-4.686 4.686-4.686 12.284 0 16.971L387.887 239H12c-6.627 0-12 5.373-12 12v10c0 6.627 5.373 12 12 12h375.887l-83.928 83.444c-4.686 4.686-4.686 12.284 0 16.971l7.071 7.07c4.686 4.686 12.284 4.686 16.97 0l116.485-116c4.686-4.686 4.686-12.284 0-16.971L328 131.515c-4.686-4.687-12.284-4.687-16.97 0z"/></svg>
                                            </span>

                                        </div>

                                    </div>
                                </div>
                            </a>

                        </div>

                        <div class="col-12 col-md-4 mb-4">
                            <a href="" class="text-decoration-none">
                                <div class="card shadow-sm bg-light">
                                    <img src="https://picsum.photos/200/100" class="card-img-top border-bottom">
                                    <div class="card-body">
                                        <h2 class="card-title h6">Immobilie Alpha</h2>
                                        <p class="text-dark text-muted" style="font-size: 12px;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. </p>

                                        <div class="text-end">
                                            <span  class="text-end text-decoration-none" style="font-size: 14px;">Mehr ansehen
                                                <svg style="width: 12px; fill: currentColor; margin-left: 2px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M311.03 131.515l-7.071 7.07c-4.686 4.686-4.686 12.284 0 16.971L387.887 239H12c-6.627 0-12 5.373-12 12v10c0 6.627 5.373 12 12 12h375.887l-83.928 83.444c-4.686 4.686-4.686 12.284 0 16.971l7.071 7.07c4.686 4.686 12.284 4.686 16.97 0l116.485-116c4.686-4.686 4.686-12.284 0-16.971L328 131.515c-4.686-4.687-12.284-4.687-16.97 0z"/></svg>
                                            </span>

                                        </div>

                                    </div>
                                </div>
                            </a>

                        </div>


                        <div class="col-12 col-md-4 mb-4">
                            <a href="" class="text-decoration-none">
                                <div class="card shadow-sm bg-light">
                                    <img src="https://picsum.photos/200/100" class="card-img-top border-bottom">
                                    <div class="card-body">
                                        <h2 class="card-title h6">Immobilie Alpha</h2>
                                        <p class="text-dark text-muted" style="font-size: 12px;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. </p>

                                        <div class="text-end">
                                            <span  class="text-end text-decoration-none" style="font-size: 14px;">Mehr ansehen
                                                <svg style="width: 12px; fill: currentColor; margin-left: 2px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M311.03 131.515l-7.071 7.07c-4.686 4.686-4.686 12.284 0 16.971L387.887 239H12c-6.627 0-12 5.373-12 12v10c0 6.627 5.373 12 12 12h375.887l-83.928 83.444c-4.686 4.686-4.686 12.284 0 16.971l7.071 7.07c4.686 4.686 12.284 4.686 16.97 0l116.485-116c4.686-4.686 4.686-12.284 0-16.971L328 131.515c-4.686-4.687-12.284-4.687-16.97 0z"/></svg>
                                            </span>

                                        </div>

                                    </div>
                                </div>
                            </a>

                        </div>


                        <div class="col-12 col-md-4 mb-4">
                            <a href="" class="text-decoration-none">
                                <div class="card shadow-sm bg-light">
                                    <img src="https://picsum.photos/200/100" class="card-img-top border-bottom">
                                    <div class="card-body">
                                        <h2 class="card-title h6">Immobilie Alpha</h2>
                                        <p class="text-dark text-muted" style="font-size: 12px;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. </p>

                                        <div class="text-end">
                                            <span  class="text-end text-decoration-none" style="font-size: 14px;">Mehr ansehen
                                                <svg style="width: 12px; fill: currentColor; margin-left: 2px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M311.03 131.515l-7.071 7.07c-4.686 4.686-4.686 12.284 0 16.971L387.887 239H12c-6.627 0-12 5.373-12 12v10c0 6.627 5.373 12 12 12h375.887l-83.928 83.444c-4.686 4.686-4.686 12.284 0 16.971l7.071 7.07c4.686 4.686 12.284 4.686 16.97 0l116.485-116c4.686-4.686 4.686-12.284 0-16.971L328 131.515c-4.686-4.687-12.284-4.687-16.97 0z"/></svg>
                                            </span>

                                        </div>

                                    </div>
                                </div>
                            </a>

                        </div>


                        <div class="col-12 col-md-4 mb-4">
                            <a href="" class="text-decoration-none">
                                <div class="card shadow-sm bg-light">
                                    <img src="https://picsum.photos/200/100" class="card-img-top border-bottom">
                                    <div class="card-body">
                                        <h2 class="card-title h6">Immobilie Alpha</h2>
                                        <p class="text-dark text-muted" style="font-size: 12px;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. </p>

                                        <div class="text-end">
                                            <span  class="text-end text-decoration-none" style="font-size: 14px;">Mehr ansehen
                                                <svg style="width: 12px; fill: currentColor; margin-left: 2px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M311.03 131.515l-7.071 7.07c-4.686 4.686-4.686 12.284 0 16.971L387.887 239H12c-6.627 0-12 5.373-12 12v10c0 6.627 5.373 12 12 12h375.887l-83.928 83.444c-4.686 4.686-4.686 12.284 0 16.971l7.071 7.07c4.686 4.686 12.284 4.686 16.97 0l116.485-116c4.686-4.686 4.686-12.284 0-16.971L328 131.515c-4.686-4.687-12.284-4.687-16.97 0z"/></svg>
                                            </span>

                                        </div>

                                    </div>
                                </div>
                            </a>

                        </div>


                        <div class="col-12 col-md-4 mb-4">
                            <a href="" class="text-decoration-none">
                                <div class="card shadow-sm bg-light">
                                    <img src="https://picsum.photos/200/100" class="card-img-top border-bottom">
                                    <div class="card-body">
                                        <h2 class="card-title h6">Immobilie Alpha</h2>
                                        <p class="text-dark text-muted" style="font-size: 12px;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. </p>

                                        <div class="text-end">
                                            <span  class="text-end text-decoration-none" style="font-size: 14px;">Mehr ansehen
                                                <svg style="width: 12px; fill: currentColor; margin-left: 2px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M311.03 131.515l-7.071 7.07c-4.686 4.686-4.686 12.284 0 16.971L387.887 239H12c-6.627 0-12 5.373-12 12v10c0 6.627 5.373 12 12 12h375.887l-83.928 83.444c-4.686 4.686-4.686 12.284 0 16.971l7.071 7.07c4.686 4.686 12.284 4.686 16.97 0l116.485-116c4.686-4.686 4.686-12.284 0-16.971L328 131.515c-4.686-4.687-12.284-4.687-16.97 0z"/></svg>
                                            </span>

                                        </div>

                                    </div>
                                </div>
                            </a>

                        </div>


                        <div class="col-12 col-md-4 mb-4">
                            <a href="" class="text-decoration-none">
                                <div class="card shadow-sm bg-light">
                                    <img src="https://picsum.photos/200/100" class="card-img-top border-bottom">
                                    <div class="card-body">
                                        <h2 class="card-title h6">Immobilie Alpha</h2>
                                        <p class="text-dark text-muted" style="font-size: 12px;">Lorem ipsum dolor sit amet, consectetur adipisicing elit. </p>

                                        <div class="text-end">
                                            <span  class="text-end text-decoration-none" style="font-size: 14px;">Mehr ansehen
                                                <svg style="width: 12px; fill: currentColor; margin-left: 2px;" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path d="M311.03 131.515l-7.071 7.07c-4.686 4.686-4.686 12.284 0 16.971L387.887 239H12c-6.627 0-12 5.373-12 12v10c0 6.627 5.373 12 12 12h375.887l-83.928 83.444c-4.686 4.686-4.686 12.284 0 16.971l7.071 7.07c4.686 4.686 12.284 4.686 16.97 0l116.485-116c4.686-4.686 4.686-12.284 0-16.971L328 131.515c-4.686-4.687-12.284-4.687-16.97 0z"/></svg>
                                            </span>

                                        </div>

                                    </div>
                                </div>
                            </a>

                        </div>





                </div>
            </div>



        </div>
    </section>
</div>
@stop