<!DOCTYPE html>
<html lang="en">
  <head>
    <title>Colin McMillen</title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- import the webpage's stylesheet -->
    <link href="https://fonts.googleapis.com/css?family=Fira+Mono:500,700|Press+Start+2P" rel="stylesheet">
    <link rel="stylesheet" href="/style.css">

    <!-- to demonstrate syntax highlighting -->
    <link rel="stylesheet" href="/pygments-monokai.css">

    <!-- and favicon -->
    <link rel="shortcut icon" type="image/png" href="/favicon.png"/>

    <!-- and Java the scripts. -->
    <script src="/script.js" defer></script>
  </head>
  <body>
    <header>
      <h1>
        <a href="/">Colin McMillen</a>
      </h1>
    </header>

      <article class="box box-gray box-layout-default">
        <h2 class="box-header">
          A BOX TITLE
        </h2>
        <div class="box-content">
          <p>
            Woomy ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. Woomy ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.
          </p>
        </div>
        <div class="box-footer">
          <a href="#" class="btn">READ MORE <span class="arrow"></span></a>
        </div>
      </article>

       <article class="box box-red box-layout-sidebar">
        <h2 class="box-header">
          ABOUT
        </h2>
       <div class="box-content">
          <p>
            Software engineer. Ex-Google;
            now who knows he/him — #TechWontBuildIt
          </p>
        </div>
        <div class="box-footer">
          <a href="#" class="btn">@mcmillen <span><img src="https://icon.now.sh/twitter/18/EB5757"/></span></a><a href="#" class="btn">@famicolin <span><img src="https://icon.now.sh/github/18/EB5757"/></span></a><a href="#" class="btn">EMAIL ME <span><img src="https://icon.now.sh/email/18/EB5757"/></span></a>
        </div>
      </article>

      <article class="box box-purple box-layout-sidebar">
        <h2 class="box-header">
          GAMING
        </h2>
        <div class="box-content">
          <p>
            I play Splatoon, Monster Hunter, and Retro Games!
          </p>
          <p>
            I play Splatoon, Monster Hunter, and Retro Games!
          </p>
        </div>
        <div class="box-footer">
          <a href="#" class="btn">TWITCH <span><img src="https://icon.now.sh/twitch/18/90489C"/></span></a><a href="#" class="btn">PSN <span><img src="https://icon.now.sh/playstation/18/90489C"/></span></a><a href="#" class="btn">SWITCH <span><img src="https://icon.now.sh/
videogame_asset/18/90489C"/></span></a>
        </div>
      </article>

      <article class="box box-gray box-layout-fullwidth">
        <h2 class="box-header">
          OTHER PROJECTS
        </h2>
        <div class="box-content">
          <p>
            Here is a box with a bunch of links
          </p>
        </div>
        <div class="box-footer">
          <a href="#" class="btn">Ink <span class="arrow"></span></a><a href="#" class="btn">Digital Attack Map <span class="arrow"></span></a><a href="#" class="btn">Memegen <span class="arrow"></span></a><a href="#" class="btn">Android Wear <span class="arrow"></span></a><a href="#" class="btn">Google Dictionary <span class="arrow"></span></a><a href="#" class="btn">reCAPTCHA <span class="arrow"></span></a>
        </div>
      </article>

      <article class="box box-gray box-layout-default">
        <h2 class="box-header">
          A BOX TITLE
        </h2>
        <div class="box-content">
          <p>
            Woomy ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. Woomy ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.
          </p>
          <blockquote>
            <p>
              Blockquote with accent background goes here.
            </p>
          </blockquote>
          <p>
            <a class="btn">link</a>
          </p>
          <h2>
            Heading 2
          </h2>
          <p>
            Woomy ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. Woomy ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.
          </p>
          <h3>
            Heading 3
          </h3>
          <p>
            Woomy ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor. Woomy ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor.
          </p>
        </div>
      </article>

    <footer>
      <div class="content">
        <p>
          (c) 2019 Colin McMillen<br>
          [but if you want to use anything, just ask!]
        </p>
        <p>
          Designed by <a href="https://melody.dev">Melody</a>!<br>
          If you want a well-designed site of your own, I heartily recommend working with them!
        </p>
      </div>
    </footer>
  </body>
</html>
