@charset "UTF-8";
/*Hide Objekt*/
.animatable {
  visibility: hidden;
    
  -webkit-animation-play-state: paused;   
  -moz-animation-play-state: paused;     
  -ms-animation-play-state: paused;
  -o-animation-play-state: paused;   
  animation-play-state: paused; 
}
/*Shows Objekt*/
.animated {
  visibility: visible;  
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  -ms-animation-fill-mode: both;
  -o-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-duration: 1.5s;
  -moz-animation-duration: 1.5s;
  -ms-animation-duration: 1.5s;
  -o-animation-duration: 1.5s;
  animation-duration: 1.5s;
  -webkit-animation-play-state: running;
  -moz-animation-play-state: running;
  -ms-animation-play-state: running;
  -o-animation-play-state: running;
  animation-play-state: running;
}
/*FadeIn - Animation*/
@-webkit-keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
@keyframes fadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}
.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}
/*FadeInLeftDiagonal - Animation*/
@-webkit-keyframes fadeInLeftDiagonal {
  from {
    opacity: 0;
      transform: translate3d(-5px,5px,0); 
  }
  to {
    opacity: 1;
      transform: translate3d(0,0,0); 
  }
}
@keyframes fadeInLeftDiagonal {
  from {
    opacity: 0;
    transform: translate3d(-5px,5px,0);
  }
  to {
    opacity: 1;
    transform: translate3d(0,0,0);
  }
}
.fadeInLeftDiagonal {
  -webkit-animation-name: fadeInLeftDiagonal;
  animation-name: fadeInLeftDiagonal;
}
@-webkit-keyframes fadeInRightDiagonal {
  from {
    opacity: 0;
      transform: translate3d(5px,5px,0);
  }
  to {
    opacity: 1;
      transform: translate3d(0,0,0);
  }
}
/*FadeInRightDiagonal - Animation*/
@keyframes fadeInRightDiagonal {
  from {
    opacity: 0;
    transform: translate3d(5px,5px,0);
  }
  to {
    opacity: 1;
    transform: translate3d(0,0,0);
  }
}
.fadeInRightDiagonal {
  -webkit-animation-name: fadeInRighttDiagonal;
  animation-name: fadeInRightDiagonal;
}
/*FadeInLeftDiagonal - Animation*/
@-webkit-keyframes fadeInBottom{
  from {
    opacity: 0;
      transform: translate3d(0,5px,0); 
  }
  to {
    opacity: 1;
      transform: translate3d(0,0,0); 
  }
}
@keyframes fadeInBottom {
  from {
    opacity: 0;
    transform: translate3d(0,5px,0);
  }
  to {
    opacity: 1;
    transform: translate3d(0,0,0);
  }
}
.fadeInBottom {
  -webkit-animation-name: fadeInBottom;
  animation-name: fadeInBottom;
}