base

src/css/about.css

@@ -0,0 +1,11 @@
+@media screen and (min-width: 768px) {
+
+}
+
+@media screen and (min-width: 1280px) {
+
+}
+
+@media screen and (min-width: 1440px) {
+
+}

src/css/base.css

@@ -60,11 +60,23 @@ main {
 /* ==== CONTAINER ==== */
 
 .container {
-    width: 375px;
+    width: 100%;
     margin-left: auto;
     margin-right: auto;
 }
 
+@media screen and (min-width: 375px) {
+    .container {
+        max-width: 375px;
+    }
+}
+
+@media screen and (max-width: 375px) {
+    .container {
+            width: 100%;
+        }
+}
+
 @media screen and (min-width: 768px) {
     .container {
         width: 768px;

src/css/collection.css

@@ -0,0 +1,5 @@
+@media screen and (min-width: 768px) {}
+
+@media screen and (min-width: 1280px) {}
+
+@media screen and (min-width: 1440px) {}

src/css/footer.css

@@ -0,0 +1,5 @@
+@media screen and (min-width: 768px) {}
+
+@media screen and (min-width: 1280px) {}
+
+@media screen and (min-width: 1440px) {}

src/css/header.css

@@ -1,21 +1,5 @@
-.header {
-  padding: 20px 0;
-}
+@media screen and (min-width: 768px) {}
 
-.nav-list {
-  display: flex;
-  align-items: center;
-  justify-content: flex-end;
-  gap: 40px;
-}
+@media screen and (min-width: 1280px) {}
 
-.nav-link {
-  font-weight: 500;
-  letter-spacing: 0.02em;
-  line-height: 1.5;
-}
-
-.nav-link:hover,
-.nav-link:focus {
-  color: #747bff;
-}
+@media screen and (min-width: 1440px) {}

src/css/hero.css

@@ -0,0 +1,5 @@
+@media screen and (min-width: 768px) {}
+
+@media screen and (min-width: 1280px) {}
+
+@media screen and (min-width: 1440px) {}

src/css/order.css

@@ -0,0 +1,5 @@
+@media screen and (min-width: 768px) {}
+
+@media screen and (min-width: 1280px) {}
+
+@media screen and (min-width: 1440px) {}

src/css/testimonials.css

@@ -0,0 +1,5 @@
+@media screen and (min-width: 768px) {}
+
+@media screen and (min-width: 1280px) {}
+
+@media screen and (min-width: 1440px) {}