@charset "utf-8";
.animated {
    animation-duration: 1s;
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-timing-function: ease-in-out;
    -webkit-animation-timing-function: ease-in-out;
}

.animated2 {
    animation-duration: 4s;
    -webkit-animation-duration: 4s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-timing-function: ease-in-out;
    -webkit-animation-timing-function: ease-in-out;
}

.animated3 {
    animation-duration: 5s;
    -webkit-animation-duration: 5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-timing-function: ease-in-out;
    -webkit-animation-timing-function: ease-in-out;
}

.animated4 {
    animation-duration: 6s;
    -webkit-animation-duration: 6s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
    animation-timing-function: ease-in-out;
    -webkit-animation-timing-function: ease-in-out;
}

@keyframes fade_eff {
    0% {
        opacity: 0;
        transform: translateY(-20px);
        -webkit-transform: translateY(-20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        -webkit-transform: translateY(0);
    }
}

@-webkit-keyframes fade_eff {
    0% {
        opacity: 0;
        transform: translateY(-20px);
        -webkit-transform: translateY(-20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        -webkit-transform: translateY(0);
    }
}

.fade_eff {
    animation-name: fade_eff;
    -webkit-animation-name: fade_eff;
}

@keyframes scale_eff {
    0% {
        opacity: 0;
        transform: scale(0);
        -webkit-transform: scale(0);
    }
    100% {
        opacity: 1;
        transform: scale(1);
        -webkit-transform: scale(1);
    }
}

@-webkit-keyframes scale_eff {
    0% {
        opacity: 0;
        transform: scale(0);
        -webkit-transform: scale(0);
    }
    100% {
        opacity: 1;
        transform: scale(1);
        -webkit-transform: scale(1);
    }
}

.scale_eff {
    animation-name: scale_eff;
    -webkit-animation-name: scale_eff;
}

@keyframes drop_eff {
    0% {
        opacity: 0;
        transform: translateY(200px);
        -webkit-transform: translateY(200px);
    }
    80% {
        transform: translateY(-20px);
        -webkit-transform: translateY(-20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        -webkit-transform: translateY(0);
    }
}

@-webkit-keyframes drop_eff {
    0% {
        opacity: 0;
        transform: translateY(200px);
        -webkit-transform: translateY(200px);
    }
    80% {
        transform: translateY(-20px);
        -webkit-transform: translateY(-20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        -webkit-transform: translateY(0);
    }
}

.drop_eff {
    animation-name: drop_eff;
    -webkit-animation-name: drop_eff;
    -moz-animation-name: drop_eff;
    -o-animation-name: drop_eff;
}

@keyframes drop_eff2 {
    0% {
        opacity: 0;
        transform: translateY(100px);
        -webkit-transform: translateY(100px);
    }
    100% {
        transform: translateY(0px);
        -webkit-transform: translateY(0px);
    }
}

@-webkit-keyframes drop_eff2 {
    0% {
        opacity: 0;
        transform: translateY(100px);
        -webkit-transform: translateY(100px);
    }
    100% {
        transform: translateY(0px);
        -webkit-transform: translateY(0px);
    }
}

.drop_eff2 {
    animation-name: drop_eff2;
    -webkit-animation-name: drop_eff2;
}

@keyframes drop_eff3 {
    0% {
        opacity: 0;
        transform: translateY(-100px);
        -webkit-transform: translateY(-100px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        -webkit-transform: translateY(0);
    }
}

@-webkit-keyframes drop_eff3 {
    0% {
        opacity: 0;
        transform: translateY(-100px);
        -webkit-transform: translateY(-100px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
        -webkit-transform: translateY(0);
    }
}

.drop_eff3 {
    animation-name: drop_eff3;
    -webkit-animation-name: drop_eff3;
    -moz-animation-name: drop_eff3;
    -o-animation-name: drop_eff3;
}

@keyframes drop_eff4 {
    0% {
        opacity: 0;
        transform: translateX(-50px);
        -webkit-transform: translateX(-50px);
    }
    100% {
        transform: translateX(0px);
        -webkit-transform: translateX(0px);
    }
}

@-webkit-keyframes drop_eff4 {
    0% {
        opacity: 0;
        transform: translateX(-50px);
        -webkit-transform: translateX(-50px);
    }
    100% {
        transform: translateX(0px);
        -webkit-transform: translateX(0px);
    }
}

.drop_eff4 {
    animation-name: drop_eff4;
    -webkit-animation-name: drop_eff4;
}

@keyframes drop_eff5 {
    0% {
        opacity: 0;
        transform: translateX(100px);
        -webkit-transform: translateX(100px);
    }
    100% {
        transform: translateX(0px);
        -webkit-transform: translateX(0px);
    }
}

@-webkit-keyframes drop_eff5 {
    0% {
        opacity: 0;
        transform: translateX(100px);
        -webkit-transform: translateX(100px);
    }
    100% {
        transform: translateX(0px);
        -webkit-transform: translateX(0px);
    }
}

.drop_eff5 {
    animation-name: drop_eff5;
    -webkit-animation-name: drop_eff5;
}

@-webkit-keyframes shake_eff {
    0%,
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translateX(-3px);
        transform: translateX(-3px);
    }
    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translateX(3px);
        transform: translateX(3px);
    }
}

@keyframes shake_eff {
    0%,
    100% {
        -webkit-transform: translateX(0);
        transform: translateX(0);
    }
    10%,
    30%,
    50%,
    70%,
    90% {
        -webkit-transform: translateX(-3px);
        transform: translateX(-3px);
    }
    20%,
    40%,
    60%,
    80% {
        -webkit-transform: translateX(3px);
        transform: translateX(3px);
    }
}

.shake_eff {
    -webkit-animation-name: shake_eff;
    animation-name: shake_eff;
}