Pagination

    

<nav aria-label="Pagination, currently on page 3">
    <ol class="c-pgn">

        <li class="c-pgn__item c-pgn__item--previous-group">
            <a href="#first" class="c-pgn__link">
                <span class="vh">First set of pages</span>
                <svg class="c-icon c-icon--pgn" aria-hidden="true" focusable="false">
                    <use xlink:href="/assets/icons/symbols.svg#icon--first"></use>
                </svg>
            </a>
        </li>
        <li class="c-pgn__item c-pgn__item--previous-page">
            <a href="#prev" class="c-pgn__link">
                <span class="vh">Previous page</span>
                <svg class="c-icon c-icon--pgn" aria-hidden="true" focusable="false">
                    <use xlink:href="/assets/icons/symbols.svg#icon--previous"></use>
                </svg>
            </a>
        </li>

        
        
            <li class="c-pgn__item ">
                <a href="#page1" class="c-pgn__link" >
                    <span class="vh">Page </span>1
                </a>
            </li>
        
        
            <li class="c-pgn__item ">
                <a href="#page2" class="c-pgn__link" >
                    <span class="vh">Page </span>2
                </a>
            </li>
        
        
            <li class="c-pgn__item  c-pgn__item--is-active ">
                <a href="#page3" class="c-pgn__link"  aria-current="page" >
                    <span class="vh">Page </span>3
                </a>
            </li>
        
        
            <li class="c-pgn__item ">
                <a href="#page4" class="c-pgn__link" >
                    <span class="vh">Page </span>4
                </a>
            </li>
        
        
            <li class="c-pgn__item ">
                <a href="#page5" class="c-pgn__link" >
                    <span class="vh">Page </span>5
                </a>
            </li>
        
        

        <li class="c-pgn__item c-pgn__item--next-page">
            <a href="#next" class="c-pgn__link">
                <span class="vh">Next page </span>
                <svg class="c-icon c-icon--pgn" aria-hidden="true" focusable="false">
                    <use xlink:href="/assets/icons/symbols.svg#icon--next"></use>
                </svg>
            </a>
        </li>
        <li class="c-pgn__item c-pgn__item--next-group">
            <a href="#last" class="c-pgn__link">
                <span class="vh">Last set of pages</span>
                <svg class="c-icon c-icon--pgn" aria-hidden="true" focusable="false">
                    <use xlink:href="/assets/icons/symbols.svg#icon--last"></use>
                </svg>
            </a>
        </li>

    </ol>
</nav>