ggs.css

/* Based on http://goldengridsystem.com */
.col {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
    float: left;
    padding-left: 0.75em;
    padding-right: 0.75em;
}

.col.sm-1 {
    width: 25%;
}

.col.sm-2 {
    width: 50%;
}

.col.sm-3 {
    width: 75%;
}

.col.sm-4 {
    width: 100%;
}

@media screen and (min-width: 60em) {
    .col.md-1 {
        width: 12.5%;
    }

    .col.md-2 {
        width: 25%;
    }

    .col.md-3 {
        width: 37.5%;
    }

    .col.md-4 {
        width: 50%;
    }

    .col.md-5 {
        width: 62.5%;
    }

    .col.md-6 {
        width: 75%;
    }

    .col.md-7 {
        width: 87.5%;
    }

    .col.md-8 {
        width: 100%;
    }
}

@media screen and (min-width: 100em) {
    .col.lg-1 {
        width: 6.25%;
    }

    .col.lg-2 {
        width: 12.5%;
    }

    .col.lg-3 {
        width: 18.75%;
    }

    .col.lg-4 {
        width: 25%;
    }

    .col.lg-5 {
        width: 31.25%;
    }

    .col.lg-6 {
        width: 37.5%;
    }

    .col.lg-7 {
        width: 43.75%;
    }

    .col.lg-8 {
        width: 50%;
    }

    .col.lg-9 {
        width: 56.25%;
    }

    .col.lg-10 {
        width: 62.5%;
    }

    .col.lg-11 {
        width: 68.85%;
    }

    .col.lg-12 {
        width: 75%;
    }

    .col.lg-13 {
        width: 81.25%;
    }

    .col.lg-14 {
        width: 87.5%;
    }

    .col.lg-15 {
        width: 93.75%;
    }

    .col.lg-16 {
        width: 100%;
    }
}

.row {
    margin-left: 5.5555%;
    margin-right: 5.5555%;
}

.row::before,
.row::after {
    content: " ";
    display: table;
}

.row::after {
    clear: both;
}