gistfile1.sass

#hero
  background: white url('../images/hero_bg.png') no-repeat 600px 43px
  border-radius: 3px
  box-shadow: 0px 1px 1px 1px #ccc
  padding: 1em 1.5em 1em 1.5em
  margin: 1.5em 0 0 0
  h1
    color: #0f4c89
    font-size: 2em
  ul
    margin: 1.5em 0 1em 0
    font-size: .9em
    float: left
    list-style: none
    li
      float: left
      width: 80%
      margin: 0 0 .5em 0
  .checkmarkIcon
    background: url('../images/sprites.png') no-repeat -28px -56px
    width: 24px
    height: 24px
    float: left
    margin: 0 .35em 0 0

#apply
  display: block
  clear: both
  font-size: 1.5em
  width: 200px
  margin: 0 0 .35em 0

scss

#hero {
  background: white url('../images/hero_bg.png') no-repeat 600px 43px;
  border-radius: 3px;
  box-shadow: 0px 1px 1px 1px #ccc;
  padding: 1em 1.5em 1em 1.5em;
  margin: 1.5em 0 0 0;
  h1 {
    color: #0f4c89;
    font-size: 2em; }
  ul {
    margin: 1.5em 0 1em 0;
    font-size: .9em;
    float: left;
    list-style: none; }
  li {
    float: left;
    width: 80%;
    margin: 0 0 .5em 0; }
  .checkmarkIcon {
    background: url('../images/sprites.png') no-repeat -28px -56px;
    width: 24px;
    height: 24px;
    float: left;
    margin: 0 .35em 0 0; } }

#apply {
  display: block;
  clear: both;
  font-size: 1.5em;
  width: 200px;
  margin: 0 0 .35em 0; }