re-porting to scss, fixing some fa variable names

_config.yml

@@ -11,7 +11,7 @@ pygments:         true
 permalink:        pretty
 
 # ensures SCSS files are compiled
-include:          [_bootstrap.scss, _core.scss, _extras.scss, _icons.scss, _mixins.scss, _path.scss, _variables.scss]
+include:          [_bordered-pulled.scss, _core.scss, _fixed-width.scss, _icons.scss, _larger.scss, _list.scss, _mixins.scss, _path.scss, _rotated-flipped.scss, _spinning.scss, _stacked.scss, _variables.scss]
 
 # used in building icon pages
 icon_meta:        src/icons.yml

css/font-awesome.css

@@ -1,4 +1,4 @@
-/*!
+/*
  *  Font Awesome 4.0.0
  *  the iconic font designed for Bootstrap
  *  ------------------------------------------------------------------------------
@@ -27,11 +27,11 @@
  * -------------------------- */
 @font-face {
   font-family: 'FontAwesome';
-  src: url('../fonts/fontawesome-webfont.eot?v=4.0.0');
-  src: url('../fonts/fontawesome-webfont.eot?#iefix&v=4.0.0') format('embedded-opentype'), url('../fonts/fontawesome-webfont.woff?v=4.0.0') format('woff'), url('../fonts/fontawesome-webfont.ttf?v=4.0.0') format('truetype'), url('../fonts/fontawesome-webfont.svg?v=4.0.0#fontawesomeregular') format('svg');
+  src: url("../fonts/fontawesome-webfont.eot?v=4.0.0");
+  src: url("../fonts/fontawesome-webfont.eot?#iefix&v=4.0.0") format("embedded-opentype"), url("../fonts/fontawesome-webfont.woff?v=4.0.0") format("woff"), url("../fonts/fontawesome-webfont.ttf?v=4.0.0") format("truetype"), url("../fonts/fontawesome-webfont.svg?v=4.0.0#fontawesomeregular") format("svg");
   font-weight: normal;
-  font-style: normal;
-}
+  font-style: normal; }
+
 .fa {
   display: inline-block;
   font-family: FontAwesome;
@@ -39,1323 +39,1312 @@
   font-weight: normal;
   line-height: 1;
   -webkit-font-smoothing: antialiased;
-  -moz-osx-font-smoothing: grayscale;
-}
+  -moz-osx-font-smoothing: grayscale; }
+
 /* makes the font 33% larger relative to the icon container */
 .fa-lg {
-  font-size: 1.3333333333333333em;
+  font-size: 1.33333em;
   line-height: 0.75em;
-  vertical-align: -15%;
-}
+  vertical-align: -15%; }
+
 .fa-2x {
-  font-size: 2em;
-}
+  font-size: 2em; }
+
 .fa-3x {
-  font-size: 3em;
-}
+  font-size: 3em; }
+
 .fa-4x {
-  font-size: 4em;
-}
+  font-size: 4em; }
+
 .fa-5x {
-  font-size: 5em;
-}
+  font-size: 5em; }
+
 .fa-fw {
-  width: 1.2857142857142858em;
-  text-align: center;
-}
+  width: 1.28571em;
+  text-align: center; }
+
 .fa-ul {
   padding-left: 0;
-  margin-left: 2.142857142857143em;
-  list-style-type: none;
-}
-.fa-ul > li {
-  position: relative;
-}
+  margin-left: 2.14286em;
+  list-style-type: none; }
+  .fa-ul > li {
+    position: relative; }
+
 .fa-li {
   position: absolute;
-  left: -2.142857142857143em;
-  width: 2.142857142857143em;
-  top: 0.14285714285714285em;
-  text-align: center;
-}
-.fa-li.fa-lg {
-  left: -1.8571428571428572em;
-}
+  left: -2.14286em;
+  width: 2.14286em;
+  top: 0.14286em;
+  text-align: center; }
+  .fa-li.fa-lg {
+    left: -1.85714em; }
+
 .fa-border {
   padding: .2em .25em .15em;
-  border: solid 1px #eeeeee;
-  border-width: .08em;
-  border-radius: .1em;
-}
+  border: solid 0.08em #eeeeee;
+  border-radius: .1em; }
+
 .pull-right {
-  float: right;
-}
+  float: right; }
+
 .pull-left {
-  float: left;
-}
+  float: left; }
+
 .fa.pull-left {
-  margin-right: .3em;
-}
+  margin-right: .3em; }
 .fa.pull-right {
-  margin-left: .3em;
-}
+  margin-left: .3em; }
+
 .fa-spin {
   -webkit-animation: spin 2s infinite linear;
   -moz-animation: spin 2s infinite linear;
   -o-animation: spin 2s infinite linear;
-  animation: spin 2s infinite linear;
-}
+  animation: spin 2s infinite linear; }
+
 @-moz-keyframes spin {
   0% {
-    -moz-transform: rotate(0deg);
-  }
+    -moz-transform: rotate(0deg); }
+
   100% {
-    -moz-transform: rotate(359deg);
-  }
-}
+    -moz-transform: rotate(359deg); } }
+
 @-webkit-keyframes spin {
   0% {
-    -webkit-transform: rotate(0deg);
-  }
+    -webkit-transform: rotate(0deg); }
+
   100% {
-    -webkit-transform: rotate(359deg);
-  }
-}
+    -webkit-transform: rotate(359deg); } }
+
 @-o-keyframes spin {
   0% {
-    -o-transform: rotate(0deg);
-  }
+    -o-transform: rotate(0deg); }
+
   100% {
-    -o-transform: rotate(359deg);
-  }
-}
+    -o-transform: rotate(359deg); } }
+
 @-ms-keyframes spin {
   0% {
-    -ms-transform: rotate(0deg);
-  }
+    -ms-transform: rotate(0deg); }
+
   100% {
-    -ms-transform: rotate(359deg);
-  }
-}
+    -ms-transform: rotate(359deg); } }
+
 @keyframes spin {
   0% {
-    transform: rotate(0deg);
-  }
+    transform: rotate(0deg); }
+
   100% {
-    transform: rotate(359deg);
-  }
-}
+    transform: rotate(359deg); } }
+
 .fa-rotate-90 {
-  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
   -webkit-transform: rotate(90deg);
   -moz-transform: rotate(90deg);
   -ms-transform: rotate(90deg);
   -o-transform: rotate(90deg);
-  transform: rotate(90deg);
-}
+  transform: rotate(90deg); }
+
 .fa-rotate-180 {
-  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
   -webkit-transform: rotate(180deg);
   -moz-transform: rotate(180deg);
   -ms-transform: rotate(180deg);
   -o-transform: rotate(180deg);
-  transform: rotate(180deg);
-}
+  transform: rotate(180deg); }
+
 .fa-rotate-270 {
-  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
   -webkit-transform: rotate(270deg);
   -moz-transform: rotate(270deg);
   -ms-transform: rotate(270deg);
   -o-transform: rotate(270deg);
-  transform: rotate(270deg);
-}
+  transform: rotate(270deg); }
+
 .fa-flip-horizontal {
-  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1);
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
   -webkit-transform: scale(-1, 1);
   -moz-transform: scale(-1, 1);
   -ms-transform: scale(-1, 1);
   -o-transform: scale(-1, 1);
-  transform: scale(-1, 1);
-}
+  transform: scale(-1, 1); }
+
 .fa-flip-vertical {
-  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1);
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
   -webkit-transform: scale(1, -1);
   -moz-transform: scale(1, -1);
   -ms-transform: scale(1, -1);
   -o-transform: scale(1, -1);
