<===> input.scss
@mixin foo() {
  name: foo;
  @content;
  @include bar() {
    stuff: content for bar;
    @content;
  }
}

@mixin bar() {
  name: bar;
  @content;
}

div {
  /* with a content block */
  @include foo() {
    stuff: content for foo;
  }
  /* without */
  @include foo();
}

@mixin foo() {
  $size: 80%;
  div {
    color: red;
    @content;
    background: blue;
    width: $size;
    @include bar() {
      color: orange;
      @content;
    }
  }
}

@mixin bar() {
  form {
    @content;
  }
}

span {
  $size: 1.2em;
  color: green;
  @include foo() {
    @media fudge {
      p {
        font-weight: bold;
        font-size: $size;
        a {
          text-decoration: underline;
        }
      }
    }
  }
}

@mixin apply-to-ie6-only {
  * html {
    @content;
  }
}
@include apply-to-ie6-only {
  #logo {
    background-image: url(/logo.gif);
  }
}

<===> output.css
div {
  /* with a content block */
  name: foo;
  stuff: content for foo;
  name: bar;
  stuff: content for bar;
  stuff: content for foo;
  /* without */
  name: foo;
  name: bar;
  stuff: content for bar;
}

span {
  color: green;
}
span div {
  color: red;
  background: blue;
  width: 80%;
}
@media fudge {
  span div p {
    font-weight: bold;
    font-size: 1.2em;
  }
  span div p a {
    text-decoration: underline;
  }
}
span div form {
  color: orange;
}
@media fudge {
  span div form p {
    font-weight: bold;
    font-size: 1.2em;
  }
  span div form p a {
    text-decoration: underline;
  }
}

* html #logo {
  background-image: url(/logo.gif);
}