/* Lightbox Image */ .lightbox { /* Default to hidden */ display: none; /* Overlay entire screen */ position: fixed; z-index: 999; top: 0; left: 0; right: 0; bottom: 0; /* A bit of padding around image */ padding: 1em; /* Translucent background */ background: rgba(0, 0, 0, 0.8); } /* Unhide the lightbox when it's the target */ .lightbox:target { display: block; } .lightbox span { /* Full width and height */ display: block; width: 100%; height: 100%; /* Size and position background image */ background-position: center; background-repeat: no-repeat; background-size: contain; }