.app-icon {
    width: 65px;
    height: 65px;
    position: absolute;
    background-size: cover;
    background-position: center;
    background: #fff 0% 0% no-repeat padding-box;
    box-shadow: 0 3px 5px #00000033;
    border-radius: 10px;
    background-position-x: center;
    display: flex;
    align-items: end;
    justify-content: end;
    padding: 6px;
}

    .app-icon span {
        max-height: 18px;
        overflow: hidden;
        display: flex;
        justify-content: center;
    }

.move-left {
    animation: moveLeftToCenter 1.5s ease-in-out infinite;
}

.move-right {
    animation: moveRightToCenter 1.5s ease-in-out infinite;
}

.whatsapp {
    top: -6rem;
    left: 8rem;
    background-image: url('../../images/plantillas/whats_.png');
}

.portafolio {
    top: -5.5rem;
    left: 7.5rem;
    background-image: url('../../images/plantillas/porta_.png');
    animation-delay: .3s !important;
}

.web {
    top: -5rem;
    left: 7rem;
    background-image: url('../../images/plantillas/web_.png');
    animation-delay: .6s !important;
}

.redes {
    top: -4.5rem;
    left: 6.5rem;
    background-image: url('../../images/plantillas/redes_.png');
    animation-delay: .9s !important;
}

.productos {
    top: -4rem;
    left: 6rem;
    background-image: url('../../images/plantillas/servicios_.png');
    animation-delay: 1.2s !important;
}

.contacto {
    top: -3.5rem;
    left: 5.5rem;
    background-image: url('../../images/plantillas/contactos_.png');
    animation-delay: 1.5s !important;
}

.video {
    top: -3rem;
    left: 5rem;
    background-image: url('../../images/plantillas/video_p.png');
    animation-delay: 1.8s !important;
}

.ubicacion {
    top: -2.5rem;
    left: 4.5rem;
    background-image: url('../../images/plantillas/ubi_.png');
    animation-delay: 2.1s !important;
}

.wechat {
    top: -2rem;
    left: 4rem;
    background-image: url('../../images/plantillas/wechat_1.png');
    animation-delay: 2.4s !important;
}

.criptos {
    top: -6rem;
    right: 13rem;
    background-image: url('../../images/plantillas/criptos.png');
}

.encuesta {
    top: -5.5rem;
    right: 12.5rem;
    background-image: url('../../images/plantillas/encuesta_1.png');
    animation-delay: .3s !important;
}

.llamar {
    top: -5rem;
    right: 12rem;
    background-image: url('../../images/plantillas/llamar_.png');
    animation-delay: .6s !important;
}

.email {
    top: -4.5rem;
    right: 11.5rem;
    background-image: url('../../images/plantillas/email_.png');
    animation-delay: .9s !important;
}

.insta {
    top: -4rem;
    right: 11rem;
    background-image: url('../../images/plantillas/insta.png');
    animation-delay: 1.2s !important;
}

.face {
    top: -3.5rem;
    right: 10.5rem;
    background-image: url('../../images/plantillas/face.png');
    animation-delay: 1.5s !important;
}

.youtube {
    top: -3rem;
    right: 10rem;
    background-image: url('../../images/plantillas/youtube.png');
    animation-delay: 1.8s !important;
}

.tiktok {
    top: -2.5rem;
    right: 9.5rem;
    background-image: url('../../images/plantillas/tiktok.png');
    animation-delay: 2.1s !important;
}

.x {
    top: -3rem;
    right: 9rem;
    background-image: url('../../images/plantillas/icon_X.png');
    animation-delay: 2.4s !important;
}


@keyframes moveLeftToCenter {
    0% {
        transform: translateX(0) translateY(0) scale(1);
        opacity: 1;
    }

    50% {
        opacity: 1;
        transform: translate(200%, 170%) scale(.75);
    }

    100% {
        transform: translate(200%, 400%) scale(0.5);
        opacity: 0;
    }
}

@keyframes moveRightToCenter {
    0% {
        transform: translateX(0) translateY(0) scale(1);
        opacity: 1;
    }

    50% {
        opacity: 1;
        transform: translate(-250%, 200%) scale(.75);
    }

    100% {
        transform: translate(-250%, 400%) scale(0.5);
        opacity: 0;
    }
}

@media (max-width: 600px) {
    .image-telefono-iconos {
        right: -2.4rem;
    }

    .move-left {
        animation: moveLeftToCenterSmall 1.5s ease-in-out infinite;
    }

    .move-right {
        animation: moveRightToCenterSmall 1.5s ease-in-out infinite;
    }

    .whatsapp {
        top: -6rem;
        left: 4.5rem;
    }

    .portafolio {
        top: -5.5rem;
        left: 4rem;
    }

    .web {
        top: -5rem;
        left: 3.5rem;
    }

    .redes {
        top: -4.5rem;
        left: 3rem;
    }

    .productos {
        top: -4rem;
        left: 2.5rem;
    }

    .contacto {
        top: -3.5rem;
        left: 2rem;
    }

    .video {
        top: -3rem;
        left: 1.5rem;
    }

    .ubicacion {
        top: -2.5rem;
        left: 1rem;
    }

    .wechat {
        top: -2rem;
        left: 0.5rem;
    }

    .criptos {
        top: -8rem;
        right: -4rem;
    }

    .encuesta {
        top: -7.5rem;
        right: -3.5rem;
    }

    .llamar {
        top: -7rem;
        right: -3rem;
    }

    .email {
        top: -6.5rem;
        right: -2.5rem;
    }

    .insta {
        top: -6rem;
        right: -2rem;
    }

    .face {
        top: -5.5rem;
        right: -1.5rem;
    }

    .youtube {
        top: -4rem;
        right: -1rem;
    }

    .tiktok {
        top: -2.5rem;
        right: -.5rem;
    }

    .x {
        top: -2rem;
        right: 0rem;
    }

    @keyframes moveLeftToCenterSmall {
        0% {
            transform: translateX(0) translateY(0) scale(1);
            opacity: 1;
        }

        50% {
            transform: translateX(100%) translateY(175%) scale(.75);
            opacity: 0.7;
        }

        100% {
            transform: translateX(100%) translateY(400%) scale(0.5);
            opacity: 0.5;
        }
    }
    
    @keyframes moveRightToCenterSmall {
        0% {
            transform: translateX(0) translateY(0) scale(1.2);
            opacity: 1;
        }

        50% {
            transform: translateX(-250%) translateY(200%) scale(0.9);
            opacity: 0.7;
        }

        100% {
            transform: translateX(-250%) translateY(400%) scale(0.7);
            opacity: 0.5;
        }
    }
}