<section class="view-mode-default content-wall paragraph">
  <h2 class="content-wall__title visuallyhidden">
    Row's title visually hidden
  </h2>
  <div class="clearfix cw-region">
    <div class="item-list">
      <ul>
        <li>
          <article class="block-content--view-mode-cw-l teaser-block teaser-block--bg-image clearfix">
            <a class="teaser-block__link" href="#">
              <div class="teaser-block__image">
                <img src="kss-assets/images/original-teaser-1170-658.jpg" alt="test">
              </div>
              <div class="teaser-block__body bg--white">
                <div class="cr-body">
                  <h4>Get ideas, tips and tools to help you fundraise</h4>
                  <div class="teaser-block__cta">
                    <span class="btn btn--red">Pre-order a Kit</span>
                  </div>
                </div>
              </div>
            </a>
          </article>
        </li>
      </ul>
    </div>
  </div>
</section>
<section class="view-mode-default content-wall paragraph">
  <h2 class="content-wall__title visuallyhidden">
    Row's title visually hidden
  </h2>
  <div class="clearfix cw-region">
    <div class="item-list">
      <ul>
        <li>
          <article class="contextual-region block-content block-content--type-content-reference-block block-content--view-mode-cw-m content-block clearfix">
            <div class="content-block__image">
              <div class="media media--blazy  media--responsive media--image">
                <picture>
                  <img property="schema:image" class="media__image media__element b-lazy b-responsive b-loaded" src="kss-assets/images/original-teaser-1170-658.jpg" alt="Red nose day" typeof="foaf:Image">
                </picture>
              </div>
            </div>
            <div class="content-block__content-wrapper">
              <div class="content-block__content">
                <span class="content-block__tag font--yellow font--font-black">News</span>
                <h4>
                  Red Nose Day is coming soon to BBC One
                </h4>
              </div>
            </div>
            <a href="#" class="content-block__link" hreflang="en">Read more</a>
          </article>
        </li>
        <li>
          <article class="block-content--view-mode-cw-m teaser-block clearfix">
            <a class="teaser-block__link" href="#">
              <div class="teaser-block__image">
                <img src="kss-assets/images/original-teaser-1170-658.jpg" alt="test">
              </div>
              <div class="teaser-block__body bg--white">
                <div class="cr-body">
                  <h4>Get ideas, tips and tools to help you fundraise</h4>
                  <div class="teaser-block__cta">
                    <span class="btn btn--red">Pre-order a Kit</span>
                  </div>
                </div>
              </div>
            </a>
          </article>
        </li>
      </ul>
    </div>
  </div>
</section>
<section class="view-mode-default content-wall paragraph">
  <h2 class="content-wall__title visuallyhidden">
    Row's title visually hidden
  </h2>
  <div class="clearfix cw-region">
    <div class="item-list">
      <ul>
        <li>
          <article class="block-content--view-mode-cw-s cw-quote clearfix">
            <div class="cw-quote__outer-wrapper">
              <div class="cw-quote__bg-image">
                <img src="kss-assets/images/pattern.gif" alt="test" typeof="foaf:Image">
              </div>
              <div class="cw-quote__inner-wrapper">
                <div class="cw-quote__image bg--purple">
                  <img src="kss-assets/images/silhouette.png" alt="test" typeof="foaf:Image">
                </div>
                <div class="cw-quote__body">
                  <h3 class="font--yellow">Jo's Top Tip</h3>
                  <h4 class="font--yellow">Top-up your fundraising total with a classic, pay-to-play, 'guess the weight of the cake' competition.</h4>
                </div>
              </div>
            </div>
          </article>
        </li>
        <li>
          <article class="contextual-region block-content block-content--type-media-reference block-content--view-mode-cw-mp media-block clearfix">
            <div class="media-block__image">
              <div class="media media--blazy  media--responsive media--image">
                <picture>
                  <img class="media__image media__element b-lazy b-responsive b-loaded" src="kss-assets/images/original-teaser-1170-658.jpg" alt="Video background" typeof="foaf:Image">
                </picture>
              </div>
            </div>
            <div class="media-block__content-wrapper">
              <div class="media-block__content">
                <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="play-icon" viewBox="0 0 40 40" xml:space="preserve">
                  <path d="M20,2c9.9,0,18,8.1,18,18s-8.1,18-18,18S2,29.9,2,20S10.1,2,20,2 M20,0C9,0,0,9,0,20s9,20,20,20
                    s20-9,20-20S31,0,20,0L20,0z"></path>
                  <path d="M15.8,14l10.3,6l-10.3,6V14 M13.8,10.6v18.8L30.1,20L13.8,10.6L13.8,10.6z"></path>
                </svg>
                <div class="cr-body">
                  <h4>Relive all the best bits of last Red Nose Day</h4>
                  <p class="font--yellow"><strong>20:20</strong></p>
                </div>
              </div>
            </div>
            <a class="media-block__link" data-rel="lightcase" href="https://www.youtube.com/embed/NW12S4-KB1I?autoplay=1">media block</a>
            <div class="media-block__caption">
              <div class="cr-body">
                <p>Raymond used to work in a mine, with no time to go to school. Now, thanks to you, he’s getting an education. To help us change more lives, simply raise cash by having fun.</p>
                <p><a class="btn btn--red" href="#">See how to join in</a></p>
              </div>
            </div>
          </article>
        </li>
      </ul>
    </div>
  </div>
