Headline 1
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate
Auch gibt es niemanden, der den Schmerz an sich liebt, sucht oder wünscht, nur, weil er Schmerz ist, es sei denn, es kommt zu zufälligen Umständen, in denen Mühen und Schmerz ihm große Freude bereiten können. Um ein triviales Beispiel zu nehmen, wer von uns unterzieht sich je anstrengender körperlicher
Weit hinten, hinter den Wortbergen, fern der Länder Vokalien und Konsonantien leben die Blindtexte. Abgeschieden wohnen sie in Buchstabhausen an der Küste des Semantik, eines großen Sprachozeans. Ein kleines Bächlein namens Duden fließt durch ihren Ort und versorgt sie mit den nötigen Regelialien. Es ist ein paradiesmatisches Land, in dem
Überall dieselbe alte Leier. Das Layout ist fertig, der Text lässt auf sich warten. Damit das Layout nun nicht nackt im Raume steht und sich klein und leer vorkommt, springe ich ein: der Blindtext. Genau zu diesem Zwecke erschaffen, immer im Schatten meines großen Bruders »Lorem Ipsum«, freue ich mich
teilen
tweet
Markup: templates/output/existingfiles/element_tab.html
<div class="page-container">
<header class="header theme--subpage-without-image">
<div class="top-bar">
<div class="container-fluid top-bar__container">
<a href="#">
<div class="top-bar__logo">
<img src="./Images/dzne_logo.svg">
</div>
</a>
<div class="top-bar__container only-mobile">
<div class="top-bar__container__mobile-languages">
<a href="#" class="active">DE</a>
<a href="#">EN</a>
</div>
<div class="top-bar__container__menu-toggle only-mobile" data-toggle="collapse" data-target="#navbarMobile" aria-controls="navbarMobile" aria-expanded="false" aria-label="Navigation">
<i class="fal fa-bars open"></i>
<i class="fal fa-times close"></i>
</div>
</div>
<nav class="top-bar__navigation navigation__main only-desktop">
<ul class="navigation__main__nav">
<li class="navigation__main__nav__item">
<a href="#">
Forschung
</a>
<div class="navigation__main__nav__item__sub navigation--dropdown theme--grey">
<ul class="navigation--dropdown__nav">
<li class="navigation--dropdown__nav__item has-dropdown">
<a href="#">
Forschungsbereiche
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Forschungsgruppen
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Studien
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Brain Bank
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Core Facilities
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Defeat PD
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Neuroimaging
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
PRECISE
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Kooperationen
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Publikationen
</a>
</li>
</ul>
</div>
</li>
<li class="navigation__main__nav__item active">
<a href="#">
Aktuelles
</a>
<div class="navigation__main__nav__item__sub navigation--dropdown theme--grey">
<ul class="navigation--dropdown__nav">
<li class="navigation--dropdown__nav__item">
<a href="#">
Veranstaltungen
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Presse
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Im Fokus
</a>
</li>
</ul>
</div>
</li>
<li class="navigation__main__nav__item">
<a href="#">
Spenden
</a>
</li>
<li class="navigation__main__nav__item">
<a href="#">
Über uns
</a>
<div class="navigation__main__nav__item__sub navigation--dropdown theme--grey">
<ul class="navigation--dropdown__nav">
<li class="navigation--dropdown__nav__item">
<a href="#">
Vorstand
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Standorte
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Administration
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Organisation
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Technologietransfer
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Betriebsrat
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Beauftragter für Medizinproduktesicherheit
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Ausschreibungen / Veröffentlichungen
</a>
</li>
<li class="navigation--dropdown__nav__item">
<a href="#">
Info-Hotline
</a>
</li>
</ul>
</div>
</li>
<li class="navigation__main__nav__item navigation__main__nav__item--external">
<a href="#">
Karriere
</a>
</li>
</ul>
</nav>
<div class="top-bar__right only-desktop">
<div class="top-bar__right__languages">
<a href="#" class="active">DE</a>
<a href="#">EN</a>
</div>
<div class="top-bar__right__search">
<form action="" class="search-bar">
<span class="search-trigger" id="search-trigger">
<i class="fal fa-search"></i>
</span>
<input class="search-bar__input" id="search-input" type="search" name="search" required>
<input type="submit" class="search-bar__button search-btn" />
</form>
</div>
</div>
</div>
</div>
<nav class="top-bar__navigation-mobile only-mobile">
<div class="top-bar__navigation-mobile--wrapper navigation-mobile__main">
<ul class="navigation-mobile__main__nav">
<li class="navigation-mobile__main__nav__item">
<a href="#">
Forschung
</a>
<div class="navigation-mobile__main__nav__item__sub navigation-mobile--dropdown theme--grey">
<ul class="navigation-mobile--dropdown__nav">
<li class="navigation-mobile--dropdown__nav__item has-dropdown">
<a href="#">
Übersicht
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item has-dropdown">
<a href="#">
Forschungsbereiche
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Forschungsgruppen
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Studien
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Brain Bank
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Core Facilities
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Defeat PD
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Neuroimaging
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
PRECISE
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Kooperationen
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Publikationen
</a>
</li>
</ul>
</div>
</li>
<li class="navigation-mobile__main__nav__item active">
<a href="#">
Aktuelles
</a>
<div class="navigation-mobile__main__nav__item__sub navigation-mobile--dropdown theme--grey">
<ul class="navigation-mobile--dropdown__nav">
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Veranstaltungen
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Presse
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Im Fokus
</a>
</li>
</ul>
</div>
</li>
<li class="navigation-mobile__main__nav__item">
<a href="#">
Spenden
</a>
</li>
<li class="navigation-mobile__main__nav__item">
<a href="#">
Über uns
</a>
<div class="navigation-mobile__main__nav__item__sub navigation-mobile--dropdown theme--grey">
<ul class="navigation-mobile--dropdown__nav">
<li class="navigation-mobile--dropdown__nav__item has-dropdown">
<a href="#">
Übersicht
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Vorstand
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Standorte
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Administration
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Organisation
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Technologietransfer
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Betriebsrat
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Beauftragter für Medizinproduktesicherheit
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Ausschreibungen / Veröffentlichungen
</a>
</li>
<li class="navigation-mobile--dropdown__nav__item">
<a href="#">
Info-Hotline
</a>
</li>
</ul>
</div>
</li>
<li class="navigation-mobile__main__nav__item navigation-mobile__main__nav__item--external">
<a href="#">
Karriere
</a>
</li>
<li class="navigation-mobile__main__nav__item navigation-mobile__main__nav__item--search">
<div class="navigation-mobile__main__nav__item__search">
<form action="" class="search-bar-mobile">
<span class="search-trigger" id="search-trigger">
<i class="fal fa-search"></i>
</span>
<input class="search-bar-mobile__input" id="search-input" type="search" name="search" placeholder="Suchbegriff eingeben…" />
<input type="submit" class="search-bar-mobile__button search-btn" />
</form>
</div>
</li>
</ul>
</div>
</nav>
<div class="header__subnavigation desktop">
<div class="header__subnavigation__container container-fluid">
</div>
</div>
</header>
<div class="maincontent">
<div class="content-wrap-subpage">
<div class="container-fluid">
<div class="content-wrap">
<div class="row">
<div class="col-12">
<div class="main-column">
<div class="element--dzne-textimage">
<div class="element--dzne-textimage__textimage-container">
<h1 class="element--dzne-textimage__textimage-container__headline headline--1">
Headline 1
</h1>
</div>
</div>
</div>
</div>
<div class="col-12 col-lg-12">
<div class="main-column">
<div class="c-tabs" role="tablist">
<nav class="c-tabs__navigation">
<ul class="c-tabs__navigation-list">
<li class="c-tabs__navigation-list-item">
<button
class="c-tabs__navigation-trigger c-tabs__navigation-trigger--active"
aria-controls="tab-content-1"
aria-selected="false"
role="tab"
>
Principle Investigators
</button>
</li>
<li class="c-tabs__navigation-list-item">
<button
class="c-tabs__navigation-trigger"
aria-controls="tab-content-2"
aria-selected="false"
role="tab"
>
Facilities and Ressources
</button>
</li>
<li class="c-tabs__navigation-list-item">
<button
class="c-tabs__navigation-trigger"
aria-controls="tab-content-3"
aria-selected="false"
role="tab"
>
Projects
</button>
</li>
<li class="c-tabs__navigation-list-item">
<button
class="c-tabs__navigation-trigger"
aria-controls="tab-content-4"
aria-selected="false"
role="tab"
>
Publications
</button>
</li>
</ul>
</nav>
<div class="c-tabs__content-wrapper">
<div id="tab-content-1" class="c-tabs__content c-tabs__content--active">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Donec quam felis, ultricies nec, pellentesque eu, pretium quis, sem. Nulla consequat massa quis enim. Donec pede justo, fringilla vel, aliquet nec, vulputate
</div>
<div id="tab-content-2" class="c-tabs__content">
Auch gibt es niemanden, der den Schmerz an sich liebt, sucht oder wünscht, nur, weil er Schmerz ist, es sei denn, es kommt zu zufälligen Umständen, in denen Mühen und Schmerz ihm große Freude bereiten können. Um ein triviales Beispiel zu nehmen, wer von uns unterzieht sich je anstrengender körperlicher
</div>
<div id="tab-content-3" class="c-tabs__content">
Weit hinten, hinter den Wortbergen, fern der Länder Vokalien und Konsonantien leben die Blindtexte. Abgeschieden wohnen sie in Buchstabhausen an der Küste des Semantik, eines großen Sprachozeans. Ein kleines Bächlein namens Duden fließt durch ihren Ort und versorgt sie mit den nötigen Regelialien. Es ist ein paradiesmatisches Land, in dem
</div>
<div id="tab-content-4" class="c-tabs__content">
Überall dieselbe alte Leier. Das Layout ist fertig, der Text lässt auf sich warten. Damit das Layout nun nicht nackt im Raume steht und sich klein und leer vorkommt, springe ich ein: der Blindtext. Genau zu diesem Zwecke erschaffen, immer im Schatten meines großen Bruders »Lorem Ipsum«, freue ich mich
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Content Footer final START -->
<div class="content__footer">
<div class="content__footer__social-media">
<a class="facebook" href="#">
<img alt="Facebook" src="Images/icon_facebook.svg"/> teilen
</a>
<a class="twitter" href="#">
<img alt="Twitter" src="Images/icon_twitter.png"/> tweet
</a>
</div>
<div class="content__footer__meta">
<a class="print" href="javascript:window.print()"></a>
<a class="back-to-top" href="#"></a>
</div>
</div>
<!-- Content Footer final END -->
</div>
</div>
</div>
</div>
<section class="dynamic-footer dynamic-footer--small">
<div class="dynamic-footer__container container-fluid">
<div class="dynamic-footer__wrap">
<div class="dynamic-footer__row">
<div class="dynamic-footer--small__column dynamic-footer--small__column--probands">
<div class="dynamic-footer--small__column--probands__headline dynamic-footer__headline">
<h4>Probanden gesucht</h4>
<span class="icons">
<i class="fas fa-female"></i>
<i class="fas fa-male"></i>
</span>
</div>
<div class="dynamic-footer--small__column--probands__text dynamic-footer__text">
Unterstützen Sie unsere Forschung durch Ihre Studien-Teilnahme!
</div>
</div>
</div>
</div>
</div>
</section>
<footer class="footer">
<nav class="footer__navigation">
<ul class="footer__navigation__items">
<li class="footer__navigation__items__item">
<a href="#">Kontakt</a>
</li>
<li class="footer__navigation__items__item">
<a href="#">Impressum</a>
</li>
<li class="footer__navigation__items__item">
<a href="#">Datenschutz</a>
</li>
</ul>
</nav>
<div class="footer__bottomline">
<div class="container-fluid footer__bottomline__container">
<div class="footer__bottomline__icons">
<div class="footer__bottomline__icons__icon">
<a href="#">
<img src="Images/logo_helmholtz.svg" width="736" height="100"/>
</a>
</div>
<div class="footer__bottomline__icons__icon">
<a href="#">
<img src="Images/logo_dzg.png"/>
</a>
</div>
</div>
</div>
</div>
</footer>
<script src="Javascript/scripts.min.js"></script>
</div>
Source:
src/scss/_fullpage.scss, line 162