<!DOCTYPE html>
<html>
    <head>
        <title>HTML & CSS Fundamentals | Challenges</title>
        <link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;900&display=swap" rel="stylesheet">
        <link href="css/style.css" rel="stylesheet">
    </head>
    <body>
        <div class="container">
            <h1>Hello, my name is <span class="bold-text">Sophie</span></h1>
            <img src="img/sophie.png" alt="portrait of Sophie">
            <h2>I am a <span class="bold-text">graphic designer</span></h2>
            <p>Ultricies morbi urna lectus magna quisque ultricies velit enim nisi mi volutpat amet id id porta auctor at viverra consequat turpis quam enim amet vulputate.</p>
            
            <h2>My most recent <span class="bold-text">article</span></h2>
            <article>
                <h3>Design systems that scale</h3>
                <p class="small-text">Writen by Sophie on June 19, 2020</p>
                <p>Ultricies morbi urna lectus magna quisque ultricies velit enim nisi mi volutpat amet id id porta auctor at viverra consequat turpis quam enim... <a href="#">continue reading</a></p>    
            </article>
        </div>
    </body>
</html>

</head>

<body>

<h1>Hello, my name is <span class="bold-text">Sophie</span></h1>

<h2>I am a <span class="bold-text">graphic designer</span></h2>

<p>Ultricies morbi urna lectus magna quisque ultricies velit enim nisi mi volutpat amet

id id porta auctor at viverra consequat turpis quam enim amet vulputate.</p>

<h2>My most recent <span class="bold-text">article</span></h2>

<h3>Design systems that scale</h3>

<p class="small-text">Writen by Sophie on June 19, 2020</p>

<p>Ultricies morbi urna lectus magna quisque ultricies velit enim nisi mi volutpat

amet id id porta auctor at viverra consequat turpis quam enim... <a

href="#">continue reading</a></p>

</article>

</div>

</body>

</html>

<!DOCTYPE html>

<html>

<head>

<title>HTML & CSS Fundamentals | Challenges</title>

rel="stylesheet">

-1:41