HTML

									
										<div class="layout-slat">
  <div class="layout-slat__header">
    <p style="background:#333;color:#fff;padding:1em">Header</p>
  </div>
  <div class="layout-slat__media">
    <p style="background:#333;color:#fff;padding:1em">Media</p>
  </div>
  <div class="layout-slat__content">
    <p style="background:#333;color:#fff;padding:1em">Content</p>
  </div>
</div>

									
								

HTML

									
										<div class="layout-slat layout-slat--reversed">
  <div class="layout-slat__header">
    <p style="background:#333;color:#fff;padding:1em">Header</p>
  </div>
  <div class="layout-slat__media">
    <p style="background:#333;color:#fff;padding:1em">Media</p>
  </div>
  <div class="layout-slat__content">
    <p style="background:#333;color:#fff;padding:1em">Content</p>
  </div>
</div>