diff --git a/styles/style.css b/styles/style.css
index 9571ab1..63aa30f 100644
--- a/styles/style.css
+++ b/styles/style.css
@@ -177,3 +177,71 @@ header {
 }
   
 /* Write your CSS below */
+
+@media all and (max-width: 760px) {
+  .navbar {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+     max-width: 100%;
+  }
+  .navbar a {
+    display: block;
+    width: 100%;
+    text-align: center;
+    border-bottom: 3px solid #867e7e;
+    justify-content: center;
+    padding:2px ;
+
+}
+.navbar li{
+width: 100%;
+
+}
+.navbar li:last-child a {
+ border-bottom: none;
+}
+
+@MEDIA all and (max-width: 760px){
+  .main-article{
+    flex-direction:column;
+    width: 100%;
+  align-items: center;
+  }
+
+.articles-container {
+    flex-direction:column;
+    width: 100%;
+    gap: 2rem;
+
+  }
+  .article{
+    width: 100%;
+  }
+}
+  @media (min-width: 760px) and (max-width: 1024px){
+
+    .navbar{
+      display: flex;
+      align-items:center;
+      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