results.html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="./styles/website_top_styles.css" />
    <link rel="stylesheet" href="./styles/results_success_styles.css" />
    <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300&display=swap" rel="stylesheet">
    <title>Success!</title>
</head>
<body>
    <div class="SuccessFrame">
        <div id="top">
            <!-- logo -->
            <div class="webCompany">
                <a href="./index.html"><div id="Company_namelogo"></div></a>
            </div>
            
            <!-- Navigation -->
            <div id="navigationPane">
                <div id="Menu_1" class="menu flex">
                    <!-- Navigation menu 1 -->
                </div>
                <div id="Menu_2" class="menu flex">
                    <!-- Navigation menu 2 -->
                </div>
                <div id="Menu_3" class="menu flex">
                    <!-- Navigation menu 3 -->
                </div>
            </div>

            <!-- Profile -->
            <div id="profile">
                <div class="User-profile flex">
                    <div id="profilePic"></div>
                </div>
                <div class="heyPerson flex">
                    Hi, Lara!
                </div>
            </div>
        </div>


        <!-- Success! -->
        <div id="successPart">
            <div class="congrats flex">
                Congrats!
            </div>

            <div class="arrowBox">
                <div class="floatChild"><div id="arrow1" class="arrow"></div></div>
                <div class="floatChild"><div id="arrow2" class="arrow"></div></div>
                <div class="floatChild"><div id="arrow3" class="arrow"></div></div>
            </div>

            <div class="tree">
                <div class="user flex">
                    <div id="userPhoto"></div>
                </div>
                <div class="potentialMatches">
                    <div id="match1" class="matchImage"><div id="match1Image"></div></div>
                    <div id="match2" class="matchImage"><div id="match2Image"></div></div>
                    <div id="match3" class="matchImage"><div id="match3Image"></div></div>
                </div>
            </div>

            <div class="matches">
                <div id="matchText" class="flex">We’ve found awesome recruiter and mentor matches based on your location and skills!</div>

                <div id="matchButton" class="flex">
                    <a href="./userProfiles.html"><button id="matchButtonButton">View matches</button></a>
                </div>
            </div>
        </div>
    </div>
</body>
</html>