Simplified Animations.css for Elementor

custom-animations.css

/*** Override default Animations.css ***/

@keyframes fadeInDown {
    from { opacity: 0;transform: translate3d(0,-20px,0)}
    to { opacity: 1; transform: none }
}

@keyframes fadeInLeft {
    from { opacity: 0; transform: translate3d(-30%,0,0)}
    to { opacity: 1; transform: none }
}

@keyframes fadeInRight {
    from { opacity: 0; transform: translate3d(30%,0,0)}
    to { opacity: 1; transform: none}
}
@keyframes fadeInUp {
    from { opacity: 0; transform: translate3d(0,20px,0)}
    to { opacity: 1; transform: none}
}

@keyframes arrowBounce{
  0% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
  100% {
      -webkit-transform: translateY(-0.5em);
      transform: translateY(-0.5em);
    }
}

@keyframes grow {
  0% {
    -webkit-transform: scale(1);
    transform: scale(1);
  }
  100% {
      -webkit-transform: scale(1.15);
      transform: scale(1.15);
    }
}

@keyframes scaleIn {
  0% {
    -webkit-transform: scale(0);
    transform: scale(0);
  }
  100% {
      -webkit-transform: scale(1);
      transform: scale(1);
    }
}

.animated {
    -webkit-animation-duration: 1.3s;
    animation-duration: 1.3s;
	animation-timing-function: cubic-bezier(0.2, 0.2, 0.35, 1);
}

.animated.animated-slow {
    -webkit-animation-duration: 2.5s;
    animation-duration: 2.5s;	
}

.animated.animated-fast {
    -webkit-animation-duration: .75s;
    animation-duration: .75s
}
	
.elementor-animation-grow {
    transition-duration: .3s;
    transition-property: transform
}	
.elementor-animation-grow:active,.elementor-animation-grow:focus,.elementor-animation-grow:hover {
    transform: scale(1.05)
}	
.elementor-animation-shrink {
    transition-duration: .3s;
    transition-property: transform
}

.elementor-animation-shrink:active,.elementor-animation-shrink:focus,.elementor-animation-shrink:hover {
    transform: scale(0.9)
}

/*** MaskIn animation ***/

.maskIn .elementor-widget-container::after {
    position: absolute;
    content: '';
    background: #ffffff;
    display: flex;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    right: 0;
    transform-origin: bottom center;
    transition: transform 600ms cubic-bezier(1, 0.27, 0.36, 1);
	-webkit-transition: transform 600ms cubic-bezier(1, 0.27, 0.36, 1);
}

.maskIn.animated.animated-slow .elementor-widget-container::after {
    transition-duration: 1000ms;
	-webkit-transition-duration: 1000ms;
}


.maskIn.animated .elementor-widget-container::after {
    transform: scaleY(0);
}

.maskIn.animated .elementor-widget-container{
	animation-name:none;
	-webkit-animation-name:none;
}