diff --git a/demo/partials/getting_started.html b/demo/partials/getting_started.html
index 20e0c1a..8459f98 100644
--- a/demo/partials/getting_started.html
+++ b/demo/partials/getting_started.html
@@ -17,15 +17,15 @@
 			</li>
 		</ul>
 	</p>
-	<h4>With <a href="http://bower.io">Bower</a></h4>
+	<h4>With <a href="https://www.npmjs.com/">NPM</a></h4>
 	<div class="highlight">
-<pre><code class="bash"><span class="nv">$ </span>bower install font-awesome-animation</code></pre>
+<pre><code class="bash"><span class="nv">$ </span>npm install font-awesome-animation</code></pre>
 	</div>
 </section>
 <section>
 	<h3>Installation</h3>
     <p>
-        Include the JS and CSS file in your <code>index.html</code> file:
+        Include the CSS file in your <code>index.html</code> file:
         <br />
         <div class="highlight">
 <pre><code class="html"><span class="nt">&lt;link</span> <span class="na">rel=</span><span class="s">"stylesheet"</span> <span class="na">href=</span><span class="s">"font-awesome-animation.min.css"</span><span class="nt">&gt;</span>
diff --git a/demo/partials/usage.html b/demo/partials/usage.html
index 29e72e9..ffa76a1 100644
--- a/demo/partials/usage.html
+++ b/demo/partials/usage.html
@@ -29,19 +29,19 @@
     <div class="col-md-12">
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-wrench faa-wrench animated"></i>
+                <i class="fas fa-wrench faa-wrench animated"></i>
                 &nbsp;faa-wrench animated
             </a>
         </div>
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-wrench faa-wrench animated-hover"></i>
+                <i class="fas fa-wrench faa-wrench animated-hover"></i>
                 &nbsp;faa-wrench animated-hover
             </a>
         </div>
         <div class="col-md-4">
             <a href="#" class="faa-parent animated-hover">
-                <i class="fa fa-wrench faa-wrench"></i>
+                <i class="fas fa-wrench faa-wrench"></i>
                 &nbsp;faa-wrench
             </a>
         </div>
@@ -49,19 +49,19 @@
     <div class="col-md-12">
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-bell faa-ring animated"></i>
+                <i class="fas fa-bell faa-ring animated"></i>
                 &nbsp;faa-ring animated
             </a>
         </div>
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-bell faa-ring animated-hover"></i>
+                <i class="fas fa-bell faa-ring animated-hover"></i>
                 &nbsp;faa-ring animated-hover
             </a>
         </div>
         <div class="col-md-4">
             <a href="#" class="faa-parent animated-hover">
-                <i class="fa fa-bell faa-ring"></i>
+                <i class="fas fa-bell faa-ring"></i>
                 &nbsp;faa-ring
             </a>
         </div>
@@ -69,19 +69,19 @@
     <div class="col-md-12">
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-envelope faa-horizontal animated"></i>
+                <i class="fas fa-envelope faa-horizontal animated"></i>
                 &nbsp;faa-horizontal animated
             </a>
         </div>
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-envelope faa-horizontal animated-hover"></i>
+                <i class="fas fa-envelope faa-horizontal animated-hover"></i>
                 &nbsp;faa-horizontal animated-hover
             </a>
         </div>
         <div class="col-md-4">
             <a href="#" class="faa-parent animated-hover">
-                <i class="fa fa-envelope faa-horizontal"></i>
+                <i class="fas fa-envelope faa-horizontal"></i>
                 &nbsp;faa-horizontal
             </a>
         </div>
@@ -89,19 +89,19 @@
     <div class="col-md-12">
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-thumbs-o-up faa-vertical animated"></i>
+                <i class="fas fa-thumbs-up faa-vertical animated"></i>
                 &nbsp;faa-vertical animated
             </a>
         </div>
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-thumbs-o-up faa-vertical animated-hover"></i>
+                <i class="fas fa-thumbs-up faa-vertical animated-hover"></i>
                 &nbsp;faa-vertical animated-hover
             </a>
         </div>
         <div class="col-md-4">
             <a href="#" class="faa-parent animated-hover">
-                <i class="fa fa-thumbs-o-up faa-vertical"></i>
+                <i class="fas fa-thumbs-up faa-vertical"></i>
                 &nbsp;faa-vertical
             </a>
         </div>
@@ -109,19 +109,19 @@
     <div class="col-md-12">
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-warning faa-flash animated"></i>
+                <i class="fas fa-exclamation-triangle faa-flash animated"></i>
                 &nbsp;faa-flash animated
             </a>
         </div>
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-warning faa-flash animated-hover"></i>
+                <i class="fas fa-exclamation-triangle faa-flash animated-hover"></i>
                 &nbsp;faa-flash animated-hover
             </a>
         </div>
         <div class="col-md-4">
             <a href="#" class="faa-parent animated-hover">
