.animationElement {
  transition: all 1s;
}
.animationElement.animationLeft {
  transform: translateX(-100%);
}
.animationElement.animationBottom {
  transform: translateY(100%);
}
.animationElement.animationRight {
  transform: translateX(100%);
}
.animationElement.animationRightOpacity {
  transform: translateX(100%);
  opacity: 0;
  filter: blur(10px);
}
.animationElement.animationRightOpacityBig {
  transform: translateX(150%);
  opacity: 0;
  filter: blur(10px);
}
.animationElement.animationLeftOpacity {
  transform: translateX(-100%);
  opacity: 0;
  filter: blur(10px);
}
.animationElement.animationLeftOpacityBig {
  transform: translateX(-150%);
  opacity: 0;
  filter: blur(10px);
}
.animationElement.animationLeftOpacityVeryBig {
  transform: translateX(-200%);
  opacity: 0;
  filter: blur(10px);
}

/* Subscribe */
.animationElement.animationRightCustomOpacity-1 {
  transform: translateX(100%);
  opacity: 0;
  filter: blur(10px);
  transition: all 0.6s;
}
.animationElement.animationRightCustomOpacity-2 {
  transform: translateX(120%);
  opacity: 0;
  filter: blur(10px);
  transition: all 1s;
}
.animationElement.animationRightCustomOpacity-3 {
  transform: translateX(140%);
  opacity: 0;
  filter: blur(10px);
  transition: all 1.4s;
}
.animationElement.animationLeftCustomOpacity-1 {
  transform: translateX(-100%);
  opacity: 0;
  filter: blur(10px);
  transition: all 0.6s;
}
.animationElement.animationLeftCustomOpacity-2 {
  transform: translateX(-120%);
  opacity: 0;
  filter: blur(10px);
  transition: all 1s;
}
.animationElement.animationLeftCustomOpacity-3 {
  transform: translateX(-140%);
  opacity: 0;
  filter: blur(10px);
  transition: all 1.4s;
}
/*  */

/* transition time */
.transition0_3sStop1 {
  transition: all 0.3s ease-in-out 1s;
}
.transition0_6sStop1 {
  transition: all 0.6s ease-in-out 1s;
}
.transition0_9sStop1 {
  transition: all 0.9s ease-in-out 1s;
}
.transition1_1sStop1 {
  transition: all 1.1s ease-in-out 1s;
}
.transition1_1s {
  transition: all 1.1s;
}
.transition1_2s {
  transition: all 1.2s;
}
.transition1_3s {
  transition: all 1.3s;
}
.transition1_6s {
  transition: all 1.6s;
}
.transition2_6s {
  transition: all 2.6s;
}

/* .animationOnlyMobile {
    transform:  translateX(0) translateY(0);
    opacity: 1;
    filter: blur(0px);  
} */
@media screen and (max-width: 800px) {
  .animationCloseMobile {
    transform: translateX(0) translateY(0) !important;
    opacity: 1;
    filter: blur(0px);
  }
  .animationElement.animationLeftOpacityBigMobile {
    transform: translateX(-150%);
    opacity: 0;
    filter: blur(10px);
  }
  .animationElement.animationRightOpacityBigMobile {
    transform: translateX(100%);
    opacity: 0;
    filter: blur(10px);
  }

  /* Subscribe */
  .animationElement.animationRightCustomOpacity-1 {
    transform: translateX(100%);
    opacity: 0;
    filter: blur(10px);
    transition: all 1s;
  }
  .animationElement.animationRightCustomOpacity-2 {
    transform: translateX(-100%);
    opacity: 0;
    filter: blur(10px);
    transition: all 1s;
  }
  .animationElement.animationRightCustomOpacity-3 {
    transform: translateX(100%);
    opacity: 0;
    filter: blur(10px);
    transition: all 1s;
  }
  .animationElement.animationLeftCustomOpacity-3 {
    transform: translateX(-100%);
    opacity: 0;
    filter: blur(10px);
    transition: all 1s;
  }
  .animationElement.animationLeftCustomOpacity-2 {
    transform: translateX(100%);
    opacity: 0;
    filter: blur(10px);
    transition: all 1s;
  }
  .animationElement.animationLeftCustomOpacity-1 {
    transform: translateX(-100%);
    opacity: 0;
    filter: blur(10px);
    transition: all 1s;
  }
  /*  */
}

.animationElement.anim {
  transform: translateX(0) translateY(0) !important;
  opacity: 1 !important;
  filter: blur(0px) !important;
}
