added responsiveness

style.css

@@ -252,4 +252,66 @@ nav {
   color: white;
   min-width: 40rem;
   max-width: 30rem;
+}
+
+@media screen and (max-width: 600px) {
+
+  main {
+    width: 100%;
+  }
+
+  .sidebar {
+    display: none;
+    position: absolute;
+  }
+
+  .search {
+    width: 100%;
+    justify-content: space-between;
+  }
+
+  .tags {
+    overflow-x: scroll;
+    overflow-y: hidden;
+    padding-bottom: 2.5rem;
+  }
+
+  nav {
+    padding: 0.75rem 1rem;
+    justify-content: space-between;
+    gap: 0.75rem;
+  }
+
+  .reco {
+    height: 2rem;
+  }
+
+  .videos {
+    flex-direction: column;
+    flex-wrap: nowrap;
+    justify-content: inherit;
+    align-items: center;
+  }
+
+  .search > button {
+    display: none;
+  }
+
+  .searchbar {
+    border: 0px;
+  }
+
+  .searchbar input {
+    display: none;
+  }
+
+  .searchbar button {
+    width: 2.5rem;
+    height: 2.5rem;
+    border-radius: 3rem;
+  }
+
+  .nav-icons {
+    display: flex;
+  }
 }