</section>
<section class="view-mode-default content-wall paragraph">
  <h2 class="content-wall__title">
    Row's title can be hidden
  </h2>
  <div class="clearfix cw-region">
    <div class="item-list">
      <ul>
        <li>
          <article class="block-content--view-mode-cw-s teaser-block clearfix">
            <a class="teaser-block__link" href="#">
              <div class="teaser-block__image">
                <img src="kss-assets/images/original-teaser-1170-658.jpg" alt="test">
              </div>
              <div class="teaser-block__body bg--white">
                <h4>Get ideas, tips and tools to help you fundraise</h4>
                <div class="teaser-block__cta">
                  <span class="btn btn--red">Pre-order a Kit</span>
                </div>
              </div>
            </a>
          </article>
        </li>
        <li>
          <article class="contextual-region block-content block-content--type-media-reference block-content--view-mode-cw-s media-block clearfix">
            <div class="media-block__image">
              <div class="media media--blazy  media--responsive media--image">
                <picture>
                  <img class="media__image media__element b-lazy b-responsive b-loaded" src="kss-assets/images/original-teaser-1170-658.jpg" alt="Video background" typeof="foaf:Image">
                </picture>
              </div>
            </div>
            <div class="media-block__content-wrapper">
              <div class="media-block__content">
                <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" id="play-icon" viewBox="0 0 40 40" xml:space="preserve">
                  <path d="M20,2c9.9,0,18,8.1,18,18s-8.1,18-18,18S2,29.9,2,20S10.1,2,20,2 M20,0C9,0,0,9,0,20s9,20,20,20
                    s20-9,20-20S31,0,20,0L20,0z"></path>
                  <path d="M15.8,14l10.3,6l-10.3,6V14 M13.8,10.6v18.8L30.1,20L13.8,10.6L13.8,10.6z"></path>
                </svg>
                <div class="cr-body">
                  <h4>Relive all the best bits of last Red Nose Day</h4>
                  <p class="font--yellow"><strong>20:20</strong></p>
                </div>
              </div>
            </div>
            <a class="media-block__link" data-rel="lightcase" href="https://www.youtube.com/embed/NW12S4-KB1I?autoplay=1">media block</a>
            <div class="media-block__caption">
              <div class="cr-body">
                <p>Raymond used to work in a mine, with no time to go to school. Now, thanks to you, he’s getting an education. To help us change more lives, simply raise cash by having fun.</p>
                <p><a class="btn btn--red" href="#">See how to join in</a></p>
              </div>
            </div>
          </article>
        </li>
        <li>
          <article class="block-content--view-mode-cw-s cw-quote clearfix">
            <div class="cw-quote__outer-wrapper">
              <div class="cw-quote__bg-image">
                <img src="kss-assets/images/pattern.gif" alt="test" typeof="foaf:Image">
              </div>
              <div class="cw-quote__inner-wrapper">
                <div class="cw-quote__image bg--purple">
                  <img src="kss-assets/images/silhouette.png" alt="test" typeof="foaf:Image">
                </div>
                <div class="cw-quote__body">
                  <h3 class="font--yellow">Jo's Top Tip</h3>
                  <h4 class="font--yellow">Top-up your fundraising total with a classic, pay-to-play, 'guess the weight of the cake' competition.</h4>
                </div>
              </div>
            </div>
          </article>
        </li>
      </ul>
    </div>
  </div>
</section>