// ============================================================================
// :: Grid
// ============================================================================
/**
 * Scope defined for visualising the grid layout in the layout section of
 * the styleguides.
 *
 * IMPORTANT!!!
 * This creates boxes to create a VISUALISATION of the layout and is not and
 * should DEFINITLY NOT be used in the styleguide itself.
 */

// ============================================================================
// :: Root
// ============================================================================
.s-grid {

  [class*="l-grid__col-"] {
    padding: 0.5rem;

    text-align: center;

    border: 1px solid $bp-border-color-base;
  }
}