/* Background overlay */ .overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); display: none; align-items: center; justify-content: center; z-index: 1000; } /* Pop-up window */ .popup { background-color: white; padding: 20px; border-radius: 10px; width: 90%; max-width: 600px; /* Maximum width for desktop */ text-align: center; position: relative; z-index: 1001; } /* Responsive image */ .popup img { width: 100%; height: auto; border-radius: 10px; } /* Close button */ .close-btn { position: absolute; top: 10px; right: 10px; background: #333; color: white; border: none; border-radius: 50%; width: 30px; height: 30px; font-size: 16px; cursor: pointer; z-index: 1002; } /* Lock content interaction */ .content-lock { position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0); z-index: 999; } /* Desktop specific adjustments */ @media (min-width: 1024px) { .popup { padding: 30px; /* Increase padding for desktop */ max-width: 600px; } } // Show the pop-up after 3000 ms (3 seconds) setTimeout(() => { document.getElementById(‘popupOverlay’).style.display = ‘flex’; document.getElementById(‘contentLock’).style.display = ‘block’; // Enable content lock }, 3000); // Function to close the pop-up function closePopup() { document.getElementById(‘popupOverlay’).style.display = ‘none’; document.getElementById(‘contentLock’).style.display = ‘none’; // Disable content lock }