/* ==========================================================================
    #THE DEFAULT GRIDABLE GRID
   ========================================================================== */
/**
 * All of the CSS for your public-facing functionality should be
 * included in this file.
 */
.gridable--row {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  overflow: hidden;
  margin-left: -20px; }

.gridable--col {
  flex: 0 0 100%;
  width: 100%;
  max-width: 100%;
  padding-left: 20px; }
  @media only screen and (max-width: 1024px) {
    .gridable--col.is-empty {
      display: none; } }

.gridable--col.col-1 {
  flex-basis: 8.33333%;
  width: 8.33333%;
  max-width: 8.33333%; }

.gridable--col.col-2 {
  flex-basis: 16.66667%;
  width: 16.66667%;
  max-width: 16.66667%; }

.gridable--col.col-3 {
  flex-basis: 25%;
  width: 25%;
  max-width: 25%; }

.gridable--col.col-4 {
  flex-basis: 33.33333%;
  width: 33.33333%;
  max-width: 33.33333%; }

.gridable--col.col-5 {
  flex-basis: 41.66667%;
  width: 41.66667%;
  max-width: 41.66667%; }

.gridable--col.col-6 {
  flex-basis: 50%;
  width: 50%;
  max-width: 50%; }

.gridable--col.col-7 {
  flex-basis: 58.33333%;
  width: 58.33333%;
  max-width: 58.33333%; }

.gridable--col.col-8 {
  flex-basis: 66.66667%;
  width: 66.66667%;
  max-width: 66.66667%; }

.gridable--col.col-9 {
  flex-basis: 75%;
  width: 75%;
  max-width: 75%; }

.gridable--col.col-10 {
  flex-basis: 83.33333%;
  width: 83.33333%;
  max-width: 83.33333%; }

.gridable--col.col-11 {
  flex-basis: 91.66667%;
  width: 91.66667%;
  max-width: 91.66667%; }

.gridable--col.col-12 {
  flex-basis: 100%;
  width: 100%;
  max-width: 100%; }

@media only screen and (max-width: 1024px) {
  .gridable--col[class*="col-"] {
    flex-basis: 100%;
    width: 100%;
    max-width: 100%; } }

.gridable--col {
  overflow: hidden;
  box-sizing: border-box; }

/* Rows and Columns Style Variants.
   ========================================================================== */
.row-style--boxed {
  background-color: #eef1f2; }

.col-style--boxed {
  background-color: #23252d; }
  .col-style--boxed * {
    color: white; }
