[data-loader='jumping']
{
    position: relative;

    width: 50px;

    -webkit-perspective: 200px;
       -moz-perspective: 200px;
        -ms-perspective: 200px;
            perspective: 200px;
}
[data-loader='jumping']:before,
[data-loader='jumping']:after
{
    position: absolute;

    width: 20px;
    height: 20px;

    content: '';
    animation: jumping .5s infinite alternate;

    background: rgba(0,0,0,0);
}
[data-loader='jumping']:before
{
    left: 0;
}
[data-loader='jumping']:after
{
    right: 0;

    animation-delay: .15s;
}
@-webkit-keyframes jumping
{
    0%
    {
        -webkit-transform: scale(1.0) translateY(0px) rotateX(0deg);
            -ms-transform: scale(1.0) translateY(0px) rotateX(0deg);
             -o-transform: scale(1.0) translateY(0px) rotateX(0deg);
                transform: scale(1.0) translateY(0px) rotateX(0deg);

        -webkit-box-shadow: 0 0 0 rgba(0,0,0,0);
                box-shadow: 0 0 0 rgba(0,0,0,0);
    }
    100%
    {
        -webkit-transform: scale(1.2) translateY(-25px) rotateX(45deg);
            -ms-transform: scale(1.2) translateY(-25px) rotateX(45deg);
             -o-transform: scale(1.2) translateY(-25px) rotateX(45deg);
                transform: scale(1.2) translateY(-25px) rotateX(45deg);

        background: rgb(255,255,255);
        -webkit-box-shadow: 0 25px 40px rgb(255,255,255);
                box-shadow: 0 25px 40px rgb(255,255,255);
    }
}
@-moz-keyframes jumping
{
    0%
    {
        -webkit-transform: scale(1.0) translateY(0px) rotateX(0deg);
            -ms-transform: scale(1.0) translateY(0px) rotateX(0deg);
             -o-transform: scale(1.0) translateY(0px) rotateX(0deg);
                transform: scale(1.0) translateY(0px) rotateX(0deg);

        -webkit-box-shadow: 0 0 0 rgba(0,0,0,0);
                box-shadow: 0 0 0 rgba(0,0,0,0);
    }
    100%
    {
        -webkit-transform: scale(1.2) translateY(-25px) rotateX(45deg);
            -ms-transform: scale(1.2) translateY(-25px) rotateX(45deg);
             -o-transform: scale(1.2) translateY(-25px) rotateX(45deg);
                transform: scale(1.2) translateY(-25px) rotateX(45deg);

        background: rgb(255,255,255);
        -webkit-box-shadow: 0 25px 40px rgb(255,255,255);
                box-shadow: 0 25px 40px rgb(255,255,255);
    }
}
@-o-keyframes jumping
{
    0%
    {
        -webkit-transform: scale(1.0) translateY(0px) rotateX(0deg);
            -ms-transform: scale(1.0) translateY(0px) rotateX(0deg);
             -o-transform: scale(1.0) translateY(0px) rotateX(0deg);
                transform: scale(1.0) translateY(0px) rotateX(0deg);

        -webkit-box-shadow: 0 0 0 rgba(0,0,0,0);
                box-shadow: 0 0 0 rgba(0,0,0,0);
    }
    100%
    {
        -webkit-transform: scale(1.2) translateY(-25px) rotateX(45deg);
            -ms-transform: scale(1.2) translateY(-25px) rotateX(45deg);
             -o-transform: scale(1.2) translateY(-25px) rotateX(45deg);
                transform: scale(1.2) translateY(-25px) rotateX(45deg);

        background: rgb(255,255,255);
        -webkit-box-shadow: 0 25px 40px rgb(255,255,255);
                box-shadow: 0 25px 40px rgb(255,255,255);
    }
}
@keyframes jumping
{
    0%
    {
        -webkit-transform: scale(1.0) translateY(0px) rotateX(0deg);
            -ms-transform: scale(1.0) translateY(0px) rotateX(0deg);
             -o-transform: scale(1.0) translateY(0px) rotateX(0deg);
                transform: scale(1.0) translateY(0px) rotateX(0deg);

        -webkit-box-shadow: 0 0 0 rgba(0,0,0,0);
                box-shadow: 0 0 0 rgba(0,0,0,0);
    }
    100%
    {
        -webkit-transform: scale(1.2) translateY(-25px) rotateX(45deg);
            -ms-transform: scale(1.2) translateY(-25px) rotateX(45deg);
             -o-transform: scale(1.2) translateY(-25px) rotateX(45deg);
                transform: scale(1.2) translateY(-25px) rotateX(45deg);

        background: rgb(255,255,255);
        -webkit-box-shadow: 0 25px 40px rgb(255,255,255);
                box-shadow: 0 25px 40px rgb(255,255,255);
    }
 }
