diff --git a/index.html b/index.html
index 68a41c4..f9d1d7b 100644
--- a/index.html
+++ b/index.html
@@ -25,15 +25,13 @@
 <main>
     <section class="hero">
         <div>
-            <div>
-                <h1>Słodkości tworzone z <span>pasją</span></h1>
-                <p>Naturalne składniki, domowe receptury i pasja. Tworzymy torty i wypieki na Twoje najważniejsze chwile
-                    - od codziennych radości po wielkie uroczystości</p>
-                <a href="wyroby.html" class="btn">Zobacz naszą ofertę</a>
-            </div>
-            <div>
-                <img alt="tort" src="images/001.jpg"/>
-            </div>
+            <h1>Słodkości tworzone z <span>pasją</span></h1>
+            <p>Naturalne składniki, domowe receptury i pasja. Tworzymy torty i wypieki na Twoje najważniejsze chwile
+                - od codziennych radości po wielkie uroczystości</p>
+            <a href="wyroby.html" class="btn">Zobacz naszą ofertę</a>
+        </div>
+        <div>
+            <img alt="tort" src="images/001.jpg"/>
         </div>
     </section>
     <section class="about-us">
diff --git a/style.css b/style.css
index 60e8a74..a86a2ec 100644
--- a/style.css
+++ b/style.css
@@ -30,20 +30,16 @@ nav > div {
         grid-template-columns: 1fr 1fr;
         grid-template-rows: 1fr 1fr;
         gap: 1rem;
+        & > .btn {
+            grid-column: 2;
+            grid-row: 1;
+        }
     }
 
     & :last-child {
         justify-self: end
     }
 
-
-    & > .btn {
-        @media (max-width: 768px) {
-            grid-column: 2;
-            grid-row: 1;
-        }
-    }
-
     & > div {
         display: flex;
         align-items: center;
@@ -87,40 +83,47 @@ nav > div {
     max-width: var(--max-content-width);
     height: 800px;
 
-    & > div {
-        display: grid;
-        grid-template-columns: 1fr 1fr;
-        gap: 2rem;
+    display: grid;
+    grid-template-columns: 1fr 1fr;
+    gap: 2rem;
 
-        & > div {
-            display: flex;
-            justify-content: center;
+    @media (max-width: 768px) {
+        gap: 0;
+        grid-template-columns: 1fr;
+        padding-bottom: 4rem;
+        & > :last-child {
+            grid-row: 1;
         }
 
-        /* left portion */
-
         & > :first-child {
-            align-items: flex-start;
-            flex-direction: column;
-            gap: 1rem;
+            grid-row: 2;
         }
+    }
 
-        /* right portion */
+    & > div {
+        display: flex;
+        justify-content: center;
+    }
 
-        & > :last-child {
-            align-items: center;
+    & > :first-child {
+        align-items: flex-start;
+        flex-direction: column;
+        gap: 1rem;
+    }
 
-            & > img {
-                rotate: 2deg;
-                border-radius: var(--border-radius);
-                max-width: 100%;
-                max-height: 80%;
-                aspect-ratio: 4/5;
-                transition: rotate 0.7s;
+    & > :last-child {
+        align-items: center;
 
-                &:hover {
-                    rotate: 0deg;
-                }
+        & > img {
+            rotate: 2deg;
+            border-radius: var(--border-radius);
+            max-width: 100%;
+            max-height: 80%;
+            aspect-ratio: 4/5;
+            transition: rotate 0.7s;
+
+            &:hover {
+                rotate: 0deg;
             }
         }
     }