added some outline colours and gradients

colors.css

@@ -212,6 +212,23 @@
     color: #3F51B5!important;
 }
 
+.c_o_indigo300{
+    background: rgba(0, 0, 0, 0)!important;
+    border: 2px solid #7986CB!important;
+    color: #7986CB!important;
+}
+
+.c_indigoG500to300{
+    background: -moz-linear-gradient(219deg, #7986CB 0%, #3F51B5 100%)!important; /* ff3.6+ */
+    background: -webkit-gradient(linear, left bottom, right top, color-stop(0%, #3F51B5), color-stop(100%, #7986CB))!important; /* safari4+,chrome */
+    background: -webkit-linear-gradient(219deg, #7986CB 0%, #3F51B5 100%)!important; /* safari5.1+,chrome10+ */
+    background: -o-linear-gradient(219deg, #7986CB 0%, #3F51B5 100%)!important; /* opera 11.10+ */
+    background: -ms-linear-gradient(219deg, #7986CB 0%, #3F51B5 100%)!important; /* ie10+ */
+    background: linear-gradient(231deg, #7986CB 0%, #3F51B5 100%)!important; /* w3c */
+    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#3F51B5', endColorstr='#7986CB',GradientType=1 )!important; /* ie6-9 */
+    color: #ffffff!important;
+}
+
 /* blue */
 .c_blue50{
     background: #E3F2FD!important;
@@ -300,6 +317,21 @@
     color: #ffffff!important;
 }
 
+.c_o_cyan300{
+    background: rgba(0, 0, 0, 0)!important;
+    border: 2px solid #4DD0E1!important;
+    color: #4DD0E1!important;
+}
+
+.c_cyanG500to300{
+    background: #00BCD4;
+    background: -moz-linear-gradient(left, #00BCD4 0%, #4DD0E1 100%);
+    background: -webkit-linear-gradient(left, #00BCD4 0%,#4DD0E1 100%);
+    background: linear-gradient(to right, #00BCD4 0%,#4DD0E1 100%);
+    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00BCD4', endColorstr='#4DD0E1',GradientType=1 );
+}
+
+
 /* green */
 .c_green50{
     background: #E8F5E9!important;
@@ -342,6 +374,11 @@
     color: #ffffff!important;
 }
 
+.c_o_green300{
+    background: rgba(0, 0, 0, 0)!important;
+    border: 2px solid #81C784!important;
+    color: #81C784!important;
+}
 .ct_green300{
     color: #81C784!important;
 }