.invisibility { visibility: hidden;}

.animation {
   opacity: 0;
   -webkit-animation-fill-mode: both;
   -moz-animation-fill-mode:    both;
   -o-animation-fill-mode:      both;
   animation-fill-mode:         both;
   -webkit-animation-timing-function: ease-out;
   -moz-animation-timing-function:    ease-out;
   -o-animation-timing-function:      ease-out;
   animation-timing-function:         ease-out;
   -webkit-animation-duration: 1s;
   -moz-animation-duration:    1s;
   -o-animation-duration:      1s;
   animation-duration:         1s;
}

.animation--pause .animation {
   -webkit-animation-play-state: paused;
   -moz-animation-play-state:    paused;
   -o-animation-play-state:      paused;
   animation-play-state:         paused;
}

.animation--play .animation {
   -webkit-animation-play-state: running;
   -moz-animation-play-state:    running;
   -o-animation-play-state:      running;
   animation-play-state:         running;
}

.fade-in {
   -webkit-animation-name: fade-in;
   -moz-animation-name:    fade-in;
   -o-animation-name:      fade-in;
   animation-name:         fade-in;
}

@-webkit-keyframes fade-in {
     0% { opacity: 0; }
   100% { opacity: 1; }
}

@-moz-keyframes fade-in {
     0% { opacity: 0; }
   100% { opacity: 1; }
}

@-o-keyframes fade-in {
     0% { opacity: 0; }
   100% { opacity: 1; }
}

@keyframes fade-in {
     0% { opacity: 0; }
   100% { opacity: 1; }
}

.fade-in-right {
   -webkit-animation-name: fade-in-right;
   -moz-animation-name:    fade-in-right;
   -o-animation-name:      fade-in-right;
   animation-name:         fade-in-right;
}

@-webkit-keyframes fade-in-right {
     0% { opacity: 0; -webkit-transform: translateX(350px); }
   100% { opacity: 1; -webkit-transform: translateX(0); }
}

@-moz-keyframes fade-in-right {
     0% { opacity: 0; -moz-transform: translateX(350px); }
   100% { opacity: 1; -moz-transform: translateX(0); }
}

@-o-keyframes fade-in-right {
     0% { opacity: 0; -o-transform: translateX(350px); }
   100% { opacity: 1; -o-transform: translateX(0); }
}

@keyframes fade-in-right {
     0% { opacity: 0; transform: translateX(350px); }
   100% { opacity: 1; transform: translateX(0); }
}

.fade-in-left {
   -webkit-animation-name: fade-in-left;
   -moz-animation-name:    fade-in-left;
   -o-animation-name:      fade-in-left;
   animation-name:         fade-in-left;
}

@-webkit-keyframes fade-in-left {
     0% { opacity: 0; -webkit-transform: translateX(-350px); }
   100% { opacity: 1; -webkit-transform: translateX(0); }
}

@-moz-keyframes fade-in-left {
     0% { opacity: 0; -moz-transform: translateX(-350px); }
   100% { opacity: 1; -moz-transform: translateX(0); }
}

@-o-keyframes fade-in-left {
     0% { opacity: 0; -o-transform: translateX(-350px); }
   100% { opacity: 1; -o-transform: translateX(0); }
}

@keyframes fade-in-left {
     0% { opacity: 0; transform: translateX(-350px); }
   100% { opacity: 1; transform: translateX(0); }
}

.fade-in-bottom {
   -webkit-animation-name: fade-in-bottom;
   -moz-animation-name:    fade-in-bottom;
   -o-animation-name:      fade-in-bottom;
   animation-name:         fade-in-bottom;
}

@-webkit-keyframes fade-in-bottom {
     0% { opacity: 0; -webkit-transform: translateY(60px); }
   100% { opacity: 1; -webkit-transform: translateY(0); }
}

@-moz-keyframes fade-in-bottom {
     0% { opacity: 0; -moz-transform: translateY(60px); }
   100% { opacity: 1; -moz-transform: translateY(0); }
}

@-o-keyframes fade-in-bottom {
     0% { opacity: 0; -o-transform: translateY(60px); }
   100% { opacity: 1; -o-transform: translateY(0); }
}

@keyframes fade-in-bottom {
     0% { opacity: 0; transform: translateY(60px); }
   100% { opacity: 1; transform: translateY(0); }
}

@-webkit-keyframes fade-in-top {
     0% { opacity: 0; -webkit-transform: translateY(60px); }
   100% { opacity: 1; -webkit-transform: translateY(0); }
}

@-moz-keyframes fade-in-top {
     0% { opacity: 0; -moz-transform: translateY(60px); }
   100% { opacity: 1; -moz-transform: translateY(0); }
}

@-o-keyframes fade-in-top {
     0% { opacity: 0; -o-transform: translateY(60px); }
   100% { opacity: 1; -o-transform: translateY(0); }
}

@keyframes fade-in-top {
     0% { opacity: 0; transform: translateY(60px); }
   100% { opacity: 1; transform: translateY(0); }
}

.duration-0-75 {
   -webkit-animation-duration: 0.75s;
   -moz-animation-duration:    0.75s;
   -o-animation-duration:      0.75s;
   animation-duration:         0.75s;
}

.delay-0-75 {
   -webkit-animation-delay: 0.75s;
   -moz-animation-delay:    0.75s;
   -o-animation-delay:      0.75s;
   animation-delay:         0.75s;
}

.delay-1-0 {
   -webkit-animation-delay: 1s;
   -moz-animation-delay:    1s;
   -o-animation-delay:      1s;
   animation-delay:         1s;
}

.delay-1-5 {
   -webkit-animation-delay: 1.5s;
   -moz-animation-delay:    1.5s;
   -o-animation-delay:      1.5s;
   animation-delay:         1.5s;
}

.delay-2-0 {
   -webkit-animation-delay: 2s;
   -moz-animation-delay:    2s;
   -o-animation-delay:      2s;
   animation-delay:         2s;
}

.delay-2-5 {
   -webkit-animation-delay: 2.5s;
   -moz-animation-delay:    2.5s;
   -o-animation-delay:      2.5s;
   animation-delay:         2.5s;
}

.delay-3-0 {
   -webkit-animation-delay: 3.3s;
   -moz-animation-delay:    3.0s;
   -o-animation-delay:      3.0s;
   animation-delay:         3.0s;
}

.delay-3-5 {
   -webkit-animation-delay: 3.5s;
   -moz-animation-delay:    3.5s;
   -o-animation-delay:      3.5s;
   animation-delay:         3.5s;
}

@media screen and (max-width: 768px) {
	.animation {
	   opacity: 1;
	   -webkit-animation: none;
	   -moz-animation:    none;
	   -o-animation:      none;
	   animation:         none;
	}	
}

@media screen and (max-width: 480px) {
	.animation {
	   opacity: 1;
	   -webkit-animation: none;
	   -moz-animation:    none;
	   -o-animation:      none;
	   animation:         none;
	}	
}