diff --git a/src/components/molecules/HomeSectionWrapper.vue b/src/components/molecules/HomeSectionWrapper.vue
index 5a308c0..567457d 100644
--- a/src/components/molecules/HomeSectionWrapper.vue
+++ b/src/components/molecules/HomeSectionWrapper.vue
@@ -1,6 +1,6 @@
 <template>
-  <div class="box my-6 px-4 py-5 columns is-vcentered">
-    
+  <div class="box my-5 px-4 py-3 columns is-vcentered">
+
       <template v-if="reverse">
         <div class="column">
           <h2 class="title is-4">{{ title }}</h2>
diff --git a/src/components/molecules/LearningResourceWrapper.vue b/src/components/molecules/LearningResourceWrapper.vue
index d40d39f..180967a 100644
--- a/src/components/molecules/LearningResourceWrapper.vue
+++ b/src/components/molecules/LearningResourceWrapper.vue
@@ -1,16 +1,21 @@
 <template>
-  <div class="box m-3 p-3 columns">
+  <div class="box m-3 p-3 columns is-vcentered">
     <div class="column is-one-quarter" v-if="image">
-      <figure class="image">
+      <figure class="image is-128x128">
         <img :src="image" :alt="alt" />
       </figure>
     </div>
     <div class="column">
-      <h2 class="title">{{ title }}</h2>
-      <p class="has-text-white is-size-4 mb-4">{{ desc }}</p>
-      <h3 class="is-size-3">
-        <a :href="link" target="_blank" rel="noopener noreferrer nofollow">{{ link }}</a>
-      </h3>
+      <h4 class="title">{{ title }}</h4>
+      <p class="has-text-white is-size-5 mb-3">{{ desc }}</p>
+      <a
+        :href="link"
+        target="_blank"
+        rel="noopener noreferrer nofollow"
+        class="button is-link is-medium has-text-white"
+      >
+        {{ link }}
+      </a>
     </div>
   </div>
 </template>
diff --git a/src/components/pages/HomePage.vue b/src/components/pages/HomePage.vue
index d8f4f0e..b00dec1 100644
--- a/src/components/pages/HomePage.vue
+++ b/src/components/pages/HomePage.vue
@@ -1,8 +1,8 @@
 <template>
-	<div class="min-h-screen flex flex-col" style="gap: 4rem">
+	<div class="min-h-screen flex flex-col">
 		<!-- Main application wrapper -->
     <section class="section">
-      <h1 class="title has-text-black p-6">BRÅTULA VIOSSA.NET MÅDE</h1>
+      <h1 class="title has-text-black p-3">BRÅTULA VIOSSA.NET MÅDE</h1>
     </section>
 
     <section class="section">
diff --git a/src/components/pages/ResourcesPage.vue b/src/components/pages/ResourcesPage.vue
index 976346f..12c14a6 100644
--- a/src/components/pages/ResourcesPage.vue
+++ b/src/components/pages/ResourcesPage.vue
@@ -2,7 +2,7 @@
 	<div class="min-h-screen flex flex-col" style="gap: 4rem">
 		<!-- Main application wrapper -->
     <section class="section">
-      <h1 class="title has-text-black p-6">Learning Resources</h1>
+      <h1 class="title has-text-black p-3">Learning Resources</h1>
     </section>
 
     <section class="section">