:root {
--intrace-transition: cubic-bezier(0.165, 0.84, 0.44, 1)
}
body .intrace-animate-init {
opacity: 1;
visibility: visible;
transform: translateY(0) translateX(0) scale(1) rotate(0)
}
.intrace-animate {
opacity: 0;
visibility: hidden;
transition-property: opacity, transform;
}
.intrace-move-up {
transform: translateY(30px)
}
.intrace-move-down {
transform: translateY(-30px)
}
.intrace-move-right {
transform: translateX(-40px)
}
.intrace-move-left {
transform: translateX(40px)
}
.intrace-flip {
transform: perspective(500px) translateY(60px) scaleY(.75) rotateX(-40deg)
}
.intrace-scale {
transform: scale(0.5)
}
.intrace-flip,
.intrace-move-down,
.intrace-move-up,
.intrace-move-right,
.intrace-move-left,
.intrace-scale {
transition-duration: .7s;
transition-timing-function: var(--intrace-transition)
}
.intrace-delay-1 {
transition-delay: .1s
}
.intrace-delay-3 {
transition-delay: .3s
}
.intrace-delay-5 {
transition-delay: .5s
}
.intrace-delay-7 {
transition-delay: .7s
}
.intrace-delay-10 {
transition-delay: 1s
}
.intrace-delay-20 {
transition-delay: 2s
}