diff --git a/adventskalender/2025/css/main.css b/adventskalender/2025/css/main.css index 117de26..aa8a2ba 100644 --- a/adventskalender/2025/css/main.css +++ b/adventskalender/2025/css/main.css @@ -93,25 +93,32 @@ .fluegel.right { transform-origin: right center; border-radius: 0 12px 12px 0; } .fluegel.left:hover, -.fluegel.hover-proxy.left, -.fluegel.rota.left:hover, -.fluegel.rota.hover-proxy.left { - transform-origin: left center; - transform: rotateY(115deg) scale(1.05); +.fluegel.hover-proxy.left { + transform-origin: right center; + transform: scale(1.05); + background: linear-gradient( + 180deg, + color-mix(in srgb, var(--ci-gold) 20%, var(--ci-darkgreen)), + color-mix(in srgb, var(--ci-creamwhite) 15%, var(--ci-blue)) + ); box-shadow: 0 0 18px color-mix(in srgb, var(--ci-gold) 50%, transparent), inset 0 0 10px rgba(255,255,255,0.25); } .fluegel.right:hover, -.fluegel.hover-proxy.right, -.fluegel.rota.right:hover, -.fluegel.rota.hover-proxy.right { - transform-origin: right center; - transform: rotateY(-115deg) scale(1.05); +.fluegel.hover-proxy.right { + transform-origin: left center; + transform: scale(1.05); + background: linear-gradient( + 180deg, + color-mix(in srgb, var(--ci-gold) 20%, var(--ci-darkgreen)), + color-mix(in srgb, var(--ci-creamwhite) 15%, var(--ci-blue)) + ); box-shadow: 0 0 18px color-mix(in srgb, var(--ci-gold) 50%, transparent), inset 0 0 10px rgba(255,255,255,0.25); +} .fluegel.rota.left { transform: rotateY(115deg);