Minor style changes + added compatibility warning

Author: riverspirit

css/style.css

@@ -38,10 +38,18 @@ body {
     color: white;
 }
 
-.links-section {
-    float: left;
+.notes-section {
     margin: 10px;
     color: #4D4E53;
+    font-family: Ubuntu, Arial, Tahoma, 'Sans Serif';
+    float: left;
+}
+
+.compatibility-warning {
+    color: #E05252;
+    margin-top: 10px;
+    border-radius: 4px;
+    font-size: 0.7em;
 }
 
 /* Demo styles */

index.html

@@ -48,7 +48,7 @@ <h1>CSS @counter-style Demo</h1>
     <div class="list-controls">
         <h3>Select a counter style from the list</h3>
         <select id="style-select">
-            <optgroup label="System">
+            <optgroup label="@counter-style system">
                 <option value="cyclic">cyclic</option>
                 <option value="fixed">fixed</option>
                 <option value="symbolic">symbolic</option>
@@ -133,9 +133,12 @@ <h3>Select a counter style from the list</h3>
 }</pre>
 
     </div>
-<div class="links-section">
-    <i>Read more on <code>@counter-style</code> on
+<div class="notes-section">
+
+    <i>Read more about <code>@counter-style</code> on
         <a href="https://developer.mozilla.org/en-US/docs/Web/CSS/@counter-style">Mozilla Developer Network</a></i>
+
+    <div class="compatibility-warning">⚠ Warning: <i>@counter-style</i> currently works only on Firefox 33+</div>
 </div>
     <script src="js/script.js"></script>
 </body>