@charset "UTF-8";

@keyframes slideUp{
    from {
        opacity: 0;
        transform: translate3d(0, 100%, 0);
    }
    to {
        opacity: 1;
        transform: translateZ(0);
    }
}
@keyframes slideDown{
    from {
        opacity: 1;
        transform: translateZ(0);
    }
    to {
        opacity: 0;
        transform: translate3d(0, 100%, 0);
    }
}
@keyframes hashBar{
    from {
        opacity: 0;
        max-height: 0;
    }
    to {
        opacity: 1;
        max-height: 56px;
    }
}
@keyframes light {
    to{
        background-position:
                -100% 0;
    }
}
/* skeletion animation */
.skeleton-target {
    visibility: hidden;
}
.skeleton-parent {
    overflow: hidden;
    position: relative;
}
.skeleton {
    width: 100%; height: 100%;
    max-height: max-content;
    display: inline-block;
    position: absolute;
    left: 0; top: 0;
    overflow: hidden;
    background-color: #e5e5e5;
    background-image:
            linear-gradient(120deg,
            #e5e5e5 30%, #f0f0f0 38%, #f0f0f0 40%, #e5e5e5 48%
            );
    background-repeat: repeat-y;
    background-position: 100% 0 ;
    background-size: 200% 100%;
    animation: light 1s infinite;
}