updated grid version using respond.scss general media query maker

grid.scss

$grid-max: 12;
$grid-column: 80px;
$grid-gutter: 0;

@function gridw ($span: $grid-max, $offset: 0) {
	@if $span != -1 {
		@return ($grid-column * $span) + ($grid-gutter * ($span - 1)) + $offset;
	}

	@return -1;
}

@mixin grid ($span: $grid-max, $offset: 0) {
	width: gridw($span, $offset);
}

@mixin grid-respond ($min: -1, $max: -1, $media: "all") {
	// mixin from respond.scss
	// https://gist.github.com/krambuhl/9dd229f391aceb3012b4
	@include respond(gridw($min), gridw($max), $media) { @content };
}

how to use:

@include grid-respond(0, 6) { 
    body { background: blue; }
}

@include grid-respond(6, 9) { 
    body { background: red; }
}

@include grid-respond(9, 12) {
    body { background: pink; }
}

@include grid-respond(12) {
    body { background: green; }
}