.grid {
  box-sizing: border-box; }
  .flexbox .grid {
    display: flex;
    flex: 0 1 auto;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: flex-start; }
  .no-flexbox .grid {
    font-size: 0; }

.grid__unit {
  box-sizing: border-box; }
  .flexbox .grid__unit {
    flex-basis: 100%;
    max-width: 100%; }
  .no-flexbox .grid__unit {
    display: inline-block;
    width: 100%;
    font-size: 1rem;
    vertical-align: top; }

@media (min-width: 0) {
  .flexbox .grid[g-xs~="halign:left"] {
    justify-content: flex-start; }
  .no-flexbox .grid[g-xs~="halign:left"] {
    text-align: left; }
  .flexbox .grid[g-xs~="halign:left"].grid__unit[g-xs~="order:reversed"] {
    justify-content: flex-end; }
  .no-flexbox .grid[g-xs~="halign:left"].grid__unit[g-xs~="order:reversed"] {
    text-align: left; }
  .flexbox .grid[g-xs~="halign:center"] {
    justify-content: center; }
  .no-flexbox .grid[g-xs~="halign:center"] {
    text-align: center; }
  .flexbox .grid[g-xs~="halign:right"] {
    justify-content: flex-end; }
  .no-flexbox .grid[g-xs~="halign:right"] {
    text-align: right; }
  .flexbox .grid[g-xs~="halign:right"].grid__unit[g-xs~="order:reversed"] {
    justify-content: flex-start; }
  .no-flexbox .grid[g-xs~="halign:right"].grid__unit[g-xs~="order:reversed"] {
    text-align: right; }
  .flexbox .grid[g-xs~="halign:justify"] {
    justify-content: space-between; }
  .no-flexbox .grid[g-xs~="halign:justify"] {
    text-align: justify;
    text-justify: distribute; }
  .no-flexbox .grid[g-xs~="halign:justify"]:after {
    display: inline-block;
    content: "";
    width: 100%; }
  .flexbox .grid[g-xs~="halign:justify-center"] {
    justify-content: space-around; }
  .no-flexbox .grid[g-xs~="halign:justify-center"] {
    text-align: justify;
    text-justify: distribute; }
  .no-flexbox .grid[g-xs~="halign:justify-center"]:after {
    display: inline-block;
    content: "";
    width: 100%; }
  .flexbox .grid[g-xs~="valign:top"] {
    align-items: flex-start; }
  .flexbox .grid[g-xs~="valign:middle"] {
    align-items: center; }
  .flexbox .grid[g-xs~="valign:bottom"] {
    align-items: flex-end; }
  .flexbox .grid[g-xs~="valign:stretch"] {
    align-items: stretch; }
  .flexbox .grid[g-xs~="order:reverse"] {
    flex-direction: row-reverse; }
  .flexbox .grid[g-xs~="wrap:wrap"] {
    flex-wrap: wrap; }
  .flexbox .grid[g-xs~="wrap:nowrap"] {
    flex-wrap: nowrap; }
  .flexbox .grid[g-xs~="wrap:wrap-reverse"] {
    flex-wrap: wrap-reverse; }
  .flexbox .grid__unit[g-xs~="cols:min"] {
    flex-grow: 0;
    flex-basis: auto;
    width: auto;
    max-width: none; }
  .no-flexbox .grid__unit[g-xs~="cols:min"] {
    width: auto; }
  .flexbox .grid__unit[g-xs~="cols:max"] {
    flex-grow: 1;
    flex-basis: auto;
    width: auto;
    max-width: none; }
  .no-flexbox .grid__unit[g-xs~="cols:max"] {
    width: 100%; }
  .flexbox .grid__unit[g-xs~="cols:1"] {
    flex-basis: 8.33333%;
    max-width: 8.33333%; }
  .no-flexbox .grid__unit[g-xs~="cols:1"] {
    width: 8.33333%; }
  .flexbox .grid__unit[g-xs~="cols:2"] {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }
  .no-flexbox .grid__unit[g-xs~="cols:2"] {
    width: 16.66667%; }
  .flexbox .grid__unit[g-xs~="cols:3"] {
    flex-basis: 25%;
    max-width: 25%; }
  .no-flexbox .grid__unit[g-xs~="cols:3"] {
    width: 25%; }
  .flexbox .grid__unit[g-xs~="cols:4"] {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }
  .no-flexbox .grid__unit[g-xs~="cols:4"] {
    width: 33.33333%; }
  .flexbox .grid__unit[g-xs~="cols:5"] {
    flex-basis: 41.66667%;
    max-width: 41.66667%; }
  .no-flexbox .grid__unit[g-xs~="cols:5"] {
    width: 41.66667%; }
  .flexbox .grid__unit[g-xs~="cols:6"] {
    flex-basis: 50%;
    max-width: 50%; }
  .no-flexbox .grid__unit[g-xs~="cols:6"] {
    width: 50%; }
  .flexbox .grid__unit[g-xs~="cols:7"] {
    flex-basis: 58.33333%;
    max-width: 58.33333%; }
  .no-flexbox .grid__unit[g-xs~="cols:7"] {
    width: 58.33333%; }
  .flexbox .grid__unit[g-xs~="cols:8"] {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }
  .no-flexbox .grid__unit[g-xs~="cols:8"] {
    width: 66.66667%; }
  .flexbox .grid__unit[g-xs~="cols:9"] {
    flex-basis: 75%;
    max-width: 75%; }
  .no-flexbox .grid__unit[g-xs~="cols:9"] {
    width: 75%; }
  .flexbox .grid__unit[g-xs~="cols:10"] {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }
  .no-flexbox .grid__unit[g-xs~="cols:10"] {
    width: 83.33333%; }
  .flexbox .grid__unit[g-xs~="cols:11"] {
    flex-basis: 91.66667%;
    max-width: 91.66667%; }
  .no-flexbox .grid__unit[g-xs~="cols:11"] {
    width: 91.66667%; }
  .flexbox .grid__unit[g-xs~="cols:12"] {
    flex-basis: 100%;
    max-width: 100%; }
  .no-flexbox .grid__unit[g-xs~="cols:12"] {
    width: 100%; }
  .flexbox .grid__unit[g-xs~="visible"],
  .no-flexbox .grid__unit[g-xs~="visible"] {
    display: inline-block; }
  .flexbox .grid__unit[g-xs~="invisible"],
  .no-flexbox .grid__unit[g-xs~="invisible"] {
    display: none; }
  .grid__unit[g-xs~="order:first"] {
    order: -1; }
  .grid__unit[g-xs~="order:last"] {
    order: 12; }
  [g-xs~="text:left"] {
    text-align: left; }
  [g-xs~="text:center"] {
    text-align: center; }
  [g-xs~="text:right"] {
    text-align: right; }
  [g-xs~="display:none"] {
    display: none; }
  [g-xs~="display:inline"] {
    display: inline; }
  [g-xs~="display:inline-block"] {
    display: inline-block; }
  [g-xs~="display:block"] {
    display: block; } }

