// ==========================================================================
// Breakpoint Mixin
//
// Uses Sass Maps which requires Sass v3.3.0 or newer
// ==========================================================================

// Add or remove breakpoints as you desire
$breakpoints:(
phone: 320px,
phablet: 500px,
tablet: 768px,
desktop: 960px,
);

@mixin breakpoint($size){
@each $breakpoint, $value in $breakpoints {
 @if $size == $breakpoint {
 @media (max-width: map-get($breakpoints, $breakpoint)){
 @content;
 }
 }
}
}

// EXAMPLE
// body {
// @include breakpoint(tablet){
// font-size: 14px;
// };
// }