diff --git a/docs/404.html b/docs/404.html
index 1773388c6923..4338293218cc 100644
--- a/docs/404.html
+++ b/docs/404.html
@@ -1,8 +1,8 @@
 ---
 permalink: /404.html
 ---
-<div class="centered-content with-lhn">
-    <img class="icon" src="/assets/images/hourglass.svg" />
+<div class="centered-content">
+    <img class="icon" src="/assets/images/circle-hourglass.svg" />
     <strong>Hmm it's not here...</strong>
     <div>That page is nowhere to be found.</div>
 </div>
diff --git a/docs/_sass/_main.scss b/docs/_sass/_main.scss
index bc9d19bfca11..52a45e39d8d4 100644
--- a/docs/_sass/_main.scss
+++ b/docs/_sass/_main.scss
@@ -564,30 +564,13 @@ button {
 }
 
 .centered-content {
-    height: 240px;
+    width: 100%;
+    height: calc(100vh - 56px);
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
     text-align: center;
-    font-size: larger;
-    position: absolute;
-    top: calc((100vh - 240px) / 2);
-
-    width: 380px;
-    right: calc((100vw - 380px) / 2);
-    @include breakpoint($breakpoint-tablet) {
-        width: 500px;
-        right: calc((100vw - 500px) / 2);
-    }
-
-    &.with-lhn {
-        right: calc((100vw - 380px) / 2);
-
-        @include breakpoint($breakpoint-tablet) {
-            right: calc((100vw - 320px - 500px ) / 2);
-        }
-
-        @include breakpoint($breakpoint-desktop) {
-            right: calc((100vw - 420px - 500px) / 2);
-        }
-    }
 
     div {
         margin-top: 8px;