FrontendMentor17—huddle-landing-page-with-single-introductory-section/index.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <meta name="description" content="Explore Huddle, a platform that re-imagines community building. Engage in genuine discussions and create connections with your audience. Register now and build a community your fans will love.">


    <meta property="og:title" content="Frontend Mentor | Huddle Landing Page with Single Introductory Section">
    <meta property="og:description"
          content="Huddle re-imagines the way we build communities. Create connections with your users as you engage in genuine discussion. Register now and build the community your fans will love.">
    <meta property="og:image"
          content="FrontendMentor17—huddle-landing-page-with-single-introductory-section/images/favicon-32x32.png">
    <meta property="og:url"
          content="https://ranitmanik.github.io/frontendmentor-challenges/FrontendMentor17—huddle-landing-page-with-single-introductory-section/index.html">

    <title>Frontend Mentor | Huddle Landing Page with Single Introductory Section</title>

    <link rel="icon" type="image/png" sizes="32x32" href="images/favicon-32x32.png">
    <link rel="stylesheet" href="style.css">

    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link href="https://fonts.googleapis.com/css2?family=Open+Sans:ital,wdth,wght@0,75..100,300..800;1,75..100,300..800&family=Poppins:ital,wght@0,400;0,600&display=swap"
          rel="stylesheet">
</head>

<body>

<header>
    <img src="images/logo.svg" alt="Logo of our website" id="logo">
</header>

<main>
    <section>
        <div class="left">
            <img src="images/illustration-mockups.svg" alt="">
        </div>
        <div class="right">
            <h1>Build The Community Your Fans Will Love</h1>

            <p>
                Huddle re-imagines the way we build communities. You have a voice, but so does your audience.
                Create connections with your users as you engage in genuine discussion.
            </p>

            <button>
                Register
            </button>
        </div>
    </section>

    <nav role="navigation">
        <ul>
            <li>
                <a href="https://www.facebook.com/RanitKumarManik/" target="_blank"
                   aria-label="Visit our Facebook page">
                    <img src="images/facebook.svg" alt="Link to our Facebook page">
                </a>
            </li>
            <li>
                <a href="https://twitter.com/RANIT_MANIK" target="_blank" aria-label="Visit our Twitter page">
                    <img src="images/twitter.svg" alt="Link to our Twitter page">
                </a>
            </li>
            <li>
                <a href="https://www.instagram.com/Ranit_Manik_" target="_blank" aria-label="Visit our Instagram page">
                    <img src="images/instagram.svg" alt="Link to our Instagram page">
                </a>
            </li>
        </ul>
    </nav>
</main>
</body>
</html>