﻿@keyframes expands {
    from {
        opacity: 0;
        transform: scale(0.4);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}

    .d-animation-expand-on-view {
        animation: expands 0.5s linear;
        animation-timeline: view();
        animation-range: entry 0% cover 40%;
    }


@keyframes turns {
    0% {
        opacity: 0;
        transform: scale(0.2);
    }

    50% {
        transform: scale(1.1);
    }

    100% {
        opacity: 1;
        transform: scale(1);
    }
}

.d-animation-turn-on-view {
    animation: turns 0.5s linear;
    animation-timeline: view();
    animation-range: entry 0% cover 30%;
}
 