.monospace.mbm
  %h1 Courier
  %p This is a perfect 40 characters as well.
  .chUnits.chUnits--monospace width: 40ch * 1

.sans-serif.mbm
  %h1 Arial
  %p This is a perfect 40 characters as well.
  .chUnits.chUnits--sansSerif width: 40ch * 0.7986

.serif
  %h1 Georgia
  %p This is a perfect 40 characters as well.
  .chUnits.chUnits--serif width: 40ch * 0.7257

html
  font-size: 20px
  line-height: 1.4
  padding: 40px 40px 0

h1
  margin-bottom: 0.5em
  margin-top: 0
  line-height: 1
  font-size: inherit

p
  margin: 0

.chUnits
  background-color: rgba(red, 0.1)
  display: block
  height: 30px
  line-height: 30px
  text-indent: 20px  

.chUnits--monospace
  width: 40ch * 1

.chUnits--sansSerif
  width: 40ch * 0.7986

.chUnits--serif
  width: 40ch * 0.7257

.monospace
  font-family: 'Courier', monospace

.sans-serif
  font-family: 'Arial', sans-serif

.serif
  font-family: 'Georgia', serif

.mbm
  margin-bottom: 1.75em