1 files changed, 11 insertions, 11 deletions
diff --git a/docs/css.html b/docs/css.html
index e1adcaaa4..d96bf367e 100644
--- a/docs/css.html
+++ b/docs/css.html
@@ -1312,21 +1312,21 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
           </tr>
           <tr>
             <td>
-              <code>.warning</code>
+              <code>.info</code>
             </td>
-            <td>Indicates a warning that might need attention</td>
+            <td>Indicates a neutral informative change or action</td>
           </tr>
           <tr>
             <td>
-              <code>.danger</code>
+              <code>.warning</code>
             </td>
-            <td>Indicates a dangerous or potentially negative action</td>
+            <td>Indicates a warning that might need attention</td>
           </tr>
           <tr>
             <td>
-              <code>.info</code>
+              <code>.danger</code>
             </td>
-            <td>Indicates a neutral informative change or action</td>
+            <td>Indicates a dangerous or potentially negative action</td>
           </tr>
         </tbody>
       </table>
@@ -1366,7 +1366,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
             <td>Column content</td>
             <td>Column content</td>
           </tr>
-          <tr class="warning">
+          <tr class="info">
             <td>5</td>
             <td>Column content</td>
             <td>Column content</td>
@@ -1378,7 +1378,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
             <td>Column content</td>
             <td>Column content</td>
           </tr>
-          <tr class="danger">
+          <tr class="warning">
             <td>7</td>
             <td>Column content</td>
             <td>Column content</td>
@@ -1390,7 +1390,7 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
             <td>Column content</td>
             <td>Column content</td>
           </tr>
-          <tr class="info">
+          <tr class="danger">
             <td>9</td>
             <td>Column content</td>
             <td>Column content</td>
@@ -2848,17 +2848,17 @@ For example, <code>&lt;section&gt;</code> should be wrapped as inline.
       <div class="color-swatches">
         <div class="color-swatch brand-primary"></div>
         <div class="color-swatch brand-success"></div>
+        <div class="color-swatch brand-info"></div>
         <div class="color-swatch brand-warning"></div>
         <div class="color-swatch brand-danger"></div>
-        <div class="color-swatch brand-info"></div>
       </div>
     </div>
 {% highlight css %}
 @brand-primary: #428bca;
 @brand-success: #5cb85c;
+@brand-info:    #5bc0de;
 @brand-warning: #f0ad4e;
 @brand-danger:  #d9534f;
-@brand-info:    #5bc0de;
 {% endhighlight %}
 
     <p>Use any of these color variables as they are or reassign them to more meaningful variables for your project.</p>