selector{
    --speed: 0.5s;
    --gap: 40px;
}
selector{
    transition: all 0.3s ease-in-out;
    height: var(--h);
    --height: calc(var(--h) + var(--gap));
    overflow: hidden !important;
}
selector .elementor-widget{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}
selector .elementor-widget p{
    transform: translateY(calc(-10 * var(--height)));
    transition: none !important;
}
selector .elementor-widget.prev p{
    animation: prev var(--speed) ease-in-out;
    transform: translateY(calc(-1 * var(--height)));
}
selector .elementor-widget.next p{
    animation: next var(--speed) ease-in-out;
    transform: translateY(var(--height));
}
selector .elementor-widget.currentUp,
selector .elementor-widget.currentDown{
    z-index: 1;
}
selector .elementor-widget.currentUp p{
    animation: currentUp var(--speed) ease-in-out;
    transform: translateY(0);
}
selector .elementor-widget.currentDown p{
    animation: currentDown var(--speed) ease-in-out;
    transform: translateY(0);
}

@keyframes prev {
  0%   {transform: translateY(0);}
  100%   {transform: translateY(calc(-1 * var(--height)));}
}

@keyframes next {
  0%   {transform: translateY(0);}
  100%   {transform: translateY(var(--height));}
}

@keyframes currentUp {
  0%   {transform: translateY(var(--height));}
  100%   {transform: translateY(0);}
}

@keyframes currentDown {
  0%   {transform: translateY(calc(-1 * var(--height)));}
  100%   {transform: translateY(0);}
}