Area Headline

Lorem Ipsum Dolor Sit Amet

Lorem Ipsum Dolor Sit Amet

Area Headline M

Lorem Ipsum Dolor Sit Amet

Area Headline S

Lorem Ipsum Dolor Sit Amet

Area Headline Icon

<div class="area-headline">
	<h1 class="area-headline-main">Area Headline</h1>
	<h2 class="area-headline-sub">Lorem Ipsum Dolor Sit Amet</h2>
</div>

<div class="area-headline -m">
	<h3 class="area-headline-sub">Lorem Ipsum Dolor Sit Amet</h3>
	<h2 class="area-headline-main">Area Headline M</h2>
</div>

<div class="area-headline -s">
	<h3 class="area-headline-sub">Lorem Ipsum Dolor Sit Amet</h3>
	<h2 class="area-headline-main">Area Headline S</h2>
</div>

<div class="area-headline -icon" data-icon="&#xe007;">
	<h3 class="area-headline-sub">Lorem Ipsum Dolor Sit Amet</h3>
	<h2 class="area-headline-main">Area Headline Icon</h2>
</div>

Headline

Lorem: Headline M

Lorem: Headline M Prefix

Lorem: Headline S

Lorem: Headline S Prefix

Headline XS

Headline XXS

<h1 class="headline">Headline</h1>
<h1 class="headline -m"><em>Lorem:</em> Headline M</h1>
<h1 class="headline -m -prefix"><em>Lorem:</em> Headline M Prefix</h1>
<h1 class="headline -s"><em>Lorem:</em> Headline S</h1>
<h1 class="headline -s -prefix"><em>Lorem:</em> Headline S Prefix</h1>
<h1 class="headline -xs">Headline XS</h1>
<h1 class="headline -xxs">Headline XXS</h1>

Headline Alt

Headline Alt S

<h1 class="headline -alt">Headline Alt</h1>
<h1 class="headline -alt-s">Headline Alt S</h1>

Headline Fancy

<h1 class="headline -fancy">Headline Fancy</h1>