Scroll Reveal Animation 적용이 안되요

아래 처럼 css 적용하고 html도 강의데로 넣어줬는데...

왜 애니메이션이 적용되지 않을까요

.ltr {
    animation: ltr o.5s linear both;
}
.rtl {
    animation: rtl o.5s linear both;
}
.utd {
    animation: utd o.5s linear both;
}

@keyframes ltr {
    0% {
        transform: translateX(-100px);
        opacity: 0;
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}
@keyframes rtl {
    0% {
        transform: translateX(100px);
        opacity: 0;
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes utd {
    0% {
        transform: translateY(-100px);
        opacity: 0;
    }
    100% {
        transform: translateY(0);
        opacity: 1;
    }
}