#

Author: Bryant

src/assets/Star.svg

@@ -21,9 +21,10 @@
     background-repeat: no-repeat;
     background-size: cover;
     background-position: center;
-    transform: translate(645px, 20px);
-    z-index: -1;
+    margin-left: 51%;
+    margin-top: 2%;
     position: absolute;
+    z-index: -1;
 
 }
 
@@ -34,7 +35,7 @@
     background-color: #1B1D1F;
     top: 50%;
     left: 50%;
-    transform: translate(-50%, 230px);
+    transform: translate(-50%, 210px);
     border-radius: 10px;
     padding-bottom: 100px;
 }
@@ -68,4 +69,34 @@
     grid-template-rows: auto auto;
     justify-content: center;
     gap: 50px;
-}
+}
+
+@media (min-width: 768px) and (max-width: 1023px) {
+
+    .bgImg {
+        background-image: url("../assets/bg-cafe.jpg");
+    }
+    
+    .itemsContainer {
+        grid-template-columns: auto auto;
+    }
+
+}
+
+@media (max-width: 767px) {
+
+    .bgImg {
+        width: 100%;
+        background-image: url("../assets/bg-cafe-sm.jpg");
+
+    }
+
+    .container {
+        width: 80%;
+    }
+    
+    .itemsContainer {
+        grid-template-columns: auto;
+    }
+
+}

src/components/App.css

@@ -51,7 +51,6 @@
 
 .rateVotes {
     display: flex;
-    align-items: center;
     justify-content: space-between;
 
 }