-  transform: scale(1, -1);
-}
+  transform: scale(1, -1); }
+
 .fa-stack {
   position: relative;
   display: inline-block;
   width: 2em;
   height: 2em;
   line-height: 2em;
-  vertical-align: middle;
-}
-.fa-stack-top,
-.fa-stack-bottom {
+  vertical-align: middle; }
+
+.fa-stack-top, .fa-stack-bottom {
   position: absolute;
   width: 100%;
-  text-align: center;
-}
+  text-align: center; }
+
 .fa-stack-top {
-  line-height: inherit;
-}
+  line-height: inherit; }
+
 .fa-stack-bottom {
-  font-size: 2em;
-}
+  font-size: 2em; }
+
 .fa-inverse {
-  color: #ffffff;
-}
+  color: white; }
+
 /* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
    readers do not read off random characters that represent icons */
 .fa-glass:before {
-  content: "\f000";
-}
+  content: "\f000"; }
+
 .fa-music:before {
-  content: "\f001";
-}
+  content: "\f001"; }
+
 .fa-search:before {
-  content: "\f002";
-}
+  content: "\f002"; }
+
 .fa-envelope-o:before {
-  content: "\f003";
-}
+  content: "\f003"; }
+
 .fa-heart:before {
-  content: "\f004";
-}
+  content: "\f004"; }
+
 .fa-star:before {
-  content: "\f005";
-}
+  content: "\f005"; }
+
 .fa-star-o:before {
-  content: "\f006";
-}
+  content: "\f006"; }
+
 .fa-user:before {
-  content: "\f007";
-}
+  content: "\f007"; }
+
 .fa-film:before {
-  content: "\f008";
-}
+  content: "\f008"; }
+
 .fa-th-large:before {
-  content: "\f009";
-}
+  content: "\f009"; }
+
 .fa-th:before {
-  content: "\f00a";
-}
+  content: "\f00a"; }
+
 .fa-th-list:before {
-  content: "\f00b";
-}
+  content: "\f00b"; }
+
 .fa-check:before {
-  content: "\f00c";
-}
+  content: "\f00c"; }
+
 .fa-times:before {
-  content: "\f00d";
-}
+  content: "\f00d"; }
+
 .fa-search-plus:before {
-  content: "\f00e";
-}
+  content: "\f00e"; }
+
 .fa-search-minus:before {
-  content: "\f010";
-}
+  content: "\f010"; }
+
 .fa-power-off:before {
-  content: "\f011";
-}
+  content: "\f011"; }
+
 .fa-signal:before {
-  content: "\f012";
-}
+  content: "\f012"; }
+
 .fa-gear:before,
 .fa-cog:before {
-  content: "\f013";
-}
+  content: "\f013"; }
+
 .fa-trash-o:before {
-  content: "\f014";
-}
+  content: "\f014"; }
+
 .fa-home:before {
-  content: "\f015";
-}
+  content: "\f015"; }
+
 .fa-file-o:before {
-  content: "\f016";
-}
+  content: "\f016"; }
+
 .fa-clock-o:before {
-  content: "\f017";
-}
+  content: "\f017"; }
+
 .fa-road:before {
-  content: "\f018";
-}
+  content: "\f018"; }
+
 .fa-download:before {
-  content: "\f019";
-}
+  content: "\f019"; }
+
 .fa-arrow-circle-o-down:before {
-  content: "\f01a";
-}
+  content: "\f01a"; }
+
 .fa-arrow-circle-o-up:before {
-  content: "\f01b";
-}
+  content: "\f01b"; }
+
 .fa-inbox:before {
-  content: "\f01c";
-}
+  content: "\f01c"; }
+
 .fa-play-circle-o:before {
-  content: "\f01d";
-}
+  content: "\f01d"; }
+
 .fa-rotate-right:before,
 .fa-repeat:before {
-  content: "\f01e";
-}
+  content: "\f01e"; }
+
 .fa-refresh:before {
-  content: "\f021";
-}
+  content: "\f021"; }
+
 .fa-list-alt:before {
-  content: "\f022";
-}
+  content: "\f022"; }
+
 .fa-lock:before {
-  content: "\f023";
-}
+  content: "\f023"; }
+
 .fa-flag:before {
-  content: "\f024";
-}
+  content: "\f024"; }
+
 .fa-headphones:before {
-  content: "\f025";
-}
+  content: "\f025"; }
+
 .fa-volume-off:before {
-  content: "\f026";
-}
+  content: "\f026"; }
+
 .fa-volume-down:before {
-  content: "\f027";
-}
+  content: "\f027"; }
+
 .fa-volume-up:before {
-  content: "\f028";
-}
+  content: "\f028"; }
+
 .fa-qrcode:before {
-  content: "\f029";
-}
+  content: "\f029"; }
+
 .fa-barcode:before {
-  content: "\f02a";
-}
+  content: "\f02a"; }
+
 .fa-tag:before {
-  content: "\f02b";
-}
+  content: "\f02b"; }
+
 .fa-tags:before {
-  content: "\f02c";
-}
+  content: "\f02c"; }
+
 .fa-book:before {
-  content: "\f02d";
-}
+  content: "\f02d"; }
+
 .fa-bookmark:before {
-  content: "\f02e";
-}
+  content: "\f02e"; }
+
 .fa-print:before {
-  content: "\f02f";
-}
+  content: "\f02f"; }
+
 .fa-camera:before {
-  content: "\f030";
-}
+  content: "\f030"; }
+
 .fa-font:before {
-  content: "\f031";
-}
+  content: "\f031"; }
+
 .fa-bold:before {
-  content: "\f032";
-}
+  content: "\f032"; }
+
 .fa-italic:before {
-  content: "\f033";
-}
+  content: "\f033"; }
+
 .fa-text-height:before {
-  content: "\f034";
-}
+  content: "\f034"; }
+
 .fa-text-width:before {
-  content: "\f035";
-}
+  content: "\f035"; }
+
 .fa-align-left:before {
-  content: "\f036";
-}
+  content: "\f036"; }
+
 .fa-align-center:before {
-  content: "\f037";
-}
+  content: "\f037"; }
+
 .fa-align-right:before {
-  content: "\f038";
-}
+  content: "\f038"; }
+
 .fa-align-justify:before {
-  content: "\f039";
-}
+  content: "\f039"; }
+
 .fa-list:before {
-  content: "\f03a";
-}
+  content: "\f03a"; }
+
 .fa-dedent:before,
 .fa-outdent:before {
-  content: "\f03b";
-}
+  content: "\f03b"; }
+
 .fa-indent:before {
-  content: "\f03c";
-}
+  content: "\f03c"; }
+
 .fa-video-camera:before {
-  content: "\f03d";
-}
+  content: "\f03d"; }
+
 .fa-picture-o:before {
-  content: "\f03e";
-}
+  content: "\f03e"; }
+
 .fa-pencil:before {
-  content: "\f040";
-}
+  content: "\f040"; }
+
 .fa-map-marker:before {
-  content: "\f041";
-}
+  content: "\f041"; }
+
 .fa-adjust:before {
-  content: "\f042";
-}
+  content: "\f042"; }
+
 .fa-tint:before {
-  content: "\f043";
-}
+  content: "\f043"; }
+
 .fa-edit:before,
 .fa-pencil-square-o:before {
-  content: "\f044";
-}
+  content: "\f044"; }
+
 .fa-share-square-o:before {
-  content: "\f045";
-}
+  content: "\f045"; }
+
 .fa-check-square-o:before {
-  content: "\f046";
-}
+  content: "\f046"; }
+
 .fa-move:before {
-  content: "\f047";
-}
+  content: "\f047"; }
+
 .fa-step-backward:before {
-  content: "\f048";
-}
+  content: "\f048"; }
+
 .fa-fast-backward:before {
-  content: "\f049";
-}
+  content: "\f049"; }
+
 .fa-backward:before {
-  content: "\f04a";
-}
+  content: "\f04a"; }
+
 .fa-play:before {
-  content: "\f04b";
-}
+  content: "\f04b"; }
+
 .fa-pause:before {
-  content: "\f04c";
-}
+  content: "\f04c"; }
+
 .fa-stop:before {
-  content: "\f04d";
-}
+  content: "\f04d"; }
+
 .fa-forward:before {
-  content: "\f04e";
-}
+  content: "\f04e"; }
+
 .fa-fast-forward:before {
-  content: "\f050";
-}
+  content: "\f050"; }
+
 .fa-step-forward:before {
-  content: "\f051";
-}
+  content: "\f051"; }
+
 .fa-eject:before {
-  content: "\f052";
-}
+  content: "\f052"; }
+
 .fa-chevron-left:before {
-  content: "\f053";
-}
+  content: "\f053"; }
+
 .fa-chevron-right:before {
-  content: "\f054";
-}
+  content: "\f054"; }
+
 .fa-plus-circle:before {
-  content: "\f055";
-}
+  content: "\f055"; }
+
 .fa-minus-circle:before {
-  content: "\f056";
-}
+  content: "\f056"; }
+
 .fa-times-circle:before {
-  content: "\f057";
-}
+  content: "\f057"; }
+
 .fa-check-circle:before {
-  content: "\f058";
-}
+  content: "\f058"; }
+
 .fa-question-circle:before {
-  content: "\f059";
-}
+  content: "\f059"; }
+
 .fa-info-circle:before {
-  content: "\f05a";
-}
+  content: "\f05a"; }
+
 .fa-crosshairs:before {
-  content: "\f05b";
-}
+  content: "\f05b"; }
+
 .fa-times-circle-o:before {
-  content: "\f05c";
-}
+  content: "\f05c"; }
+
 .fa-check-circle-o:before {
-  content: "\f05d";
-}
+  content: "\f05d"; }
+
 .fa-ban:before {
-  content: "\f05e";
-}
+  content: "\f05e"; }
+
 .fa-arrow-left:before {
-  content: "\f060";
-}
+  content: "\f060"; }
+
 .fa-arrow-right:before {
-  content: "\f061";
-}
+  content: "\f061"; }
+
 .fa-arrow-up:before {
-  content: "\f062";
-}
+  content: "\f062"; }
+
 .fa-arrow-down:before {
-  content: "\f063";
-}
+  content: "\f063"; }
+
 .fa-mail-forward:before,
 .fa-share:before {
-  content: "\f064";
-}
+  content: "\f064"; }
+
 .fa-resize-full:before {
-  content: "\f065";
-}
+  content: "\f065"; }
+
 .fa-resize-small:before {
-  content: "\f066";
-}
+  content: "\f066"; }
+
 .fa-plus:before {
-  content: "\f067";
-}
+  content: "\f067"; }
+
 .fa-minus:before {
-  content: "\f068";
-}
+  content: "\f068"; }
+
 .fa-asterisk:before {
-  content: "\f069";
-}
+  content: "\f069"; }
+
 .fa-exclamation-circle:before {
-  content: "\f06a";
-}
+  content: "\f06a"; }
+
 .fa-gift:before {
-  content: "\f06b";
-}
+  content: "\f06b"; }
+
 .fa-leaf:before {
-  content: "\f06c";
-}
+  content: "\f06c"; }
+
 .fa-fire:before {
-  content: "\f06d";
-}
+  content: "\f06d"; }
+
 .fa-eye:before {
-  content: "\f06e";
-}
+  content: "\f06e"; }
+
 .fa-eye-slash:before {
-  content: "\f070";
-}
+  content: "\f070"; }
+
 .fa-warning:before,
 .fa-exclamation-triangle:before {
-  content: "\f071";
-}
+  content: "\f071"; }
+
 .fa-plane:before {
-  content: "\f072";
-}
+  content: "\f072"; }
+
 .fa-calendar:before {
-  content: "\f073";
-}
+  content: "\f073"; }
+
 .fa-random:before {
-  content: "\f074";
-}
+  content: "\f074"; }
+
 .fa-comment:before {
-  content: "\f075";
-}
+  content: "\f075"; }
+
 .fa-magnet:before {
-  content: "\f076";
-}
+  content: "\f076"; }
+
 .fa-chevron-up:before {
-  content: "\f077";
-}
+  content: "\f077"; }
+
 .fa-chevron-down:before {
-  content: "\f078";
-}
+  content: "\f078"; }
+
 .fa-retweet:before {
-  content: "\f079";
-}
+  content: "\f079"; }
+
 .fa-shopping-cart:before {
-  content: "\f07a";
-}
+  content: "\f07a"; }
+
 .fa-folder:before {
-  content: "\f07b";
-}
+  content: "\f07b"; }
+
 .fa-folder-open:before {
-  content: "\f07c";
-}
+  content: "\f07c"; }
+
 .fa-resize-vertical:before {
-  content: "\f07d";
-}
+  content: "\f07d"; }
+
 .fa-resize-horizontal:before {
-  content: "\f07e";
-}
+  content: "\f07e"; }
+
 .fa-bar-chart-o:before {
-  content: "\f080";
-}
+  content: "\f080"; }
+
 .fa-twitter-square:before {
-  content: "\f081";
-}
+  content: "\f081"; }
+
 .fa-facebook-square:before {
-  content: "\f082";
-}
+  content: "\f082"; }
+
 .fa-camera-retro:before {
-  content: "\f083";
-}
+  content: "\f083"; }
+
 .fa-key:before {
-  content: "\f084";
-}
+  content: "\f084"; }
+
 .fa-gears:before,
 .fa-cogs:before {
-  content: "\f085";
-}
+  content: "\f085"; }
+
 .fa-comments:before {
-  content: "\f086";
-}
+  content: "\f086"; }
+
 .fa-thumbs-o-up:before {
-  content: "\f087";
-}
+  content: "\f087"; }
+
 .fa-thumbs-o-down:before {
-  content: "\f088";
-}
+  content: "\f088"; }
+
 .fa-star-half:before {
-  content: "\f089";
-}
+  content: "\f089"; }
+
 .fa-heart-o:before {
-  content: "\f08a";
-}
+  content: "\f08a"; }
+
 .fa-sign-out:before {
-  content: "\f08b";
-}
+  content: "\f08b"; }
+
 .fa-linkedin-square:before {
-  content: "\f08c";
-}
+  content: "\f08c"; }
+
 .fa-thumb-tack:before {
-  content: "\f08d";
-}
+  content: "\f08d"; }
+
 .fa-external-link:before {
-  content: "\f08e";
-}
+  content: "\f08e"; }
+
 .fa-sign-in:before {
-  content: "\f090";
-}
+  content: "\f090"; }
+
 .fa-trophy:before {
-  content: "\f091";
-}
+  content: "\f091"; }
+
 .fa-github-square:before {
-  content: "\f092";
-}
+  content: "\f092"; }
+
 .fa-upload:before {
-  content: "\f093";
-}
+  content: "\f093"; }
+
 .fa-lemon-o:before {
-  content: "\f094";
-}
+  content: "\f094"; }
+
 .fa-phone:before {
-  content: "\f095";
-}
+  content: "\f095"; }
+
 .fa-square-o:before {
-  content: "\f096";
-}
+  content: "\f096"; }
+
 .fa-bookmark-o:before {
-  content: "\f097";
-}
+  content: "\f097"; }
+
 .fa-phone-square:before {
-  content: "\f098";
-}
+  content: "\f098"; }
+
 .fa-twitter:before {
-  content: "\f099";
-}
+  content: "\f099"; }
+
 .fa-facebook:before {
-  content: "\f09a";
-}
+  content: "\f09a"; }
+
 .fa-github:before {
-  content: "\f09b";
-}
+  content: "\f09b"; }
+
 .fa-unlock:before {
-  content: "\f09c";
-}
+  content: "\f09c"; }
+
 .fa-credit-card:before {
-  content: "\f09d";
-}
+  content: "\f09d"; }
+
 .fa-rss:before {
-  content: "\f09e";
-}
+  content: "\f09e"; }
+
 .fa-hdd:before {
-  content: "\f0a0";
-}
+  content: "\f0a0"; }
+
 .fa-bullhorn:before {
-  content: "\f0a1";
-}
+  content: "\f0a1"; }
+
 .fa-bell:before {
-  content: "\f0f3";
-}
+  content: "\f0f3"; }
+
 .fa-certificate:before {
-  content: "\f0a3";
-}
+  content: "\f0a3"; }
+
 .fa-hand-o-right:before {
-  content: "\f0a4";
-}
+  content: "\f0a4"; }
+
 .fa-hand-o-left:before {
-  content: "\f0a5";
-}
+  content: "\f0a5"; }
+
 .fa-hand-o-up:before {
-  content: "\f0a6";
-}
+  content: "\f0a6"; }
+
 .fa-hand-o-down:before {
-  content: "\f0a7";
-}
+  content: "\f0a7"; }
+
 .fa-arrow-circle-left:before {
-  content: "\f0a8";
-}
+  content: "\f0a8"; }
+
 .fa-arrow-circle-right:before {
-  content: "\f0a9";
-}
+  content: "\f0a9"; }
+
 .fa-arrow-circle-up:before {
-  content: "\f0aa";
-}
+  content: "\f0aa"; }
+
 .fa-arrow-circle-down:before {
-  content: "\f0ab";
-}
+  content: "\f0ab"; }
+
 .fa-globe:before {
-  content: "\f0ac";
-}
+  content: "\f0ac"; }
+
 .fa-wrench:before {
-  content: "\f0ad";
-}
+  content: "\f0ad"; }
+
 .fa-tasks:before {
-  content: "\f0ae";
-}
+  content: "\f0ae"; }
+
 .fa-filter:before {
-  content: "\f0b0";
-}
+  content: "\f0b0"; }
+
 .fa-briefcase:before {
-  content: "\f0b1";
-}
+  content: "\f0b1"; }
+
 .fa-fullscreen:before {
-  content: "\f0b2";
-}
+  content: "\f0b2"; }
+
 .fa-group:before {
-  content: "\f0c0";
-}
+  content: "\f0c0"; }
+
 .fa-chain:before,
 .fa-link:before {
-  content: "\f0c1";
-}
+  content: "\f0c1"; }
+
 .fa-cloud:before {
-  content: "\f0c2";
-}
+  content: "\f0c2"; }
+
 .fa-flask:before {
-  content: "\f0c3";
-}
+  content: "\f0c3"; }
+
 .fa-cut:before,
 .fa-scissors:before {
-  content: "\f0c4";
-}
+  content: "\f0c4"; }
+
 .fa-copy:before,
 .fa-files-o:before {
-  content: "\f0c5";
-}
+  content: "\f0c5"; }
+
 .fa-paperclip:before {
-  content: "\f0c6";
-}
+  content: "\f0c6"; }
+
 .fa-save:before,
 .fa-floppy-o:before {
-  content: "\f0c7";
-}
+  content: "\f0c7"; }
+
 .fa-square:before {
-  content: "\f0c8";
-}
+  content: "\f0c8"; }
+
 .fa-reorder:before {
-  content: "\f0c9";
-}
+  content: "\f0c9"; }
+
 .fa-list-ul:before {
-  content: "\f0ca";
-}
+  content: "\f0ca"; }
+
 .fa-list-ol:before {
-  content: "\f0cb";
-}
+  content: "\f0cb"; }
+
 .fa-strikethrough:before {
-  content: "\f0cc";
-}
+  content: "\f0cc"; }
+
 .fa-underline:before {
-  content: "\f0cd";
-}
+  content: "\f0cd"; }
+
 .fa-table:before {
-  content: "\f0ce";
-}
+  content: "\f0ce"; }
+
 .fa-magic:before {
-  content: "\f0d0";
-}
+  content: "\f0d0"; }
+
 .fa-truck:before {
-  content: "\f0d1";
-}
+  content: "\f0d1"; }
+
 .fa-pinterest:before {
-  content: "\f0d2";
-}
+  content: "\f0d2"; }
+
 .fa-pinterest-square:before {
-  content: "\f0d3";
-}
+  content: "\f0d3"; }
+
 .fa-google-plus-square:before {
-  content: "\f0d4";
-}
+  content: "\f0d4"; }
+
 .fa-google-plus:before {
-  content: "\f0d5";
-}
+  content: "\f0d5"; }
+
 .fa-money:before {
-  content: "\f0d6";
-}
+  content: "\f0d6"; }
+
 .fa-caret-down:before {
-  content: "\f0d7";
-}
+  content: "\f0d7"; }
+
 .fa-caret-up:before {
-  content: "\f0d8";
-}
+  content: "\f0d8"; }
+
 .fa-caret-left:before {
-  content: "\f0d9";
-}
+  content: "\f0d9"; }
+
 .fa-caret-right:before {
-  content: "\f0da";
-}
+  content: "\f0da"; }
+
 .fa-columns:before {
-  content: "\f0db";
-}
+  content: "\f0db"; }
+
 .fa-unsorted:before,
 .fa-sort:before {
-  content: "\f0dc";
-}
+  content: "\f0dc"; }
+
 .fa-sort-down:before,
 .fa-sort-asc:before {
-  content: "\f0dd";
-}
+  content: "\f0dd"; }
+
 .fa-sort-up:before,
 .fa-sort-desc:before {
-  content: "\f0de";
-}
+  content: "\f0de"; }
+
 .fa-envelope:before {
-  content: "\f0e0";
-}
+  content: "\f0e0"; }
+
 .fa-linkedin:before {
-  content: "\f0e1";
-}
+  content: "\f0e1"; }
+
 .fa-rotate-left:before,
 .fa-undo:before {
-  content: "\f0e2";
-}
+  content: "\f0e2"; }
+
 .fa-legal:before,
 .fa-gavel:before {
-  content: "\f0e3";
-}
+  content: "\f0e3"; }
+
 .fa-dashboard:before,
 .fa-tachometer:before {
-  content: "\f0e4";
-}
+  content: "\f0e4"; }
+
 .fa-comment-o:before {
-  content: "\f0e5";
-}
+  content: "\f0e5"; }
+
 .fa-comments-o:before {
-  content: "\f0e6";
-}
+  content: "\f0e6"; }
+
 .fa-flash:before,
 .fa-bolt:before {
-  content: "\f0e7";
-}
+  content: "\f0e7"; }
+
 .fa-sitemap:before {
-  content: "\f0e8";
-}
+  content: "\f0e8"; }
+
 .fa-umbrella:before {
-  content: "\f0e9";
-}
+  content: "\f0e9"; }
+
 .fa-paste:before,
 .fa-clipboard:before {
-  content: "\f0ea";
-}
+  content: "\f0ea"; }
+
 .fa-lightbulb-o:before {
-  content: "\f0eb";
-}
+  content: "\f0eb"; }
+
 .fa-exchange:before {
-  content: "\f0ec";
-}
+  content: "\f0ec"; }
+
 .fa-cloud-download:before {
-  content: "\f0ed";
-}
+  content: "\f0ed"; }
+
 .fa-cloud-upload:before {
-  content: "\f0ee";
-}
+  content: "\f0ee"; }
+
 .fa-user-md:before {
-  content: "\f0f0";
-}
+  content: "\f0f0"; }
+
 .fa-stethoscope:before {
-  content: "\f0f1";
-}
+  content: "\f0f1"; }
+
 .fa-suitcase:before {
-  content: "\f0f2";
-}
+  content: "\f0f2"; }
+
 .fa-bell-o:before {
-  content: "\f0a2";
-}
+  content: "\f0a2"; }
+
 .fa-coffee:before {
-  content: "\f0f4";
-}
+  content: "\f0f4"; }
+
 .fa-cutlery:before {
-  content: "\f0f5";
-}
+  content: "\f0f5"; }
+
 .fa-file-text-o:before {
-  content: "\f0f6";
-}
+  content: "\f0f6"; }
+
 .fa-building:before {
-  content: "\f0f7";
-}
+  content: "\f0f7"; }
+
 .fa-hospital:before {
-  content: "\f0f8";
-}
+  content: "\f0f8"; }
+
 .fa-ambulance:before {
-  content: "\f0f9";
-}
+  content: "\f0f9"; }
+
 .fa-medkit:before {
-  content: "\f0fa";
-}
+  content: "\f0fa"; }
+
 .fa-fighter-jet:before {
-  content: "\f0fb";
-}
+  content: "\f0fb"; }
+
 .fa-beer:before {
-  content: "\f0fc";
-}
+  content: "\f0fc"; }
+
 .fa-h-square:before {
-  content: "\f0fd";
-}
+  content: "\f0fd"; }
+
 .fa-plus-square:before {
-  content: "\f0fe";
-}
+  content: "\f0fe"; }
+
 .fa-angle-double-left:before {
-  content: "\f100";
-}
+  content: "\f100"; }
+
 .fa-angle-double-right:before {
-  content: "\f101";
-}
+  content: "\f101"; }
+
 .fa-angle-double-up:before {
-  content: "\f102";
-}
+  content: "\f102"; }
+
 .fa-angle-double-down:before {
-  content: "\f103";
-}
+  content: "\f103"; }
+
 .fa-angle-left:before {
-  content: "\f104";
-}
+  content: "\f104"; }
+
 .fa-angle-right:before {
-  content: "\f105";
-}
+  content: "\f105"; }
+
 .fa-angle-up:before {
-  content: "\f106";
-}
+  content: "\f106"; }
+
 .fa-angle-down:before {
-  content: "\f107";
-}
+  content: "\f107"; }
+
 .fa-desktop:before {
-  content: "\f108";
-}
+  content: "\f108"; }
+
 .fa-laptop:before {
-  content: "\f109";
-}
+  content: "\f109"; }
+
 .fa-tablet:before {
-  content: "\f10a";
-}
+  content: "\f10a"; }
+
 .fa-mobile-phone:before,
 .fa-mobile:before {
-  content: "\f10b";
-}
+  content: "\f10b"; }
+
 .fa-circle-o:before {
-  content: "\f10c";
-}
+  content: "\f10c"; }
+
 .fa-quote-left:before {
-  content: "\f10d";
-}
+  content: "\f10d"; }
+
 .fa-quote-right:before {
-  content: "\f10e";
-}
+  content: "\f10e"; }
+
 .fa-spinner:before {
-  content: "\f110";
-}
+  content: "\f110"; }
+
 .fa-circle:before {
-  content: "\f111";
-}
+  content: "\f111"; }
+
 .fa-mail-reply:before,
 .fa-reply:before {
-  content: "\f112";
-}
+  content: "\f112"; }
+
 .fa-github-alt:before {
-  content: "\f113";
-}
+  content: "\f113"; }
+
 .fa-folder-o:before {
-  content: "\f114";
-}
+  content: "\f114"; }
+
 .fa-folder-open-o:before {
-  content: "\f115";
-}
+  content: "\f115"; }
+
 .fa-expand-o:before {
-  content: "\f116";
-}
+  content: "\f116"; }
+
 .fa-collapse-o:before {
-  content: "\f117";
-}
+  content: "\f117"; }
+
 .fa-smile-o:before {
-  content: "\f118";
-}
+  content: "\f118"; }
+
 .fa-frown-o:before {
-  content: "\f119";
-}
+  content: "\f119"; }
+
 .fa-meh-o:before {
-  content: "\f11a";
-}
+  content: "\f11a"; }
+
 .fa-gamepad:before {
-  content: "\f11b";
-}
+  content: "\f11b"; }
+
 .fa-keyboard-o:before {
-  content: "\f11c";
-}
+  content: "\f11c"; }
+
 .fa-flag-o:before {
-  content: "\f11d";
-}
+  content: "\f11d"; }
+
 .fa-flag-checkered:before {
-  content: "\f11e";
-}
+  content: "\f11e"; }
+
 .fa-terminal:before {
-  content: "\f120";
-}
+  content: "\f120"; }
+
 .fa-code:before {
-  content: "\f121";
-}
+  content: "\f121"; }
+
 .fa-reply-all:before {
-  content: "\f122";
-}
+  content: "\f122"; }
+
 .fa-mail-reply-all:before {
-  content: "\f122";
-}
+  content: "\f122"; }
+
 .fa-star-half-empty:before,
 .fa-star-half-full:before,
 .fa-star-half-o:before {
-  content: "\f123";
-}
+  content: "\f123"; }
+
 .fa-location-arrow:before {
-  content: "\f124";
-}
+  content: "\f124"; }
+
 .fa-crop:before {
-  content: "\f125";
-}
+  content: "\f125"; }
+
 .fa-code-fork:before {
-  content: "\f126";
-}
+  content: "\f126"; }
+
 .fa-unlink:before,
 .fa-chain-broken:before {
-  content: "\f127";
-}
+  content: "\f127"; }
+
 .fa-question:before {
-  content: "\f128";
-}
+  content: "\f128"; }
+
 .fa-info:before {
-  content: "\f129";
-}
+  content: "\f129"; }
+
 .fa-exclamation:before {
-  content: "\f12a";
-}
+  content: "\f12a"; }
+
 .fa-superscript:before {
-  content: "\f12b";
-}
+  content: "\f12b"; }
+
 .fa-subscript:before {
-  content: "\f12c";
-}
+  content: "\f12c"; }
+
 .fa-eraser:before {
-  content: "\f12d";
-}
+  content: "\f12d"; }
+
 .fa-puzzle-piece:before {
-  content: "\f12e";
-}
+  content: "\f12e"; }
+
 .fa-microphone:before {
-  content: "\f130";
-}
+  content: "\f130"; }
+
 .fa-microphone-slash:before {
-  content: "\f131";
-}
+  content: "\f131"; }
+
 .fa-shield:before {
-  content: "\f132";
-}
+  content: "\f132"; }
+
 .fa-calendar-o:before {
-  content: "\f133";
-}
+  content: "\f133"; }
+
 .fa-fire-extinguisher:before {
-  content: "\f134";
-}
+  content: "\f134"; }
+
 .fa-rocket:before {
-  content: "\f135";
-}
+  content: "\f135"; }
+
 .fa-maxcdn:before {
-  content: "\f136";
-}
+  content: "\f136"; }
+
 .fa-chevron-circle-left:before {
-  content: "\f137";
-}
+  content: "\f137"; }
+
 .fa-chevron-circle-right:before {
-  content: "\f138";
-}
+  content: "\f138"; }
+
 .fa-chevron-circle-up:before {
-  content: "\f139";
-}
+  content: "\f139"; }
+
 .fa-chevron-circle-down:before {
-  content: "\f13a";
-}
+  content: "\f13a"; }
+
 .fa-html5:before {
-  content: "\f13b";
-}
+  content: "\f13b"; }
+
 .fa-css3:before {
-  content: "\f13c";
-}
+  content: "\f13c"; }
+
 .fa-anchor:before {
-  content: "\f13d";
-}
+  content: "\f13d"; }
+
 .fa-unlock-o:before {
-  content: "\f13e";
-}
+  content: "\f13e"; }
+
 .fa-bullseye:before {
-  content: "\f140";
-}
+  content: "\f140"; }
+
 .fa-ellipsis-horizontal:before {
-  content: "\f141";
-}
+  content: "\f141"; }
+
 .fa-ellipsis-vertical:before {
-  content: "\f142";
-}
+  content: "\f142"; }
+
 .fa-rss-square:before {
-  content: "\f143";
-}
+  content: "\f143"; }
+
 .fa-play-circle:before {
-  content: "\f144";
-}
+  content: "\f144"; }
+
 .fa-ticket:before {
-  content: "\f145";
-}
+  content: "\f145"; }
+
 .fa-minus-square:before {
-  content: "\f146";
-}
+  content: "\f146"; }
+
 .fa-minus-square-o:before {
-  content: "\f147";
-}
+  content: "\f147"; }
+
 .fa-level-up:before {
-  content: "\f148";
-}
+  content: "\f148"; }
+
 .fa-level-down:before {
-  content: "\f149";
-}
+  content: "\f149"; }
+
 .fa-check-square:before {
-  content: "\f14a";
-}
+  content: "\f14a"; }
+
 .fa-pencil-square:before {
-  content: "\f14b";
-}
+  content: "\f14b"; }
+
 .fa-external-link-square:before {
-  content: "\f14c";
-}
+  content: "\f14c"; }
+
 .fa-share-square:before {
-  content: "\f14d";
-}
+  content: "\f14d"; }
+
 .fa-compass:before {
-  content: "\f14e";
-}
+  content: "\f14e"; }
+
 .fa-toggle-down:before,
 .fa-caret-square-o-down:before {
-  content: "\f150";
-}
+  content: "\f150"; }
+
 .fa-toggle-up:before,
 .fa-caret-square-o-up:before {
-  content: "\f151";
-}
+  content: "\f151"; }
+
 .fa-toggle-right:before,
 .fa-caret-square-o-right:before {
-  content: "\f152";
-}
+  content: "\f152"; }
+
 .fa-euro:before,
 .fa-eur:before {
-  content: "\f153";
-}
+  content: "\f153"; }
+
 .fa-gbp:before {
-  content: "\f154";
-}
+  content: "\f154"; }
+
 .fa-dollar:before,
 .fa-usd:before {
-  content: "\f155";
-}
+  content: "\f155"; }
+
 .fa-rupee:before,
 .fa-inr:before {
-  content: "\f156";
-}
+  content: "\f156"; }
+
 .fa-cny:before,
 .fa-rmb:before,
 .fa-yen:before,
 .fa-jpy:before {
-  content: "\f157";
-}
+  content: "\f157"; }
+
 .fa-ruble:before,
 .fa-rouble:before,
 .fa-rub:before {
-  content: "\f158";
-}
+  content: "\f158"; }
+
 .fa-won:before,
 .fa-krw:before {
-  content: "\f159";
-}
+  content: "\f159"; }
+
 .fa-bitcoin:before,
 .fa-btc:before {
-  content: "\f15a";
-}
+  content: "\f15a"; }
+
 .fa-file:before {
-  content: "\f15b";
-}
+  content: "\f15b"; }
+
 .fa-file-text:before {
-  content: "\f15c";
-}
+  content: "\f15c"; }
+
 .fa-sort-alpha-asc:before {
-  content: "\f15d";
-}
+  content: "\f15d"; }
+
 .fa-sort-alpha-desc:before {
-  content: "\f15e";
-}
+  content: "\f15e"; }
+
 .fa-sort-amount-asc:before {
-  content: "\f160";
-}
+  content: "\f160"; }
+
 .fa-sort-amount-desc:before {
-  content: "\f161";
-}
+  content: "\f161"; }
+
 .fa-sort-numeric-asc:before {
-  content: "\f162";
-}
+  content: "\f162"; }
+
 .fa-sort-numeric-desc:before {
-  content: "\f163";
-}
+  content: "\f163"; }
+
 .fa-thumbs-up:before {
-  content: "\f164";
-}
+  content: "\f164"; }
+
 .fa-thumbs-down:before {
-  content: "\f165";
-}
+  content: "\f165"; }
+
 .fa-youtube-square:before {
-  content: "\f166";
-}
+  content: "\f166"; }
+
 .fa-youtube:before {
-  content: "\f167";
-}
+  content: "\f167"; }
+
 .fa-xing:before {
-  content: "\f168";
-}
+  content: "\f168"; }
+
 .fa-xing-square:before {
-  content: "\f169";
-}
+  content: "\f169"; }
+
 .fa-youtube-play:before {
-  content: "\f16a";
-}
+  content: "\f16a"; }
+
 .fa-dropbox:before {
-  content: "\f16b";
-}
+  content: "\f16b"; }
+
 .fa-stack-overflow:before {
-  content: "\f16c";
-}
+  content: "\f16c"; }
+
 .fa-instagram:before {
-  content: "\f16d";
-}
+  content: "\f16d"; }
+
 .fa-flickr:before {
-  content: "\f16e";
-}
+  content: "\f16e"; }
+
 .fa-adn:before {
-  content: "\f170";
-}
+  content: "\f170"; }
+
 .fa-bitbucket:before {
-  content: "\f171";
-}
+  content: "\f171"; }
+
 .fa-bitbucket-square:before {
-  content: "\f172";
-}
+  content: "\f172"; }
+
 .fa-tumblr:before {
-  content: "\f173";
-}
+  content: "\f173"; }
+
 .fa-tumblr-square:before {
-  content: "\f174";
-}
+  content: "\f174"; }
+
 .fa-long-arrow-down:before {
-  content: "\f175";
-}
+  content: "\f175"; }
+
 .fa-long-arrow-up:before {
-  content: "\f176";
-}
+  content: "\f176"; }
+
 .fa-long-arrow-left:before {
-  content: "\f177";
-}
+  content: "\f177"; }
+
 .fa-long-arrow-right:before {
-  content: "\f178";
-}
+  content: "\f178"; }
+
 .fa-apple:before {
-  content: "\f179";
-}
+  content: "\f179"; }
+
 .fa-windows:before {
-  content: "\f17a";
-}
+  content: "\f17a"; }
+
 .fa-android:before {
-  content: "\f17b";
-}
+  content: "\f17b"; }
+
 .fa-linux:before {
-  content: "\f17c";
-}
+  content: "\f17c"; }
+
 .fa-dribbble:before {
-  content: "\f17d";
-}
+  content: "\f17d"; }
+
 .fa-skype:before {
-  content: "\f17e";
-}
+  content: "\f17e"; }
+
 .fa-foursquare:before {
-  content: "\f180";
-}
+  content: "\f180"; }
+
 .fa-trello:before {
-  content: "\f181";
-}
+  content: "\f181"; }
+
 .fa-female:before {
-  content: "\f182";
-}
+  content: "\f182"; }
+
 .fa-male:before {
-  content: "\f183";
-}
+  content: "\f183"; }
+
 .fa-gittip:before {
-  content: "\f184";
-}
+  content: "\f184"; }
+
 .fa-sun-o:before {
-  content: "\f185";
-}
+  content: "\f185"; }
+
 .fa-moon-o:before {
-  content: "\f186";
-}
+  content: "\f186"; }
+
 .fa-archive:before {
-  content: "\f187";
-}
+  content: "\f187"; }
+
 .fa-bug:before {
-  content: "\f188";
-}
+  content: "\f188"; }
+
 .fa-vk:before {
-  content: "\f189";
-}
+  content: "\f189"; }
+
 .fa-weibo:before {
-  content: "\f18a";
-}
+  content: "\f18a"; }
+
 .fa-renren:before {
-  content: "\f18b";
-}
+  content: "\f18b"; }
+
 .fa-pagelines:before {
-  content: "\f18c";
-}
+  content: "\f18c"; }
+
 .fa-stack-exchange:before {
-  content: "\f18d";
-}
+  content: "\f18d"; }
+
 .fa-arrow-circle-o-right:before {
-  content: "\f18e";
-}
+  content: "\f18e"; }
+
 .fa-arrow-circle-o-left:before {
-  content: "\f190";
-}
+  content: "\f190"; }
+
 .fa-toggle-left:before,
 .fa-caret-square-o-left:before {
-  content: "\f191";
-}
+  content: "\f191"; }
+
 .fa-dot-circle-o:before {
-  content: "\f192";
-}
+  content: "\f192"; }
+
 .fa-wheelchair:before {
-  content: "\f193";
-}
+  content: "\f193"; }
+
 .fa-vimeo-square:before {
-  content: "\f194";
-}
+  content: "\f194"; }
+
 .fa-turkish-lira:before,
 .fa-try:before {
-  content: "\f195";
-}
+  content: "\f195"; }

