.slide-from-left {
    animation: slide-from-left 1s 1;
}

.slide-from-right {
    animation: slide-from-right 1s 1;
}

.slide-down {
    animation: slide-down 1s 1;
}

.slide-down-without-opacity {
    animation: slide-down-without-opacity 1s 1;
}

.slide-up {
    animation: slide-up 1s 1;
}

.slide-up-fast {
    animation: slide-up 0.5s 1;
}

.slide-up-little-without-opacity {
    animation: slide-up-little-without-opacity 1s 1;
}

.slide-down-little-without-opacity {
    animation: slide-up-little-without-opacity 1s 1;
}

.pop-up {
    animation: pop-up .5s ease-in-out forwards;
}

.pop-up-small {
    animation: pop-up-small .5s ease-in-out forwards;
}

.wipe-enter {
    animation: pop-up .5s ease-in-out forwards;
}

.rotating {
    -webkit-animation: rotating 10s linear infinite;
    -moz-animation: rotating 10s linear infinite;
    -ms-animation: rotating 10s linear infinite;
    -o-animation: rotating 10s linear infinite;
    animation: rotating 10s linear infinite;
}

.blink-me {
    animation: blinker 2s linear infinite;
}

.blink-me-0 {
    animation: blinkerzero 2s linear infinite;
}

@property --from {
  syntax: '<integer>';
  initial-value: 0;
  inherits: false;
}

.counter {
  transition: --from 1s;
  counter-reset: int var(--from);
  animation: counter var(--time, 1000) forwards ease-in-out;
}

.counter::after {
  content: counter(int);
}

.move-up-down {
    -webkit-animation: mover 2s infinite  alternate;
    animation: mover 2s infinite  alternate;
}

@keyframes slide-from-right {
    0% {
        transform: translateX(50px);
        opacity: 0;
    }

    100% {
        transform: translateX(0px);
        opacity: 1;
    }
}

@keyframes slide-from-left {
    0% {
        transform: translateX(-30px);
        opacity: 0;
    }

    100% {
        transform: translateX(0px);
        opacity: 1;
    }
}

@keyframes slide-down {
    0% {
        transform: translateY(-50px);
        opacity: 0;
    }

    100% {
        transform: translateY(0px);
        opacity: 1;
    }
}

@keyframes .slide-down-without-opacity {
    0% {
        transform: translateY(-50px);
    }

    100% {
        transform: translateY(0px);
    }
}

@keyframes slide-up {
    0% {
        transform: translateY(50px);
        opacity: 0;
    }

    100% {
        transform: translateY(0px);
        opacity: 1;
    }
}

@keyframes slide-up-little-without-opacity {
    0% {
        transform: translateY(0px);
    }

    100% {
        transform: translateY(-10px);
    }
}

@keyframes slide-down-little-without-opacity {
    0% {
        transform: translateY(-10px);
    }

    100% {
        transform: translateY(0px);
    }
}

@keyframes pop-up {
    0% {
        transform: translateX(0px) scale(.5);
        opacity: 0;
    }

    100% {
        transform: translateX(0px) scale(1);
        opacity: 1;
    }
}

@keyframes pop-up-small {
    0% {
        transform: translateX(0px) scale(.5);
        opacity: 0.8;
    }

    100% {
        transform: translateX(0px) scale(1);
        opacity: 1;
    }
}

@keyframes wipe-enter {
    0% {
        transform: scale(0, .025);
    }

    50% {
        transform: scale(1, .025);
    }
}

@keyframes blinker {
    50% {
        opacity: 0.1;
    }
}

@keyframes blinkerzero {
    50% {
        opacity: 0;
    }
}

@keyframes rotator {
    50% {
        opacity: 0;
    }
}

@-webkit-keyframes rotating {
    from {
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes rotating {
    from {
        -ms-transform: rotate(0deg);
        -moz-transform: rotate(0deg);
        -webkit-transform: rotate(0deg);
        -o-transform: rotate(0deg);
        transform: rotate(0deg);
    }

    to {
        -ms-transform: rotate(360deg);
        -moz-transform: rotate(360deg);
        -webkit-transform: rotate(360deg);
        -o-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}

@keyframes counter {
    to {
        --from: var(--to, 100);
    }
}

@-webkit-keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-10px); }
}
@keyframes mover {
    0% { transform: translateY(0); }
    100% { transform: translateY(-10px); }
}