Add mascot to 404 page

client/src/app/+page-not-found/page-not-found.component.html

@@ -1,3 +1,7 @@
-<div i18n>
+<div class="root">
-  Sorry, but we couldn't find the page you were looking for.
+  <img src="/client/assets/images/mascot/defeated.png" alt="404 mascot">
-</div>
+
+  <div class="text" i18n>
+    Sorry, we couldn't find the page you were looking for.
+  </div>
+</div>

client/src/app/+page-not-found/page-not-found.component.scss

@@ -1,8 +1,18 @@
-div {
+.root {
   height: 100%;
   width: 100%;
   text-align: center;
   padding-top: 150px;
 
-  font-size: 32px;
+  img {
-}
+    margin-bottom: 75px;
+  }
+
+  .text {
+    font-size: 30px;
+  }
+
+  @media screen and (max-height: 600px) {
+    padding-top: 50px;
+  }
+}