.cloud__big {

    animation: float-clouds-right-to-left linear infinite;

    animation-duration: 100s;

}

/* Animácia pohybu z prava doľava pre veľké oblačiky */

@keyframes float-clouds-right-to-left {

    0% {

        transform: translateX(calc(20vw + 150px));

    }

    100% {

        transform: translateX(-100vw);

    }

}





.cloud__medium {

    animation: float-clouds-left-to-right linear infinite;

    animation-duration: 80s;

}

/* Animácia pohybu z ľava doprava pre malé a stredné oblačiky */

@keyframes float-clouds-left-to-right {

    0% {

        transform: translateX(-33vw);

    }

    100% {

        transform: translateX(calc(100vw + 150px));

    }

}





.cloud__small {

    animation: float-clouds-left-to-right-small linear infinite;

    animation-duration: 40s;

}

@keyframes float-clouds-left-to-right-small {

    0% {

        transform: translateX(-44vw);

    }

    100% {

        transform: translateX(calc(100vw + 150px));

    }

}















.cutko-banner__clouds--video .cloud__medium {

    animation: float-clouds-left-to-right-2 linear infinite;

    animation-duration: 55s;

}



@keyframes float-clouds-left-to-right-2 {

    0% {

        transform: translateX(-33vw);

    }

    100% {

        transform: translateX(calc(100vw + 150px));

    }

}





/* Parallax */

.cloud__small,

.cloud__medium,

.cloud__big {

    position: absolute;

    will-change: transform;

    transition: transform 0.1s linear;

    pointer-events: none;

}