@media (min-width: 30em) {
  .flexbox .grid[g-sm~="halign:left"] {
    justify-content: flex-start; }
  .no-flexbox .grid[g-sm~="halign:left"] {
    text-align: left; }
  .flexbox .grid[g-sm~="halign:left"].grid__unit[g-sm~="order:reversed"] {
    justify-content: flex-end; }
  .no-flexbox .grid[g-sm~="halign:left"].grid__unit[g-sm~="order:reversed"] {
    text-align: left; }
  .flexbox .grid[g-sm~="halign:center"] {
    justify-content: center; }
  .no-flexbox .grid[g-sm~="halign:center"] {
    text-align: center; }
  .flexbox .grid[g-sm~="halign:right"] {
    justify-content: flex-end; }
  .no-flexbox .grid[g-sm~="halign:right"] {
    text-align: right; }
  .flexbox .grid[g-sm~="halign:right"].grid__unit[g-sm~="order:reversed"] {
    justify-content: flex-start; }
  .no-flexbox .grid[g-sm~="halign:right"].grid__unit[g-sm~="order:reversed"] {
    text-align: right; }
  .flexbox .grid[g-sm~="halign:justify"] {
    justify-content: space-between; }
  .no-flexbox .grid[g-sm~="halign:justify"] {
    text-align: justify;
    text-justify: distribute; }
  .no-flexbox .grid[g-sm~="halign:justify"]:after {
    display: inline-block;
    content: "";
    width: 100%; }
  .flexbox .grid[g-sm~="halign:justify-center"] {
    justify-content: space-around; }
  .no-flexbox .grid[g-sm~="halign:justify-center"] {
    text-align: justify;
    text-justify: distribute; }
  .no-flexbox .grid[g-sm~="halign:justify-center"]:after {
    display: inline-block;
    content: "";
    width: 100%; }
  .flexbox .grid[g-sm~="valign:top"] {
    align-items: flex-start; }
  .flexbox .grid[g-sm~="valign:middle"] {
    align-items: center; }
  .flexbox .grid[g-sm~="valign:bottom"] {
    align-items: flex-end; }
  .flexbox .grid[g-sm~="valign:stretch"] {
    align-items: stretch; }
  .flexbox .grid[g-sm~="order:reverse"] {
    flex-direction: row-reverse; }
  .flexbox .grid[g-sm~="wrap:wrap"] {
    flex-wrap: wrap; }
  .flexbox .grid[g-sm~="wrap:nowrap"] {
    flex-wrap: nowrap; }
  .flexbox .grid[g-sm~="wrap:wrap-reverse"] {
    flex-wrap: wrap-reverse; }
  .flexbox .grid__unit[g-sm~="cols:min"] {
    flex-grow: 0;
    flex-basis: auto;
    width: auto;
    max-width: none; }
  .no-flexbox .grid__unit[g-sm~="cols:min"] {
    width: auto; }
  .flexbox .grid__unit[g-sm~="cols:max"] {
    flex-grow: 1;
    flex-basis: auto;
    width: auto;
    max-width: none; }
  .no-flexbox .grid__unit[g-sm~="cols:max"] {
    width: 100%; }
  .flexbox .grid__unit[g-sm~="cols:1"] {
    flex-basis: 8.33333%;
    max-width: 8.33333%; }
  .no-flexbox .grid__unit[g-sm~="cols:1"] {
    width: 8.33333%; }
  .flexbox .grid__unit[g-sm~="cols:2"] {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }
  .no-flexbox .grid__unit[g-sm~="cols:2"] {
    width: 16.66667%; }
  .flexbox .grid__unit[g-sm~="cols:3"] {
    flex-basis: 25%;
    max-width: 25%; }
  .no-flexbox .grid__unit[g-sm~="cols:3"] {
    width: 25%; }
  .flexbox .grid__unit[g-sm~="cols:4"] {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }
  .no-flexbox .grid__unit[g-sm~="cols:4"] {
    width: 33.33333%; }
  .flexbox .grid__unit[g-sm~="cols:5"] {
    flex-basis: 41.66667%;
    max-width: 41.66667%; }
  .no-flexbox .grid__unit[g-sm~="cols:5"] {
    width: 41.66667%; }
  .flexbox .grid__unit[g-sm~="cols:6"] {
    flex-basis: 50%;
    max-width: 50%; }
  .no-flexbox .grid__unit[g-sm~="cols:6"] {
    width: 50%; }
  .flexbox .grid__unit[g-sm~="cols:7"] {
    flex-basis: 58.33333%;
    max-width: 58.33333%; }
  .no-flexbox .grid__unit[g-sm~="cols:7"] {
    width: 58.33333%; }
  .flexbox .grid__unit[g-sm~="cols:8"] {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }
  .no-flexbox .grid__unit[g-sm~="cols:8"] {
    width: 66.66667%; }
  .flexbox .grid__unit[g-sm~="cols:9"] {
    flex-basis: 75%;
    max-width: 75%; }
  .no-flexbox .grid__unit[g-sm~="cols:9"] {
    width: 75%; }
  .flexbox .grid__unit[g-sm~="cols:10"] {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }
  .no-flexbox .grid__unit[g-sm~="cols:10"] {
    width: 83.33333%; }
  .flexbox .grid__unit[g-sm~="cols:11"] {
    flex-basis: 91.66667%;
    max-width: 91.66667%; }
  .no-flexbox .grid__unit[g-sm~="cols:11"] {
    width: 91.66667%; }
  .flexbox .grid__unit[g-sm~="cols:12"] {
    flex-basis: 100%;
    max-width: 100%; }
  .no-flexbox .grid__unit[g-sm~="cols:12"] {
    width: 100%; }
  .flexbox .grid__unit[g-sm~="visible"],
  .no-flexbox .grid__unit[g-sm~="visible"] {
    display: inline-block; }
  .flexbox .grid__unit[g-sm~="invisible"],
  .no-flexbox .grid__unit[g-sm~="invisible"] {
    display: none; }
  .grid__unit[g-sm~="order:first"] {
    order: -1; }
  .grid__unit[g-sm~="order:last"] {
    order: 12; }
  [g-sm~="text:left"] {
    text-align: left; }
  [g-sm~="text:center"] {
    text-align: center; }
  [g-sm~="text:right"] {
    text-align: right; }
  [g-sm~="display:none"] {
    display: none; }
  [g-sm~="display:inline"] {
    display: inline; }
  [g-sm~="display:inline-block"] {
    display: inline-block; }
  [g-sm~="display:block"] {
    display: block; } }

