
.textEffectSlideIn {
  position:absolute; color:transparent;
  text-shadow: 4px 40px 20px rgba(0, 0, 0, 0.1);
    animation: slidein 8s infinite; 
}

.textWrapsToEdge {
	white-space:normal !important;
}

.textIsCentred {
	text-align:center;
	left:0px;
	width: 1920px;
}

@keyframes slidein {
  0% {
  text-shadow: 0px 4px 20px rgba(0, 0, 0, 0.1);
    transition: all 1s ease-in-out;
    animation-timing-function: ease-in;
  }

  
  40% {
  	text-shadow: 20px 4px 2.0px rgba(0, 0, 0, 1.0);
  	    transition: all 1s linear;
    transform: translate(200, 0);
    animation-timing-function: linear;
  }

  70% {
  	text-shadow: 35px 4px 2.0px rgba(0, 0, 0, 1.0);
  	    transition: all 1s linear;
    transform: translate(200, 0);
    animation-timing-function: linear;
  }

  100% {
  text-shadow: 50px 4px 20px rgba(0, 0, 0, 0.1);
    transition: all 1s linear;
    animation-timing-function: linear;
  }  
}



.effectBoingZoomIn {
  	transform: scale(1, 1);
    animation: boingZoomInAnimation 0.5s 1; 
}

@keyframes boingZoomInAnimation {
  0% {
    transform: scale(0.0, 0.0);
    transition: all 1s ease-out;
    animation-timing-function: ease-out;
  }

  70% {
  	transition: all 1s ease-in-out;
    transform: scale(1.1, 1.1);
    animation-timing-function: ease-in-out;
  }
 
  85% {
  	transition: all 1s ease-in-out;
    transform: scale(0.9, 0.9);
    animation-timing-function: ease-in-out;
  }
  
  100% {
  	transition: all 1s ease-in-out;
    transform: scale(1, 1);
    animation-timing-function: ease-in-out;
  }
}

.effectBoingZoomOut {
  	transform: scale(0, 0);
    animation: boingZoomOutAnimation 0.5s 1; 
}

@keyframes boingZoomOutAnimation {
  0% {
    transform: scale(1, 1);
    transition: all 1s;
    animation-timing-function: ease-in-out;
  }

  10% {
  	transition: all 1s ease-in-out;
    transform: scale(1.1, 1.1);
    animation-timing-function: ease-in-out;
  }

  100% {
  	transition: all 1s ease-in;
    transform: scale(0, 0);
    animation-timing-function: ease-in;
  }
}

.effectSimpleZoomIn {
  	transform: scale(2, 2);
    animation: simpleZoomInAnimation 4s 1; 
}

@keyframes simpleZoomInAnimation {
  0% {
    transform: scale(1, 1);
    transition: all 1s ease-in-out;
    animation-timing-function: ease-in-out;
  }

  
  100% {
  	transition: all 1s ease-in-out;
    transform: scale(2, 2);
    animation-timing-function: ease-in-out;
  }
}

.effectSimpleZoomOut {
  	transform: scale(0, 0);
    animation: simpleZoomOutAnimation 8s 1; 
}

@keyframes simpleZoomOutAnimation {
  0% {
    transform: scale(1, 1);
    transition: all 1s ease-in-out;
    animation-timing-function: ease-in-out;
  }

  
  100% {
  	transition: all 1s ease-in-out;
    transform: scale(0, 0);
    animation-timing-function: ease-in-out;
  }
}

.effectZoomOutWithTwist {
  	transform: scale(0, 0);
    animation: zoomOutWithTwistAnimation 4s 1; 
}

@keyframes zoomOutWithTwistAnimation {
  0% {
    transform: rotate(0deg) scale(1, 1);
    transition: all 1s ease-in-out;
    animation-timing-function: ease-in-out;
  }

  100% {
  	transition: all 1s ease-in-out;
    transform: rotate(20deg) scale(0, 0);
    animation-timing-function: ease-in-out;
  }
}

.effectZoomInOut {
  	transform: scale(1, 1);
    animation: zoomInOutAnimation 4s 1; 
}

@keyframes zoomInOutAnimation {
    0% {
      transform: scale(1, 1);
      transition: all 1s ease-in-out;
      animation-timing-function: ease-in-out;
    }

  
    50% {
    	transition: all 1s ease-in-out;
      transform: scale(2, 2);
      animation-timing-function: ease-in-out;
    }
	
    100% {
    	transition: all 1s ease-in-out;
      transform: scale(1, 1);
      animation-timing-function: ease-in-out;
    }
}

.effectZoomInForMoment {
  	transform: scale(0, 0);
    animation: zoomInForMomentAnimation 20s 1; 
}

@keyframes zoomInForMomentAnimation {
  0% {
    transform: scale(0, 0);
    transition: all 1s ease-in-out;
    animation-timing-function: ease-in-out;
  }

  50% {
  	transition: all 1s ease-in-out;
    transform: scale(1, 1);
    animation-timing-function: ease-in-out;
  }
  
  100% {
  	transition: all 1s ease-in-out;
    transform: scale(0, 0);
    animation-timing-function: ease-in-out;
  }
}

.effectWobble {
  	transform: scale(1, 1);
	transform-origin: center;
    animation: wobbleAnimation 8s infinite; 
}

