diff --git a/client/assets/styles/colours.less b/client/assets/styles/colours.less
index cfed8007..01a6b033 100644
--- a/client/assets/styles/colours.less
+++ b/client/assets/styles/colours.less
@@ -61,3 +61,67 @@ svg {
     color: @white;
     stroke: @white;
 }
+
+.red-border {
+    border-color: @red;
+}
+.blue-border {
+    border-color: @blue;
+}
+.green-border {
+    border-color: @green;
+}
+
+.red-blue-border {
+    animation: rb 3s ease-in-out 0s infinite alternate;
+}
+.red-green-border {
+    animation: rg 3s ease-in-out 0s infinite alternate;
+}
+.blue-green-border {
+    animation: bg 3s ease-in-out 0s infinite alternate;
+}
+
+@keyframes rg {
+    from {
+        border-color: @red;
+    }
+
+    to {
+        border-color: @green;
+    }
+}
+
+@keyframes rb {
+    from {
+        border-color: @red;
+    }
+
+    to {
+        border-color: @blue;
+    }
+}
+
+@keyframes bg {
+    from {
+        border-color: @blue;
+    }
+
+    to {
+        border-color: @green;
+    }
+}
+
+button {
+    &.blue {
+        border-color: @blue;
+    }
+    &.red {
+        border-color: @red;
+    }
+    &.green {
+        border-color: @green;
+    }
+
+
+}
\ No newline at end of file
diff --git a/client/assets/styles/styles.less b/client/assets/styles/styles.less
index 51884646..f89cecb0 100644
--- a/client/assets/styles/styles.less
+++ b/client/assets/styles/styles.less
@@ -139,24 +139,6 @@ button, input {
         color: @gray-focus;
         border-color: @gray-focus;
     }
-    &.red-border {
-        font-z-color: @red;
-    }
-    &.blue-border {
-        border-color: @blue;
-    }
-    &.green-border {
-        border-color: @green;
-    }
-    &.red-blue-border {
-        border-image: linear-gradient(to right, @red 50%, @blue 50%) 5;
-    }
-    &.red-green-border {
-        border-image: linear-gradient(to right, @red 50%, @green 50%) 5;
-    }
-    &.blue-green-border {
-        border-image: linear-gradient(to right, @blue 50%, @green 50%) 5;
-    }
 }
 
 a {
diff --git a/client/src/components/vbox.component.jsx b/client/src/components/vbox.component.jsx
index 52d1d2e8..20e86303 100644
--- a/client/src/components/vbox.component.jsx
+++ b/client/src/components/vbox.component.jsx
@@ -174,7 +174,7 @@ function Vbox(args) {
             return setVboxSelected([group, index]);
         }
 
-        const classes = `${selected ? 'highlight' : ''}`;
+        const classes = `${v.toLowerCase()} ${selected ? 'highlight' : ''}`;
 
         if (shapes[v]) {
             return (