<section class="Grid">

    <div class="Grid-cell u-sizeFull u-md-size1of2 u-lg-size1of2 u-text-r-s u-padding-r-all">
        <div class="Grid Grid--fit u-margin-r-bottom">
            <p class="Grid-cell">
                <span class="Dot u-background-50"></span>
                <strong><a class="u-textClean u-text-r-xs" href="">La categoria</a></strong>
            </p>
            <p class="Grid-cell u-textSecondary">
                12 Dicembre 2012
            </p>
        </div>
        <div class="u-text-r-l u-layout-prose">
            <h2 class="u-text-h2 u-margin-r-bottom">
                <a class="u-text-h2 u-textClean u-color-black" href="">
          Earum rem culpa
        </a>
            </h2>
            <p class="u-textSecondary u-lineHeight-l">
                A architecto qui et veritatis. Sequi quo rerum velit saepe. Rerum est laborum quis distinctio. Praesentium beatae totam iste atque sit quae.
            </p>
        </div>
    </div>

    <div class="Grid-cell u-sizeFull u-md-size1of2 u-lg-size1of2 u-text-r-s u-padding-r-all">
        <img src="//placehold.it/680x480?text=placeholder" class="u-sizeFull" alt="..." />
    </div>

</section>