diff --git a/src/App.sass b/src/App.sass
index d4d09c6..885f952 100644
--- a/src/App.sass
+++ b/src/App.sass
@@ -19,6 +19,7 @@
 @import "css/components/cards"
 
 // pages
+@import "css/pages/notfound"
 
 // themes
 
diff --git a/src/components/NotFound/index.js b/src/components/NotFound/index.js
index 5f0f507..b493a51 100644
--- a/src/components/NotFound/index.js
+++ b/src/components/NotFound/index.js
@@ -2,9 +2,8 @@ import React from 'react';
 
 const NotFound = () => (
   <div className={'NotFound'}>
-    <h1>
-      That is a 404.
-    </h1>
+    <h1 className={'Line'}>You look lost, friend.</h1>
+    <p className={'Line'}>Don&#39;t worry; it happens to all of us.</p>
   </div>
 );
 
diff --git a/src/css/pages/_notfound.sass b/src/css/pages/_notfound.sass
new file mode 100644
index 0000000..734c198
--- /dev/null
+++ b/src/css/pages/_notfound.sass
@@ -0,0 +1,39 @@
+.NotFound
+  text-align: center
+  //margin-top: 8%
+  //margin-left: 25%
+  width: 50%
+  height: 50%
+  //left: 50%
+  //right: 50%
+  -webkit-transform: rotate(10deg)
+  background-color: $black
+  color: $white
+  text-align: center
+  padding: 1%
+  position: absolute
+  top: 0
+  bottom: 0
+  left: 0
+  right: 0
+  margin: auto
+  @media (max-width: 1000px)
+    height: 25%
+  @media (max-width: 645px)
+    width: 200px
+    height: 310px
+    margin-left: auto
+    margin-right: auto
+
+h1
+  margin-top: 18%
+  @media (max-width: 1000px)
+    margin-top: 5%
+    font-size: 3em
+  @media (max-width: 645px)
+    margin-top: 5%
+
+p
+  @media(max-width: 1000px)
+    font-size: 1.75em
+    padding: 2px
\ No newline at end of file