#mypopup {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    max-width: 90%; /* Adjust as needed */
    max-height: 90vh; /* Adjust as needed */
    overflow: auto; /* Enable scrolling if content exceeds viewport */
    background-color: rgb(242, 242, 242); /* Change alpha value to 1 for full opacity */
    z-index: 9999;
    padding: 20px;
    text-align: center; /* Center text and elements inside */
}

#mypopup .content {
    margin: 0 auto; /* Center content horizontally */
}

#mypopup img {
    max-width: 50%; /* Ensures the image fits within the popup container */
    height: auto; /* Maintains aspect ratio */
    display: block; /* Ensures proper positioning and spacing */
    margin: 0 auto; /* Centers the image horizontally */
}

@media screen and (max-width: 768px) {
    /* Adjust styles for smaller screens */
    #mypopup {
        /* padding: 5px; */
        max-width: 95%; /* Make the popup wider on mobile */

    }
}