a story about a dude
\n\n// Our Type Scale is as follows with px fallbacks\n// for IE 6-8 as they do not understand REM units.\n//\n// 18, 21, 24, 36, 48, 60, 72, 90, 117\n\n// styles for all headings, in the style of @csswizardry\n%hN {\n text-rendering: optimizeLegibility; // voodoo to enable ligatures and kerning\n line-height: 1; // this fixes huge spaces when a heading wraps onto two lines\n margin-top: 0;\n}\n\n// Multi-dimensional array, where:\n// the first value is the name of the class\n// and the second value is the variable for the size\n$sizes: tera $tera, giga $giga, mega $mega, alpha $alpha, beta $beta,\n gamma $gamma, delta $delta, epsilon $epsilon, zeta $zeta;\n\n// Sass loop to associate h1-h6 tags with their appropriate greek\n// heading based on a modular scale.\n// for each size in the scale, create a class\n@each $size in $sizes {\n .#{nth($size, 1)} {\n @include type-scale(\n nth($size, 2),\n $font-base,\n \"#{$type-scale-unit-value}\",\n $measure\n );\n }\n}\n\n// associate h1-h6 tags with their appropriate greek heading\nh1 {\n @extend .alpha;\n @extend %hN;\n}\n\nh2 {\n @extend .beta;\n @extend %hN;\n}\n\nh3 {\n @extend .gamma;\n @extend %hN;\n}\n\nh4 {\n @extend .delta;\n @extend %hN;\n}\n\nh5 {\n @extend .epsilon;\n @extend %hN;\n}\n\nh6 {\n @extend .zeta;\n @extend %hN;\n}\n\n// $Styles $Parargraphs\n// -------------------------------------//\n\np {\n margin: auto auto $indent-val;\n & + p {\n //siblings indentation\n text-indent: $indent-val;\n margin-top: -$indent-val;\n }\n}\n\n// $Styles $Hyphenation\n// -------------------------------------//\n// http://meyerweb.com/eric/thoughts/2012/12/17/where-to-avoid-css-hyphenation\n\nabbr,\nacronym,\nblockquote,\ncode,\ndir,\nkbd,\nlisting,\nplaintext,\nq,\nsamp,\ntt,\nvar,\nxmp {\n @include css-hyphens(none);\n}\n\n// $Styles $Codeblocks\n// -------------------------------------//\n\npre code {\n @extend %normal-wrap;\n @include white-space(pre-wrap);\n}\n\npre {\n @include white-space(pre);\n}\n\ncode {\n @include white-space(pre);\n font-family: monospace;\n}\n\n// $Styles $Smallcaps\n// -------------------------------------//\n/**\n * Abbreviations Markup\n *\n\tHMTL\n *\n * Extend this object into your markup.\n *\n */\nabbr {\n @include smallcaps($small-caps-color, $small-caps-weight);\n &[title]:hover {\n cursor: help;\n }\n}\n\n// $Styles $Headings-Color\n// -------------------------------------//\n\nh1,\nh2,\nh3,\nh4,\nh5,\nh6 {\n color: $heading-color;\n}\n\n// $Styles $Dropcap\n// -------------------------------------//\n\n// Combats our sibling paragraphs syling and indentation\n// As not to ruin our beautiful drop caps.\np + .drop-cap {\n text-indent: 0;\n margin-top: 0;\n}\n\n.drop-cap {\n @include dropcap(\n $dropcap-float-position,\n $dropcap-font-size,\n $dropcap-font-family,\n $dropcap-txt-indent,\n $dropcap-margin,\n $dropcap-padding,\n $dropcap-color,\n $dropcap-line-height,\n $dropcap-bg\n );\n}\n\n// $Styles $Definition-Lists\n// -------------------------------------//\n/**\n * Lining Definition Style Markup\n *\n\t\n\t\t\t\t\n\t\t\t\n\t\t\t