/*
Grid

To create a grid layout, put <code>.col</code> elements in a <code>.row</code> elements.

Markup:
<div class="row">
    <section class="col"><h3>Grid01</h3>Section content.</section>
    <section class="col"><h3>Grid02</h3>Section content.</section>
    <section class="col"><h3>Grid03</h3>Section content.</section>
    <section class="col"><h3>Grid04</h3>Section content.</section>
    <section class="col"><h3>Grid05</h3>Section content.</section>
</div>

Styleguide 1.3
*/

.row {
    box-sizing: border-box;
    -ms-box-orient: horizontal;

    box-sizing: border-box;
    display: -webkit-box;
    display: -moz-box;
    display: -webkit-flexbox;
    display: -moz-flexbox;
    display: -ms-flexbox;
    display: -o-flexbox;
    display: flex;

    -webkit-justify-content: center;
    -moz-justify-content: center;
    -ms-justify-content: center;
    justify-content: center;

    -webkit-flex-flow: row wrap;
    -moz-flex-flow: row wrap;
    -ms-flex-flow: row wrap;
    flex-flow: row wrap;
}

.col{
    width:100%;
    box-sizing: border-box;
    display: block;

    -webkit-box-flex: 1;
    -moz-box-flex: 1;
    -webkit-flex: 1;
    -moz-flex: 1;
    -ms-flex: 1;
    flex: 1;
}