首頁 探索 說明
登入
mirrors
/
Fork-Awesome
镜像来自 https://github.com/ForkAwesome/Fork-Awesome
2
0
複刻 0
Files 問題管理 0 Wiki
瀏覽代碼

Updating nav and modals for FA5 launch

Dave Gandy 7 年之前
父節點
b114d3e921
當前提交
3d62265980
共有 100 個文件被更改，包括 4338 次插入 和 1749 次删除
分割檢視 顯示文件統計
  1. 45 18
      accessibility/index.html
  2. 0 0
      assets/css/site.css
  3. 二進制
      assets/font-awesome-4.7.0.zip
  4. 4 4
      assets/js/site.js
  5. 2 0
      assets/less/site/fa5.less
  6. 45 18
      cdn/error/index.html
  7. 45 18
      cdn/success/index.html
  8. 45 18
      cheatsheet/index.html
  9. 45 18
      community/index.html
  10. 45 18
      examples/index.html
  11. 57 35
      get-started/index.html
  12. 45 18
      icon/500px/index.html
  13. 45 18
      icon/address-book-o/index.html
  14. 45 18
      icon/address-book/index.html
  15. 45 18
      icon/address-card-o/index.html
  16. 45 18
      icon/address-card/index.html
  17. 45 18
      icon/adjust/index.html
  18. 45 18
      icon/adn/index.html
  19. 45 18
      icon/align-center/index.html
  20. 45 18
      icon/align-justify/index.html
  21. 45 18
      icon/align-left/index.html
  22. 45 18
      icon/align-right/index.html
  23. 45 18
      icon/amazon/index.html
  24. 45 18
      icon/ambulance/index.html
  25. 45 18
      icon/american-sign-language-interpreting/index.html
  26. 45 18
      icon/anchor/index.html
  27. 45 18
      icon/android/index.html
  28. 45 18
      icon/angellist/index.html
  29. 45 18
      icon/angle-double-down/index.html
  30. 45 18
      icon/angle-double-left/index.html
  31. 45 18
      icon/angle-double-right/index.html
  32. 45 18
      icon/angle-double-up/index.html
  33. 45 18
      icon/angle-down/index.html
  34. 45 18
      icon/angle-left/index.html
  35. 45 18
      icon/angle-right/index.html
  36. 45 18
      icon/angle-up/index.html
  37. 45 18
      icon/apple/index.html
  38. 45 18
      icon/archive/index.html
  39. 45 18
      icon/area-chart/index.html
  40. 45 18
      icon/arrow-circle-down/index.html
  41. 45 18
      icon/arrow-circle-left/index.html
  42. 45 18
      icon/arrow-circle-o-down/index.html
  43. 45 18
      icon/arrow-circle-o-left/index.html
  44. 45 18
      icon/arrow-circle-o-right/index.html
  45. 45 18
      icon/arrow-circle-o-up/index.html
  46. 45 18
      icon/arrow-circle-right/index.html
  47. 45 18
      icon/arrow-circle-up/index.html
  48. 45 18
      icon/arrow-down/index.html
  49. 45 18
      icon/arrow-left/index.html
  50. 45 18
      icon/arrow-right/index.html
  51. 45 18
      icon/arrow-up/index.html
  52. 45 18
      icon/arrows-alt/index.html
  53. 45 18
      icon/arrows-h/index.html
  54. 45 18
      icon/arrows-v/index.html
  55. 45 18
      icon/arrows/index.html
  56. 45 18
      icon/assistive-listening-systems/index.html
  57. 45 18
      icon/asterisk/index.html
  58. 45 18
      icon/at/index.html
  59. 45 18
      icon/audio-description/index.html
  60. 45 18
      icon/backward/index.html
  61. 45 18
      icon/balance-scale/index.html
  62. 45 18
      icon/ban/index.html
  63. 45 18
      icon/bandcamp/index.html
  64. 45 18
      icon/bar-chart/index.html
  65. 45 18
      icon/barcode/index.html
  66. 45 18
      icon/bars/index.html
  67. 45 18
      icon/bath/index.html
  68. 45 18
      icon/battery-empty/index.html
  69. 45 18
      icon/battery-full/index.html
  70. 45 18
      icon/battery-half/index.html
  71. 45 18
      icon/battery-quarter/index.html
  72. 45 18
      icon/battery-three-quarters/index.html
  73. 45 18
      icon/bed/index.html
  74. 45 18
      icon/beer/index.html
  75. 45 18
      icon/behance-square/index.html
  76. 45 18
      icon/behance/index.html
  77. 45 18
      icon/bell-o/index.html
  78. 45 18
      icon/bell-slash-o/index.html
  79. 45 18
      icon/bell-slash/index.html
  80. 45 18
      icon/bell/index.html
  81. 45 18
      icon/bicycle/index.html
  82. 45 18
      icon/binoculars/index.html
  83. 45 18
      icon/birthday-cake/index.html
  84. 45 18
      icon/bitbucket-square/index.html
  85. 45 18
      icon/bitbucket/index.html
  86. 45 18
      icon/black-tie/index.html
  87. 45 18
      icon/blind/index.html
  88. 45 18
      icon/bluetooth-b/index.html
  89. 45 18
      icon/bluetooth/index.html
  90. 45 18
      icon/bold/index.html
  91. 45 18
      icon/bolt/index.html
  92. 45 18
      icon/bomb/index.html
  93. 45 18
      icon/book/index.html
  94. 45 18
      icon/bookmark-o/index.html
  95. 45 18
      icon/bookmark/index.html
  96. 45 18
      icon/braille/index.html
  97. 45 18
      icon/briefcase/index.html
  98. 45 18
      icon/btc/index.html
  99. 45 18
      icon/bug/index.html
  100. 45 18
      icon/building-o/index.html

