.d-tb{
    display: table;
}
.d-tr{
    display: table-row;
}
.d-cl{
    display: table-cell;
    height: 100%;
}
.d-in{
    display: inline-block;
}
.d-bl{
    display: block;
}


.col-1 {
    width: 8.3333%
}

.col-2 {
    width: 16.6666%
}

.col-3 {
    width: 25%
}

.col-4 {
    width: 33.3333%
}

.col-5 {
    width: 41.6666%
}

.col-6 {
    width: 50%
}

.col-7 {
    width: 58.3333%
}

.col-8 {
    width: 66.6666%
}

.col-9 {
    width: 75%
}

.col-10 {
    width: 83.3333%
}

.col-11 {
    width: 91.6666%
}

.col-12 {
    width: 100%
}


.row-1 {height: 8.3333%}
.row-2 {height: 16.6666%}
.row-3 {height: 25%}
.row-4 {height: 33.3333%}
.row-5 {height: 41.6666%}
.row-6 {height: 50%}
.row-7 {height: 58.3333%}
.row-8 {height: 66.6666%}
.row-9 {height: 75%}
.row-10 {height: 83.3333%}
.row-11 {height: 91.6666%}
.row-12 {height: 100%}

/*xs*/
@media (min-width: 1px) {
    .col-1-xs {
        width: 8.3333%
    }

    .col-2-xs {
        width: 16.6666%
    }

    .col-3-xs {
        width: 25%
    }

    .col-4-xs {
        width: 33.3333%
    }

    .col-5-xs {
        width: 41.6666%
    }

    .col-6-xs {
        width: 50%
    }

    .col-7-xs {
        width: 58.3333%
    }

    .col-8-xs {
        width: 66.6666%
    }

    .col-9-xs {
        width: 75%
    }

    .col-10-xs {
        width: 83.3333%
    }

    .col-11-xs {
        width: 91.6666%
    }

    .col-12-xs {
        width: 100%
    }

    .row-xs-1 {height: 8.3333%}
    .row-xs-2 {height: 16.6666%}
    .row-xs-3 {height: 25%}
    .row-xs-4 {height: 33.3333%}
    .row-xs-5 {height: 41.6666%}
    .row-xs-6 {height: 50%}
    .row-xs-7 {height: 58.3333%}
    .row-xs-8 {height: 66.6666%}
    .row-xs-9 {height: 75%}
    .row-xs-10 {height: 83.3333%}
    .row-xs-11 {height: 91.6666%}
    .row-xs-12 {height: 100%}

    .hide-xs {
        display: none
    }

    .show-xs {
        display: block
    }
}

/*sm*/
@media (min-width: 767px) {
    .col-1-sm {
        width: 8.3333%
    }

    .col-2-sm {
        width: 16.6666%
    }

    .col-3-sm {
        width: 25%
    }

    .col-4-sm {
        width: 33.3333%
    }

    .col-5-sm {
        width: 41.6666%
    }

    .col-6-sm {
        width: 50%
    }

    .col-7-sm {
        width: 58.3333%
    }

    .col-8-sm {
        width: 66.6666%
    }

    .col-9-sm {
        width: 75%
    }

    .col-10-sm {
        width: 83.3333%
    }

    .col-11-sm {
        width: 91.6666%
    }

    .col-12-sm {
        width: 100%
    }

    .row-sm-1 {height: 8.3333%}
    .row-sm-2 {height: 16.6666%}
    .row-sm-3 {height: 25%}
    .row-sm-4 {height: 33.3333%}
    .row-sm-5 {height: 41.6666%}
    .row-sm-6 {height: 50%}
    .row-sm-7 {height: 58.3333%}
    .row-sm-8 {height: 66.6666%}
    .row-sm-9 {height: 75%}
    .row-sm-10 {height: 83.3333%}
    .row-sm-11 {height: 91.6666%}
    .row-sm-12 {height: 100%}

    .hide-sm {
        display: none
    }

    .show-sm {
        display: block
    }
}

/*md*/
@media (min-width: 1023px) {
    .col-1-md {
        width: 8.3333%
    }

    .col-2-md {
        width: 16.6666%
    }

    .col-3-md {
        width: 25%
    }

    .col-4-md {
        width: 33.3333%
    }

    .col-5-md {
        width: 41.6666%
    }

    .col-6-md {
        width: 50%
    }

    .col-7-md {
        width: 58.3333%
    }

    .col-8-md {
        width: 66.6666%
    }

    .col-9-md {
        width: 75%
    }

    .col-10-md {
        width: 83.3333%
    }

    .col-11-md {
        width: 91.6666%
    }

    .col-12-md {
        width: 100%
    }

    .row-md-1 {height: 8.3333%}
    .row-md-2 {height: 16.6666%}
    .row-md-3 {height: 25%}
    .row-md-4 {height: 33.3333%}
    .row-md-5 {height: 41.6666%}
    .row-md-6 {height: 50%}
    .row-md-7 {height: 58.3333%}
    .row-md-8 {height: 66.6666%}
    .row-md-9 {height: 75%}
    .row-md-10 {height: 83.3333%}
    .row-md-11 {height: 91.6666%}
    .row-md-12 {height: 100%}

    .hide-md {
        display: none
    }

    .show-md {
        display: block
    }
}

