update

Author: N0sBa

starter/07-Omnifood-Desktop/genreral.css renamed to starter/07-Omnifood-Desktop/css/genreral.css

@@ -1,4 +1,4 @@
-z/*****************************************/
+/*****************************************/
 /************** GENERAL *************/
 /*****************************************/
 
@@ -34,6 +34,10 @@ body {
     justify-content: space-between;
 }
 
+.justify-content--space-around {
+    justify-content: space-around;
+}
+
 .align-item--center {
     align-items: center;
 }
@@ -198,4 +202,8 @@ body {
 
 .margin-bottom-sm {
     margin-bottom: 1.6rem;
+}
+
+strong {
+    font-weight: 500;
 }

starter/07-Omnifood-Desktop/style.css renamed to starter/07-Omnifood-Desktop/css/style.css

@@ -116,13 +116,22 @@
 
 /* FEATURED-IN SECTION */
 .featured-in {
-    
+    padding: 4.8rem 0 3.2rem 0;
 }
 .featured-in-tile {
+    font-size: 1.4rem;
+    text-transform: uppercase;
+    letter-spacing: 0.75px;
+    font-weight: 500;
     text-align: center;
+    margin-bottom: 2.4rem;
+    text-align: center;
+    color: #888;
 }
 .featured-in-logo {
-    width: 100%;
+    height: 3.2rem;
+    filter: brightness(0);
+    opacity: 50%;
 }
 
 
@@ -186,4 +195,80 @@
 
 .step-img {
     width: 35%;
+}
+
+/*****************************************/
+/************** HOW IT WORKS SECTION *************/
+/*****************************************/
+
+.meals {
+    padding: 9.6rem 0;
+}
+
+.meal {
+    box-shadow: 0 2.4rem 4.8rem rgba(0,0,0,0.075);
+    border-radius: 11px;
+    overflow: hidden;
+}
+
+.meal-content {
+    padding: 3.2rem 4.8rem 4.8rem 4.8rem;
+}
+
+.meal-tags {
+    margin-bottom: 1.2rem;
+    display: flex;
+    gap: 0.4rem;
+}
+
+.tag {
+    display: inline-block;
+    padding: 0.4rem 0.8rem;
+    font-size: 1.2rem;
+    text-transform: uppercase;
+    color:#333;
+    border-radius: 100px;
+    font-weight: 600;
+}
+
+.tag--vegeterian {
+    background-color: #51cf66;
+}
+.tag--vegan {
+    background-color: #94d82d;
+}
+.tag--paleo {
+    background-color: #ffd43b;
+}
+
+
+.meal-title {
+    font-size: 2rem;
+    color: #333;
+    font-weight: 600;
+    margin-bottom: 3.2rem; 
+}
+
+.meal-attributes {
+    list-style: none;
+    display: flex;
+    flex-direction: column;
+    gap: 2rem;
+}
+
+.meal-attribute {
+    font-size: 1.8rem;
+    display: flex;
+    align-items: center;
+    gap: 1.6rem;
+}
+
+.meal-icon {
+    height: 2.4rem;
+    width: 2.4rem;
+    color: #e67e22;
+}
+
+.meal-img {
+    width: 100%;
 }