# Home Page

hide code
<div class="c-teaser-grid">
    <div class="c-teaser-grid__row">
        <div class="c-teaser -home -student m-r-s">
            <a href="/studenten/" class="c-teaser__link -student c-link -icon-right -icon-arrow">
                <span class="c-teaser__link__text">Studenten</span>
            </a>
            <a href="/studenten/" class="h-clickable-area"></a>
            <div class="h-flex h-flex-row">
                <a href="/kommentar/" class="c-pill">1. Stex</a>
                <a href="/trainer-web/" class="c-pill">2. Stex</a>
            </div>
        </div>
        <div class="c-teaser -home -phip">
            <a href="/praktikanten/" class="c-teaser__link -phip c-link -icon-right -icon-arrow">
                <span class="c-teaser__link__text">PhiP</span>
            </a>
            <a href="/praktikanten/" class="h-clickable-area"></a>
            <div class="h-flex h-flex-row">
                <a href="/medicheck/" class="c-pill">MediCheck</a>
                <a href="/apotheker/labor-plus/intro/" class="c-pill">Labor+</a>
                <a href="/trainer-3stex-web/" class="c-pill">3. Stex</a>
            </div>
        </div>
    </div>
    <div class="c-teaser-grid__row">
        <div class="c-teaser -home -pta m-r-s">
            <a href="/pta/" class="c-teaser__link -pta c-link -icon-right -icon-arrow">
                <span class="c-teaser__link__text">PTA</span>
            </a>
            <a href="/pta/" class="h-clickable-area"></a>
            <div class="h-flex h-flex-row">
                <a href="/medicheck/" class="c-pill">MediCheck</a>
                <a href="/apotheker/labor-plus/intro/" class="c-pill">Labor+</a>
            </div>
        </div>
        <div class="c-teaser -home -apothecary">
            <a href="/apotheker/" class="c-teaser__link -apothecary c-link -icon-right -icon-arrow">
                <span class="c-teaser__link__text">Apotheker</span>
            </a>
            <a href="/apotheker/" class="h-clickable-area"></a>
            <div class="h-flex h-flex-row">
                <a href="/medicheck/" class="c-pill">MediCheck</a>
                <a href="/apotheker/labor-plus/intro/" class="c-pill">Labor+</a>
            </div>
        </div>
    </div>
</div>
<div class="m-t-xxl m-b-l">
    <span class="h5 h-type-align-center">Unsere Leistungen</span><!-- nur eine idee mit der subline -->
    <h1 class="h-type-align-center">Wir digitalisieren die Pharmazie</h1>
    <ul class="c-list -linklist" id="services" data-visible-items="5" aria-expanded="false">
        <li class="c-list__item -no-border p-y-xs">
            <a class="c-link c-list__item__content p-y-reset -icon-hover-arrow" href="/medicheck/">
                <div class="h-width-80 p-x-xxl m-x-auto h-flex h-flex-row h-vertical-center">
                    <span class="c-icon -medicheck m-r-m -icon-right -icon-arrow"></span>
                    <span class="c-link c-list__item__content -regular -large">
                        Medikationsmanagement mit MediCheck:
                        Für AMTS-Vorreiter, Chancen-Denker und Apotheker mit Profil
                    </span>
                </div>
            </a>
        </li>
        <li class="c-list__item -no-border p-y-xs">
            <a class="c-link c-list__item__content p-y-reset -icon-hover-arrow" href="/labor-plus/intro/">
                <div class="h-width-80 p-x-xxl m-x-auto h-flex h-flex-row h-vertical-center">
                    <span class="c-icon -labor m-r-m -icon-right -icon-arrow"></span>
                    <span class="c-link c-list__item__content -regular -large">
                    Rechtskonforme Dokumentation aller Prozesse in Rezeptur, 
