Easy media queries in sass

mixin

@mixin respond-to($media) {
    @if $media == small {
        @media only screen and (max-width: 420px) { @content }
    }
    @else if $media == medium {
        @media only screen and (max-width: 768px) { @content }
    }
    @else if $media == large {
        @media only screen and (max-width: 980px) { @content }
    }
}

style

.some{
    margin-top: 20px;
    @include respond-to(small){
        margin-top: 10px;
    }
}