Type on a Path credit: http://css-tricks.com/set-text-on-a-circle/

type-on-path.html

<h1>
  <span class="char1">T</span>
  <span class="char2">I</span>
  <span class="char3">T</span>
  <span class="char4">L</span>
  <span class="char5">E</span>
</h1>

type-on-path.scss

@mixin rotated-text($num-letters: 100, $angle-span: 180deg, $angle-offset: 0deg) {
	$angle-per-char: $angle-span / $num-letters;
	@for $i from 1 through $num-letters {
		.char#{$i} {
			@include transform(rotate($angle-offset + $angle-per-char * $i));
		}

	}
}

h1{ position: relative; top: -371px; left: 306px; @include rotated-text(5, 108deg, -55deg); 
	span { display: block; font: 22px $font-heading; text-transform: uppercase; height: 450px; position: absolute; width: 40px; text-align: center; left: 0; top: 0; transform-origin: bottom center;}}