/* Modal Background */
.modalBackground {
    background-color: rgba(0, 0, 0, 0.7);
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 1000;
}

/* Modal Popup */
.modalPopup {
    background-color: #fff;
    border: 3px solid #ccc;
    padding: 0px;
    width: 90%; /* Responsive width */
    max-width: 500px; /* Set a max width to prevent it from becoming too large */
    max-height: 80vh; /* Maximum height to prevent overflow */
    overflow-y: auto; /* Enables scrolling when content overflows */
    border-radius: 8px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    position: relative;
    z-index: 1001;
}

/* Media Query for larger screens */
@media (min-width: 768px) {
    .modalPopup {
        width: 60%; /* Slightly larger on medium screens */
        max-width: 600px; /* Increase max-width for larger screens */
    }
}



.footer {
    text-align: center; /* Centers text horizontally */
    padding: 20px; /* Optional: Add padding if needed */
    background-color: #f8f9fa; /* Optional: Background color for footer */
    font-size: 14px; /* Optional: Font size */
    color: #333; /* Optional: Font color */
}

.footer-link {
    background-color: #837E7C;
    color: white;
    text-decoration: none; /* Remove default underline */
}

    .footer-link:hover {
        color: white;
        text-decoration: underline; /* Add underline on hover */
    }