+ 45 - 18
accessibility/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome v-accessibility">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -393,25 +392,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

File diff suppressed because it is too large
+ 0 - 0
assets/css/site.css


二進制
assets/font-awesome-4.7.0.zip
查看文件


+ 4 - 4
assets/js/site.js
查看文件 

@@ -5,12 +5,12 @@ $(function () {
 
     {
 
       quote: "Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for just $60!",
 
       class: "fa5",
 
-      url: "https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=banner",
 
+      url: "https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner",
 
       btn_text: "Check out FA Pro &nbsp;<i class='fas fas-external-link'></i>",
 
     },
 
   ];
 
 
-  selectAd();
 
+  // selectAd();
 
 
   // start the icon carousel
 
   $('#icon-carousel').carousel({
 
@@ -20,7 +20,7 @@ $(function () {
 
   $('[data-toggle="tooltip"]').tooltip();
 
   $('[data-toggle="popover"]').popover();
 
 
-  if (storageAvailable('localStorage') && !localStorage.seenFA5Modal3) {
 
+  if (storageAvailable('localStorage') && !localStorage.seenFA5ReleasedModal) {
 
     $('#modal-fa5')
 
       .modal('toggle')
 
       .on('hidden.bs.modal', function (e) {
 
@@ -30,7 +30,7 @@ $(function () {
 
   }
 
 
   if (storageAvailable('localStorage')) {
 
-    localStorage.seenFA5Modal3 = true;
 
+    localStorage.seenFA5ReleasedModal = true;
 
   	// Yippee! We can use localStorage awesomeness
 
   }

+ 2 - 0
assets/less/site/fa5.less
查看文件 

@@ -14,3 +14,5 @@
 
   background-color: @fa5-color;
 
   color: #fff;
 
 }
 
+
 
+.modal-content { overflow: hidden; }

+ 45 - 18
cdn/error/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -245,25 +244,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
cdn/success/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -246,25 +245,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
cheatsheet/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -6547,25 +6546,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
community/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -402,25 +401,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
examples/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -819,25 +818,53 @@ fa-ban on fa-camera
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 57 - 35
get-started/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome v-get-started">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -412,22 +411,18 @@
 
         </h2>
 
       </div>
 
       <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for just $60!
 
+        Font Awesome 5 Released!
 
       </h3>
 
       <div class="modal-body">
 
-        <div class="text-lg margin-bottom-lg padding-bottom">
 
-          Before you download, check out <b>Font Awesome Pro&mdash;</b>
 
-        </div>
 
-
 
-        <div class="row margin-bottom-lg">
 
+        <div class="row margin-bottom-lg margin-top">
 
           <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
             <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
             <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
           </div>
 
           <div class="col-md-9 col-sm-9 col-xs-9">
 
-            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More Icons</h4>
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
             <p>
 
-              Get 2,148 icons right now with Pro, plus another 2,000 from 46 icon category packs as we finish them!
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
             </p>
 
           </div>
 
         </div>
 
@@ -437,29 +432,28 @@
 
             <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
           </div>
 
           <div class="col-md-9 col-sm-9 col-xs-9">
 
-            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">SVG Framework &amp; More</h4>
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
             <p>
 
-              Get the latest tech upgrades, easy upgrades from v4, icons in 3 styles,
 
-              <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=download_modal#schedule-info">&amp; tons more as we finish</a>.
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
             </p>
 
           </div>
 
         </div>
 
         <div class="row margin-bottom-lg">
 
           <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
-            <i class="fas fas-stopwatch fas-3x fas-fw text-muted hidden-xs"></i>
 
-            <i class="fas fas-stopwatch fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
           </div>
 
           <div class="col-md-9 col-sm-9 col-xs-10">
 
-            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Early Access</h4>
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
             <p>
 
-              Get early access and input into new icons, categories, and frameworks with our private GitHub repo!
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
             </p>
 
           </div>
 
         </div>
 
 
-        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=download_modal" class="btn btn-fa5 btn-lg btn-block">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=download_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>
 
         <div class="text-center margin-top margin-bottom">or</div>
 
@@ -513,25 +507,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/500px/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/address-book-o/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/address-book/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/address-card-o/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -261,25 +260,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/address-card/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -261,25 +260,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/adjust/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/adn/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/align-center/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/align-justify/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/align-left/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/align-right/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/amazon/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/ambulance/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -258,25 +257,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/american-sign-language-interpreting/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -263,25 +262,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/anchor/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/android/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/angellist/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/angle-double-down/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/angle-double-left/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/angle-double-right/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/angle-double-up/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/angle-down/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/angle-left/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/angle-right/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/angle-up/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/apple/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/archive/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/area-chart/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -258,25 +257,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/arrow-circle-down/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/arrow-circle-left/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/arrow-circle-o-down/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/arrow-circle-o-left/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/arrow-circle-o-right/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/arrow-circle-o-up/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/arrow-circle-right/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/arrow-circle-up/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/arrow-down/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/arrow-left/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/arrow-right/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/arrow-up/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/arrows-alt/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -258,25 +257,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/arrows-h/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -258,25 +257,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/arrows-v/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -258,25 +257,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/arrows/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -258,25 +257,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/assistive-listening-systems/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -258,25 +257,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/asterisk/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/at/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/audio-description/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -258,25 +257,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/backward/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/balance-scale/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/ban/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bandcamp/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bar-chart/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -263,25 +262,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/barcode/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bars/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -263,25 +262,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bath/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -263,25 +262,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/battery-empty/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -261,25 +260,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/battery-full/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -263,25 +262,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/battery-half/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -261,25 +260,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/battery-quarter/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -261,25 +260,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/battery-three-quarters/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -261,25 +260,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bed/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -261,25 +260,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/beer/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/behance-square/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/behance/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bell-o/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bell-slash-o/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bell-slash/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bell/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bicycle/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -258,25 +257,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/binoculars/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/birthday-cake/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bitbucket-square/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bitbucket/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/black-tie/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/blind/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -258,25 +257,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bluetooth-b/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -258,25 +257,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bluetooth/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -258,25 +257,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bold/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bolt/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -261,25 +260,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bomb/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/book/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bookmark-o/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bookmark/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/braille/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -258,25 +257,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/briefcase/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/btc/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -263,25 +262,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/bug/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

+ 45 - 18
icon/building-o/index.html
查看文件 

@@ -40,17 +40,16 @@
 
 </head>
 
 <body class="font-awesome ">
 
   <div id="wrap"> <!-- necessary for sticky footer. wrap all content except footer -->
 
-    <div class="collapse hidden-print" id="banner">
 
+    <div class="hidden-print fa5" id="banner">
 
   <div class="container">
 
     <div class="message-container">
 
       <div class="tagline">
 
-        <span id="rotating-message"></span>
 
-          <div class="time-left">
 
-            <span id="time-left-message"></span>
 
-          </div>
 
+        <strong>Font Awesome 5 released!</strong> New icons, SVG, ligatures, &amp; tons more.
 
       </div>
 
       <div class="action">
 
-        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="" target="_blank"></a>
 
+        <a id="rotating-url" class="btn btn-primary btn-lg btn-block" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=banner" target="_blank">
 
+          Font Awesome 5 &nbsp;<i class='fas fas-external-link'></i>
 
+        </a>
 
       </div>
 
     </div>
 
   </div>
 
@@ -256,25 +255,53 @@
 
 </footer>
 
 
   <div class="modal" id="modal-fa5" tabindex="-1" role="dialog" aria-labelledby="modal-fa5-label">
 
-  <div class="modal-dialog modal-lg" role="document">
 
+  <div class="modal-dialog" role="document">
 
     <div class="modal-content">
 
-      <div class="modal-header">
 
+      <div class="modal-header bg-fa5">
 
         <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fa fa-times" aria-hidden="true"></i><span class="close"></span></button>
 
-        <h3 class="modal-title" id="modal-fa5-label">Font Awesome Pro</h3>
 
+        <h3 class="modal-title" id="modal-fa5-label">Font Awesome 5 Released!</h3>
 
       </div>
 
-      <h3 class="bg-fa5 margin-none padding-lg text-center">
 
-        Get 2,000+ icons with Font Awesome Pro and <strong>ALL</strong> KS rewards for $60!
 
-      </h3>
 
       <div class="modal-body">
 
-        <style>.embed-container { position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; max-width: 100%; } .embed-container iframe, .embed-container object, .embed-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }</style>
 
-        <div class="embed-container">
 
-          <iframe id="fa5-iframe" src="https://www.kickstarter.com/projects/232193852/font-awesome-5/widget/video.html" frameborder="0" scrolling="no" allowfullscreen></iframe>
 
+        <div class="row margin-bottom-lg margin-top">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-trophy-alt fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-trophy-alt fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">More Icons</h4>
 
+            <p>
 
+              Get 893 icons right now with FA Free, plus another 1,283 icons with Pro, which also gets you another 46 icon category packs as we finish them!
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-flask fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-flask fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-9">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">All-New SVG</h4>
 
+            <p>
 
+              Our all-new SVG with JavaScript gives you all the power of SVG without the usual hassle.
 
+            </p>
 
+          </div>
 
+        </div>
 
+        <div class="row margin-bottom-lg">
 
+          <div class="col-md-2 col-sm-2 col-xs-2 text-right padding-right-sm">
 
+            <i class="fas fas-rocket fas-3x fas-fw text-muted hidden-xs"></i>
 
+            <i class="fas fas-rocket fas-2x fas-fw text-muted hidden-sm hidden-md hidden-lg"></i>
 
+          </div>
 
+          <div class="col-md-9 col-sm-9 col-xs-10">
 
+            <h4 class="page-header margin-top-none padding-bottom-sm margin-bottom-sm">Tons More</h4>
 
+            <p>
 
+              Ligatures for easier desktop use, shim for quick upgrades from 4, and more styles, icons, and tools with FA Pro.
 
+            </p>
 
+          </div>
 
         </div>
 
 
-        <a class="btn btn-fa5 btn-lg btn-block padding-left-sm padding-right-sm margin-top-lg" href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=two_thousand_60&utm_content=kickstarter_modal" target="_blank"
 
-           onClick="_gaq.push(['_trackEvent', 'Outbound Modal Link', 'Pre-Order']);">
 
+        <a href="https://fontawesome.com/?utm_source=font_awesome_homepage&utm_medium=display&utm_campaign=fa5_released&utm_content=auto_modal" class="btn btn-fa5 btn-lg btn-block">
 
           <h3 class="margin-top margin-bottom strong">
 
-            Check out <span class="hidden-xs">Font Awesome</span><span class="hidden-sm hidden-md hidden-lg">FA</span> Pro! &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
+            Font Awesome 5 &nbsp;<i class="fas fas-external-link" aria-hidden="true"></i>
 
           </h3>
 
         </a>

Some files were not shown because too many files changed in this diff