title: Second Font Awesome icon displaying on hover
body: <p>In my navbar dropdown, when I hover over the links, the icons (icon-group, icon-plus) also have another icon (icon-filter) show up. This only happens on the bootstrap down down menu. I can't find any reference in the source file to the "icon-filter" class being applied.</p>
  
  <p>You can view the incorrect icons in the dropdown at the link below.<br>
  <a href="http://agile-ocean-8233.herokuapp.com/" rel="nofollow">http://agile-ocean-8233.herokuapp.com/</a></p>
  
  <p>Gemfile:</p>
  
  <pre><code>source 'https://rubygems.org'
  gem 'rails', '3.2.9'
  gem 'sqlite3', :group =&gt; :development
  gem 'pg', :group =&gt; :production
  group :assets do
    gem 'sass-rails',   '~&gt; 3.2.3'
    gem 'coffee-rails', '~&gt; 3.2.1'
    gem 'uglifier', '&gt;= 1.0.3'
    gem 'font-awesome-rails'
  end
  gem 'jquery-rails'
  gem "rspec-rails", "&gt;= 2.11.4", :group =&gt; [:development, :test]
  gem "email_spec", "&gt;= 1.2.1", :group =&gt; :test
  gem "cucumber-rails", "&gt;= 1.3.0", :group =&gt; :test, :require =&gt; false
  gem "database_cleaner", "&gt;= 0.9.1", :group =&gt; :test
  gem "launchy", "&gt;= 2.1.2", :group =&gt; :test
  gem "capybara", "&gt;= 1.1.2", :group =&gt; :test
  gem "factory_girl_rails", "&gt;= 4.1.0", :group =&gt; [:development, :test]
  gem "bootstrap-sass", "&gt;= 2.1.0.1"
  gem "devise", "&gt;= 2.1.2"
  gem "cancan", "&gt;= 1.6.8"
  gem "rolify", "&gt;= 3.2.0"
  gem "simple_form", "&gt;= 2.0.4"
  gem "stripe", "&gt;= 1.7.4"
  gem "stripe_event", "&gt;= 0.4.0"
  gem "quiet_assets", "&gt;= 1.0.1", :group =&gt; :development
  gem "letter_opener", :group =&gt; :development
  gem 'will_paginate', '~&gt; 3.0'
  gem 'will_paginate-bootstrap'
  gem 'turbolinks'
  gem 'thin'
  gem 'jquery-turbolinks'
  </code></pre>
  
  <p>Application.css.scss</p>
  
  <pre><code> *= require_self
   *= require 'font-awesome'
   *= require_tree .
  */
  .content {
    background-color: #eee;
    padding: 20px;
    margin: 0 -20px; /* negative indent the amount of the padding to maintain the grid system */
    -webkit-border-radius: 0 0 6px 6px;
    -moz-border-radius: 0 0 6px 6px;
    border-radius: 0 0 6px 6px;
    -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.15);
    -moz-box-shadow: 0 1px 2px rgba(0,0,0,.15);
    box-shadow: 0 1px 2px rgba(0,0,0,.15);
  }
  [class^="icon-"], [class*=" icon-"] {
    background-image: none;
  }
  </code></pre>
  
  <p>Navigation dropdown</p>
  
  <pre><code>&lt;li class="dropdown" id="client_menu"&gt;
    &lt;a class="dropdown-toggle" data-toggle="dropdown" href='#'&gt;
      Clients &lt;b class="caret"&gt;&lt;/b&gt; 
    &lt;/a&gt;
    &lt;ul class="dropdown-menu"&gt;
      &lt;li&gt;&lt;%= link_to 'Clients &lt;i class="icon-group"&gt;&lt;/i&gt;'.html_safe, clients_path %&gt;&lt;/li&gt;
      &lt;li&gt;&lt;%= link_to 'New Client &lt;i class="icon-plus"&gt;&lt;/i&gt;'.html_safe, new_client_path %&gt;&lt;/li&gt;
    &lt;/ul&gt;
  &lt;/li&gt; 
  </code></pre>
  
  <p>Bootstrap_and_overrides.css.scss</p>
  
  <pre><code>@import "bootstrap";
  @import 'font-awesome';
  body { padding-top: 60px; }
  @import "bootstrap-responsive";
  </code></pre>