<header class="header js--navigation" id="header">
<div class="header--inner base__centered">
<p class="header--claim" id="header--title">
Deutscher Ruderverband e.V.
</p>
<div class="header--logo">
<svg xmlns="http://www.w3.org/2000/svg" width="105" height="43" viewBox="0 0 105 43" aria-labelledby="header--title header--logo-desc" role="img">
<desc id="header--logo-desc">Logo des Deutschen Ruderverbands</desc>
<path d="M12.84,1C21.12,1,27,5.71,27,14.05c0,9.87-7.39,13.2-14.16,13.2H1V1ZM11.49,5.72h-4V22.48h4c4.48,0,8.82-1.91,8.82-8.43,0-6.2-4.14-8.34-8.82-8.34M71.68,1,65.16,15.82,58.28,1H51L63.73,27.34h3.06L78.66,1Zm-33,15.64H36.56V27.41H30V1H41.68c6.7,0,8.73,4.28,8.73,7.66,0,3.12-1.53,5-4.39,6.32,2,1.66,2.1,1.66,3.37,4.51L53,27.4H46l-2.36-4.8-2.21-4.4a2.69,2.69,0,0,0-2.77-1.57m1.28-10.9H36.56v6h3.37c2.66,0,3.73-1,3.73-3.11,0-1.52-1.07-2.93-3.73-2.93M103.2.36H105C95.1,21,64.67,51.25,0,40.91L1.5,39.5C68.7,47.78,95.32,14,103.2.36" style="fill: #ffffff" />
</svg>
</div>
<button class="header--navigation-trigger navigation--trigger">
<span class="navigation--trigger-label"></span>
<span class="navigation--trigger-deco"></span>
</button>
<div class="header--mobile-wrapper navigation--mobile-wrapper">
<nav class="header--navigation-meta navigation--meta">
<ul class="menu">
<li>
<a class="menu--item-link" href="#">
News
</a>
</li>
<li>
<a class="menu--item-link" href="#">
Termine
</a>
</li>
<li>
<a class="menu--item-link" href="#">
Mediathek
</a>
</li>
<li>
<a class="menu--item-link" href="#">
Presse
</a>
</li>
</ul>
</nav>
<nav class="header--navigation-main navigation--main">
<ul class="menu">
<li>
<a class="menu--item-link level-1" href="#">
Nationalmannschaft
</a>
</li>
<li>
<a class="menu--item-link level-1" href="#">
Wettkampfsport
</a>
</li>
<li>
<a class="menu--item-link level-1" href="#">
Breitensport
</a>
</li>
<li>
<a class="menu--item-link level-1" href="#">
Sportart Rudern
</a>
</li>
<li>
<a class="menu--item-link level-1" href="#">
Verband
</a>
</li>
</ul>
</nav>
</div>
</div>
</header>
<main class="base--main base__centered-wide">
<div class="base--content">
<div class="base__centered">
<div class="editor--content">
</div>
<div class="grid__3-8-4">
<div class="grid--column-1 editor--content">
</div>
<div class="grid--column-2 editor--content">
<h1>
Lorem ipsum dolor sit amet consectetur
</h1>
<p>
Ex tempore temporibus facere expedita maiores, culpa amet hic? Culpa mollitia quo quam aspernatur optio, error ex praesentium harum eaque.
</p>
<section class="content--section">
<h2 class="content--headline__aside">
Headline Aside
</h2>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellat quia minima, consequatur vel vitae, et deleniti repellendus corporis sapiente adipisci commodi eos officia aliquam aperiam repudiandae voluptatem nesciunt reprehenderit neque!
</p>
</section>
</div>
<div class="grid--column-3 editor--content">
</div>
</div>
</div>
</div>
</main>
<footer class="footer base--footer base__centered-wide">
<div class="footer--inner base__centered">
<nav class="footer--top navigation--footer-top">
<ul class="menu">
<li>
<a class="menu--item-link" href="#">
News
</a>
</li>
<li>
<a class="menu--item-link" href="#">
Termine
</a>
</li>
<li>
<a class="menu--item-link" href="#">
Mediathek
</a>
</li>
<li>
<a class="menu--item-link" href="#">
Presse
</a>
</li>
<li>
<a class="menu--item-link" href="#">
FAQ
</a>
</li>
<li>
<a class="menu--item-link" href="#">
Newsletter
</a>
</li>
</ul>
</nav>
<nav class="footer--bottom navigation--footer-bottom">
<ul class="menu">
<li>
<a class="menu--item-link" href="#">
Impressum
</a>
</li>
<li>
<a class="menu--item-link" href="#">
Rechtliche Hinweise
</a>
</li>
<li>
<a class="menu--item-link" href="#">
Datenschutz
</a>
</li>
<li>
<a class="menu--item-link" href="#">
Kontakt
</a>
</li>
</ul>
</nav>
</div>
</footer>
{{> @header }}
<main class="base--main base__centered-wide">
<div class="base--content">
<div class="base__centered">
<div class="editor--content">
</div>
<div class="grid__3-8-4">
<div class="grid--column-1 editor--content">
</div>
<div class="grid--column-2 editor--content">
<h1>
Lorem ipsum dolor sit amet consectetur
</h1>
<p>
Ex tempore temporibus facere expedita maiores, culpa amet hic? Culpa mollitia quo quam aspernatur optio, error ex praesentium harum eaque.
</p>
<section class="content--section">
<h2 class="content--headline__aside">
Headline Aside
</h2>
<p>
Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellat quia minima, consequatur vel vitae, et deleniti repellendus corporis sapiente adipisci commodi eos officia aliquam aperiam repudiandae voluptatem nesciunt reprehenderit neque!
</p>
</section>
</div>
<div class="grid--column-3 editor--content">
</div>
</div>
</div>
</div>
</main>
{{> @footer }}
{
"claim": "Deutscher Ruderverband e.V.",
"nav_header_items_meta": [
{
"label": "News",
"href": "#"
},
{
"label": "Termine",
"href": "#"
},
{
"label": "Mediathek",
"href": "#"
},
{
"label": "Presse",
"href": "#"
}
],
"nav_header_items_main": [
{
"label": "Nationalmannschaft",
"href": "#",
"level": "1"
},
{
"label": "Wettkampfsport",
"href": "#",
"level": "1"
},
{
"label": "Breitensport",
"href": "#",
"level": "1"
},
{
"label": "Sportart Rudern",
"href": "#",
"level": "1"
},
{
"label": "Verband",
"href": "#",
"level": "1"
}
],
"nav_footer_items_top": [
{
"label": "News",
"href": "#"
},
{
"label": "Termine",
"href": "#"
},
{
"label": "Mediathek",
"href": "#"
},
{
"label": "Presse",
"href": "#"
},
{
"label": "FAQ",
"href": "#"
},
{
"label": "Newsletter",
"href": "#"
}
],
"nav_footer_items_bottom": [
{
"label": "Impressum",
"href": "#"
},
{
"label": "Rechtliche Hinweise",
"href": "#"
},
{
"label": "Datenschutz",
"href": "#"
},
{
"label": "Kontakt",
"href": "#"
}
],
"nav_footer_items_social": [
{
"icon": "facebook",
"href": "#"
},
{
"icon": "twitter",
"href": "#"
},
{
"icon": "instagram",
"href": "#"
},
{
"icon": "youtube",
"href": "#"
}
]
}
Kann nur im Grid 3-8-4 verwendet werden.