/* General page styling */
body {
    background-color: black; /* Black background */
    color: white; /* White text */
    font-family: 'Press Start 2P', cursive; /* Apply the Minecraft-like font */
    margin: 0;
    padding: 0;
    text-align: center;
    height: 100vh; /* Full screen height */
    display: flex;
    flex-direction: column;
    justify-content: flex-start; /* Adjust text position further down */
}

/* Title at the top */
.title {
    color: white;
    font-size: 40px;
    margin-bottom: 30px;
    text-align: center;
}

/* Container styling */
.container {
    margin-top: 30%; /* Move content further down */
    font-size: 20px;
}

/* Styling for the version text (green color) */
.version {
    color: green; /* Green for version numbers */
}

/* Styling for the date text (white color, already default) */
.date {
    color: white; /* White for the dates */
}

/* Styling for the IP address text */
.ip {
    cursor: pointer; /* Changes the cursor to a hand when hovering over the IP */
    color: lightblue; /* Optional: Change the IP text color */
    position: relative; /* To position the tooltip bubble correctly */
}

/* Tooltip bubble styling */
.tooltip {
    visibility: hidden;
    background-color: white; /* White background for the tooltip */
    color: black; /* Black text */
    text-align: center;
    border-radius: 5px;
    padding: 5px;
    position: absolute;
    z-index: 1;
    bottom: 125%; /* Position above the IP */
    left: 50%;
    margin-left: -50px; /* Centers the tooltip horizontally */
    opacity: 0;
    transition: opacity 0.3s;
    font-size: 14px;
}

/* Show the tooltip when hovering over the IP */
.ip:hover .tooltip {
    visibility: visible;
    opacity: 1;
}

/* Image container styling */
.image-container {
    margin-top: 20px; /* Space for the image */
}

/* Image styling */
.nate-image {
    width: 150px; /* Adjust the image size as necessary */
    height: auto;
    display: block;
    margin: 20px auto; /* Center the image horizontally */
}