@function get-columns($size) { ... }@function get-columns($size) { 
  $columns: common.get-map-by-key-safe(settings.$columns, $size, 'column');

  @return $columns;
 }

@function get-gutters($size) { ... }@function get-gutters($size) { 
  $gutter: common.get-map-by-key-safe(settings.$gutters, $size, 'gutter');

  @return $gutter;
 }

@function get-column-width($span, $size) { ... }@function get-column-width($span, $size) { 
  $columns: if(meta.type-of($size) == string, get-columns($size), $size);
  @return if($span < $columns, math.percentage(math.div($span, $columns)), 100%);
 }

@function has-min-breakpoint($size) { ... }@function has-min-breakpoint($size) { 
  @return if(common.get-breakpoint-min($size) != 0, true, false);
 }

@function has-max-breakpoint($size) { ... }@function has-max-breakpoint($size) { 
  @return if(common.get-breakpoint-max($size) != null, true, false);
 }

@mixin container-base() { ... }@mixin container-base() { 
  box-sizing: border-box;
  display: flex;
  flex: {
    direction: row;
    wrap: wrap;
  }
 }

@mixin container-aligned-left() { ... }@mixin container-aligned-left() { 
  justify-content: flex-start;
 }

@mixin container-aligned-right() { ... }@mixin container-aligned-right() { 
  justify-content: flex-end;
 }

@mixin container-aligned-center() { ... }@mixin container-aligned-center() { 
  justify-content: center;
 }

@mixin container-vertical-aligned-top() { ... }@mixin container-vertical-aligned-top() { 
  align-items: flex-start;
 }

@mixin container-vertical-aligned-bottom() { ... }@mixin container-vertical-aligned-bottom() { 
  align-items: flex-end;
 }

@mixin container-vertical-aligned-center() { ... }@mixin container-vertical-aligned-center() { 
  align-items: center;
 }