@media (min-width: 40em) {
  .flexbox .grid[g-md~="halign:left"] {
    justify-content: flex-start; }
  .no-flexbox .grid[g-md~="halign:left"] {
    text-align: left; }
  .flexbox .grid[g-md~="halign:left"].grid__unit[g-md~="order:reversed"] {
    justify-content: flex-end; }
  .no-flexbox .grid[g-md~="halign:left"].grid__unit[g-md~="order:reversed"] {
    text-align: left; }
  .flexbox .grid[g-md~="halign:center"] {
    justify-content: center; }
  .no-flexbox .grid[g-md~="halign:center"] {
    text-align: center; }
  .flexbox .grid[g-md~="halign:right"] {
    justify-content: flex-end; }
  .no-flexbox .grid[g-md~="halign:right"] {
    text-align: right; }
  .flexbox .grid[g-md~="halign:right"].grid__unit[g-md~="order:reversed"] {
    justify-content: flex-start; }
  .no-flexbox .grid[g-md~="halign:right"].grid__unit[g-md~="order:reversed"] {
    text-align: right; }
  .flexbox .grid[g-md~="halign:justify"] {
    justify-content: space-between; }
  .no-flexbox .grid[g-md~="halign:justify"] {
    text-align: justify;
    text-justify: distribute; }
  .no-flexbox .grid[g-md~="halign:justify"]:after {
    display: inline-block;
    content: "";
    width: 100%; }
  .flexbox .grid[g-md~="halign:justify-center"] {
    justify-content: space-around; }
  .no-flexbox .grid[g-md~="halign:justify-center"] {
    text-align: justify;
    text-justify: distribute; }
  .no-flexbox .grid[g-md~="halign:justify-center"]:after {
    display: inline-block;
    content: "";
    width: 100%; }
  .flexbox .grid[g-md~="valign:top"] {
    align-items: flex-start; }
  .flexbox .grid[g-md~="valign:middle"] {
    align-items: center; }
  .flexbox .grid[g-md~="valign:bottom"] {
    align-items: flex-end; }
  .flexbox .grid[g-md~="valign:stretch"] {
    align-items: stretch; }
  .flexbox .grid[g-md~="order:reverse"] {
    flex-direction: row-reverse; }
  .flexbox .grid[g-md~="wrap:wrap"] {
    flex-wrap: wrap; }
  .flexbox .grid[g-md~="wrap:nowrap"] {
    flex-wrap: nowrap; }
  .flexbox .grid[g-md~="wrap:wrap-reverse"] {
    flex-wrap: wrap-reverse; }
  .flexbox .grid__unit[g-md~="cols:min"] {
    flex-grow: 0;
    flex-basis: auto;
    width: auto;
    max-width: none; }
  .no-flexbox .grid__unit[g-md~="cols:min"] {
    width: auto; }
  .flexbox .grid__unit[g-md~="cols:max"] {
    flex-grow: 1;
    flex-basis: auto;
    width: auto;
    max-width: none; }
  .no-flexbox .grid__unit[g-md~="cols:max"] {
    width: 100%; }
  .flexbox .grid__unit[g-md~="cols:1"] {
    flex-basis: 8.33333%;
    max-width: 8.33333%; }
  .no-flexbox .grid__unit[g-md~="cols:1"] {
    width: 8.33333%; }
  .flexbox .grid__unit[g-md~="cols:2"] {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }
  .no-flexbox .grid__unit[g-md~="cols:2"] {
    width: 16.66667%; }
  .flexbox .grid__unit[g-md~="cols:3"] {
    flex-basis: 25%;
    max-width: 25%; }
  .no-flexbox .grid__unit[g-md~="cols:3"] {
    width: 25%; }
  .flexbox .grid__unit[g-md~="cols:4"] {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }
  .no-flexbox .grid__unit[g-md~="cols:4"] {
    width: 33.33333%; }
  .flexbox .grid__unit[g-md~="cols:5"] {
    flex-basis: 41.66667%;
    max-width: 41.66667%; }
  .no-flexbox .grid__unit[g-md~="cols:5"] {
    width: 41.66667%; }
  .flexbox .grid__unit[g-md~="cols:6"] {
    flex-basis: 50%;
    max-width: 50%; }
  .no-flexbox .grid__unit[g-md~="cols:6"] {
    width: 50%; }
  .flexbox .grid__unit[g-md~="cols:7"] {
    flex-basis: 58.33333%;
    max-width: 58.33333%; }
  .no-flexbox .grid__unit[g-md~="cols:7"] {
    width: 58.33333%; }
  .flexbox .grid__unit[g-md~="cols:8"] {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }
  .no-flexbox .grid__unit[g-md~="cols:8"] {
    width: 66.66667%; }
  .flexbox .grid__unit[g-md~="cols:9"] {
    flex-basis: 75%;
    max-width: 75%; }
  .no-flexbox .grid__unit[g-md~="cols:9"] {
    width: 75%; }
  .flexbox .grid__unit[g-md~="cols:10"] {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }
  .no-flexbox .grid__unit[g-md~="cols:10"] {
    width: 83.33333%; }
  .flexbox .grid__unit[g-md~="cols:11"] {
    flex-basis: 91.66667%;
    max-width: 91.66667%; }
  .no-flexbox .grid__unit[g-md~="cols:11"] {
    width: 91.66667%; }
  .flexbox .grid__unit[g-md~="cols:12"] {
    flex-basis: 100%;
    max-width: 100%; }
  .no-flexbox .grid__unit[g-md~="cols:12"] {
    width: 100%; }
  .flexbox .grid__unit[g-md~="visible"],
  .no-flexbox .grid__unit[g-md~="visible"] {
    display: inline-block; }
  .flexbox .grid__unit[g-md~="invisible"],
  .no-flexbox .grid__unit[g-md~="invisible"] {
    display: none; }
  .grid__unit[g-md~="order:first"] {
    order: -1; }
  .grid__unit[g-md~="order:last"] {
    order: 12; }
  [g-md~="text:left"] {
    text-align: left; }
  [g-md~="text:center"] {
    text-align: center; }
  [g-md~="text:right"] {
    text-align: right; }
  [g-md~="display:none"] {
    display: none; }
  [g-md~="display:inline"] {
    display: inline; }
  [g-md~="display:inline-block"] {
    display: inline-block; }
  [g-md~="display:block"] {
    display: block; } }

