<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8"/>
    <title>Basic HTML text: Task 2</title>
    <style>
      body {
        background-color: #fff;
        color: #333;
        font: 1em / 1.4 Helvetica Neue, Helvetica, Arial, sans-serif;
        padding: 1em;
        margin: 0;
      }

      h1 {
        font-size: 2rem;
        margin: 0;
      }

      h2 {
        font-size: 1.6rem;
        margin: 0;
      }

      p {
        margin: 0.5em 0;
      }

      ol {
        border: 2px solid purple;
      }

      ul {
        border: 2px solid orange;
      }

      ol, ul {
        padding: 5px 20px;
        border-radius: 4px;
      }
    </style>
  </head>

  <body>

    <h1>Looking at lists</h1>

    <p>Turn the following list of my favorite vegetables into an unordered list.</p>

      Cucumber
      Broccoli
      Asparagus
      Pepper

    <p>Turn the following directions into an ordered list.</p>

      First knock on the door
      When prompted, say the magic word
      Wait for at least 5 seconds
      Turn the handle and push

  </body>

</html>