less/bordered-pulled.less

@@ -3,8 +3,7 @@
 
 .@{fa-css-prefix}-border {
   padding: .2em .25em .15em;
-  border: solid 1px @fa-border-color;
-  border-width: .08em;
+  border: solid .08em @fa-border-color;
   border-radius: .1em;
 }
 

less/list.less

@@ -3,18 +3,17 @@
 
 .@{fa-css-prefix}-ul {
   padding-left: 0;
-  margin-left: @fa-icon-li-width;
+  margin-left: @fa-li-width;
   list-style-type: none;
   > li { position: relative; }
 }
 .@{fa-css-prefix}-li {
   position: absolute;
-  left: -@fa-icon-li-width;
-  width: @fa-icon-li-width;
+  left: -@fa-li-width;
+  width: @fa-li-width;
   top: (2em / 14);
   text-align: center;
   &.@{fa-css-prefix}-lg {
-    left: -@fa-icon-li-width + (4em / 14);
+    left: -@fa-li-width + (4em / 14);
   }
 }
-

less/stacked.less

@@ -16,4 +16,4 @@
 }
 .@{fa-css-prefix}-stack-top { line-height: inherit; }
 .@{fa-css-prefix}-stack-bottom { font-size: 2em; }
-.@{fa-css-prefix}-inverse { color: @fa-icon-inverse; }
+.@{fa-css-prefix}-inverse { color: @fa-inverse; }

