body { 
    font-family: Arial, sans-serif; 
} 
 
.popup { 
    display: none; /* Hidden by default */ 
    position: fixed; /* Stay in place */ 
    z-index: 1000; /* Sit on top */ 
    left: 0; 
    top: 0; 
    width: 100%; /* Full width */ 
    height: 100%; /* Full height */ 
    background-color: rgba(0, 0, 0, 0.7); /* Black background with opacity */ 
    justify-content: center; /* Center the image horizontally */ 
    align-items: center; /* Center the image vertically */ 
} 
 
.popup-image { 
    max-width: 80%; /* Responsive image */ 
    max-height: 80%; 
    border-radius: 8px; /* Optional: rounded corners */ 
} 
 
.close { 
    position: absolute; /* Position the close button */ 
    top: 20px; /* Distance from the top */ 
    right: 30px; /* Distance from the right */ 
    color: white; /* Close button color */ 
    font-size: 30px; /* Close button size */ 
    font-weight: bold; 
    cursor: pointer; /* Pointer cursor on hover */ 
}