body, html {
    margin: 0;
    padding: 0;
    height: 100%;
}

.logocontainer {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh; /* Use viewport height for full screen height */
}

#logo {
    width: auto; /* Allow the image to scale based on its aspect ratio */
    height: auto; /* Allow the image to scale based on its aspect ratio */
    max-width: 100%; /* Ensure the image doesn't exceed its original size */
    max-height: 100%; /* Ensure the image doesn't exceed its original size */
}

@media (max-width: 768px) {
    .logocontainer {
        height: 5vh; /* Adjust the height for smaller screens */
    }
}