Display content in a responsive, 12-column grid. [docs]

1/3, 2/3 columns on screen and tablet, two equal columns on mobile

[row class=”row-demo”]
[col medium=”4″ small=”6″].medium-4.small-6.columns[/col]
[col medium=”8″ small=”6″].medium-8.small-6.columns[/col]
[/row]

Two columns on screen and tablet, one column on mobile

[row class=”row-demo”]
[col large=”3″ medium=”6″].large-3.medium-6.columns[/col]
[col large=”3″ medium=”6″].large-3.medium-6.columns[/col]
[col large=”3″ medium=”6″].large-3.medium-6.columns[/col]
[col large=”3″ medium=”6″].large-3.medium-6.columns[/col]
[/row]

Three columns on screen and tablet, two columns on mobile

[row class=”row-demo”]
[col medium=”3″ small=”6″].medium-3.small-6.columns[/col]
[col medium=”3″ small=”6″].medium-3.small-6.columns[/col]
[col medium=”6″ small=”6″].medium-6.small-12.columns[/col]
[/row]

Offset columns

[row class=”row-demo”]
[col large=”9″ large_offset=”3″].large-9.large-offset-3.columns[/col]
[/row]

Nested columns

[row class=”row-demo”]
[col medium=”6″].medium-6[row_row][col_col medium=”6″].medium-6[/col_col][col_col medium=”6″].medium-6[/col_col][/row_row][/col]
[col medium=”6″].medium-6[row_row][col_col medium=”6″].medium-6[/col_col][col_col medium=”6″].medium-6[/col_col][/row_row][/col]
[/row]