@media (min-width: 50em) {
  .flexbox .grid[g-lg~="halign:left"] {
    justify-content: flex-start; }
  .no-flexbox .grid[g-lg~="halign:left"] {
    text-align: left; }
  .flexbox .grid[g-lg~="halign:left"].grid__unit[g-lg~="order:reversed"] {
    justify-content: flex-end; }
  .no-flexbox .grid[g-lg~="halign:left"].grid__unit[g-lg~="order:reversed"] {
    text-align: left; }
  .flexbox .grid[g-lg~="halign:center"] {
    justify-content: center; }
  .no-flexbox .grid[g-lg~="halign:center"] {
    text-align: center; }
  .flexbox .grid[g-lg~="halign:right"] {
    justify-content: flex-end; }
  .no-flexbox .grid[g-lg~="halign:right"] {
    text-align: right; }
  .flexbox .grid[g-lg~="halign:right"].grid__unit[g-lg~="order:reversed"] {
    justify-content: flex-start; }
  .no-flexbox .grid[g-lg~="halign:right"].grid__unit[g-lg~="order:reversed"] {
    text-align: right; }
  .flexbox .grid[g-lg~="halign:justify"] {
    justify-content: space-between; }
  .no-flexbox .grid[g-lg~="halign:justify"] {
    text-align: justify;
    text-justify: distribute; }
  .no-flexbox .grid[g-lg~="halign:justify"]:after {
    display: inline-block;
    content: "";
    width: 100%; }
  .flexbox .grid[g-lg~="halign:justify-center"] {
    justify-content: space-around; }
  .no-flexbox .grid[g-lg~="halign:justify-center"] {
    text-align: justify;
    text-justify: distribute; }
  .no-flexbox .grid[g-lg~="halign:justify-center"]:after {
    display: inline-block;
    content: "";
    width: 100%; }
  .flexbox .grid[g-lg~="valign:top"] {
    align-items: flex-start; }
  .flexbox .grid[g-lg~="valign:middle"] {
    align-items: center; }
  .flexbox .grid[g-lg~="valign:bottom"] {
    align-items: flex-end; }
  .flexbox .grid[g-lg~="valign:stretch"] {
    align-items: stretch; }
  .flexbox .grid[g-lg~="order:reverse"] {
    flex-direction: row-reverse; }
  .flexbox .grid[g-lg~="wrap:wrap"] {
    flex-wrap: wrap; }
  .flexbox .grid[g-lg~="wrap:nowrap"] {
    flex-wrap: nowrap; }
  .flexbox .grid[g-lg~="wrap:wrap-reverse"] {
    flex-wrap: wrap-reverse; }
  .flexbox .grid__unit[g-lg~="cols:min"] {
    flex-grow: 0;
    flex-basis: auto;
    width: auto;
    max-width: none; }
  .no-flexbox .grid__unit[g-lg~="cols:min"] {
    width: auto; }
  .flexbox .grid__unit[g-lg~="cols:max"] {
    flex-grow: 1;
    flex-basis: auto;
    width: auto;
    max-width: none; }
  .no-flexbox .grid__unit[g-lg~="cols:max"] {
    width: 100%; }
  .flexbox .grid__unit[g-lg~="cols:1"] {
    flex-basis: 8.33333%;
    max-width: 8.33333%; }
  .no-flexbox .grid__unit[g-lg~="cols:1"] {
    width: 8.33333%; }
  .flexbox .grid__unit[g-lg~="cols:2"] {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }
  .no-flexbox .grid__unit[g-lg~="cols:2"] {
    width: 16.66667%; }
  .flexbox .grid__unit[g-lg~="cols:3"] {
    flex-basis: 25%;
    max-width: 25%; }
  .no-flexbox .grid__unit[g-lg~="cols:3"] {
    width: 25%; }
  .flexbox .grid__unit[g-lg~="cols:4"] {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }
  .no-flexbox .grid__unit[g-lg~="cols:4"] {
    width: 33.33333%; }
  .flexbox .grid__unit[g-lg~="cols:5"] {
    flex-basis: 41.66667%;
    max-width: 41.66667%; }
  .no-flexbox .grid__unit[g-lg~="cols:5"] {
    width: 41.66667%; }
  .flexbox .grid__unit[g-lg~="cols:6"] {
    flex-basis: 50%;
    max-width: 50%; }
  .no-flexbox .grid__unit[g-lg~="cols:6"] {
    width: 50%; }
  .flexbox .grid__unit[g-lg~="cols:7"] {
    flex-basis: 58.33333%;
    max-width: 58.33333%; }
  .no-flexbox .grid__unit[g-lg~="cols:7"] {
    width: 58.33333%; }
  .flexbox .grid__unit[g-lg~="cols:8"] {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }
  .no-flexbox .grid__unit[g-lg~="cols:8"] {
    width: 66.66667%; }
  .flexbox .grid__unit[g-lg~="cols:9"] {
    flex-basis: 75%;
    max-width: 75%; }
  .no-flexbox .grid__unit[g-lg~="cols:9"] {
    width: 75%; }
  .flexbox .grid__unit[g-lg~="cols:10"] {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }
  .no-flexbox .grid__unit[g-lg~="cols:10"] {
    width: 83.33333%; }
  .flexbox .grid__unit[g-lg~="cols:11"] {
    flex-basis: 91.66667%;
    max-width: 91.66667%; }
  .no-flexbox .grid__unit[g-lg~="cols:11"] {
    width: 91.66667%; }
  .flexbox .grid__unit[g-lg~="cols:12"] {
    flex-basis: 100%;
    max-width: 100%; }
  .no-flexbox .grid__unit[g-lg~="cols:12"] {
    width: 100%; }
  .flexbox .grid__unit[g-lg~="visible"],
  .no-flexbox .grid__unit[g-lg~="visible"] {
    display: inline-block; }
  .flexbox .grid__unit[g-lg~="invisible"],
  .no-flexbox .grid__unit[g-lg~="invisible"] {
    display: none; }
  .grid__unit[g-lg~="order:first"] {
    order: -1; }
  .grid__unit[g-lg~="order:last"] {
    order: 12; }
  [g-lg~="text:left"] {
    text-align: left; }
  [g-lg~="text:center"] {
    text-align: center; }
  [g-lg~="text:right"] {
    text-align: right; }
  [g-lg~="display:none"] {
    display: none; }
  [g-lg~="display:inline"] {
    display: inline; }
  [g-lg~="display:inline-block"] {
    display: inline-block; }
  [g-lg~="display:block"] {
    display: block; } }

