index.html


<html>
  <head>
    <title>Ryan Mansfield</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.6.3/css/all.css" integrity="sha384-UHRtZLI+pbxtHCWp1t77Bi1L4ZtiqrqD80Kn4Z8NTSRyMA2Fd33n5dQ8lWUE00s/" crossorigin="anonymous">
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <div class='container'>
      <div class="card" id='header'>
        <h1>Ryan Mansfield</h1>
        <img src="images/profile_photo.jpg" class = "img-circle" width="200px" alt="Ryan Mansfield">
        <h3>
        Full Stack Web Developer
        </h3>
        <p>I am passionate about travel and other things</p>
        <a href="#" class="button">See My Work</a>
      </div>

      <div class='card'>
        <h2>Travel</h2>
        <p>information about my travels</p>
      </div>
      <div class='card'>
        <h2>Other Things</h2>
        <p>information about other things</p>
      </div>


      <div class='card'>
        <h2>Follow Me</h2>
        <ul class='list-inline'>
          <li>
            <a href="https://github.com/ryanmansfield" target="_blank">
            <i class="fab fa-github-square"></i>
            </a>
          </li>
          <li>
            <a href="https://facebook.com/Mansfield.Ryan" target="_blank">
            <i class="fab fa-facebook-square"></i>
            </a>
          </li>
          <li>
            <a href="https://www.linkedin.com/in/ryan-mansfield-a4753b18/" target="_blank">
            <i class="fab fa-linkedin"></i>
            </a>
          </li>
        </ul>
      </div>
    <div>
  </body>
</html>