@mixin create-margin-for-breakpoint($margin-size, $breakpoint, $prefix) {
  .m-#{$prefix}-#{$margin-size},
  .mx-#{$prefix}-#{$margin-size},
  .mr-#{$prefix}-#{$margin-size} {
    margin-right: 0.25rem * $margin-size;
  }
  .m-#{$prefix}-#{$margin-size},
  .mx-#{$prefix}-#{$margin-size},
  .ml-#{$prefix}-#{$margin-size} {
    margin-left: 0.25rem * $margin-size;
  }
  .m-#{$prefix}-#{$margin-size},
  .my-#{$prefix}-#{$margin-size},
  .mt-#{$prefix}-#{$margin-size} {
    margin-top: 0.25rem * $margin-size;
  }
  .m-#{$prefix}-#{$margin-size},
  .my-#{$prefix}-#{$margin-size},
  .mb-#{$prefix}-#{$margin-size} {
    margin-bottom: 0.25rem * $margin-size;
  }
}

@mixin create-margin($margin-size) {
  .m-#{$margin-size},
  .mx-#{$margin-size},
  .mr-#{$margin-size} {
    margin-right: 0.25rem * $margin-size;
  }
  .m-#{$margin-size},
  .mx-#{$margin-size},
  .ml-#{$margin-size} {
    margin-left: 0.25rem * $margin-size;
  }
  .m-#{$margin-size},
  .my-#{$margin-size},
  .mt-#{$margin-size} {
    margin-top: 0.25rem * $margin-size;
  }
  .m-#{$margin-size},
  .my-#{$margin-size},
  .mb-#{$margin-size} {
    margin-bottom: 0.25rem * $margin-size;
  }
}