diff --git a/nginx/vue/public/css/styles.css b/nginx/vue/public/css/styles.css
index 37ccaeb..39ae114 100644
--- a/nginx/vue/public/css/styles.css
+++ b/nginx/vue/public/css/styles.css
@@ -50,6 +50,8 @@
     --bg_quaternary: #888;
 
     --margin: 3px;
+    --padding: 3px;
+    --gap: 1px;
 
     /* FONTS USED */
     --font-heading: big_noodle_titling;
@@ -234,8 +236,16 @@ tr {
     box-sizing: border-box;
 }
 
-.margin1 {
-    margin: 10px;
+.margin {
+    margin: var(--margin);
+}
+
+.pad {
+    padding: var(--padding);
+}
+
+.gap {
+    gap: var(--gap);
 }
 
 /* ALIGNMENT */
@@ -250,6 +260,12 @@ tr {
     justify-content: center;
 }
 
+.left-content {
+    text-align: left;
+    align-items: left;
+    justify-content: left;
+}
+
 .flex-row {
     display: flex;
     flex-direction: row;
@@ -273,6 +289,14 @@ tr {
     padding: 2px;
 }
 
+.space-around {
+    justify-content: space-around;
+}
+
+.space-between {
+    justify-content: space-between;
+}
+
 .floating {
     position: absolute;
 }
diff --git a/nginx/vue/src/components/home/Collage.vue b/nginx/vue/src/components/home/Collage.vue
index 1b38b11..00118d7 100644
--- a/nginx/vue/src/components/home/Collage.vue
+++ b/nginx/vue/src/components/home/Collage.vue
@@ -1,6 +1,6 @@
 <template>
     <div>
-        <img src="/img/epic.jpeg" />
+        <img src="/img/memes/pidgeon.gif" />
     </div>
 </template>
 
diff --git a/nginx/vue/src/components/home/Favorites.vue b/nginx/vue/src/components/home/Favorites.vue
index 24a8ad9..392311b 100644
--- a/nginx/vue/src/components/home/Favorites.vue
+++ b/nginx/vue/src/components/home/Favorites.vue
@@ -1,7 +1,7 @@
 <template>
     <div class="flex-col">
         <h2>favs</h2>
-        <div class="fill flex-row center-content scroll">
+        <div class="fill flex-col center-content scroll">
             <table>
                 <tbody>
                     <tr>
diff --git a/nginx/vue/src/components/home/Feed.vue b/nginx/vue/src/components/home/Feed.vue
index 2ae7505..31a7948 100644
--- a/nginx/vue/src/components/home/Feed.vue
+++ b/nginx/vue/src/components/home/Feed.vue
@@ -66,7 +66,7 @@ onMounted(() => {
 </script>
 
 <template>
-    <div v-if="fetched" class="center-content">
+    <div v-if="fetched" class="flex-row center-content">
         <h2>{{ post.title }}</h2>
         <div>{{ post.content }}</div>
         <p>by: {{ post.author.username }}</p>
@@ -77,7 +77,7 @@ onMounted(() => {
         <button v-if="!rightCap" @click="nextPost">Next</button>
         <button v-if="userOwnsPost" @click="deletePost">Delete</button>
     </div>
-    <div v-else>
+    <div class="flex-col pad" v-else>
         <h2>Can't fetch from the db yo</h2>
     </div>
 </template>
diff --git a/nginx/vue/src/components/home/Gym.vue b/nginx/vue/src/components/home/Gym.vue
index 2e65a5a..877323c 100644
--- a/nginx/vue/src/components/home/Gym.vue
+++ b/nginx/vue/src/components/home/Gym.vue
@@ -1,5 +1,5 @@
 <template>
-    <div class="flex-row center-content">
+    <div class="flex-col center-content">
         <h2>Gym</h2>
         <p>I'm not a gym geek but I have a consistent routine:</p>
         <table>
diff --git a/nginx/vue/src/components/home/Intro.vue b/nginx/vue/src/components/home/Intro.vue
index 126a0f2..90264d8 100644
--- a/nginx/vue/src/components/home/Intro.vue
+++ b/nginx/vue/src/components/home/Intro.vue
@@ -1,8 +1,30 @@
 <template>
-    <div class="fill flex-col">
-        <div class="div">
-            <h1>Hello</h1>
-            <p>Nice to meet you</p>
-        </div>
+    <div class="fill flex-col pad left-content">
+        <h2>Intro</h2>
+        <p>
+            Hi, I'm Adam, thank you for visiting my website. I'm currently a 20
+            something graduate looking for work. I like to game, listen to lots
+            of music and occasionally watch anime.
+        </p>
+        <h2>Getting around</h2>
+        <p>
+            Pages available can be traversed through links below. I am hoping to
+            add some shrines, code-walkthoughs, live chat and page transitions
+            at a later date.
+        </p>
+        <h2>Contact</h2>
+        <p>
+            Please email me <a href="mailto:adam.a.french@outlook.com">here</a>,
+            or contact me though any of the social medias linked.
+        </p>
+        <h2>A Quote</h2>
+        <!-- <p>
+            What makes me a good demoman? If I were a bad demoman, I wouldn't be
+            sittin' here discussin' it with you, now would I?!
+        </p> -->
+        <p>
+            One crossed wire, one wayward pinch of potassium chlorate, one
+            errant twitch, and KA-BLOOIE!
+        </p>
     </div>
 </template>
diff --git a/nginx/vue/src/components/home/Links.vue b/nginx/vue/src/components/home/Links.vue
index 486cda7..fc8567f 100644
--- a/nginx/vue/src/components/home/Links.vue
+++ b/nginx/vue/src/components/home/Links.vue
@@ -1,24 +1,28 @@
 <template>
-    <div class="flex-col">
-        <RouterLink class="bdr-secondary" to="/cv">
-            <h1>CV</h1>
-        </RouterLink>
-        <RouterLink class="bdr-secondary" to="/admin">
-            <h1>ADMIN</h1>
-        </RouterLink>
-        <a
-            class="bdr-secondary"
-            href="https://steamcommunity.com/id/SteveThePug"
-            ><h1>Steam</h1></a
-        >
-        <a href="https://github.com/SteveThePug" class="bdr-secondary"
-            ><h1>Github</h1></a
-        >
-        <a
-            href="https://open.spotify.com/user/stevethepug"
-            class="bdr-secondary"
-        >
-            <h1>Spotify</h1></a
-        >
+    <div class="flex-col space-between">
+        <div class="flex-col gap">
+            <RouterLink class="bdr-secondary" to="/cv">
+                <h1>CV</h1>
+            </RouterLink>
+            <RouterLink class="bdr-secondary" to="/admin">
+                <h1>ADMIN</h1>
+            </RouterLink>
+        </div>
+        <div class="flex-col gap">
+            <a
+                class="bdr-secondary"
+                href="https://steamcommunity.com/id/SteveThePug"
+                ><h1>Steam</h1></a
+            >
+            <a href="https://github.com/SteveThePug" class="bdr-secondary"
+                ><h1>Github</h1></a
+            >
+            <a
+                href="https://open.spotify.com/user/stevethepug"
+                class="bdr-secondary"
+            >
+                <h1>Spotify</h1></a
+            >
+        </div>
     </div>
 </template>
diff --git a/nginx/vue/src/components/home/Listening.vue b/nginx/vue/src/components/home/Listening.vue
index 7f76f97..a590b31 100644
--- a/nginx/vue/src/components/home/Listening.vue
+++ b/nginx/vue/src/components/home/Listening.vue
@@ -37,13 +37,13 @@ onMounted(() => {
             v-if="fetched"
             :key="song"
             v-on:click="nextSong"
-            class="flex-row center-content"
+            class="flex-col center-content"
         >
             <img :src="song.track.album.images[0].url" />
             <p><strong>Song:</strong> {{ song.track.name }}</p>
             <p><strong>Artist:</strong> {{ song.track.artists[0].name }}</p>
         </div>
-        <div v-else class="flex-row center-content">
+        <div v-else class="flex-col center-content">
             <img src="/img/Untitled.png" />
             <p>I ain't listenin to nofin rn :/</p>
         </div>
diff --git a/nginx/vue/src/components/home/Stamps.vue b/nginx/vue/src/components/home/Stamps.vue
index 5715ec8..d004705 100644
--- a/nginx/vue/src/components/home/Stamps.vue
+++ b/nginx/vue/src/components/home/Stamps.vue
@@ -1,9 +1,12 @@
 <template>
-    <div class="flex-row">
+    <div class="flex-col center-content">
+        <div class="flex-row">
+            <img src="/img/stamps/portal.gif" />
+            <img src="/img/stamps/miku.gif" />
+            <img src="/img/stamps/utau.gif" />
+        </div>
         <div>
-            <!-- <img src="/img/stamps/12351B56-A370-465D-A951-739A480A05EC.gif" />
-            <img src="/img/stamps/71663263-8E08-4873-8EE1-96DC342C57EB.gif" />
-            <img src="/img/stamps/8a0014c1.gif" /> -->
+            <p>more soon (will diy some)</p>
         </div>
     </div>
 </template>
diff --git a/nginx/vue/src/components/home/Watching.vue b/nginx/vue/src/components/home/Watching.vue
index 35a551f..36bc23d 100644
--- a/nginx/vue/src/components/home/Watching.vue
+++ b/nginx/vue/src/components/home/Watching.vue
@@ -1,9 +1,13 @@
 <template>
     <div class="flex-col center-content">
-        <h2>Watching/Playing</h2>
+        <h2>Consumption</h2>
         <div class="scroll fill">
             <table>
                 <tbody>
+                    <tr>
+                        <th>Book</th>
+                        <td>Atomic Habits</td>
+                    </tr>
                     <tr>
                         <th>Movie</th>
                         <td>Funny Pages</td>
diff --git a/nginx/vue/src/views/Home.vue b/nginx/vue/src/views/Home.vue
index b07ec04..a0a7b0a 100644
--- a/nginx/vue/src/views/Home.vue
+++ b/nginx/vue/src/views/Home.vue
@@ -17,13 +17,13 @@ import Overlay from "@/components/Overlay.vue";
     <Halftone />
     <main class="center-content flex-col">
         <div class="a4page-portrait bdr-1 grid relative">
-            <Overlay>
-                <!-- <img src="/img/memes/star.gif" class="ov1" /> -->
-                <!-- <img src="/img/memes/welcome2.png" class="ov2" /> -->
-                <img src="/img/memes/pidgeon.gif" class="ov3" />
-                <img src="/img/memes/no_slip.png" class="ov5" />
-                <!-- <img src="/img/memes/beer.png" class="ov6" /> -->
-            </Overlay>
+            <!-- <Overlay> -->
+            <!-- <img src="/img/memes/star.gif" class="ov1" /> -->
+            <!-- <img src="/img/memes/welcome2.png" class="ov2" /> -->
+            <!-- <img src="/img/memes/pidgeon.gif" class="ov3" /> -->
+            <!-- <img src="/img/memes/no_slip.png" class="ov5" /> -->
+            <!-- <img src="/img/memes/beer.png" class="ov6" /> -->
+            <!-- </Overlay> -->
 
             <Intro class="intro bdr-primary bg-primary" />
             <Listening class="listening bdr-primary bg-primary" />