CSS Grid responsive grid

I'll be adding to this post over the next few hours. But here's the start:

Grid CSS Blade module is 7Kb raw, 5Kb minified. Three types of grid, all based on CSS Grid:

• Page Layout with 3, 4, and 5 rows. The "standard" one is 3 rows for a Header, Main, and Footer.
  The 4 and 5 row layouts are to accommodate an InfoBar at the top (1st row, followed by "standard") and/or (5th row) InfoBar at the bottom.
  The top and bottom InfoBars are "sticky" and cannot be part of the Header or Footer which are fluid in position.
• Explicit, a 12 column grid much like Flexbox.
  Works with the 'row' in the parent container and the column class in the child container.
  – col-1 to col-12
  – one-sixth, two-sixths, three-sixths, four-sixths, five-sixths
  – one-fifth, two-fifths, three-fifths, four-fifths
  – one-quarter, two-quarters (and one-half), three-quarters
  – one-third, two-thirds
  – offset-left-1 to offset-left-11
  – offset-left-one-sixth to offset-left-five-sixths
  – offset-left-one-fifth to offset-left-four-fifths
  – offset-left-one-quarter to offset-left-three-quarters
  – offset-left-one-third to offset-left-two-thirds
  Note1: offsets only work in Explicit type grids
  Note2: Explicity style responsive grid requires media breakpoints
• Fluid and, in my opinion, the easiest to use.
  Works with the entire 'grid' in the parent container.
  Specifically, that means that all columns are the same width, with the height equal for each row.
  – col-auto
  Note1: there are no offsets in Fluid type
  Note2: Fluid style responsive grid DOES NOT requires media breakpoints