feat: building the Featured-In Section

Author: zangeronimo

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

@@ -125,6 +125,35 @@
   font-weight: 700;
 }
 
+/*************************************/
+/* FEATURED IN SECTION */
+/*************************************/
+
+.section-featured {
+  padding: 4.8rem 0 3.2rem 0;
+}
+
+.heading-featured-in {
+  font-size: 1.4rem;
+  text-transform: uppercase;
+  letter-spacing: 0.75px;
+  font-weight: 500;
+  text-align: center;
+  margin-bottom: 2.4rem;
+  color: #888;
+}
+
+.logos {
+  display: flex;
+  justify-content: space-around;
+}
+
+.logos-img {
+  height: 3.2rem;
+  filter: brightness(0);
+  opacity: 50%;
+}
+
 /*************************************/
 /* HOW IT WORKS SECTION */
 /*************************************/

starter/07-Omnifood-Desktop/index.html

@@ -93,6 +93,39 @@ <h1 class="heading-primary">
         </div>
       </section>
 
+      <section class="section-featured">
+        <div class="container">
+          <h2 class="heading-featured-in">As featured in</h2>
+          <div class="logos">
+            <img
+              src="img/logos/techcrunch.png"
+              alt="Techcrunch logo"
+              class="logos-img"
+            />
+            <img
+              src="img/logos/business-insider.png"
+              alt="Business Inside logo"
+              class="logos-img"
+            />
+            <img
+              src="img/logos/the-new-york-times.png"
+              alt="New York Times logo"
+              class="logos-img"
+            />
+            <img
+              src="img/logos/forbes.png"
+              alt="Forbes logo"
+              class="logos-img"
+            />
+            <img
+              src="img/logos/usa-today.png"
+              alt="USA Today logo"
+              class="logos-img"
+            />
+          </div>
+        </div>
+      </section>
+
       <section class="section-how">
         <div class="container">
           <span class="subheading">How it works</span>