.vct-three-dot-spinner,
.vct-three-dot-spinner:before,
.vct-three-dot-spinner:after {
    border-radius: 50%;
    width: 2.0em;
    height: 2.0em;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    -webkit-animation: vct-three-dot-spinner 1.8s infinite ease-in-out;
    animation: vct-three-dot-spinner 1.8s infinite ease-in-out;
}

.vct-three-dot-spinner {
    color: #ccc;
    font-size: 4px; /* Als font size niet een even aantal is dan zie je als je goed kijkt dat hij hem aan de onderkant wrapt. */
    margin: 80px auto;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -1.0em;
    margin-left: -1.0em;
    text-indent: -9999em;
    z-index: 9999;
    -webkit-animation-delay: -0.16s;
    animation-delay: -0.16s;
}

    .vct-three-dot-spinner:before,
    .vct-three-dot-spinner:after {
        content: '';
        position: absolute;
        top: 0;
    }

    .vct-three-dot-spinner:before {
        left: -3.5em;
        -webkit-animation-delay: -0.32s;
        animation-delay: -0.32s;
    }

    .vct-three-dot-spinner:after {
        left: 3.5em;
    }

@-webkit-keyframes vct-three-dot-spinner {
    0%, 80%, 100% {
        box-shadow: 0 2.5em 0 -1.3em;
    }

    40% {
        box-shadow: 0 2.5em 0 0;
    }
}

@keyframes vct-three-dot-spinner {
    0%, 80%, 100% {
        box-shadow: 0 2.5em 0 -1.3em;
    }

    40% {
        box-shadow: 0 2.5em 0 0;
    }
}