index.html

<!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>Pete Thinkful</title>
    <link
      rel="stylesheet"
      href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css"
    />
    <link href="style.css" rel="stylesheet" type="text/css" />
  </head>
  <body>
    <!-- Header section -->
    <header class="title">
      
      <h1>Pete Thinkful | Artist</h1>
      <nav>
        <a href="#about">About</a>
        <a href="#portfolio">Portfolio</a>
        <a href="#contact">Contact</a>
      </nav>
   
    </header>
</body>
    <main>
      <div>
        <!-- About section -->
        <article id="about">
          <h2>About</h2>
          <section class="container">
            <div>
              <img
                class="image-circle"
                src="images/pete-thinkful.png"
                alt="Pete Thinkful"
              />
            </div>
            <div class="items">
            <h3>Hi! I'm Pete Thinkful</h3>
            <p>I'm an artist living in Denver, Colorado.</p>
            <p>As an artist, I'm interested in:</p>
            <ul>
              <li>Producing abstract art</li>
              <li>Creating street graffiti art</li>
              <li>Connecting with like-minded artists</li>
            </ul>
            <p>
              Please feel free to take a look at my website and feel free to
              <a href="#contact">contact me</a>.
            </p>
            </div>
          </section>

          <section>
            <h3>Pete's Background</h3>
            <p>
              After graduating college, I became an art teacher and worked with
              beginners and professionals. I love art and my works have been
              featured in major art galleries across the globe.
            </p>
            <p>
              If you're looking to hire an artist or if you're an artist looking
              for a collaborator for your next project, please reach out! I'm so
              excited to work with other artists to create new art.
            </p>
          </section>
        </article>

        <hr />

        <!-- Portfolio section -->
        <article id="portfolio">
          <h2>Portfolio</h2>
          <section class="container">
            <div class="items" style="margin: 14px; ">
            <h3>Abstract Red</h3>
              <img src="images/abstract-red.png" alt="Abstract Red" />
            <p style="font-size: 14px;">
              Vaporware wayfarers heirloom neutra disrupt. Activated charcoal
              waistcoat scenester hell of.
            </p>
            </div>
            <div>
            <h3>Spiral Zany</h3>
            <div>
              <img src="images/spiral-zany.png" alt="Spiral Zany" />
            </div>
            <p style="font-size: 14px;">
              Sriracha portland taxidermy cronut messenger bag, vegan
              distillery. Vaporware kickstarter air plant mumblecore food truck.
            </p>
          </div>
           <div class="item" style="margin: 14px; ">
            <h3>Melted Rainbow</h3>
              <img src="images/melted-rainbow.png" alt="Melted Rainbow" />
            <p style="font-size: 14px; text-align: center;">
              Edison bulb single-origin coffee snackwave, actually ennui
              locavore shabby chic forage.
            </p>
          </div>
          </section>
        </article>

        <hr />

        <!-- Contact section -->
        <article id="contact">
          <h2>Contact</h2>
          <p>
            I'd love to hear from you! Please feel free to contact or follow me:
          </p>
          <ol>
            <li>
              <a href="">LinkedIn</a>
            </li>
            <li>
              <a href="">Instagram</a>
            </li>
            <li>
              <a href="">Pinterest</a>
            </li>
          </ol>
        </article>
      </div>
    </main>

    <!-- Footer section -->
    <footer>
      <p>© Pete Thinkful. All rights reserved.</p>
    </footer>
  </body>
</html>