.w-loader {
    height: 18px;
    width: 100%;
    vertical-align: middle;
    padding: 5px 0;
}

.pip-1,
.pip-2,
.pip-3 {
    animation-direction: both;
    animation-duration: 0.8s;
    animation-iteration-count: infinite;
    animation-timing-function: linear;
}

.pip-1 {
    animation-name: pip1_transform, pip1_opacity;
    opacity: 0.5;
    transform: translate(10.5px, 12.76px);
}

.pip-2 {
    animation-name: pip2_transform, pip2_opacity;
    opacity: 0.7;
    transform: translate(33.5px, 12.4794px);
}

.pip-3 {
    animation-name: pip3_transform, pip3_opacity;
    opacity: 1;
    transform: translate(56.5px, 10px);
}

@keyframes pip1_transform {
    0% {
        animation-timing-function: cubic-bezier(0.349138, 0.387416, 0.677763, 0.742755);
        transform: translate(10.5px, 12.759979px);
    }
    10% {
        animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
        transform: translate(10.5px, 16px);
    }
    60% {
        animation-timing-function: cubic-bezier(0.439018, 0, 0.741925, 0.554529);
        transform: translate(10.5px, 10px);
    }
    100% {
        transform: translate(10.5px, 12.759979px);
    }
}
@keyframes pip1_opacity {
    0% {
        opacity: 0.5;
    }
    10% {
        opacity: 0.5;
    }
    60% {
        opacity: 1;
    }
    100% {
        opacity: 0.7;
    }
}
@keyframes pip2_transform {
    0% {
        animation-timing-function: cubic-bezier(0.40903, 0.284382, 0.71216, 0.763185);
        transform: translate(33.5px, 12.479385px);
    }
    30% {
        animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
        transform: translate(33.5px, 16px);
    }
    80% {
        animation-timing-function: cubic-bezier(0.379206, 0, 0.707638, 0.402709);
        transform: translate(33.5px, 10px);
    }
    100% {
        transform: translate(33.5px, 12.479385px);
    }
}
@keyframes pip2_opacity {
    0% {
        opacity: 0.7;
    }
    30% {
        opacity: 0.5;
    }
    80% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@keyframes pip3_transform {
    0% {
        animation-timing-function: cubic-bezier(0.47, 0, 0.745, 0.715);
        transform: translate(56.5px, 10px);
    }
    50% {
        animation-timing-function: cubic-bezier(0.39, 0.575, 0.565, 1);
        transform: translate(56.5px, 16px);
    }
    100% {
        transform: translate(56.5px, 10px);
    }
}
@keyframes pip3_opacity {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
    100% {
        opacity: 1;
    }
}
