add 404 page

assets/css/basic.scss

@@ -7,7 +7,7 @@ body {
   padding: 0;
   background-color: var(--background);
   color: var(--foreground);
-  font-family: 'Ubuntu', 'Twemoji' sans-serif;
+  font-family:  'Mononoki', 'Ubuntu', 'Twemoji' sans-serif;
   max-width: 1000px;
   margin: 0 auto;
   box-shadow: 0px -30px 20px rgba(0, 0, 0, 0.5);
@@ -49,7 +49,9 @@ p code, quote code, q code{
 img {
     width: 100%;
 }
+
 @import "logo";
+@import "page-404";
 @import "elements/page-links";
 @import "elements/recent-list";
 @import "elements/contacts";

assets/css/page-404.scss

@@ -0,0 +1,18 @@
+.not-found{
+    display: flex;			     
+    justify-content: center;
+    font-size: 25px;
+    line-height: 28px;
+    color: var(--selection);
+    tansition: 0.3s;
+}
+
+
+@media screen and (max-width: 500px) {
+    .not-found {
+	font-size: 14px;
+	line-height: 14px;
+    }
+}
+
+

layouts/404.html

@@ -0,0 +1,15 @@
+
+{{ define "main"}}
+    <main id="main">
+      <div class="not-found" >
+	<pre>
+░░░░░░░░░░░█░█░▄▀▄░█░█░░░░░░░░░░░░░
+░░░░░░░░░░░░▀█░█░█░░▀█░░░░░░░░░░░░░
+░░░░░░░░░░░░░▀░░▀░░░░▀░░░░░░░░░░░░░
+░█▀█░█▀█░▀█▀░░░█▀▀░█▀█░█░█░█▀█░█▀▄░
+░█░█░█░█░░█░░░░█▀▀░█░█░█░█░█░█░█░█░
+░▀░▀░▀▀▀░░▀░░░░▀░░░▀▀▀░▀▀▀░▀░▀░▀▀░░
+	</pre>
+      </div>
+    </main>
+{{ end }}