less/variables.less

@@ -2,12 +2,12 @@
 // --------------------------
 
 @fa-font-path:        "../fonts";
-//@fa-font-path:       "//netdna.bootstrapcdn.com/font-awesome/4.0.0/font"; // for referencing Bootstrap CDN font files directly
+//@fa-font-path:        "//netdna.bootstrapcdn.com/font-awesome/4.0.0/font"; // for referencing Bootstrap CDN font files directly
 @fa-css-prefix:       fa;
 @fa-version:          "4.0.0";
 @fa-border-color:     #eee;
-@fa-icon-inverse:     #fff;
-@fa-icon-li-width:    (30em / 14);
+@fa-inverse:          #fff;
+@fa-li-width:         (30em / 14);
 
 @fa-var-glass: "\f000";
 @fa-var-music: "\f001";

scss/_bordered-pulled.scss

@@ -0,0 +1,16 @@
+// Bordered & Pulled
+// -------------------------
+
+.#{$fa-css-prefix}-border {
+  padding: .2em .25em .15em;
+  border: solid .08em $fa-border-color;
+  border-radius: .1em;
+}
+
+.pull-right { float: right; }
+.pull-left { float: left; }
+
+.#{$fa-css-prefix} {
+  &.pull-left { margin-right: .3em; }
+  &.pull-right { margin-left: .3em; }
+}

