/* ==========================================================================
   QUERIES
   ========================================================================== */

/*
 * Mixing for mobile first queries.
 * Two breakpoints.
 * Use like @include break(medium) { ***Styles*** }
 *
 */

@mixin break($point) {
  @if $point == not-small {
    @media screen and (min-width: 48em) {
      @content;
    }
  }
  @else if $point == medium {
    @media screen and (min-width: 48em) and (max-width:64em) {
      @content;
    }
  }
  @else if $point == large {
    @media screen and (min-width: 64em)  {
      @content;
    }
  }
}