@mixin container-spacing($gutter, $query) { ... }@mixin container-spacing($gutter, $query) { 
  $formatted-gutter: calc((#{$gutter} * 0.5) * -1);
  @if meta.type-of($gutter) == 'number' {
    // check to avoid breaking change
    $formatted-gutter: unit.rem(($gutter * 0.5)) * -1;
  }

  @if $query {
    @include common.media-query($query) {
      margin: {
        left: $formatted-gutter;
        right: $formatted-gutter;
      }
    }
  } @else {
    margin: {
      left: $formatted-gutter;
      right: $formatted-gutter;
    }
  }
 }

@mixin generate-container-spacing() { ... }@mixin generate-container-spacing() { 
  @each $size, $gutter in settings.$gutters {
    @include container-spacing($gutter, min-#{$size});
  }
 }

@mixin item-base() { ... }@mixin item-base() { 
  box-sizing: border-box;
 }

@mixin item-spacing($gutter, $query) { ... }@mixin item-spacing($gutter, $query) { 
  $horizontal-gutter: calc(#{$gutter} * 0.5);
  $vertical-gutter: $gutter;
  @if meta.type-of($gutter) == 'number' {
    // check to avoid breaking change
    $horizontal-gutter: unit.rem(($gutter * 0.5));
    $vertical-gutter: unit.rem($gutter);
  }

  @if $query {
    @include common.media-query($query) {
      margin: {
        left: $horizontal-gutter;
        right: $horizontal-gutter;
        bottom: $vertical-gutter;
      }
    }
  } @else {
    margin: {
      left: $horizontal-gutter;
      right: $horizontal-gutter;
      bottom: $vertical-gutter;
    }
  }
 }

@mixin generate-item-spacing() { ... }@mixin generate-item-spacing() { 
  @each $size, $gutter in settings.$gutters {
    @include item-spacing($gutter, min-#{$size});
  }
 }

@mixin item-span-modifier($prefix, $span, $suffix: '', $at) { ... }@mixin item-span-modifier($prefix, $span, $suffix: '', $at) { 
  $selector: '' + $prefix + '-' + $span + $suffix;

  @if $at {
    #{$selector}\@#{$at} {
      @content;
    }
  } @else {
    #{$selector} {
      @content;
    }
  }
 }

@mixin item-span-width($span, $columns, $gutter) { ... }@mixin item-span-width($span, $columns, $gutter) { 
  $width: functions.get-column-width($span, $columns);
  $formatted-gutter: $gutter;
  @if meta.type-of($gutter) == 'number' {
    // check to avoid breaking change
    $formatted-gutter: unit.rem($gutter);
  }

  width: calc(#{$width} - #{$formatted-gutter});
 }

@mixin generate-item-span-width($span, $size) { ... }@mixin generate-item-span-width($span, $size) { 
  $columns: functions.get-columns($size);
  $gutter: functions.get-gutters($size);

  @include item-span-width($span, $columns, $gutter);
 }

@mixin generate-item-spans($size, $prefix, $suffix: '', $at) { ... }@mixin generate-item-spans($size, $prefix, $suffix: '', $at) { 
  @for $i from 1 through functions.get-columns($size) {
    @include item-span-modifier($prefix, $i, $suffix, $at) {
      @include generate-item-span-width($i, $size);
    }
  }
 }

@mixin generate-breakpoint-item-spans($size, $selector) { ... }@mixin generate-breakpoint-item-spans($size, $selector) { 
  $has-min: functions.has-min-breakpoint($size);
  $has-max: functions.has-max-breakpoint($size);
  $min-size: min-#{$size};
  @if $has-min {
    // Min
    @include common.media-query($min-size) {
      @include generate-item-spans($size, $selector, $at: $min-size);
    }

    // Only
    @include common.media-query($size) {
      @include generate-item-spans($size, $selector, $at: $size);
    }
  } @else {
    // Min
    @include generate-item-spans($size, $selector, $at: $min-size);
  }

  @if $has-max {
    $max-size: max-#{$size};
    @include common.media-query($max-size) {
      @if not $has-min {
        // Only
        @include generate-item-spans($size, $selector, $at: $size);
      }

      // Max
      @include generate-item-spans($size, $selector, $at: $max-size);
    }
  }
 }

@mixin generate-all-item-spans($selector) { ... }@mixin generate-all-item-spans($selector) { 
  @each $size in common.get-breakpoint-sizes() {
    @include generate-breakpoint-item-spans($size, $selector);
  }
 }

@mixin item-offset-margin($span, $columns, $gutter, $direction: 'left') { ... }@mixin item-offset-margin($span, $columns, $gutter, $direction: 'left') { 
  $width: functions.get-column-width($span, $columns);
  $formatted-gutter: calc(#{$gutter} * 0.5);
  @if meta.type-of($gutter) == 'number' {
    // check to avoid breaking change
    $formatted-gutter: unit.rem($gutter * 0.5);
  }

  margin-#{$direction}: calc(#{$width} + #{$formatted-gutter});
 }

@mixin generate-item-offset-margin($span, $size, $direction: 'left') { ... }@mixin generate-item-offset-margin($span, $size, $direction: 'left') { 
  $columns: functions.get-columns($size);
  $gutter: functions.get-gutters($size);

  @include item-offset-margin($span, $columns, $gutter, $direction);
 }

@mixin generate-item-offsets($size, $prefix, $direction: 'left', $suffix: '', $at) { ... }@mixin generate-item-offsets($size, $prefix, $direction: 'left', $suffix: '', $at) { 
  @for $i from 1 through functions.get-columns($size) {
    @include item-span-modifier($prefix, $i, $suffix, $at) {
      @include generate-item-offset-margin($i, $size, $direction);
    }
  }
 }

@mixin generate-breakpoint-item-offsets($size, $selector, $direction: 'left') { ... }@mixin generate-breakpoint-item-offsets($size, $selector, $direction: 'left') { 
  $has-min: functions.has-min-breakpoint($size);
  $has-max: functions.has-max-breakpoint($size);
  $min-size: min-#{$size};
  @if $has-min {
    // Min
    @include common.media-query($min-size) {
      @include generate-item-offsets($size, $selector, $direction, $at: $min-size);
    }

    // Only
    @include common.media-query($size) {
      @include generate-item-offsets($size, $selector, $direction, $at: $size);
    }
  } @else {
    // Min
    @include generate-item-offsets($size, $selector, $direction, $at: $min-size);
  }

  @if $has-max {
    $max-size: max-#{$size};
    @include common.media-query($max-size) {
      @if not $has-min {
        // Only
        @include generate-item-offsets($size, $selector, $direction, $at: $size);
      }

      // Max
      @include generate-item-offsets($size, $selector, $direction, $at: $max-size);
    }
  }
 }

@mixin generate-all-item-offsets($selector, $direction) { ... }@mixin generate-all-item-offsets($selector, $direction) { 
  @each $size in common.get-breakpoint-sizes() {
    @include generate-breakpoint-item-offsets($size, $selector, $direction);
  }
 }

@mixin generate-item-ordering($size, $prefix, $suffix: '', $at) { ... }@mixin generate-item-ordering($size, $prefix, $suffix: '', $at) { 
  $columns: functions.get-columns($size);
  @include item-span-modifier($prefix, 'first', $suffix, $at) {
    order: -1;
  }
  @for $i from 0 through $columns {
    @include item-span-modifier($prefix, $i, $suffix, $at) {
      order: $i;
    }
  }
  @include item-span-modifier($prefix, 'last', $suffix, $at) {
    order: $columns + 1;
  }
 }

@mixin generate-breakpoint-item-ordering($size, $selector) { ... }@mixin generate-breakpoint-item-ordering($size, $selector) { 
  $has-min: functions.has-min-breakpoint($size);
  $has-max: functions.has-max-breakpoint($size);
  $min-size: min-#{$size};
  @if $has-min {
    // Min
    @include common.media-query($min-size) {
      @include generate-item-ordering($size, $selector, $at: $min-size);
    }

    // Only
    @include common.media-query($size) {
      @include generate-item-ordering($size, $selector, $at: $size);
    }
  } @else {
    // Min
    @include generate-item-ordering($size, $selector, $at: $min-size);
  }

  @if $has-max {
    $max-size: max-#{$size};
    @include common.media-query($max-size) {
      @if not $has-min {
        // Only
        @include generate-item-ordering($size, $selector, $at: $size);
      }

      // Max
      @include generate-item-ordering($size, $selector, $at: $max-size);
    }
  }
 }

@mixin generate-all-item-ordering($selector) { ... }@mixin generate-all-item-ordering($selector) { 
  @each $size in common.get-breakpoint-sizes() {
    @include generate-breakpoint-item-ordering($size, $selector);
  }
 }

@mixin item-span($span, $query, $columns) { ... }@mixin item-span($span, $query, $columns) { 
  $size: common.get-root-size($query);
  $total-columns: if($columns != null, $columns, functions.get-columns($size));
  $gutter: functions.get-gutters($size);

  @include common.media-query($query) {
    @include item-span-width($span, $total-columns, $gutter);
  }
 }

@mixin item-offset($span, $query, $direction: 'left', $columns) { ... }@mixin item-offset($span, $query, $direction: 'left', $columns) { 
  $size: common.get-root-size($query);
  $total-columns: if($columns != null, $columns, functions.get-columns($size));
  $gutter: functions.get-gutters($size);

  @include common.media-query($query) {
    @include item-offset-margin($span, $total-columns, $gutter, $direction);
  }
 }

$columns: (...) !default;$columns: (
  xs: 4,
  sm: 4,
  md: 8,
  lg: 12,
  xl: 12
) !default;

$gutters: (...) !default;$gutters: (
  xs: spacing.get('s4'),
  sm: spacing.get('s4'),
  md: spacing.get('s4'),
  lg: spacing.get('s4'),
  xl: spacing.get('s4')
) !default;