diff --git a/src/app/messages/messages.component.scss b/src/app/messages/messages.component.scss
index 6c01006..d19978c 100644
--- a/src/app/messages/messages.component.scss
+++ b/src/app/messages/messages.component.scss
@@ -33,39 +33,41 @@
     text-align: center;
 
     .no {
-      @include set-button-style($tao-red-color);
+      @include set-button-style($tao-red-color, $tao-shadow-red-color);
       width: $xlarge;
     }
 
     .yes {
-      @include set-button-style($tao-green-color);
+      @include set-button-style($tao-green-color, $tao-shadow-green-color);
       width: $xlarge;
     }
 
     .solution {
-      @include set-button-style($tao-blue-color);
+      @include set-button-style(white, $tao-shadow-color);
       width: $xlarge + $medium + $tiny;
     }
 
     .hint {
-      @include set-button-style($tao-yellow-color);
-      width: $xlarge + $medium + $tiny;
+      @include set-button-style($tao-blue-color, $tao-shadow-blue-color);
+      width: $xlarge;
     }
 
     .fix {
-      @include set-button-style($tao-yellow-color);
+      @include set-button-style($tao-yellow-color, $tao-shadow-yellow-color);
       width: $xlarge + $medium + $tiny;
     }
 
     .next {
-      @include set-button-style($tao-blue-color);
+      @include set-button-style($tao-blue-color, $tao-shadow-blue-color);
       width: $xlarge;
     }
   }
 }
 
 .highlighted-message {
-  box-shadow: 0px 0px 3px 0px rgba($tao-gray-300,0.65);
+  // box-shadow: 0px 0px 8px 0px $tao-blue-color;
+  border: 3px single $tao-blue-color;
+
 }
 
 @keyframes inflate {
diff --git a/src/app/services/terminado.service.ts b/src/app/services/terminado.service.ts
index 275c334..c07cb0f 100644
--- a/src/app/services/terminado.service.ts
+++ b/src/app/services/terminado.service.ts
@@ -26,8 +26,8 @@ export class TerminadoService {
         black: '#000000',
         red: '#FF5252',                         // $tao-red-500
         brightRed: '#FF7171',                   // $tao-red-400
-        green: '#2fd19f',                       // $tao-bright-green-500
-        brightGreen: '#2fd19f',                 // $tao-bright-green-500
+        green: '#60FDEB',                       // $tao-bright-green-500
+        brightGreen: '#60FDEB',                 // $tao-bright-green-500
         brightYellow: '#FFD283',                // $tao-warm-yellow-300
         yellow: '#FFB83B',                      // $tao-warm-yellow-500
         magenta: '#FF8FC6',                     // $tao-pink-200
diff --git a/src/assets/scss/_variables.scss b/src/assets/scss/_variables.scss
index 685854a..50c36d8 100644
--- a/src/assets/scss/_variables.scss
+++ b/src/assets/scss/_variables.scss
@@ -99,10 +99,16 @@ $tao-message-originator-color: #6697FF;
 $tao-copy-color: #FFFFFF;
 $tao-timestamp-color: #94A6B9;
 $tao-gray-color: #94A6B9; // @25% opacity
+$tao-shadow-color: rgba(255, 255, 255, 0.5);
 $tao-yellow-color: #FFD68F;
+$tao-shadow-yellow-color: rgba(255, 214, 143, 0.5);
 $tao-blue-color: #6697FF;
+$tao-shadow-blue-color: rgba(102, 151, 255, 0.5);
 $tao-green-color: #48BEB0;
+$tao-shadow-green-color: rgba(72, 190, 176, 0.5);
+$tao-cyan-color: #60FDEB;
 $tao-red-color: #FF4583;
+$tao-shadow-red-color: rgba(255, 69, 131, 0.5);
 
 
 // Panel border radius
diff --git a/src/assets/scss/mixins/_button.scss b/src/assets/scss/mixins/_button.scss
index ab95fae..213ab5b 100644
--- a/src/assets/scss/mixins/_button.scss
+++ b/src/assets/scss/mixins/_button.scss
@@ -1,6 +1,6 @@
 @import "../variables.scss";
 
-@mixin set-button-style($color) {
+@mixin set-button-style($color, $shadow-color) {
   box-sizing: border-box;
   border-radius: 10px;
   background: $color;
@@ -16,10 +16,12 @@
   outline: none;
 
   &:active {
-    background: $tao-btn-font-color;
-    border: $tao-btn-font-color;
-    color: $color;
-    border-radius: 10px;
+    opacity: 0.5;
+    box-shadow: none;
+  }
+
+  &:hover {
+    box-shadow: 0 0 8px $shadow-color;
   }
 }