<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Information</title>
  <link rel="stylesheet" href="solution.css">
</head>
<body>
  <div class="title">Information!</div>

  <div class="container">
    <div class="info">
      <img src="./images/barberry.png" alt="barberry">
      <div class="text">This is a type of plant. We love this one.</div>
    </div>
    <div class="info">
      <img src="./images/chilli.png" alt="chili">
      <div class="text">This is another type of plant. Isn't it nice</div>
    </div>
    <div class="info">
      <img src="./images/pepper.png" alt="pepper">
      <div class="text">We have so many plants. Yay plants.</div>
    </div>
    <div class="info">
      <img src="./images/saffron.png" alt="saffron">
      <div class="text">I'm running out of things to say about plants.</div>
    </div>
  </div>

  <!-- disregard this section, it's here to give attribution to the creator of these icons -->
  <div class="footer">
    <div>Icons made by <a href="https://www.flaticon.com/authors/icongeek26" title="Icongeek26">Icongeek26</a> from <a href="https://www.flaticon.com/" title="Flaticon">www.flaticon.com</a></div>
  </div>
</body>
</html>