.autoBlur{
    animation: autoBlurAnimation linear both;
    animation-timeline: view();
}

@keyframes autoBlurAnimation {
    
    0% {
        filter: blur(40px);
    }
    
    40%, 60% {
        filter: blur(0);
        transform: translateY(0px);
        opacity: 1;
    }
    
    100% {
        filter: blur(40px);
        transform: translateY(-100px);
        opacity: 0;
    }
}

.autoTakeFull{
    animation: autoTakeFullAnimation both;
    animation-timeline: view(70% 65%);
}

@keyframes autoTakeFullAnimation {
    
    to{
        width: 100%;
        height: 100vh;
        border-radius: 0;
        margin-bottom: 100px;
    }
}

@media (max-width: 768px) {
  .autoBlur {
    animation: none;
    filter: none;
    opacity: 1;
  }
}
