@keyframes opacity_in {
    0% {opacity: 0;}
    100% {opacity: 1;}
}

@keyframes opacity_out {
    0% {opacity: 1;}
    100% {opacity: 0;}
}




@keyframes scale_in {
    0% {
        opacity: 0;
        transform: scale(0);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes scale_in_small {
    0% {
        opacity: 0;
        transform: scale(0.5);
    }
    100% {
        opacity: 1;
        transform: scale(1);
    }
}

@keyframes scale_out {
    0% {
        opacity: 1;
        transform: scale(1);
    }
    100% {
        opacity: 0;
        transform: scale(0);
    }
}



@keyframes show_in_left {
    0% {
        opacity: 0;
        transform: translateX(-25%);
    }
    100% {
        opacity: 1;
        transform: translateX(0);        
    }
}
@keyframes show_in_right {
    0% {
        opacity: 0;
        transform: translateX(25%);
    }
    100% {
        opacity: 1;
        transform: translateX(0);        
    }
}

@keyframes show_in_right_big {
    0% {
        opacity: 0;
        transform: translateX(100%);
    }
    100% {
        opacity: 1;
        transform: translateX(0);        
    }
}


@keyframes show_in_top {
    0% {
        opacity: 0;
        transform: translateY(-50%);
    }
    100% {
        opacity: 1;
        transform: translateY(0);        
    }
}
@keyframes show_in_bottom {
    0% {
        opacity: 0;
        transform: translateY(50%);
    }
    100% {
        opacity: 1;
        transform: translateY(0);        
    }
}

@keyframes show_in_bottom_big {
    0% {
        opacity: 0;
        transform: translateY(500%);
    }
    100% {
        opacity: 1;
        transform: translateY(0);        
    }
}






@keyframes show_out_top {
    0% {
        opacity: 1;
        transform: translateY(0);
    }
    100% {
        opacity: 0;
        transform: translateY(100%);        
    }
}

@keyframes show_out_bottom {
    0% {
        opacity: 1;
        transform: translateY(0);
    }
    100% {
        opacity: 0;
        transform: translateY(100%);        
    }
}







@keyframes slide_in_left {
    0% {
        opacity: 1;
        transform: translateX(-150%);}
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}
@keyframes slide_in_right {
    0% {
        opacity: 1;
        transform: translateX(150%);}
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}
@keyframes slide_in_top {
    0% {
        opacity: 1;
        transform: translateY(-100%);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}
@keyframes slide_in_bottom {
    0% {
        opacity: 1;
        transform: translateY(100%);}
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

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