Modified Bootstrap Grid

grid.css

@-ms-viewport {
    width: device-width;
}
@media (max-width: 767px) {
    .align-mobile-left {
        text-align: left;
    }
    .align-mobile-center {
        text-align: center;
    }
    .align-mobile-right {
        text-align: right;
    }
}
@media (min-width: 768px) and (max-width: 1119px) {
    .align-tablet-left {
        text-align: left;
    }
    .align-tablet-center {
        text-align: center;
    }
    .align-tablet-right {
        text-align: right;
    }
}
@media (min-width: 1120px) {
    .align-desktop-left {
        text-align: left;
    }
    .align-desktop-center {
        text-align: center;
    }
    .align-desktop-right {
        text-align: right;
    }
}
.visible-mobile,
.visible-tablet,
.visible-desktop {
    display: none !important;
}
.visible-mobile-block,
.visible-mobile-inline,
.visible-mobile-inline-block,
.visible-tablet-block,
.visible-tablet-inline,
.visible-tablet-inline-block,
.visible-desktop-block,
.visible-desktop-inline,
.visible-desktop-inline-block {
    display: none !important;
}
@media (max-width: 767px) {
    .visible-mobile {
        display: block !important;
    }
    table.visible-mobile {
        display: table;
    }
    tr.visible-mobile {
        display: table-row !important;
    }
    th.visible-mobile,
    td.visible-mobile {
        display: table-cell !important;
    }
}
@media (max-width: 767px) {
    .visible-mobile-block {
        display: block !important;
    }
}
@media (max-width: 767px) {
    .visible-mobile-inline {
        display: inline !important;
    }
}
@media (max-width: 767px) {
    .visible-mobile-inline-block {
        display: inline-block !important;
    }
}
@media (min-width: 768px) and (max-width: 1119px) {
    .visible-tablet {
        display: block !important;
    }
    table.visible-tablet {
        display: table;
    }
    tr.visible-tablet {
        display: table-row !important;
    }
    th.visible-tablet,
    td.visible-tablet {
        display: table-cell !important;
    }
}
@media (min-width: 768px) and (max-width: 1119px) {
    .visible-tablet-block {
        display: block !important;
    }
}
@media (min-width: 768px) and (max-width: 1119px) {
    .visible-tablet-inline {
        display: inline !important;
    }
}
@media (min-width: 768px) and (max-width: 1119px) {
    .visible-tablet-inline-block {
        display: inline-block !important;
    }
}
@media (min-width: 1120px) {
    .visible-desktop {
        display: block !important;
    }
    table.visible-desktop {
        display: table;
    }
    tr.visible-desktop {
        display: table-row !important;
    }
    th.visible-desktop,
    td.visible-desktop {
        display: table-cell !important;
    }
}
@media (min-width: 1120px) {
    .visible-desktop-block {
        display: block !important;
    }
}
@media (min-width: 1120px) {
    .visible-desktop-inline {
        display: inline !important;
    }
}
@media (min-width: 1120px) {
    .visible-desktop-inline-block {
        display: inline-block !important;
    }
}
@media (max-width: 767px) {
    .hidden-mobile {
        display: none !important;
    }
}
@media (min-width: 768px) and (max-width: 1119px) {
    .hidden-tablet {
        display: none !important;
    }
}
@media (min-width: 1120px) {
    .hidden-desktop {
        display: none !important;
    }
}
.visible-print {
    display: none !important;
}
@media print {
    .visible-print {
        display: block !important;
    }
    table.visible-print {
        display: table;
    }
    tr.visible-print {
        display: table-row !important;
    }
    th.visible-print,
    td.visible-print {
        display: table-cell !important;
    }
}
.visible-print-block {
    display: none !important;
}
@media print {
    .visible-print-block {
        display: block !important;
    }
}
.visible-print-inline {
    display: none !important;
}
@media print {
    .visible-print-inline {
        display: inline !important;
    }
}
.visible-print-inline-block {
    display: none !important;
}
@media print {
    .visible-print-inline-block {
        display: inline-block !important;
    }
}
@media print {
    .hidden-print {
        display: none !important;
    }
}
.container {
    margin-right: auto;
    margin-left: auto;
    padding-left: 10px;
    padding-right: 10px;
}
@media (min-width: 768px) {
    .container {
        width: 748px;
    }
}
@media (min-width: 1120px) {
    .container {
        width: 1120px;
    }
}
.container-fluid {
    margin-right: auto;
    margin-left: auto;
    padding-left: 10px;
    padding-right: 10px;
}
.row {
    margin-left: -10px;
    margin-right: -10px;
}
.col, .col-mobile-1, .col-tablet-1, .col-desktop-1, .col-mobile-2, .col-tablet-2, .col-desktop-2, .col-mobile-3, .col-tablet-3, .col-desktop-3, .col-mobile-4, .col-tablet-4, .col-desktop-4, .col-mobile-5, .col-tablet-5, .col-desktop-5, .col-mobile-6, .col-tablet-6, .col-desktop-6, .col-mobile-7, .col-tablet-7, .col-desktop-7, .col-mobile-8, .col-tablet-8, .col-desktop-8, .col-mobile-9, .col-tablet-9, .col-desktop-9, .col-mobile-10, .col-tablet-10, .col-desktop-10, .col-mobile-11, .col-tablet-11, .col-desktop-11, .col-mobile-12, .col-tablet-12, .col-desktop-12 {
    position: relative;
    min-height: 1px;
    padding-left: 10px;
    padding-right: 10px;
}
.col, .col-mobile-1, .col-mobile-2, .col-mobile-3, .col-mobile-4, .col-mobile-5, .col-mobile-6, .col-mobile-7, .col-mobile-8, .col-mobile-9, .col-mobile-10, .col-mobile-11, .col-mobile-12 {
    float: left;
}
.col-mobile-12 {
    width: 100%;
}
.col-mobile-11 {
    width: 91.66666667%;
}
.col-mobile-10 {
    width: 83.33333333%;
}
.col-mobile-9 {
    width: 75%;
}
.col-mobile-8 {
    width: 66.66666667%;
}
.col-mobile-7 {
    width: 58.33333333%;
}
.col-mobile-6 {
    width: 50%;
}
.col-mobile-5 {
    width: 41.66666667%;
}
.col-mobile-4 {
    width: 33.33333333%;
}
.col-mobile-3 {
    width: 25%;
}
.col-mobile-2 {
    width: 16.66666667%;
}
.col-mobile-1 {
    width: 8.33333333%;
}
.col-mobile-pull-12 {
    right: 100%;
}
.col-mobile-pull-11 {
    right: 91.66666667%;
}
.col-mobile-pull-10 {
    right: 83.33333333%;
}
.col-mobile-pull-9 {
    right: 75%;
}
.col-mobile-pull-8 {
    right: 66.66666667%;
}
.col-mobile-pull-7 {
    right: 58.33333333%;
}
.col-mobile-pull-6 {
    right: 50%;
}
.col-mobile-pull-5 {
    right: 41.66666667%;
}
.col-mobile-pull-4 {
    right: 33.33333333%;
}
.col-mobile-pull-3 {
    right: 25%;
}
.col-mobile-pull-2 {
    right: 16.66666667%;
}
.col-mobile-pull-1 {
    right: 8.33333333%;
}
.col-mobile-pull-0 {
    right: auto;
}
.col-mobile-push-12 {
    left: 100%;
}
.col-mobile-push-11 {
    left: 91.66666667%;
}
.col-mobile-push-10 {
    left: 83.33333333%;
}
.col-mobile-push-9 {
    left: 75%;
}
.col-mobile-push-8 {
    left: 66.66666667%;
}
.col-mobile-push-7 {
    left: 58.33333333%;
}
.col-mobile-push-6 {
    left: 50%;
}
.col-mobile-push-5 {
    left: 41.66666667%;
}
.col-mobile-push-4 {
    left: 33.33333333%;
}
.col-mobile-push-3 {
    left: 25%;
}
.col-mobile-push-2 {
    left: 16.66666667%;
}
.col-mobile-push-1 {
    left: 8.33333333%;
}
.col-mobile-push-0 {
    left: auto;
}
.col-mobile-offset-12 {
    margin-left: 100%;
}
.col-mobile-offset-11 {
    margin-left: 91.66666667%;
}
.col-mobile-offset-10 {
    margin-left: 83.33333333%;
}
.col-mobile-offset-9 {
    margin-left: 75%;
}
.col-mobile-offset-8 {
    margin-left: 66.66666667%;
}
.col-mobile-offset-7 {
    margin-left: 58.33333333%;
}
.col-mobile-offset-6 {
    margin-left: 50%;
}
.col-mobile-offset-5 {
    margin-left: 41.66666667%;
}
.col-mobile-offset-4 {
    margin-left: 33.33333333%;
}
.col-mobile-offset-3 {
    margin-left: 25%;
}
.col-mobile-offset-2 {
    margin-left: 16.66666667%;
}
.col-mobile-offset-1 {
    margin-left: 8.33333333%;
}
.col-mobile-offset-0 {
    margin-left: 0%;
}
@media (min-width: 768px) {
    .col, .col-tablet-1, .col-tablet-2, .col-tablet-3, .col-tablet-4, .col-tablet-5, .col-tablet-6, .col-tablet-7, .col-tablet-8, .col-tablet-9, .col-tablet-10, .col-tablet-11, .col-tablet-12 {
        float: left;
    }
    .col-tablet-12 {
        width: 100%;
    }
    .col-tablet-11 {
        width: 91.66666667%;
    }
    .col-tablet-10 {
        width: 83.33333333%;
    }
    .col-tablet-9 {
        width: 75%;
    }
    .col-tablet-8 {
        width: 66.66666667%;
    }
    .col-tablet-7 {
        width: 58.33333333%;
    }
    .col-tablet-6 {
        width: 50%;
    }
    .col-tablet-5 {
        width: 41.66666667%;
    }
    .col-tablet-4 {
        width: 33.33333333%;
    }
    .col-tablet-3 {
        width: 25%;
    }
    .col-tablet-2 {
        width: 16.66666667%;
    }
    .col-tablet-1 {
        width: 8.33333333%;
    }
    .col-tablet-pull-12 {
        right: 100%;
    }
    .col-tablet-pull-11 {
        right: 91.66666667%;
    }
    .col-tablet-pull-10 {
        right: 83.33333333%;
    }
    .col-tablet-pull-9 {
        right: 75%;
    }
    .col-tablet-pull-8 {
        right: 66.66666667%;
    }
    .col-tablet-pull-7 {
        right: 58.33333333%;
    }
    .col-tablet-pull-6 {
        right: 50%;
    }
    .col-tablet-pull-5 {
        right: 41.66666667%;
    }
    .col-tablet-pull-4 {
        right: 33.33333333%;
    }
    .col-tablet-pull-3 {
        right: 25%;
    }
    .col-tablet-pull-2 {
        right: 16.66666667%;
    }
    .col-tablet-pull-1 {
        right: 8.33333333%;
    }
    .col-tablet-pull-0 {
        right: auto;
    }
    .col-tablet-push-12 {
        left: 100%;
    }
    .col-tablet-push-11 {
        left: 91.66666667%;
    }
    .col-tablet-push-10 {
        left: 83.33333333%;
    }
    .col-tablet-push-9 {
        left: 75%;
    }
    .col-tablet-push-8 {
        left: 66.66666667%;
    }
    .col-tablet-push-7 {
        left: 58.33333333%;
    }
    .col-tablet-push-6 {
        left: 50%;
    }
    .col-tablet-push-5 {
        left: 41.66666667%;
    }
    .col-tablet-push-4 {
        left: 33.33333333%;
    }
    .col-tablet-push-3 {
        left: 25%;
    }
    .col-tablet-push-2 {
        left: 16.66666667%;
    }
    .col-tablet-push-1 {
        left: 8.33333333%;
    }
    .col-tablet-push-0 {
        left: auto;
    }
    .col-tablet-offset-12 {
        margin-left: 100%;
    }
    .col-tablet-offset-11 {
        margin-left: 91.66666667%;
    }
    .col-tablet-offset-10 {
        margin-left: 83.33333333%;
    }
    .col-tablet-offset-9 {
        margin-left: 75%;
    }
    .col-tablet-offset-8 {
        margin-left: 66.66666667%;
    }
    .col-tablet-offset-7 {
        margin-left: 58.33333333%;
    }
    .col-tablet-offset-6 {
        margin-left: 50%;
    }
    .col-tablet-offset-5 {
        margin-left: 41.66666667%;
    }
    .col-tablet-offset-4 {
        margin-left: 33.33333333%;
    }
    .col-tablet-offset-3 {
        margin-left: 25%;
    }
    .col-tablet-offset-2 {
        margin-left: 16.66666667%;
    }
    .col-tablet-offset-1 {
        margin-left: 8.33333333%;
    }
    .col-tablet-offset-0 {
        margin-left: 0%;
    }
}
@media (min-width: 1120px) {
    .col, .col-desktop-1, .col-desktop-2, .col-desktop-3, .col-desktop-4, .col-desktop-5, .col-desktop-6, .col-desktop-7, .col-desktop-8, .col-desktop-9, .col-desktop-10, .col-desktop-11, .col-desktop-12 {
        float: left;
    }
    .col-desktop-12 {
        width: 100%;
    }
    .col-desktop-11 {
        width: 91.66666667%;
    }
    .col-desktop-10 {
        width: 83.33333333%;
    }
    .col-desktop-9 {
        width: 75%;
    }
    .col-desktop-8 {
        width: 66.66666667%;
    }
    .col-desktop-7 {
        width: 58.33333333%;
    }
    .col-desktop-6 {
        width: 50%;
    }
    .col-desktop-5 {
        width: 41.66666667%;
    }
    .col-desktop-4 {
        width: 33.33333333%;
    }
    .col-desktop-3 {
        width: 25%;
    }
    .col-desktop-2 {
        width: 16.66666667%;
    }
    .col-desktop-1 {
        width: 8.33333333%;
    }
    .col-desktop-pull-12 {
        right: 100%;
    }
    .col-desktop-pull-11 {
        right: 91.66666667%;
    }
    .col-desktop-pull-10 {
        right: 83.33333333%;
    }
    .col-desktop-pull-9 {
        right: 75%;
    }
    .col-desktop-pull-8 {
        right: 66.66666667%;
    }
    .col-desktop-pull-7 {
        right: 58.33333333%;
    }
    .col-desktop-pull-6 {
        right: 50%;
    }
    .col-desktop-pull-5 {
        right: 41.66666667%;
    }
    .col-desktop-pull-4 {
        right: 33.33333333%;
    }
    .col-desktop-pull-3 {
        right: 25%;
    }
    .col-desktop-pull-2 {
        right: 16.66666667%;
    }
    .col-desktop-pull-1 {
        right: 8.33333333%;
    }
    .col-desktop-pull-0 {
        right: auto;
    }
    .col-desktop-push-12 {
        left: 100%;
    }
    .col-desktop-push-11 {
        left: 91.66666667%;
    }
    .col-desktop-push-10 {
        left: 83.33333333%;
    }
    .col-desktop-push-9 {
        left: 75%;
    }
    .col-desktop-push-8 {
        left: 66.66666667%;
    }
    .col-desktop-push-7 {
        left: 58.33333333%;
    }
    .col-desktop-push-6 {
        left: 50%;
    }
    .col-desktop-push-5 {
        left: 41.66666667%;
    }
    .col-desktop-push-4 {
        left: 33.33333333%;
    }
    .col-desktop-push-3 {
        left: 25%;
    }
    .col-desktop-push-2 {
        left: 16.66666667%;
    }
    .col-desktop-push-1 {
        left: 8.33333333%;
    }
    .col-desktop-push-0 {
        left: auto;
    }
    .col-desktop-offset-12 {
        margin-left: 100%;
    }
    .col-desktop-offset-11 {
        margin-left: 91.66666667%;
    }
    .col-desktop-offset-10 {
        margin-left: 83.33333333%;
    }
    .col-desktop-offset-9 {
        margin-left: 75%;
    }
    .col-desktop-offset-8 {
        margin-left: 66.66666667%;
    }
    .col-desktop-offset-7 {
        margin-left: 58.33333333%;
    }
    .col-desktop-offset-6 {
        margin-left: 50%;
    }
    .col-desktop-offset-5 {
        margin-left: 41.66666667%;
    }
    .col-desktop-offset-4 {
        margin-left: 33.33333333%;
    }
    .col-desktop-offset-3 {
        margin-left: 25%;
    }
    .col-desktop-offset-2 {
        margin-left: 16.66666667%;
    }
    .col-desktop-offset-1 {
        margin-left: 8.33333333%;
    }
    .col-desktop-offset-0 {
        margin-left: 0%;
    }
}
.clearfix,
.clearfix:before,
.clearfix:after,
.container:before,
.container:after,
.container-fluid:before,
.container-fluid:after,
.row:before,
.row:after {
    content: " ";
    display: table;
}
.clearfix:after,
.container:after,
.container-fluid:after,
.row:after {
    clear: both;
}
.center-block {
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.pull-right {
    float: right !important;
}
.pull-left {
    float: left !important;
}
*,
*:before,
*:after {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}