<html >
<head>
    <link rel="stylesheet" href="https://[Log in to view URL]">
    <style>
        body {
            background-color: #f4fff4;
            font-family: Arial, sans-serif;
        }

        .jumbotron {
            background-color: #e6f9ec;
            border-left: 6px solid #FF5A43;
        }

        .jumbotron h1 {
            color: #FF5A43;
        }

        .section-title {
            color: #FF5A43;
            margin-top: 30px;
            margin-bottom: 15px;
        }

        p {
            font-weight: bold;
            margin-bottom: 5px;
        }
    </style>
</head>

<body>
    <div class="jumbotron jumbotron-fluid">
        <div class="container">
            <h1>My Science Lab</h1>
            <p class="lead">Welcome to the lab! Here are the experiments running, the discoveries made, and how far each
                research project has come.</p>
           
            <button class="btn btn-primary">Chemistry</button>
            <button class="btn btn-success">Biology</button>
            <button class="btn btn-warning">Physics</button>
            <button class="btn btn-danger">Astronomy</button>
        </div>
    </div>
    <div class="container">
        <h2 class="section-title">Experiments Completed <span class="badge badge-danger">4</span></h2>
        <p>Chemistry <span class="badge badge-primary">7 experiments</span></p>
        <p>Biology <span class="badge badge-success">5 experiments</span></p>
        <p>Physics <span class="badge badge-warning">3 experiments</span></p>
        <p>Astronomy <span class="badge badge-info">4 experiments</span></p>

        <h2 class="section-title">Research Progress</h2>
        <p>Chemistry</p>
        <div class="progress mb-3">
            <div class="progress-bar bg-primary" style="width: 85%">85%</div>
        </div>
        <p>Biology</p>
        <div class="progress mb-3">
            <div class="progress-bar bg-success" style="width: 70%">70%</div>
        </div>
        <p>Physics</p>
        <div class="progress mb-3">
            <div class="progress-bar bg-warning" style="width: 55%">55%</div>
        </div>
        <p>Astronomy</p>
        <div class="progress mb-3">
            <div class="progress-bar bg-danger" style="width: 40%">40%</div>
        </div>

    </div>

    <script src="https://[Log in to view URL]"></script>
</body>

</html>