Grids

You can use this grid system for column layouts in the main content area and functional footer.

Two Column Grid

1 of 2
1 of 2

Three Column Grid

1 of 3
1 of 3
1 of 3
1 of 3
2 of 3

Four Column Grid

1 of 4
1 of 4
1 of 4
1 of 4
1 of 4
3 of 4
<h2>Two Column Grid</h2>
<div class="section group">
<div class="col span_1_of_2 mobile_full">1 of 2</div>
<div class="col span_1_of_2 mobile_full">1 of 2</div>
</div>

<h2>Three Column Grid</h2>
<div class="section group">
<div class="col span_1_of_3 mobile_full">1 of 3</div>
<div class="col span_1_of_3 mobile_full">1 of 3</div>
<div class="col span_1_of_3 mobile_full">1 of 3</div>
</div>
<div class="section group">
<div class="col span_1_of_3 mobile_full">1 of 3</div>
<div class="col span_2_of_3 mobile_full">2 of 3</div>
</div>

<h2>Four Column Grid</h2>
<div class="section group">
<div class="col span_1_of_4 mobile_full">1 of 4</div>
<div class="col span_1_of_4 mobile_full">1 of 4</div>
<div class="col span_1_of_4 mobile_full">1 of 4</div>
<div class="col span_1_of_4 mobile_full">1 of 4</div>
</div>
<div class="section group">
<div class="col span_1_of_4 mobile_full">1 of 4</div>
<div class="col span_3_of_4 mobile_full">3 of 4</div>
</div>