[x-cloak] {
  display: none !important;
}


/* Animación Nes Pro */
.jello-horizontal:hover {
  -webkit-animation: jello-horizontal 0.9s both;
  animation: jello-horizontal 0.9s both;
}
@-webkit-keyframes jello-horizontal {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}
@keyframes jello-horizontal {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.25, 0.75, 1);
    transform: scale3d(1.25, 0.75, 1);
  }
  40% {
    -webkit-transform: scale3d(0.75, 1.25, 1);
    transform: scale3d(0.75, 1.25, 1);
  }
  50% {
    -webkit-transform: scale3d(1.15, 0.85, 1);
    transform: scale3d(1.15, 0.85, 1);
  }
  65% {
    -webkit-transform: scale3d(0.95, 1.05, 1);
    transform: scale3d(0.95, 1.05, 1);
  }
  75% {
    -webkit-transform: scale3d(1.05, 0.95, 1);
    transform: scale3d(1.05, 0.95, 1);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1);
  }
}

/* Boton Crear sombra */
.btnCrear {
  -webkit-box-shadow: 0px 1px 17px -2px #e02944;
  box-shadow: 0px 1px 17px -2px #e02944;
}

/* Boton Crear animación */
.btnCrear:active {
  animation: press 0.2s 1 linear;
}

/* Animación Boton Crear */
@keyframes press {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(0.7);
  }
  to {
    transform: scale(1);
  }
}

/* Animacion Boton crear Scroll */
.scale-in-center {
  -webkit-animation: scale-in-center 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94)
    both;
  animation: scale-in-center 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
}

.scale-in-center-reverse {
  -webkit-animation: scale-in-center-reverse 0.5s
    cubic-bezier(0.25, 0.46, 0.45, 0.94) reverse both;
  animation: scale-in-center-reverse 0.5s cubic-bezier(0.25, 0.46, 0.45, 0.94)
    reverse both;
}

/* Animacion Boton crear Scroll */
@-webkit-keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes scale-in-center {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}

@-webkit-keyframes scale-in-center-reverse {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes scale-in-center-reverse {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
    opacity: 1;
  }
  100% {
    -webkit-transform: scale(1);
    transform: scale(1);
    opacity: 1;
  }
}


/* Estilos Subir imagen a Momentos para publicar */
figure {
  width: 25%;
}

/* Estilos Animación Nes+ Preloader Conocer */
.loader{
  position: absolute;
  left:50%;
  margin-top:2rem;
  transform: translate(-50%, -50%);
  height:6px;
  width:15rem;
  background-color:lightgrey;
  border-radius: 8px;
}
.loading{
  background-color: #F92E4B;
  width:5rem;
  height:6px;
  animation: animation 1.8s infinite;
  border-radius: 8px;
}

@keyframes animation {
    0% {
        transform: translateX(0rem);
    }
    50% {
        transform: translateX(10rem);
    }
    100% {
        transform: translateX(0rem);
    }
  }

.inputError{
    border: 2px solid red !important;
}

.imagenError{
    border: 2px dashed red !important;
}