diff --git a/_data/88x31.toml b/_data/88x31.toml
index f9be971..cbc31f8 100644
--- a/_data/88x31.toml
+++ b/_data/88x31.toml
@@ -7,6 +7,7 @@ people = [
 ]
 
 misc = [
-    { image = "parentaladvisory", alt = "sorry..." }
+    { image = "parentaladvisory", alt = "sorry..." },
+    { image = "4everfriend", alt = "yay!!" }
 ]
 
diff --git a/_includes/footer.njk b/_includes/footer.njk
index 1a64cb1..91de27b 100644
--- a/_includes/footer.njk
+++ b/_includes/footer.njk
@@ -1 +1 @@
-<p><img src="/img/buttons/parentaladvisory.gif" alt="sorry..."><br>est. 2025 | yuki (c) <a href="LICENSE.txt">Do What the Fuck You Want to Public License</a> </p>
\ No newline at end of file
+<p><img src="/img/buttons/4everfriend.gif" alt="yay!!"><img src="/img/buttons/parentaladvisory.gif" alt="sorry..."><br>est. 2025 | yuki &#169; <a href="LICENSE.txt">Do What the Fuck You Want to Public License</a> </p>
\ No newline at end of file
diff --git a/_layouts/base.njk b/_layouts/base.njk
index 678bf7f..d93f994 100644
--- a/_layouts/base.njk
+++ b/_layouts/base.njk
@@ -12,9 +12,11 @@
                 </div>
                 {% include "topmost_navbar.njk" %}
             </div>
-
-            {{ content | safe }}
-
+            
+            <div class="base-content-wrapper">
+                {{ content | safe }}
+            </div>
+            
             <footer>
                 <marquee behavior="scroll" direction="left">
                     <img src="/img/Witch-on-broom.gif" alt="">
diff --git a/_layouts/home.njk b/_layouts/home.njk
index aac5d5f..8e243e6 100644
--- a/_layouts/home.njk
+++ b/_layouts/home.njk
@@ -1,9 +1,10 @@
 ---
 layout: base
+title: home
 ---
 <div class="welcome-aside-left">
     <div class="buttons-wrapper box">
-        <h2><i>please visit...</i></h3>
+        <h2>please visit...</h3>
         <div class="buttons">
             {% for button in 88x31.buttons.people.slice(0, 5) %}
             <a href="{{ button.link }}" title="{{ button.name }}">
@@ -16,6 +17,10 @@ layout: base
             {% endfor %}
         </div>
     </div>
+    <div class="now-playing-wrapper box">
+        <h2>last played</h2>
+        <div class="now-playing"><p>test</p></div>
+    </div>
 </div>
 
 <div class="welcome-content">
@@ -25,10 +30,10 @@ layout: base
 
 <div class="welcome-aside-right">
     <div class="recent-posts box">
-        <h2><i>recent posts</i></h2>
+        <h2>recent posts</h2>
         <ul>
-        {% for post in collections.post.slice(0, 3) %}
-            <li><p><a href="{{ post.url }}">{{ post.data.title }}</a> <span class="date">| {{ post.date.toLocaleString("en-GB", {year: 'numeric', month: '2-digit', day: '2-digit'}) }}</span></p></li>
+        {% for post in collections.post.slice(0, 5) %}
+            <li><p><a href="{{ post.url }}">{{ post.data.title }}</a> | <span class="date"> {{ post.date.toLocaleString("en-GB", {year: 'numeric', month: '2-digit', day: '2-digit'}) }}</span></p></li>
         {% endfor %}
         </ul>
     </div>
diff --git a/css/main.scss b/css/main.scss
index a63eaff..bb8c860 100644
--- a/css/main.scss
+++ b/css/main.scss
@@ -75,6 +75,71 @@ body {
     }
 }
 
+.base-content-wrapper {
+    display: flex;
+    align-items: flex-start;
+
+    .box {
+        border: 1px solid mp.$border;
+        margin: 10px;
+
+        h2 {
+            padding: 2px;
+            margin-bottom: 4px;
+            border-bottom: 1px solid mp.$border;
+            font-family: fonts.$ll;
+            font-size: 1em;
+            background: mp.$bg;
+            background: linear-gradient(0deg,rgba(0, 0, 0, 1) 10%, c.adjust($color: mp.$link, $saturation: 4%, $lightness: -20%) 100%);
+        }
+    }
+
+    .welcome-aside-left {
+        width: max-content;
+        
+        .buttons-wrapper {
+            width: 190px;
+            .buttons {
+                display: flex;
+                align-items: flex-start;
+                flex-direction: row;
+                flex-wrap: wrap;
+                justify-content: space-evenly;
+                img {
+                    padding: 0;
+                    margin: 0;
+                }
+            } 
+        }
+    }
+
+    .welcome-content {
+        margin: 8px 4px;
+        h1 {
+            font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
+            font-size: 1em;
+        }
+    }
+
+    .welcome-aside-right {
+        width: max-content;
+        
+        .recent-posts {
+            width: 190px;
+            ul {
+                padding: 0 0 4px 0;
+                list-style: none;
+                text-align: center;
+                .date {
+                    vertical-align: middle;
+                    font-size: 0.9em;
+                    color: c.adjust($color: mp.$text, $lightness: -10%);
+                }
+            }
+        }
+    }
+}
+
 footer p {
     margin: 2px;
     font-size: 0.7em;
diff --git a/img/buttons/4everfriend.gif b/img/buttons/4everfriend.gif
new file mode 100644
index 0000000..68d5abc
Binary files /dev/null and b/img/buttons/4everfriend.gif differ
diff --git a/img/nekojiru.png b/img/nekojiru.png
index 8d9644f..1d5f504 100644
Binary files a/img/nekojiru.png and b/img/nekojiru.png differ
diff --git a/index.md b/index.md
index 10ffc54..7071725 100644
--- a/index.md
+++ b/index.md
@@ -1,4 +1,5 @@
 ---
 layout: home
 ---
+# hey...
 welcome to my site!! not much is done yet but please have a look around.