body {
    background-color: #101111;
    color: #ffffffd4;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    margin: 0;
    padding-top: 0; /* Corrected padding-top */
    text-align: left; /* Left align all text by default */
}

p {
    margin-bottom: 2em; /* Increase the space between paragraphs by 50% */
}

.navbar {
    position: absolute;
    top: 0;
    width: 100%;
    margin-bottom: 1em;
    border-bottom: 1.5px solid black; /* Increased thickness */
}

.cover {
    text-align: center;
    max-width: 1000px; /* Set a maximum width for the cover */
    margin: 0 auto; /* Center the cover */
    padding: 1000px 20px 0; /* Add padding to the top to lower the cover */
}
body, p, .navbar, .cover, .cover h1, .cover h2, ul, ol {
    text-align: left !important;
}
.cover h1, .cover h2, ul, ol {
    text-align: center; /* Center align h1, h2, and list items */
}

.cover h1 {
    color: #fff;
    font-size: 45px;
    font-weight: regular;
    margin-bottom: 20px; /* Double the margin-bottom to add more space */
}

.cover h2 {
    color: #fff;
    font-size: 20px;
    font-weight: regular;
    margin-bottom: 40px; /* Double the margin-bottom to add more space */
}

.cover button {
    background-color: #fff;
    color: #101111;
    padding: 10px 20px;
    font-size: 18px;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    margin-top: 0px; /* Double the margin-top to add more space */
}

@media screen and (max-width: 768px) {
    .cover {
        padding: 2100px 20px 0; /* Add padding to create space between navbar and cover elements */
    }

    .cover h1 {
        font-size: 30px; /* Adjust font size for smaller screens */
        margin-bottom: 10px; /* Adjust margin for smaller screens */
    }

    .cover h2 {
        font-size: 16px; /* Adjust font size for smaller screens */
        margin-bottom: 20px; /* Adjust margin for smaller screens */
    }

    .cover button {
        font-size: 16px; /* Adjust button font size for smaller screens */
        padding: 8px 16px; /* Adjust button padding for smaller screens */
    }
}

@media screen and (min-width: 1920px) {
    .cover {
        padding: 400px 40px 0; /* Adjust padding for larger screens */
    }

    .cover h1 {
        font-size: 60px; /* Increase font size for larger screens */
        margin-bottom: 40px; /* Adjust margin for larger screens */
    }

    .cover h2 {
        font-size: 30px; /* Increase font size for larger screens */
        margin-bottom: 60px; /* Adjust margin for larger screens */
    }

    .cover button {
        font-size: 20px; /* Adjust button font size for larger screens */
        padding: 12px 24px; /* Adjust button padding for larger screens */
    }
}

/* Ensure .cover elements begin below the .navbar element */
.cover {
    margin-top: 60px; /* Adjust this value as needed to ensure it clears the navbar */
}