{{> shared/skip-link}}
<div class="o-layout o-layout--landing" data-o-component="o-layout">
    {{> shared/header}}

    <div class="o-layout__hero o-layout__hero--muted o-layout-typography">
        <h1>An Example Landing Page</h1>
        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit.</p>
    </div>

	<div id="o-layout-main-content" class="o-layout__main" data-o-component="o-syntax-highlight">
        <ul class="o-layout__listing">
            <li class="o-layout__listing__item">
                <h2 class="o-layout__listing__item__title">
                    <a href="#">Some Example Article</a>
                </h2>

                <p class="o-layout__listing__item__description">Lorem ipsum dolor sit amet consectetur adipisicing elit. Asperiores ipsum suscipit dolorum inventore ipsam perferendis omnis animi quo corrupti ad.</p>

                <p class="o-layout__listing__item__meta">
                    Posted <time datetime="2020-10-28T00:00:00Z">20 November 2020</time>
                    by Author Name. Tagged: <span>Newsletter</span>.
                </p>
            </li>

            <li class="o-layout__listing__item">
                <h2 class="o-layout__listing__item__title">
                    <a href="#">Lorem Ipsum Dolor Sit</a>
                </h2>

                <p class="o-layout__listing__item__description">Lorem ipsum dolor sit amet consectetur adipisicing elit. Minima culpa optio consequuntur dolorem, ab incidunt saepe quibusdam quae velit explicabo.</p>

                <p class="o-layout__listing__item__meta">
                    Posted <time datetime="2020-10-28T00:00:00Z">04 December 2019</time>
                    by Some Other Author Name. Tagged: <span>Technology</span>.
                </p>
            </li>

            <li class="o-layout__listing__item">
                <h2 class="o-layout__listing__item__title">
                    <a href="#">Aut Alias Voluptatem Quisquam</a>
                </h2>

                <p class="o-layout__listing__item__description">Lorem ipsum dolor sit amet consectetur adipisicing elit. Aut alias voluptatem quisquam laudantium voluptatum a vel saepe suscipit cum, velit aperiam reiciendis perspiciatis perferendis possimus corporis corrupti, voluptate mollitia dicta.</p>

                <p class="o-layout__listing__item__meta">
                    Posted <time datetime="2020-10-28T00:00:00Z">20 June 2019</time>
                    by Name Namerson. Tagged: <span>Design</span>.
                </p>
            </li>
        </ul>
	</div>

	{{> shared/footer}}
</div>