<div>
    <div class="page-layout-xl--default">
        <h2 class="teaser-section-heading">Hightlights</h2>
        <div class="blocks"><a href="#" class="case-tile-teaser case-tile-teaser-bg-image-demo">
                <div class="case-tile-teaser__content">
                    <div class="case-tile-teaser__body">
                        <h2 class="case-tile-teaser__caption">Case Study</h2>
                        <h2 class="case-tile-teaser__headline">Dies ist eine Headline</h2>
                        <p class="case-tile-teaser__text">Lorem gibson 8-bit Freeside denim otaku sign boy neon warp long-chain hydrocarbons car. Qui excepteur laborum ea est culpa reprehenderit enim ex amet veniam excepteur. Minim aliqua amet reprehenderit id velit id dolor quis et ea anim in. Cillum nisi ex incididunt id adipisicing reprehenderit id dolor qui anim non velit. Laboris esse ex duis sit labore culpa quis duis. Irure tempor deserunt et velit labore excepteur pariatur aute adipisicing eu do cupidatat nisi. Cupidatat officia aliquip excepteur Lorem in. Cillum amet enim anim do ut do adipisicing excepteur proident aute.</p>
                    </div>
                    <div class="case-tile-teaser__goto"><span class="link-teaser">zum Projekt</span></div>
                </div>
            </a>
            <a href="#" class="case-tile-teaser case-tile-teaser-bg-image-demo">
                <div class="case-tile-teaser__content">
                    <div class="case-tile-teaser__body">
                        <h2 class="case-tile-teaser__caption">Case Study</h2>
                        <h2 class="case-tile-teaser__headline">Dies ist eine Headline</h2>
                        <p class="case-tile-teaser__text">Lorem gibson 8-bit Freeside denim otaku sign boy neon warp long-chain
                            hydrocarbons car.</p>
                    </div>
                    <div class="case-tile-teaser__goto"><span class="link-teaser">zum Projekt</span>
                    </div>
                </div>
            </a>
        </div>
        <div class="blocks"><a href="#" class="case-tile-teaser case-tile-teaser--sm case-tile-teaser-bg-image-demo">
                <div class="case-tile-teaser__content case-tile-teaser__content--sm">
                    <div class="case-tile-teaser__body">
                        <h2 class="case-tile-teaser__caption">Case Study</h2>
                        <h2 class="case-tile-teaser__headline case-tile-teaser__headline--sm">Dies ist eine Headline</h2>
                        <p class="case-tile-teaser__text case-tile-teaser__text--sm">Lorem gibson 8-bit Freeside denim otaku sign boy neon warp long-chain hydrocarbons car.</p>
                    </div>
                    <div class="case-tile-teaser__goto"><span class="link-teaser">zum Projekt</span></div>
                </div>
            </a>
            <a href="#" class="case-tile-teaser case-tile-teaser--sm case-tile-teaser-bg-image-demo">
                <div class="case-tile-teaser__content case-tile-teaser__content--sm">
                    <div class="case-tile-teaser__body">
                        <h2 class="case-tile-teaser__caption">Case Study</h2>
                        <h2 class="case-tile-teaser__headline case-tile-teaser__headline--sm">Dies ist eine Headline</h2>
                        <p class="case-tile-teaser__text case-tile-teaser__text--sm">Lorem gibson 8-bit Freeside denim otaku sign boy neon warp long-chain
                            hydrocarbons car.</p>
                    </div>
                    <div class="case-tile-teaser__goto"><span class="link-teaser">zum Projekt</span>
                    </div>
                </div>
            </a><a href="#" class="case-tile-teaser case-tile-teaser--sm case-tile-teaser-bg-image-demo">
                <div class="case-tile-teaser__content case-tile-teaser__content--sm">
                    <div class="case-tile-teaser__body">
                        <h2 class="case-tile-teaser__caption">Case Study</h2>
                        <h2 class="case-tile-teaser__headline case-tile-teaser__headline--sm">Dies ist eine Headline</h2>
                        <p class="case-tile-teaser__text case-tile-teaser__text--sm">Lorem gibson 8-bit Freeside denim otaku sign boy neon warp long-chain hydrocarbons car.</p>
                    </div>
                    <div class="case-tile-teaser__goto"><span class="link-teaser">zum Projekt</span></div>
                </div>
            </a>
        </div>
    </div>
    <div class="page-layout--grid">
        <div class="center">
            <h2 class="teaser-section-heading">Projektliste</h2>
            <div class="project-index__entry">
                <header class="project-index__header">
                    <h1 class="project-index__title">A</h1>
                </header>
                <ul class="project-index__client-projects client-projects">
                    <li class="client-projects__client">
                        <header class="client-projects__header">
                            <h1 class="client-projects__client-name">Allianz</h1>
                        </header>
                        <div class="client-projects__project">
                            <div class="client-projects__intro">
                                <h2 class="client-projects__project-title">Frische neue Ideen</h2>
                                <p class="client-projects__intro-text">Dolor commodo dolor id consequat elit cillum tempor ad culpa ipsum ea
                                    sint. Minim anim esse proident sint sit laborum tempor dolore cillum aliqua
                                    aliqua. Nisi ipsum deserunt minim commodo est ut aliqua.</p>
                            </div><a href="#" class="link-teaser client-projects__goto-btn">zum Projekt</a>
                        </div>
                        <div class="client-projects__project">
                            <div class="client-projects__intro">
                                <h2 class="client-projects__project-title">Meteoriteneinschlag in der IT</h2>
                                <p class="client-projects__intro-text">Dolor commodo dolor id consequat elit cillum tempor dolore cillum aliqua
                                    aliqua.</p>
                            </div>
                            <multi-toggler aria-hidden="true" class="collapse-toggler client-projects__show-more-btn" data-target-next data-toggle-class="sr-only" data-toggle-self-class="collapsed" data-toggle-on-init><span class="collapse-toggler__flop">mehr anzeigen <img src="../../assets/plus-red.svg"></span>
                                <span class="collapse-toggler__flip">weniger anzeigen
                                    <img src="../../assets/minus-red.svg">
                                </span>
                            </multi-toggler>
                            <p class="client-projects__text">Ipsum ex nisi cillum voluptate qui sunt voluptate nostrud consequat adipisicing
                                in occaecat sit qui. Irure excepteur tempor eu consectetur proident laborum
                                commodo ullamco deserunt excepteur culpa. Excepteur dolore ad veniam et
                                in culpa dolore irure aliqua. Ea fugiat minim cillum exercitation. Culpa
                                ex nulla id consequat pariatur quis non veniam qui consequat ipsum cillum.
                                Sint eiusmod nulla veniam mollit sunt cillum ea adipisicing adipisicing
                                laborum quis ea aliqua. Et sit mollit aliqua irure minim do deserunt proident
                                consectetur consequat.</p>
                        </div>
                    </li>
                    <li class="client-projects__client">
                        <header class="client-projects__header">
                            <h1 class="client-projects__client-name">AXA</h1>
                        </header>
                        <div class="client-projects__project">
                            <div class="client-projects__intro">
                                <h2 class="client-projects__project-title">Benutzerfreundlich und Agil</h2>
                                <p class="client-projects__intro-text">Dolor commodo dolor id consequat elit cillum tempor ad culpa ipsum ea
                                    sint. Minim anim esse proident sint sit laborum tempor dolore cillum aliqua
                                    aliqua. Nisi ipsum deserunt minim commodo est ut aliqua.</p>
                            </div><a href="#" class="link-teaser client-projects__goto-btn">zum Projekt</a>
                        </div>
                    </li>
                </ul>
            </div>
            <div class="project-index__entry">
                <header class="project-index__header">
                    <h1 class="project-index__title">B</h1>
                </header>
                <ul class="project-index__client-projects client-projects">
                    <li class="client-projects__client">
                        <header class="client-projects__header">
                            <h1 class="client-projects__client-name">Client</h1>
                        </header>
                        <div class="client-projects__project">
                            <div class="client-projects__intro">
                                <h2 class="client-projects__project-title">A very nice project</h2>
                                <p class="client-projects__intro-text">Dolor commodo dolor id consequat elit cillum tempor ad culpa ipsum ea
                                    sint. Minim anim esse proident sint sit laborum tempor dolore cillum aliqua
                                    aliqua. Nisi ipsum deserunt minim commodo est ut aliqua.</p>
                            </div><a href="#" class="link-teaser client-projects__goto-btn">zum Projekt</a>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</div>
