@keyframes hinge {
    0% {
        animation-timing-function: ease-in-out;
        transform-origin: top left
    }

    20%,
    60% {
        animation-timing-function: ease-in-out;
        transform: rotate(80deg);
        transform-origin: top left
    }

    40%,
    80% {
        animation-timing-function: ease-in-out;
        opacity: 1;
        transform: rotate(60deg);
        transform-origin: top left
    }

    to {
        opacity: 0;
        transform: translate3d(0, 700px, 0)
    }
}

.hinge {
    animation-duration: 2s;
    animation-name: hinge
}