.kol-xs-1, .kol-xs-2, .kol-xs-3, .kol-xs-4,
.kol-sm-1, .kol-sm-2, .kol-sm-3, .kol-sm-4, .kol-sm-5, .kol-sm-6, 
.kol-md-1, .kol-md-2, .kol-md-3, .kol-md-4, .kol-md-5, .kol-md-6, .kol-md-7, .kol-md-8, .kol-md-9, 
.kol-lg-1, .kol-lg-2, .kol-lg-3, .kol-lg-4, .kol-lg-5, .kol-lg-6, .kol-lg-7, .kol-lg-8, .kol-lg-9, .kol-lg-10, .kol-lg-11, .kol-lg-12, .kol-lg-13, .kol-lg-14, .kol-lg-15,
 .kol-xl-1, .kol-xl-2, .kol-xl-3, .kol-xl-4, .kol-xl-5, .kol-xl-6, .kol-xl-7, .kol-xl-8, .kol-xl-9, .kol-xl-10, .kol-xl-11, .kol-xl-12, .kol-xl-13, .kol-xl-14, .kol-xl-15
{
  position: relative;
  width: 100%;
  padding: 5px;
  
}

.kol {
  -ms-flex-preferred-size: 0;
  flex-basis: 0;
  -ms-flex-positive: 1;
  flex-grow: 1;
  max-width: 100%;
}


.kol-xs-1 {
  -ms-flex: 0 0 100%;
  flex: 0 0 100%;
  max-width: 100%;
}

.kol-xs-2 {
  -ms-flex: 0 0 50%;
  flex: 0 0 50%;
  max-width: 50%;
}

.kol-xs-3 {
  -ms-flex: 0 0 33.333333%;
  flex: 0 0 33.333333%;
  max-width: 33.333333%;
}

.kol-xs-4 {
  -ms-flex: 0 0 25%;
  flex: 0 0 25%;
  max-width: 25%;
}

@media (min-width: 576px) {
  
  .kol-sm-1 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .kol-sm-2 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .kol-sm-3 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .kol-sm-4 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .kol-sm-5 {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
  }
  .kol-sm-6 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  
}

@media (min-width: 768px) {
  
  .kol-md-1 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .kol-md-2 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .kol-md-3 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .kol-md-4 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .kol-md-5 {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
  }
  .kol-md-6 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .kol-md-7 {
    -ms-flex: 0 0 14.285714%;
    flex: 0 0 14.285714%;
    max-width: 14.285714%;
  }
  .kol-md-8 {
    -ms-flex: 0 0 12.5%;
    flex: 0 0 12.5%;
    max-width: 12.5%;
  }
  .kol-md-9 {
    -ms-flex: 0 0 11.11111%;
    flex: 0 0 11.11111%;
    max-width: 11.11111%;
  }
  
}

@media (min-width: 992px) {
  
  .kol-lg-1 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .kol-lg-2 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .kol-lg-3 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .kol-lg-4 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .kol-lg-5 {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
  }
  .kol-lg-6 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .kol-lg-7 {
    -ms-flex: 0 0 14.285714%;
    flex: 0 0 14.285714%;
    max-width: 14.285714%;
  }
  .kol-lg-8 {
    -ms-flex: 0 0 12.5%;
    flex: 0 0 12.5%;
    max-width: 12.5%;
  }
  .kol-lg-9 {
    -ms-flex: 0 0 11.111111%;
    flex: 0 0 11.111111%;
    max-width: 11.111111%;
  }
  .kol-lg-10 {
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
  }
  .kol-lg-11 {
    -ms-flex: 0 0 9.090909%;
    flex: 0 0 9.090909%;
    max-width: 9.090909%;
  }
  .kol-lg-12 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .kol-lg-13 {
    -ms-flex: 0 0 7.692308%;
    flex: 0 0 7.692308%;
    max-width: 7.692308%;
  }
  .kol-lg-14 {
    -ms-flex: 0 0 7.142857%;
    flex: 0 0 7.142857%;
    max-width: 7.142857%;
  }
  .kol-lg-15 {
    -ms-flex: 0 0 6.666667%;
    flex: 0 0 6.666667%;
    max-width: 6.666667%;
  }
  
}

@media (min-width: 1200px) {
  
  .kol-xl-1 {
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .kol-xl-2 {
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .kol-xl-3 {
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
  .kol-xl-4 {
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .kol-xl-5 {
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
  }
  .kol-xl-6 {
    -ms-flex: 0 0 16.666667%;
    flex: 0 0 16.666667%;
    max-width: 16.666667%;
  }
  .kol-xl-7 {
    -ms-flex: 0 0 14.285714%;
    flex: 0 0 14.285714%;
    max-width: 14.285714%;
  }
  .kol-xl-8 {
    -ms-flex: 0 0 12.5%;
    flex: 0 0 12.5%;
    max-width: 12.5%;
  }
  .kol-xl-9 {
    -ms-flex: 0 0 11.111111%;
    flex: 0 0 11.111111%;
    max-width: 11.111111%;
  }
  .kol-xl-10 {
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
  }
  .kol-xl-11 {
    -ms-flex: 0 0 9.090909%;
    flex: 0 0 9.090909%;
    max-width: 9.090909%;
  }
  .kol-xl-12 {
    -ms-flex: 0 0 8.333333%;
    flex: 0 0 8.333333%;
    max-width: 8.333333%;
  }
  .kol-xl-13 {
    -ms-flex: 0 0 7.692308%;
    flex: 0 0 7.692308%;
    max-width: 7.692308%;
  }
  .kol-xl-14 {
    -ms-flex: 0 0 7.142857%;
    flex: 0 0 7.142857%;
    max-width: 7.142857%;
  }
  .kol-xl-15 {
    -ms-flex: 0 0 6.666667%;
    flex: 0 0 6.666667%;
    max-width: 6.666667%;
  }
  
}