feat(aio): page not found layout and designs (#16089)

Add 404 svg image
h1 custom styling

PR Close #16089

aio/src/styles/1-layouts/_layout-global.scss

@@ -27,6 +27,9 @@ l-relative {
   flex-wrap: wrap;
 }
 
+.flex-center {
+    justify-content: center;
+}
 .flex-center {
     display: flex;
     justify-content: center;

aio/src/styles/1-layouts/_layouts-dir.scss

@@ -8,4 +8,5 @@
 @import 'top-menu';
 @import 'marketing-layout';
 @import 'footer';
-@import 'layout-global';
+@import 'layout-global';
+@import 'not-found';

aio/src/styles/1-layouts/_not-found.scss

@@ -0,0 +1,21 @@
+#file-not-found {
+    padding: 3rem 3rem 3rem;
+} 
+
+.nf-container {
+    align-items: center;
+    padding: 32px;
+}
+
+.nf-response {
+    margin: 32px;
+    height: 100%;
+    flex-direction: column;
+
+    h1 {
+        font-size: 48px;
+        color: $blue;
+        text-transform: uppercase;
+        margin: 8px 0;
+    }
+}