updating CDN error and success views

assets/font-awesome/css/font-awesome.css

@@ -61,7 +61,7 @@
 }
 .fa-border {
   padding: .2em .25em .15em;
-  border: solid 0.08em #eeeeee;
+  border: solid 0.08em #eee;
   border-radius: .1em;
 }
 .fa-pull-left {
@@ -176,7 +176,7 @@
   font-size: 2em;
 }
 .fa-inverse {
-  color: #ffffff;
+  color: #fff;
 }
 /* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
    readers do not read off random characters that represent icons */

cdn/error/index.html

@@ -173,20 +173,60 @@
 
 
     <div class="container">
-  <div class="row">
+  <div class="row margin-top-xl">
-    <div class="col-md-6 col-md-offset-3 margin-top-lg">
+
-      <div class="well well-lg margin-top-xl margin-bottom-xl">
+    <div class="col-lg-7">
-        <h1 class="text-danger page-header"><i class="fa fa-exclamation-triangle"></i> Oh noes!</h1>
+      <div class="well well-lg margin-bottom-xl">
-        <p class="lead">
+        <h1 class="page-header text-danger">
-          Something bad happened on our end when sending your embed code.
+          <i class="fa fa-exclamation-triangle"></i>
-          We've already been notified and are looking into it.
+          Oh Noes!
-        </p>
+        </h1>
 
         <p class="lead">
-          Hang tight for just a bit and we should have things fixed up shortly.
+          <strong>Something bad happened on our end when sending your embed code.</strong>
+        </p>
+
+        <p>
+          We've already been notified and are looking into it. Hang tight for just a bit and we should have things fixed up shortly.
         </p>
       </div>
+    </div>
 
+    <div class="col-lg-4 col-lg-offset-1">
+
+      <ol class="list-unstyled gg gg-top">
+        <li class="gg-row">
+          <div class="gg-col">
+            <i class="fa fa-refresh fa-2x margin-right-lg text-muted"></i>
+          </div>
+          <div class="gg-col">
+            <h3 class="text-lg text-muted">If at first you don't succeed&hellip;</h3>
+
+            <p>
+              We'll be taking a look into things. But in the meantime, it may not hurt to <a href="../../cdn/new/">try to request an embed code again</a>.
+            </p>
+
+            <hr class="hr-lg m-xs-y-lg">
+          </div>
+        </li>
+
+        <li class="gg-row">
+          <div class="gg-col">
+            <i class="fa fa-hourglass-end fa-2x margin-right-lg text-muted"></i>
+          </div>
+          <div class="gg-col">
+            <h3 class="text-lg text-muted">Been a while?</h3>
+
+            <p>
+              Still stuck and haven't heard from us? Let us know something is up.
+            </p>
+
+            <a href="mailto:cdn@fontawesome.com" class="btn btn-success btn-lg">
+              Contact us!
+            </a>
+          </div>
+        </li>
+      </ol>
     </div>
   </div>
 </div>

cdn/success/index.html

@@ -173,20 +173,61 @@
 
 
     <div class="container">
-  <div class="row">
+  <div class="row margin-top-xl">
-    <div class="col-md-6 col-md-offset-3 margin-top-lg">
+    <div class="col-lg-7">
-      <div class="well well-lg margin-top-xl margin-bottom-xl">
+      <div class="well well-lg margin-bottom-xl">
-        <h1 class="text-success page-header"><i class="fa fa-envelope"></i> On the way!</h1>
+        <h1 class="page-header text-success">
+          <i class="fa fa-check"></i>
+          Great Success!
+        </h1>
+
         <p class="lead">
-          We just sent you an email with your new Font Awesome CDN embed code and instructions
+          <strong>Your embed code is on its way.</strong>
-          for what to do next!
         </p>
 
-        <p class="lead text-muted">
+        <p>
-          If you don't see the email, maybe check your spam.
+          We just sent you an email with your new Font Awesome CDN embed code and instructions for what to do next!
+        </p>
+
+        <p>
+          If you don't see the email (sent by "Font Awesome") in your inbox, maybe check your spam folder first. Also, make sure you haven't previously unsubscribed. Still nothing? <a href="../../cdn/new/">Try again</a> or <a href="https://cdn.fontawesome.com/help">get some help</a>.
         </p>
       </div>
+    </div>
 
+    <div class="col-lg-4 col-lg-offset-1">
+
+      <h2 class="sr-only">Next Steps</h2>
+
+      <ol class="list-unstyled gg gg-top">
+        <li class="gg-row">
+          <div class="gg-col p-xs-r-md">
+            <i class="fa fa-envelope fa-2x margin-right-lg text-muted"></i>
+          </div>
+          <div class="gg-col">
+            <h3 class="text-lg text-muted">Check your email</h3>
+
+            <p>
+              Your embed code should be waiting there for you. From there you can also register a Font Awesome CDN account to help you manage your icons even more easily.
+            </p>
+
+            <hr class="hr-lg m-xs-y-lg">
+          </div>
+        </li>
+
+        <li class="gg-row">
+          <div class="gg-col p-xs-r-md">
+            <i class="fa fa-flag-checkered fa-2x margin-right-lg text-muted"></i>
+          </div>
+          <div class="gg-col">
+            <h3 class="text-lg text-muted">Get ready to use Font Awesome</h3>
+
+            <p>
+              While you're waiting, dive into how to use Font Awesome. You'll want to add your embed code within the <code>&lt;head&gt;</code> of each template or page that you want to use Font Awesome on. Then, check out the <a href="../../icons/">Font Awesome icons</a> and <a href="../../examples/">examples</a> to learn how drop icons right into your UI.
+            </p>
+          </div>
+        </li>
+      </ol>
     </div>
   </div>
 </div>