index.html

<!DOCTYPE html>
<html lang="en">

<head>

    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Homepage</title>
    <!-- Link stylesheets here! -->
    <!-- The order of the link tags is the order in which styles are applied -->
    <!-- If you want to override Bootstrap styling, link your own stylesheet AFTER bootstrap -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" />
    <link href="../static/style.css" rel="stylesheet" type="text/css" />
    <link rel="stylesheet" href="p.css">
    <!-- Import Google Fonts (https://fonts.google.com/) -->
    <link rel="preconnect" href="https://fonts.gstatic.com">
    <link href="https://fonts.googleapis.com/css2?family=Courier+Prime:wght@400;700&display=swap" rel="stylesheet">
</head>

<body id="home">
    <div class="container-fluid page">
        <h1>
            Your Complete Guide to Periods!
        </h1>
        <img src="https://images.unsplash.com/photo-1494790108377-be9c29b29330?ixid=MnwxMjA3fDB8MHxzZWFyY2h8M3x8d29tYW58ZW58MHx8MHx8&ixlib=rb-1.2.1&w=1000&q=80" alt="Girl smiling!" height="=200" width="200">
        <br> <br>
        <a role="button" href="https://poornahegde20.github.io/menstrualguide.github.io/firstperiodmain/" class="btn btn-info" >All about your first period!</a> <br> <br>
        <a role="button" href="https://poornahegde20.github.io/menstrualguide.github.io/menstrualpdts/" class="btn btn-info" >What are the different types of menstrual products?</a> <br> <br>
        <a role="button" href="https://poornahegde20.github.io/menstrualguide.github.io/maindisorder/" class="btn btn-info"= >What are the different disorders associated with periods?</a>
    </div>

</body>


</html>