body{font-family:sofia-pro-soft,sans-serif;font-weight:400;font-style:normal;background-color:#b51717;text-align:center;padding-top:50px}h1{font-size:38px;display:flex;justify-content:center;align-items:center;color:#07c}h2{display:flex;justify-content:center;align-items:center;color:#fff}p{font-size:18px;margin:20px 0;display:flex;justify-content:center;align-items:center;color:#fff}@media(max-width:600px){body{background-image:url(/hintergruende/Test.png);background-attachment:fixed;margin:10px}}@media(max-width:900px){body{background-color:#2795c8;background-image:url(/hintergruende/Test.png);background-attachment:fixed;margin:10px}}@media(min-width:1000px){body{background-color:#2795c8;background-image:url(/hintergruende/Test.png);background-attachment:fixed;margin:10px}}.container{display:flex;gap:20px}@media(max-width:600px){.container{flex-direction:column}}.gallery{max-width:800px;margin:0 auto}.row{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;margin-bottom:10px}.row img#mainpage{width:100%;height:auto;border-radius:10px;box-shadow:0 2px 8px #0003}@media(min-width:1000px){.row{grid-template-columns:1fr}}.row a img{transform:scale(1);transition:transform .2s ease,box-shadow .2s ease,opacity .2s ease}.row a img:hover{transform:scale(1.05);box-shadow:0 4px 12px #0000004d}.row a img:active{transform:scale(.93);opacity:.7;box-shadow:0 2px 6px #0003}div.center{text-align:center}h2.left{justify-content:left}body{font-family:sofia-pro-soft,sans-serif;font-weight:400;font-style:normal;text-align:left;background-image:url(/hintergruende/test.png);margin:0;padding:20px}.row img{width:4rem;object-fit:cover;cursor:pointer;border-radius:10px;transition:transform .2s,border .2s}body{font-family:sofia-pro-soft,sans-serif;font-weight:400;font-style:normal;text-align:left;background-image:url(/hintergruende/test.png);margin:0;padding:20px}.container{display:flex;flex-direction:column;align-items:center}#mainImage{width:300px}#mainImage.active{width:300px;filter:brightness(1.1)}#mainImage.running{opacity:.7;transform:scale(1.05)}.row{display:flex;justify-content:center;gap:1rem;margin:20px 0}.row img{width:4rem;object-fit:cover;cursor:pointer;border-radius:1rem;transition:transform .2s,border .2s}.row img:hover{transform:scale(1.05)}.row img.selected{border:3px solid #0077cc;transform:scale(1.1)}p{margin:10px}#loopDisplay{font-weight:700;color:#444}@keyframes pulseBeat{0%,to{transform:scale(1);filter:brightness(1)}50%{transform:scale(1.1);filter:brightness(1.3)}}#mainImage.beat{animation:pulseBeat .4s ease}body{opacity:0;transform:scale(1.02);transition:opacity .4s ease,transform .4s ease}body.fade-in{opacity:1;transform:scale(1)}body.fade-out{opacity:0;transform:scale(.98)}.beat{animation:pulse .25s ease-out}#beatCircles{display:flex;gap:45px;margin:10px 0 20px;justify-content:center}.circle{width:40px;height:40px;border-radius:50%;background:#555;opacity:.3;transition:opacity .15s ease,background .15s ease}.circle.active{opacity:1;background:#f80}