/*
  Animaciones
  */
  
  .elementoParaAnimar {
    opacity: 0;
    visibility: hidden;
  }
  .FadeRightNone{
    animation: FadeRightNone 1s linear 0s 1 alternate forwards;
}
@keyframes FadeRightNone {
	0% {
		opacity: 0;
		transform: translateX(50px);
	}

	100% {
		opacity: 1;
		transform: translateX(0);
	}
}

.FadeLeftNone{
    animation: FadeLeftNone 1s linear 0s 1 alternate forwards;
}
    @keyframes FadeLeftNone {
        0% {
            opacity: 0;
            transform: translateX(-50px);
        }
    
        100% {
            opacity: 1;
            transform: translateX(0);
        }
    }

    .FadeBottomNone{
        animation: FadeBottomNone 1s linear 0s 1 alternate forwards;
    }
    @keyframes FadeBottomNone {
        0% {
            opacity: 0;
            transform: translateY(50px);
        }
    
        100% {
            opacity: 1;
            transform: translateY(0);
        }
    }
  .FadeRight.active {
    visibility: visible;
    opacity: 1;
    animation: FadeRight 1s linear 0s 1 alternate forwards;
  }
  
  .FadeLeft.active {
    visibility: visible;
    opacity: 1;
    animation: FadeLeft 1s linear 0s 1 alternate forwards;
  }
  
  .FadeBottom.active {
    visibility: visible;
    opacity: 1;
    animation: FadeBottom 1s linear 0s 1 alternate forwards;
  }
  
  @keyframes FadeRight {
    0% {
      opacity: 0;
      transform: translateX(50px);
    }
    100% {
      opacity: 1;
      transform: translateX(0);
    }
  }
  
  @keyframes FadeLeft {
    0% {
      opacity: 0;
      transform: translateX(-50px);
    }
    100% {
      opacity: 1;
      transform: translateX(0);
    }
  }
  
  @keyframes FadeBottom {
    0% {
      opacity: 0;
      transform: translateY(50px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }