.contPreloader{
    width: 100%;
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background: rgb(19, 19, 19);
    z-index: 500;
    opacity: 1;
}

.contPreloader_JS{
    animation: aparecer;
    animation-duration: 4s;
    animation-fill-mode: forwards;
}
@keyframes aparecer {
    50%{
        opacity: 1;
    }
    100%{
        opacity: 0;
        visibility: hidden;
    }
}

.textPreloader{
    color: white;
    font-size: 16px;
    margin-top: 35px;
    font-weight:100;
}



/*ESTILOS PREDETERMINADOS*/

.cssload-loader {
	width: 24px;
	height: 24px;
	position: absolute;
	left: 50%;
	transform: translate3d(-50%, -50%, 0);
		-o-transform: translate3d(-50%, -50%, 0);
		-ms-transform: translate3d(-50%, -50%, 0);
		-webkit-transform: translate3d(-50%, -50%, 0);
		-moz-transform: translate3d(-50%, -50%, 0);
	perspective: 1200;
		-o-perspective: 1200;
		-ms-perspective: 1200;
		-webkit-perspective: 1200;
		-moz-perspective: 1200;
}

.cssload-flipper {
	position: relative;
	display: block;
	height: inherit;
	width: inherit;
	animation: cssload-flip 1.38s infinite ease-in-out;
		-o-animation: cssload-flip 1.38s infinite ease-in-out;
		-ms-animation: cssload-flip 1.38s infinite ease-in-out;
		-webkit-animation: cssload-flip 1.38s infinite ease-in-out;
		-moz-animation: cssload-flip 1.38s infinite ease-in-out;
	transform-style: preserve-3d;
		-o-transform-style: preserve-3d;
		-ms-transform-style: preserve-3d;
		-webkit-transform-style: preserve-3d;
		-moz-transform-style: preserve-3d;
}

.cssload-front,
.cssload-back {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	background-color: rgb(250,40,40);
	height: 100%;
	width: 100%;
	backface-visibility: hidden;
}

.cssload-back {
	background-color: rgb(255,255,255);
	z-index: 800;
	transform: rotateY(-180deg);
		-o-transform: rotateY(-180deg);
		-ms-transform: rotateY(-180deg);
		-webkit-transform: rotateY(-180deg);
		-moz-transform: rotateY(-180deg);
}



@keyframes cssload-flip {
	0% {
		transform: perspective(117px) rotateX(0deg) rotateY(0deg);
	}
	50% {
		transform: perspective(117px) rotateX(-180.1deg) rotateY(0deg);
	}
	100% {
		transform: perspective(117px) rotateX(-180deg) rotateY(-179.9deg);
	}
}

@-o-keyframes cssload-flip {
	0% {
		-o-transform: perspective(117px) rotateX(0deg) rotateY(0deg);
	}
	50% {
		-o-transform: perspective(117px) rotateX(-180.1deg) rotateY(0deg);
	}
	100% {
		-o-transform: perspective(117px) rotateX(-180deg) rotateY(-179.9deg);
	}
}

@-ms-keyframes cssload-flip {
	0% {
		-ms-transform: perspective(117px) rotateX(0deg) rotateY(0deg);
	}
	50% {
		-ms-transform: perspective(117px) rotateX(-180.1deg) rotateY(0deg);
	}
	100% {
		-ms-transform: perspective(117px) rotateX(-180deg) rotateY(-179.9deg);
	}
}

@-webkit-keyframes cssload-flip {
	0% {
		-webkit-transform: perspective(117px) rotateX(0deg) rotateY(0deg);
	}
	50% {
		-webkit-transform: perspective(117px) rotateX(-180.1deg) rotateY(0deg);
	}
	100% {
		-webkit-transform: perspective(117px) rotateX(-180deg) rotateY(-179.9deg);
	}
}

@-moz-keyframes cssload-flip {
	0% {
		-moz-transform: perspective(117px) rotateX(0deg) rotateY(0deg);
	}
	50% {
		-moz-transform: perspective(117px) rotateX(-180.1deg) rotateY(0deg);
	}
	100% {
		-moz-transform: perspective(117px) rotateX(-180deg) rotateY(-179.9deg);
	}
}