body {
    font-family: 'Poppins', sans-serif;
    background-color: white;
    color: #555;
    margin: 0px;
    padding: 0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    font-size: 19.8px; /* Base font size */
}

.container {
    display: flex;
    max-width: 1700px;
    width: 100%;
    margin-left: 10px;
    margin-right: 10px;
}

.images {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center; /* Center images vertically */
}

.images img {
    max-width: 100%;
    height: auto;
    margin-bottom: 0.25px; /* Margin between images */
    margin: 0 auto; /* Center the container */
    padding: 0px; /* Adjust padding to control spacing */
}

.text-block {
    flex: 0 0 53%; /* Text block width */
    padding: 39.6px; /* Padding inside text block */
    margin-left: 40px; /* Margin between text block and images */
    box-sizing: border-box;
}

#ip-address p {
    font-size: 17.6px; /* Font size */
    color: #555;
    margin-bottom: 22px; /* Space below IP address */
}

#title h1 {
    font-size: 55px; /* Font size */
    color: #555;
    margin-top: 0; /* Space remains the same above heading */
    margin-bottom: 44px; /* Space below heading */
    line-height: 1.21; /* Line height for h1 */
}

#steps h2 {
    font-size: 26.4px; /* Font size */
    color: #555;
    margin-bottom: 5.5px; /* Space below heading */
}

#steps p {
    font-size: 23.1px; /* Font size */
    color: #555;
    margin-top: 0; /* Space remains the same above paragraph */
    margin-bottom: 19.8px; /* Space between paragraphs */
}

a {
    font-size: 23.1px; /* Font size for links */
    color: #0066cc;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

.underline {
    text-decoration: underline;
}

/* Media Queries for different screen sizes */

@media (min-width: 1920px) { /* For screens 1920px and larger (e.g., 1080p) */
    body {
        font-size: 22px;
    }

    #title h1 {
        font-size: 60px;
    }

    #steps h2 {
        font-size: 29px;
    }

    #steps p {
        font-size: 25px;
    }

    a {
        font-size: 25px;
    }
}

@media (min-width: 2560px) { /* For screens 2560px and larger (e.g., 2K) */
    body {
        font-size: 24px;
    }

    #title h1 {
        font-size: 66px;
    }

    #steps h2 {
        font-size: 31px;
    }

    #steps p {
        font-size: 27px;
    }

    a {
        font-size: 27px;
    }
}

@media (min-width: 3840px) { /* For screens 3840px and larger (e.g., 4K) */
    body {
        font-size: 28px;
    }

    #title h1 {
        font-size: 72px;
    }

    #steps h2 {
        font-size: 34px;
    }

    #steps p {
        font-size: 30px;
    }

    a {
        font-size: 30px;
    }
}

.join-discord {
    display: flex;
    align-items: center;
    margin-top: 50px; /* Adjust margin as needed */
}

.discord-button {
    display: flex;
    align-items: center;
    font-size: 40px; /* Larger text */
    color: #9ea2a5;
    background-color: transparent; /* Transparent background */
    border: 3px solid #9ea2a5; /* Border to define button shape */
    padding: 10px 20px; /* Padding inside the button */
    text-decoration: none;
    transition: background-color 0.3s, color 0.3s;
}

.discord-button:hover {
    background-color: #eceff2;
    color: #9ea2a5;
}

.discord-logo {
    width: 100px; /* Adjust size as needed */
    height: auto;
    margin-right: 30px; /* Space between logo and text */
}

/*.thank-you p { */
    font-size: 17.6px !important; /* Using !important to override other styles */
    color: #9ea2a5 !important;
    margin-top: 20px !important;
}
