diff --git a/index3.html b/index3.html
index 5b58998b1..d9ff2f334 100644
--- a/index3.html
+++ b/index3.html
@@ -187,19 +187,19 @@ to get the desired effect
             <ul class="nav nav-treeview">
               <li class="nav-item">
                 <a href="./index.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Dashboard v1</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="./index2.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Dashboard v2</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="./index3.html" class="nav-link active">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Dashboard v3</p>
                 </a>
               </li>
@@ -255,19 +255,19 @@ to get the desired effect
             <ul class="nav nav-treeview">
               <li class="nav-item">
                 <a href="pages/charts/chartjs.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>ChartJS</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/charts/flot.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Flot</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/charts/inline.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Inline</p>
                 </a>
               </li>
@@ -284,31 +284,31 @@ to get the desired effect
             <ul class="nav nav-treeview">
               <li class="nav-item">
                 <a href="pages/UI/general.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>General</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/UI/icons.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Icons</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/UI/buttons.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Buttons</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/UI/sliders.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Sliders</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/UI/modals.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Modals</p>
                 </a>
               </li>
@@ -325,19 +325,19 @@ to get the desired effect
             <ul class="nav nav-treeview">
               <li class="nav-item">
                 <a href="pages/forms/general.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>General Elements</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/forms/advanced.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Advanced Elements</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/forms/editors.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Editors</p>
                 </a>
               </li>
@@ -354,13 +354,13 @@ to get the desired effect
             <ul class="nav nav-treeview">
               <li class="nav-item">
                 <a href="pages/tables/simple.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Simple Tables</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/tables/data.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Data Tables</p>
                 </a>
               </li>
@@ -387,19 +387,19 @@ to get the desired effect
             <ul class="nav nav-treeview">
               <li class="nav-item">
                 <a href="pages/mailbox/mailbox.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Inbox</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/mailbox/compose.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Compose</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/mailbox/read-mail.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Read</p>
                 </a>
               </li>
@@ -416,31 +416,31 @@ to get the desired effect
             <ul class="nav nav-treeview">
               <li class="nav-item">
                 <a href="pages/examples/invoice.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Invoice</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/examples/profile.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Profile</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/examples/login.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Login</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/examples/register.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Register</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/examples/lockscreen.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Lockscreen</p>
                 </a>
               </li>
@@ -457,25 +457,25 @@ to get the desired effect
             <ul class="nav nav-treeview">
               <li class="nav-item">
                 <a href="pages/examples/404.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Error 404</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/examples/500.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Error 500</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="pages/examples/blank.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Blank Page</p>
                 </a>
               </li>
               <li class="nav-item">
                 <a href="starter.html" class="nav-link">
-                  <i class="fas fa-circle-o nav-icon"></i>
+                  <i class="far fa-circle nav-icon"></i>
                   <p>Starter Page</p>
                 </a>
               </li>
@@ -491,19 +491,19 @@ to get the desired effect
           <li class="nav-header">LABELS</li>
           <li class="nav-item">
             <a href="#" class="nav-link">
-              <i class="nav-icon fas fa-circle-o text-danger"></i>
+              <i class="nav-icon far fa-circle text-danger"></i>
               <p class="text">Important</p>
             </a>
           </li>
           <li class="nav-item">
             <a href="#" class="nav-link">
-              <i class="nav-icon fas fa-circle-o text-warning"></i>
+              <i class="nav-icon far fa-circle text-warning"></i>
               <p>Warning</p>
             </a>
           </li>
           <li class="nav-item">
             <a href="#" class="nav-link">
-              <i class="nav-icon fas fa-circle-o text-info"></i>
+              <i class="nav-icon far fa-circle text-info"></i>
               <p>Informational</p>
             </a>
           </li>