updating to fonticons org navbar

3.2.1/community/index.html

@@ -256,7 +256,7 @@
   Found a way to solve a bug in Font Awesome? Want to contribute new features? Here are a few things to remember:
   <ol>
     <li>Please submit all pull requests against *-wip branches.</li>
-    <li>All pull requests submitted against master will be sumarily closed and this guide referenced.</li>
+    <li>All pull requests submitted against master will be summarily closed and this guide referenced.</li>
     <li>
       After doing everything above, feel free to
       <a href="https://github.com/FortAwesome/Font-Awesome/issues/new">submit a pull request</a>.

assets/css/site.css

@@ -6779,8 +6779,9 @@ button.close {
   font-weight: 300;
   font-size: 20px;
 }
-.navbar-brand .fa-flag {
+.navbar-brand .fas-flag-logo {
   padding-right: 3px;
+  vertical-align: baseline;
 }
 .navbar-nav > li > a {
   padding: 11px 10px 9px;
@@ -6811,6 +6812,116 @@ button.close {
 .navbar-nav.navbar-right:last-child {
   margin-right: -10px;
 }
+.navbar-org {
+  background-color: #1b926c;
+  border-color: #177e5d;
+  padding: 0;
+}
+.navbar-org .ficon-logo-flag,
+.navbar-org .ficon-log-fort {
+  vertical-align: baseline;
+}
+.navbar-org .navbar-text {
+  color: #a5d8c7;
+  margin-top: 12px;
+  margin-right: 30px;
+}
+.navbar-org .navbar-nav {
+  margin-right: -10px;
+}
+.navbar-org .navbar-nav > li + li {
+  margin-left: 15px;
+}
+.navbar-org .navbar-nav > li > a {
+  color: #c7e7dc;
+}
+.navbar-org .navbar-nav > li > a:hover,
+.navbar-org .navbar-nav > li > a:focus {
+  color: #ffffff;
+  background-color: transparent;
+  border-bottom: solid 2px #e8f5f1;
+}
+.navbar-org .navbar-nav > .active > a,
+.navbar-org .navbar-nav > .active > a:hover,
+.navbar-org .navbar-nav > .active > a:focus {
+  color: #c7e7dc;
+  background-color: transparent;
+  border-radius: 0;
+  border-bottom: solid 2px #b0ddce;
+}
+.navbar-org .navbar-nav > .disabled > a,
+.navbar-org .navbar-nav > .disabled > a:hover,
+.navbar-org .navbar-nav > .disabled > a:focus {
+  color: #444444;
+  background-color: transparent;
+}
+.navbar-org .navbar-toggle {
+  border-color: #c7e7dc;
+}
+.navbar-org .navbar-toggle:hover,
+.navbar-org .navbar-toggle:focus {
+  background-color: #ffffff;
+}
+.navbar-org .navbar-toggle .icon-bar {
+  background-color: #ffffff;
+}
+.navbar-org .navbar-collapse,
+.navbar-org .navbar-form {
+  border-color: #177f5e;
+}
+.navbar-org .navbar-nav > .open > a,
+.navbar-org .navbar-nav > .open > a:hover,
+.navbar-org .navbar-nav > .open > a:focus {
+  background-color: #1b926c;
+  color: #ffffff;
+}
+@media (max-width: 767px) {
+  .navbar-org .navbar-nav .open .dropdown-menu > .dropdown-header {
+    border-color: #1b926c;
+  }
+  .navbar-org .navbar-nav .open .dropdown-menu .divider {
+    background-color: #1b926c;
+  }
+  .navbar-org .navbar-nav .open .dropdown-menu > li > a {
+    color: #b0ddce;
+  }
+  .navbar-org .navbar-nav .open .dropdown-menu > li > a:hover,
+  .navbar-org .navbar-nav .open .dropdown-menu > li > a:focus {
+    color: #ffffff;
+    background-color: transparent;
+  }
+  .navbar-org .navbar-nav .open .dropdown-menu > .active > a,
+  .navbar-org .navbar-nav .open .dropdown-menu > .active > a:hover,
+  .navbar-org .navbar-nav .open .dropdown-menu > .active > a:focus {
+    color: #ffffff;
+    background-color: #1b926c;
+  }
+  .navbar-org .navbar-nav .open .dropdown-menu > .disabled > a,
+  .navbar-org .navbar-nav .open .dropdown-menu > .disabled > a:hover,
+  .navbar-org .navbar-nav .open .dropdown-menu > .disabled > a:focus {
+    color: #444444;
+    background-color: transparent;
+  }
+}
+.navbar-org .navbar-link {
+  color: #b0ddce;
+}
+.navbar-org .navbar-link:hover {
+  color: #ffffff;
+}
+.navbar-org .btn-link {
+  color: #b0ddce;
+}
+.navbar-org .btn-link:hover,
+.navbar-org .btn-link:focus {
+  color: #ffffff;
+}
+.navbar-org .btn-link[disabled]:hover,
+fieldset[disabled] .navbar-org .btn-link:hover,
+.navbar-org .btn-link[disabled]:focus,
+fieldset[disabled] .navbar-org .btn-link:focus {
+  color: #444444;
+}
 .btn {
   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
 }
@@ -6977,7 +7088,7 @@ label.error {
   margin-top: 5px;
   font-size: 220px;
   text-align: center;
-  line-height: 240px;
+  line-height: 250px;
   text-shadow: 0 2px 0 rgba(0, 0, 0, 0.15);
 }
 .carousel-control {
@@ -7397,11 +7508,15 @@ label.error {
 }
 .jumbotron,
 .navbar-inverse,
+.navbar-inverse .navbar-nav > li.active > a,
+.navbar-org,
 #footer {
   position: relative;
 }
 .jumbotron:after,
 .navbar-inverse:after,
+.navbar-inverse .navbar-nav > li.active > a:after,
+.navbar-org:after,
 #footer:after {
   content: '';
   display: block;
@@ -7416,6 +7531,8 @@ label.error {
 }
 .jumbotron .container,
 .navbar-inverse .container,
+.navbar-inverse .navbar-nav > li.active > a .container,
+.navbar-org .container,
 #footer .container {
   position: relative;
   z-index: 2;
@@ -7596,7 +7713,7 @@ div.bsap a.adhere:hover {
 @media (min-width: 1200px) {
   #icon-carousel {
     font-size: 240px;
-    line-height: 260px;
+    line-height: 275px;
     margin-top: 22px;
   }
   .carousel-control {
@@ -7657,7 +7774,7 @@ div.bsap a.adhere:hover {
 @media (min-width: 768px) and (max-width: 991px) {
   #icon-carousel {
     font-size: 200px;
-    line-height: 220px;
+    line-height: 230px;
   }
   .carousel-control {
     top: 210px;
@@ -7704,7 +7821,7 @@ div.bsap a.adhere:hover {
 @media (max-width: 767px) {
   #icon-carousel {
     font-size: 180px;
-    line-height: 200px;
+    line-height: 210px;
     width: 280px;
     margin: 30px auto 0;
   }
@@ -7808,4 +7925,20 @@ div.bsap a.adhere:hover {
     margin-left: 0;
     margin-top: 10px;
   }
+  .navbar-org {
+    text-align: center;
+  }
+  .navbar-org .container {
+    padding: 0;
+  }
+  .navbar-org .navbar-nav {
+    margin: 0;
+  }
+  .navbar-org .navbar-nav > li + li {
+    margin-left: 0;
+  }
+  .navbar-org .nav > li {
+    float: left;
+    width: 50%;
+  }
 }

assets/js/site.js

@@ -54,7 +54,7 @@ $(function () {
     }
   ];
 
-  selectFonticonsAd();
+  //selectFonticonsAd();
 
   // start the icon carousel
   $('#icon-carousel').carousel({

assets/less/site/bootstrap/navbar.less

@@ -6,7 +6,10 @@
   font-family: @font-family-serif;
   font-weight: 300;
   font-size: 20px;
-  .fa-flag { padding-right: 3px; }
+  .fas-flag-logo {
+    padding-right: 3px;
+    vertical-align: baseline;
+  }
 }
 .navbar-nav > li > a { padding: 11px 10px 9px; }
 
@@ -32,4 +35,144 @@
   }
 }
 
-.navbar-nav.navbar-right:last-child { margin-right: -10px; }
+.navbar-nav.navbar-right:last-child { margin-right: -10px; }
+
+
+//
+// FONTICONS ORG NAVBAR
+// --------------------
+//
+.navbar-org {
+  background-color: @navbar-inverse-link-active-bg;
+  border-color: mix(#000, @fa-green, 20%);
+  padding: 0;
+
+  .ficon-logo-flag, .ficon-log-fort { vertical-align: baseline; }
+
+  .navbar-text {
+    color: mix(#fff, @fa-green, 60%);
+    margin-top: 12px;
+    margin-right: 30px;
+  }
+
+  .navbar-nav {
+    margin-right: -10px;
+
+    > li + li { margin-left: 15px; }
+    > li > a {
+      color: mix(#fff, @navbar-inverse-bg, 75%);
+
+      &:hover,
+      &:focus {
+        color: mix(#fff, @fa-green, 100%);
+        background-color: transparent;
+        border-bottom: solid 2px mix(#fff, @fa-green, 90%);
+      }
+    }
+    > .active > a {
+      &,
+      &:hover,
+      &:focus {
+        color: mix(#fff, @navbar-inverse-bg, 75%);
+        background-color: transparent;
+        border-radius: 0;
+        border-bottom: solid 2px mix(#fff, @navbar-inverse-bg, 65%);
+      }
+    }
+    > .disabled > a {
+      &,
+      &:hover,
+      &:focus {
+        color: @navbar-inverse-link-disabled-color;
+        background-color: @navbar-inverse-link-disabled-bg;
+      }
+    }
+  }
+
+  // Darken the responsive nav toggle
+  .navbar-toggle {
+    border-color: @navbar-inverse-toggle-border-color;
+    &:hover,
+    &:focus {
+      background-color: @navbar-inverse-toggle-hover-bg;
+    }
+    .icon-bar {
+      background-color: @navbar-inverse-toggle-icon-bar-bg;
+    }
+  }
+
+  .navbar-collapse,
+  .navbar-form {
+    border-color: darken(@navbar-inverse-bg, 7%);
+  }
+
+  // Dropdowns
+  .navbar-nav {
+    > .open > a {
+      &,
+      &:hover,
+      &:focus {
+        background-color: @navbar-inverse-link-active-bg;
+        color: @navbar-inverse-link-active-color;
+      }
+    }
+
+    @media (max-width: @grid-float-breakpoint-max) {
+      // Dropdowns get custom display
+      .open .dropdown-menu {
+        > .dropdown-header {
+          border-color: @navbar-inverse-border;
+        }
+        .divider {
+          background-color: @navbar-inverse-border;
+        }
+        > li > a {
+          color: @navbar-inverse-link-color;
+          &:hover,
+          &:focus {
+            color: @navbar-inverse-link-hover-color;
+            background-color: @navbar-inverse-link-hover-bg;
+          }
+        }
+        > .active > a {
+          &,
+          &:hover,
+          &:focus {
+            color: @navbar-inverse-link-active-color;
+            background-color: @navbar-inverse-link-active-bg;
+          }
+        }
+        > .disabled > a {
+          &,
+          &:hover,
+          &:focus {
+            color: @navbar-inverse-link-disabled-color;
+            background-color: @navbar-inverse-link-disabled-bg;
+          }
+        }
+      }
+    }
+  }
+
+  .navbar-link {
+    color: @navbar-inverse-link-color;
+    &:hover {
+      color: @navbar-inverse-link-hover-color;
+    }
+  }
+
+  .btn-link {
+    color: @navbar-inverse-link-color;
+    &:hover,
+    &:focus {
+      color: @navbar-inverse-link-hover-color;
+    }
+    &[disabled],
+    fieldset[disabled] & {
+      &:hover,
+      &:focus {
+        color: @navbar-inverse-link-disabled-color;
+      }
+    }
+  }
+}

assets/less/site/bootstrap/variables.less

@@ -105,7 +105,7 @@
 @state-info-bg:                 @blue-lighter;
 @state-info-border:             darken(spin(@state-info-bg, -10), 7%);
 
-@state-danger-text:              @brand-danger;
+  @state-danger-text:              @brand-danger;
 @state-danger-bg:                mix(@state-danger-text,#fff,10%);
 @state-danger-border:            darken(spin(@state-danger-bg, -10), 5%);
 

assets/less/site/jumbotron-carousel.less

@@ -3,7 +3,7 @@
   margin-top: @buffer-sm;
   font-size: @size;
   text-align: center;
-  line-height: @size + 20;
+  line-height: @size + 30;
   text-shadow: 0 2px 0 rgba(0,0,0,0.15);
 }
 .carousel-control {

assets/less/site/responsive/screen-lg.less

@@ -2,7 +2,7 @@
   #icon-carousel {
     @size: 240px;
     font-size: @size;
-    line-height: @size + 20;
+    line-height: @size + 35;
     margin-top: @buffer-lg;
   }
 

assets/less/site/responsive/screen-sm.less

@@ -2,7 +2,7 @@
   #icon-carousel {
     @size: 200px;
     font-size: @size;
-    line-height: @size + 20;
+    line-height: @size + 30;
   }
   .carousel-control {
     top: @size - 10px;

assets/less/site/responsive/screen-xs.less

@@ -2,7 +2,7 @@
   #icon-carousel {
     @size: 180px;
     font-size: @size;
-    line-height: @size + 20;
+    line-height: @size + 30;
     width: 280px;
     margin: 30px auto 0;
   }
@@ -79,4 +79,20 @@
     margin-left: 0;
     margin-top: 10px;
   }
+
+
+  .navbar-org {
+    text-align: center;
+    .container { padding: 0; }
+    .navbar-nav {
+      margin: 0;
+      > li + li {
+        margin-left: 0;
+      }
+    }
+    .nav > li {
+      float: left;
+      width: 50%;
+    }
+  }
 }

assets/less/site/textured-bg.less

@@ -1,4 +1,4 @@
-.jumbotron, .navbar-inverse, #footer {
+.jumbotron, .navbar-inverse, .navbar-inverse .navbar-nav > li.active > a, .navbar-org, #footer {
   position: relative;
   &:after {
     content: '';

cheatsheet/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

community/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">
@@ -284,7 +280,7 @@
   <ol>
     <li>Please do not submit new icons.</li>
     <li>Please submit all pull requests against *-wip branches.</li>
-    <li>All pull requests submitted against master will be sumarily closed and this guide referenced.</li>
+    <li>All pull requests submitted against master will be summarily closed and this guide referenced.</li>
     <li>
       After doing everything above, feel free to
       <a href="https://github.com/FortAwesome/Font-Awesome/issues/new">submit a pull request</a>.

examples/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

get-started/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/500px/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/adjust/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/adn/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/align-center/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/align-justify/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/align-left/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/align-right/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/amazon/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/ambulance/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/anchor/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/android/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/angellist/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/angle-double-down/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/angle-double-left/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/angle-double-right/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/angle-double-up/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/angle-down/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/angle-left/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/angle-right/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/angle-up/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/apple/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/archive/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/area-chart/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/arrow-circle-down/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/arrow-circle-left/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/arrow-circle-o-down/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/arrow-circle-o-left/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/arrow-circle-o-right/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/arrow-circle-o-up/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/arrow-circle-right/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/arrow-circle-up/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/arrow-down/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/arrow-left/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/arrow-right/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/arrow-up/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/arrows-alt/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/arrows-h/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/arrows-v/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/arrows/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/asterisk/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/at/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/backward/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/balance-scale/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/ban/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bar-chart/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/barcode/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bars/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/battery-empty/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/battery-full/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/battery-half/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/battery-quarter/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/battery-three-quarters/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bed/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/beer/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/behance-square/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/behance/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bell-o/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bell-slash-o/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bell-slash/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bell/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bicycle/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/binoculars/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/birthday-cake/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bitbucket-square/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bitbucket/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/black-tie/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bluetooth-b/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bluetooth/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bold/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bolt/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bomb/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/book/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bookmark-o/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bookmark/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/briefcase/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/btc/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bug/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/building-o/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/building/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bullhorn/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bullseye/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/bus/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/buysellads/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">

icon/calculator/index.html

@@ -48,20 +48,16 @@
     })();
   </script>
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
-    <div class="collapse hidden-print" id="banner">
+    <div class="navbar navbar-org navbar-static-top">
   <div class="container">
-    <div class="message-container">
-      <div class="tagline">
-        <span id="rotating-message"></span>
-      </div>
-      <div class="action">
-        <a id="rotating-url" class="btn btn-primary btn-block" href=""></a>
-      </div>
-    </div>
+    <ul class="nav navbar-nav navbar-right">
+      <li><a href="http://fonticons.com/?ref=font-awesome-org-navbar"><i class="fas fas-star-logo"></i>&nbsp; Fonticons</a></li>
+      <li class="active"><a href="http://fontawesome.io/?ref=font-awesome-org-navbar"><i class="fas fas-flag-logo"></i>&nbsp; Font Awesome</a></li>
+    </ul>
+    <div class="navbar-text navbar-right hide-xs">Build and serve a faster front end!</div>
   </div>
 </div>
 
-
 <div class="navbar navbar-inverse navbar-static-top hidden-print">
   <div class="container">
     <div class="navbar-header">
@@ -69,7 +65,7 @@
         <span class="sr-only">Toggle navigation</span>
         <i class="fa fa-bars fa-lg"></i>
       </button>
-      <a class="navbar-brand" href="../../"><i class="fas fas-logo"></i></a>
+      <a class="navbar-brand" href="../../"><i class="fas fas-flag-logo fas-lg"></i> Font Awesome</a>
     </div>
 
     <div class="navbar-collapse collapse">