diff --git a/devcon/src/components/domain/index/hero/dc7/typewriter/index.ts b/devcon/src/components/domain/index/hero/dc7/typewriter/index.ts
new file mode 100644
index 000000000..e69de29bb
diff --git a/devcon/src/pages/404.tsx b/devcon/src/pages/404.tsx
index cedb90e53..fb5c20d0c 100644
--- a/devcon/src/pages/404.tsx
+++ b/devcon/src/pages/404.tsx
@@ -2,7 +2,7 @@ import React from 'react'
 import Image404 from 'assets/images/404.png'
 import themes from './themes.module.scss'
 import { PageHero } from 'components/common/page-hero'
-import Image from "next/legacy/image"
+import Image from 'next/image'
 import css from './404.module.scss'
 import { GetPage } from 'services/page'
 import { pageHOC } from 'context/pageHOC'
@@ -12,19 +12,18 @@ import Page from 'components/common/layouts/page'
 const FourOhFour = pageHOC(() => {
   return (
     <Page theme={themes['no-page']}>
-      <PageHero
+      {/* <PageHero
         path={[
           { text: <span className="bold">4</span> },
           { text: <span className="bold">0</span> },
           { text: <span className="bold">4</span> },
         ]}
-      />
+      /> */}
 
       <div className="section clear-top clear-bottom">
-        <div className={css['container']}>
-          <div className={css['center']}>
-            <Image src={Image404} alt="Man looking for something" />
-          </div>
+        <div className="flex flex-col items-center justify-center">
+          <h1 className="mb-4">Page Not Found >:(</h1>
+          <Image src={Image404} alt="Man looking for something" style={{ width: 'min(100%, 600px)' }} />
         </div>
       </div>
     </Page>