/**
* Grid css Systems
* author: Richard Rodriguez
* date: 2015-11-20
**/
.row{
    width: 100%;
    display: table;
}


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

[class*='col-'] {
    display: inline-block;
    min-height: 1px;
    padding: 1px;
    float: left;
    box-sizing: border-box;
}

/* firefox bug*/
@-moz-document url-prefix() {
    /* Firefox doesn't respect max-width in certain situations */
    img { width: 100%; max-width: -moz-max-content; }
}

.left{
    float:left;
}

.right{
    float:right;
}

img.responsive-img{
    max-width: 100%;
    height: auto;
}

/* always */
.col-none{
    display: none;    
}

.offset-none{
    margin-left: 0%;
}

.col-05{
    width: 4.1665%;
}

.offset-05{
    margin-left: 4.1665%;
}

.col-1{
    width: 8.3333%;
}



.offset-1{
    margin-left: 8.3333%;
}

.col-2{
    width: 16.666666667%;
}

.offset-2{
    margin-left: 16.666666667%;
}

.col-3{
    width: 25%;
}

.offset-3{
    margin-left: 25%;
}

.col-4{
    width: 33.333333333%;
}

.offset-4{
    margin-left: 33.333333333%;
}

.col-5{
    width: 41.666666667%;
}

.offset-5{
    margin-left: 41.666666667%;
}

.col-6{
    width: 50%;
}

.offset-6{
    margin-left: 50%;
}

.col-7{
    width: 58.3333333333%;
}

.offset-7{
    width: 58.3333333333%;
}

.col-8{
    width: 66.666666667%;
}

.offset-8{
    margin-left: 66.666666667%;
}

.col-9{
    width: 75%;
}

.offset-9{
    margin-left: 75%;
}

.col-10{
    width: 83.333333333%;
}

.offset-10{
    margin-left: 83.333333333%;
}

.col-11{
    width: 91.666666667%;
}

.offset-11{
    margin-left: 91.666666667%;
}

.col-12{
    width: 100%;
}

.offset-12{
    margin-left: 100%;
}


/* sm */
@media (max-width: 568px){
    
    
    .col-none-sm{
        display: none;    
    }
 
    .offset-none-sm{
        margin-left: 0%;
    }
    
        
    .col-05-sm{
        width: 4.1665%;
    }
    
    .offset-05-sm{
        margin-left: 4.1665%;
    }
    
    .col-1-sm{
        width: 8.3333%;
    }
    
    .offset-1-sm{
        margin-left: 8.3333%;
    }
    
    .col-2-sm{
        width: 16.666666667%;
    }
    
    .offset-2-sm{
        margin-left: 16.666666667%;
    }
    
    .col-3-sm{
        width: 25%;
    }
    
    .offset-3-sm{
        margin-left: 25%;
    }
    
    .col-4-sm{
        width: 33.333333333%;
    }
    
    .offset-4-sm{
        margin-left: 33.333333333%;
    }
    
    .col-5-sm{
        width: 41.666666667%;
    }
    
   .offset-5-sm{
        margin-left: 41.666666667%;
    }
    
    .col-6-sm{
        width: 50%;
    }
    
    .offset-6-sm{
        margin-left: 50%;
    }
    
    .col-7-sm{
        width: 58.3333333333%;
    }
    
    .offset-7-sm{
        width: 58.3333333333%;
    }
    
    .col-8-sm{
        width: 66.666666667%;
    }
    
    .offset-8-sm{
        margin-left: 66.666666667%;
    }
    
    .col-9-sm{
        width: 75%;
    }
    
    .offset-9-sm{
        margin-left: 75%;
    }
    
    .col-10-sm{
        width: 83.333333333%;
    }
    
    .offset-10-sm{
        margin-left: 83.333333333%;
    }
    
    .col-11-sm{
        width: 91.666666667%;
    }
    
    .offset-11-sm{
        margin-left: 91.666666667%;
    }
    
    .col-12-sm{
        width: 100%;
    }
    
    .offset-12-sm{
        margin-left: 100%;
    }

}

