<% include ../components/head %>
<% include ../components/header %>
<main>
    <section class="about-me">

        <h1>About Me!</h1>

        <div class='container--image'>
            <picture>
                <source type="image/webp" srcset="imgs/me.webp">
                <source type="image/png" srcset="imgs/me.png">
                <img src="imgs/me.png" width="250" height="250" alt="Me, Dennis Mai" />
            </picture>
        </div>

        <p>Oooo! It's not every day I get to toot my own horn!</p>

        <p>First, for those interested, I'm a self-taught Full-stack Web Developer. You can see some of my projects and
            the tech I work with <a href="/projects.html">here.</a></p>

        <p>Second -- but not really -- I'm a father, husband and life-long student of all things. I'm a Brazilian Jiu
            Jitsu Blue Belt, Atheist (capital 'A'), amateur Table Tennis competitor, half-marathon runner, lake-swimmer,
            bear-chasing backpacking guide, and ravenous reader of many genres.</p>

        <video loop autoplay muted playsinline type="video/mp4">
            <source src="https://media.giphy.com/media/MHKl0gVYw0RTq/giphy.mp4" type="video/mp4">
            <img class="plain-image" width="400" height="200"
                src="https://media.giphy.com/media/MHKl0gVYw0RTq/giphy.gif" alt="Forrest Gump playing table tennis.">
        </video>

        <p>Here are some random facts about me.</p>

        <ul>
            <li>As of November 16, 2020, my favorite cheese has got to be <a href="https://cheese.com/reblochon/"
                    target="_blank" rel="noopener noreferrer">Reblochon</a>, but a close second is Wildberger, followed
                by Gruyere (as old as
                they
                make it).</li>
            <li>Currently, my favorite color is <a href="https://www.color-hex.com/color/ee82ee" target="_blank"
                    rel="noopener noreferrer">Violet</a> (Hex: #EE82EE).</li>
            <li>I love <a href="https://www.sierra.com/lp2/wool-guide/" target="_blank"
                    rel="noopener noreferrer">wool.</a></li>
        </ul>

        <p>I'm writing this to add <em>authenticity</em> to our digital lives.</p>

        <p>I came of age when the internet was a slow, strange, and inspiring place.</p>

        <video loop autoplay muted playsinline type="video/mp4">
            <source type="video/mp4" src="https://media.giphy.com/media/QWkuGmMgphvmE/giphy.mp4">
            <img class="plain-image" width="992" height="496"
                src="https://media.giphy.com/media/QWkuGmMgphvmE/source.gif" alt="Dial up internet, back in the day">
        </video>

        <p>The internet used to be weird, too. And while it's still full of facts and knowledge, it's lost some
            of <a
                href="https://www.bustle.com/articles/102641-10-websites-from-the-early-2000s-you-forgot-about-because-sometimes-you-just-need-a-little"
                target="_blank" rel="noopener noreferrer"><em>that magic.</em></a></p>

        <p>I, and others, still want to keep that spirit alive.</p>

        <p>And so that is why I am here, hand-coding this website and blog, putting my own personal touch on
            everything.</p>

        <p>I hope this place inspires you. I hope it weirds you out a bit. I hope it delights you.</p>

        <p>For more information about me, you can use the links in <a href="#the-footer">The Footer</a>
            or <a href="contact.html">Connect with me by email</a></p>

        <p>Thanks for reading.</p>

        <video class="last" loop autoplay muted playsinline type="video/mp4">
            <source type="video/mp4" src="https://media.giphy.com/media/JlpjgShzDsrMIyFu5U/giphy.mp4">
            <img class="plain-image last" width="200" height="150"
                src="https://media.giphy.com/media/JlpjgShzDsrMIyFu5U/giphy-downsized.gif" alt="Thank you.">
        </video>

        <% include ../images/bunny.svg %>
        <marquee behavior="scroll" direction="left" scrollamount="6">Credit goes to my wife for designing this weirdo.
        </marquee>

        <p>Oh, you're still here? Okay, I'll tell you more.</p>

        <p>I was born (and raised) in Wichita, Kansas to Vietnamese refugees.</p>

        <p>English was my second language, but not my last. I studied Economics and Spanish at Wichita State University
            and studied abroad for 1 year in Murcia, Spain, where I met my bombastic Swiss wife.</p>

        <p>I graduated, moved to Switzerland, learned German and French, got married, and started our family in Zurich.
        </p>

        <p class='last-p'>We got bored, so we moved to Kauai to adventure there for 4 years! Now, you can find us
            romping in the snow and lakes back in Switzerland.</p>

        <h2>The Footer</h2>

        <% include ../images/question-arrow.svg %>

    </section>
</main>
<% include ../components/footer %>

</html>