diff --git a/styles/style.css b/styles/style.css
index 9571ab1..316b2ac 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -177,3 +177,80 @@ header {
 }
   
 /* Write your CSS below */
+
+@media all and (max-width: 760px) {
+
+  main {
+    column-gap: 2rem;
+  }
+
+  .main-article {
+    display:flex;
+    flex-direction:column;
+    align-items: center;
+    text-align: justify; 
+  }
+
+  .main-article h1, p {
+    width: 100%;
+  }
+
+  .navbar li {
+    border-top: 3px solid #fff;
+    width: 100%;
+  }
+
+  .navbar a {
+    display:flex;
+    flex-direction:column;
+    text-align: center;
+    justify-content: center;
+  }
+
+  .navbar {
+    display:flex;
+    flex-direction:column;
+    width: 100%;
+  }
+
+   .articles-container {
+    display:flex;
+    flex-direction:column;
+    gap: 2rem;
+  }
+
+  .article {
+    width: 100%;
+  }
+  
+}
+
+
+@media all and (min-width: 760px) and (max-width: 1024px) {
+
+  .navbar {
+    display:flex;
+    justify-content: space-evenly;
+    width:100%;
+  }
+
+  .navbar li {
+    justify-content: space-between;
+  }
+
+  .articles-container {
+  display: grid;
+  grid-template-columns: 50% 50%;
+  gap: 1rem;
+  }
+
+  .article {
+    width: 100%;
+  }
+
+
+ .article:nth-child(3) {
+  grid-column: 1;         
+  }
+
+}
\ No newline at end of file