/* GRID */

.cf:before, .col:before, .cf:after, .col:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */
}

.cf:after, .col:after {
    clear: both;
}

/**
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */
.cf, .col {
    *zoom: 1;
}

.col {
    position: relative;
    float: left;
    display: block;
    margin-left: 1%;
    margin-right: 1%;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

.span-16 + .span-16 {
    margin-top: 0.5em;
}

.pull-right {
    float: right !important;
}

.pull-left {
    float: left !important;
}

.col.span-1 {
    width: 4.25%;
}

    .col.span-1.tight {
        width: 6.25%;
    }

.col.span-2 {
    width: 10.5%;
}

    .col.span-2.tight {
        width: 12.5%;
    }

.col.span-3 {
    width: 16.75%;
}

    .col.span-3.tight {
        width: 18.75%;
    }

.col.span-4 {
    width: 23%;
}

    .col.span-4.tight {
        width: 25%;
    }

.col.span-5 {
    width: 29.25%;
}

    .col.span-5.tight {
        width: 31.25%;
    }

.col.span-6 {
    width: 35.5%;
}

    .col.span-6.tight {
        width: 37.5%;
    }

.col.span-7 {
    width: 41.75%;
}

    .col.span-7.tight {
        width: 43.75%;
    }

.col.span-8 {
    width: 48%;
}

    .col.span-8.tight {
        width: 50%;
    }

.col.span-9 {
    width: 54.25%;
}

    .col.span-9.tight {
        width: 56.25%;
    }

.col.span-10 {
    width: 60.5%;
}

    .col.span-10.tight {
        width: 62.5%;
    }

.col.span-11 {
    width: 66.75%;
}

    .col.span-11.tight {
        width: 68.75%;
    }

.col.span-12 {
    width: 73%;
}

    .col.span-12.tight {
        width: 75%;
    }

.col.span-13 {
    width: 79.25%;
}

    .col.span-13.tight {
        width: 81.25%;
    }

.col.span-14 {
    width: 85.5%;
}

    .col.span-14.tight {
        width: 87.5%;
    }

.col.span-15 {
    width: 91.75%;
}

    .col.span-15.tight {
        width: 93.75%;
    }

.col.span-16 {
    width: 98%;
}

    .col.span-16.tight {
        width: 100%;
    }

.col.push-1 {
    margin-left: 4.25%;
}

.col.push-2 {
    margin-left: 10.5%;
}

.col.push-3 {
    margin-left: 16.75%;
}

.col.push-4 {
    margin-left: 23%;
}

.col.push-5 {
    margin-left: 29.25%;
}

.col.push-6 {
    margin-left: 35.5%;
}

.col.push-7 {
    margin-left: 41.75%;
}

.col.push-8 {
    margin-left: 48%;
}

.col.push-9 {
    margin-left: 54.25%;
}

.col.push-10 {
    margin-left: 60.5%;
}

.col.push-11 {
    margin-left: 66.75%;
}

.col.push-12 {
    margin-left: 73%;
}

.col.push-13 {
    margin-left: 79.25%;
}

.col.push-14 {
    margin-left: 85.5%;
}

.col.push-15 {
    margin-left: 91.75%;
}

.col.push-16 {
    margin-left: 98%;
}

.col.tight {
    margin-left: 0;
    margin-right: 0;
}

.col.centered.span-1 {
    left: 50%;
    margin-left: -2.125%;
}

.col.centered.span-2 {
    left: 50%;
    margin-left: -5.25%;
}

.col.centered.span-3 {
    left: 50%;
    margin-left: -8.375%;
}

.col.centered.span-4 {
    left: 50%;
    margin-left: -11.5%;
}

.col.centered.span-5 {
    left: 50%;
    margin-left: -14.625%;
}

.col.centered.span-6 {
    left: 50%;
    margin-left: -17.75%;
}

.col.centered.span-7 {
    left: 50%;
    margin-left: -20.875%;
}

.col.centered.span-8 {
    left: 50%;
    margin-left: -24%;
}

.col.centered.span-9 {
    left: 50%;
    margin-left: -27.125%;
}

.col.centered.span-10 {
    left: 50%;
    margin-left: -30.25%;
}

.col.centered.span-11 {
    left: 50%;
    margin-left: -33.375%;
}

.col.centered.span-12 {
    left: 50%;
    margin-left: -36.5%;
}

.col.centered.span-13 {
    left: 50%;
    margin-left: -39.625%;
}

.col.centered.span-14 {
    left: 50%;
    margin-left: -42.75%;
}

.col.centered.span-15 {
    left: 50%;
    margin-left: -45.875%;
}

.col.centered.span-16 {
    left: 50%;
    margin-left: -49%;
}

@media all and (max-width: 600px) {
    .col {
        clear: both;
        margin-bottom: 0.5em;
    }
    .col.span-1 {
        width: 98% !important;
    }

    .col.span-2 {
        width: 98% !important;
    }

    .col.span-3 {
        width: 98% !important;
    }

    .col.span-4 {
        width: 98% !important;
    }

    .col.span-5 {
        width: 98% !important;
    }

    .col.span-6 {
        width: 98% !important;
    }

    .col.span-7 {
        width: 98% !important;
    }

    .col.span-8 {
        width: 98% !important;
    }

    .col.span-9 {
        width: 98% !important;
    }

    .col.span-10 {
        width: 98% !important;
    }

    .col.span-11 {
        width: 98% !important;
    }

    .col.span-12 {
        width: 98% !important;
    }

    .col.span-13 {
        width: 98% !important;
    }

    .col.span-14 {
        width: 98% !important;
    }

    .col.span-15 {
        width: 98% !important;
    }

    .col.span-16 {
        width: 98% !important;
    }

    .col.push-1 {
        margin-left: 1%;
    }

    .col.push-2 {
        margin-left: 1%;
    }

    .col.push-3 {
        margin-left: 1%;
    }

    .col.push-4 {
        margin-left: 1%;
    }

    .col.push-5 {
        margin-left: 1%;
    }

    .col.push-6 {
        margin-left: 1%;
    }

    .col.push-7 {
        margin-left: 1%;
    }

    .col.push-8 {
        margin-left: 1%;
    }

    .col.push-9 {
        margin-left: 1%;
    }

    .col.push-10 {
        margin-left: 1%;
    }

    .col.push-11 {
        margin-left: 1%;
    }

    .col.push-12 {
        margin-left: 1%;
    }

    .col.push-13 {
        margin-left: 1%;
    }

    .col.push-14 {
        margin-left: 1%;
    }

    .col.push-15 {
        margin-left: 1%;
    }

    .col.push-16 {
        margin-left: 1%;
    }

    .col.centered.span-1 {
        margin-left: -49%;
    }

    .col.centered.span-2 {
        margin-left: -49%;
    }

    .col.centered.span-3 {
        margin-left: -49%;
    }

    .col.centered.span-4 {
        margin-left: -49%;
    }

    .col.centered.span-5 {
        margin-left: -49%;
    }

    .col.centered.span-6 {
        margin-left: -49%;
    }

    .col.centered.span-7 {
        margin-left: -49%;
    }

    .col.centered.span-8 {
        margin-left: -49%;
    }

    .col.centered.span-9 {
        margin-left: -49%;
    }

    .col.centered.span-10 {
        margin-left: -49%;
    }

    .col.centered.span-11 {
        margin-left: -49%;
    }

    .col.centered.span-12 {
        margin-left: -49%;
    }

    .col.centered.span-13 {
        margin-left: -49%;
    }

    .col.centered.span-14 {
        margin-left: -49%;
    }

    .col.centered.span-15 {
        margin-left: -49%;
    }

    .col.centered.span-16 {
        margin-left: -49%;
    }

    .col.push-1,
    .col.push-2,
    .col.push-3,
    .col.push-4,
    .col.push-5,
    .col.push-6,
    .col.push-7,
    .col.push-8,
    .col.push-9,
    .col.push-10,
    .col.push-11,
    .col.push-12,
    .col.push-13,
    .col.push-14,
    .col.push-15,
    .col.push-16 {
        margin-left: 1%;
    }
}