Icons not working in FF?

src/js/components/Icon.js

@@ -22,7 +22,7 @@ export default class Icon extends React.Component{
 
 		switch (this.props.type){
 			case 'fontawesome':	
-				return <FontAwesome type="fontawesome" name={this.props.name} onClick={e => this.handleClick(e)} />;
+				return <FontAwesome className="icon" type="fontawesome" name={this.props.name} onClick={e => this.handleClick(e)} />;
 
 			default:
 				className += ' material-icon';		

src/js/components/Services.js

@@ -306,7 +306,7 @@ class Services extends React.Component{
 				</div>
 				<div className="menu-item-wrapper">
 					<Link className={"menu-item"+(this.props.active == 'icecast' ? ' active' : '')} to={this.props.active == 'icecast' ? global.baseURL+'settings' : global.baseURL+'settings/service/icecast'}>
-						<Icon type="fontawesome" name="rss" />
+						<Icon name="rss_feed" />
 						<div className="title">
 							Icecast
 						</div>

src/scss/components/_services.scss

@@ -63,7 +63,7 @@
 					display: inline-block;
 				}
 
-				.fa {
+				.icon {
 					font-size: 40px;
 					height: 40px;
 					margin-top: 10px;