scss/_core.scss

@@ -1,5 +1,5 @@
-/* FONT AWESOME CORE
- * -------------------------- */
+// Base Class Definition
+// -------------------------
 
 .#{$fa-css-prefix} {
   display: inline-block;
@@ -10,101 +10,3 @@
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
-
-/* makes the font 33% larger relative to the icon container */
-.#{$fa-css-prefix}-lg {
-  font-size: (4em / 3);
-  line-height: (3em / 4);
-  vertical-align: -15%;
-}
-
-.#{$fa-css-prefix}-fixed-width {
- width: (18em / 14);
- text-align: center;
-}
-
-
-// Icon UL & LI
-// -------------------------
-
-.#{$fa-css-prefix}-ul {
-  padding-left: 0;
-  margin-left: $fa-icon-li-width;
-  list-style-type: none;
-
-  > li { position: relative; }
-}
-.#{$fa-css-prefix}-li {
-  position: absolute;
-  left: -$fa-icon-li-width;
-  width: $fa-icon-li-width;
-  top: (2em / 14);
-  text-align: center;
-  &.#{$fa-css-prefix}-lg {
-    left: -$fa-icon-li-width + (4em / 14);
-  }
-}
-
-
-// allows usage of the hide class directly on font awesome icons
-.#{$fa-css-prefix}.hide { display: none; }
-
-.#{$fa-css-prefix}-muted { color: $fa-icon-muted; }
-.#{$fa-css-prefix}-light { color: $fa-icon-light; }
-.#{$fa-css-prefix}-dark { color: $fa-icon-dark; }
-
-
-// Icon Borders
-// -------------------------
-
-.#{$fa-css-prefix}-border {
-  padding: .2em .25em .15em;
-  border: solid 1px $fa-border-color;
-  border-radius: 3px;
-}
-
-
-// Icon Sizes
-// -------------------------
-
-.#{$fa-css-prefix}-2x {
-  font-size: 2em;
-  &.#{$fa-css-prefix}-border {
-    border-width: 2px;
-    border-radius: 4px;
-  }
-}
-.#{$fa-css-prefix}-3x {
-  font-size: 3em;
-  &.#{$fa-css-prefix}-border {
-    border-width: 3px;
-    border-radius: 5px;
-  }
-}
-.#{$fa-css-prefix}-4x {
-  font-size: 4em;
-  &.#{$fa-css-prefix}-border {
-    border-width: 4px;
-    border-radius: 6px;
-  }
-}
-.#{$fa-css-prefix}-5x {
-  font-size: 5em;
-  &.#{$fa-css-prefix}-border {
-    border-width: 5px;
-    border-radius: 7px;
-  }
-}
-
-
-// Floats & Margins
-// -------------------------
-
-// Quick floats
-.pull-right { float: right; }
-.pull-left { float: left; }
-
-.#{$fa-css-prefix} {
-  &.pull-left { margin-right: .3em; }
-  &.pull-right { margin-left: .3em; }
-}

