diff --git a/components/Socials.vue b/components/Socials.vue
index f47e0f9..1fb635a 100644
--- a/components/Socials.vue
+++ b/components/Socials.vue
@@ -7,6 +7,7 @@
   <style>
   .socials {
     display: flex;
+    flex-wrap: wrap;
     align-items: center;
     gap: 1rem;
   
diff --git a/pages/blog-index.vue b/pages/blog-index.vue
index 6345f48..8edf52b 100644
--- a/pages/blog-index.vue
+++ b/pages/blog-index.vue
@@ -1,6 +1,7 @@
 <template>
   <main>
-    <a href="/"><-- Return Home</a>
+    <!-- <a href="/"><-- Return Home</a> -->
+    <BigButton text="<<< Return Home" href="/"/>
     <h1>Tom's Blog</h1>
     
     <p class="no-margin" v-if="qSupplied">Selected Tag: <strong>{{query}}</strong> <a v-if="qSupplied" href="blog-index">(Clear Search)</a></p>
diff --git a/pages/blog/[...slug].vue b/pages/blog/[...slug].vue
index 5032634..83efecb 100644
--- a/pages/blog/[...slug].vue
+++ b/pages/blog/[...slug].vue
@@ -10,7 +10,8 @@
 
 <template>
     <main>
-      <a href="javascript:window.history.back();"><-- Go Back</a>
+      <!-- <a href="javascript:window.history.back();"><-- Go Back</a> -->
+      <BigButton text="<<< Return to blog listing" href="/blog-index"/>
       <ContentDoc v-slot="{ doc }">
         <article class="post">
           <h1>{{ doc.title }}</h1>
@@ -30,7 +31,23 @@
   
 <style>
   .post{
-    width: 80%;
+    width: 50%;
+    
+  }
+
+  /* i wonder if this will cause issues */
+  img{ 
+    width: 100%;
+  }
+
+  @media (max-width: 1000px){
+    .post{
+      width: 80%;
+    }
+
+    img{
+      width: 100%;
+    }
   }
 
   main {