@mixin media-breakpoint-up($name, $breakpoints: $grid-breakpoints) {
  $min: breakpoint-min($name, $breakpoints);
  @if $min {
    @media (min-width: $min) {
      @content;
    }
  } @else {
    @content;
  }
}

@mixin media-breakpoint-down($name, $breakpoints: $grid-breakpoints) {
  $max: breakpoint-max($name, $breakpoints);
  @if $max {
    @media (max-width: $max) {
      @content;
    }
  } @else {
    @content;
  }
}

@mixin media-breakpoint-only($name, $breakpoints: $grid-breakpoints) {
  @include media-breakpoint-up($name, $breakpoints) {
    @include media-breakpoint-down($name, $breakpoints) {
      @content;
    }
  }
}

@mixin media-breakpoint-between($lower, $upper, $breakpoints: $grid-breakpoints) {
  @include media-breakpoint-up($lower, $breakpoints) {
    @include media-breakpoint-down($upper, $breakpoints) {
      @content;
    }
  }
}

@mixin container---alter($fluid: false, $gutter: $grid-gutter, $max-widths: $container-max-widths) {
}

@mixin container($fluid: false, $gutter: $grid-gutter, $max-widths: $container-max-widths) {
  width: 100%;
  padding-left: $gutter / 2;
  padding-right: $gutter/ 2;
  margin-right: auto;
  margin-left: auto;
  @if $fluid == false {
    @each $breakpoint, $max-width in $max-widths {
      @include media-breakpoint-up($breakpoint) {
        max-width: $max-width;
      }
    }
  }
  @include container---alter();
}

@mixin grid---alter() {
}

@mixin grid() {
  display: flex;
  flex-wrap: wrap;
  @include grid---alter;
}

@mixin grid--gutter---alter($gutter: $grid-gutter, $vertical: true) {
}

@mixin grid--gutter($gutter: $grid-gutter, $vertical: true) {
  @if $vertical == true {
    margin-top: -$gutter;
  }
  margin-left: -($gutter / 2);
  margin-right: -($gutter / 2);
  @include grid--gutter---alter($gutter, $vertical);
}

@mixin grid__cell---alter() {
}

@mixin grid__cell() {
  position: relative;
  width: 100%;
  min-height: 1px;
  flex-basis: 0;
  flex-grow: 1;
  max-width: 100%;
  @include grid__cell---alter;
}

@mixin grid__cell--gutter---alter($gutter: $grid-gutter, $vertical: true) {
}

@mixin grid__cell--gutter($gutter: $grid-gutter, $vertical: true) {
  @if $vertical == true {
    margin-top: $gutter;
  }
  padding-left: $gutter / 2;
  padding-right: $gutter / 2;
  @include grid__cell--gutter---alter($gutter, $vertical);
}

@mixin grid__cell--auto---alter() {
}

@mixin grid__cell--auto() {
  flex: 0 0 auto;
  width: auto;
  max-width: none;
  @include grid__cell--auto---alter;
}

@mixin grid__cell--size---alter($size, $columns: $grid-columns) {
}

@mixin grid__cell--size($size, $columns: $grid-columns) {
  flex: 0 0 percentage($size / $columns);
  max-width: percentage($size / $columns);
  @include grid__cell--size---alter($size, $columns);
}

@mixin grid--no-vertical---alter() {
}

@mixin grid--no-vertical() {
  margin-top: 0;
  @include grid--no-vertical---alter();
}

@mixin grid__cell--no-vertical---alter() {
}

@mixin grid__cell--no-vertical() {
  margin-top: 0;
  @include grid__cell--no-vertical---alter;
}
