Got rid of scss files, fixet time format

app/pages/home/Hero.js

@@ -1,13 +1,23 @@
 import { Component } from 'react'
 import Image from 'next/image'
-import styles from './Hero.module.scss'
+import { Box } from '@mui/material'
 import logo from './assets/warframe_logo.png'
 
 export default class Hero extends Component {
   render () {
     return (
-      <div className={styles.hero}>
-        <div className={styles.logo}>
+      <Box
+        sx={{
+          py: 12,
+          textAlign: 'center'
+        }}
+      >
+        <Box
+          sx={{
+            width: 400,
+            m: 'auto'
+          }}
+        >
           <Image
             src={logo}
             alt='logo'
@@ -15,12 +25,17 @@ export default class Hero extends Component {
             width={500}
             height={300}
           />
-        </div>
-        <div className={styles.text}>
+        </Box>
+        <Box
+          sx={{
+            width: 400,
+            m: 'auto'
+          }}
+        >
           <h1>Market Gaps</h1>
           <p>Find a profitable difference between the price of the set and the price of the sum of it's parts.</p>
-        </div>
-      </div>
+        </Box>
+      </Box>
     )
   }
 }