@media (max-width: 575.98px) {
  div[class^="xs-up-"], div[class*=" xs-up-"] {
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .xs-up-1 > .col {
    -webkit-box-flex: 0 0 100%;
    -moz-box-flex: 0 0 100%;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .xs-up-2 > .col {
    -webkit-box-flex: 0 0 50%;
    -moz-box-flex: 0 0 50%;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .xs-up-3 > .col {
    -webkit-box-flex: 0 0 33.33333%;
    -moz-box-flex: 0 0 33.33333%;
    -webkit-flex: 0 0 33.33333%;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    max-width: 33.33333%;
  }
  .xs-up-4 > .col {
    -webkit-box-flex: 0 0 25%;
    -moz-box-flex: 0 0 25%;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .xs-up-5 > .col {
    -webkit-box-flex: 0 0 20%;
    -moz-box-flex: 0 0 20%;
    -webkit-flex: 0 0 20%;
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
  }
  .xs-up-6 > .col {
    -webkit-box-flex: 0 0 16.66667%;
    -moz-box-flex: 0 0 16.66667%;
    -webkit-flex: 0 0 16.66667%;
    -ms-flex: 0 0 16.66667%;
    flex: 0 0 16.66667%;
    max-width: 16.66667%;
  }
  .xs-up-7 > .col {
    -webkit-box-flex: 0 0 14.28571%;
    -moz-box-flex: 0 0 14.28571%;
    -webkit-flex: 0 0 14.28571%;
    -ms-flex: 0 0 14.28571%;
    flex: 0 0 14.28571%;
    max-width: 14.28571%;
  }
  .xs-up-8 > .col {
    -webkit-box-flex: 0 0 12.5%;
    -moz-box-flex: 0 0 12.5%;
    -webkit-flex: 0 0 12.5%;
    -ms-flex: 0 0 12.5%;
    flex: 0 0 12.5%;
    max-width: 12.5%;
  }
  .xs-up-9 > .col {
    -webkit-box-flex: 0 0 11.11111%;
    -moz-box-flex: 0 0 11.11111%;
    -webkit-flex: 0 0 11.11111%;
    -ms-flex: 0 0 11.11111%;
    flex: 0 0 11.11111%;
    max-width: 11.11111%;
  }
  .xs-up-10 > .col {
    -webkit-box-flex: 0 0 10%;
    -moz-box-flex: 0 0 10%;
    -webkit-flex: 0 0 10%;
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
  }
  .xs-up-11 > .col {
    -webkit-box-flex: 0 0 9.09091%;
    -moz-box-flex: 0 0 9.09091%;
    -webkit-flex: 0 0 9.09091%;
    -ms-flex: 0 0 9.09091%;
    flex: 0 0 9.09091%;
    max-width: 9.09091%;
  }
  .xs-up-12 > .col {
    -webkit-box-flex: 0 0 8.33333%;
    -moz-box-flex: 0 0 8.33333%;
    -webkit-flex: 0 0 8.33333%;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    max-width: 8.33333%;
  }
}

@media (min-width: 576px) {
  div[class^="sm-up-"], div[class*=" sm-up-"] {
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .sm-up-1 > .col {
    -webkit-box-flex: 0 0 100%;
    -moz-box-flex: 0 0 100%;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .sm-up-2 > .col {
    -webkit-box-flex: 0 0 50%;
    -moz-box-flex: 0 0 50%;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .sm-up-3 > .col {
    -webkit-box-flex: 0 0 33.33333%;
    -moz-box-flex: 0 0 33.33333%;
    -webkit-flex: 0 0 33.33333%;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    max-width: 33.33333%;
  }
  .sm-up-4 > .col {
    -webkit-box-flex: 0 0 25%;
    -moz-box-flex: 0 0 25%;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .sm-up-5 > .col {
    -webkit-box-flex: 0 0 20%;
    -moz-box-flex: 0 0 20%;
    -webkit-flex: 0 0 20%;
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
  }
  .sm-up-6 > .col {
    -webkit-box-flex: 0 0 16.66667%;
    -moz-box-flex: 0 0 16.66667%;
    -webkit-flex: 0 0 16.66667%;
    -ms-flex: 0 0 16.66667%;
    flex: 0 0 16.66667%;
    max-width: 16.66667%;
  }
  .sm-up-7 > .col {
    -webkit-box-flex: 0 0 14.28571%;
    -moz-box-flex: 0 0 14.28571%;
    -webkit-flex: 0 0 14.28571%;
    -ms-flex: 0 0 14.28571%;
    flex: 0 0 14.28571%;
    max-width: 14.28571%;
  }
  .sm-up-8 > .col {
    -webkit-box-flex: 0 0 12.5%;
    -moz-box-flex: 0 0 12.5%;
    -webkit-flex: 0 0 12.5%;
    -ms-flex: 0 0 12.5%;
    flex: 0 0 12.5%;
    max-width: 12.5%;
  }
  .sm-up-9 > .col {
    -webkit-box-flex: 0 0 11.11111%;
    -moz-box-flex: 0 0 11.11111%;
    -webkit-flex: 0 0 11.11111%;
    -ms-flex: 0 0 11.11111%;
    flex: 0 0 11.11111%;
    max-width: 11.11111%;
  }
  .sm-up-10 > .col {
    -webkit-box-flex: 0 0 10%;
    -moz-box-flex: 0 0 10%;
    -webkit-flex: 0 0 10%;
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
  }
  .sm-up-11 > .col {
    -webkit-box-flex: 0 0 9.09091%;
    -moz-box-flex: 0 0 9.09091%;
    -webkit-flex: 0 0 9.09091%;
    -ms-flex: 0 0 9.09091%;
    flex: 0 0 9.09091%;
    max-width: 9.09091%;
  }
  .sm-up-12 > .col {
    -webkit-box-flex: 0 0 8.33333%;
    -moz-box-flex: 0 0 8.33333%;
    -webkit-flex: 0 0 8.33333%;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    max-width: 8.33333%;
  }
}

@media (min-width: 768px) {
  div[class^="md-up-"], div[class*=" md-up-"] {
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .md-up-1 > .col {
    -webkit-box-flex: 0 0 100%;
    -moz-box-flex: 0 0 100%;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .md-up-2 > .col {
    -webkit-box-flex: 0 0 50%;
    -moz-box-flex: 0 0 50%;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .md-up-3 > .col {
    -webkit-box-flex: 0 0 33.33333%;
    -moz-box-flex: 0 0 33.33333%;
    -webkit-flex: 0 0 33.33333%;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    max-width: 33.33333%;
  }
  .md-up-4 > .col {
    -webkit-box-flex: 0 0 25%;
    -moz-box-flex: 0 0 25%;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .md-up-5 > .col {
    -webkit-box-flex: 0 0 20%;
    -moz-box-flex: 0 0 20%;
    -webkit-flex: 0 0 20%;
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
  }
  .md-up-6 > .col {
    -webkit-box-flex: 0 0 16.66667%;
    -moz-box-flex: 0 0 16.66667%;
    -webkit-flex: 0 0 16.66667%;
    -ms-flex: 0 0 16.66667%;
    flex: 0 0 16.66667%;
    max-width: 16.66667%;
  }
  .md-up-7 > .col {
    -webkit-box-flex: 0 0 14.28571%;
    -moz-box-flex: 0 0 14.28571%;
    -webkit-flex: 0 0 14.28571%;
    -ms-flex: 0 0 14.28571%;
    flex: 0 0 14.28571%;
    max-width: 14.28571%;
  }
  .md-up-8 > .col {
    -webkit-box-flex: 0 0 12.5%;
    -moz-box-flex: 0 0 12.5%;
    -webkit-flex: 0 0 12.5%;
    -ms-flex: 0 0 12.5%;
    flex: 0 0 12.5%;
    max-width: 12.5%;
  }
  .md-up-9 > .col {
    -webkit-box-flex: 0 0 11.11111%;
    -moz-box-flex: 0 0 11.11111%;
    -webkit-flex: 0 0 11.11111%;
    -ms-flex: 0 0 11.11111%;
    flex: 0 0 11.11111%;
    max-width: 11.11111%;
  }
  .md-up-10 > .col {
    -webkit-box-flex: 0 0 10%;
    -moz-box-flex: 0 0 10%;
    -webkit-flex: 0 0 10%;
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
  }
  .md-up-11 > .col {
    -webkit-box-flex: 0 0 9.09091%;
    -moz-box-flex: 0 0 9.09091%;
    -webkit-flex: 0 0 9.09091%;
    -ms-flex: 0 0 9.09091%;
    flex: 0 0 9.09091%;
    max-width: 9.09091%;
  }
  .md-up-12 > .col {
    -webkit-box-flex: 0 0 8.33333%;
    -moz-box-flex: 0 0 8.33333%;
    -webkit-flex: 0 0 8.33333%;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    max-width: 8.33333%;
  }
}

@media (min-width: 992px) {
  div[class^="lg-up-"], div[class*=" lg-up-"] {
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .lg-up-1 > .col {
    -webkit-box-flex: 0 0 100%;
    -moz-box-flex: 0 0 100%;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .lg-up-2 > .col {
    -webkit-box-flex: 0 0 50%;
    -moz-box-flex: 0 0 50%;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .lg-up-3 > .col {
    -webkit-box-flex: 0 0 33.33333%;
    -moz-box-flex: 0 0 33.33333%;
    -webkit-flex: 0 0 33.33333%;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    max-width: 33.33333%;
  }
  .lg-up-4 > .col {
    -webkit-box-flex: 0 0 25%;
    -moz-box-flex: 0 0 25%;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .lg-up-5 > .col {
    -webkit-box-flex: 0 0 20%;
    -moz-box-flex: 0 0 20%;
    -webkit-flex: 0 0 20%;
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
  }
  .lg-up-6 > .col {
    -webkit-box-flex: 0 0 16.66667%;
    -moz-box-flex: 0 0 16.66667%;
    -webkit-flex: 0 0 16.66667%;
    -ms-flex: 0 0 16.66667%;
    flex: 0 0 16.66667%;
    max-width: 16.66667%;
  }
  .lg-up-7 > .col {
    -webkit-box-flex: 0 0 14.28571%;
    -moz-box-flex: 0 0 14.28571%;
    -webkit-flex: 0 0 14.28571%;
    -ms-flex: 0 0 14.28571%;
    flex: 0 0 14.28571%;
    max-width: 14.28571%;
  }
  .lg-up-8 > .col {
    -webkit-box-flex: 0 0 12.5%;
    -moz-box-flex: 0 0 12.5%;
    -webkit-flex: 0 0 12.5%;
    -ms-flex: 0 0 12.5%;
    flex: 0 0 12.5%;
    max-width: 12.5%;
  }
  .lg-up-9 > .col {
    -webkit-box-flex: 0 0 11.11111%;
    -moz-box-flex: 0 0 11.11111%;
    -webkit-flex: 0 0 11.11111%;
    -ms-flex: 0 0 11.11111%;
    flex: 0 0 11.11111%;
    max-width: 11.11111%;
  }
  .lg-up-10 > .col {
    -webkit-box-flex: 0 0 10%;
    -moz-box-flex: 0 0 10%;
    -webkit-flex: 0 0 10%;
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
  }
  .lg-up-11 > .col {
    -webkit-box-flex: 0 0 9.09091%;
    -moz-box-flex: 0 0 9.09091%;
    -webkit-flex: 0 0 9.09091%;
    -ms-flex: 0 0 9.09091%;
    flex: 0 0 9.09091%;
    max-width: 9.09091%;
  }
  .lg-up-12 > .col {
    -webkit-box-flex: 0 0 8.33333%;
    -moz-box-flex: 0 0 8.33333%;
    -webkit-flex: 0 0 8.33333%;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    max-width: 8.33333%;
  }
}

@media (min-width: 1200px) {
  div[class^="xl-up-"], div[class*=" xl-up-"] {
    -webkit-flex-wrap: wrap;
    -moz-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }
  .xl-up-1 > .col {
    -webkit-box-flex: 0 0 100%;
    -moz-box-flex: 0 0 100%;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
  .xl-up-2 > .col {
    -webkit-box-flex: 0 0 50%;
    -moz-box-flex: 0 0 50%;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
  .xl-up-3 > .col {
    -webkit-box-flex: 0 0 33.33333%;
    -moz-box-flex: 0 0 33.33333%;
    -webkit-flex: 0 0 33.33333%;
    -ms-flex: 0 0 33.33333%;
    flex: 0 0 33.33333%;
    max-width: 33.33333%;
  }
  .xl-up-4 > .col {
    -webkit-box-flex: 0 0 25%;
    -moz-box-flex: 0 0 25%;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
  .xl-up-5 > .col {
    -webkit-box-flex: 0 0 20%;
    -moz-box-flex: 0 0 20%;
    -webkit-flex: 0 0 20%;
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
  }
  .xl-up-6 > .col {
    -webkit-box-flex: 0 0 16.66667%;
    -moz-box-flex: 0 0 16.66667%;
    -webkit-flex: 0 0 16.66667%;
    -ms-flex: 0 0 16.66667%;
    flex: 0 0 16.66667%;
    max-width: 16.66667%;
  }
  .xl-up-7 > .col {
    -webkit-box-flex: 0 0 14.28571%;
    -moz-box-flex: 0 0 14.28571%;
    -webkit-flex: 0 0 14.28571%;
    -ms-flex: 0 0 14.28571%;
    flex: 0 0 14.28571%;
    max-width: 14.28571%;
  }
  .xl-up-8 > .col {
    -webkit-box-flex: 0 0 12.5%;
    -moz-box-flex: 0 0 12.5%;
    -webkit-flex: 0 0 12.5%;
    -ms-flex: 0 0 12.5%;
    flex: 0 0 12.5%;
    max-width: 12.5%;
  }
  .xl-up-9 > .col {
    -webkit-box-flex: 0 0 11.11111%;
    -moz-box-flex: 0 0 11.11111%;
    -webkit-flex: 0 0 11.11111%;
    -ms-flex: 0 0 11.11111%;
    flex: 0 0 11.11111%;
    max-width: 11.11111%;
  }
  .xl-up-10 > .col {
    -webkit-box-flex: 0 0 10%;
    -moz-box-flex: 0 0 10%;
    -webkit-flex: 0 0 10%;
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
  }
  .xl-up-11 > .col {
    -webkit-box-flex: 0 0 9.09091%;
    -moz-box-flex: 0 0 9.09091%;
    -webkit-flex: 0 0 9.09091%;
    -ms-flex: 0 0 9.09091%;
    flex: 0 0 9.09091%;
    max-width: 9.09091%;
  }
  .xl-up-12 > .col {
    -webkit-box-flex: 0 0 8.33333%;
    -moz-box-flex: 0 0 8.33333%;
    -webkit-flex: 0 0 8.33333%;
    -ms-flex: 0 0 8.33333%;
    flex: 0 0 8.33333%;
    max-width: 8.33333%;
  }
}