.animacionBorrar-x {

    animation: animacionBorrar-x 0.75s both;
	animation-iteration-count: 1;
    backface-visibility: visible !important;
}

@keyframes animacionBorrar-x {

    0% {
        transform: perspective(400px);
    }

    30% {
        transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
        opacity: 1;
    }

    100% {
        transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
        opacity: 0;
    }

} 

.animacionBorrar-y {

    animation: animacionBorrar-y 0.75s both;
	animation-iteration-count: 1;
    backface-visibility: visible !important;
}

@keyframes animacionBorrar-y {
    
    0% {
        transform: perspective(400px);
    }
    
    30% {
        transform: perspective(400px) rotate3d(0, 1, 0, -15deg);
        opacity: 1;
    }
    
    100% {
        transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
        opacity: 0;
    }
    
} 

.puntosCargando:after {
	content: " .";
	animation: animacionDeCarga 1s infinite;
}

@keyframes animacionDeCarga {

	0%,
	20% {
		color: transparent;
		text-shadow: 0.25em 0 0 transparent, 0.5em 0 0 transparent;
	}

	40% {
		text-shadow: 0.25em 0 0 transparent, 0.5em 0 0 transparent;
	}

	60% {
		text-shadow: 0.25em 0 0 var(--colorFuenteCuaternario), 0.5em 0 0 transparent;
	}

	80%,
	100% {
		text-shadow: 0.25em 0 0 var(--colorFuenteCuaternario),
			0.5em 0 0 var(--colorFuenteCuaternario);
	}
}

.animacionAgregarTarjeta {
	animation: animacionAgregarTarjeta 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
	animation-iteration-count: 1;
}

@keyframes animacionAgregarTarjeta {
	0% {
		transform: translateY(100%);
	}

	100% {
		transform: translateY(0);
	}
}