h1 { margin: 0 0 10px; font-size: 2rem; }
.gallery-meta { color: #aaa; margin-bottom: 20px; }
.back-btn { display: inline-block; background: #333; color: white; padding: 10px 20px; text-decoration: none; border-radius: 5px; margin-bottom: 20px; font-weight: bold; }
.back-btn:hover { background: var(--color-primary); color: #000; }
.photos-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(200px, 1fr)); gap: 15px; }
.photo-item { position: relative; border: 2px solid #333; border-radius: 5px; overflow: hidden; cursor: pointer; }
.photo-item img { width: 100%; height: 200px; object-fit: cover; display: block; transition: 0.3s; }
.photo-item:hover img { transform: scale(1.05); }
/* Eigener Viewer */
#imgViewer { display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.95); z-index:9999; align-items:center; justify-content:center; }
#imgViewer.open { display:flex; }
#imgViewer img { max-width:90%; max-height:90%; object-fit:contain; cursor:default; }
#imgViewer .close { position:absolute; top:20px; right:30px; color:#fff; font-size:40px; cursor:pointer; z-index:2; }
#imgViewer .nav { position:absolute; top:50%; transform:translateY(-50%); color:#fff; font-size:60px; cursor:pointer; padding:20px; user-select:none; z-index:2; transition:opacity .3s; }
#imgViewer .nav:hover { opacity:.7; }
#imgViewer .prev { left:10px; }
#imgViewer .next { right:10px; }
#imgViewer .counter { position:absolute; bottom:20px; left:50%; transform:translateX(-50%); color:#fff; font-size:16px; background:rgba(0,0,0,.5); padding:6px 16px; border-radius:20px; }
#imgViewer .caption { position:absolute; top:15px; left:50%; transform:translateX(-50%); color:#ccc; font-size:14px; }
';
require '_header.php';
?>
Lade Galerie...
⬅ Zurück
×
❮
![]()
❯
';
require '_footer.php';