diff --git a/src/styles/common-error-styles.scss b/src/styles/common-error-styles.scss
index def634dc..05575e71 100644
--- a/src/styles/common-error-styles.scss
+++ b/src/styles/common-error-styles.scss
@@ -1,151 +1,180 @@
 html {
-    .has-error {
+  .has-error {
+      // START HOVER
+      &.list-button-horizontal,
       &.list-button,
-      &.list-card,
-      &.list-card.list-button {
-        border: none;
-        color: $red;
-        input[type=checkbox]:focus + label,
-        input[type=radio]:focus + label {
-          box-shadow: 0 0 0 2.5px $red;
-        }
-        input[type=checkbox]:checked + label {
-          box-shadow: 0 0 0 1px $red;
-        }
-        &:hover {
-          box-shadow: 0px 0px 0px 4px $red-200;
-          border-radius: .5rem;
-        }
-        label {
+      &.list-button.list-group,
+      &.list-card {
           border: 1px solid $red;
-          border-radius: .5rem;
-        }
-        label:hover {
-          box-shadow: 0px 0px 0px 4px $red-200;
-          border-radius: 10px;
-          border: 1px solid $red;
-        }
+          position: relative;
+          z-index: 4;
+
+          .button-content {
+              border: none;
+          }
+
+          &:hover {
+              @include box-shadow-hover($red-200);
+              z-index: 5;
+          }
+          input[type="radio"]:focus + .list-button-content {
+              box-shadow: 0 0 0 2.5px $red;
+          }
+      }
+
+      &.ui-radio {
+          &:hover {
+              input[type="radio"],
+              input[type="checkbox"] {
+                  @include box-shadow-hover($red-200);
+              }
+          }
+      }
+      .form-check-input {
+          &:focus {
+              box-shadow: 0 0 0 2.5px $red;
+          }
+      }
+      // END HOVER
+
+      &.list-button,
+      &.list-card {
+          color: $red;
+
+          input[type="checkbox"]:focus + label,
+          input[type="radio"]:focus + label {
+              box-shadow: 0 0 0 2.5px $red;
+          }
+          input[type="checkbox"]:checked + label {
+              box-shadow: 0 0 0 1px $red;
+          }
+          &:hover {
+              border-radius: 0.5rem;
+          }
       }
       &.list-button-horizontal {
-        color: $red;
-        label {
-          border: 1px solid $red;
-          &:hover {
-            box-shadow: 0px 0px 0px 4px $red-200;
+          color: $red;
+          input[type="checkbox"]:focus + label,
+          input[type="radio"]:focus + label {
+              box-shadow: 0 0 1px $red;
+          }
+      }
+
+      &.grid-item {
+          input[type="radio"] {
+              + label {
+                  border: 1px solid $red;
+                  &:hover {
+                      background-color: $blue-100;
+                      box-shadow: 0px 0px 0px 4px $red-200;
+                  }
+              }
           }
-        }
-        input[type=checkbox]:focus + label,
-        input[type=radio]:focus + label {
-          box-shadow: 0 0 1px $red;
-        }
       }
       &.ui-radio,
       &.ui-checkbox {
-        input[type=checkbox],
-        input[type=radio],
-        input[type=radio]+label:before,
-        input[type=checkbox]+label:before {
-          border: 1px solid $red;
-          background-color: initial;
-        }
-        input[type=checkbox]:checked + label:before {
-          border: 1px solid $blue;
-        }
+          input[type="checkbox"],
+          input[type="radio"],
+          input[type="radio"] + label:before,
+          input[type="checkbox"] + label:before {
+              border: 1px solid $red;
+              background-color: initial;
+          }
+          input[type="checkbox"]:checked + label:before {
+              border: 1px solid $blue;
+          }
       }
       &.textbox-question,
       &.dropdown-question {
-        input:hover {
-          box-shadow: 0px 0px 0px 4px $red-200;
-          border-radius: .5rem;
-          border: 1px solid $red;
-        }
-        input:focus {
-          box-shadow: 0 0 0 2.5px $red;
-        }
-        p {
-          color: $red;
-        }
-        input,
-        select {
-          border: 1px solid transparent;
-          box-shadow: 0 0 0 1px $red;
-          &:focus {
-            border: 1px solid transparent;
+          p {
+              color: $red;
+          }
+          input,
+          select {
+              border: 1px solid $red;
+              &:focus {
+                  border: 1px solid transparent;
+                  box-shadow: 0 0 0 2.5px $red;
+              }
+
+              &:hover {
+                  box-shadow: 0px 0px 0px 4px $red-200;
+                  border-radius: 0.5rem;
+                  border: 1px solid $red;
+              }
+          }
+          select {
+              background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 8.89' xml:space='preserve'%3e%3cpath d='M8 8.89c-.24 0-.46-.09-.63-.26L.26 1.53a.901.901 0 0 1 0-1.27C.43.1.66 0 .9 0s.47.1.64.26L8 6.74 14.47.27c.17-.17.4-.27.64-.27s.47.1.63.27c.17.17.26.4.26.64s-.1.47-.27.63l-7.1 7.09a.86.86 0 0 1-.63.26z' fill='%23d4281c'/%3e%3c/svg%3e");
+              background-repeat: no-repeat;
+              background-position: right 0.75rem center;
+              background-size: 16px 12px;
           }
-        }
-        select {
-          background-image: url("data:image/svg+xml;charset=UTF-8,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 8.89' xml:space='preserve'%3e%3cpath d='M8 8.89c-.24 0-.46-.09-.63-.26L.26 1.53a.901.901 0 0 1 0-1.27C.43.1.66 0 .9 0s.47.1.64.26L8 6.74 14.47.27c.17-.17.4-.27.64-.27s.47.1.63.27c.17.17.26.4.26.64s-.1.47-.27.63l-7.1 7.09a.86.86 0 0 1-.63.26z' fill='%23d4281c'/%3e%3c/svg%3e");
-          background-repeat: no-repeat;
-          background-position: right 0.75rem center;
-          background-size: 16px 12px;
-        }
       }
-    }
-    //Restore to default style if alert box is present
-    .alertError {
+  }
+  //Restore to default style if alert box is present
+  .alertError {
       .has-error {
-        &.list-button,
-        &.list-card {
-          border: 1px solid $gray-500;
-          input:not(:focus) {
-            + label {
-              border: none;
-              box-shadow: 0 0 0 1px $gray-500;
-              border-radius: .5rem;
-            }
+          &.list-button,
+          &.list-card {
+              border: 1px solid $gray-500;
+              input:not(:focus) {
+                  + label {
+                      border: none;
+                      box-shadow: 0 0 0 1px $gray-500;
+                      border-radius: 0.5rem;
+                  }
+              }
+              input:checked:focus {
+                  + label {
+                      border: none;
+                      box-shadow: 0 0 0 2.5px $blue;
+                      border-radius: 0.5rem;
+                  }
+              }
+              input:checked:not(:focus) {
+                  + label {
+                      box-shadow: 0 0 0 1px $blue;
+                      border-radius: 0.5rem;
+                  }
+              }
+              input:focus {
+                  border: 1px solid $gray-500;
+                  + label {
+                      box-shadow: 0 0 0 2.5px transparent;
+                  }
+              }
+              &:hover {
+                  box-shadow: 0 0 0 4px $blue-300;
+                  + label {
+                      box-shadow: 0 0 0 2.5px transparent;
+                      border: 1px solid $blue;
+                  }
+              }
           }
-          input:checked:focus {
-            + label {
-              border: none;
-              box-shadow: 0 0 0 2.5px $blue;
-              border-radius: .5rem;
-            }
-          }
-          input:checked:not(:focus) {
-            + label {
-              box-shadow: 0 0 0 1px $blue;
-              border-radius: .5rem;
-            }
-          }
-          input:focus {
-            border: 1px solid $gray-500;
-            + label {
-              box-shadow: 0 0 0 2.5px transparent;
-            }
-          }
-          &:hover {
-            box-shadow: 0 0 0 4px $blue-300;
-            + label {
-              box-shadow: 0 0 0 2.5px transparent;
-              border: 1px solid $blue;
-            }
-          }
-        }
       }
-    }
-  
-    .form-test-error {
+  }
+
+  .form-test-error {
       color: $red;
-      font-size: .875rem;
+      font-size: 0.875rem;
       font-weight: 500;
-    }
-  
-    .form-test-invalid {
+  }
+
+  .form-test-invalid {
       &.btn.btn-primary {
-        color: $gray-600;
-        background: $gray-200;
-        cursor: pointer;
-        pointer-events: all;
-        font-weight: $font-weight-normal;
+          color: $gray-600;
+          background: $gray-200;
+          cursor: pointer;
+          pointer-events: all;
+          font-weight: $font-weight-normal;
       }
       &.btn.btn-primary:hover {
-        background: $gray-200;
-        box-shadow: none;
+          background: $gray-200;
+          box-shadow: none;
       }
       &.btn.btn-primary:focus,
       &.btn.btn-primary:focus-visible {
-        box-shadow: 0 0 0 3px $white, 0 0 0 5.5px $blue-700;
+          box-shadow: 0 0 0 3px $white, 0 0 0 5.5px $blue-700;
       }
-    }
   }
-  
\ No newline at end of file
+}