scss/_extras.scss

@@ -2,7 +2,6 @@
  * -------------------------- */
 
 /* Stacked and layered icon */
-@include fa-icon-stack();
 
 /* Animated rotating icon */
 .#{$fa-css-prefix}-spin {
@@ -41,5 +40,5 @@
 .#{$fa-css-prefix}-rotate-180 { @include fa-icon-rotate(180deg, 2); }
 .#{$fa-css-prefix}-rotate-270 { @include fa-icon-rotate(270deg, 3); }
 
-.#{$fa-css-prefix}-flip-horizontal { @include fa-icon-flip(-1, 1); }
-.#{$fa-css-prefix}-flip-vertical   { @include fa-icon-flip(1, -1); }
+.#{$fa-css-prefix}-flip-horizontal { @include fa-icon-flip(-1, 1, 0); }
+.#{$fa-css-prefix}-flip-vertical   { @include fa-icon-flip(1, -1, 2); }

scss/_fixed-width.scss

@@ -0,0 +1,6 @@
+// Fixed Width Icons
+// -------------------------
+.#{$fa-css-prefix}-fw {
+  width: (18em / 14);
+  text-align: center;
+}

scss/_larger.scss

@@ -0,0 +1,13 @@
+// Icon Sizes
+// -------------------------
+
+/* makes the font 33% larger relative to the icon container */
+.#{$fa-css-prefix}-lg {
+  font-size: (4em / 3);
+  line-height: (3em / 4);
+  vertical-align: -15%;
+}
+.#{$fa-css-prefix}-2x { font-size: 2em; }
+.#{$fa-css-prefix}-3x { font-size: 3em; }
+.#{$fa-css-prefix}-4x { font-size: 4em; }
+.#{$fa-css-prefix}-5x { font-size: 5em; }

scss/_list.scss

@@ -0,0 +1,19 @@
+// List Icons
+// -------------------------
+
+.#{$fa-css-prefix}-ul {
+  padding-left: 0;
+  margin-left: $fa-li-width;
+  list-style-type: none;
+  > li { position: relative; }
+}
+.#{$fa-css-prefix}-li {
+  position: absolute;
+  left: -$fa-li-width;
+  width: $fa-li-width;
+  top: (2em / 14);
+  text-align: center;
+  &.#{$fa-css-prefix}-lg {
+    left: -$fa-li-width + (4em / 14);
+  }
+}

