$line: 24;
$column: 100% / 18;
$font-size: 16;
$em: $font-size * 1;

* {
  font-family: "Verdana", "Helvetica Neue", "Arial", "Sans-serif";
}

body {
	/* 16px / 24px */
	font-size: $font-size / 16 * 1em;
	line-height: #{$line / $em}em;
}

.small {
	/* 13px / 18px */
	font-size: #{($font-size*0.8125) / $em}em;
	line-height: ($line*0.75) / ($font-size*0.8125) * 1em;
}

.normal, h3 {
	/* 16px / 24px */
	font-size: #{$font-size / $em}em;
	line-height: #{$line / $em}em; /* 24 */
}

.normal-large {
  /* 18 / 30 */
  font-size: #{18 / $em}em;
  line-height: ($line*1.25) / 18 * 1em;
}

.large, h2, h1 {
	/* 26 / 36px */
	font-size: #{26 / $em}em;
	line-height: ($line*1.5) / 26 * 1em;
}

.large-huge {
  /* 30 / 42px */
	font-size: #{30 / $em}em;
	line-height: ($line*1.75) / 30 * 1em;

	&.spaced {
  	line-height: ($line*3) / 30 * 1em;
	}
}

.huge {
	/* 42px / 48px */
	font-size: #{42 / $em}em;
	line-height: ($line*2) / 42 * 1em;
}

.massive {
	/* 68px / 72px */
	font-size: #{68 / $em}em;
	line-height: ($line*2.8) / 68 * 1em;
}

.gigantic {
	/* 110px / 120px */
	font-size: #{110 / $em}em;
	line-height: ($line*5) / 110 * 1em;
}

p {
  font-size: 1.125em; /* 18 / 16 */
  font-family: "minion-pro";

	.drop-cap {
	  font-size: 2em; /* 24 / 12 */
	}
}

h1, h2, h3, h4, h5, h6 {
  font-family: "museo-slab";
  font-weight: 700;
  margin: 0;
}

h1 {
  .small {
    font-size: 0.66666666666667em; /* 20 / 30 */
    font-family: "museo-sans";
    font-weight: 300;
  }
}

#user-nav {
  li {
    font-family: "museo-sans";
    font-weight: 500;
    font-style: italic;
  }
  a {
    font-family: "museo-sans";
    font-weight: 500;
    font-style: normal;
  }
}

#main-nav {
  a {
    font-family: "museo-slab";
    font-weight: 700;
  }
}

button,
#footer-nav a {
  font-family: "museo-sans";
  font-weight: 500;
}