{{ define "header"}}
<header>
    <h1>Cozy Town</h1>
    <p>Dienste für flauschige Menschen</p>
    <!--<img id="header-background" src="header.svg">-->
</header>
{{- end }}
{{ define "main" }}
<main class="width-1200">
    <section id="dienste">
        <article class="cozyChat">
            <h2>Chat</h2>
            <p>Schreibe verschlüsselt und vertraulich mit deinen Freunden, Bekannten und deiner Familie.</p>
            <nav aria-label="Links zu Matrix">
                <a href="https://chat.cozy.town">Starten</a>
                <a href="https://doc.matrix.tu-dresden.de/">Dokumentation</a>
            </nav>
        </article>
        <article class="cozyTalk">
            <h2>Talk</h2>
            <p>Sprich verschlüsselt und vertraulich mit deinen Freunden, Bekannten und deiner Familie.</p>
            <nav aria-label="Links zu Mumble" class="service-nav">
                <a href="mumble://mumble.natenom.com/PUBLIC/Eingang%20%7C%20Entrance?title=Natemologie-Zentrum&version=1.2.0">Verbinden</a>
                <a href="https://wiki.natenom.de/mumble">Dokumentation</a>
            </nav>
        </article>
        <article class="cozyCode">
            <h2>Code</h2>
            <p>Beginne und pflege deine Projekte.</p>
            <nav aria-label="Links zu Forgejo">
                <a href="https://code.cozy.town">Starten</a>
            </nav>
        </article>
        <article class="cozyNtfy">
            <h2>Ntfy</h2>
            <p>Verpasse keine wichtigen Informationen und erhalte entgooglete Push-Benachrichtigungen.</p>
            <nav aria-label="Links zu Ntfy">
                <a href="https://ntfy.cozy.town">Starten</a>
            </nav>
        </article>
    </section>
</main>
{{- end }}