scss/_mixins.scss

@@ -10,33 +10,11 @@
           transform: rotate($degrees);
 }
 
-@mixin fa-icon-flip($horiz, $vert) {
+@mixin fa-icon-flip($horiz, $vert, $rotation) {
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
   -webkit-transform: scale($horiz, $vert);
      -moz-transform: scale($horiz, $vert);
       -ms-transform: scale($horiz, $vert);
        -o-transform: scale($horiz, $vert);
           transform: scale($horiz, $vert);
 }
-
-@mixin fa-icon-stack($width: 2em, $height: 2em, $top-font-size: 1em, $base-font-size: 2em) {
-  .#{$fa-css-prefix}-stack {
-    position: relative;
-    display: inline-block;
-    width: $width;
-    height: $height;
-    line-height: $width;
-    vertical-align: -35%;
-    .#{$fa-css-prefix} {
-      position: absolute;
-      display: block;
-      width: 100%;
-      height: 100%;
-      font-size: $top-font-size;
-      line-height: inherit;
-      text-align: center;
-    }
-    .#{$fa-css-prefix}-stack-base {
-      font-size: $base-font-size;
-    }
-  }
-}

scss/_rotated-flipped.scss

@@ -0,0 +1,9 @@
+// Rotated & Flipped Icons
+// -------------------------
+
+.#{$fa-css-prefix}-rotate-90  { @include fa-icon-rotate(90deg, 1);  }
+.#{$fa-css-prefix}-rotate-180 { @include fa-icon-rotate(180deg, 2); }
+.#{$fa-css-prefix}-rotate-270 { @include fa-icon-rotate(270deg, 3); }
+
+.#{$fa-css-prefix}-flip-horizontal { @include fa-icon-flip(-1, 1, 0); }
+.#{$fa-css-prefix}-flip-vertical   { @include fa-icon-flip(1, -1, 2); }

scss/_spinning.scss

@@ -0,0 +1,30 @@
+// Spinning Icons
+// --------------------------
+
+.#{$fa-css-prefix}-spin {
+  -webkit-animation: spin 2s infinite linear;
+  -moz-animation: spin 2s infinite linear;
+  -o-animation: spin 2s infinite linear;
+  animation: spin 2s infinite linear;
+}
+
+@-moz-keyframes spin {
+  0% { -moz-transform: rotate(0deg); }
+  100% { -moz-transform: rotate(359deg); }
+}
+@-webkit-keyframes spin {
+  0% { -webkit-transform: rotate(0deg); }
+  100% { -webkit-transform: rotate(359deg); }
+}
+@-o-keyframes spin {
+  0% { -o-transform: rotate(0deg); }
+  100% { -o-transform: rotate(359deg); }
+}
+@-ms-keyframes spin {
+  0% { -ms-transform: rotate(0deg); }
+  100% { -ms-transform: rotate(359deg); }
+}
+@keyframes spin {
+  0% { transform: rotate(0deg); }
+  100% { transform: rotate(359deg); }
+}

scss/_stacked.scss

@@ -0,0 +1,19 @@
+// Stacked Icons
+// -------------------------
+
+.#{$fa-css-prefix}-stack {
+  position: relative;
+  display: inline-block;
+  width: 2em;
+  height: 2em;
+  line-height: 2em;
+  vertical-align: middle;
+}
+.#{$fa-css-prefix}-stack-top, .#{$fa-css-prefix}-stack-bottom {
+  position: absolute;
+  width: 100%;
+  text-align: center;
+}
+.#{$fa-css-prefix}-stack-top { line-height: inherit; }
+.#{$fa-css-prefix}-stack-bottom { font-size: 2em; }
+.#{$fa-css-prefix}-inverse { color: $fa-inverse; }

scss/_variables.scss

@@ -6,10 +6,8 @@ $fa-font-path:        "../fonts" !default;
 $fa-css-prefix:       fa;
 $fa-version:          "4.0.0" !default;
 $fa-border-color:     #eee !default;
-$fa-icon-muted:       #eee !default;
-$fa-icon-light:       #fff !default;
-$fa-icon-dark:        #333 !default;
-$fa-icon-li-width:    (30em / 14);
+$fa-inverse:          #fff !default;
+$fa-li-width:        (30em / 14);
 
 $fa-var-glass: "\f000";
 $fa-var-music: "\f001";

scss/font-awesome.scss

@@ -28,5 +28,11 @@
 @import "mixins";
 @import "path";
 @import "core";
-@import "extras";
+@import "larger";
+@import "fixed-width";
+@import "list";
+@import "bordered-pulled";
+@import "spinning";
+@import "rotated-flipped";
+@import "stacked";
 @import "icons";

src/Makefile

@@ -23,9 +23,9 @@ build:
 	@echo "Compiling Less files"
 	@mkdir -p ${FA_CSS_DIRECTORY}
 
-	lessc ${FA_LESS_MODERN} > ${FA_CSS_MODERN}
-	lessc --compress ${FA_LESS_MODERN} > ${FA_CSS_MODERN_MIN}
-#	sass ${FA_SCSS_MODERN} ${FA_CSS_MODERN}
+#	lessc ${FA_LESS_MODERN} > ${FA_CSS_MODERN}
+#	lessc --compress ${FA_LESS_MODERN} > ${FA_CSS_MODERN_MIN}
+	sass ${FA_SCSS_MODERN} ${FA_CSS_MODERN}
 
 	lessc --compress ${SITE_LESS} > ${SITE_CSS_MIN}
 	cp -r ${FA_ROOT_DIRECTORY}/* ../

src/assets/font-awesome/less/bordered-pulled.less

@@ -6,8 +6,7 @@
 
 .@{fa-css-prefix}-border {
   padding: .2em .25em .15em;
-  border: solid 1px @fa-border-color;
-  border-width: .08em;
+  border: solid .08em @fa-border-color;
   border-radius: .1em;
 }
 

src/assets/font-awesome/less/list.less

@@ -6,18 +6,17 @@
 
 .@{fa-css-prefix}-ul {
   padding-left: 0;
-  margin-left: @fa-icon-li-width;
+  margin-left: @fa-li-width;
   list-style-type: none;
   > li { position: relative; }
 }
 .@{fa-css-prefix}-li {
   position: absolute;
-  left: -@fa-icon-li-width;
-  width: @fa-icon-li-width;
+  left: -@fa-li-width;
+  width: @fa-li-width;
   top: (2em / 14);
   text-align: center;
   &.@{fa-css-prefix}-lg {
-    left: -@fa-icon-li-width + (4em / 14);
+    left: -@fa-li-width + (4em / 14);
   }
 }
-

src/assets/font-awesome/less/stacked.less

@@ -19,4 +19,4 @@
 }
 .@{fa-css-prefix}-stack-top { line-height: inherit; }
 .@{fa-css-prefix}-stack-bottom { font-size: 2em; }
-.@{fa-css-prefix}-inverse { color: @fa-icon-inverse; }
+.@{fa-css-prefix}-inverse { color: @fa-inverse; }

src/assets/font-awesome/less/variables.less

@@ -4,12 +4,12 @@
 // --------------------------
 
 @fa-font-path:        "../fonts";
-//@fa-font-path:       "//netdna.bootstrapcdn.com/font-awesome/{{ site.fontawesome.version}}/font"; // for referencing Bootstrap CDN font files directly
+//@fa-font-path:        "//netdna.bootstrapcdn.com/font-awesome/{{ site.fontawesome.version}}/font"; // for referencing Bootstrap CDN font files directly
 @fa-css-prefix:       {{ site.fontawesome.css_prefix }};
 @fa-version:          "{{ site.fontawesome.version }}";
 @fa-border-color:     #eee;
-@fa-icon-inverse:     #fff;
-@fa-icon-li-width:    (30em / 14);
+@fa-inverse:          #fff;
+@fa-li-width:         (30em / 14);
 
 {% for icon in icons %}@fa-var-{{ icon.id }}: "\{{ icon.unicode }}";
 {% endfor %}

src/assets/font-awesome/scss/_bordered-pulled.scss

@@ -0,0 +1,19 @@
+---
+---
+
+// Bordered & Pulled
+// -------------------------
+
+.#{$fa-css-prefix}-border {
+  padding: .2em .25em .15em;
+  border: solid .08em $fa-border-color;
+  border-radius: .1em;
+}
+
+.pull-right { float: right; }
+.pull-left { float: left; }
+
+.#{$fa-css-prefix} {
+  &.pull-left { margin-right: .3em; }
+  &.pull-right { margin-left: .3em; }
+}

src/assets/font-awesome/scss/_core.scss

@@ -1,7 +1,8 @@
 ---
 ---
-/* FONT AWESOME CORE
- * -------------------------- */
+
+// Base Class Definition
+// -------------------------
 
 .#{$fa-css-prefix} {
   display: inline-block;
@@ -12,101 +13,3 @@
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
 }