/* md */
@media (min-width: 568px) and (max-width: 768px) {
    
    .col-none-md{
        display: none;    
    }
    
    .offset-none-md{
        margin-left: 0%;
    }
    
    .col-05-md{
        width: 4.1665%;
    }
    
    .offset-05-md{
        margin-left: 4.1665%;
    }
    
    .col-1-md{
        width: 8.3333%;
    }
    
    .offset-1-md{
        margin-left: 8.3333%;
    }
    
    .col-2-md{
        width: 16.666666667%;
    }
    
    .offset-2-md{
        margin-left: 16.666666667%;
    }
    
    .col-3-md{
        width: 25%;
    }
    
    .offset-3-md{
        margin-left: 25%;
    }
    
    .col-4-md{
        width: 33.333333333%;
    }
    
    .offset-4-md{
        margin-left: 33.333333333%;
    }
    
    .col-5-md{
        width: 41.666666667%;
    }
     
    .offset-5-md{
        margin-left: 41.666666667%;
    }
    
    .col-6-md{
        width: 50%;
    }
    
    .offset-6-md{
        margin-left: 50%;
    }
    
    .col-7-md{
        width: 58.3333333333%;
    }
    
    .offset-7-md{
        margin-left: 58.3333333333%;
    }
    
    .col-8-md{
        width: 66.666666667%;
    }
    
    .offset-8-md{
        margin-left: 66.666666667%;
    }
    
    .col-9-md{
        width: 75%;
    }
    
    .offset-9-md{
        margin-left: 75%;
    }
    
    .col-10-md{
        width: 83.333333333%;
    }
    
    .offset-10-md{
        margin-left: 83.333333333%;
    }
    
    .col-11-md{
        width: 91.666666667%;
    }
    
    .offset-11-md{
        margin-left: 91.666666667%;
    }
    
    .col-12-md{
        width: 100%;
    }
    
    .offset-12-md{
        margin-left: 100%;
    }

}

/* lg */
@media (min-width: 768px) and (max-width: 1024px){
    
    .col-none-lg{
        display: none;    
    }
    
    .offset-none-lg{
        margin-left: 0%;
    }
    
    .col-05-lg{
        width: 4.1665%;
    }
    
    .offset-05-lg{
        margin-left: 4.1665%;
    }
    
    .col-1-lg{
        width: 8.3333%;
    }
    
    .offset-1-lg{
        margin-left: 8.3333%;
    }
    
    .col-2-lg{
        width: 16.666666667%;
    }
    
    .offset-2-lg{
        margin-left: 16.666666667%;
    }
    
    .col-3-lg{
        width: 25%;
    }
    
    .offset-3-lg{
        margin-left: 25%;
    }
    
    .col-4-lg{
        width: 33.333333333%;
    }
    
    .offset-4-lg{
        margin-left: 33.333333333%;
    }
    
    .col-5-lg{
        width: 41.666666667%;
    }
    
    .offset-5-lg{
        margin-left: 41.666666667%;
    }
    
    .col-6-lg{
        width: 50%;
    }
    
    .offset-6-lg{
        margin-left: 50%;
    }
    
    .col-7-lg{
        width: 58.3333333333%;
    }
    
    .offset-7-lg{
        margin-left: 58.3333333333%;
    }
    
    .col-8-lg{
        width: 66.666666667%;
    }
    
    .offset-8-lg{
        margin-left: 66.666666667%;
    }
    
    .col-9-lg{
        width: 75%;
    }
    
    .offset-9-lg{
        margin-left: 75%;
    }
    
    .col-10-lg{
        width: 83.333333333%;
    }
    
    .offset-10-lg{
        margin-left: 83.333333333%;
    }
    
    .col-11-lg{
        width: 91.666666667%;
    }
    
    .offset-11-lg{
        margin-left: 91.666666667%;
    }
    
    .col-12-lg{
        width: 100%;
    }
    
    .offset-12-lg{
        margin-left: 100%;
    }

}