Defektur und Labor mit unserer Laborsoftware Labor+
                    </span>
                </div>
            </a>
        </li>
        <li class="c-list__item -no-border p-y-xs">
            <a class="c-link c-list__item__content p-y-reset -icon-hover-arrow" href="/webinare/">
                <div class="h-width-80 p-x-xxl m-x-auto h-flex h-flex-row h-vertical-center">
                    <span class="c-icon -webinare m-r-m -icon-right -icon-arrow"></span>
                    <span class="c-link c-list__item__content -regular -large">
                    Rechtskonforme Dokumentation aller Prozesse in Rezeptur, 
Defektur und Labor mit unserer Laborsoftware Labor+
                    </span>
                </div>
            </a>
        </li>
        <li class="c-list__item -no-border p-y-xs">
            <a class="c-link c-list__item__content p-y-reset -icon-hover-arrow" href="/studenten/">
                <div class="h-width-80 p-x-xxl m-x-auto h-flex h-flex-row h-vertical-center">
                    <span class="c-icon -stex m-r-m -icon-right -icon-arrow"></span>
                    <span class="c-link c-list__item__content -regular -large">
                    Aktuelle Lernprogramme zur optimalen Prüfungsvorbereitung: 
1. Stex, 2. Stex und 3. Stex (Staatsexamina)
                    </span>
                </div>
            </a>
        </li>
        <li class="c-list__item -no-border p-y-xs">
            <a class="c-link c-list__item__content p-y-reset -icon-hover-arrow" href="/forum/eingang/">
                <div class="h-width-80 p-x-xxl m-x-auto h-flex h-flex-row h-vertical-center">
                    <span class="c-icon -forum m-r-m -icon-right -icon-arrow"></span>
                    <span class="c-link c-list__item__content -regular -large">
                    21 Kompetenz-Foren mit Fachexperten, die Ihre Fragen zuverlässig beantworten
                    </span>
                </div>
            </a>
        </li>
        <li class="c-list__item -no-border p-y-xs">
            <a class="c-link c-list__item__content p-y-reset -icon-hover-arrow" href="/apotheker/datenbanken/tax-ikon/">
                <div class="h-width-80 p-x-xxl m-x-auto h-flex h-flex-row h-vertical-center">
                    <span class="c-icon -taxikon m-r-m -icon-right -icon-arrow"></span>
                    <span class="c-link c-list__item__content -regular -large">
                    Tax-ikon: Das Lexikon zum Taxieren. Von A wie Abgabedatum über H wie Hilfsmittel und S wie Sonderkennzeichen bis Z wie Zuzahlung werden über 50 Themen praxisnah erklärt.
                    </span>
                </div>
            </a>
        </li>
        <li class="c-list__item -no-border p-y-xs">
            <a class="c-link c-list__item__content p-y-reset -icon-hover-arrow" href="">
                <div class="h-width-80 p-x-xxl m-x-auto h-flex h-flex-row h-vertical-center">
                    <span class="c-icon -databases m-r-m -icon-right -icon-arrow"></span>
                    <span class="c-link c-list__item__content -regular -large">
                        Lorem ipsum dolor sit amet, consectetur adipisicing elit. Cupiditate dolorum maiores perspiciatis sunt? Ab adipisci consequuntur cupiditate ex fugit illo labore maiores possimus ut vel. Ab adipisci dolorem eum perferendis?
                    </span>
                </div>
            </a>
        </li>
        <li class="p-y-m">
            <div class="h-width-80 p-x-xxl m-x-auto h-flex h-start">
                <a class="c-link c-list__item__content -secondary -large -icon-right -show-more" data-toggle="collapse" data-target="#services" data-alttext="... weniger anzeigen">
                    <span class="c-link__text">... und vieles mehr</span>
                    <span class="fas fa-chevron-down"></span>
                </a>
            </div>
        </li>
    </ul>
    <div class="h-type-align-center h-width-80 p-x-xxl m-x-auto">
        <a href="" class="c-btn -primary -icon-right -icon-arrow m-t-xl">Jetzt Premium User werden</a>
    </div>
</div>