responsive.scss

@mixin mq($size) {

  /* Desktop */
    @if $size == "max" {
        @media (min-width: 1200px) {
            @content;
        }
		
	/* Landscape tablet and desktop small */
    } @else if $size == "large" {
        @media (min-width: 979px){
            @content;
        }
	
	/* Portrait tablet */
    } @else if $size == "medium" {
		@media (min-width: 768px) and (max-width: 979px){
            @content;
        }
		
	/* Large phone to portrait phone */
    } @else if $size == "small" {
        @media (max-width: 767px) {
            @content;
        }
		
	/* Small phones */
    } @else if $size == "x-small" {
        @media (max-width: 480px) {
            @content;
        }
    }

}