@charset "UTF-8";

.hide {
    filter: blur(5px);
    opacity: 0;;
    scale: 0;
    transition: 1s ease;
}

.show {
    filter: blur(0px);
    opacity: 1;
    scale: 1;
}

.hide-left {
    filter: blur(2px);
    opacity: 0;
    transform: translateX(-10%);
    transition: 0.8s ease-out;
}

.show-left {
    filter: blur(0px);
    opacity: 1;
    transform: translateX(0);
}

.hide-right {
    filter: blur(2px);
    opacity: 0;
    transform: translateX(10%);
    transition: 0.8s ease-out;
}

.show-right {
    filter: blur(0px);
    opacity: 1;
    transform: translateX(0);
}

.hide-bottom {
    filter: blur(2px);
    opacity: 0;
    transform: translateY(100%);
    transition: 0.8s ease-out;
}

.show-bottom {
    filter: blur(0px);
    opacity: 1;
    transform: translateY(0);
}