#quick_ocr #pdf {
    animation: pdf 10s ease-out infinite;
}

#quick_ocr #drag_and_drop {
    animation: drag_and_drop 10s ease-out infinite;
}

#quick_ocr #loading_spiner {
    animation: loading_spiner 10s linear infinite;
    transform-origin: center;
    transform-box: fill-box;
}

#quick_ocr #aadhaar {
    animation: aadhaar 10s ease-in infinite;
}

#quick_ocr #scanner_1 {
    animation: scanner_1 10s ease infinite;
}

#quick_ocr #scanner_2 {
    animation: scanner_2 10s ease infinite;
}

#quick_ocr #overlay {
    animation: overlay_blk 10s infinite;
}

#quick_ocr #popup {
    animation: popup 10s ease-in infinite;
}

#quick_ocr #Group_doc {
    animation: Group_doc 10s ease-in infinite;
}

#quick_ocr #success {
    animation: success 10s infinite;
}

@keyframes pdf {
    0%, 2% {
        opacity: 0;
    }
    4%, 10% {
        opacity: 1;
        transform: translateX(0px);
    }
    12%, 20% {
        opacity: 1;
        transform: translateX(400px);
    }
    20%, 100% {
        opacity: 0;
    }
}

@keyframes drag_and_drop {
    0%, 2% {
        opacity: 0;
    }
    4%, 10% {
        opacity: 1;
    }
    12%, 20% {
        opacity: 1;
    }
    20%, 100% {
        opacity: 0;
    }
}

@keyframes loading_spiner {
    0%, 18% {
        opacity: 0;
        transform: rotate(0deg);
    }
    20%{
        opacity: 1;
        transform: rotate(0deg);
    }
    24% {
        opacity: 1;
        transform: rotate(360deg);
    }
    26%, 100% {
        opacity: 0;
    }
}
@keyframes aadhaar {
    0%, 26% {
        opacity: 0;
    }
    28%, 100% {
        opacity: 1;
    }
}

@keyframes scanner_2 {
    0%, 28% {
        opacity: 0;
        transform: translateY(0px);
    }
    40%, 48% {
        opacity: 1;
        transform: translateY(-230px);
    }
    48%, 100% {
        opacity: 0;
    }
    
}

@keyframes scanner_1 {
    0%, 42% {
        opacity: 0;
        transform: translateY(0px);
    }
    56%, 64% {
        opacity: 1;
        transform: translateY(230px);
    }
    64%, 100% {
        opacity: 0;
    }
}
@keyframes overlay_blk {
    0%, 66% {
        opacity: 0;
    }
    68%, 84% {
        opacity: 0.18;
    }
    86%, 100% {
        opacity: 0;
    }
}

@keyframes popup {
    0%, 66% {
        opacity: 0;
    }
    68%, 84% {
        opacity: 1;
    }
    86%, 100% {
        opacity: 0;
    }
}

@keyframes Group_doc {
    0%, 78% {
        opacity: 1;
    }
    80%, 86% {
        opacity: 1;
    }
    86%, 100% {
        opacity: 0;
    }
}

@keyframes success {
    0%, 86% {
        opacity: 0;
    }
    87%, 100% {
        opacity: 1;
    }
}