svg#freepik_stories-reading-list:not(.animated) .animable {
    opacity: 0;
}
svg#freepik_stories-reading-list.animated #freepik--background-complete--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) zoomOut;
    animation-delay: 0s;
}
svg#freepik_stories-reading-list.animated #freepik--Shadow--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) lightSpeedLeft;
    animation-delay: 0s;
}
svg#freepik_stories-reading-list.animated #freepik--Character--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideDown, 1.5s Infinite linear wind;
    animation-delay: 0s, 1s;
}
/*procedimiento*/
svg#freepik_stories-processing:not(.animated) .animable {
    opacity: 0;
}
svg#freepik_stories-processing.animated #freepik--background-complete--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) zoomIn;
    animation-delay: 0s;
}
svg#freepik_stories-processing.animated #freepik--Shadow--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideUp;
    animation-delay: 0s;
}
svg#freepik_stories-processing.animated #freepik--Graphics--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) zoomOut, 1.5s Infinite linear floating;
    animation-delay: 0s, 1s;
}
svg#freepik_stories-processing.animated #freepik--Character--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideLeft, 1.5s Infinite linear wind;
    animation-delay: 1s, 2s;
    opacity: 0;
}

/*  perfil  */
svg#freepik_stories-product-tour:not(.animated) .animable {
    opacity: 0;
}
svg#freepik_stories-product-tour.animated #freepik--background-simple--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideLeft, 1.5s Infinite linear floating;
    animation-delay: 0s, 1s;
}
svg#freepik_stories-product-tour.animated #freepik--Plants--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) lightSpeedLeft;
    animation-delay: 0s;
}
svg#freepik_stories-product-tour.animated #freepik--Device--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) zoomIn;
    animation-delay: 0s;
}
svg#freepik_stories-product-tour.animated #freepik--Character--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideRight, 1.5s Infinite linear wind;
    animation-delay: 1s, 2s;
    opacity: 0;
}


/*material de apoyo */
svg#freepik_stories-uploading:not(.animated) .animable {
    opacity: 0;
}
svg#freepik_stories-uploading.animated #freepik--background-complete--inject-9 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) zoomIn;
    animation-delay: 0s;
}
svg#freepik_stories-uploading.animated #freepik--Character--inject-9 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideRight, 1.5s Infinite linear wind;
    animation-delay: 1s, 2s;
    opacity: 0;
}
svg#freepik_stories-uploading.animated #freepik--Desk--inject-9 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideDown;
    animation-delay: 0s;
}
svg#freepik_stories-uploading.animated #freepik--Lamp--inject-9 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideUp;
    animation-delay: 0s;
}
svg#freepik_stories-uploading.animated #freepik--Floor--inject-9 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) zoomOut;
    animation-delay: 0s;
}
svg#freepik_stories-uploading.animated #freepik--Files--inject-9 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) zoomIn, 1.5s Infinite linear shake;
    animation-delay: 0s, 1s;
}
svg#freepik_stories-uploading.animated #freepik--Cloud--inject-9 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) lightSpeedLeft;
    animation-delay: 0s;
}

/*contacto */
svg#freepik_stories-email-campaign:not(.animated) .animable {
    opacity: 0;
}
svg#freepik_stories-email-campaign.animated #freepik--Floor--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideDown;
    animation-delay: 0s;
}
svg#freepik_stories-email-campaign.animated #freepik--Shadows--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) lightSpeedRight;
    animation-delay: 0s;
}
svg#freepik_stories-email-campaign.animated #freepik--Clouds--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideLeft;
    animation-delay: 0s;
}
svg#freepik_stories-email-campaign.animated #freepik--Plant--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideLeft;
    animation-delay: 0s;
}
svg#freepik_stories-email-campaign.animated #freepik--Device--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideUp;
    animation-delay: 0s;
}
svg#freepik_stories-email-campaign.animated #freepik--Character--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) zoomOut, 1.5s Infinite linear floating;
    animation-delay: 0s, 1s;
}
svg#freepik_stories-email-campaign.animated #freepik--paper-planes--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideLeft, 1.5s Infinite linear wind;
    animation-delay: 0s, 1s;
}
svg#freepik_stories-email-campaign.animated #freepik--Icon--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideUp;
    animation-delay: 0s;
}
svg#freepik_stories-email-campaign.animated #freepik--Envelope--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) fadeIn;
    animation-delay: 0s;
}
/*terminos*/
svg#freepik_stories-task:not(.animated) .animable {
    opacity: 0;
}
svg#freepik_stories-task.animated #freepik--Floor--inject-53 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) zoomOut;
    animation-delay: 0s;
}
svg#freepik_stories-task.animated #freepik--Shadows--inject-53 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideDown;
    animation-delay: 0s;
}
svg#freepik_stories-task.animated #freepik--Tasks--inject-53 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideRight;
    animation-delay: 0s;
}
svg#freepik_stories-task.animated #freepik--Chair--inject-53 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideRight;
    animation-delay: 0s;
}
svg#freepik_stories-task.animated #freepik--Desk--inject-53 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideLeft;
    animation-delay: 0s;
}
svg#freepik_stories-task.animated #freepik--Files--inject-53 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) lightSpeedLeft, 1.5s Infinite linear floating;
    animation-delay: 0s, 1s;
}
svg#freepik_stories-task.animated #freepik--Character--inject-53 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) zoomOut, 1.5s Infinite linear wind;
    animation-delay: 0.5s, 1.5s;
    opacity: 0;
}
/*modulos1*/
svg#freepik_stories-real-time-sync:not(.animated) .animable {
    opacity: 0;
}
svg#freepik_stories-real-time-sync.animated #freepik--background-complete--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) zoomIn;
    animation-delay: 0s;
}
svg#freepik_stories-real-time-sync.animated #freepik--Plant--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideRight, 1.5s Infinite linear wind;
    animation-delay: 0s, 1s;
}
svg#freepik_stories-real-time-sync.animated #freepik--Floor--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) lightSpeedRight;
    animation-delay: 0s;
}
svg#freepik_stories-real-time-sync.animated #freepik--Shadow--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideUp;
    animation-delay: 0s;
}
svg#freepik_stories-real-time-sync.animated #freepik--device-2--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideLeft;
    animation-delay: 0s;
}
svg#freepik_stories-real-time-sync.animated #freepik--Cloud--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideDown, 1.5s Infinite linear floating;
    animation-delay: 0s, 1s;
}
svg#freepik_stories-real-time-sync.animated #freepik--device-1--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) fadeIn, 1.5s Infinite linear shake;
    animation-delay: 0s, 1s;
}
svg#freepik_stories-real-time-sync.animated #freepik--Character--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideLeft;
    animation-delay: 0s;
}
/* modulo2 */
svg#freepik_stories-real-time-sync2:not(.animated) .animable {
    opacity: 0;
}
svg#freepik_stories-real-time-sync2.animated #freepik--background-complete--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) zoomIn;
    animation-delay: 0s;
}
svg#freepik_stories-real-time-sync2.animated #freepik--Plant--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideRight, 1.5s Infinite linear wind;
    animation-delay: 0s, 1s;
}
svg#freepik_stories-real-time-sync2.animated #freepik--Floor--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) lightSpeedRight;
    animation-delay: 0s;
}
svg#freepik_stories-real-time-sync2.animated #freepik--Shadow--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideUp;
    animation-delay: 0s;
}
svg#freepik_stories-real-time-sync2.animated #freepik--device-2--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideLeft;
    animation-delay: 0s;
}
svg#freepik_stories-real-time-sync2.animated #freepik--Cloud--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideDown, 1.5s Infinite linear floating;
    animation-delay: 0s, 1s;
}
svg#freepik_stories-real-time-sync2.animated #freepik--device-1--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) fadeIn, 1.5s Infinite linear shake;
    animation-delay: 0s, 1s;
}
svg#freepik_stories-real-time-sync2.animated #freepik--Character--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideLeft;
    animation-delay: 0s;
}

