.prakat-ho-animation { animation: prakatHo 2s ease-in; }
.fromLeftToRight-animation { animation: fromLeftToRight 2s ease-in-out;  }
.fromRightToLeft-animation { animation: fromRightToLeft 2s ease-in-out; }

/* Appears From No where */
@keyframes prakatHo {
    0% { opacity: 0; }
    100% { opacity: 1; }
}

/* Comes From left to right */
@keyframes fromLeftToRight {
    0% {
        transform: translateX(-100%);
        opacity: 0;
    }
    100% {
        transform: translateX(0%);
        opacity: 1;
    }
}

/* Comes From right to left */
@keyframes fromRightToLeft {
    0% { transform: translateX(100%); }

    100% { transform: translateX(0); }
}