/* xl */
@media (min-width: 1024px) {
    
    .col-none-xl{
        display: none;    
    }
    
    .offset-none-xl{
        margin-left: 0%;
    }
    
    .col-05-xl{
        width: 4.1665%;
    }
    
    .offset-05-xl{
        margin-left: 4.1665%;
    }
    
    .col-1-xl{
        width: 8.33%;
    }
    
    .offset-1-xl{
        margin-left: 8.33%;
    }
    
    .col-2-xl{
        width: 16.66%;
    }
    
    .offset-2-xl{
        margin-left: 16.66%;
    }
    
    .col-3-xl{
        width: 25%;
    }
    
    .offset-3-xl{
        margin-left: 25%;
    }
    
    .col-4-xl{
        width: 33.33%;
    }
    
    .offset-4-xl{
        margin-left: 33.33%;
    }
    
    .col-5-xl{
        width: 41.66%;
    }
    
    .offset-5-xl{
        margin-left: 41.66%;
    }
    
    .col-6-xl{
        width: 50%;
    }
    
    .offset-6-xl{
        margin-left: 50%;
    }
    
    .col-7-xl{
        width: 58.33%;
    }
    
    .offset-7-xl{
        margin-left: 58.33%;
    }
    
    .col-8-xl{
        width: 66.66%;
    }

    .offset-8-xl{
        margin-left: 66.66%;
    }

    .col-9-xl{
        width: 75%;
    }
    
    .offset-9-xl{
        margin-left: 75%;
    }
    
    .col-10-xl{
        width: 83.33%;
    }
    
    .offset-10-xl{
        margin-left: 83.33%;
    }
    
    .col-11-xl{
        width: 91.66%;
    }
    
    .offset-11-xl{
        margin-left: 91.66%;
    }
    
    .col-12-xl{
        width: 100%;
    }
    
    .offset-12-xl{
        margin-left: 100%;
    }
    
    /* xxl */
@media (min-width: 1400px) {
    
    .col-none-xxl{
        display: none;    
    }
    
    .offset-none-xxl{
        margin-left: 0%;
    }
    
    .col-05-xxl{
        width: 4.1665%;
    }
    
    .offset-05-xxl{
        margin-left: 4.1665%;
    }
    
    .col-1-xxl{
        width: 8.33%;
    }
    
    .offset-1-xxl{
        margin-left: 8.33%;
    }
    
    .col-2-xxl{
        width: 16.66%;
    }
    
    .offset-2-xxl{
        margin-left: 16.66%;
    }
    
    .col-3-xxl{
        width: 25%;
    }
    
    .offset-3-xxl{
        margin-left: 25%;
    }
    
    .col-4-xxl{
        width: 33.33%;
    }
    
    .offset-4-xxl{
        margin-left: 33.33%;
    }
    
    .col-5-xxl{
        width: 41.66%;
    }
    
    .offset-5-xxl{
        margin-left: 41.66%;
    }
    
    .col-6-xxl{
        width: 50%;
    }
    
    .offset-6-xxl{
        margin-left: 50%;
    }
    
    .col-7-xxl{
        width: 58.33%;
    }
    
    .offset-7-xxl{
        margin-left: 58.33%;
    }
    
    .col-8-xxl{
        width: 66.66%;
    }

    .offset-8-xxl{
        margin-left: 66.66%;
    }

    .col-9-xxl{
        width: 75%;
    }
    
    .offset-9-xxl{
        margin-left: 75%;
    }
    
    .col-10-xxl{
        width: 83.33%;
    }
    
    .offset-10-xxl{
        margin-left: 83.33%;
    }
    
    .col-11-xxl{
        width: 91.66%;
    }
    
    .offset-11-xxl{
        margin-left: 91.66%;
    }
    
    .col-12-xxl{
        width: 100%;
    }
    
    .offset-12-xxl{
        margin-left: 100%;
    }
    
      /* xxxl */
@media (min-width: 1900px) {
    
    .col-none-xxxl{
        display: none;    
    }
    
    .offset-none-xxxl{
        margin-left: 0%;
    }
    
    .col-05-xxxl{
        width: 4.1665%;
    }
    
    .offset-05-xxxl{
        margin-left: 4.1665%;
    }
    
    .col-1-xxxl{
        width: 8.33%;
    }
    
    .offset-1-xxxl{
        margin-left: 8.33%;
    }
    
    .col-2-xxxl{
        width: 16.66%;
    }
    
    .offset-2-xxxl{
        margin-left: 16.66%;
    }
    
    .col-3-xxxl{
        width: 25%;
    }
    
    .offset-3-xxxl{
        margin-left: 25%;
    }
    
    .col-4-xxxl{
        width: 33.33%;
    }
    
    .offset-4-xxxl{
        margin-left: 33.33%;
    }
    
    .col-5-xxxl{
        width: 41.66%;
    }
    
    .offset-5-xxxl{
        margin-left: 41.66%;
    }
    
    .col-6-xxxl{
        width: 50%;
    }
    
    .offset-6-xxxl{
        margin-left: 50%;
    }
    
    .col-7-xxxl{
        width: 58.33%;
    }
    
    .offset-7-xxxl{
        margin-left: 58.33%;
    }
    
    .col-8-xxxl{
        width: 66.66%;
    }

    .offset-8-xxxl{
        margin-left: 66.66%;
    }

    .col-9-xxxl{
        width: 75%;
    }
    
    .offset-9-xxxl{
        margin-left: 75%;
    }
    
    .col-10-xxxl{
        width: 83.33%;
    }
    
    .offset-10-xxxl{
        margin-left: 83.33%;
    }
    
    .col-11-xxxl{
        width: 91.66%;
    }
    
    .offset-11-xxxl{
        margin-left: 91.66%;
    }
    
    .col-12-xxxl{
        width: 100%;
    }
    
    .offset-12-xxxl{
        margin-left: 100%;
    }

}