@keyframes pump-it-up1 {
    20% {}
    40% {height: 44px;}
    60% {height: 28px;}80% {height: 42px;}
    100% {height: 49px;}
}
@keyframes pump-it-up2 {
    20% {}
    40% {height: 6px;}
    60% {height: 14px;}
    80% {height: 24px;}
    100% {height: 30px;}
}
@keyframes pump-it-up3 {
    20% {}
    40% {height: 21px;}
    60% {height: 30px;}
    80% {height: 24px;}
    100% {height: 30px;}
}
@keyframes pump-it-up4 {
    20% {}
    40% {height: 30px;}
    60% {height: 13px;}
    80% {height: 36px;}
    100% {height: 6px;}
}
@keyframes pump-it-up5 {
    20% {}
    40% {height: 30px;}
    60% {height: 27px;}
    80% {height: 25px;}
    100% {height: 3px;}
}
@keyframes pump-it-up6 {
    20% {}
    40% {height: 24px;}
    60% {height: 30px;}
    80% {height: 24px;}
    100% {height: 3px;}
}
@keyframes pump-it-up7 {
    20% {}
    40% {height: 20px;}
    60% {height: 6px;}
    80% {height: 20px;}
    100% {height: 30px;}
}
@keyframes pump-it-up8 {
    20% {}
    40% {height: 13px;}
    60% {height: 2px;}
    80% {height: 17px;}
    100% {height: 22px;}
}
@keyframes pump-it-up9 {
    20% {}
    40% {height: 25px;}
    60% {height: 30px;}
    80% {height: 15px;}
    100% {height: 14px;}
}

#eq {width: 100%; z-index: 101; position: absolute; top: 15px; left: 25px; transform: scale(0.5);}
#eq .level {width: 2px; margin-left: 1px; display: inline-block; position: relative;}
#eq .level:after {content: ' '; position: absolute; bottom: 0; left: 0; background: white; width: 3px;}

#eq .level.level1.active:after {height: 30px; animation: pump-it-up1 495ms linear infinite alternate;}
#eq .level.level2.active:after {height: 25px; animation: pump-it-up2 340ms linear infinite alternate;}
#eq .level.level3.active:after {height: 19px; animation: pump-it-up3 800ms linear infinite alternate;}
#eq .level.level4.active:after {height: 7px; animation: pump-it-up4 630ms linear infinite alternate;}
#eq .level.level5.active:after {height: 10px; animation: pump-it-up5 305ms linear infinite alternate;}
#eq .level.level6.active:after {height: 12px; animation: pump-it-up6 346ms linear infinite alternate;}
#eq .level.level7.active:after {height: 12px; animation: pump-it-up7 385ms linear infinite alternate;}
#eq .level.level8.active:after {height: 3px; animation: pump-it-up8 424ms linear infinite alternate;}
#eq .level.level9.active:after {height: 6px; animation: pump-it-up9 661ms linear infinite alternate;}

#eq .level.level1:after {height: 20px;}
#eq .level.level2:after {height: 28px;}
#eq .level.level3:after {height: 19px;}
#eq .level.level4:after {height: 7px;}
#eq .level.level5:after {height: 10px;}
#eq .level.level6:after {height: 12px;}
#eq .level.level7:after {height: 12px;}
#eq .level.level8:after {height: 3px;}
#eq .level.level9:after {height: 6px;}