.cols {display: flex; border: 1px solid black; }

.list-group-item.active, .list-group-item.active:focus, .list-group-item.active:hover {
    z-index: 2;
    color: #fff;
    background-color: #337ab7 !important;
    border-color: #337ab7;
}

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

.cols-1 {width: 8.333333333%;}
.cols-2 {width: 16.666666%;}
.cols-3 {width: 25%;}
.cols-4 {width: 33.33333333%;}
.cols-5 {width: 41.66666667%;}
.cols-6 {width: 50%;}
.cols-7 {width: 58.33333333%;}
.cols-8 {width: 66.66666667%;}
.cols-9 {width: 75%;}
.cols-10 {width: 83.33333333%;}
.cols-11 {width: 91.66666667%;}
.cols-12 {width: 100%;}

.border-black { border: 2px solid black;}

.flex-row { flex-direction: column; }

.center {text-align: center}