-                <i class="fa fa-warning faa-flash"></i>
+                <i class="fas fa-exclamation-triangle faa-flash"></i>
                 &nbsp;faa-flash
             </a>
         </div>
@@ -129,19 +129,19 @@
     <div class="col-md-12">
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-thumbs-o-up faa-bounce animated"></i>
+                <i class="fas fa-thumbs-up faa-bounce animated"></i>
                 &nbsp;faa-bounce animated
             </a>
         </div>
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-thumbs-o-up faa-bounce animated-hover"></i>
+                <i class="fas fa-thumbs-up faa-bounce animated-hover"></i>
                 &nbsp;faa-bounce animated-hover
             </a>
         </div>
         <div class="col-md-4">
             <a href="#" class="faa-parent animated-hover">
-                <i class="fa fa-thumbs-o-up faa-bounce"></i>
+                <i class="fas fa-thumbs-up faa-bounce"></i>
                 &nbsp;faa-bounce
             </a>
         </div>
@@ -149,19 +149,19 @@
     <div class="col-md-12">
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-spinner faa-spin animated"></i>
+                <i class="fas fa-spinner faa-spin animated"></i>
                 &nbsp;faa-spin animated
             </a>
         </div>
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-spinner faa-spin animated-hover"></i>
+                <i class="fas fa-spinner faa-spin animated-hover"></i>
                 &nbsp;faa-spin animated-hover
             </a>
         </div>
         <div class="col-md-4">
             <a href="#" class="faa-parent animated-hover">
-                <i class="fa fa-spinner faa-spin"></i>
+                <i class="fas fa-spinner faa-spin"></i>
                 &nbsp;faa-spin
             </a>
         </div>
@@ -169,19 +169,19 @@
     <div class="col-md-12">
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-plane faa-float animated"></i>
+                <i class="fas fa-plane faa-float animated"></i>
                 &nbsp;faa-float animated
             </a>
         </div>
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-plane faa-float animated-hover"></i>
+                <i class="fas fa-plane faa-float animated-hover"></i>
                 &nbsp;faa-float animated-hover
             </a>
         </div>
         <div class="col-md-4">
             <a href="#" class="faa-parent animated-hover">
-                <i class="fa fa-plane faa-float"></i>
+                <i class="fas fa-plane faa-float"></i>
                 &nbsp;faa-float
             </a>
         </div>
@@ -189,19 +189,19 @@
     <div class="col-md-12">
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-heart faa-pulse animated"></i>
+                <i class="fas fa-heart faa-pulse animated"></i>
                 &nbsp;faa-pulse animated
             </a>
         </div>
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-heart faa-pulse animated-hover"></i>
+                <i class="fas fa-heart faa-pulse animated-hover"></i>
                 &nbsp;faa-pulse animated-hover
             </a>
         </div>
         <div class="col-md-4">
             <a href="#" class="faa-parent animated-hover">
-                <i class="fa fa-heart faa-pulse"></i>
+                <i class="fas fa-heart faa-pulse"></i>
                 &nbsp;faa-pulse
             </a>
         </div>
@@ -209,19 +209,19 @@
     <div class="col-md-12">
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-envelope faa-shake animated"></i>
+                <i class="fas fa-envelope faa-shake animated"></i>
                 &nbsp;faa-shake animated
             </a>
         </div>
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-envelope faa-shake animated-hover"></i>
+                <i class="fas fa-envelope faa-shake animated-hover"></i>
                 &nbsp;faa-shake animated-hover
             </a>
         </div>
         <div class="col-md-4">
             <a href="#" class="faa-parent animated-hover">
-                <i class="fa fa-envelope faa-shake"></i>
+                <i class="fas fa-envelope faa-shake"></i>
                 &nbsp;faa-shake
             </a>
         </div>
@@ -229,19 +229,19 @@
     <div class="col-md-12">
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-trophy faa-tada animated"></i>
+                <i class="fas fa-trophy faa-tada animated"></i>
                 &nbsp;faa-tada animated
             </a>
         </div>
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-trophy faa-tada animated-hover"></i>
+                <i class="fas fa-trophy faa-tada animated-hover"></i>
                 &nbsp;faa-tada animated-hover
             </a>
         </div>
         <div class="col-md-4">
             <a href="#" class="faa-parent animated-hover">
-                <i class="fa fa-trophy faa-tada"></i>
+                <i class="fas fa-trophy faa-tada"></i>
                 &nbsp;faa-tada
             </a>
         </div>
@@ -249,19 +249,19 @@
     <div class="col-md-12">
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-space-shuttle faa-passing animated"></i>
+                <i class="fas fa-space-shuttle faa-passing animated"></i>
                 &nbsp;faa-passing animated
             </a>
         </div>
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-space-shuttle faa-passing animated-hover"></i>
+                <i class="fas fa-space-shuttle faa-passing animated-hover"></i>
                 &nbsp;faa-passing animated-hover
             </a>
         </div>
         <div class="col-md-4">
             <a href="#" class="faa-parent animated-hover">
