@keyframes slideInFromLeft {
  0% { transform: translateX(-100%); opacity: 0; }
  100% { transform: translateX(0); opacity: 1; }
}
	
@keyframes slideInFromRight {
  0% { transform: translateX(200%); }
  100% { transform: translateX(0); }
}

@keyframes slideInFromBottom {
  0% { transform: translateY(300%); }
  100% { transform: translateY(0); }
}
	
@keyframes slideInFromTop {
  0% { transform: translateY(-500%); }
  100% { transform: translateY(0); }
}

@keyframes FadeIn {
	0% { opacity:0; }
	100% { opacity:1; }
	}

.slideLeft {  animation: 1s ease-out 0s 1 slideInFromLeft;}
.slideRight {  animation: 1s ease-out 0s 1 slideInFromRight;}
.slideBottom {  animation: 1.5s ease-out 0s 1 slideInFromBottom;}
.slideTop {  animation: 1s ease-out 0s 1 slideInFromTop;}
.slideBottom2 {  animation: 1.6s ease-out 0s 1 slideInFromBottom;}
.slideBottom3 {  animation: 1s ease-out 0s 1 slideInFromBottom;}
.fade-in {  animation: 2.25s ease-out 0s 1 FadeIn;}
.fade-in-2 {  animation: 0.5s ease-out 0s 1 FadeIn;}
.navslide {  animation: 1s ease-out 0s 1 slideInFromTop; }