<!DOCTYPE html>
<html>
    <head>
        <title>Scrimbafy Me!</title>
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,900&display=swap" rel="stylesheet">
        <link href="styles.css" rel="stylesheet">
    </head>
    <body>
        <section class="intro">
            <h1>Turn <strong>your picture</strong> into an iconic <strong>Scrimba avatar</strong></h1>
            <span class="beta-text">Currently in Beta</span>
        </section>
        
        <main class="main-content">
            <img class="img-main" src="images/avatar.png" alt="My Scrimba avatar.">
            <h2>Scrimbafy.me</h2>
            <span class="subheading">Liven up your profile pic</span>
            
            <p>The colorful and iconic Scrimba avatars are no longer just for members of the Scrimba team and its Avengers-caliber group of code reviewers. You can Scrimbafy your photo today!</p>
        </main>
    </body>
</html>

<!DOCTYPE html>

<html>

<head>

<title>Scrimbafy Me!</title>

display=swap" rel="stylesheet">

</head>

<body>

<h1>Turn <strong>your picture</strong> into an iconic <strong>Scrimba

avatar</strong></h1>

<span class="beta-text">Currently in Beta</span>

</section>

<h2>Scrimbafy.me</h2>

<span class="subheading">Liven up your profile pic</span>

<p>The colorful and iconic Scrimba avatars are no longer just for members of the

Scrimba team and its Avengers-caliber group of code reviewers. You can Scrimbafy your

photo today!</p>

-1:17