/*modulo 3 */
svg#freepik_stories-real-time-sync3:not(.animated) .animable {
    opacity: 0;
}
svg#freepik_stories-real-time-sync3.animated #freepik--background-complete--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) zoomIn;
    animation-delay: 0s;
}
svg#freepik_stories-real-time-sync3.animated #freepik--Plant--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideRight, 1.5s Infinite linear wind;
    animation-delay: 0s, 1s;
}
svg#freepik_stories-real-time-sync3.animated #freepik--Floor--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) lightSpeedRight;
    animation-delay: 0s;
}
svg#freepik_stories-real-time-sync3.animated #freepik--Shadow--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideUp;
    animation-delay: 0s;
}
svg#freepik_stories-real-time-sync3.animated #freepik--device-2--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideLeft;
    animation-delay: 0s;
}
svg#freepik_stories-real-time-sync3.animated #freepik--Cloud--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideDown, 1.5s Infinite linear floating;
    animation-delay: 0s, 1s;
}
svg#freepik_stories-real-time-sync3.animated #freepik--device-1--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) fadeIn, 1.5s Infinite linear shake;
    animation-delay: 0s, 1s;
}
svg#freepik_stories-real-time-sync3.animated #freepik--Character--inject-2 {
    animation: 1s 1 forwards cubic-bezier(0.36, -0.01, 0.5, 1.38) slideLeft;
    animation-delay: 0s;
}

@keyframes zoomIn {
    0% {
        opacity: 0;
        transform: scale(0.5);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}
@keyframes zoomOut {
    0% {
        opacity: 0;
        transform: scale(1.5);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}
@keyframes lightSpeedLeft {
    from {
        transform: translate3d(-50%, 0, 0) skewX(20deg);
        opacity: 0;
    }
    60% {
        transform: skewX(-10deg);
        opacity: 1;
    }
    80% {
        transform: skewX(2deg);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}
@keyframes lightSpeedRight {
    from {
        transform: translate3d(50%, 0, 0) skewX(-20deg);
        opacity: 0;
    }
    60% {
        transform: skewX(10deg);
        opacity: 1;
    }
    80% {
        transform: skewX(-2deg);
    }
    to {
        opacity: 1;
        transform: translate3d(0, 0, 0);
    }
}
@keyframes slideDown {
    0% {
        opacity: 0;
        transform: translateY(-30px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}
@keyframes wind {
    0% {
        transform: rotate(0deg);
    }
    25% {
        transform: rotate(1deg);
    }
    75% {
        transform: rotate(-1deg);
    }
}
@keyframes slideUp {
    0% {
        opacity: 0;
        transform: translateY(30px);
    }
    100% {
        opacity: 1;
        transform: inherit;
    }
}
@keyframes floating {
    0% {
        opacity: 1;
        transform: translateY(0px);
    }
    50% {
        transform: translateY(-10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0px);
    }
}
@keyframes slideLeft {
    0% {
        opacity: 0;
        transform: translateX(-30px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}
@keyframes slideRight {
    0% {
        opacity: 0;
        transform: translateX(30px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}
@keyframes fadeIn {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
@keyframes shake {
    10%,
    90% {
        transform: translate3d(-1px, 0, 0);
    }
    20%,
    80% {
        transform: translate3d(2px, 0, 0);
    }
    30%,
    50%,
    70% {
        transform: translate3d(-4px, 0, 0);
    }
    40%,
    60% {
        transform: translate3d(4px, 0, 0);
    }
}
.animator-hidden {
    display: none;
}
