{% extends "header_with_logo.html" %}
{%- block title -%}{{ this.title }}{%- endblock -%}
{%- block meta_description -%}
  {%- if this.meta_description is defined and this.meta_description != "" -%}
    {{ this.meta_description }}
  {%- else -%}
    Werkkooperative der Technikfreundinnen eG
  {%- endif -%}
{%- endblock -%}
{% block body %}

    <!-- 50/50 Layout - start -->
    <section class="content">
        <div class="content__box -heading">
            <div class="content__inner_box">
                <h2>3, 2, 1 - Die WTF eG hebt ab!</h2>
            </div>
        </div>
        <div class="content__half_box">
            <div class="content__inner_half_box">
                <div class="content__teaser">
                    <p>Der Start ist geschafft, die WTF Kooperative eG ist gegründet und seit Anfang des Jahres ordentlich beim Registergericht Hamburg eingetragen.</p>
                </div>
                <div class="content__body">
                    <p>Die Idee der„Hackergenossenschaft“ wurde zum ersten Mal auf dem 34C3 vorgestellt. Vom Start weg haben sich über 160 Personen gefunden und dafür gearbeitet, dass die Gründung gelingt.</p>
                    <p>Ein Unternehmen, dass jedem einzelnen von uns gehört, in dem jeder von uns eine Stimme und das Recht auf Mitsprache hat. Das alles ist nun machbar - in unserer WTF Koopertive eG.</p>
                </div>
                <div class="content__footer">
                    <p>folge uns&emsp;<a href="https://chaos.social/@HackerGeno"><img class="content__inline_image" src="images/mastodon_logo.svg" alt="Mastodon Logo" height="16px"></a></p>
                </div>
            </div>
            {% if this.attachments.images %}
                <div class="content__inner_half_box">
                    {% for image in this.attachments.images %}
                        <!--
                        Wir laden Bilder mit hoher Auflösung hoch. Lektor baut "Thumbnails" mit halber
                        Auflösung. Per srcset bieten wir beides an und der Browser sucht das Richtige
                        raus.

                        Versteht der Browser srcset nicht, greift src.

                        Wichtig: Keine Angaben für width und height berechnen, dann geht beim Skalieren das Seitenverhältnis kaputt.
                        -->
                        <img class="content__half_box_image" src="{{ image|url }}" width="{{ image.width / 2 }}" alt="Startendes Space Shuttle" srcset="{{ image.thumbnail(image.width / 2)|url }} 1x, {{ image|url }} 2x">
                    {% endfor %}
                </div>
            {% endif %}
        </div>
    </section>
    <!-- 50/50 Layout - end -->

    <hr class="body__separator" noshade="" size="1">

    <!-- 1/3 Layout - start -->
    <section class="content">
        <div class="content__third_box">
            <div class="content__inner_third_box">
                <h2 class="content__inner_third_heading">
                    Das Wichtigste gibt es jetzt auf die Ohren – <a class="content__inner_third_heading_link" href="https://vebit.xyz/podcast/">WTF-Podcast</a>
                </h2>
                {% if this.attachments.images %}
                    {% for image in this.attachments.images %}
                        <img class="content__inner_third_image" class="content__half_box_image" src="{{ image|url }}" width="{{ image.width / 2 }}" alt="Startendes Space Shuttle" srcset="{{ image.thumbnail(image.width / 2)|url }} 1x, {{ image|url }} 2x">
                    {% endfor %}
                {% endif %}
                <p>Unser Podcast "WTF Aktuell" fasst für Mitglieder und Interessierte die wichtigsten Nachrichten und Entwicklungen aus dem genossenschaftlichen Leben zusammen.
                </p>
                <ul>
                    <li>WTF eG Podcast S02E02</li>
                    <li>WTF eG Podcast S02E01</li>
                </ul>
                <div class="content__button_box">
                    <button class="content__button">
                        <a class="content__inner_third_button_link" href="https://vebit.xyz/podcast/">Podcast</a>
                    </button>
                </div>
            </div>

            <div class="content__inner_third_box">
                <h2 class="content__inner_third_heading">
                    Zusammen Arbyten, die eigene Idee fliegen sehen.
                </h2>
                {% if this.attachments.images %}
                    {% for image in this.attachments.images %}
                        <img class="content__inner_third_image" src="{{ image|url }}" width="{{ image.width / 2 }}" alt="Startendes Space Shuttle" srcset="{{ image.thumbnail(image.width / 2)|url }} 1x, {{ image|url }} 2x">
                    {% endfor %}
                {% endif %}
                <p>Wir verstehen uns als Plattform for Hackende, auf der sich mit Gleichgesinnten wirtschaftliche Projekte möglich werden, die es anders nicht gäbe. Wir fördern und bewirtschaften im Kollektiv als Genossenschaft die Leistungen unserer Mitglieder.
                </p>
                <div class="content__button_box">
                    <button class="content__button">
                        <a class="content__inner_third_button_link" href="#">Projekte</a>
                    </button>
                </div>
            </div>

            <div class="content__inner_third_box">
                <h2 class="content__inner_third_heading">
                    Genossenschafts&shy;anteile sind eine Anlage, kein Geschenk.
                </h2>
                {% if this.attachments.images %}
                    {% for image in this.attachments.images %}
                        <img class="content__inner_third_image" src="{{ image|url }}" width="{{ image.width / 2 }}" alt="Startendes Space Shuttle" srcset="{{ image.thumbnail(image.width / 2)|url }} 1x, {{ image|url }} 2x">
                    {% endfor %}
                {% endif %}
                <p>Wir bieten useren Mitgliedern nicht nur ein gutes Netzwerk, sondern auch eine sichere Anlagemöglichkeit. Hier kannst Du Dich über die Anlagekriterien informieren.
                </p>
                <div class="content__button_box">
                    <button class="content__button">
                        <a class="content__inner_third_button_link" href="#">Kapitalanlage</a>
                    </button>
                </div>
            </div>
        </div>
    </section>
    <!-- 1/3 Layout - end -->

    <!-- Icon boxes - start -->
    <section class="content">
        <div class="content__box">
            <div class="content__inner_box  -card_box_head">
                <div class="flex_heading">
                    <h2>Vielfältige Vorteile</h2>
                </div>
                <div class="claim">
                    <div class="claim__background_box">
                        <h2>Werde Teil der Community</h2>
                        <p class="claim__text">Hackergemeinschaft, Cowdfunding, Crowdbuying, Startup, Ausschreibung, …<br>
                        Wir realisieren gemeinsam Projekte, in bester Genossenschaft.</p>
                    </div>
                    <button class="claim__button"><a class="claim__button_link" href="#">MEMBER WERDEN</a></button>
                </div>
            </div>
        </div>

        <div class="content__box -card_box -homepage">
            <div class="content__inner_box -card_box">
                <div class="card">
                    <img class="card__icon" src="images/circle_icon_building.svg">
                    <h3 class="card__heading -homepage">Genossenschaftlich solidarisch</h3>
                    <p class="card__text">Eine Hackergemeinschaft ist aeine Aufstellung, die im Markt allerhand bewegen kann.</p>
                </div>

                <div class="card">
                    <img class="card__icon" src="images/circle_icon_institution.svg">
                    <h3 class="card__heading -homepage">Genossenschaftlich stark</h3>
                    <p class="card__text">Was eine/r allein nicht kann, das schaffen viele zusammen. Sowohl intellektuell, finanziell und in rechtsscierer, wirtschaftlich stabiler Umgebung.</p>
                </div>

                <div class="card">
                    <img class="card__icon" src="images/circle_icon_briefcase.svg">
                    <h3 class="card__heading -homepage">Auf eigene Rechnung oder angestellt</h3>
                    <p class="card__text">Mach Deine Genossenschaft zu deinem Arbeitgeber in dem Du Dich bei der Genossenschaft anstellen lässt.</p>
                </div>

                <div class="card">
                    <img class="card__icon" src="images/circle_icon_fist.svg">
                    <h3 class="card__heading -homepage">Helfen und lernen</h3>
                    <p class="card__text">Profitiere von Know-How und Erfahrungsaustausch in der Genossenschaft.</p>
                </div>

                <div class="card">
                    <img class="card__icon" src="images/circle_icon_clippy.svg">
                    <h3 class="card__heading -homepage">Die eigene Arbeit managen und abrechnen lassen</h3>
                    <p class="card__text">Rechnungen schreiben? Gewerbeanmeldung? Mehraufwand für Buchführung und Steuererklärung? Spare Dir den Aufand, lass' das deine Genossenschaft machen!</p>
                </div>

                <div class="card">
                    <img class="card__icon" src="images/circle_icon_group.svg">
                    <h3 class="card__heading -homepage">Virtuelle Teams, großartige Jobs</h3>
                    <p class="card__text">Viele von uns arbeiten freiberuflich. Von überall her, überall hin, flexibel und freundlich, klein und häufig allein. An manche, interesanten Aufgaben und Kunden kommt man als Einzelkämpfer nicht ran. An öffentliche Aufträge schon gar nicht.</p>
                </div>

                <div class="card">
                    <img class="card__icon" src="images/circle_icon_dragon.svg">
                    <h3 class="card__heading -homepage">Langfristige Träume verwirklichen</h3>
                    <p class="card__text">Ein Wohnungsprojekt, einen Altersruhesitz für Haecksen und Hacker einrichten, Geld zurücklegen, Förderung beantragen …</p>
                </div>

                <div class="card">
                    <img class="card__icon" src="images/circle_icon_fist.svg">
                    <h3 class="card__heading -homepage">Helfen und Lernen</h3>
                    <p class="card__text">Profitiere von Know-How und Erfahrungsaustausch in der Genossenschaft. DIESER TEXT IST DOPPELT</p>
                </div>

            </div>
        </div>

    </section>
    <!-- Icon boxes - start -->

    {% for blk in this.section.blocks %}
        <section class="content {{ loop.cycle('-odd', '-even') }}">
            {% if blk.title %}
                <div class="content__box">
                    <div class="content__inner_box">
                        <h2>{{ blk.title }}</h2><hr>
                    </div>
                </div>
            {% endif %}
            {{ blk }}
        </section>
    {% endfor %}
{% endblock %}