@keyframes breath {
    from {translate: 0 0px;}
    to {translate: 0 10px;}
}

@keyframes breath-shadow {
    from {scale: 1; opacity: 0.7;}
    to {scale: 1.2; opacity: 1;}
}

#cartilha {
    transform: scaleX(1) scaleY(1) scaleZ(1) rotateX(0deg) rotateY(-20deg) rotateZ(5deg) translateX(0px) translateY(0px) translateZ(0px) skewX(0deg) skewY(0deg);
    animation-name: breath;
    animation-duration: 4s;
    animation-delay: 0ms;

    /* animation-timing-function: cubic-bezier(0.65, 0, 0.35, 1); */
    animation-direction: alternate;
    animation-iteration-count: infinite;
}

#cartilha-sombra {
    background: radial-gradient(rgba(0,0,0,0.2),rgba(0,0,0,0));
    transform: scaleX(4) scaleY(1) scaleZ(1) rotateX(80deg) rotateY(0deg) rotateZ(0deg) translateX(50%) translateY(0px) translateZ(0px) skewX(0deg) skewY(0deg);
    animation-name: breath-shadow;
    animation-duration: 4s;
    animation-delay: 0ms;
    /* animation-timing-function: cubic-bezier(0.65, 0, 0.35, 1); */
    animation-direction: alternate;
    animation-iteration-count: infinite;
}