@import "node_modules/bootstrap/scss/grid";

// Bootstrap extended extra-extra-larger columns
$xxl-break-point: 1500px;

.col-xxl-1 {
  @media (min-width: $xxl-break-point) {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 10%;
    -ms-flex: 0 0 10%;
    flex: 0 0 10%;
    max-width: 10%;
  }
}

.col-xxl-2 {
  @media (min-width: $xxl-break-point) {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 20%;
    -ms-flex: 0 0 20%;
    flex: 0 0 20%;
    max-width: 20%;
  }
}

.col-xxl-3 {
  @media (min-width: $xxl-break-point) {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 25%;
    -ms-flex: 0 0 25%;
    flex: 0 0 25%;
    max-width: 25%;
  }
}

.col-xxl-4 {
  @media (min-width: $xxl-break-point) {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 33.333333%;
    -ms-flex: 0 0 33.333333%;
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  }
}

.col-xxl-5 {
  @media (min-width: $xxl-break-point) {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 41.666667;
    -ms-flex: 0 0 41.666667;
    flex: 0 0 41.666667;
    max-width: 41.666667;
  }
}

.col-xxl-6 {
  @media (min-width: $xxl-break-point) {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 50%;
    -ms-flex: 0 0 50%;
    flex: 0 0 50%;
    max-width: 50%;
  }
}

.col-xxl-7 {
  @media (min-width: $xxl-break-point) {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 58.333333%;
    -ms-flex: 0 0 58.333333%;
    flex: 0 0 58.333333%;
    max-width: 58.333333%;
  }
}

.col-xxl-8 {
  @media (min-width: $xxl-break-point) {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 66.666667%;
    -ms-flex: 0 0 66.666667%;
    flex: 0 0 66.666667%;
    max-width: 66.666667%;
  }
}

.col-xxl-9 {
  @media (min-width: $xxl-break-point) {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 75%;
    -ms-flex: 0 0 75%;
    flex: 0 0 75%;
    max-width: 75%;
  }
}

.col-xxl-10 {
  @media (min-width: $xxl-break-point) {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 83.333333%;
    -ms-flex: 0 0 83.333333%;
    flex: 0 0 83.333333%;
    max-width: 83.333333%;
  }
}

.col-xxl-11 {
  @media (min-width: $xxl-break-point) {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 91.666667%;
    -ms-flex: 0 0 91.666667%;
    flex: 0 0 91.666667%;
    max-width: 91.666667%;
  }
}

.col-xxl-12 {
  @media (min-width: $xxl-break-point) {
    -webkit-box-flex: 0;
    -webkit-flex: 0 0 100%;
    -ms-flex: 0 0 100%;
    flex: 0 0 100%;
    max-width: 100%;
  }
}
