/* bootstrap3-bs5-grid.css
   Extends Bootstrap 3 with Bootstrap 5-like grid breakpoints and container widths
*/

/* Container widths */
@media (min-width: 576px) { /* sm */
  .container { width: 540px; }
}

@media (min-width: 768px) { /* md (same as BS3) */
  .container { width: 720px; }
}

@media (min-width: 992px) { /* lg (same as BS3) */
  .container { width: 960px; }
}

@media (min-width: 1200px) { /* xl */
  .container { width: 1140px; }
}

@media (min-width: 1400px) { /* xxl */
  .container { width: 1320px; }
}

/* Core row paddings */
.row {
  margin-left: -15px;
  margin-right: -15px;
}

/* Common padding for new columns */
[class^="col-xl-"], [class*=" col-xl-"],
[class^="col-xxl-"], [class*=" col-xxl-"] {
  float: left;
  padding-left: 15px;
  padding-right: 15px;
}

/* XL Grid */
@media (min-width: 1200px) {
  .col-xl-1  { width: 8.333333%; }
  .col-xl-2  { width: 16.666667%; }
  .col-xl-3  { width: 25%; }
  .col-xl-4  { width: 33.333333%; }
  .col-xl-5  { width: 41.666667%; }
  .col-xl-6  { width: 50%; }
  .col-xl-7  { width: 58.333333%; }
  .col-xl-8  { width: 66.666667%; }
  .col-xl-9  { width: 75%; }
  .col-xl-10 { width: 83.333333%; }
  .col-xl-11 { width: 91.666667%; }
  .col-xl-12 { width: 100%; }
}

/* XXL Grid */
@media (min-width: 1400px) {
  .col-xxl-1  { width: 8.333333%; }
  .col-xxl-2  { width: 16.666667%; }
  .col-xxl-3  { width: 25%; }
  .col-xxl-4  { width: 33.333333%; }
  .col-xxl-5  { width: 41.666667%; }
  .col-xxl-6  { width: 50%; }
  .col-xxl-7  { width: 58.333333%; }
  .col-xxl-8  { width: 66.666667%; }
  .col-xxl-9  { width: 75%; }
  .col-xxl-10 { width: 83.333333%; }
  .col-xxl-11 { width: 91.666667%; }
  .col-xxl-12 { width: 100%; }
}