diff --git a/docs/index.md b/docs/index.md
index 636e60f..536c498 100644
--- a/docs/index.md
+++ b/docs/index.md
@@ -90,7 +90,7 @@ window.addEventListener('scroll', () => {
      ">
 -->
 
-<!-- Förgrundsbild med korrekt skalförhållande -->
+<!-- Förgrundsbild med responsiv skalning -->
 <div style="
   position: absolute;
   top: 0;
@@ -102,14 +102,22 @@ window.addEventListener('scroll', () => {
   justify-content: center;
   z-index: -1;
 ">
-  <img src="assets/SL6CV.jpg" style="
+  <img src="assets/SL6CV.jpg" id="main-image" style="
     max-height: 100vh;
     max-width: 100vw;
     width: auto;
     height: auto;
+    transition: transform 0.3s ease;
   ">
 </div>
 
+<style>
+  @media (min-width: 768px) {
+    #main-image {
+      transform: scale(1.2); /* Zooma in på större skärmar */
+    }
+  }
+</style>
 
 <!-- Scrollknapp -->
 <button id="scrollButton" onclick="scrollToContent()"