title: How to change the color of icon font using CSS
body: <p>I am using a theme from ThemeForest that is utilizing icon fonts. In the css files I see a @font-face to import the fonts and a list of all the icons as such:</p>
  
  <pre><code>.socials li.social-lastfm a:before,
  .socials li.social-soundcloud a:before {
     font-family: 'icomoon-essential';
     speak: none;
     font-style: normal;
     font-weight: normal;
     line-height: 1;
     color: green;
     -webkit-font-smoothing: antialiased;
  }
  </code></pre>
  
  <p>In this example there are several more icons, however of all the icons that I have on the theme only one of them turns green. I have added new rules to this css including .socials li.social-twitter a:before etc..</p>
  
  <p>Even with the addition of rules, the color of the icons are not changing. As I am using WordPress, I went into the backend in order to determine if I could change the icons through some sort of plugin. To my demise, I cannot find a solution.</p>
  
  <p>If you know of a way that I could fix the problem please let me know. </p>