@keyframes fadeInUp {
    from {
        transform: translate3d(0, 0, 0);
    }
    to {
        transform: translate3d(0, 0, 0);
        opacity: 1;
    }
}

.fade-in-up-leave-to {
    opacity: 0;
    transition: opacity 0.3s;
}

.fade-in-up-enter {
    opacity: 0;
    transform: translate3d(0, 10px, 0);
}

.fade-in-up-enter-to {
    opacity: 0;
    animation-duration: 0.7s;
    animation-fill-mode: both;
    animation-name: fadeInUp;
}

.fade-enter-active, .fade-leave-active {
    transition: opacity 0.25s ease-out;
}

.fade-enter, .fade-leave-to {
    opacity: 0;
}

.slide-enter-active {
    -moz-transition-duration: 0.3s;
    -webkit-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -moz-transition-timing-function: ease-in;
    -webkit-transition-timing-function: ease-in;
    -o-transition-timing-function: ease-in;
    transition-timing-function: ease-in;
}

.slide-leave-active {
    -moz-transition-duration: 0.3s;
    -webkit-transition-duration: 0.3s;
    -o-transition-duration: 0.3s;
    transition-duration: 0.3s;
    -moz-transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
    -webkit-transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
    -o-transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
    transition-timing-function: cubic-bezier(0, 1, 0.5, 1);
}

.slide-enter-to, .slide-leave {
    max-height: 100px;
    overflow: hidden;
}

.slide-enter, .slide-leave-to {
    overflow: hidden;
    max-height: 0;
}

.slide-down-enter,
.slide-down-leave-to {
    transform: scaleY(0.7);
    opacity: 0;
}

.slide-down-enter-to,
.slide-down-leave {
    opacity: 1;
    transform: scaleY(1);
}

.slide-down-enter-active,
.slide-down-leave-active {
    transition: all 0.3s ease-out;
    transform-origin: top center;
}