/**
 * Torchbearer site grid — Materialize-compatible row/col only.
 * Breakpoints: s (default), m ≥ 600px, l ≥ 992px, xl ≥ 1200px.
 * Usage: <div class="row"><div class="col s12 m6 l4">…</div></div>
 * Hide: .hide-on-small (<600), .hide-on-med (600–991), .hide-on-large (≥992).
 */
.row {
  display: flex;
  flex-wrap: wrap;
  margin-left: -0.75rem;
  margin-right: -0.75rem;
}

.col {
  box-sizing: border-box;
  flex: 0 0 auto;
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  min-height: 1px;
}

.col.s1 { width: 8.3333333333%; }
.col.s2 { width: 16.6666666667%; }
.col.s3 { width: 25%; }
.col.s4 { width: 33.3333333333%; }
.col.s5 { width: 41.6666666667%; }
.col.s6 { width: 50%; }
.col.s7 { width: 58.3333333333%; }
.col.s8 { width: 66.6666666667%; }
.col.s9 { width: 75%; }
.col.s10 { width: 83.3333333333%; }
.col.s11 { width: 91.6666666667%; }
.col.s12 { width: 100%; }

@media only screen and (min-width: 600px) {
  .col.m1 { width: 8.3333333333%; }
  .col.m2 { width: 16.6666666667%; }
  .col.m3 { width: 25%; }
  .col.m4 { width: 33.3333333333%; }
  .col.m5 { width: 41.6666666667%; }
  .col.m6 { width: 50%; }
  .col.m7 { width: 58.3333333333%; }
  .col.m8 { width: 66.6666666667%; }
  .col.m9 { width: 75%; }
  .col.m10 { width: 83.3333333333%; }
  .col.m11 { width: 91.6666666667%; }
  .col.m12 { width: 100%; }
}

@media only screen and (min-width: 992px) {
  .col.l1 { width: 8.3333333333%; }
  .col.l2 { width: 16.6666666667%; }
  .col.l3 { width: 25%; }
  .col.l4 { width: 33.3333333333%; }
  .col.l5 { width: 41.6666666667%; }
  .col.l6 { width: 50%; }
  .col.l7 { width: 58.3333333333%; }
  .col.l8 { width: 66.6666666667%; }
  .col.l9 { width: 75%; }
  .col.l10 { width: 83.3333333333%; }
  .col.l11 { width: 91.6666666667%; }
  .col.l12 { width: 100%; }
}

@media only screen and (min-width: 1200px) {
  .col.xl1 { width: 8.3333333333%; }
  .col.xl2 { width: 16.6666666667%; }
  .col.xl3 { width: 25%; }
  .col.xl4 { width: 33.3333333333%; }
  .col.xl5 { width: 41.6666666667%; }
  .col.xl6 { width: 50%; }
  .col.xl7 { width: 58.3333333333%; }
  .col.xl8 { width: 66.6666666667%; }
  .col.xl9 { width: 75%; }
  .col.xl10 { width: 83.3333333333%; }
  .col.xl11 { width: 91.6666666667%; }
  .col.xl12 { width: 100%; }
}

/* Visibility: hide on the named breakpoint range (Materialize *-only style). */
@media only screen and (max-width: 599px) {
  .hide-on-small {
    display: none !important;
  }
}

@media only screen and (min-width: 600px) and (max-width: 991px) {
  .hide-on-med {
    display: none !important;
  }
}

@media only screen and (min-width: 992px) {
  .hide-on-large {
    display: none !important;
  }
}
