body {
    padding: 0;
    margin: 0;
    background-color: #2d3436;
    perspective: 100px;
}

.wrapper {
    position: relative;
    margin: 240px auto;
    height: 80px;
    width: 80px;
    transform-style: preserve-3d;
}

.wrapper>span {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    bottom: 0;
    border-radius: 50%;
}

.wrapper :first-child {
    background-color: #17c0eb;
    box-shadow: 2px 2px 16px #17c0eb;
    animation: anim .8s linear infinite reverse;
}

.wrapper :nth-child(2) {
    background-color: #ED4C67;
    box-shadow: 2px 2px 16px #ED4C67;
    animation: anim 1s linear infinite reverse;
}

.wrapper :last-child {
    background-color: #A3CB38;
    box-shadow: 2px 2px 16px #A3CB38;
    animation: anim 1.5s linear infinite reverse;
}

@keyframes anim {
    0% {
        transform: rotateY(0deg);
    }
    50% {
        transform: rotateY(180deg);
    }
    100% {
        transform: rotateY(360deg);
    }
}