title: Why are my font awesome icons disappearing on page loading?
body: <p>Any idea why my font-awesome icons would display initially on the page and then turn into blank squares once the page is actually loaded? Here's my gemfile:</p>
  
  <pre><code> gem 'rails', '4.0.1'
   gem 'bootstrap-sass', '2.3.2.0'
   gem 'bcrypt-ruby', '3.1.2'
   gem 'faker', '1.1.2'
   gem 'will_paginate', '3.0.4'
   gem 'bootstrap-will_paginate', '0.0.9'
   gem "libv8", "&gt;= 3.11.8"
   gem "therubyracer", "&gt;= 0.11.0", :group =&gt; :assets, :platform =&gt; :ruby, :requir\
   e =&gt; "v8"
   gem 'execjs'
   gem 'rails_12factor', group: :production
   gem 'font-awesome-rails'
   gem 'font-awesome-sass'
  </code></pre>
  
  <p>My application.css file:</p>
  
  <pre><code>  *= require_self
    *= require_tree .
    *= require font-awesome
    */
  
   @import 'twitter/bootstrap';
   @import 'font-awesome/font-awesome';
  </code></pre>
  
  <p>Here's how I'm calling the icons:</p>
  
  <pre><code>&lt;section id="our-services" class="pad-top-50"&gt;
                       &lt;div class="container"&gt;
                      &lt;div class="row"&gt;
                          &lt;div class="col-xs-12 col-sm-4"&gt;
                              &lt;div class="service"&gt;
                                  &lt;span class="service-icon"&gt;
                                  &lt;i class="fa fa-android"&gt;&lt;/i&gt;
                                  &lt;/span&gt;
  </code></pre>