diff --git a/core/app/core/src/lib/components/grid-widget/grid-widget.component.html b/core/app/core/src/lib/components/grid-widget/grid-widget.component.html
index 1cb67fffa..a23b9b172 100644
--- a/core/app/core/src/lib/components/grid-widget/grid-widget.component.html
+++ b/core/app/core/src/lib/components/grid-widget/grid-widget.component.html
@@ -62,7 +62,7 @@
                             </div>
                             <div *ngIf="statistics.loading && loading" class="widget-entry-loading">
 
-                                <scrm-inline-loading-spinner></scrm-inline-loading-spinner>
+                                <scrm-inline-loading-spinner klass="d-flex flex-row"></scrm-inline-loading-spinner>
 
                             </div>
                         </ng-container>
diff --git a/core/app/shell/src/themes/suite8/css/abstracts/_variables.scss b/core/app/shell/src/themes/suite8/css/abstracts/_variables.scss
index 1c0ad6199..d53086752 100644
--- a/core/app/shell/src/themes/suite8/css/abstracts/_variables.scss
+++ b/core/app/shell/src/themes/suite8/css/abstracts/_variables.scss
@@ -50,6 +50,7 @@ $pale-bue-grey: #9e9ba8;
 $dim-grey: dimgrey;
 $lightgray: lightgray;
 $extra-light-grey: #dee2e6;
+$highlight-grey: #9f9e9e;
 
 $geyser-blue: #d7dde1;
 $cool-blue: #76858f;
@@ -84,6 +85,7 @@ $coral-pink: #eb6657;
 $suite-logo-pink: #e67062;
 
 $bright-purple: #8d74cc;
+$highlight-purple: #b9a2f2;
 
 $wild-willow-green: #c6ca6b;
 $light-green: #93ae8a;
diff --git a/core/app/shell/src/themes/suite8/css/components/_subpanel.scss b/core/app/shell/src/themes/suite8/css/components/_subpanel.scss
index c37283d4e..5f0f36afe 100644
--- a/core/app/shell/src/themes/suite8/css/components/_subpanel.scss
+++ b/core/app/shell/src/themes/suite8/css/components/_subpanel.scss
@@ -153,7 +153,34 @@ div.widget-panel .panel-card .card-header {
 
       }
 
-      &:hover,
+      &:hover{
+        border-bottom: 1px solid $highlight-grey;
+
+        .grid-widget {
+          background-color: inherit;
+
+          .widget-entry-icon {
+            svg {
+              fill: $highlight-grey;
+              stroke: $highlight-grey;
+            }
+          }
+
+          .sub-panel-banner-button-title {
+            .widget-entry-label {
+              font-size: .62rem;
+              color: $highlight-grey;
+              font-weight: 900;
+            }
+          }
+
+          .sub-panel-banner-value {
+            .widget-entry-value {
+              color: $highlight-grey;
+            }
+          }
+        }
+      }
       &.sub-panel-banner-button-active {
         border-bottom: 1px solid $bright-purple;
 
@@ -169,6 +196,7 @@ div.widget-panel .panel-card .card-header {
 
           .sub-panel-banner-button-title {
             .widget-entry-label {
+              font-size: .62rem;
               color: $bright-purple;
               font-weight: 900;
             }
@@ -180,6 +208,35 @@ div.widget-panel .panel-card .card-header {
             }
           }
         }
+
+        &:hover {
+          border-bottom: 1px solid $highlight-purple;
+
+          .grid-widget {
+            background-color: inherit;
+
+            .widget-entry-icon {
+              svg {
+                fill: $highlight-purple;
+                stroke: $highlight-purple;
+              }
+            }
+
+            .sub-panel-banner-button-title {
+              .widget-entry-label {
+                font-size: .62rem;
+                color: $highlight-purple;
+                font-weight: 900;
+              }
+            }
+
+            .sub-panel-banner-value {
+              .widget-entry-value {
+                color: $highlight-purple;
+              }
+            }
+          }
+        }
       }
     }