massive update to doc structure & build

.gitignore

@@ -8,6 +8,7 @@
 .coverage
 .DS_Store
 .installed.cfg
+_gh_pages/*
 
 .idea/*
 .svn/*
@@ -15,14 +16,13 @@ src/website/static/*
 src/website/media/*
 
 bin
-build
 cfcache
 develop-eggs
 dist
 downloads
 eggs
 parts
-tmp
+tmp
 .sass-cache
 
 src/website/settingslocal.py

_config.yml

@@ -0,0 +1,40 @@
+safe:             false
+auto:             true
+server:           true
+server_port:      7998
+baseurl:          /Font-Awesome/
+url:              http://localhost:7998
+
+source:           build
+destination:      _gh_pages
+plugins:          build/_plugins
+
+icon_meta:        build/icons.yml
+icon_layout:      icon.html    # Relative to _layouts directory
+icon_destination: icon         # Relative to destination
+
+font-awesome:
+  version:        3.1.0
+  url:            http://fortawesome.github.com/Font-Awesome/
+  author:
+    name:         Dave Gandy
+    email:        dave@davegandy.com
+  github:
+    url:          https://github.com/FortAwesome/Font-Awesome
+    project:      Font-Awesome
+    org:          FortAwesome
+
+bootstrap:
+  version:        2.3.1
+  url:            http://getbootstrap.com
+
+license:
+  font:
+    version:      SIL OFL 1.1
+    url:          http://scripts.sil.org/OFL
+  code:
+    version:      MIT License
+    url:          http://opensource.org/licenses/mit-license.html
+  documentation:
+    version:      CC BY 3.0
+    url:          http://creativecommons.org/licenses/by/3.0/

build/_includes/ads/carbon-dark-vertical.html

@@ -0,0 +1 @@
+<div id="carbonads-container"><div class="carbonad"><div id="azcarbon"></div><script type="text/javascript">var z = document.createElement("script"); z.type = "text/javascript"; z.async = true; z.src = "http://engine.carbonads.com/z/32291/azcarbon_2_1_0_VERTDARK"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(z, s);</script></div></div>

build/_includes/ads/carbon-light-horizontal.html

@@ -0,0 +1 @@
+<div id="carbonads-container"><div class="carbonad"><div id="azcarbon"></div><script type="text/javascript">var z = document.createElement("script"); z.type = "text/javascript"; z.async = true; z.src = "http://engine.carbonads.com/z/32291/azcarbon_2_1_0_HORIZ"; var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(z, s);</script></div></div>

build/_includes/contribute.html

@@ -0,0 +1,38 @@
+<section id="contribute">
+  <h2 class="page-header">Contribute Icons to Font Awesome</h2>
+  <div class="row">
+    <div class="span3">
+      <img class="img-rounded" src="assets/img/contribution-sample.png">
+    </div>
+    <div class="span9">
+      <p class="lead">
+        Want to help make Font Awesome even more awesome? Contribute back to the Font Awesome community by designing
+        new pictograms for the set.
+      </p>
+      <p>
+        If selected, you'll retain the CC-BY license to your pictogram and get attribution
+        right here on the Font Awesome site.
+      </p>
+      <h3>How to Submit New Icons</h3>
+      <ol>
+        <li>Download the <a href="assets/img/icon-flag.pdf">icon-flag.pdf template</a>.</li>
+        <li>
+          Open the PDF in Adobe Illustrator. You'll notice the file has dimensions of 60x56. This is exactly 4x the
+          max icon size of 15 wide by 14 tall. The template is an example of the flag icon to use as a guide.
+        </li>
+        <li>
+          Design your icon. In order to make it into the set, your icon must look pixel perfect. The easiest way to do
+          this is to make sure your line widths in the template are some multiple of 4px. Diagonals are rough, too.
+          Don't split pixels right down the middle, as they blur more when rendering. Zoom out to 25% to get a good idea
+          of how it will render in the font.
+        </li>
+        <li>
+          Submit your icon. Drop me an email at <a href="mailto:dave@davegandy.com">dave@davegandy.com</a>. Make sure to
+          use the subject <code>[Font Awesome] [Icon Contribution] icon-name</code> and attach your PDF file. If your
+          icon makes it into Font Awesome (I'm keeping a very tight reign on quality), I'll ask what contact info you'd
+          like to use for attribution.
+        </li>
+      </ol>
+    </div>
+  </div>
+</section>

build/_includes/examples.html

@@ -0,0 +1,443 @@
+<section id="examples">
+<h2 class="page-header">Examples</h2>
+<p>Many examples re-used from the Twitter Bootstrap documentation.</p>
+<div class="row">
+  <div class="span4">
+    <div class="well well-transparent">
+      <p>Use Font Awesome icons in:</p>
+      <ul class="icons">
+        <li><i class="icon-ok"></i>Bulleted lists (like this one)</li>
+        <li><i class="icon-ok"></i>Buttons</li>
+        <li><i class="icon-ok"></i>Button groups</li>
+        <li><i class="icon-ok"></i>Navigation</li>
+        <li><i class="icon-ok"></i>Prepended form inputs</li>
+        <li><i class="icon-ok"></i>And many more with Custom CSS</li>
+      </ul>
+    </div>
+  </div>
+  <div class="span4">
+    <p>
+      <a class="btn" href="#"><i class="icon-repeat"></i> Reload</a>
+      <a class="btn btn-success" href="#"><i class="icon-shopping-cart icon-large"></i> Checkout</a>
+      <a class="btn btn-danger" href="#"><i class="icon-trash icon-large"></i> Delete</a>
+    </p>
+    <p>
+      <a class="btn btn-large btn-primary" href="#"><i class="icon-comment"></i> Comment</a>
+      <a class="btn btn-small" href="#"><i class="icon-cog"></i> Settings</a>
+      <a class="btn btn-small btn-info" href="#"><i class="icon-info-sign"></i> Info</a>
+    </p>
+    <div class="well" style="padding: 8px 0;">
+      <ul class="nav nav-list">
+        <li class="active"><a href="#"><i class="icon-home"></i> Home</a></li>
+        <li><a href="#"><i class="icon-book"></i> Library</a></li>
+        <li><a href="#"><i class="icon-pencil"></i> Applications</a></li>
+        <li><a href="#"><i class="icon-cogs"></i> Settings</a></li>
+      </ul>
+    </div>
+  </div>
+  <div class="span4">
+    <div class="btn-toolbar">
+      <div class="btn-group">
+        <a class="btn" href="#"><i class="icon-align-left"></i></a>
+        <a class="btn" href="#"><i class="icon-align-center"></i></a>
+        <a class="btn" href="#"><i class="icon-align-right"></i></a>
+        <a class="btn" href="#"><i class="icon-align-justify"></i></a>
+      </div>
+      <div class="btn-group">
+        <a class="btn btn-primary" href="#"><i class="icon-user"></i> User</a>
+        <a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#"><span class="icon-caret-down"></span></a>
+        <ul class="dropdown-menu">
+          <li><a href="#"><i class="icon-pencil"></i> Edit</a></li>
+          <li><a href="#"><i class="icon-trash"></i> Delete</a></li>
+          <li><a href="#"><i class="icon-ban-circle"></i> Ban</a></li>
+          <li class="divider"></li>
+          <li><a href="#"><i class="i"></i> Make admin</a></li>
+        </ul>
+      </div>
+    </div>
+    <form>
+      <div class="control-group">
+        <div class="controls">
+          <div class="input-prepend">
+            <span class="add-on"><i class="icon-envelope"></i></span>
+            <input class="span2" id="inputIcon" type="text" placeholder="Email address">
+          </div>
+        </div>
+      </div>
+      <div class="control-group">
+        <div class="controls">
+          <div class="input-prepend">
+            <span class="add-on"><i class="icon-key"></i></span>
+            <input class="span2" id="inputIcon2" type="text" placeholder="Password">
+          </div>
+        </div>
+      </div>
+    </form>
+    <div>
+        <span class="rating">
+          <span class="star"></span><span class="star"></span><span class="star"></span><span class="star"></span><span class="star"></span>
+        </span>
+    </div>
+  </div>
+</div>
+
+<h3 class="page-header">New Styles in 3.0</h3>
+<div class="row">
+  <div class="span4">
+    <i class="icon-quote-left icon-4x pull-left icon-muted"></i>
+    Use a few of the new styles together, and you've got easy pull quotes or a great introductory article image.
+    Or spinning icons for loading and refreshing content. Or fun big icons in multi-line buttons. Lots of new possibilities.
+  </div>
+  <div class="span4">
+    <div class="well well-large well-transparent lead">
+      <i class="icon-spinner icon-spin icon-2x pull-left"></i> Spinner icon when loading content...
+    </div>
+  </div>
+  <div class="span4">
+    <p>
+      <a class="btn btn-large btn-danger" href="#"><i class="icon-flag icon-2x pull-left"></i>Font Awesome<br>Version 3.0</a>
+    </p>
+    <a class="btn btn-primary" href="#"><i class="icon-refresh icon-spin"></i> Synchronizing Content...</a>
+  </div>
+</div>
+
+<h3 class="page-header">Example HTML</h3>
+<div class="row">
+  <div class="span12">
+    <h4>Inline Icons</h4>
+  </div>
+  <div class="span3">
+    <p>Place Font Awesome icons just about anywhere with the <code>&lt;i&gt;</code> tag.</p>
+  </div>
+  <div class="span9">
+    <div class="well well-transparent">
+      <div style="font-size: 24px; line-height: 1.5em;">
+        <i class="icon-camera-retro"></i> icon-camera-retro
+      </div>
+    </div>
+<pre class="prettyprint linenums">
+&lt;i class="icon-camera-retro"&gt;&lt;/i&gt; icon-camera-retro
+</pre>
+    <div class="alert alert-info"><i class="icon-info-sign"></i> Icon classes are echoed via CSS :before.</div>
+  </div>
+</div>
+<div class="row">
+  <div class="span12">
+    <h4>Larger Icons</h4>
+  </div>
+  <div class="span3">
+    <p>
+      To increase the size of icons relative to its container, use <code>icon-large</code>, <code>icon-2x</code>,
+      <code>icon-3x</code>, or <code>icon-4x</code>.
+    </p>
+  </div>
+  <div class="span9">
+    <p>
+      Increase the icon size by using the <code>icon-large</code> (33% increase), <code>icon-2x</code>,
+      <code>icon-3x</code>, or <code>icon-4x</code> classes.
+    </p>
+    <div class="well well-transparent">
+      <div style="font-size: 24px; line-height: 1.5em;">
+        <p><i class="icon-camera-retro icon-large"></i> icon-camera-retro</p>
+        <p><i class="icon-camera-retro icon-2x"></i> icon-camera-retro</p>
+        <p><i class="icon-camera-retro icon-3x"></i> icon-camera-retro</p>
+        <p><i class="icon-camera-retro icon-4x"></i> icon-camera-retro</p>
+      </div>
+    </div>
+<pre class="prettyprint linenums">
+&lt;p&gt;&lt;i class=&quot;icon-camera-retro icon-large&quot;&gt;&lt;/i&gt; icon-camera-retro&lt;/p&gt;
+&lt;p&gt;&lt;i class=&quot;icon-camera-retro icon-2x&quot;&gt;&lt;/i&gt; icon-camera-retro&lt;/p&gt;
+&lt;p&gt;&lt;i class=&quot;icon-camera-retro icon-3x&quot;&gt;&lt;/i&gt; icon-camera-retro&lt;/p&gt;
+&lt;p&gt;&lt;i class=&quot;icon-camera-retro icon-4x&quot;&gt;&lt;/i&gt; icon-camera-retro&lt;/p&gt;
+</pre>
+    <div class="alert alert-info">
+      <i class="icon-info-sign"></i> If your icons are getting chopped off on top and bottom, make sure you have
+      sufficient line-height.
+    </div>
+  </div>
+</div>
+<div class="row">
+  <div class="span12">
+    <h4>Animated Spinner</h4>
+  </div>
+  <div class="span3">
+    <p>
+      Use the <code>icon-spin</code> class to get any icon to rotate. Works best with <code>icon-spinner</code> and
+      <code>icon-refresh</code>.
+    </p>
+  </div>
+  <div class="span9">
+    <div class="well well-large well-transparent lead">
+      <i class="icon-spinner icon-spin"></i> Spinner icon when loading content...
+    </div>
+<pre class="prettyprint linenums">
+&lt;i class=&quot;icon-spinner icon-spin&quot;&gt;&lt;/i&gt; Spinner icon when loading content...
+</pre>
+    <p class="alert alert-info">
+      <i class="icon-info-sign"></i> CSS3 animations aren't supported in IE7 - IE9.
+    </p>
+  </div>
+</div>
+<div class="row">
+  <div class="span3">
+
+  </div>
+  <div class="span9">
+
+  </div>
+</div>
+<div class="row">
+  <div class="span12">
+    <h4>Bordered & Pulled Icons</h4>
+  </div>
+  <div class="span3">
+    <p>
+      Use <code>icon-border</code> and <code>pull-right</code> or <code>pull-left</code> for easy pull quotes or
+      article graphics.
+    </p>
+  </div>
+  <div class="span9">
+    <div class="well well-large well-transparent">
+      <i class="icon-quote-left icon-4x pull-left icon-muted"></i>
+      Use a few of the new styles together, and you've got easy pull quotes or a great introductory article image.
+      Or spinning icons for loading and refreshing content. Or fun big icons in multi-line buttons. You can combine all
+      of them in any combination to get lots of new possibilities.
+    </div>
+<pre class="prettyprint linenums">
+&lt;i class=&quot;icon-quote-left icon-4x pull-left icon-muted&quot;&gt;&lt;/i&gt;
+Use a few of the new styles together ... lots of new possibilities.
+</pre>
+    <div class="well well-large well-transparent">
+      <i class="icon-flag icon-4x pull-left icon-border"></i>
+      Use a few of the new styles together, and you've got easy pull quotes or a great introductory article image.
+      Or spinning icons for loading and refreshing content. Or fun big icons in multi-line buttons. You can combine all
+      of them in any combination to get lots of new possibilities.
+    </div>
+<pre class="prettyprint linenums">
+&lt;i class=&quot;icon-flag icon-4x pull-left icon-border&quot;&gt;&lt;/i&gt;
+Use a few of the new styles together ... lots of new possibilities.
+</pre>
+  </div>
+</div>
+<div class="row">
+  <div class="span12">
+    <h4>Buttons</h4>
+  </div>
+  <div class="span3">
+    <p>
+      <a class="btn" href="#">
+        <i class="icon-repeat"></i> Reload</a>
+      <a class="btn btn-success" href="#">
+        <i class="icon-shopping-cart icon-large"></i> Checkout</a>
+    </p>
+    <p>
+      <a class="btn btn-large btn-primary" href="#">
+        <i class="icon-comment"></i> Comment</a>
+      <a class="btn btn-small btn-info" href="#">
+        <i class="icon-info-sign"></i> Info</a>
+    </p>
+    <p>
+      <a class="btn btn-danger" href="#">
+        <i class="icon-trash icon-large"></i> Delete</a>
+      <a class="btn btn-small" href="#">
+        <i class="icon-cog"></i> Settings</a>
+    </p>
+    <p>
+      <a class="btn btn-large btn-danger" href="#"><i class="icon-flag icon-2x pull-left"></i>Font Awesome<br>Version 3.0</a>
+    </p>
+    <p>
+      <a class="btn btn-primary" href="#"><i class="icon-refresh icon-spin"></i> Synchronizing Content...</a>
+    </p>
+
+  </div>
+  <div class="span9">
+    <p>
+      Font Awesome icons work great in buttons. You can even combine them with larger icon styles,
+      <code>pull-right</code> and <code>pull-left</code>, and <code>icon-spin</code>.
+    </p>
+<pre class="prettyprint linenums">
+&lt;a class="btn" href="#"&gt;
+  &lt;i class="icon-repeat"&gt;&lt;/i&gt; Reload&lt;/a&gt;
+&lt;a class="btn btn-success" href="#"&gt;
+  &lt;i class="icon-shopping-cart icon-large"&gt;&lt;/i&gt; Checkout&lt;/a&gt;
+&lt;a class="btn btn-large btn-primary" href="#"&gt;
+  &lt;i class="icon-comment"&gt;&lt;/i&gt; Comment&lt;/a&gt;
+&lt;a class="btn btn-small btn-info" href="#"&gt;
+  &lt;i class="icon-info-sign"&gt;&lt;/i&gt; Info&lt;/a&gt;
+&lt;a class="btn btn-danger" href="#"&gt;
+  &lt;i class="icon-trash icon-large"&gt;&lt;/i&gt; Delete&lt;/a&gt;
+&lt;a class="btn btn-small" href="#"&gt;
+  &lt;i class="icon-cog"&gt;&lt;/i&gt; Settings&lt;/a&gt;
+&lt;a class=&quot;btn btn-large btn-danger&quot; href=&quot;#&quot;&gt;
+  &lt;i class=&quot;icon-flag icon-2x pull-left&quot;&gt;&lt;/i&gt;Font Awesome&lt;br&gt;Version 3.0&lt;/a&gt;
+&lt;a class=&quot;btn btn-primary&quot; href=&quot;#&quot;&gt;
+  &lt;i class=&quot;icon-refresh icon-spin&quot;&gt;&lt;/i&gt; Synchronizing Content...&lt;/a&gt;
+</pre>
+  </div>
+</div>
+<div class="row">
+  <div class="span12">
+    <h4>Button groups</h4>
+  </div>
+  <div class="span3">
+    <p>
+    <div class="btn-group">
+      <a class="btn" href="#"><i class="icon-align-left"></i></a>
+      <a class="btn" href="#"><i class="icon-align-center"></i></a>
+      <a class="btn" href="#"><i class="icon-align-right"></i></a>
+      <a class="btn" href="#"><i class="icon-align-justify"></i></a>
+    </div>
+    </p>
+  </div>
+  <div class="span9">
+<pre class="prettyprint linenums">
+&lt;div class="btn-group"&gt;
+  &lt;a class="btn" href="#"&gt;&lt;i class="icon-align-left"&gt;&lt;/i&gt;&lt;/a&gt;
+  &lt;a class="btn" href="#"&gt;&lt;i class="icon-align-center"&gt;&lt;/i&gt;&lt;/a&gt;
+  &lt;a class="btn" href="#"&gt;&lt;i class="icon-align-right"&gt;&lt;/i&gt;&lt;/a&gt;
+  &lt;a class="btn" href="#"&gt;&lt;i class="icon-align-justify"&gt;&lt;/i&gt;&lt;/a&gt;
+&lt;/div&gt;
+</pre>
+  </div>
+</div>
+<div class="row">
+  <div class="span12">
+    <h4>Button dropdowns</h4>
+  </div>
+  <div class="span3">
+    <p>
+    <div class="btn-group open">
+      <a class="btn btn-primary" href="#"><i class="icon-user"></i> User</a>
+      <a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#">
+        <span class="icon-caret-down"></span></a>
+      <ul class="dropdown-menu">
+        <li><a href="#"><i class="icon-pencil"></i> Edit</a></li>
+        <li><a href="#"><i class="icon-trash"></i> Delete</a></li>
+        <li><a href="#"><i class="icon-ban-circle"></i> Ban</a></li>
+        <li class="divider"></li>
+        <li><a href="#"><i class="i"></i> Make admin</a></li>
+      </ul>
+    </div>
+  </div>
+  </p>
+  <div class="span9">
+<pre class="prettyprint linenums">
+&lt;div class="btn-group open"&gt;
+    &lt;a class="btn btn-primary" href="#"&gt;&lt;i class="icon-user"&gt;&lt;/i&gt; User&lt;/a&gt;
+    &lt;a class="btn btn-primary dropdown-toggle" data-toggle="dropdown" href="#"&gt;&lt;span class="icon-caret-down"&gt;&lt;/span&gt;&lt;/a&gt;
+    &lt;ul class="dropdown-menu"&gt;
+        &lt;li&gt;&lt;a href="#"&gt;&lt;i class="icon-pencil"&gt;&lt;/i&gt; Edit&lt;/a&gt;&lt;/li&gt;
+        &lt;li&gt;&lt;a href="#"&gt;&lt;i class="icon-trash"&gt;&lt;/i&gt; Delete&lt;/a&gt;&lt;/li&gt;
+        &lt;li&gt;&lt;a href="#"&gt;&lt;i class="icon-ban-circle"&gt;&lt;/i&gt; Ban&lt;/a&gt;&lt;/li&gt;
+        &lt;li class="divider"&gt;&lt;/li&gt;
+        &lt;li&gt;&lt;a href="#"&gt;&lt;i class="i"&gt;&lt;/i&gt; Make admin&lt;/a&gt;&lt;/li&gt;
+    &lt;/ul&gt;
+&lt;/div&gt;
+</pre>
+    <div class="alert alert-info"><i class="icon-info-sign"></i> Don't forget to add the appropriate JavaScript to enable button dropdowns.</div>
+  </div>
+</div>
+<div class="row">
+  <div class="span12">
+    <h4>Lists</h4>
+  </div>
+  <div class="span3">
+    <p>
+    <ul class="icons">
+      <li><i class="icon-ok"></i> Lists</li>
+      <li><i class="icon-ok"></i> Buttons</li>
+      <li><i class="icon-ok"></i> Button groups</li>
+      <li><i class="icon-ok"></i> Navigation</li>
+      <li><i class="icon-ok"></i> Prepended form inputs</li>
+    </ul>
+    </p>
+  </div>
+  <div class="span9">
+    <p>Easily replace individual bullets.</p>
+<pre class="prettyprint linenums">
+&lt;ul class="icons"&gt;
+  &lt;li&gt;&lt;i class="icon-ok"&gt;&lt;/i&gt; Lists&lt;/li&gt;
+  &lt;li&gt;&lt;i class="icon-ok"&gt;&lt;/i&gt; Buttons&lt;/li&gt;
+  &lt;li&gt;&lt;i class="icon-ok"&gt;&lt;/i&gt; Button groups&lt;/li&gt;
+  &lt;li&gt;&lt;i class="icon-ok"&gt;&lt;/i&gt; Navigation&lt;/li&gt;
+  &lt;li&gt;&lt;i class="icon-ok"&gt;&lt;/i&gt; Prepended form inputs&lt;/li&gt;
+&lt;/ul&gt;
+</pre>
+  </div>
+</div>
+<div class="row">
+  <div class="span12">
+    <h4>Navigation</h4>
+  </div>
+  <div class="span3">
+    <div class="well" style="padding: 8px 0;">
+      <ul class="nav nav-list">
+        <li class="active"><a href="#"><i class="icon-home"></i> Home</a></li>
+        <li><a href="#"><i class="icon-book"></i> Library</a></li>
+        <li><a href="#"><i class="icon-pencil"></i> Applications</a></li>
+        <li><a href="#"><i class="icon-cogs"></i> Settings</a></li>
+      </ul>
+    </div>
+  </div>
+  <div class="span9">
+    <p>Use Font Awesome icons in navigation to provide helpful visual cues.</p>
+<pre class="prettyprint linenums">
+&lt;ul class="nav nav-list"&gt;
+  &lt;li class="active"&gt;&lt;a href="#"&gt;&lt;i class="icon-home"&gt;&lt;/i&gt; Home&lt;/a&gt;&lt;/li&gt;
+  &lt;li&gt;&lt;a href="#"&gt;&lt;i class="icon-book"&gt;&lt;/i&gt; Library&lt;/a&gt;&lt;/li&gt;
+  &lt;li&gt;&lt;a href="#"&gt;&lt;i class="icon-pencil"&gt;&lt;/i&gt; Applications&lt;/a&gt;&lt;/li&gt;
+  &lt;li&gt;&lt;a href="#"&gt;&lt;i class="icon-cogs"&gt;&lt;/i&gt; Settings&lt;/a&gt;&lt;/li&gt;
+&lt;/ul&gt;
+</pre>
+  </div>
+</div>
+<div class="row">
+  <div class="span12">
+    <h4>Prepended form inputs</h4>
+  </div>
+  <div class="span3">
+    <p>
+    <form>
+      <div class="input-prepend">
+        <span class="add-on"><i class="icon-envelope"></i></span>
+        <input class="span2" type="text" placeholder="Email address">
+      </div>
+      <div class="input-prepend">
+        <span class="add-on"><i class="icon-key"></i></span>
+        <input class="span2" type="password" placeholder="Password">
+      </div>
+    </form>
+    </p>
+  </div>
+  <div class="span9">
+<pre class="prettyprint linenums">
+&lt;form&gt;
+  &lt;div class="input-prepend"&gt;
+    &lt;span class="add-on"&gt;&lt;i class="icon-envelope"&gt;&lt;/i&gt;&lt;/span&gt;
+    &lt;input class="span2" type="text" placeholder="Email address"&gt;
+  &lt;/div&gt;
+  &lt;div class="input-prepend"&gt;
+    &lt;span class="add-on"&gt;&lt;i class="icon-key"&gt;&lt;/i&gt;&lt;/span&gt;
+    &lt;input class="span2" type="password" placeholder="Password"&gt;
+  &lt;/div&gt;
+&lt;/form&gt;
+</pre>
+  </div>
+</div>
+<div class="row">
+  <div class="span12">
+    <h4>Custom CSS</h4>
+  </div>
+  <div class="span3">
+    <p>Anything you can do with CSS font styles, you can do with Font Awesome.</p>
+  </div>
+  <div class="span9">
+    <p>Star Ratings (inspired by <a href="http://css-tricks.com/star-ratings/" target="_blank">CSS Tricks</a>)</p>
+    <div class="well">
+      <span class="rating">
+        <span class="star"></span><span class="star"></span><span class="star"></span><span class="star"></span><span class="star"></span>
+      </span>
+    </div>
+  </div>
+</div>
+</section>

build/_includes/footer.html

@@ -0,0 +1,21 @@
+<footer class="footer">
+  <div class="container text-center">
+    <div>
+      <i class="icon-flag"></i> Font Awesome {{ site.font-awesome.version }} &middot;
+      Created and Maintained by Dave Gandy &middot;
+      <a href="http://twitter.com/byscuits">@byscuits</a>
+    </div>
+    <div>
+      Font Awesome font licensed under <a href="{{ site.license.font.url }}">{{ site.license.font.version }}</a> &middot;
+      Code licensed under <a href="{{ site.license.code.url }}">{{ site.license.code.version }}</a> &middot;
+      Documentation licensed under <a href="{{ site.license.documentation.url }}">{{ site.license.documentation.version }}</a>
+    </div>
+    <div>
+      Many doc examples taken from <a href="{{ site.bootstrap.url }}">Bootstrap's docs</a>
+    </div>
+    <div class="project">
+      <a href="{{ site.font-awesome.github.url }}">GitHub Project</a> &middot;
+      <a href="{{ site.font-awesome.github.url }}/issues">Issues</a>
+    </div>
+  </div>
+</footer>

build/_includes/icons/directional.html

@@ -0,0 +1,51 @@
+<section id="icons-directional" class="row">
+  <div class="span12">
+    <h2 class="page-header">Directional Icons</h2>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/angle-left"><i class="icon-angle-left"></i> icon-angle-left</a></li>
+      <li><a href="{{ site.baseurl }}icon/angle-right"><i class="icon-angle-right"></i> icon-angle-right</a></li>
+      <li><a href="{{ site.baseurl }}icon/angle-up"><i class="icon-angle-up"></i> icon-angle-up</a></li>
+      <li><a href="{{ site.baseurl }}icon/angle-down"><i class="icon-angle-down"></i> icon-angle-down</a></li>
+      <li><a href="{{ site.baseurl }}icon/arrow-down"><i class="icon-arrow-down"></i> icon-arrow-down</a></li>
+      <li><a href="{{ site.baseurl }}icon/arrow-left"><i class="icon-arrow-left"></i> icon-arrow-left</a></li>
+      <li><a href="{{ site.baseurl }}icon/arrow-right"><i class="icon-arrow-right"></i> icon-arrow-right</a></li>
+      <li><a href="{{ site.baseurl }}icon/arrow-up"><i class="icon-arrow-up"></i> icon-arrow-up</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/caret-down"><i class="icon-caret-down"></i> icon-caret-down</a></li>
+      <li><a href="{{ site.baseurl }}icon/caret-left"><i class="icon-caret-left"></i> icon-caret-left</a></li>
+      <li><a href="{{ site.baseurl }}icon/caret-right"><i class="icon-caret-right"></i> icon-caret-right</a></li>
+      <li><a href="{{ site.baseurl }}icon/caret-up"><i class="icon-caret-up"></i> icon-caret-up</a></li>
+      <li><a href="{{ site.baseurl }}icon/chevron-down"><i class="icon-chevron-down"></i> icon-chevron-down</a></li>
+      <li><a href="{{ site.baseurl }}icon/chevron-left"><i class="icon-chevron-left"></i> icon-chevron-left</a></li>
+      <li><a href="{{ site.baseurl }}icon/chevron-right"><i class="icon-chevron-right"></i> icon-chevron-right</a></li>
+      <li><a href="{{ site.baseurl }}icon/chevron-up"><i class="icon-chevron-up"></i> icon-chevron-up</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/circle-arrow-down"><i class="icon-circle-arrow-down"></i> icon-circle-arrow-down</a></li>
+      <li><a href="{{ site.baseurl }}icon/circle-arrow-left"><i class="icon-circle-arrow-left"></i> icon-circle-arrow-left</a></li>
+      <li><a href="{{ site.baseurl }}icon/circle-arrow-right"><i class="icon-circle-arrow-right"></i> icon-circle-arrow-right</a></li>
+      <li><a href="{{ site.baseurl }}icon/circle-arrow-up"><i class="icon-circle-arrow-up"></i> icon-circle-arrow-up</a></li>
+      <li><a href="{{ site.baseurl }}icon/double-angle-left"><i class="icon-double-angle-left"></i> icon-double-angle-left</a></li>
+      <li><a href="{{ site.baseurl }}icon/double-angle-right"><i class="icon-double-angle-right"></i> icon-double-angle-right</a></li>
+      <li><a href="{{ site.baseurl }}icon/double-angle-up"><i class="icon-double-angle-up"></i> icon-double-angle-up</a></li>
+      <li><a href="{{ site.baseurl }}icon/double-angle-down"><i class="icon-double-angle-down"></i> icon-double-angle-down</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/hand-down"><i class="icon-hand-down"></i> icon-hand-down</a></li>
+      <li><a href="{{ site.baseurl }}icon/hand-left"><i class="icon-hand-left"></i> icon-hand-left</a></li>
+      <li><a href="{{ site.baseurl }}icon/hand-right"><i class="icon-hand-right"></i> icon-hand-right</a></li>
+      <li><a href="{{ site.baseurl }}icon/hand-up"><i class="icon-hand-up"></i> icon-hand-up</a></li>
+      <li><a href="{{ site.baseurl }}icon/circle"><i class="icon-circle"></i> icon-circle</a></li>
+      <li><a href="{{ site.baseurl }}icon/circle-blank"><i class="icon-circle-blank"></i> icon-circle-blank</a></li>
+    </ul>
+  </div>
+</section>

build/_includes/icons/medical.html

@@ -0,0 +1,29 @@
+<section id="icons-medical" class="row">
+  <div class="span12">
+    <h2 class="page-header">Medical Icons <small>Want to change healthcare? Work with me at <a href="#kyruus">Kyruus</a>.</small></h2>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/ambulance"><i class="icon-ambulance"></i> icon-ambulance</a></li>
+      <li><a href="{{ site.baseurl }}icon/beaker"><i class="icon-beaker"></i> icon-beaker</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/h-sign"><i class="icon-h-sign"></i> icon-h-sign</a></li>
+      <li><a href="{{ site.baseurl }}icon/hospital"><i class="icon-hospital"></i> icon-hospital</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/medkit"><i class="icon-medkit"></i> icon-medkit</a></li>
+      <li><a href="{{ site.baseurl }}icon/plus-sign-alt"><i class="icon-plus-sign-alt"></i> icon-plus-sign-alt</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/stethoscope"><i class="icon-stethoscope"></i> icon-stethoscope</a></li>
+      <li><a href="{{ site.baseurl }}icon/user-md"><i class="icon-user-md"></i> icon-user-md</a></li>
+    </ul>
+  </div>
+</section>

build/_includes/icons/new.html

@@ -0,0 +1,48 @@
+<section id="icons-new" class="row">
+  <div class="span12">
+    <h2 class="page-header">New Icons in {{ site.font-awesome.version }}</h2>
+    <p>
+      You asked, Font Awesome delivers with 40 shiny new icons in version {{ site.font-awesome.version }}. New icons can be requested on the
+      <a href="https://github.com/FortAwesome/Font-Awesome" target="_blank">Font Awesome GitHub project</a>. Or even
+      better, you can <a href="#contribute">contribute your own icons</a>.
+    </p>
+  </div>
+
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/smile"><i class="icon-smile"></i> icon-smile</a></li>
+      <li><a href="{{ site.baseurl }}icon/frown"><i class="icon-frown"></i> icon-frown</a></li>
+      <li><a href="{{ site.baseurl }}icon/meh"><i class="icon-meh"></i> icon-meh</a></li>
+      <li><a href="{{ site.baseurl }}icon/gamepad"><i class="icon-gamepad"></i> icon-gamepad</a></li>
+      <li><a href="{{ site.baseurl }}icon/keyboard"><i class="icon-keyboard"></i> icon-keyboard</a></li>
+      <li><a href="{{ site.baseurl }}icon/flag-alt"><i class="icon-flag-alt"></i> icon-flag-alt</a></li>
+      <li><a href="{{ site.baseurl }}icon/flag-checkered"><i class="icon-flag-checkered"></i> icon-flag-checkered</a></li>
+      <li><a href="{{ site.baseurl }}icon/terminal"><i class="icon-terminal"></i> icon-terminal</a></li>
+      <li><a href="{{ site.baseurl }}icon/code"><i class="icon-code"></i> icon-code</a></li>
+      <li><a href="{{ site.baseurl }}icon/share-alt"><i class="icon-mail-forward"></i> icon-mail-forward <span class="muted">(alias)</span></a></li>
+      <li><a href="{{ site.baseurl }}icon/reply"><i class="icon-mail-reply"></i> icon-mail-reply <span class="muted">(alias)</span></a></li>
+      <li><a href="{{ site.baseurl }}icon/reply-all"><i class="icon-reply-all"></i> icon-reply-all</a></li>
+      <li><a href="{{ site.baseurl }}icon/reply-all"><i class="icon-mail-reply-all"></i> icon-mail-reply-all <span class="muted">(alias)</span></a></li>
+      <li><a href="{{ site.baseurl }}icon/star-half-empty"><i class="icon-star-half-empty"></i> icon-star-half-empty</a></li>
+      <li><a href="{{ site.baseurl }}icon/location-arrow"><i class="icon-location-arrow"></i> icon-location-arrow</a></li>
+      <li><a href="{{ site.baseurl }}icon/undo"><i class="icon-rotate-left"></i> icon-rotate-left <span class="muted">(alias)</span></a></li>
+      <li><a href="{{ site.baseurl }}icon/repeat"><i class="icon-rotate-right"></i> icon-rotate-right <span class="muted">(alias)</span></a></li>
+      <li><a href="{{ site.baseurl }}icon/crop"><i class="icon-crop"></i> icon-crop</a></li>
+      <li><a href="{{ site.baseurl }}icon/code-fork"><i class="icon-code-fork"></i> icon-code-fork</a></li>
+      <li><a href="{{ site.baseurl }}icon/unlink"><i class="icon-unlink"></i> icon-unlink</a></li>
+      <li><a href="{{ site.baseurl }}icon/question"><i class="icon-question"></i> icon-question</a></li>
+      <li><a href="{{ site.baseurl }}icon/info"><i class="icon-info"></i> icon-info</a></li>
+      <li><a href="{{ site.baseurl }}icon/exclamation"><i class="icon-exclamation"></i> icon-exclamation</a></li>
+      <li><a href="{{ site.baseurl }}icon/superscript"><i class="icon-superscript"></i> icon-superscript</a></li>
+      <li><a href="{{ site.baseurl }}icon/subscript"><i class="icon-subscript"></i> icon-subscript</a></li>
+      <li><a href="{{ site.baseurl }}icon/eraser"><i class="icon-eraser"></i> icon-eraser</a></li>
+      <li><a href="{{ site.baseurl }}icon/puzzle-piece"><i class="icon-puzzle-piece"></i> icon-puzzle-piece</a></li>
+      <li><a href="{{ site.baseurl }}icon/microphone"><i class="icon-microphone"></i> icon-microphone</a></li>
+      <li><a href="{{ site.baseurl }}icon/microphone-off"><i class="icon-microphone-off"></i> icon-microphone-off</a></li>
+      <li><a href="{{ site.baseurl }}icon/shield"><i class="icon-shield"></i> icon-shield</a></li>
+      <li><a href="{{ site.baseurl }}icon/calendar-empty"><i class="icon-calendar-empty"></i> icon-calendar-empty</a></li>
+      <li><a href="{{ site.baseurl }}icon/fire-extinguisher"><i class="icon-fire-extinguisher"></i> icon-fire-extinguisher</a></li>
+      <li><a href="{{ site.baseurl }}icon/rocket"><i class="icon-rocket"></i> icon-rocket</a></li>
+    </ul>
+  </div>
+</section>

build/_includes/icons/social.html

@@ -0,0 +1,37 @@
+<section id="icons-social" class="row">
+  <div class="span12">
+    <h2 class="page-header">Social Icons</h2>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/phone"><i class="icon-phone"></i> icon-phone</a></li>
+      <li><a href="{{ site.baseurl }}icon/phone-sign"><i class="icon-phone-sign"></i> icon-phone-sign</a></li>
+      <li><a href="{{ site.baseurl }}icon/facebook"><i class="icon-facebook"></i> icon-facebook</a></li>
+      <li><a href="{{ site.baseurl }}icon/facebook-sign"><i class="icon-facebook-sign"></i> icon-facebook-sign</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/twitter"><i class="icon-twitter"></i> icon-twitter</a></li>
+      <li><a href="{{ site.baseurl }}icon/twitter-sign"><i class="icon-twitter-sign"></i> icon-twitter-sign</a></li>
+      <li><a href="{{ site.baseurl }}icon/github"><i class="icon-github"></i> icon-github</a></li>
+      <li><a href="{{ site.baseurl }}icon/github-alt"><i class="icon-github-alt"></i> icon-github-alt</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/github-sign"><i class="icon-github-sign"></i> icon-github-sign</a></li>
+      <li><a href="{{ site.baseurl }}icon/linkedin"><i class="icon-linkedin"></i> icon-linkedin</a></li>
+      <li><a href="{{ site.baseurl }}icon/linkedin-sign"><i class="icon-linkedin-sign"></i> icon-linkedin-sign</a></li>
+      <li><a href="{{ site.baseurl }}icon/pinterest"><i class="icon-pinterest"></i> icon-pinterest</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/pinterest-sign"><i class="icon-pinterest-sign"></i> icon-pinterest-sign</a></li>
+      <li><a href="{{ site.baseurl }}icon/google-plus"><i class="icon-google-plus"></i> icon-google-plus</a></li>
+      <li><a href="{{ site.baseurl }}icon/google-plus-sign"><i class="icon-google-plus-sign"></i> icon-google-plus-sign</a></li>
+      <li><a href="{{ site.baseurl }}icon/sign-blank"><i class="icon-sign-blank"></i> icon-sign-blank</a></li>
+    </ul>
+  </div>
+</section>

build/_includes/icons/text-editor.html

@@ -0,0 +1,53 @@
+<section id="icons-text-editor" class="row">
+  <div class="span12">
+    <h2 class="page-header">Text Editor Icons</h2>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/file"><i class="icon-file"></i> icon-file</a></li>
+      <li><a href="{{ site.baseurl }}icon/file-alt"><i class="icon-file-alt"></i> icon-file-alt</a></li>
+      <li><a href="{{ site.baseurl }}icon/cut"><i class="icon-cut"></i> icon-cut</a></li>
+      <li><a href="{{ site.baseurl }}icon/copy"><i class="icon-copy"></i> icon-copy</a></li>
+      <li><a href="{{ site.baseurl }}icon/paste"><i class="icon-paste"></i> icon-paste</a></li>
+      <li><a href="{{ site.baseurl }}icon/save"><i class="icon-save"></i> icon-save</a></li>
+      <li><a href="{{ site.baseurl }}icon/undo"><i class="icon-undo"></i> icon-undo</a></li>
+      <li><a href="{{ site.baseurl }}icon/repeat"><i class="icon-repeat"></i> icon-repeat</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/text-height"><i class="icon-text-height"></i> icon-text-height</a></li>
+      <li><a href="{{ site.baseurl }}icon/text-width"><i class="icon-text-width"></i> icon-text-width</a></li>
+      <li><a href="{{ site.baseurl }}icon/align-left"><i class="icon-align-left"></i> icon-align-left</a></li>
+      <li><a href="{{ site.baseurl }}icon/align-center"><i class="icon-align-center"></i> icon-align-center</a></li>
+      <li><a href="{{ site.baseurl }}icon/align-right"><i class="icon-align-right"></i> icon-align-right</a></li>
+      <li><a href="{{ site.baseurl }}icon/align-justify"><i class="icon-align-justify"></i> icon-align-justify</a></li>
+      <li><a href="{{ site.baseurl }}icon/indent-left"><i class="icon-indent-left"></i> icon-indent-left</a></li>
+      <li><a href="{{ site.baseurl }}icon/indent-right"><i class="icon-indent-right"></i> icon-indent-right</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/font"><i class="icon-font"></i> icon-font</a></li>
+      <li><a href="{{ site.baseurl }}icon/bold"><i class="icon-bold"></i> icon-bold</a></li>
+      <li><a href="{{ site.baseurl }}icon/italic"><i class="icon-italic"></i> icon-italic</a></li>
+      <li><a href="{{ site.baseurl }}icon/strikethrough"><i class="icon-strikethrough"></i> icon-strikethrough</a></li>
+      <li><a href="{{ site.baseurl }}icon/underline"><i class="icon-underline"></i> icon-underline</a></li>
+      <li><a href="{{ site.baseurl }}icon/link"><i class="icon-link"></i> icon-link</a></li>
+      <li><a href="{{ site.baseurl }}icon/paper-clip"><i class="icon-paper-clip"></i> icon-paper-clip</a></li>
+      <li><a href="{{ site.baseurl }}icon/columns"><i class="icon-columns"></i> icon-columns</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/table"><i class="icon-table"></i> icon-table</a></li>
+      <li><a href="{{ site.baseurl }}icon/th-large"><i class="icon-th-large"></i> icon-th-large</a></li>
+      <li><a href="{{ site.baseurl }}icon/th"><i class="icon-th"></i> icon-th</a></li>
+      <li><a href="{{ site.baseurl }}icon/th-list"><i class="icon-th-list"></i> icon-th-list</a></li>
+      <li><a href="{{ site.baseurl }}icon/list"><i class="icon-list"></i> icon-list</a></li>
+      <li><a href="{{ site.baseurl }}icon/list-ol"><i class="icon-list-ol"></i> icon-list-ol</a></li>
+      <li><a href="{{ site.baseurl }}icon/list-ul"><i class="icon-list-ul"></i> icon-list-ul</a></li>
+      <li><a href="{{ site.baseurl }}icon/list-alt"><i class="icon-list-alt"></i> icon-list-alt</a></li>
+    </ul>
+  </div>
+</section>

build/_includes/icons/video-player.html

@@ -0,0 +1,35 @@
+<section id="icons-video-player" class="row">
+  <div class="span12">
+    <h2 class="page-header">Video Player Icons</h2>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/play-circle"><i class="icon-play-circle"></i> icon-play-circle</a></li>
+      <li><a href="{{ site.baseurl }}icon/play"><i class="icon-play"></i> icon-play</a></li>
+      <li><a href="{{ site.baseurl }}icon/pause"><i class="icon-pause"></i> icon-pause</a></li>
+      <li><a href="{{ site.baseurl }}icon/stop"><i class="icon-stop"></i> icon-stop</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/step-backward"><i class="icon-step-backward"></i> icon-step-backward</a></li>
+      <li><a href="{{ site.baseurl }}icon/fast-backward"><i class="icon-fast-backward"></i> icon-fast-backward</a></li>
+      <li><a href="{{ site.baseurl }}icon/backward"><i class="icon-backward"></i> icon-backward</a></li>
+      <li><a href="{{ site.baseurl }}icon/forward"><i class="icon-forward"></i> icon-forward</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/fast-forward"><i class="icon-fast-forward"></i> icon-fast-forward</a></li>
+      <li><a href="{{ site.baseurl }}icon/step-forward"><i class="icon-step-forward"></i> icon-step-forward</a></li>
+      <li><a href="{{ site.baseurl }}icon/eject"><i class="icon-eject"></i> icon-eject</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/fullscreen"><i class="icon-fullscreen"></i> icon-fullscreen</a></li>
+      <li><a href="{{ site.baseurl }}icon/resize-full"><i class="icon-resize-full"></i> icon-resize-full</a></li>
+      <li><a href="{{ site.baseurl }}icon/resize-small"><i class="icon-resize-small"></i> icon-resize-small</a></li>
+    </ul>
+  </div>
+</section>

build/_includes/icons/web-app.html

@@ -0,0 +1,174 @@
+
+<section id="icons-web-app" class="row">
+  <div class="span12">
+    <h2 class="page-header">Web Application Icons</h2>
+  </div>
+
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/adjust"><i class="icon-adjust"></i> icon-adjust</a></li>
+      <li><a href="{{ site.baseurl }}icon/asterisk"><i class="icon-asterisk"></i> icon-asterisk</a></li>
+      <li><a href="{{ site.baseurl }}icon/ban-circle"><i class="icon-ban-circle"></i> icon-ban-circle</a></li>
+      <li><a href="{{ site.baseurl }}icon/bar-chart"><i class="icon-bar-chart"></i> icon-bar-chart</a></li>
+      <li><a href="{{ site.baseurl }}icon/barcode"><i class="icon-barcode"></i> icon-barcode</a></li>
+      <li><a href="{{ site.baseurl }}icon/beaker"><i class="icon-beaker"></i> icon-beaker</a></li>
+      <li><a href="{{ site.baseurl }}icon/beer"><i class="icon-beer"></i> icon-beer</a></li>
+      <li><a href="{{ site.baseurl }}icon/bell"><i class="icon-bell"></i> icon-bell</a></li>
+      <li><a href="{{ site.baseurl }}icon/bell-alt"><i class="icon-bell-alt"></i> icon-bell-alt</a></li>
+      <li><a href="{{ site.baseurl }}icon/bolt"><i class="icon-bolt"></i> icon-bolt</a></li>
+      <li><a href="{{ site.baseurl }}icon/book"><i class="icon-book"></i> icon-book</a></li>
+      <li><a href="{{ site.baseurl }}icon/bookmark"><i class="icon-bookmark"></i> icon-bookmark</a></li>
+      <li><a href="{{ site.baseurl }}icon/bookmark-empty"><i class="icon-bookmark-empty"></i> icon-bookmark-empty</a></li>
+      <li><a href="{{ site.baseurl }}icon/briefcase"><i class="icon-briefcase"></i> icon-briefcase</a></li>
+      <li><a href="{{ site.baseurl }}icon/bullhorn"><i class="icon-bullhorn"></i> icon-bullhorn</a></li>
+      <li><a href="{{ site.baseurl }}icon/calendar"><i class="icon-calendar"></i> icon-calendar</a></li>
+      <li><a href="{{ site.baseurl }}icon/camera"><i class="icon-camera"></i> icon-camera</a></li>
+      <li><a href="{{ site.baseurl }}icon/camera-retro"><i class="icon-camera-retro"></i> icon-camera-retro</a></li>
+      <li><a href="{{ site.baseurl }}icon/certificate"><i class="icon-certificate"></i> icon-certificate</a></li>
+      <li><a href="{{ site.baseurl }}icon/check"><i class="icon-check"></i> icon-check</a></li>
+      <li><a href="{{ site.baseurl }}icon/check-empty"><i class="icon-check-empty"></i> icon-check-empty</a></li>
+      <li><a href="{{ site.baseurl }}icon/circle"><i class="icon-circle"></i> icon-circle</a></li>
+      <li><a href="{{ site.baseurl }}icon/circle-blank"><i class="icon-circle-blank"></i> icon-circle-blank</a></li>
+      <li><a href="{{ site.baseurl }}icon/cloud"><i class="icon-cloud"></i> icon-cloud</a></li>
+      <li><a href="{{ site.baseurl }}icon/cloud-download"><i class="icon-cloud-download"></i> icon-cloud-download</a></li>
+      <li><a href="{{ site.baseurl }}icon/cloud-upload"><i class="icon-cloud-upload"></i> icon-cloud-upload</a></li>
+      <li><a href="{{ site.baseurl }}icon/coffee"><i class="icon-coffee"></i> icon-coffee</a></li>
+      <li><a href="{{ site.baseurl }}icon/cog"><i class="icon-cog"></i> icon-cog</a></li>
+      <li><a href="{{ site.baseurl }}icon/cogs"><i class="icon-cogs"></i> icon-cogs</a></li>
+      <li><a href="{{ site.baseurl }}icon/comment"><i class="icon-comment"></i> icon-comment</a></li>
+      <li><a href="{{ site.baseurl }}icon/comment-alt"><i class="icon-comment-alt"></i> icon-comment-alt</a></li>
+      <li><a href="{{ site.baseurl }}icon/comments"><i class="icon-comments"></i> icon-comments</a></li>
+      <li><a href="{{ site.baseurl }}icon/comments-alt"><i class="icon-comments-alt"></i> icon-comments-alt</a></li>
+      <li><a href="{{ site.baseurl }}icon/credit-card"><i class="icon-credit-card"></i> icon-credit-card</a></li>
+      <li><a href="{{ site.baseurl }}icon/dashboard"><i class="icon-dashboard"></i> icon-dashboard</a></li>
+      <li><a href="{{ site.baseurl }}icon/desktop"><i class="icon-desktop"></i> icon-desktop</a></li>
+      <li><a href="{{ site.baseurl }}icon/download"><i class="icon-download"></i> icon-download</a></li>
+      <li><a href="{{ site.baseurl }}icon/download-alt"><i class="icon-download-alt"></i> icon-download-alt</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/edit"><i class="icon-edit"></i> icon-edit</a></li>
+      <li><a href="{{ site.baseurl }}icon/envelope"><i class="icon-envelope"></i> icon-envelope</a></li>
+      <li><a href="{{ site.baseurl }}icon/envelope-alt"><i class="icon-envelope-alt"></i> icon-envelope-alt</a></li>
+      <li><a href="{{ site.baseurl }}icon/exchange"><i class="icon-exchange"></i> icon-exchange</a></li>
+      <li><a href="{{ site.baseurl }}icon/exclamation-sign"><i class="icon-exclamation-sign"></i> icon-exclamation-sign</a></li>
+      <li><a href="{{ site.baseurl }}icon/external-link"><i class="icon-external-link"></i> icon-external-link</a></li>
+      <li><a href="{{ site.baseurl }}icon/eye-close"><i class="icon-eye-close"></i> icon-eye-close</a></li>
+      <li><a href="{{ site.baseurl }}icon/eye-open"><i class="icon-eye-open"></i> icon-eye-open</a></li>
+      <li><a href="{{ site.baseurl }}icon/facetime-video"><i class="icon-facetime-video"></i> icon-facetime-video</a></li>
+      <li><a href="{{ site.baseurl }}icon/fighter-jet"><i class="icon-fighter-jet"></i> icon-fighter-jet</a></li>
+      <li><a href="{{ site.baseurl }}icon/film"><i class="icon-film"></i> icon-film</a></li>
+      <li><a href="{{ site.baseurl }}icon/filter"><i class="icon-filter"></i> icon-filter</a></li>
+      <li><a href="{{ site.baseurl }}icon/fire"><i class="icon-fire"></i> icon-fire</a></li>
+      <li><a href="{{ site.baseurl }}icon/flag"><i class="icon-flag"></i> icon-flag</a></li>
+      <li><a href="{{ site.baseurl }}icon/folder-close"><i class="icon-folder-close"></i> icon-folder-close</a></li>
+      <li><a href="{{ site.baseurl }}icon/folder-open"><i class="icon-folder-open"></i> icon-folder-open</a></li>
+      <li><a href="{{ site.baseurl }}icon/folder-close-alt"><i class="icon-folder-close-alt"></i> icon-folder-close-alt</a></li>
+      <li><a href="{{ site.baseurl }}icon/folder-open-alt"><i class="icon-folder-open-alt"></i> icon-folder-open-alt</a></li>
+      <li><a href="{{ site.baseurl }}icon/food"><i class="icon-food"></i> icon-food</a></li>
+      <li><a href="{{ site.baseurl }}icon/gift"><i class="icon-gift"></i> icon-gift</a></li>
+      <li><a href="{{ site.baseurl }}icon/glass"><i class="icon-glass"></i> icon-glass</a></li>
+      <li><a href="{{ site.baseurl }}icon/globe"><i class="icon-globe"></i> icon-globe</a></li>
+      <li><a href="{{ site.baseurl }}icon/group"><i class="icon-group"></i> icon-group</a></li>
+      <li><a href="{{ site.baseurl }}icon/hdd"><i class="icon-hdd"></i> icon-hdd</a></li>
+      <li><a href="{{ site.baseurl }}icon/headphones"><i class="icon-headphones"></i> icon-headphones</a></li>
+      <li><a href="{{ site.baseurl }}icon/heart"><i class="icon-heart"></i> icon-heart</a></li>
+      <li><a href="{{ site.baseurl }}icon/heart-empty"><i class="icon-heart-empty"></i> icon-heart-empty</a></li>
+      <li><a href="{{ site.baseurl }}icon/home"><i class="icon-home"></i> icon-home</a></li>
+      <li><a href="{{ site.baseurl }}icon/inbox"><i class="icon-inbox"></i> icon-inbox</a></li>
+      <li><a href="{{ site.baseurl }}icon/info-sign"><i class="icon-info-sign"></i> icon-info-sign</a></li>
+      <li><a href="{{ site.baseurl }}icon/key"><i class="icon-key"></i> icon-key</a></li>
+      <li><a href="{{ site.baseurl }}icon/leaf"><i class="icon-leaf"></i> icon-leaf</a></li>
+      <li><a href="{{ site.baseurl }}icon/laptop"><i class="icon-laptop"></i> icon-laptop</a></li>
+      <li><a href="{{ site.baseurl }}icon/legal"><i class="icon-legal"></i> icon-legal</a></li>
+      <li><a href="{{ site.baseurl }}icon/lemon"><i class="icon-lemon"></i> icon-lemon</a></li>
+      <li><a href="{{ site.baseurl }}icon/lightbulb"><i class="icon-lightbulb"></i> icon-lightbulb</a></li>
+      <li><a href="{{ site.baseurl }}icon/lock"><i class="icon-lock"></i> icon-lock</a></li>
+      <li><a href="{{ site.baseurl }}icon/unlock"><i class="icon-unlock"></i> icon-unlock</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/magic"><i class="icon-magic"></i> icon-magic</a></li>
+      <li><a href="{{ site.baseurl }}icon/magnet"><i class="icon-magnet"></i> icon-magnet</a></li>
+      <li><a href="{{ site.baseurl }}icon/map-marker"><i class="icon-map-marker"></i> icon-map-marker</a></li>
+      <li><a href="{{ site.baseurl }}icon/minus"><i class="icon-minus"></i> icon-minus</a></li>
+      <li><a href="{{ site.baseurl }}icon/minus-sign"><i class="icon-minus-sign"></i> icon-minus-sign</a></li>
+      <li><a href="{{ site.baseurl }}icon/mobile-phone"><i class="icon-mobile-phone"></i> icon-mobile-phone</a></li>
+      <li><a href="{{ site.baseurl }}icon/money"><i class="icon-money"></i> icon-money</a></li>
+      <li><a href="{{ site.baseurl }}icon/move"><i class="icon-move"></i> icon-move</a></li>
+      <li><a href="{{ site.baseurl }}icon/music"><i class="icon-music"></i> icon-music</a></li>
+      <li><a href="{{ site.baseurl }}icon/off"><i class="icon-off"></i> icon-off</a></li>
+      <li><a href="{{ site.baseurl }}icon/ok"><i class="icon-ok"></i> icon-ok</a></li>
+      <li><a href="{{ site.baseurl }}icon/ok-circle"><i class="icon-ok-circle"></i> icon-ok-circle</a></li>
+      <li><a href="{{ site.baseurl }}icon/ok-sign"><i class="icon-ok-sign"></i> icon-ok-sign</a></li>
+      <li><a href="{{ site.baseurl }}icon/pencil"><i class="icon-pencil"></i> icon-pencil</a></li>
+      <li><a href="{{ site.baseurl }}icon/picture"><i class="icon-picture"></i> icon-picture</a></li>
+      <li><a href="{{ site.baseurl }}icon/plane"><i class="icon-plane"></i> icon-plane</a></li>
+      <li><a href="{{ site.baseurl }}icon/plus"><i class="icon-plus"></i> icon-plus</a></li>
+      <li><a href="{{ site.baseurl }}icon/plus-sign"><i class="icon-plus-sign"></i> icon-plus-sign</a></li>
+      <li><a href="{{ site.baseurl }}icon/print"><i class="icon-print"></i> icon-print</a></li>
+      <li><a href="{{ site.baseurl }}icon/pushpin"><i class="icon-pushpin"></i> icon-pushpin</a></li>
+      <li><a href="{{ site.baseurl }}icon/qrcode"><i class="icon-qrcode"></i> icon-qrcode</a></li>
+      <li><a href="{{ site.baseurl }}icon/question-sign"><i class="icon-question-sign"></i> icon-question-sign</a></li>
+      <li><a href="{{ site.baseurl }}icon/quote-left"><i class="icon-quote-left"></i> icon-quote-left</a></li>
+      <li><a href="{{ site.baseurl }}icon/quote-right"><i class="icon-quote-right"></i> icon-quote-right</a></li>
+      <li><a href="{{ site.baseurl }}icon/random"><i class="icon-random"></i> icon-random</a></li>
+      <li><a href="{{ site.baseurl }}icon/refresh"><i class="icon-refresh"></i> icon-refresh</a></li>
+      <li><a href="{{ site.baseurl }}icon/remove"><i class="icon-remove"></i> icon-remove</a></li>
+      <li><a href="{{ site.baseurl }}icon/remove-circle"><i class="icon-remove-circle"></i> icon-remove-circle</a></li>
+      <li><a href="{{ site.baseurl }}icon/remove-sign"><i class="icon-remove-sign"></i> icon-remove-sign</a></li>
+      <li><a href="{{ site.baseurl }}icon/reorder"><i class="icon-reorder"></i> icon-reorder</a></li>
+      <li><a href="{{ site.baseurl }}icon/reply"><i class="icon-reply"></i> icon-reply</a></li>
+      <li><a href="{{ site.baseurl }}icon/resize-horizontal"><i class="icon-resize-horizontal"></i> icon-resize-horizontal</a></li>
+      <li><a href="{{ site.baseurl }}icon/resize-vertical"><i class="icon-resize-vertical"></i> icon-resize-vertical</a></li>
+      <li><a href="{{ site.baseurl }}icon/retweet"><i class="icon-retweet"></i> icon-retweet</a></li>
+      <li><a href="{{ site.baseurl }}icon/road"><i class="icon-road"></i> icon-road</a></li>
+      <li><a href="{{ site.baseurl }}icon/rss"><i class="icon-rss"></i> icon-rss</a></li>
+      <li><a href="{{ site.baseurl }}icon/screenshot"><i class="icon-screenshot"></i> icon-screenshot</a></li>
+      <li><a href="{{ site.baseurl }}icon/search"><i class="icon-search"></i> icon-search</a></li>
+    </ul>
+  </div>
+  <div class="span3">
+    <ul class="the-icons">
+      <li><a href="{{ site.baseurl }}icon/share"><i class="icon-share"></i> icon-share</a></li>
+      <li><a href="{{ site.baseurl }}icon/share-alt"><i class="icon-share-alt"></i> icon-share-alt</a></li>
+      <li><a href="{{ site.baseurl }}icon/shopping-cart"><i class="icon-shopping-cart"></i> icon-shopping-cart</a></li>
+      <li><a href="{{ site.baseurl }}icon/signal"><i class="icon-signal"></i> icon-signal</a></li>
+      <li><a href="{{ site.baseurl }}icon/signin"><i class="icon-signin"></i> icon-signin</a></li>
+      <li><a href="{{ site.baseurl }}icon/signout"><i class="icon-signout"></i> icon-signout</a></li>
+      <li><a href="{{ site.baseurl }}icon/sitemap"><i class="icon-sitemap"></i> icon-sitemap</a></li>
+      <li><a href="{{ site.baseurl }}icon/sort"><i class="icon-sort"></i> icon-sort</a></li>
+      <li><a href="{{ site.baseurl }}icon/sort-down"><i class="icon-sort-down"></i> icon-sort-down</a></li>
+      <li><a href="{{ site.baseurl }}icon/sort-up"><i class="icon-sort-up"></i> icon-sort-up</a></li>
+      <li><a href="{{ site.baseurl }}icon/spinner"><i class="icon-spinner"></i> icon-spinner</a></li>
+      <li><a href="{{ site.baseurl }}icon/star"><i class="icon-star"></i> icon-star</a></li>
+      <li><a href="{{ site.baseurl }}icon/star-empty"><i class="icon-star-empty"></i> icon-star-empty</a></li>
+      <li><a href="{{ site.baseurl }}icon/star-half"><i class="icon-star-half"></i> icon-star-half</a></li>
+      <li><a href="{{ site.baseurl }}icon/tablet"><i class="icon-tablet"></i> icon-tablet</a></li>
+      <li><a href="{{ site.baseurl }}icon/tag"><i class="icon-tag"></i> icon-tag</a></li>
+      <li><a href="{{ site.baseurl }}icon/tags"><i class="icon-tags"></i> icon-tags</a></li>
+      <li><a href="{{ site.baseurl }}icon/tasks"><i class="icon-tasks"></i> icon-tasks</a></li>
+      <li><a href="{{ site.baseurl }}icon/thumbs-down"><i class="icon-thumbs-down"></i> icon-thumbs-down</a></li>
+      <li><a href="{{ site.baseurl }}icon/thumbs-up"><i class="icon-thumbs-up"></i> icon-thumbs-up</a></li>
+      <li><a href="{{ site.baseurl }}icon/time"><i class="icon-time"></i> icon-time</a></li>
+      <li><a href="{{ site.baseurl }}icon/tint"><i class="icon-tint"></i> icon-tint</a></li>
+      <li><a href="{{ site.baseurl }}icon/trash"><i class="icon-trash"></i> icon-trash</a></li>
+      <li><a href="{{ site.baseurl }}icon/trophy"><i class="icon-trophy"></i> icon-trophy</a></li>
+      <li><a href="{{ site.baseurl }}icon/truck"><i class="icon-truck"></i> icon-truck</a></li>
+      <li><a href="{{ site.baseurl }}icon/umbrella"><i class="icon-umbrella"></i> icon-umbrella</a></li>
+      <li><a href="{{ site.baseurl }}icon/upload"><i class="icon-upload"></i> icon-upload</a></li>
+      <li><a href="{{ site.baseurl }}icon/upload-alt"><i class="icon-upload-alt"></i> icon-upload-alt</a></li>
+      <li><a href="{{ site.baseurl }}icon/user"><i class="icon-user"></i> icon-user</a></li>
+      <li><a href="{{ site.baseurl }}icon/user-md"><i class="icon-user-md"></i> icon-user-md</a></li>
+      <li><a href="{{ site.baseurl }}icon/volume-off"><i class="icon-volume-off"></i> icon-volume-off</a></li>
+      <li><a href="{{ site.baseurl }}icon/volume-down"><i class="icon-volume-down"></i> icon-volume-down</a></li>
+      <li><a href="{{ site.baseurl }}icon/volume-up"><i class="icon-volume-up"></i> icon-volume-up</a></li>
+      <li><a href="{{ site.baseurl }}icon/warning-sign"><i class="icon-warning-sign"></i> icon-warning-sign</a></li>
+      <li><a href="{{ site.baseurl }}icon/wrench"><i class="icon-wrench"></i> icon-wrench</a></li>
+      <li><a href="{{ site.baseurl }}icon/zoom-in"><i class="icon-zoom-in"></i> icon-zoom-in</a></li>
+      <li><a href="{{ site.baseurl }}icon/zoom-out"><i class="icon-zoom-out"></i> icon-zoom-out</a></li>
+    </ul>
+  </div>
+</section>

build/_includes/integration.html

@@ -0,0 +1,101 @@
+<section id="integration">
+  <h2 class="page-header">Integration</h2>
+  <p>It's easy to integrate Font Awesome into Twitter Bootstrap, or even use it on its own.</p>
+  <div class="row">
+    <div class="span12">
+      <h4>Easy Bootstrap + Font Awesome Integration</h4>
+    </div>
+    <div class="span3">
+      <p>Use this method to integrate Font Awesome with the default Bootstrap CSS.</p>
+    </div>
+    <div class="span9">
+      <ol>
+        <li>Copy the Font Awesome font directory into your project.</li>
+        <li>Copy font-awesome.min.css into your project.</li>
+        <li>
+          Open your project's font-awesome.min.css and edit the font paths to ensure they point to the right place.
+          <p class="alert alert-info"><i class="icon-info-sign"></i> The font path is relative from your CSS directory.</p>
+        </li>
+        <li>
+          In the <code>&lt;head&gt;</code> of your html, reference the location to your font-awesome.min.css.
+<pre class="prettyprint linenums">
+&lt;link rel="stylesheet" href="../css/bootstrap.min.css"&gt;
+&lt;link rel="stylesheet" href="../css/font-awesome.min.css"&gt;
+</pre>
+        </li>
+        <li>Check out the examples to start using Font Awesome!</li>
+      </ol>
+    </div>
+  </div>
+  <div class="row">
+    <div class="span12">
+      <h4>Custom Bootstrap + Font Awesome Integration using LESS</h4>
+    </div>
+    <div class="span3">
+      <p>Use this method to integrate Font Awesome with Twitter Bootstrap using LESS.</p>
+    </div>
+    <div class="span9">
+      <ol>
+        <li>Copy the Font Awesome font directory into your project.</li>
+        <li>Copy font-awesome.less into your bootstrap/less directory.</li>
+        <li>Open bootstrap.less and replace <code>@import "sprites.less";</code> with <code>@import "font-awesome.less";</code></li>
+        <li>
+          Open your project's font-awesome.less and edit the <code>@FontAwesomePath</code> variable to point to your font directory.
+<pre class="prettyprint linenums">
+@FontAwesomePath:   "../font";
+</pre>
+          <p class="alert alert-info"><i class="icon-info-sign"></i> The font path is relative from your compiled CSS directory.</p>
+        </li>
+        <li>Re-compile your LESS if using a static compiler. Otherwise, you should be good to go.</li>
+        <li>Check out the examples to start using Font Awesome!</li>
+      </ol>
+    </div>
+  </div>
+  <div class="row">
+    <div class="span12">
+      <h4>Custom Bootstrap + Font Awesome Integration using SASS or SCSS</h4>
+      <p>I have never used either, so let me know if the included SCSS or SASS files have issues.</p>
+    </div>
+  </div>
+  <div class="row">
+    <div class="span12">
+      <h4>Not using Bootstrap?</h4>
+    </div>
+    <div class="span3">
+      <p>Font Awesome works just as well without Twitter Bootstrap.</p>
+    </div>
+    <div class="span9">
+      <ol>
+        <li>Copy the Font Awesome font directory into your project.</li>
+        <li>Copy font-awesome.less or font-awesome.min.css into your project.</li>
+        <li>Open your project's font-awesome.less or font-awesome.min.css and edit the font location to point it to your font directory (see above examples).</li>
+        <li>Check out the examples to start using Font Awesome!</li>
+      </ol>
+    </div>
+  </div>
+  <div class="row">
+    <div class="span12">
+      <h4>Need IE7 Support?</h4>
+    </div>
+    <div class="span3">
+      <p>Font Awesome supports IE7. If you need it, you have my condolences.</p>
+    </div>
+    <div class="span9">
+      <ol>
+        <li>Get Font Awesome working properly in a modern browser.</li>
+        <li>Copy font-awesome-ie7.min.css into your project.</li>
+        <li>
+          In the <code>&lt;head&gt;</code> of your html, reference the location to your font-awesome-ie7.min.css.
+<pre class="prettyprint linenums">
+&lt;link rel="stylesheet" href="../css/bootstrap.min.css"&gt;
+&lt;link rel="stylesheet" href="../css/font-awesome.min.css"&gt;
+&lt;!--[if IE 7]&gt;
+&lt;link rel=&quot;stylesheet&quot; href=&quot;assets/css/font-awesome-ie7.min.css&quot;&gt;
+&lt;![endif]--&gt;
+</pre>
+        </li>
+        <li>Go complain to whoever decided your project needs IE7 support.</li>
+      </ol>
+    </div>
+  </div>
+</section>

build/_includes/jumbotron-slider.html

@@ -0,0 +1,56 @@
+<div class="jumbotron">
+  <div class="container">
+    <div class="row">
+      <div class="span8">
+        <div class="hero-content">
+          <h1>Font Awesome</h1>
+          <p>The iconic font designed for<br>use with Twitter Bootstrap</p>
+          <div class="actions">
+            <a class="btn btn-primary btn-large" href="https://github.com/FortAwesome/Font-Awesome/zipball/master"
+               onClick="_gaq.push(['_trackEvent', 'Outbound Link', 'Download on GitHub']);">
+              <i class="icon-download icon-2x pull-left"></i>
+              Download Font<br>Awesome {{ site.font-awesome.version }}</a>
+            <a class="btn btn-large btn-github" href="https://github.com/FortAwesome/Font-Awesome" target="_blank"
+               onClick="_gaq.push(['_trackEvent', 'Outbound Link', 'View Project on GitHub']);">
+              <i class="icon-github icon-2x pull-left"></i>
+              View Project<br>on GitHub</a>
+          </div>
+          <div class="shameless-self-promotion">
+            Version {{ site.font-awesome.version }} • Created & Maintained by Dave Gandy
+          </div>
+        </div>
+      </div>
+      <div class="span4">
+        <div id="iconCarousel" class="carousel slide">
+          <!-- Carousel items -->
+          <div class="carousel-inner">
+            <div class="active item"><div><i class="icon-flag"></i></div></div>
+            <div class="item"><div><i class="icon-rocket"></i></div></div>
+            <div class="item"><div><i class="icon-crop"></i></div></div>
+            <div class="item"><div><i class="icon-fire-extinguisher"></i></div></div>
+            <div class="item"><div><i class="icon-microphone"></i></div></div>
+            <div class="item"><div><i class="icon-shield"></i></div></div>
+            <div class="item"><div><i class="icon-star-half-empty"></i></div></div>
+            <div class="item"><div><i class="icon-envelope"></i></div></div>
+            <div class="item"><div><i class="icon-coffee"></i></div></div>
+            <div class="item"><div><i class="icon-medkit"></i></div></div>
+            <div class="item"><div><i class="icon-book"></i></div></div>
+            <div class="item"><div><i class="icon-fighter-jet"></i></div></div>
+            <div class="item"><div><i class="icon-search"></i></div></div>
+            <div class="item"><div><i class="icon-beer"></i></div></div>
+            <div class="item"><div><i class="icon-heart-empty"></i></div></div>
+            <div class="item"><div><i class="icon-thumbs-up"></i></div></div>
+          </div>
+          <!-- Carousel nav -->
+          <a class="carousel-control left" href="#iconCarousel" data-slide="prev"
+             onClick="_gaq.push(['_trackEvent', 'iconCarousel', 'Prev']);">
+            <i class="icon-arrow-left"></i></a>
+          <a class="carousel-control right" href="#iconCarousel" data-slide="next"
+             onClick="_gaq.push(['_trackEvent', 'iconCarousel', 'Next']);">
+            <i class="icon-arrow-right"></i></a>
+        </div>
+      </div>
+    </div>
+
+  </div>
+</div>

build/_includes/jumbotron.html

@@ -0,0 +1,7 @@
+<div class="jumbotron jumbotron-ad">
+  <div class="container">
+    <div class="pull-right">{% include ads/carbon-dark-vertical.html %}</div>
+    <h1>{{ jumbotron_h1 }}</h1>
+    <p>{{ jumbotron_p }}</p>
+  </div>
+</div>

build/_includes/navbar.html

@@ -0,0 +1,19 @@
+<div class="navbar navbar-inverse navbar-static-top">
+  <div class="navbar-inner">
+    <div class="container">
+      <a class="brand" href="{{ site.baseurl }}"><i class="icon-flag"></i> Font Awesome</a>
+      <ul class="nav">
+        <li{% if page.navbar_active == "home" %} class="active"{% endif %}><a href="{{ site.baseurl }}">Home</a></li>
+        <li{% if page.navbar_active == "whats-new" %} class="active"{% endif %}><a href="{{ site.baseurl }}whats-new/">What's New</a></li>
+        <li{% if page.navbar_active == "icons" %} class="active"{% endif %}><a href="{{ site.baseurl }}icons/">Icons</a></li>
+        <li{% if page.navbar_active == "integration" %} class="active"{% endif %}><a href="{{ site.baseurl }}integration/">Integration</a></li>
+        <li{% if page.navbar_active == "examples" %} class="active"{% endif %}><a href="{{ site.baseurl }}examples/">Examples</a></li>
+        <li{% if page.navbar_active == "roadmap" %} class="active"{% endif %}><a href="{{ site.baseurl }}roadmap/">Roadmap</a></li>
+        <li{% if page.navbar_active == "thanks" %} class="active"{% endif %}><a href="{{ site.baseurl }}thanks/">Say Thanks</a></li>
+      </ul>
+      <ul class="nav pull-right">
+        <li><a href="mailto:{{ site.font-awesome.author.email }}"><i class="icon-envelope"></i> Me</a></li>
+      </ul>
+    </div>
+  </div>
+</div>

build/_includes/roadmap.html

@@ -0,0 +1,9 @@
+<section id="roadmap">
+  <h2 class="page-header">Roadmap</h2>
+  <p>Here's the plan for future updates.</p>
+  <ul class="icons">
+    <li><i class="icon-plus"></i>Easier sub-setting with icon packs.</li>
+    <li><i class="icon-plus"></i>More icons. Have any requests? <a href="https://github.com/FortAwesome/Font-Awesome/issues" target="_blank">Open an issue</a> in the Font Awesome GitHub project.</li>
+    <li><i class="icon-plus"></i>Tricks and tips for super-awesome creative CSS methods, like the star example above.</li>
+  </ul>
+</section>

build/_includes/say-thanks.html

@@ -0,0 +1,22 @@
+<section id="say-thanks">
+  <p class="lead">
+    Hopefully you think Font Awesome <em>is</em> awesome. I've put hundreds of hours into the project to give back to the
+    open source community. If you'd like, here are a couple of ways you can tell me thanks for all my hard work.
+  </p>
+  <div class="row">
+    <div class="span6">
+      <h4><a href="http://www.shareagift.com/pages/giftpage.aspx?giftid=2472" target="_blank">Help me buy an iMac</a></h4>
+      <p>
+        <a href="http://www.shareagift.com/pages/giftpage.aspx?giftid=2472" target="_blank">Contribute</a> to a shiny
+        new iMac for me to keep making great icons.
+      </p>
+    </div>
+    <div class="span6">
+      <h4><a href="http://amzn.com/w/G64X58AY416W" target="_blank">My Amazon Wish List</a></h4>
+      <p>
+        Or pick something straight
+        from <a href="http://amzn.com/w/G64X58AY416W" target="_blank">my wish list</a>. Gift cards are great.
+      </p>
+    </div>
+  </div>
+</section>

build/_includes/special-thanks.html

@@ -0,0 +1,14 @@
+<section id="special-thanks">
+  <h2 class="page-header">Special Thanks</h2>
+  <p>
+    Special thanks to <a href="https://twitter.com/robmadole/" target="_blank">@robmadole</a> and
+    <a href="https://twitter.com/supercodepoet/" target="_blank">@supercodepoet</a> for icon design
+    review, advice, and some backbone.js help.
+  </p>
+  <p>
+    Special thanks to <a target="_blank" href="https://twitter.com/grantgordon">@grantgordon</a> and
+    <a target="_blank" href="https://twitter.com/johnsmclay">@johnsmclay</a> for developing
+    <a target="_blank"  href="http://icnfnt.com/">icnfnt</a>, the best way to subset Font Awesome to get just the
+    icons you need.
+  </p>
+</section>

build/_includes/stripe-social.html

@@ -0,0 +1,31 @@
+<div id="social-buttons">
+  <div class="container">
+    <ul class="unstyled inline">
+      <li>
+        <iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=FortAwesome&repo=Font-Awesome&type=watch&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="100px" height="20px"></iframe>
+      </li>
+      <li>
+        <iframe class="github-btn" src="http://ghbtns.com/github-btn.html?user=FortAwesome&repo=Font-Awesome&type=fork&count=true" allowtransparency="true" frameborder="0" scrolling="0" width="102px" height="20px"></iframe>
+      </li>
+      <li class="follow-btn">
+        <a href="https://twitter.com/fortaweso_me" class="twitter-follow-button" data-link-color="#0069D6" data-show-count="true">Follow @fortaweso_me</a>
+      </li>
+      <li class="tweet-btn">
+        <a href="https://twitter.com/share" class="twitter-share-button" data-url="{{ site.font-awesome.url }}" data-count="horizontal" data-via="fortaweso_me" data-related="mdo:Creator of Twitter Bootstrap">Tweet</a>
+      </li>
+    </ul>
+
+    <!--<div class="watch">-->
+      <!--<a class="btn btn-mini" href="https://github.com/FortAwesome/Font-Awesome" target="_blank"><i class="icon-github icon-large"></i> Watch</a>-->
+      <!--<a id="watchers" class="count btn btn-mini" href="https://github.com/FortAwesome/Font-Awesome">9000+</a>-->
+    <!--</div>-->
+    <!--<div class="fork">-->
+      <!--<a class="btn btn-mini" href="https://github.com/FortAwesome/Font-Awesome" target="_blank"><i class="icon-github icon-large"></i> Fork</a>-->
+      <!--<a id="forks" class="count btn btn-mini" href="#">800+</a>-->
+    <!--</div>-->
+    <!--<div class="follow">-->
+      <!--<a class="btn btn-mini" href="http://twitter.com/fortaweso_me/" target="_blank"><i class="icon-twitter icon-large"></i> Follow @fortaweso_me</a>-->
+      <!--<span id="followers" class="count btn btn-mini">2500+</span>-->
+    <!--</div>-->
+  </div>
+</div>

build/_includes/whats-new.html

@@ -0,0 +1,30 @@
+<section id="whats-new">
+  <div class="row">
+    <div class="span4">
+      <h4><i class="icon-magic"></i> Pixel Perfection at 14px</h4>
+      Every single icon re-created from the ground up to be optimized for Bootstrap's default 14px.
+    </div>
+    <div class="span4">
+      <h4><i class="icon-th-large"></i> <a target="_blank"  href="http://icnfnt.com/">Font Sub-setting</a></h4>
+      Thanks to <a target="_blank" href="https://twitter.com/grantgordon">@grantgordon</a> and <a target="_blank" href="https://twitter.com/johnsmclay">@johnsmclay</a>, you can <a target="_blank"  href="http://icnfnt.com/">subset</a> to get just the icons you need.
+    </div>
+    <div class="span4">
+      <h4><i class="icon-legal"></i> <a href="#license">Better License</a></h4>
+      SIL open font license, MIT license for code. No more attribution required, but much appreciated.
+    </div>
+  </div>
+  <div class="row">
+    <div class="span4">
+      <h4><i class="icon-lightbulb"></i> 40 New Icons in 3.0</h4>
+      Requested by the active community on the <a href="https://github.com/FortAwesome/Font-Awesome" target="_blank">Font Awesome GitHub project</a>.
+    </div>
+    <div class="span4">
+      <h4><i class="icon-spinner icon-spin"></i> <a href="#examples">New Styles</a></h4>
+      <a href="#examples">New styles</a> for animated spinning icons, icons with 2x-4x size multipliers, icon borders, & more.
+    </div>
+    <div class="span4">
+      <h4><i class="icon-resize-small"></i> 28% Smaller Payload</h4>
+      3.0 is smaller, even with 16% more icons. Crazy small if you <a target="_blank"  href="http://icnfnt.com/">subset</a> just the icons you need.
+    </div>
+  </div>
+</section>

build/_includes/why.html

@@ -0,0 +1,44 @@
+<div id="why">
+  <div class="row">
+    <div class="span4">
+      <h4><i class="icon-flag"></i> One font, 249 icons</h4>
+      In a single collection, Font Awesome is a pictographic language of web-related actions.
+    </div>
+    <div class="span4">
+      <h4><i class="icon-pencil"></i> CSS control</h4>
+      Easily style icon color, size, shadow, and anything that's possible with CSS.
+    </div>
+    <div class="span4">
+      <h4><i class="icon-fullscreen"></i> Infinite scalability</h4>
+      Scalable vector graphics means every icon looks awesome at any size.
+    </div>
+  </div>
+  <div class="row">
+    <div class="span4">
+      <h4><i class="icon-beer"></i> Free, as in Beer</h4>
+      Font Awesome is completely free for commercial use. Check out the <a href="#license">license</a>.
+    </div>
+    <div class="span4">
+      <h4><i class="icon-ok"></i> IE7 Support</h4>
+      Font Awesome supports IE7. If you need it, you have my condolences.
+    </div>
+    <div class="span4">
+      <h4><i class="icon-eye-open"></i> Perfect on Retina Displays</h4>
+      Font Awesome icons are vectors, which mean they're gorgeous on high-resolution displays.
+    </div>
+  </div>
+  <div class="row">
+    <div class="span4">
+      <h4><i class="icon-thumbs-up"></i> Made for Bootstrap</h4>
+      Designed from scratch to be fully compatible with <a href="{{ site.bootstrap.url }}" target="_blank">Bootstrap {{ site.bootstrap.version }}</a>.
+    </div>
+    <div class="span4">
+      <h4><i class="icon-tint"></i> Designer Friendly</h4>
+      Install FontAwesome.otf and <a href="design.html" target="_blank">visit the copy & paste page</a>. Happy designing.
+    </div>
+    <div class="span4">
+      <h4><i class="icon-search"></i> Screen reader compatible</h4>
+      Font Awesome won't trip up screen readers, unlike other icon fonts.
+    </div>
+  </div>
+</div>

build/_layouts/base.html

@@ -0,0 +1,65 @@
+<!DOCTYPE html>
+<!--[if lt IE 7 ]><html class="ie ie6" lang="en"> <![endif]-->
+<!--[if IE 7 ]><html class="ie ie7" lang="en"> <![endif]-->
+<!--[if IE 8 ]><html class="ie ie8" lang="en"> <![endif]-->
+<!--[if (gte IE 9)|!(IE)]><!-->
+<html lang="en" xmlns="http://www.w3.org/1999/html"> <!--<![endif]-->
+<head>
+  <!-- Basic Page Needs
+ ================================================== -->
+  <meta charset="utf-8" />
+  <title>{% if page.title %}{{ page.title }}{% endif %}</title>
+  <meta name="description" content="Font Awesome, the iconic font designed for use with Bootstrap">
+  <meta name="author" content="Dave Gandy">
+  <!--<meta name="viewport" content="width=device-width; initial-scale=1; maximum-scale=1">-->
+
+  <!--[if lt IE 9]>
+  <script src="http://html5shim.googlecode.com/svn/trunk/html5.js"></script>
+  <![endif]-->
+
+  <!-- CSS
+ ================================================== -->
+
+  <link rel="stylesheet" href="{{ site.baseurl }}assets/css/site.css">
+  <link rel="stylesheet" href="{{ site.baseurl }}assets/css/prettify.css">
+  <link rel="stylesheet" href="{{ site.baseurl }}assets/css/font-awesome.css">
+  <!--[if IE 7]>
+  <link rel="stylesheet" href="{{ site.baseurl }}assets/css/font-awesome-ie7.css">
+  <![endif]-->
+  <!-- Le fav and touch icons -->
+  <link rel="shortcut icon" href="{{ site.baseurl }}assets/ico/favicon.ico">
+
+  <script type="text/javascript" src="//use.typekit.net/wnc7ioh.js"></script>
+  <script type="text/javascript">try{Typekit.load();}catch(e){}</script>
+
+  <script type="text/javascript">
+    var _gaq = _gaq || [];
+    _gaq.push(['_setAccount', 'UA-30136587-1']);
+    _gaq.push(['_trackPageview']);
+
+    (function() {
+      var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
+      ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
+      var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
+    })();
+  </script>
+</head>
+<body data-spy="scroll" data-target=".navbar">
+<div class="wrapper"> <!-- necessary for sticky footer. wrap all content except footer -->
+  {% include navbar.html %}
+
+  {{ content }}
+  <div class="push"><!-- necessary for sticky footer --></div>
+</div>
+{% include footer.html %}
+
+<script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
+<script src="{{ site.baseurl }}assets/js/jquery-1.7.1.min.js"></script>
+<script src="{{ site.baseurl }}assets/js/underscore.min.js"></script>
+<script src="{{ site.baseurl }}assets/js/backbone.min.js"></script>
+<script src="{{ site.baseurl }}assets/js/prettify.min.js"></script>
+<script src="{{ site.baseurl }}assets/js/bootstrap-222.min.js"></script>
+<script src="{{ site.baseurl }}assets/js/index/index.js"></script>
+
+</body>
+</html>

build/_layouts/icon.html

@@ -0,0 +1,39 @@
+---
+layout: base
+title_prefix: Font Awesome Icons
+---
+<div class="container">
+  <section>
+    <dl class="dl-horizontal">
+      <dt>Icon</dt>
+      <dd><i class="icon-{{ page.icon['id'] }}"></i></dd>
+
+      <dt>Icon Class</dt>
+      <dd>icon-{{ page.icon['id'] }}</dd>
+
+      <dt>Unicode</dt>
+      <dd>{{ page.icon['unicode'] }}</dd>
+
+      <dt>Created</dt>
+      <dd>v{{ page.icon['created'] }}</dd>
+
+    {% if page.icon['categories'] %}
+      <dt>Categories</dt>
+      <dd>
+      {% for category in page.icon['categories'] %}
+        {{ category }}<br>
+      {% endfor %}
+      </dd>
+    {% endif %}
+
+    {% if page.icon['aliases'] %}
+      <dt>Aliases</dt>
+      <dd>
+      {% for alias in page.icon['aliases'] %}
+        {{ alias }}<br>
+      {% endfor %}
+      </dd>
+    {% endif %}
+    </dl>
+  </section>
+</div>

build/_plugins/icon_page_generator.rb

@@ -0,0 +1,48 @@
+##
+# Create individual pages for each icon in the FontAwesome set
+
+require 'yaml'
+
+module Jekyll
+
+  class IconPage < Page
+
+    ##
+    # Take a single icon and render a page for it.
+
+    def initialize(site, base, dir, icon)
+      @site = site
+      @base = base
+      @dir = dir
+      @name = "#{icon['id']}/index.html"
+      @icon = icon
+
+      self.process(@name)
+
+      self.read_yaml(File.join(base, site.config['layouts']), site.config['icon_layout'])
+
+      self.data['icon'] = icon
+      self.data['title'] = self.data['title_prefix'] + " &mdash; #{icon['name']}"
+    end
+
+  end
+
+  class IconGenerator < Generator
+
+    ##
+    # Iterate over every described icon in a YAML file and create a page for it
+
+    safe true
+
+    def generate(site)
+      icon_meta_filename = site.config['icon_meta']
+      icon_meta = YAML.load_file(icon_meta_filename)
+
+      icon_meta['icons'].each do |icon|
+        site.pages << IconPage.new(site, site.source, site.config['icon_destination'], icon)
+      end
+    end
+
+  end
+
+end

docs/assets/css/font-awesome.css → build/assets/css/font-awesome.css

@@ -1128,3 +1128,9 @@ ul.icons li [class*=" icon-"] {
 .icon-calendar-empty:before {
   content: "\f133";
 }
+.icon-fire-extinguisher:before {
+  content: "\f134";
+}
+.icon-rocket:before {
+  content: "\f135";
+}

docs/assets/css/site.css → build/assets/css/site.css

@@ -5253,14 +5253,30 @@ a.badge:focus {
 .affix {
   position: fixed;
 }
-.text-align-right {
-  text-align: right;
+html,
+body {
+  height: 100%;
 }
-.text-align-center {
-  text-align: center;
+.wrapper {
+  min-height: 100%;
+  height: auto !important;
+  height: 100%;
+}
+.footer {
+  min-width: 990px;
+}
+.wrapper {
+  margin: 0 auto -191px;
+}
+.push {
+  height: 191px;
+}
+.footer {
+  margin-top: 40px;
+  height: 90px;
+  padding: 30px 0 30px;
 }
 .navbar .brand {
-  color: #ffffff;
   font-family: museo-slab, "Helvetica Neue", Helvetica, Arial, sans-serif;
 }
 .navbar .brand .icon-flag {
@@ -5302,7 +5318,7 @@ h6 {
 .jumbotron {
   background: #9d261d;
   border-bottom: 1px solid #721c15;
-  padding: 90px 0 48px;
+  padding: 48px 0;
   text-shadow: 2px 2px 2px #333333;
 }
 .jumbotron,
@@ -5316,10 +5332,13 @@ h6 {
 }
 .jumbotron p {
   margin-top: 15px;
-  margin-bottom: 30px;
+  margin-bottom: 15px;
   font-size: 30px;
   line-height: 1.3;
 }
+.jumbotron .actions {
+  margin-top: 30px;
+}
 .jumbotron ul {
   margin-left: 50px;
 }
@@ -5349,6 +5368,15 @@ h6 {
   color: #ce938e;
   text-shadow: none;
 }
+.jumbotron-ad {
+  padding: 20px 0;
+}
+.jumbotron-ad h1 {
+  margin-top: 25px;
+}
+.jumbotron-ad p {
+  margin-bottom: 35px;
+}
 .btn-github {
   color: #ffffff;
   text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
@@ -5395,12 +5423,15 @@ section {
   padding-top: 40px;
 }
 #social-buttons {
-  padding: 22px 0;
+  padding: 22px 0 17px;
   text-align: center;
   background-color: #f5f5f5;
   border-top: 1px solid #fff;
   border-bottom: 1px solid #ddd;
 }
+#social-buttons ul.unstyled {
+  margin: 0;
+}
 #social-buttons .btn {
   font-weight: bold;
   padding: 0px 5px;
@@ -5414,11 +5445,16 @@ section {
 #social-buttons .fork {
   margin-right: 30px;
 }
+.carbonad-horizontal {
+  width: 310px;
+  margin: 20px auto 10px;
+}
 .the-icons {
   list-style-type: none;
   margin: 0;
 }
-.the-icons li {
+.the-icons li a {
+  display: block;
   cursor: pointer;
   line-height: 32px;
   height: 32px;
@@ -5427,21 +5463,26 @@ section {
   -moz-border-radius: 6px;
   border-radius: 6px;
 }
-.the-icons li [class^="icon-"],
-.the-icons li [class*=" icon-"] {
+.the-icons li a,
+.the-icons li a:hover {
+  color: #222222;
+}
+.the-icons li a [class^="icon-"],
+.the-icons li a [class*=" icon-"] {
   width: 32px;
   font-size: 14px;
 }
-.the-icons li:hover {
+.the-icons li a:hover {
+  text-decoration: none;
   background-color: #fbf4f4;
 }
-.the-icons li:hover [class^="icon-"],
-.the-icons li:hover [class*=" icon-"] {
+.the-icons li a:hover [class^="icon-"],
+.the-icons li a:hover [class*=" icon-"] {
   *font-size: 28px;
   *vertical-align: middle;
 }
-.the-icons li:hover [class^="icon-"]:before,
-.the-icons li:hover [class*=" icon-"]:before {
+.the-icons li a:hover [class^="icon-"]:before,
+.the-icons li a:hover [class*=" icon-"]:before {
   font-size: 28px;
   vertical-align: -5px;
 }
@@ -5659,3 +5700,6 @@ footer a:hover {
 footer ul {
   line-height: 25px;
 }
+footer .project {
+  margin-top: 10px;
+}

build/assets/js/index/index.js

@@ -0,0 +1,27 @@
+$(function() {
+  // start the icon carousel
+  $('#iconCarousel').carousel({
+    interval: 5000
+  });
+
+  // make code pretty
+  window.prettyPrint && prettyPrint();
+
+  // inject twitter & github counts
+  $.ajax({
+    url: 'http://api.twitter.com/1/users/show.json',
+    data: {screen_name: 'fortaweso_me'},
+    dataType: 'jsonp',
+    success: function(data) {
+      $('#followers').html(data.followers_count);
+    }
+  });
+  $.ajax({
+    url: 'https://api.github.com/repos/fortawesome/Font-Awesome',
+    dataType: 'jsonp',
+    success: function(data) {
+      $('#watchers').html(data.data.watchers);
+      $('#forks').html(data.data.forks);
+    }
+  });
+});

docs/assets/less/font-awesome.less → build/assets/less/font-awesome.less

@@ -570,3 +570,5 @@ ul.icons {
 .icon-microphone-off:before       { content: "\f131"; }
 .icon-shield:before               { content: "\f132"; }
 .icon-calendar-empty:before       { content: "\f133"; }
+.icon-fire-extinguisher:before    { content: "\f134"; }
+.icon-rocket:before               { content: "\f135"; }

docs/assets/less/mixins.less → build/assets/less/mixins.less

@@ -40,4 +40,19 @@
   line-height: @size * 1.1;
   height: @size * @height-multiplier * 1.05;
   text-align: center;
-}
+}
+
+.sticky-footer (@footer-height: @baseLineHeight * 4, @footer-padding-top: 70px, @footer-padding-bottom: 70px, @footer-margin-top: 70px) {
+  .wrapper {
+    margin: 0 auto -(@footer-height + @footer-padding-bottom + @footer-padding-top + @footer-margin-top + 1);
+  }
+  .push {
+    height: @footer-height + @footer-padding-bottom + @footer-padding-top + @footer-margin-top + 1;
+  }
+
+  .footer {
+    margin-top: @footer-margin-top;
+    height: @footer-height;
+    padding: @footer-padding-top 0 @footer-padding-bottom;
+  }
+}

docs/assets/less/site.less → build/assets/less/site.less

@@ -1,14 +1,12 @@
 @import "twbs-2.3.1/bootstrap.less";
+@import "sticky-footer.less";
 
 @import "mixins.less";
 @import "variables.less";
 
-.text-align-right  { text-align: right; }
-.text-align-center { text-align: center; }
-
 .navbar .brand {
 //  padding: 11px 20px 9px;
-  color: @white;
+//  color: @white;
   font-family: @serifFontFamily;
   .icon-flag { padding-right: 3px; }
 }
@@ -39,21 +37,10 @@ h1, h2, h3, h4, h5, h6 { font-family: @serifFontFamily; }
   }
 }
 
-
-//a[href^='http://'] {
-//  &:after {
-//    font-family: FontAwesome;
-//    content: "\0020 \f08e";
-//    &:hover {
-//      text-decoration: none;
-//    }
-//  }
-//}
-
 .jumbotron {
   background: @red;
   border-bottom: 1px solid @redDark;
-  padding: 90px 0 48px;
+  padding: 48px 0;
 //  #gradient > .radial( lighten(@red, 10%), @red);
 //  background-color: @red;
   &, h1 { color: @white; }
@@ -77,10 +64,11 @@ h1, h2, h3, h4, h5, h6 { font-family: @serifFontFamily; }
   }
   p {
     margin-top: 15px;
-    margin-bottom: 30px;
+    margin-bottom: 15px;
     font-size: 30px;
     line-height: 1.3;
   }
+  .actions { margin-top: 30px;}
   text-shadow: 2px 2px 2px @grayDark;
   ul {
     margin-left: 50px;
@@ -127,6 +115,12 @@ h1, h2, h3, h4, h5, h6 { font-family: @serifFontFamily; }
   }
 }
 
+.jumbotron-ad {
+  padding: 20px 0;
+  h1 { margin-top: 25px; }
+  p { margin-bottom: 35px; }
+}
+
 .btn-github {
   .buttonBackground(@white, mix(@grayLighter, @grayLight, 50%));
 }
@@ -145,7 +139,9 @@ section {
 }
 
 #social-buttons {
-  padding: 22px 0;
+  ul.unstyled { margin: 0; }
+
+  padding: 22px 0 17px;
   text-align: center;
   background-color: #f5f5f5;
   border-top: 1px solid #fff;
@@ -166,39 +162,49 @@ section {
   }
 }
 
+.carbonad-horizontal {
+  width: 310px;
+  margin: 20px auto 10px;
+}
+
 .the-icons {
   list-style-type: none;
   margin: 0;
   li {
-    cursor: pointer;
-    line-height: 32px;
-    height: 32px;
-    padding-left: 12px;
-    .border-radius(6px);
-//    vertical-align: middle;
-
-    [class^="icon-"],
-    [class*=" icon-"] {
-      width: 32px;
-      font-size: 14px;
-    }
-    &:hover {
-      background-color: lighten(@errorBackground, 6%);
-      [class^="icon-"], [class*=" icon-"] {
-        *font-size: 28px;
-        *vertical-align: middle;
+    a {
+      display: block;
+      &, &:hover { color: @grayDarker; }
+
+      cursor: pointer;
+      line-height: 32px;
+      height: 32px;
+      padding-left: 12px;
+      .border-radius(6px);
+
+      [class^="icon-"],
+      [class*=" icon-"] {
+        width: 32px;
+        font-size: 14px;
       }
 
-      [class^="icon-"]:before,
-      [class*=" icon-"]:before {
-        font-size: 28px;
-        vertical-align: -5px;
+      &:hover {
+        text-decoration: none;
+        background-color: lighten(@errorBackground, 6%);
+        [class^="icon-"], [class*=" icon-"] {
+          *font-size: 28px;
+          *vertical-align: middle;
+        }
+
+        [class^="icon-"]:before,
+        [class*=" icon-"]:before {
+          font-size: 28px;
+          vertical-align: -5px;
+        }
       }
     }
   }
 }
 
-
 #why, #whats-new {
   .row {
     margin-bottom: 20px;
@@ -370,4 +376,6 @@ footer {
 //    margin-left: 30px;
     line-height: 25px;
   }
+
+  .project { margin-top: 10px; }
 }

build/assets/less/sticky-footer.less

@@ -0,0 +1,27 @@
+//
+// Sticky Footer
+// --------------------------------------------------
+// make sure to set .sticky-footer()
+
+html, body {
+  height: 100%;
+}
+.wrapper {
+  min-height: 100%;
+  height: auto !important;
+  height: 100%;
+}
+
+.footer {
+  min-width: 990px; // necessary fix for non-responsive layouts
+//  border-top: 1px solid @grayLighter;
+//  background-color: #f5f5f5;
+
+//  color: #777;
+
+//  p {
+//    margin-bottom: 0;
+//  }
+}
+
+.sticky-footer(90px, 30px, 30px, 40px); // sets default values for sticky footer