$breakpoints: (
  orange: calc(1536px + 5rem),
  yellow: calc(1280px + 5rem),
  green: calc(1024px + 5rem),
  blue: calc(768px + 5rem),
  purple: calc(640px + 5rem),
  brown: 425px,
  gray: 330px,
);

@mixin media-query($size) {
  @media only screen and (max-width: map-get($breakpoints, $size)) {
    @content;
  }
}
