LESS CSS makes typography sooo much easier.

typography.less

/******************* TYPOGRAPHY *******************/

/* Variables & Mixins */

/* Fonts & weights */
@font-stack-main: "franklin-gothic-urw-cond", "Helvetica Neue", "Helvetica", "Arial", sans-serif;
@font-weight-book: 400;
@font-weight-medium: 500;
@font-weight-demi: 700;

/* Pixel translations */
@font-size-14: 0.875em;
@font-size-16: 1em;
@font-size-18: 1.125em;
@font-size-20: 1.250em;
@font-size-22: 1.375em;

/* Colors */
@s2s_dark_grey: #3b3b3b;
@s2s_medium_grey: #7e7e7e;
@s2s_light_grey: #dadada;
@s2s_sidebar_light_gray: #bfbfbf;
@s2s_header_light_grey: #ededed;
@s2s_orange: #f15a29;
@s2s_blue: #227296;

/* Mixins */
.type-header{
	text-transform: uppercase;
	font-weight: @font-weight-demi;
}
.type-subheader {
	font-weight: @font-weight-medium;
}
.type-body {
	font-family: @font-stack-main;
	font-weight: @font-weight-book;
	color: @s2s_dark_grey;
}