<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">
            Titolo della sezione
        </h1>
        <div class="Grid Grid--withGutter">
            <div class="Grid-cell u-md-size8of12 u-lg-size8of12">
                <article class="Prose u-layout-prose">
                    <p>
                        Illo voluptates debitis omnis necessitatibus quaerat. Pariatur architecto cumque. Delectus eius fuga. Sequi voluptatibus voluptatum nisi rem aut. Amet perferendis est vitae est facere consequatur officiis praesentium. Id quas ut reprehenderit provident
                        porro qui odio delectus. Et odit atque doloribus alias aut facere pariatur. In corporis aspernatur aliquam et quibusdam id natus. Voluptatem eius aut vel vel aliquam sit. Voluptatem autem labore aut debitis rem quae delectus maxime
                        consequuntur. Voluptate et labore ratione.
                    </p>
                    <p>
                        Quae ut error veniam aspernatur occaecati. A eos amet assumenda placeat ut rerum autem quia est. Voluptatibus dolorem est deleniti debitis aperiam. Sed similique quam ut sunt tenetur in. Fuga totam eveniet accusamus. Quis est totam ipsa voluptatem repudiandae
                        laboriosam ab aspernatur porro. Perferendis nulla omnis deserunt ad esse eligendi. Sit tempore optio est enim non autem dicta. Cumque incidunt eum tenetur dolores ea quidem pariatur corrupti.
                    </p>
                    <p>
                        Sapiente magni in est et sed doloremque iste perferendis et. Voluptas ipsum aliquid. Fugit et odit et sunt et veritatis. Ratione rem dolore laudantium dolor doloribus aut assumenda eveniet aspernatur. Quia consectetur delectus. Soluta enim asperiores.
                        Rerum odit non fuga aut libero odit aut nisi quo. Eligendi quasi minus quis. Iste quasi nulla assumenda. Earum quo sunt doloribus pariatur quia distinctio voluptatem quo. Aperiam enim numquam. Dolores ipsam enim unde autem quia
                        explicabo laudantium et et. Nihil accusamus eum recusandae. Ad quia recusandae dolor qui aut voluptates voluptates ratione. Voluptatem aperiam quis nemo atque nemo nesciunt aut corrupti. Ut doloremque quia tenetur voluptatem consequuntur
                        expedita.
                    </p>
                </article>
            </div>
            <div class="Grid-cell u-sizeFull u-md-size4of12 u-lg-size4of12">
                <div class="u-cf u-padding-bottom-xxl">
                    <div class="Share">
                        <div class="Share-reveal js-Share">
                            <a href="#share-options" class="Share-revealText" data-menu-trigger="share-options" data-menu-inline>
      <span class="Share-revealIcon Icon Icon-share"></span>
      Condividi
    </a>
                        </div>
                        <ul id="share-options" class="Dropdown-menu" data-menu>
                            <li><a href="#" title=""><span class="Icon Icon-facebook"></span><span class="u-hiddenVisually">Facebook</span></a></li>
                            <li><a href="#"><span class="Icon Icon-twitter"></span><span class="u-hiddenVisually">Twitter</span></a></li>
                            <li><a href="#"><span class="Icon Icon-googleplus"></span><span class="u-hiddenVisually">Google Plus</span></a></li>
                            <li><a href="#"><span class="Icon Icon-youtube"></span><span class="u-hiddenVisually">Youtube</span></a></li>
                            <li><a href="#"><span class="Icon Icon-flickr"></span><span class="u-hiddenVisually">Flickr</span></a></li>
                            <li><a href="#"><span class="Icon Icon-slideshare"></span><span class="u-hiddenVisually">Slideshare</span></a></li>
                            <li><a href="#"><span class="Icon Icon-whatsapp"></span><span class="u-hiddenVisually">Whatsapp</span></a></li>
                        </ul>
                    </div>

                </div>
                <div class="u-sizeFull u-md-size11of12 u-lg-size11of12" id="subnav">
                    <ul class="Linklist Linklist--padded u-layout-prose u-text-r-xs">
                        <li>
                            <a class="Linklist-link Linklist-link--lev1" href="">Tempore voluptatem ut aut.</a>
                        </li>
                        <li><a class="Linklist-link Linklist-link--lev2 is-expanded" href="">A architecto qui et veritatis.</a>
                            <ul>
                                <li><a href="" class="Linklist-link Linklist-link--lev3">Sequi quo rerum velit saepe.</a></li>
                                <li><a href="">Rerum est laborum quis distinctio.</a></li>
                                <li><a href="">Praesentium beatae totam iste atque sit quae.</a></li>
                                <li><a href="">Dolores et itaque voluptas quas laudantium molestias.</a></li>
                            </ul>
                        </li>
                        <li><a href="">Aut exercitationem magni minus eum temporibus.</a></li>
                        <li><a href="">Officiis dolores dolore.</a></li>
                        <li><a href="" class="Linklist-link is-collapsed">Iusto inventore asperiores deserunt eum est ut dolores.</a></li>
                        <li><a href="">Exercitationem quia deserunt sequi.</a></li>
                    </ul>

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