@media (min-width: 60em) {
  .flexbox .grid[g-xl~="halign:left"] {
    justify-content: flex-start; }
  .no-flexbox .grid[g-xl~="halign:left"] {
    text-align: left; }
  .flexbox .grid[g-xl~="halign:left"].grid__unit[g-xl~="order:reversed"] {
    justify-content: flex-end; }
  .no-flexbox .grid[g-xl~="halign:left"].grid__unit[g-xl~="order:reversed"] {
    text-align: left; }
  .flexbox .grid[g-xl~="halign:center"] {
    justify-content: center; }
  .no-flexbox .grid[g-xl~="halign:center"] {
    text-align: center; }
  .flexbox .grid[g-xl~="halign:right"] {
    justify-content: flex-end; }
  .no-flexbox .grid[g-xl~="halign:right"] {
    text-align: right; }
  .flexbox .grid[g-xl~="halign:right"].grid__unit[g-xl~="order:reversed"] {
    justify-content: flex-start; }
  .no-flexbox .grid[g-xl~="halign:right"].grid__unit[g-xl~="order:reversed"] {
    text-align: right; }
  .flexbox .grid[g-xl~="halign:justify"] {
    justify-content: space-between; }
  .no-flexbox .grid[g-xl~="halign:justify"] {
    text-align: justify;
    text-justify: distribute; }
  .no-flexbox .grid[g-xl~="halign:justify"]:after {
    display: inline-block;
    content: "";
    width: 100%; }
  .flexbox .grid[g-xl~="halign:justify-center"] {
    justify-content: space-around; }
  .no-flexbox .grid[g-xl~="halign:justify-center"] {
    text-align: justify;
    text-justify: distribute; }
  .no-flexbox .grid[g-xl~="halign:justify-center"]:after {
    display: inline-block;
    content: "";
    width: 100%; }
  .flexbox .grid[g-xl~="valign:top"] {
    align-items: flex-start; }
  .flexbox .grid[g-xl~="valign:middle"] {
    align-items: center; }
  .flexbox .grid[g-xl~="valign:bottom"] {
    align-items: flex-end; }
  .flexbox .grid[g-xl~="valign:stretch"] {
    align-items: stretch; }
  .flexbox .grid[g-xl~="order:reverse"] {
    flex-direction: row-reverse; }
  .flexbox .grid[g-xl~="wrap:wrap"] {
    flex-wrap: wrap; }
  .flexbox .grid[g-xl~="wrap:nowrap"] {
    flex-wrap: nowrap; }
  .flexbox .grid[g-xl~="wrap:wrap-reverse"] {
    flex-wrap: wrap-reverse; }
  .flexbox .grid__unit[g-xl~="cols:min"] {
    flex-grow: 0;
    flex-basis: auto;
    width: auto;
    max-width: none; }
  .no-flexbox .grid__unit[g-xl~="cols:min"] {
    width: auto; }
  .flexbox .grid__unit[g-xl~="cols:max"] {
    flex-grow: 1;
    flex-basis: auto;
    width: auto;
    max-width: none; }
  .no-flexbox .grid__unit[g-xl~="cols:max"] {
    width: 100%; }
  .flexbox .grid__unit[g-xl~="cols:1"] {
    flex-basis: 8.33333%;
    max-width: 8.33333%; }
  .no-flexbox .grid__unit[g-xl~="cols:1"] {
    width: 8.33333%; }
  .flexbox .grid__unit[g-xl~="cols:2"] {
    flex-basis: 16.66667%;
    max-width: 16.66667%; }
  .no-flexbox .grid__unit[g-xl~="cols:2"] {
    width: 16.66667%; }
  .flexbox .grid__unit[g-xl~="cols:3"] {
    flex-basis: 25%;
    max-width: 25%; }
  .no-flexbox .grid__unit[g-xl~="cols:3"] {
    width: 25%; }
  .flexbox .grid__unit[g-xl~="cols:4"] {
    flex-basis: 33.33333%;
    max-width: 33.33333%; }
  .no-flexbox .grid__unit[g-xl~="cols:4"] {
    width: 33.33333%; }
  .flexbox .grid__unit[g-xl~="cols:5"] {
    flex-basis: 41.66667%;
    max-width: 41.66667%; }
  .no-flexbox .grid__unit[g-xl~="cols:5"] {
    width: 41.66667%; }
  .flexbox .grid__unit[g-xl~="cols:6"] {
    flex-basis: 50%;
    max-width: 50%; }
  .no-flexbox .grid__unit[g-xl~="cols:6"] {
    width: 50%; }
  .flexbox .grid__unit[g-xl~="cols:7"] {
    flex-basis: 58.33333%;
    max-width: 58.33333%; }
  .no-flexbox .grid__unit[g-xl~="cols:7"] {
    width: 58.33333%; }
  .flexbox .grid__unit[g-xl~="cols:8"] {
    flex-basis: 66.66667%;
    max-width: 66.66667%; }
  .no-flexbox .grid__unit[g-xl~="cols:8"] {
    width: 66.66667%; }
  .flexbox .grid__unit[g-xl~="cols:9"] {
    flex-basis: 75%;
    max-width: 75%; }
  .no-flexbox .grid__unit[g-xl~="cols:9"] {
    width: 75%; }
  .flexbox .grid__unit[g-xl~="cols:10"] {
    flex-basis: 83.33333%;
    max-width: 83.33333%; }
  .no-flexbox .grid__unit[g-xl~="cols:10"] {
    width: 83.33333%; }
  .flexbox .grid__unit[g-xl~="cols:11"] {
    flex-basis: 91.66667%;
    max-width: 91.66667%; }
  .no-flexbox .grid__unit[g-xl~="cols:11"] {
    width: 91.66667%; }
  .flexbox .grid__unit[g-xl~="cols:12"] {
    flex-basis: 100%;
    max-width: 100%; }
  .no-flexbox .grid__unit[g-xl~="cols:12"] {
    width: 100%; }
  .flexbox .grid__unit[g-xl~="visible"],
  .no-flexbox .grid__unit[g-xl~="visible"] {
    display: inline-block; }
  .flexbox .grid__unit[g-xl~="invisible"],
  .no-flexbox .grid__unit[g-xl~="invisible"] {
    display: none; }
  .grid__unit[g-xl~="order:first"] {
    order: -1; }
  .grid__unit[g-xl~="order:last"] {
    order: 12; }
  [g-xl~="text:left"] {
    text-align: left; }
  [g-xl~="text:center"] {
    text-align: center; }
  [g-xl~="text:right"] {
    text-align: right; }
  [g-xl~="display:none"] {
    display: none; }
  [g-xl~="display:inline"] {
    display: inline; }
  [g-xl~="display:inline-block"] {
    display: inline-block; }
  [g-xl~="display:block"] {
    display: block; } }

.content {
  width: 100%;
  max-width: 60rem;
  margin-right: auto;
  margin-left: auto; }