*{box-sizing: border-box !important;}

body{
    width: 100%;
    overflow-x: hidden;
}

.left{text-align: left;}
.center{text-align: center;}
.right{text-align: right;}

.nofloat{float: none !important;}

.innerRow{overflow: hidden;}

.row{
    width: 100%;
    min-width: 320px;
    max-width: 960px;
    margin: 0 auto;
    padding: 0;
    float: none;
    clear: both;
    overflow: hidden;
    position: relative;
}

.col{
    min-height: 5px;
    margin: 7px 0;
    margin-left: 1.6%;
    display: inline-block;
    float: left;
    overflow: hidden;
}

.col:first-child{margin-left: 0;}

.one{width: 6.866%;}
.two{width: 15.33%;}
.three{width: 23.8%;}
.four{width: 32.26%;}
.five{width: 40.73%;}
.six{width: 49.2%;}
.seven{width: 57.66%;}
.eight{width: 66.13%;}
.nine{width: 74.6%;}
.ten{width: 83.06%;}
.eleven{width: 91.53%;}
.twelve{width: 100%;}

/* Single Column */
@media (max-width: 480px){
    .col{
        margin: 10px 0 !important;
        width: 100% !important;
    }
}

/* Double Column */
@media (max-width: 860px){
    .col:nth-child(odd){
        width: 49.2%;
        margin: 0 1.6% 0 0;
    }
    
    .col:nth-child(even){
        width: 49.2%;
        margin: 0;
    }
    
    .single{
        width: 100% !important;
        margin: 10px 0 !important;
    }
    
    
    
    .innerRow .col{
        width: 100% !important;
        margin: 10px 0 !important;
    }
}

/* Pad Sides if Viewport <= 960px */
@media (max-width: 960px){
    .row{
        padding-left: 30px;
        padding-right: 30px;
    }
}