Efeito Pump e Split

Paraaaaa tudo monas, tudo bem com vocês? (◞⁎˃ᆺ˂)◞✰ Eu ainda estou no chão e me recuperando do comeback dos meus goxtosos do bts. Eu estou perplexa com tanta perfeição, sério gente, quando eu digo que eles são os melhores muitos discordam mas desculpe ai você que não curte, você não sabe o que está perdendo.  Eu já escutei tanto fake love que acho que a metade do stream da música fui eu em quem o fez haha. Juro que irei tentar falar menos deles, mas é algo tão difícil.

Mudando um pouco de assunto, fazia tempo que eu não criava icons trabalhadinhos, hoje eu estou trazendo dois efeitos de imagens e de demostração tem alguns icons que criei, acho que irei fazer um pack deles e por no deviantart para baixarem o que vocês me dizem? Será que irão baixar e será que vale a pena? Bem, eu amo editar esses icons, acho tão legal brincar com os efeitos, cores e texturas, na verdade é algo que me relaxa tanto, quero saber a opinião de vocês 'ω'

LIVE PREVIEW (╯✧∇✧)╯

E para usar os efeitos, vá até o seu modelo, clique em editar html e procure por ]]></b:skin> e acima dele cole o código do efeito escolhido:

efeito pump

.pump{
width: 100px;
height: 100px;
background:#;
opacity: 1;
margin:0px;
margin-bottom:1px;
z-index:9999;
-webkit-transition: all 2s ease;
-moz-transition: all 2s ease; -o-transition: all 2s ease;
transition: all 2s ease;
}
.pump:hover{
opacity: 0.6;
-webkit-transition: all 2s ease;
-moz-transition: all 2s ease; -o-transition: all 2s ease;
transition: all 2s ease;
-webkit-animation: bounce-top 1s;
}
@keyframes bounce-top{0%{transform:translateY(-45px);animation-timing-function:ease-in;opacity:1}24%{opacity:1}40%{transform:translateY(-24px);animation-timing-function:ease-in}65%{transform:translateY(-12px);animation-timing-function:ease-in}82%{transform:translateY(-6px);animation-timing-function:ease-in}93%{transform:translateY(-4px);animation-timing-function:ease-in}25%,55%,75%,87%{transform:translateY(0);animation-timing-function:ease-out}100%{transform:translateY(0);animation-timing-function:ease-out;opacity:1}}
}

 efeito split

.split{
width: 100px;
height: 100px;
background:#;
opacity: 1;
margin:0px;
margin-bottom:1px;
z-index:9999;
-webkit-transition: all 2s ease;
-moz-transition: all 2s ease; -o-transition: all 2s ease;
transition: all 2s ease;
}
.split:hover{
opacity: 0.6;
-webkit-transition: all 2s ease;
-moz-transition: all 2s ease; -o-transition: all 2s ease;
transition: all 2s ease;
-webkit-animation: shake-lr 1s;
}
@keyframes shake-lr{0%,100%{transform:rotate(0deg);transform-origin:50% 50%}10%{transform:rotate(8deg)}20%,40%,60%{transform:rotate(-10deg)}30%,50%,70%{transform:rotate(10deg)}80%{transform:rotate(-8deg)}90%{transform:rotate(8deg)}}
}

links 

<a href="https://www.blogger.com/" target="_blank" title="NOME"><img class="pump" src="IMAGEM" />
<a href="https://www.blogger.com/" target="_blank" title="NOME"><img class="pump" src="IMAGEM" />

Beijos!