/* Animate.css - Licensed under the ☺ license (http://licence.visualidiot.com/)
Copyright (c) 2012 Dan Eden 
Modified by DOKTOR Z */


body { -webkit-backface-visibility: hidden; /* webkit ONLY issue */ }


/* IMPORTANT - defines every animation !!! */
.animated { animation: 1s 1s; animation-fill-mode: both; }

.animated .long { animation: 1.5s 0.3s ease forwards; }
.animated .slow { animation: 1.5s 1.3s ease forwards; }
.animated .fast { animation: .5s 1s ease forwards; }



/* Fade IN */
.fadeIn { animation-name: fadeIn; }
@keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } }

.gfadeIn { animation: gfadeIn .5s ease; }
@keyframes gfadeIn { from { opacity: 0; } to { opacity: 1; } }

.fadeInDown { animation-name: fadeInDown; }
@keyframes fadeInDown { 0% { opacity: 0; transform: translateY(-20px); } 100% { opacity: 1; transform: translateY(0); } }

.fadeInDownBig { animation-name: fadeInDownBig; }
@keyframes fadeInDownBig { 0% { opacity: 0; transform: translateY(-2000px); } 100% { opacity: 1; transform: translateY(0); } }

.fadeInLeft { animation-name: fadeInLeft; }
@keyframes fadeInLeft { 0% { opacity: 0; transform: translateX(-20px); } 100% { opacity: 1; transform: translateX(0); } }

.fadeInLeftBig { animation-name: fadeInLeftBig; }
@keyframes fadeInLeftBig { 0% { opacity: 0; transform: translateX(-2000px); } 100% { opacity: 1; transform: translateX(0); } }

.fadeInRight { animation-name: fadeInRight; }
@keyframes fadeInRight { 0% { opacity: 0; transform: translateX(20px); } 100% { opacity: 1; transform: translateX(0); } }

.fadeInRightBig { animation-name: fadeInRightBig; }
@keyframes fadeInRightBig { 0% { opacity: 0; transform: translateX(2000px); } 100% { opacity: 1; transform: translateX(0); } }

.fadeInUp { animation-name: fadeInUp; }
@keyframes fadeInUp { 0% { opacity: 0; transform: translateY(20px); } 100% { opacity: 1; transform: translateY(0); } }

.fadeInUpBig { animation-name: fadeInUpBig; }
@keyframes fadeInUpBig { 0% { opacity: 0; transform: translateY(2000px); } 100% { opacity: 1; transform: translateY(0); } }


/* Fade OUT */
.fadeOut { animation-name: fadeOut; }
@keyframes fadeOut { 0% { opacity: 1; } 100% { opacity: 0; } }

.gfadeOut { animation: gfadeOut .5s ease; }
@keyframes gfadeOut { from { opacity: 1; } to { opacity: 0; } }

.fadeOutDown { animation-name: fadeOutDown; }
@keyframes fadeOutDown { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(20px); } }

.fadeOutDownBig { animation-name: fadeOutDownBig; }
@keyframes fadeOutDownBig { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(2000px); } }

.fadeOutLeft { animation-name: fadeOutLeft; }
@keyframes fadeOutLeft { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(-20px); } }

.fadeOutLeftBig { animation-name: fadeOutLeftBig; }
@keyframes fadeOutLeftBig { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(-2000px); } }

.fadeOutRight { animation-name: fadeOutRight; }
@keyframes fadeOutRight { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(20px); } }

.fadeOutRightBig { animation-name: fadeOutRightBig; }
@keyframes fadeOutRightBig { 0% { opacity: 1; transform: translateX(0); } 100% { opacity: 0; transform: translateX(2000px); } }

.fadeOutUp { animation-name: fadeOutUp; }
@keyframes fadeOutUp { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(-20px); } }

.fadeOutUpBig { animation-name: fadeOutUpBig; }
@keyframes fadeOutUpBig { 0% { opacity: 1; transform: translateY(0); } 100% { opacity: 0; transform: translateY(-2000px); } }


/* Slide IN */
.slideInDown { animation-name: slideInDown; }
@keyframes slideInDown { 0% { opacity: 0; transform: translateY(-2000px); } 100% { transform: translateY(0); } }

.slideInLeft { animation-name: slideInLeft; }
@keyframes slideInLeft { 0% { opacity: 0; transform: translateX(-2000px); } 100% { transform: translateX(0); } }

.slideInRight { animation-name: slideInRight; }
@keyframes slideInRight { 0% { opacity: 0; transform: translateX(2000px); } 100% { transform: translateX(0); } }

.gslideInLeft { animation: gslideInLeft .3s ease; }
@keyframes gslideInLeft { from { opacity: 0; transform: translate3d(-60%, 0, 0); } to { visibility: visible; opacity: 1; transform: translate3d(0, 0, 0); } }

.gslideInRight { animation: gslideInRight .3s ease; }
@keyframes gslideInRight { from { opacity: 0; visibility: visible; transform: translate3d(60%, 0, 0); } to { opacity: 1; transform: translate3d(0, 0, 0); } }


/* Slide OUT */
.slideOutLeft { animation-name: slideOutLeft; }
@keyframes slideOutLeft { 0% { transform: translateX(0); } 100% { opacity: 0; transform: translateX(-2000px); } }

.slideOutRight { animation-name: slideOutRight; }
@keyframes slideOutRight { 0% { transform: translateX(0); } 100% { opacity: 0; transform: translateX(2000px); } }

.slideOutUp { animation-name: slideOutUp; }
@keyframes slideOutUp { 0% { transform: translateY(0); } 100% { opacity: 0; transform: translateY(-2000px); } }

.gslideOutLeft { animation: gslideOutLeft .3s ease; }
@keyframes gslideOutLeft { from { opacity: 1; visibility: visible; transform: translate3d(0, 0, 0); } to { opacity: 0; visibility: hidden; transform: translate3d(-60%, 0, 0); } }

.gslideOutRight { animation: gslideOutRight .3s ease; }
@keyframes gslideOutRight { from { opacity: 1; visibility: visible; transform: translate3d(0, 0, 0); } to { opacity: 0; transform: translate3d(60%, 0, 0); } }


/* Zoom IN/OUT */
.gzoomIn { animation: gzoomIn .5s ease; }
@keyframes gzoomIn { from { opacity: 0; transform: scale3d(.3, .3, .3); } to { opacity: 1; } }

.gzoomOut { animation: gzoomOut .5s ease; }
@keyframes gzoomOut { from { opacity: 1; } 50% { opacity: 0; transform: scale3d(.3, .3, .3); } to { opacity: 0; } }