.flyletter-left {
    display: inline-block;
    position: relative;
    opacity: 0;
    transform: translate(-100px, 0) rotate(-45deg); /* Modified transform values */
    transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);
    will-change: transform, opacity;
    margin: 0 1px;  /* Adjust as needed */
    font-family: var(--main-font);
    font-size: var(--font-size-normal);
}

.flyletter-left.active {
    opacity: 1;
    transform: translate(0, 0) rotate(0deg);
    transition: transform 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275), opacity 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275); /* Ensure transitions are defined */
}

/* Container styles */
[id^="flyletter-"] {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
    min-height: 50px;
    align-items: center;
}
