To build the product listing, we're going to start with some new markup that will sit directly above the footer:
<!-- ===============Product Listing===============--><section class="secondary-section grouping"> <ul class="wrapper product-list"> <li class="product-list-item"> <figure> <img src="images/octopus-icon.svg" alt="Octopus"> </figure> <h2>The Octopus</h2> <p>Lorem ipsum dolor sit.</p> <a href="#" class="button">Tenticals »</a> </li> <li class="product-list-item">...</li> <li class="product-list-item">...</li> <li class="product-list-item">...</li> <li class="product-list-item">...</li> <li class="product-list-item">...</li> </ul><!-- end wrapper --></section><!-- ================ Footer================--> ...