<section>
    <p class="u-md-hidden u-lg-hidden u-padding-r-all u-text-m u-background-grey-20">
        <span class="Icon-list u-text-r-xl u-alignMiddle u-padding-r-right" aria-hidden="true"></span>
        <a href="#subnav" class="js-scrollTo u-text-r-s u-textClean u-color-grey-50 u-alignMiddle">
      Esplora contenuti correlati
    </a>
    </p>

    <div class="u-layout-wide u-layoutCenter u-layout-withGutter u-padding-r-bottom u-padding-r-top">
        <nav aria-label="sei qui:" role="navigation">
            <ul class="Breadcrumb">
                <li class="Breadcrumb-item"><a class="Breadcrumb-link u-color-50" href="/">Home</a></li>
                <li class="Breadcrumb-item"><a class="Breadcrumb-link u-color-50" href="/">pagina interna</a></li>
                <li class="Breadcrumb-item"><a class="Breadcrumb-link u-color-50" href="/">pagina interna</a></li>
                <li class="Breadcrumb-item"><a class="Breadcrumb-link u-color-50" href="#main">pagina corrente</a></li>
            </ul>
        </nav>

    </div>

    <div class="u-layout-wide u-layoutCenter u-layout-withGutter u-padding-r-top u-padding-bottom-xxl">

        <h1 class="u-text-h2">
            Nome del servizio
        </h1>

        <div class="Grid Grid--withGutter">
            <div class="Grid-cell u-md-size8of12 u-lg-size8of12">
                <article class="Prose u-layout-prose">
                    <p>
                        Una breve descrizione del servizio. Pariatur qui dicta autem consectetur dicta. Reprehenderit tempora aperiam exercitationem fuga soluta quod. Est molestias est ut aliquid beatae recusandae harum. Reprehenderit beatae voluptate nemo debitis. Et dolor
                        qui omnis.
                    </p>
                    <p>
                        Questo servizio serve per:
                    </p>
                    <ul>
                        <li>fare qualcosa</li>
                        <li>verificare lo stato della propria pratica</li>
                    </ul>
                    <h2 class="u-text-h3">A chi è rivolto</h2>
                    <p>
                        Culpa mollitia itaque mollitia iusto nesciunt aliquid magnam. Unde quisquam quo est labore temporibus sed quisquam consequatur. Molestias est repellat ut at aut cumque ipsam. Sint eligendi omnis laborum iure neque molestiae. Esse in ut et totam quo distinctio.
                    </p>
                    <h2 class="u-text-h3">Come funziona</h2>
                    <p>
                        Maxime quae consequatur non. Et quam facere tempora. Deleniti excepturi expedita eum consectetur. Id reprehenderit distinctio excepturi labore eaque assumenda aut ea. Sint est hic numquam et rerum quo. Sit dignissimos voluptas exercitationem officiis
                        voluptatem sapiente sequi.
                    </p>
                    <h2 class="u-text-h3">Prima di iniziare</h2>
                    <p>
                        Accertati di aver già...
                        <ul>
                            <li>azione 1</li>
                            <li>azione 2</li>
                            <li>azione 3</li>
                        </ul>
                    </p>
                    <p>
                        <button type="button" class="Button Button--default u-text-r-xs">Accedi al servizio</button>
                    </p>
                </article>
            </div>

            <aside class="Grid-cell u-md-size4of12 u-lg-size4of12">
                <div class="u-cf u-padding-bottom-xxl u-hidden u-md-block u-lg-block">
                    <button type="button" class="Button Button--default u-text-r-xs">Accedi al servizio</button>
                </div>
                <h3 class="u-text-h4">Altri servizi</h3>
                <div class="u-sizeFull" id="subnav">
                    <ul class="Linklist Linklist--padded u-layout-prose u-text-r-xs">
                        <li>
                            <a class="Linklist-link Linklist-link--lev1" href="">Quia placeat aspernatur tempore vitae repellendus velit.</a>
                        </li>
                        <li><a class="Linklist-link Linklist-link--lev2 is-expanded" href="">Velit voluptatem expedita molestiae veritatis consectetur tempora.</a>
                            <ul>
                                <li><a href="" class="Linklist-link Linklist-link--lev3">Enim provident autem sint.</a></li>
                                <li><a href="">Et natus quia eos enim tempora.</a></li>
                                <li><a href="">Vitae harum est quasi.</a></li>
                                <li><a href="">Sint aut cum quae.</a></li>
                            </ul>
                        </li>
                        <li><a href="">Et alias porro eveniet velit ut aspernatur quo.</a></li>
                        <li><a href="">Nam est ex cum veritatis facilis ut voluptatem et.</a></li>
                        <li><a href="" class="Linklist-link is-collapsed">Voluptas laborum quis aliquam et consequatur.</a></li>
                        <li><a href="">Quos assumenda voluptatem debitis ducimus voluptatum.</a></li>
                    </ul>

                </div>
                <a href="#" title="torna all'inizio del contenuto" class="u-hiddenVisually">torna all'inizio del contenuto</a>
            </aside>
        </div>

    </div>
</section>

There are no notes for this item.