diff --git a/src/app/favicon.ico b/src/app/favicon.ico
deleted file mode 100644
index 718d6fe..0000000
Binary files a/src/app/favicon.ico and /dev/null differ
diff --git a/src/app/favicon.png b/src/app/favicon.png
new file mode 100644
index 0000000..8853319
Binary files /dev/null and b/src/app/favicon.png differ
diff --git a/src/app/layout.tsx b/src/app/layout.tsx
index 03e733d..12cf876 100644
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -2,10 +2,18 @@ import '@/css/globals.css';
 import Dots from '@/components/Dots';
 import {Metadata} from 'next';
 import { LanguageContextProvider } from './context/language'
+import Favicon from './favicon.png';
 
 export const metadata: Metadata = {
   title: 'AB10110F',
   description: 'Portfolio',
+  icons: [
+    { rel: 'icon', url: Favicon.src, }
+  ],
+  openGraph: {
+    ...Favicon,
+    title: 'AB10110F-Personal Website',
+  },
 }
 
 export default function RootLayout({
diff --git a/src/app/page.tsx b/src/app/page.tsx
index 64bb67e..763fd00 100644
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -38,7 +38,7 @@ export default function Home() {
       <Typewriter text={title}/>
       <div className={styles.grid}>
             <Terminal/>
-            <section className={styles.column}>
+            <aside className={styles.column}>
                 <section className ={styles.languageContainer}>
                     <article className={styles.canvas}>
                         <Model/>
@@ -49,7 +49,7 @@ export default function Home() {
                 <article className={styles.controls}>
                     <CrtSwitch changeState={(currentCrt) => setCrt(currentCrt)} />
                 </article>
-            </section>
+            </aside>
       </div>
     </main>
   )
diff --git a/src/css/globals.css b/src/css/globals.css
index aefe273..5bbf830 100644
--- a/src/css/globals.css
+++ b/src/css/globals.css
@@ -1,8 +1,4 @@
-@media (prefers-color-scheme: dark) {
   :root {
-    --foreground-rgb: 255, 255, 255;
-    --background-start-rgb: 0, 0, 0;
-    background-color: black; /*TODO*/
     --background-end-rgb: 0, 0, 0;
 
     --primary-glow: radial-gradient(rgba(1, 65, 255, 0.4), rgba(1, 65, 255, 0));
@@ -13,7 +9,6 @@
       rgba(1, 65, 255, 0.3)
     );
   }
-}
 
 * {
   box-sizing: border-box;
@@ -25,6 +20,10 @@
 ::-webkit-scrollbar{height: 10px; width: 10px;}
 ::-webkit-scrollbar-thumb{background:#fdfdfd; border-radius: 0px;}
 
+html{
+  background-color: black; /*TODO*/
+}
+ 
 html,
 body {
   max-width: 100vw;
diff --git a/src/css/page.module.css b/src/css/page.module.css
index d1348ba..5064009 100644
--- a/src/css/page.module.css
+++ b/src/css/page.module.css
@@ -153,31 +153,33 @@
 
 @media only screen and (max-width: 760px)
 {
-    .grid
-    {
-        flex-direction: column;
-    }
-    .column
-    {
-        width: 100%;
-        height: 150%;
-    }
-
-    .main h1 
-    {
-      font-size: 5vh;
-      text-align: center;
-      margin: 0 0 7% 0
-    }
-    
-    .bright h1 
-    {
-      font-size: 5vh;
-      text-align: center;
-      margin: 0 0 7% 0
-    }
-    .canvas
-    {
-      width: 45%;
-    }
+  .grid
+  {
+      flex-direction: column;
+  }
+  .column
+  {
+      width: 100%;
+      height: 150%;
+  }
+  .main h1 
+  {
+    font-size: 5vh;
+    text-align: center;
+    margin: 0 0 7% 0;
+    height: 12vh;
+    text-align: center;
+    justify-content: center;
+  }
+  
+  .bright h1 
+  {
+    font-size: 5vh;
+    text-align: center;
+    margin: 0 0 7% 0;
+  }
+  .canvas
+  {
+    width: 45%;
+  }
 }
\ No newline at end of file