#dText.Yadidi
{
    text-align: center;
    direction: ltr;
    height: 100vmin;
}


#dText.Yadidi_sand
{
    direction: rtl;
    animation: Yadidi_grow  linear 20s  ;
    animation-delay:  0ms;
    opacity: 0;
}

@keyframes Yadidi_grow {
    0%{
        padding-top:100vh;
        opacity: 1;
    }
    95% {
        padding-top:0;
        opacity: 1;
    }
    100% {
        padding-top:0;
        opacity: 0;
    }
}

@keyframes Yadidi_tree {
    0%{
        padding-top:100vh;
        opacity: 1;
    }
    94% {
        padding-top:0;
        opacity: 1;
    }
    100% {
        padding-top:0;
        opacity: 0;
    }
}

#dText.Yadidi_race
{
   padding-top: 120vh;
   direction: rtl;
    animation: Yadidi_wisher calc(var(--period) * 2) linear 10,
    Yadidi_tree  calc(var(--period) * 4) linear 10;
    opacity: 1;
    animation-delay:  1s,0s;
}

@keyframes Yadidi_wisher {
    0%,100% {
    transform: rotate(-45deg);
  }
  50% {
    transform: rotate(45deg);
  }
}


#dText.Yadidi span
{
    position: relative;
    animation: Yadidi_flowers  var(--period) ease-in-out forwards var(--duration);
    animation-delay: 2s;
}


@keyframes Yadidi_flowers{
    25%{
        margin-left: calc( -1 * var(--marg));
    }
    75%{
        margin-left: var(--marg);
    }
}
  
#dText.Yadidi span:before {
    content: '\a';
    white-space: pre;
}

#dLines.Yadidi path {
    stroke-opacity: 0.5;
    stroke: var(--bcolor);
    stroke-linecap: round;
    stroke-width: 1px;
    fill: none;
    stroke-dasharray: 10 45;
}