share/goodie/css_animations/demo_3/style.css
.tile--css_animations__demo4 div {
    width: 115px;
    height: 115px;
    background: rgb(0, 0, 255);
    animation: flipAround 8s infinite;
    transform-origin: right;
}
@keyframes flipAround {
    25% {
        transform-origin: right;
        animation-mode: forwards;
        transform: rotateY(-180deg);
    }
    25.001% {
        transform-origin: bottom;
        transform: translateX(115px);
    }
    50% {
        transform-origin: bottom;
        transform: translateX(115px) rotateX(-180deg);
    }
    50.001% {
        transform-origin: left;
        transform: translateX(115px) translateY(115px);
    }
    75% {
        transform-origin: left;
        transform-origin: left;
        transform: translateX(115px) translateY(115px) rotateY(180deg);
    }
    75.001% {
        transform-origin: top;
        transform: translateY(115px);
    }
    100% {
        transform-origin: top;
        transform-origin: top;
        transform: translateY(115px) rotateX(180deg);
    }
}
.tile--css_animations__demo4 {
    height: 230px;
}