Screen.scss

screen.scss
@mixin breakpoint($point) {
  @if $point == sm-max {
    @media (max-width: 460px) { @content; }
  }
  @else if $point == md-max {
    @media (max-width: 800px) { @content; }
  }
  @else if $point == lg-max {
    @media (max-width: 1024px)  { @content; }
  }
  @else if $point == sm-min {
    @media (min-width: 320px) { @content; }
  }
  @else if $point == md-min {
    @media (min-width: 768px) { @content; }
  }
  @else if $point == lg-min {
    @media (min-width: 960px)  { @content; }
  }
}

.wrapper {
	@include lego;
 	width: 1024px;
 	@include breakpoint(sm-max) { width: 320px; }
 	@include breakpoint(md-max) { width: 768px; }
 	@include breakpoint(lg-max) { width: 960px; }