@keyframes wobbleAnimation {
  0% {
      transform: scale(1.0, 1.0);
      transition: all 11s ease-out;
      animation-timing-function: ease-out;
    }	
	
  25% {
    transform: scale(0.975, 1.025);
    transition: all 5s ease-in;
    animation-timing-function: ease-in;
  }

  
  50% {
  	transition: all 5s ease-out;
    transform: scale(1.0, 1.0);
    animation-timing-function: ease-out;
  }
  
  75% {
    transform: scale(1.025, 0.975);
    transition: all 5s ease-in;
    animation-timing-function: ease-in;
  }
  
  100% {
    transform: scale(1.0, 1.0);
    transition: all 5s ease-in-out;
    animation-timing-function: ease-in-out;
  }
}

.effectWobbleTwist {
  	transform: scale(1, 1) rotate(0deg);
	transform-origin: center;
    animation: wobbleTwistAnimation 11s infinite; 
}

@keyframes wobbleTwistAnimation {
  0% {
      transform: scale(1.0, 1.0) skewX(0deg) skewY(0deg);
      transition: all 5s ease-out;
      animation-timing-function: ease-out;
    }	
	
  25% {
    transform: scale(0.975, 1.025) skewX(1deg) skewY(-2deg);
    transition: all 5s ease-in;
    animation-timing-function: ease-in;
  }

  
  50% {
  	transition: all 5s ease-out;
    transform: scale(1.0, 1.0)  skewX(0deg) skewY(0deg);
    animation-timing-function: ease-out;
  }
  
  75% {
    transform: scale(1.025, 0.975) skewX(-1deg) skewY(2deg);
    transition: all 5s ease-in;
    animation-timing-function: ease-in;
  }
  
  100% {
    transform: scale(1.0, 1.0)  skewX(0deg) skewY(0deg);
    transition: all 5s ease-in-out;
    animation-timing-function: ease-in-out;
  }
}


.textEffectBounce {
  position:absolute;
    text-shadow: 4px 4px 4px rgba(0, 0, 0, 0.8);
  transform: translate(0, 0);
    animation: slideinbounce 4s infinite; 
}

@keyframes slideinbounce {
  0% {
    transition: all 1s ease-in-out;
    animation-timing-function: ease-in;
  }

  
  40% {
  	    transition: all 1s linear;
    transform: translate(200, 0);
    animation-timing-function: linear;
  }

  70% {
  	    transition: all 1s linear;
    transform: translate(-200, 0);
    animation-timing-function: linear;
  }

  100% {
    transition: all 1s linear;
    animation-timing-function: linear;
  }  
}

@keyframes nervous {
	0% { transform: translate(2px, 1px) rotate(0deg); }
	10% { transform: translate(-1px, -2px) rotate(-1deg); }
	20% { transform: translate(-3px, 0px) rotate(1deg); }
	30% { transform: translate(0px, 2px) rotate(0deg); }
	40% { transform: translate(1px, -1px) rotate(1deg); }
	50% { transform: translate(-1px, 2px) rotate(-1deg); }
	60% { transform: translate(-3px, 1px) rotate(0deg); }
	70% { transform: translate(2px, 1px) rotate(-1deg); }
	80% { transform: translate(-1px, -1px) rotate(1deg); }
	88% { transform: translate(2px, 2px) rotate(0deg); }
	94% { transform: translate(1px, -2px) rotate(-1deg); }
	100% { transform: translate(2px, 1px) rotate(0deg); }
}

.effectNervous {
	animation: nervous 6.3s infinite;
}

.effectCaffeine {
	animation: nervous 0.3s infinite;
}

.effectMake3D {
	transform: rotateY(0deg);
}

.effectPageFlip {
  	transform: rotateY(0deg);
	transform-origin: 50% 50%;
	backface-visibility:hidden;
    animation: pageFlipAnimation 4s 1; 
}

@keyframes pageFlipAnimation {
  0% {
    transform: rotateY(0deg);
    transition: all 1s ease-in-out;
    animation-timing-function: ease-in-out;
  }

  
  100% {
    transform: rotateY(-180deg);	  
  	transition: all 1s ease-in-out;
    animation-timing-function: ease-in-out;
  }
}

.effectPageFlipReverse {
  	transform: rotateY(-180deg) scaleZ(-1);
	transform-origin: 50% 50%;
	backface-visibility:hidden;
    animation: pageFlipAnimationReverse 4s 1; 
}

@keyframes pageFlipAnimationReverse {
  0% {
    transform: rotateY(0deg) scaleZ(-1);
    transition: all 1s ease-in-out;
    animation-timing-function: ease-in-out;
  }

  
  100% {
    transform: rotateY(-180deg) scaleZ(-1);	  
  	transition: all 1s ease-in-out;
    animation-timing-function: ease-in-out;
  }
}


@keyframes littleFly {
	0% { transform: rotate(0deg) translate(0px, 0px); animation-timing-function: linear;  }
	16% { transform: rotate(180deg) translate(300px, 2px); animation-timing-function: linear;}
	28% { transform: rotate(360deg) translate(120px, 1px); animation-timing-function: linear;}
	50% { transform: rotate(540deg) translate(190px, 0px);  animation-timing-function: linear;}
	70% { transform: rotate(720deg) translate(420px, 2px); animation-timing-function: linear;}
	83% { transform: rotate(900deg) translate(220px, 1px); animation-timing-function: linear;}
	100% { transform: rotate(1080deg) translate(0px, 0px); animation-timing-function: ease-out;}
}

.effectLittleFly {
	animation: littleFly 6.3s infinite;
}