-                <i class="fa fa-space-shuttle faa-passing"></i>
+                <i class="fas fa-space-shuttle faa-passing"></i>
                 &nbsp;faa-passing
             </a>
         </div>
@@ -269,19 +269,19 @@
     <div class="col-md-12">
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-space-shuttle faa-passing-reverse animated"></i>
+                <i class="fas fa-space-shuttle faa-passing-reverse animated"></i>
                 &nbsp;faa-passing-reverse animated
             </a>
         </div>
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-space-shuttle faa-passing-reverse animated-hover"></i>
+                <i class="fas fa-space-shuttle faa-passing-reverse animated-hover"></i>
                 &nbsp;faa-passing-reverse animated-hover
             </a>
         </div>
         <div class="col-md-4">
             <a href="#" class="faa-parent animated-hover">
-                <i class="fa fa-space-shuttle faa-passing-reverse"></i>
+                <i class="fas fa-space-shuttle faa-passing-reverse"></i>
                 &nbsp;faa-passing-reverse
             </a>
         </div>
@@ -289,19 +289,19 @@
     <div class="col-md-12">
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-circle-o faa-burst animated"></i>
+                <i class="fas fa-circle faa-burst animated"></i>
                 &nbsp;faa-burst animated
             </a>
         </div>
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-circle-o faa-burst animated-hover"></i>
+                <i class="fas fa-circle faa-burst animated-hover"></i>
                 &nbsp;faa-burst animated-hover
             </a>
         </div>
         <div class="col-md-4">
             <a href="#" class="faa-parent animated-hover">
-                <i class="fa fa-circle-o faa-burst"></i>
+                <i class="fas fa-circle faa-burst"></i>
                 &nbsp;faa-burst
             </a>
         </div>
@@ -309,19 +309,19 @@
     <div class="col-md-12">
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-star-o faa-falling animated"></i>
+                <i class="fas fa-star faa-falling animated"></i>
                 &nbsp;faa-falling animated
             </a>
         </div>
         <div class="col-md-4">
             <a href="#">
-                <i class="fa fa-star-o faa-falling animated-hover"></i>
+                <i class="fas fa-star faa-falling animated-hover"></i>
                 &nbsp;faa-falling animated-hover
             </a>
         </div>
         <div class="col-md-4">
             <a href="#" class="faa-parent animated-hover">
-                <i class="fa fa-star-o faa-falling"></i>
+                <i class="fas fa-star faa-falling"></i>
                 &nbsp;faa-falling
             </a>
         </div>
diff --git a/index.html b/index.html
index 430fa9a..af967b6 100644
--- a/index.html
+++ b/index.html
@@ -10,13 +10,13 @@
 	<meta name="description" content="">
 	<meta name="viewport" content="width=device-width">
 	<link rel="icon" type="image/png" href="favicon.png">
-	
+
 	<link href='http://fonts.googleapis.com/css?family=Gilda+Display' rel='stylesheet' type='text/css'>
-	<link rel="stylesheet" href="vendor/font-awesome/css/font-awesome.min.css">
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.10/css/all.css" integrity="sha384-+d0P83n9kaQMCwj8F4RJB66tzIwOKmrdb46+porD/OvrJ+37WqIM7UoBtwHO6Nlg" crossorigin="anonymous">
 	<link rel="stylesheet" href="vendor/bootstrap/dist/css/bootstrap.min.css">
 	<link rel="stylesheet" href="styles/main.css">
 	<link rel="stylesheet" href="styles/monokai.css">
-	<link rel="stylesheet" href="dist/font-awesome-animation.min.css">
+    <link rel="stylesheet" href="dist/font-awesome-animation.min.css">
 </head>
 <body ng-app="fontAwesomeAnimationDemoApp">
     <div class="github-ribbon">
@@ -30,12 +30,12 @@
             Simple animations using <a href="http://fortawesome.github.io/Font-Awesome/">FontAwesome</a> and some CSS3.
         </p>
 	</header>
-	
+
 	<div class="main-container">
     	<div class="container">
     		<article class="main-content">
     		    <header class="article-header">
-    			    <h1><i class="fa fa-gear faa-spin animated"></i>&nbsp;Getting started</h1>
+    			    <h1><i class="fas fa-cog faa-spin animated"></i>&nbsp;Getting started</h1>
     		    </header>
     			<section class="article-content" ng-include="'demo/partials/getting_started.html'"></section>
     		</article>
@@ -59,7 +59,7 @@
 	<script src="vendor/bootstrap/dist/js/bootstrap.min.js"></script>
 	<script src="vendor/angular-bootstrap/ui-bootstrap.min.js"></script>
 	<script src="vendor/angular-bootstrap/ui-bootstrap-tpls.min.js"></script>
-	
+
 	<script src="demo/app.js"></script>
 </body>
 </html>