/* Default styling */
#logo {
    max-width: 100%; /* Ensure the image does not exceed its container's width */
    height: auto; /* Maintain aspect ratio */
}

/* Resize the logo for smaller screens */
@media screen and (max-width: 768px) {
    #logo {
        width: 80%; /* Adjust width for smaller screens */
    }
}

/* Additional media queries for even smaller screens if needed */
@media screen and (max-width: 480px) {
    #logo {
        width: 90%; /* Adjust width for even smaller screens */
    }
}