<div>


    <div class="page-layout-xl--default">
        <h2 class="teaser-section-heading">Hightlights</h2>
        <div class="blocks">
            <a href="#" class="case-tile-teaser case-tile-teaser-bg-image-demo">
                <div class="case-tile-teaser__content">
                    <div class="case-tile-teaser__body">
                        <h2 class="case-tile-teaser__caption">Case Study</h2>
                        <h2 class="case-tile-teaser__headline">Dies ist eine Headline</h2>
                        <p class="case-tile-teaser__text">
                            Lorem gibson 8-bit Freeside denim otaku sign boy neon warp long-chain hydrocarbons car.
                            Qui excepteur laborum ea est culpa reprehenderit enim ex amet veniam excepteur. Minim aliqua amet reprehenderit id velit id dolor quis et ea anim in. Cillum nisi ex incididunt id adipisicing reprehenderit id dolor qui anim non velit. Laboris esse ex duis sit labore culpa quis duis. Irure tempor deserunt et velit labore excepteur pariatur aute adipisicing eu do cupidatat nisi. Cupidatat officia aliquip excepteur Lorem in. Cillum amet enim anim do ut do adipisicing excepteur proident aute.
                        </p>
                    </div>
                    <div class="case-tile-teaser__goto">
                        <span class="link-teaser">zum Projekt</span>
                    </div>
                </div>
            </a>
            <a href="#" class="case-tile-teaser case-tile-teaser-bg-image-demo">
                <div class="case-tile-teaser__content">
                    <div class="case-tile-teaser__body">
                        <h2 class="case-tile-teaser__caption">Case Study</h2>
                        <h2 class="case-tile-teaser__headline">Dies ist eine Headline</h2>
                        <p class="case-tile-teaser__text">
                            Lorem gibson 8-bit Freeside denim otaku sign boy neon warp long-chain hydrocarbons car.
                        </p>
                    </div>
                    <div class="case-tile-teaser__goto">
                        <span class="link-teaser">zum Projekt</span>
                    </div>
                </div>
            </a>
        </div>

        <div class="blocks">
            <a href="#" class="case-tile-teaser case-tile-teaser--sm case-tile-teaser-bg-image-demo">
                <div class="case-tile-teaser__content case-tile-teaser__content--sm">
                    <div class="case-tile-teaser__body">
                        <h2 class="case-tile-teaser__caption">Case Study</h2>
                        <h2 class="case-tile-teaser__headline case-tile-teaser__headline--sm">Dies ist eine Headline</h2>
                        <p class="case-tile-teaser__text case-tile-teaser__text--sm">
                            Lorem gibson 8-bit Freeside denim otaku sign boy neon warp long-chain hydrocarbons car.
                        </p>
                    </div>
                    <div class="case-tile-teaser__goto">
                        <span class="link-teaser">zum Projekt</span>
                    </div>
                </div>
            </a>
            <a href="#" class="case-tile-teaser case-tile-teaser--sm case-tile-teaser-bg-image-demo">
                <div class="case-tile-teaser__content case-tile-teaser__content--sm">
                    <div class="case-tile-teaser__body">
                        <h2 class="case-tile-teaser__caption">Case Study</h2>
                        <h2 class="case-tile-teaser__headline case-tile-teaser__headline--sm">Dies ist eine Headline</h2>
                        <p class="case-tile-teaser__text case-tile-teaser__text--sm">
                            Lorem gibson 8-bit Freeside denim otaku sign boy neon warp long-chain hydrocarbons car.
                        </p>
                    </div>
                    <div class="case-tile-teaser__goto">
                        <span class="link-teaser">zum Projekt</span>
                    </div>
                </div>
            </a>
            <a href="#" class="case-tile-teaser case-tile-teaser--sm case-tile-teaser-bg-image-demo">
                <div class="case-tile-teaser__content case-tile-teaser__content--sm">
                    <div class="case-tile-teaser__body">
                        <h2 class="case-tile-teaser__caption">Case Study</h2>
                        <h2 class="case-tile-teaser__headline case-tile-teaser__headline--sm">Dies ist eine Headline</h2>
                        <p class="case-tile-teaser__text case-tile-teaser__text--sm">
                            Lorem gibson 8-bit Freeside denim otaku sign boy neon warp long-chain hydrocarbons car.
                        </p>
                    </div>
                    <div class="case-tile-teaser__goto">
                        <span class="link-teaser">zum Projekt</span>
                    </div>
                </div>
            </a>
        </div>
    </div>


    <div class="page-layout--grid">
        <div class="center">
            <h2 class="teaser-section-heading">Projektliste</h2>
            <div class="project-index__entry">
                <header class="project-index__header">
                    <h1 class="project-index__title">A</h1>
                </header>
                <ul class="project-index__client-projects client-projects">
                    <li class="client-projects__client">
                        <header class="client-projects__header">
                            <h1 class="client-projects__client-name">Allianz</h1>
                        </header>
                        <div class="client-projects__project">
                            <div class="client-projects__intro">
                                <h2 class="client-projects__project-title">Frische neue Ideen</h2>
                                <p class="client-projects__intro-text">Dolor commodo dolor id consequat elit cillum tempor ad culpa ipsum ea sint. Minim anim esse proident sint sit laborum tempor dolore cillum aliqua aliqua. Nisi ipsum deserunt minim commodo est ut aliqua.</p>
                            </div>
                            <a href="#" class="link-teaser client-projects__goto-btn">zum Projekt</a>
                        </div>
                        <div class="client-projects__project">
                            <div class="client-projects__intro">
                                <h2 class="client-projects__project-title">Meteoriteneinschlag in der IT</h2>
                                <p class="client-projects__intro-text">Dolor commodo dolor id consequat elit cillum tempor dolore cillum aliqua aliqua.</p>
                            </div>
                            <multi-toggler aria-hidden="true" class="collapse-toggler client-projects__show-more-btn" data-target-next data-toggle-class="sr-only" data-toggle-self-class="collapsed" data-toggle-on-init>
                                <span class="collapse-toggler__flop">mehr anzeigen <img src={context.app.uri('assets/plus-red.svg')} /></span>
                                <span class="collapse-toggler__flip">weniger anzeigen <img src={context.app.uri('assets/minus-red.svg')} /></span>
                            </multi-toggler>
                            <p class="client-projects__text">Ipsum ex nisi cillum voluptate qui sunt voluptate nostrud consequat adipisicing in occaecat sit qui. Irure excepteur tempor eu consectetur proident laborum commodo ullamco deserunt excepteur culpa. Excepteur dolore ad veniam et in culpa dolore irure aliqua. Ea fugiat minim cillum exercitation. Culpa ex nulla id consequat pariatur quis non veniam qui consequat ipsum cillum. Sint eiusmod nulla veniam mollit sunt cillum ea adipisicing adipisicing laborum quis ea aliqua. Et sit mollit aliqua irure minim do deserunt proident consectetur consequat.</p>
                        </div>
                    </li>
                    <li class="client-projects__client">
                        <header class="client-projects__header">
                            <h1 class="client-projects__client-name">AXA</h1>
                        </header>
                        <div class="client-projects__project">
                            <div class="client-projects__intro">
                                <h2 class="client-projects__project-title">Benutzerfreundlich und Agil</h2>
                                <p class="client-projects__intro-text">Dolor commodo dolor id consequat elit cillum tempor ad culpa ipsum ea sint. Minim anim esse proident sint sit laborum tempor dolore cillum aliqua aliqua. Nisi ipsum deserunt minim commodo est ut aliqua.</p>
                            </div>
                            <a href="#" class="link-teaser client-projects__goto-btn">zum Projekt</a>
                        </div>
                    </li>
                </ul>
            </div>

            <div class="project-index__entry">
                <header class="project-index__header">
                    <h1 class="project-index__title">B</h1>
                </header>
                <ul class="project-index__client-projects client-projects">
                    <li class="client-projects__client">
                        <header class="client-projects__header">
                            <h1 class="client-projects__client-name">Client</h1>
                        </header>
                        <div class="client-projects__project">
                            <div class="client-projects__intro">
                                <h2 class="client-projects__project-title">A very nice project</h2>
                                <p class="client-projects__intro-text">Dolor commodo dolor id consequat elit cillum tempor ad culpa ipsum ea sint. Minim anim esse proident sint sit laborum tempor dolore cillum aliqua aliqua. Nisi ipsum deserunt minim commodo est ut aliqua.</p>
                            </div>
                            <a href="#" class="link-teaser client-projects__goto-btn">zum Projekt</a>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>


</div>
/* No context defined for this component. */

There are no notes for this item.