-
-/* makes the font 33% larger relative to the icon container */
-.#{$fa-css-prefix}-lg {
-  font-size: (4em / 3);
-  line-height: (3em / 4);
-  vertical-align: -15%;
-}
-
-.#{$fa-css-prefix}-fixed-width {
- width: (18em / 14);
- text-align: center;
-}
-
-
-// Icon UL & LI
-// -------------------------
-
-.#{$fa-css-prefix}-ul {
-  padding-left: 0;
-  margin-left: $fa-icon-li-width;
-  list-style-type: none;
-
-  > li { position: relative; }
-}
-.#{$fa-css-prefix}-li {
-  position: absolute;
-  left: -$fa-icon-li-width;
-  width: $fa-icon-li-width;
-  top: (2em / 14);
-  text-align: center;
-  &.#{$fa-css-prefix}-lg {
-    left: -$fa-icon-li-width + (4em / 14);
-  }
-}
-
-
-// allows usage of the hide class directly on font awesome icons
-.#{$fa-css-prefix}.hide { display: none; }
-
-.#{$fa-css-prefix}-muted { color: $fa-icon-muted; }
-.#{$fa-css-prefix}-light { color: $fa-icon-light; }
-.#{$fa-css-prefix}-dark { color: $fa-icon-dark; }
-
-
-// Icon Borders
-// -------------------------
-
-.#{$fa-css-prefix}-border {
-  padding: .2em .25em .15em;
-  border: solid 1px $fa-border-color;
-  border-radius: 3px;
-}
-
-
-// Icon Sizes
-// -------------------------
-
-.#{$fa-css-prefix}-2x {
-  font-size: 2em;
-  &.#{$fa-css-prefix}-border {
-    border-width: 2px;
-    border-radius: 4px;
-  }
-}
-.#{$fa-css-prefix}-3x {
-  font-size: 3em;
-  &.#{$fa-css-prefix}-border {
-    border-width: 3px;
-    border-radius: 5px;
-  }
-}
-.#{$fa-css-prefix}-4x {
-  font-size: 4em;
-  &.#{$fa-css-prefix}-border {
-    border-width: 4px;
-    border-radius: 6px;
-  }
-}
-.#{$fa-css-prefix}-5x {
-  font-size: 5em;
-  &.#{$fa-css-prefix}-border {
-    border-width: 5px;
-    border-radius: 7px;
-  }
-}
-
-
-// Floats & Margins
-// -------------------------
-
-// Quick floats
-.pull-right { float: right; }
-.pull-left { float: left; }
-
-.#{$fa-css-prefix} {
-  &.pull-left { margin-right: .3em; }
-  &.pull-right { margin-left: .3em; }
-}

src/assets/font-awesome/scss/_fixed-width.scss

@@ -0,0 +1,9 @@
+---
+---
+
+// Fixed Width Icons
+// -------------------------
+.#{$fa-css-prefix}-fw {
+  width: (18em / 14);
+  text-align: center;
+}

src/assets/font-awesome/scss/_larger.scss

@@ -0,0 +1,16 @@
+---
+---
+
+// Icon Sizes
+// -------------------------
+
+/* makes the font 33% larger relative to the icon container */
+.#{$fa-css-prefix}-lg {
+  font-size: (4em / 3);
+  line-height: (3em / 4);
+  vertical-align: -15%;
+}
+.#{$fa-css-prefix}-2x { font-size: 2em; }
+.#{$fa-css-prefix}-3x { font-size: 3em; }
+.#{$fa-css-prefix}-4x { font-size: 4em; }
+.#{$fa-css-prefix}-5x { font-size: 5em; }

src/assets/font-awesome/scss/_list.scss

@@ -0,0 +1,22 @@
+---
+---
+
+// List Icons
+// -------------------------
+
+.#{$fa-css-prefix}-ul {
+  padding-left: 0;
+  margin-left: $fa-li-width;
+  list-style-type: none;
+  > li { position: relative; }
+}
+.#{$fa-css-prefix}-li {
+  position: absolute;
+  left: -$fa-li-width;
+  width: $fa-li-width;
+  top: (2em / 14);
+  text-align: center;
+  &.#{$fa-css-prefix}-lg {
+    left: -$fa-li-width + (4em / 14);
+  }
+}

src/assets/font-awesome/scss/_mixins.scss

@@ -12,33 +12,11 @@
           transform: rotate($degrees);
 }
 
-@mixin fa-icon-flip($horiz, $vert) {
+@mixin fa-icon-flip($horiz, $vert, $rotation) {
+  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
   -webkit-transform: scale($horiz, $vert);
      -moz-transform: scale($horiz, $vert);
       -ms-transform: scale($horiz, $vert);
        -o-transform: scale($horiz, $vert);
           transform: scale($horiz, $vert);
 }
-
-@mixin fa-icon-stack($width: 2em, $height: 2em, $top-font-size: 1em, $base-font-size: 2em) {
-  .#{$fa-css-prefix}-stack {
-    position: relative;
-    display: inline-block;
-    width: $width;
-    height: $height;
-    line-height: $width;
-    vertical-align: -35%;
-    .#{$fa-css-prefix} {
-      position: absolute;
-      display: block;
-      width: 100%;
-      height: 100%;
-      font-size: $top-font-size;
-      line-height: inherit;
-      text-align: center;
-    }
-    .#{$fa-css-prefix}-stack-base {
-      font-size: $base-font-size;
-    }
-  }
-}

src/assets/font-awesome/scss/_rotated-flipped.scss

@@ -0,0 +1,12 @@
+---
+---
+
+// Rotated & Flipped Icons
+// -------------------------
+
+.#{$fa-css-prefix}-rotate-90  { @include fa-icon-rotate(90deg, 1);  }
+.#{$fa-css-prefix}-rotate-180 { @include fa-icon-rotate(180deg, 2); }
+.#{$fa-css-prefix}-rotate-270 { @include fa-icon-rotate(270deg, 3); }
+
+.#{$fa-css-prefix}-flip-horizontal { @include fa-icon-flip(-1, 1, 0); }
+.#{$fa-css-prefix}-flip-vertical   { @include fa-icon-flip(1, -1, 2); }

src/assets/font-awesome/scss/_extras.scss → src/assets/font-awesome/scss/_spinning.scss

@@ -1,12 +1,9 @@
 ---
 ---
-/* EXTRAS
- * -------------------------- */
 
-/* Stacked and layered icon */
-@include fa-icon-stack();
+// Spinning Icons
+// --------------------------
 
-/* Animated rotating icon */
 .#{$fa-css-prefix}-spin {
   -webkit-animation: spin 2s infinite linear;
   -moz-animation: spin 2s infinite linear;
@@ -34,14 +31,3 @@
   0% { transform: rotate(0deg); }
   100% { transform: rotate(359deg); }
 }
-
-
-// Icon rotations & flipping
-// -------------------------
-
-.#{$fa-css-prefix}-rotate-90  { @include fa-icon-rotate(90deg, 1);  }
-.#{$fa-css-prefix}-rotate-180 { @include fa-icon-rotate(180deg, 2); }
-.#{$fa-css-prefix}-rotate-270 { @include fa-icon-rotate(270deg, 3); }
-
-.#{$fa-css-prefix}-flip-horizontal { @include fa-icon-flip(-1, 1); }
-.#{$fa-css-prefix}-flip-vertical   { @include fa-icon-flip(1, -1); }

src/assets/font-awesome/scss/_stacked.scss

@@ -0,0 +1,22 @@
+---
+---
+
+// Stacked Icons
+// -------------------------
+
+.#{$fa-css-prefix}-stack {
+  position: relative;
+  display: inline-block;
+  width: 2em;
+  height: 2em;
+  line-height: 2em;
+  vertical-align: middle;
+}
+.#{$fa-css-prefix}-stack-top, .#{$fa-css-prefix}-stack-bottom {
+  position: absolute;
+  width: 100%;
+  text-align: center;
+}
+.#{$fa-css-prefix}-stack-top { line-height: inherit; }
+.#{$fa-css-prefix}-stack-bottom { font-size: 2em; }
+.#{$fa-css-prefix}-inverse { color: $fa-inverse; }

src/assets/font-awesome/scss/_variables.scss

@@ -8,10 +8,8 @@ $fa-font-path:        "../fonts" !default;
 $fa-css-prefix:       {{ site.fontawesome.css_prefix }};
 $fa-version:          "{{ site.fontawesome.version }}" !default;
 $fa-border-color:     #eee !default;
-$fa-icon-muted:       #eee !default;
-$fa-icon-light:       #fff !default;
-$fa-icon-dark:        #333 !default;
-$fa-icon-li-width:    (30em / 14);
+$fa-inverse:          #fff !default;
+$fa-li-width:        (30em / 14);
 
 {% for icon in icons %}$fa-var-{{ icon.id }}: "\{{ icon.unicode }}";
 {% endfor %}

src/assets/font-awesome/scss/font-awesome.scss

@@ -6,5 +6,11 @@
 @import "mixins";
 @import "path";
 @import "core";
-@import "extras";
+@import "larger";
+@import "fixed-width";
+@import "list";
+@import "bordered-pulled";
+@import "spinning";
+@import "rotated-flipped";
+@import "stacked";
 @import "icons";