
.bricks-is-frontend .animation-trigger{
  opacity:0;
}
 

.animate{
  animation-name: fadeAnimation;
  animation-delay: calc(var(--delay, 0) * 200ms);
  animation-duration: var(--duration, 600ms);
  animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
}
 

.animation--left{
  --translate: -20px,0,0;
}
.animation--right{
  --translate: 20px,0,0;
}
.animation--top{
  --translate: 0,-20px,0;
}
.animation--bottom{
  --translate: 0,20px,0;
}
 

@keyframes fadeAnimation{
  from{
    transform: translate3d(var(--translate));
  }
  to{
    opacity: 1;
    transform: translate3d(0,0,0);
  }
}