.animated-counter {
    display: inline-flex;
    font-size: 1em;
    font-weight: bold;
    height: 1em;
    line-height: 1em;
}
.animated-counter__inner {
    display: flex;
    overflow: hidden;
}
.animated-counter__digit-position {
    position: relative;
    width: .6em;
}
.animated-counter__digit-column {
    display: flex;
    flex-direction: column;
    transition: transform .7s cubic-bezier(0.18, 0.85, 0.58, 1.15);
}
.animated-counter__digit {
    width: 100%;
    text-align: center;
}
.animated-counter__digit--blank {
    opacity: 0;
}

.animated-counter__digit-position[data-value="0"] .animated-counter__digit-column { transform: translateY(-1em); }
.animated-counter__digit-position[data-value="1"] .animated-counter__digit-column { transform: translateY(-2em); }
.animated-counter__digit-position[data-value="2"] .animated-counter__digit-column { transform: translateY(-3em); }
.animated-counter__digit-position[data-value="3"] .animated-counter__digit-column { transform: translateY(-4em); }
.animated-counter__digit-position[data-value="4"] .animated-counter__digit-column { transform: translateY(-5em); }
.animated-counter__digit-position[data-value="5"] .animated-counter__digit-column { transform: translateY(-6em); }
.animated-counter__digit-position[data-value="6"] .animated-counter__digit-column { transform: translateY(-7em); }
.animated-counter__digit-position[data-value="7"] .animated-counter__digit-column { transform: translateY(-8em); }
.animated-counter__digit-position[data-value="8"] .animated-counter__digit-column { transform: translateY(-9em); }
.animated-counter__digit-position[data-value="9"] .animated-counter__digit-column { transform: translateY(-10em); }