/*------------------------------------*\
  #WRAPPERS
\*------------------------------------*/

.container {
  width: 30rem;
  margin: 5rem auto 2rem auto;
}

/*------------------------------------*\
  #WRAPPERS
\*------------------------------------*/

.container {
  width: 30rem;
  margin: ($spacing-unit * 5) auto 0 auto;
}

Fix the wrapper breaking the baseline
Fix the wrapper breaking the baseline

Because of the arbitrary margins I was using, the baseline got knocked
out of alignment if I included any content above the container.

This is now fixed by using multiples of the spacing unit.