/*bg*/
@media (min-width: 1279px) {
    .col-1-bg {
        width: 8.3333%
    }

    .col-2-bg {
        width: 16.6666%
    }

    .col-3-bg {
        width: 25%
    }

    .col-4-bg {
        width: 33.3333%
    }

    .col-5-bg {
        width: 41.6666%
    }

    .col-6-bg {
        width: 50%
    }

    .col-7-bg {
        width: 58.3333%
    }

    .col-8-bg {
        width: 66.6666%
    }

    .col-9-bg {
        width: 75%
    }

    .col-10-bg {
        width: 83.3333%
    }

    .col-11-bg {
        width: 91.6666%
    }

    .col-12-bg {
        width: 100%
    }

    .row-bg-1 {height: 8.3333%}
    .row-bg-2 {height: 16.6666%}
    .row-bg-3 {height: 25%}
    .row-bg-4 {height: 33.3333%}
    .row-bg-5 {height: 41.6666%}
    .row-bg-6 {height: 50%}
    .row-bg-7 {height: 58.3333%}
    .row-bg-8 {height: 66.6666%}
    .row-bg-9 {height: 75%}
    .row-bg-10 {height: 83.3333%}
    .row-bg-11 {height: 91.6666%}
    .row-bg-12 {height: 100%}

    .hide-bg {
        display: none
    }

    .show-bg {
        display: block
    }
}

/*lg*/
@media (min-width: 1365px) {
    .col-1-lg {
        width: 8.3333%
    }

    .col-2-lg {
        width: 16.6666%
    }

    .col-3-lg {
        width: 25%
    }

    .col-4-lg {
        width: 33.3333%
    }

    .col-5-lg {
        width: 41.6666%
    }

    .col-6-lg {
        width: 50%
    }

    .col-7-lg {
        width: 58.3333%
    }

    .col-8-lg {
        width: 66.6666%
    }

    .col-9-lg {
        width: 75%
    }

    .col-10-lg {
        width: 83.3333%
    }

    .col-11-lg {
        width: 91.6666%
    }

    .col-12-lg {
        width: 100%
    }

    .row-lg-1 {height: 8.3333%}
    .row-lg-2 {height: 16.6666%}
    .row-lg-3 {height: 25%}
    .row-lg-4 {height: 33.3333%}
    .row-lg-5 {height: 41.6666%}
    .row-lg-6 {height: 50%}
    .row-lg-7 {height: 58.3333%}
    .row-lg-8 {height: 66.6666%}
    .row-lg-9 {height: 75%}
    .row-lg-10 {height: 83.3333%}
    .row-lg-11 {height: 91.6666%}
    .row-lg-12 {height: 100%}

    .hide-lg {
        display: none
    }

    .show-lg {
        display: block
    }
}

/*xl*/
@media (min-width: 1599px) {
    .col-1-xl {
        width: 8.3333%
    }

    .col-2-xl {
        width: 16.6666%
    }

    .col-3-xl {
        width: 25%
    }

    .col-4-xl {
        width: 33.3333%
    }

    .col-5-xl {
        width: 41.6666%
    }

    .col-6-xl {
        width: 50%
    }

    .col-7-xl {
        width: 58.3333%
    }

    .col-8-xl {
        width: 66.6666%
    }

    .col-9-xl {
        width: 75%
    }

    .col-10-xl {
        width: 83.3333%
    }

    .col-11-xl {
        width: 91.6666%
    }

    .col-12-xl {
        width: 100%
    }

    .row-xl-1 {height: 8.3333%}
    .row-xl-2 {height: 16.6666%}
    .row-xl-3 {height: 25%}
    .row-xl-4 {height: 33.3333%}
    .row-xl-5 {height: 41.6666%}
    .row-xl-6 {height: 50%}
    .row-xl-7 {height: 58.3333%}
    .row-xl-8 {height: 66.6666%}
    .row-xl-9 {height: 75%}
    .row-xl-10 {height: 83.3333%}
    .row-xl-11 {height: 91.6666%}
    .row-xl-12 {height: 100%}

    .hide-xl {
        display: none
    }

    .show-xl {
        display: block
    }

}