static/c4.css

@@ -27,18 +27,28 @@ h1, h1 a  {
     font-size: smaller;
 }
 
-.btn.green {
-    color: #020;
-    background-color: #6f3;
+.btn.primary {
+    color: #220;
+    background-color: #fcbb06;
 }
 
-.btn.green:hover ,.btn.green:focus {
+.btn.primary:hover,.btn.primary:focus {
+    background-color: #ffcc33;
+}
+
+.btn.grn {
+    color: #020;
+    background-color: #9f6;
+}
+
+.btn.grn:hover ,.btn.grn:focus {
     background-color: #3f0;
 }
 
+
 .btn.red {
     color: #200;
-    background-color: #f36;
+    background-color: #f48;
 }
 
 .btn.red:hover, .btn.red:focus {

static/form.html

@@ -50,6 +50,6 @@
     </form>
     
     <button id="delete" class="btn red" autocomplete="off">Delete</button>
-    <button id="save" class="btn green" autocomplete="off">Save</button>
+    <button id="save" class="btn primary" autocomplete="off">Save</button>
   </body>
 </html>

static/index.html

@@ -38,7 +38,7 @@
           </div>
         </template>
       </div>
-      <a href="form.html" class="btn green">+</a>
+      <a href="form.html" class="btn primary">+</a>
     </div>
   </body>
 </html>