<div class="search-results">

    <header class="search-results__header">

        <span class="search-results__count">123 results</span>

    </header>

    <ul class="list-bare">

        <li>

            <a class="search-result" href="#link-to-page">

                <span class="search-result__category">Content type</span>

                <h2 class="search-result__title">Fusce vehicula dolor arcu, sit amet blandit</h2>

                <p class="search-result__description">…estibulum rutrum quam vitae <strong>iaculis</strong> fringilla tincidunt. Suspendisse nec tortor urna. Ut laoreet sodales nisi, quis <strong>iaculis</strong> nulla <strong>iaculis</strong> vitae. Donec sagittis faucibus lacus eget
                    blandit. Mauris vitae ultricies metus, at condimentum nulla. Donec quis ornare lacus. Etiam gravida mollis <strong>iaculis</strong> tortor quis porttitor…</p>

            </a>

        </li>

        <li>

            <a class="search-result" href="#link-to-page">

                <span class="search-result__category">Content type</span>

                <h2 class="search-result__title">Fusce vehicula dolor arcu, sit amet blandit</h2>

                <p class="search-result__description">…estibulum rutrum quam vitae <strong>iaculis</strong> fringilla tincidunt. Suspendisse nec tortor urna. Ut laoreet sodales nisi, quis <strong>iaculis</strong> nulla <strong>iaculis</strong> vitae. Donec sagittis faucibus lacus eget
                    blandit. Mauris vitae ultricies metus, at condimentum nulla. Donec quis ornare lacus. Etiam gravida mollis <strong>iaculis</strong> tortor quis porttitor…</p>

            </a>

        </li>

        <li>

            <a class="search-result" href="#link-to-page">

                <span class="search-result__category">Content type</span>

                <h2 class="search-result__title">Fusce vehicula dolor arcu, sit amet blandit</h2>

                <p class="search-result__description">…estibulum rutrum quam vitae <strong>iaculis</strong> fringilla tincidunt. Suspendisse nec tortor urna. Ut laoreet sodales nisi, quis <strong>iaculis</strong> nulla <strong>iaculis</strong> vitae. Donec sagittis faucibus lacus eget
                    blandit. Mauris vitae ultricies metus, at condimentum nulla. Donec quis ornare lacus. Etiam gravida mollis <strong>iaculis</strong> tortor quis porttitor…</p>

            </a>

        </li>

        <li>

            <a class="search-result" href="#link-to-page">

                <span class="search-result__category">Content type</span>

                <h2 class="search-result__title">Fusce vehicula dolor arcu, sit amet blandit</h2>

                <p class="search-result__description">…estibulum rutrum quam vitae <strong>iaculis</strong> fringilla tincidunt. Suspendisse nec tortor urna. Ut laoreet sodales nisi, quis <strong>iaculis</strong> nulla <strong>iaculis</strong> vitae. Donec sagittis faucibus lacus eget
                    blandit. Mauris vitae ultricies metus, at condimentum nulla. Donec quis ornare lacus. Etiam gravida mollis <strong>iaculis</strong> tortor quis porttitor…</p>

            </a>

        </li>

        <li>

            <a class="search-result" href="#link-to-page">

                <span class="search-result__category">Content type</span>

                <h2 class="search-result__title">Fusce vehicula dolor arcu, sit amet blandit</h2>

                <p class="search-result__description">…estibulum rutrum quam vitae <strong>iaculis</strong> fringilla tincidunt. Suspendisse nec tortor urna. Ut laoreet sodales nisi, quis <strong>iaculis</strong> nulla <strong>iaculis</strong> vitae. Donec sagittis faucibus lacus eget
                    blandit. Mauris vitae ultricies metus, at condimentum nulla. Donec quis ornare lacus. Etiam gravida mollis <strong>iaculis</strong> tortor quis porttitor…</p>

            </a>

        </li>

        <li>

            <a class="search-result" href="#link-to-page">

                <span class="search-result__category">Content type</span>

                <h2 class="search-result__title">Fusce vehicula dolor arcu, sit amet blandit</h2>

                <p class="search-result__description">…estibulum rutrum quam vitae <strong>iaculis</strong> fringilla tincidunt. Suspendisse nec tortor urna. Ut laoreet sodales nisi, quis <strong>iaculis</strong> nulla <strong>iaculis</strong> vitae. Donec sagittis faucibus lacus eget
                    blandit. Mauris vitae ultricies metus, at condimentum nulla. Donec quis ornare lacus. Etiam gravida mollis <strong>iaculis</strong> tortor quis porttitor…</p>

            </a>

        </li>

        <li>

            <a class="search-result" href="#link-to-page">

                <span class="search-result__category">Content type</span>

                <h2 class="search-result__title">Fusce vehicula dolor arcu, sit amet blandit</h2>

                <p class="search-result__description">…estibulum rutrum quam vitae <strong>iaculis</strong> fringilla tincidunt. Suspendisse nec tortor urna. Ut laoreet sodales nisi, quis <strong>iaculis</strong> nulla <strong>iaculis</strong> vitae. Donec sagittis faucibus lacus eget
                    blandit. Mauris vitae ultricies metus, at condimentum nulla. Donec quis ornare lacus. Etiam gravida mollis <strong>iaculis</strong> tortor quis porttitor…</p>

            </a>

        </li>

        <li>

            <a class="search-result" href="#link-to-page">

                <span class="search-result__category">Content type</span>

                <h2 class="search-result__title">Fusce vehicula dolor arcu, sit amet blandit</h2>

                <p class="search-result__description">…estibulum rutrum quam vitae <strong>iaculis</strong> fringilla tincidunt. Suspendisse nec tortor urna. Ut laoreet sodales nisi, quis <strong>iaculis</strong> nulla <strong>iaculis</strong> vitae. Donec sagittis faucibus lacus eget
                    blandit. Mauris vitae ultricies metus, at condimentum nulla. Donec quis ornare lacus. Etiam gravida mollis <strong>iaculis</strong> tortor quis porttitor…</p>

            </a>

        </li>

        <li>

            <a class="search-result" href="#link-to-page">

                <span class="search-result__category">Content type</span>

                <h2 class="search-result__title">Fusce vehicula dolor arcu, sit amet blandit</h2>

                <p class="search-result__description">…estibulum rutrum quam vitae <strong>iaculis</strong> fringilla tincidunt. Suspendisse nec tortor urna. Ut laoreet sodales nisi, quis <strong>iaculis</strong> nulla <strong>iaculis</strong> vitae. Donec sagittis faucibus lacus eget
                    blandit. Mauris vitae ultricies metus, at condimentum nulla. Donec quis ornare lacus. Etiam gravida mollis <strong>iaculis</strong> tortor quis porttitor…</p>

            </a>

        </li>

        <li>

            <a class="search-result" href="#link-to-page">

                <span class="search-result__category">Content type</span>

                <h2 class="search-result__title">Fusce vehicula dolor arcu, sit amet blandit</h2>

                <p class="search-result__description">…estibulum rutrum quam vitae <strong>iaculis</strong> fringilla tincidunt. Suspendisse nec tortor urna. Ut laoreet sodales nisi, quis <strong>iaculis</strong> nulla <strong>iaculis</strong> vitae. Donec sagittis faucibus lacus eget
                    blandit. Mauris vitae ultricies metus, at condimentum nulla. Donec quis ornare lacus. Etiam gravida mollis <strong>iaculis</strong> tortor quis porttitor…</p>

            </a>

        </li>

    </ul>

    <ul class="search-pagination">

        <li class="search-pagination__item  search-pagination__item--step">

            <a class="search-pagination__control" href="#link-to-previous-results">

                <svg class="svg-icon svg-icon--inline" xmlns="http://www.w3.org/2000/svg" title="Previous results">

                    <title>Previous results</title>

                    <use xlink:href="#svg-icon-chevron-left" />

                </svg>

            </a>

        <!-- /li -->

        <li class="search-pagination__item search-pagination__item--link">

            <a class="search-pagination__control" href="#link-to-page-1">

                1

            </a>

        <!-- /li -->

        <li class="search-pagination__item search-pagination__item--link">

            <a class="search-pagination__control" href="#link-to-page-2">

                2

            </a>

        <!-- /li -->

        <li class="search-pagination__item">

            <span class="search-pagination__control  search-pagination__control--active">

                3

            </span>

        <!-- /li -->

        <li class="search-pagination__item search-pagination__item--link">

            <a class="search-pagination__control" href="#link-to-page-4">

                4

            </a>

        <!-- /li -->

        <li class="search-pagination__item search-pagination__item--link">

            <a class="search-pagination__control" href="#link-to-page-5">

                5

            </a>

        <!-- /li -->

        <li class="search-pagination__item  search-pagination__item--step">

            <a class="search-pagination__control" href="#link-to-next-results">

                <svg class="svg-icon svg-icon--inline" xmlns="http://www.w3.org/2000/svg" title="Next results">

                    <title>Next results</title>

                    <use xlink:href="#svg-icon-chevron-right" />

                </svg>

            </a>

        <!-- /li -->

    </ul>

</div>

There are no notes for this item.