Centurion Grid Sample - 50% x 50% grid elements. Useful for creating a ping pong effect of image, text, text image.

centurion-grid-50x50-ping-pong.html

<div class="grid-50">
  <img src="http://placehold.it/450x300" class="responsive" alt="description of image" />
</div>
<div class="grid-50">
  <h2>Subheading</h2>
  <p>Description about the subheading with a link to the page</p>
</div>

<!-- clear the line -->
<div class="clear"></div>

<div class="grid-50 push-50">
  <img src="http://placehold.it/450x300" class="responsive" alt="description of image" />
</div>
<div class="grid-50 pull-50">
  <h2>Subheading</h2>
  <p>Description about the subheading with a link to the page</p>
</div>

<!-- clear the line -->
<div class="clear"></div>

<div class="grid-50">
  <img src="http://placehold.it/450x300" class="responsive" alt="description of image" />
</div>
<div class="grid-50">
  <h2>Subheading</h2>
  <p>Description about the subheading with a link to the page</p>
</div>

<!-- clear the line -->
<div class="clear"></div>

<div class="grid-50 push-50">
  <img src="http://placehold.it/450x300" class="responsive" alt="description of image" />
</div>
<div class="grid-50 pull-50">
  <h2>Subheading</h2>
  <p>Description about the subheading with a link to the page</p>
</div>

<!-- clear the line -->
<div class="clear"></div>