diff --git a/app/assets/stylesheets/components/message.scss b/app/assets/stylesheets/components/message.scss
index 58341ba31..9e5f8b312 100644
--- a/app/assets/stylesheets/components/message.scss
+++ b/app/assets/stylesheets/components/message.scss
@@ -100,6 +100,34 @@ $message-type-bottom-spacing: govuk-spacing(4);
 
       }
 
+      .template-list-template,
+      .template-list-folder {
+
+        position: relative; /* contain absolutely positioned ::before pseudo element*/
+        display: block; /* fill horizontal space to allow hint/meta below to float */
+
+        &::before {
+          content: '';
+          position: absolute;
+          left: 0px;
+          bottom: -100%; /* extend link by 100% of vertical size so it covers the hint/meta */
+          width: 100%;
+          height: 100%;
+        }
+
+        &:active::before,
+        &:focus::before {
+          background-color: $govuk-focus-colour;
+          box-shadow: 0px -2px $govuk-focus-colour, 0px 4px $govuk-focus-text-colour;
+        }
+
+        & + .template-list-item-hint,
+        & + .message-type {
+          position: relative; /* needs to be non-static to have a z-index above the link :before element */
+        }
+
+      }
+
     }
 
     &-label {