home-page.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">
    <title>Cura</title>
    <link rel="stylesheet" href="home-page.css">
    <link rel="icon" href="./pictures/Untitled_Artwork.png" type="png" />
    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Nunito&display=swap">
</head>
<style>
    body {
        background-color: white;
    }
</style>
<body>
    <nav>
        <a class="active" href="home-page.html">cura</a>
        <a class="active" href="about-us.html">about us</a>
        <a href="login.html">log in</a>
        <a href="signup.html">sign up</a>
    </nav>
    <img class="logo" src="logo.png" alt="logo" width="200">
    <div class="header">
        <div class="purple-blob">
            <svg width="345" height="411" viewBox="0 0 345 411" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path id="Vector" fill-rule="evenodd" clip-rule="evenodd" d="M216.102 11.2211C261.645 16.8392 307.062 25.4816 343.632 52.8873C379.694 79.9122 398.129 121.2 417.065 161.823C438.725 208.285 477.26 256.42 461.18 305.044C445.101 353.666 387.551 374.669 339.998 394.872C300.841 411.507 258.529 413.188 216.102 409.163C177.388 405.491 142.347 391.583 108.359 372.9C69.5894 351.588 23.0377 334.307 6.16323 293.761C-11.0404 252.424 12.2865 207.607 21.3427 163.815C31.8159 113.172 22.1452 50.3986 63.1322 18.2853C104.135 -13.8404 164.179 4.81593 216.102 11.2211Z" fill="#B69CEC"/>
            </svg>
        </div>
        <div class="pink-blob">
            <svg width="829" height="633" viewBox="0 0 829 633" fill="none" xmlns="http://www.w3.org/2000/svg">
                <path id="blue-blob" fill-rule="evenodd" clip-rule="evenodd" d="M390.753 26.7432C461.248 27.9194 528.212 45.1707 590.492 75.4153C666.326 112.242 752.023 147.936 785.886 218.63C821.529 293.039 820.628 386.621 771.632 453.568C724.661 517.747 623.873 521.152 543.777 549.441C480.739 571.705 421.897 599.258 353.8 601.142C279.201 603.206 204.573 593.932 139.376 560.631C64.4504 522.361 -22.9722 475.938 -38.802 400.611C-54.5767 325.547 17.3734 262.114 63.2657 198.461C100.193 147.243 141.44 99.7951 200.349 68.906C257.947 38.7044 323.47 25.6206 390.753 26.7432Z" fill="#F28B8B"/>
            </svg>
        </div>
    </div>
    <div class="headerbackground">
        <h1>bridging the gender<br>gap in tech</h1>
    </div>
    <div class="description">
        <h1>How does Cura work?</h1>
    </div> 
    <div class="how-it-works">
        <img class="how1" src="Untitled_Artwork (2) 1.png" alt="how1" width="400">
        <img class="how2" src="Untitled_Artwork (3) 1.png" alt="how2" width="400">
        <img class="how3" src="Untitled_Artwork (4) 1.png" alt="how3" width="400">
    </div>
</body>
</html>