Template:Party/style.css

.party-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 15px; /* Space between the speakers and the template box */
    margin: 1em auto;
    padding: 20px; /* Prevents the scaled-up speakers from clipping */
}

/* Base class for the speakers */
.party-speaker {
    flex-shrink: 0;
    /* 0.8s loop makes it fast, simulating a high-BPM beat */
    animation: speaker-pump 0.8s infinite;
    transform-origin: center center;
}

/* Offset the right speaker slightly to make the effect feel chaotic/stereo */
.party-speaker-right {
    animation-delay: 0.15s;
}

/* 
 * Complex keyframes simulate a "random" heavy bass beat 
 * by scaling the image up and down at uneven intervals.
 */
@keyframes speaker-pump {
    0%   { transform: scale(1); }
    12%  { transform: scale(1.35); }
    25%  { transform: scale(0.95); }
    38%  { transform: scale(1.2); }
    50%  { transform: scale(1); }
    65%  { transform: scale(1.45); }
    75%  { transform: scale(0.9); }
    88%  { transform: scale(1.25); }
    100% { transform: scale(1); }
}