/* Trigger  */
.animated {
    animation-duration: 1s;
    animation-fill-mode: both;
    }
  
  /* Optional Delays, change values here  */
  .one { animation-delay: 0.2s; }
  .two { animation-delay: .6s; }
  .three { animation-delay: 1s; }
  .four { animation-delay: 1.4s; }
  
  /* Animations start here  */
  
  /* FADE IN  */
  
  @keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; } }
  .fadeIn { animation-name: fadeIn; }
  
  
  /* FADE IN DOWN */
  
  @keyframes fadeInDown {
    from { opacity: 0; transform: translate3d(0, -100%, 0); }
    to { opacity: 1; transform: none; } }
  .fadeInDown { animation-name: fadeInDown; }
  
  /* FADE IN UP */
  
  @keyframes fadeInUp {
    from { opacity: 0; transform: translate3d(0, 20px, 0); }
    to { opacity: 1; transform: none; } }
  .fadeInUp { animation-name: fadeInUp; }
  
  /* FADE IN UP BIG */
  
  @keyframes fadeInUpBig {
    from { opacity: 0; transform: translate3d(0, 100px, 0); }
    to { opacity: 1; transform: none; } }
  .fadeInUpBig { animation-name: fadeInUpBig; }
  
  /* FADE IN LEFT */
  
  @keyframes fadeInLeft {
    from { opacity: 0; transform: translate3d(-30px, 0, 0)rotateZ(30deg); }
    to { opacity: 1; transform: none; } }
  .fadeInLeft { animation-name: fadeInLeft; }
  
  /* FADE IN LEFT BIG */
  
  @keyframes fadeInLeftBig {
    from { opacity: 0; transform: translate3d(-100px, 0, 0); }
    to { opacity: 1; transform: none; } }
  .fadeInLeftBig { animation-name: fadeInLeftBig; }
  
  /* FADE IN RIGHT */
  
  @keyframes fadeInRight {
    from { opacity: 0; transform: translate3d(100%, 0, 0); }
    to { opacity: 1; transform: none; } }
  .fadeInRight { animation-name: fadeInRight; }
  
  /* @end standaard animaties  */
  
  
  /* .callout {
    max-width: 500px;
    margin:0 auto;
    padding-bottom:100px
  } */

  .test.in-year-view{
    animation: fadeInLeftBig 2s;
    }
  
  .test.in-view {
    animation: fadeInUp 1s;
    }
  
    .in-transition{
      opacity: 0;
    }
  .test2.in-view {  
     animation: fadeInLeftBig;
      animation-duration: 1s;
     animation-delay: 0s;
    animation-fill-mode: both;
     backface-visibility: hidden;
  }