.clock {
    height: 48px;
    width: 150px;
    color: black;
    font-size: 30px !important;
    font-family: sans-serif;
    display: flex;
    position: relative;
    /*background: green;*/
    overflow: hidden;
}

.clock::before, .clock::after {
    content: '';
    width: 7ch;
    height: 3vh;
    /* background: linear-gradient(to top, transparent, black); */
    position: absolute;
    z-index: 2;
}

.clock::after {
    bottom: 0;
    /* background: linear-gradient(to bottom, transparent, black); */
}

.clock > div {
    display: flex;
}

.tick {
    
}

.tick-hidden {
    opacity: 0;
}

.move {
    animation: move linear 1s infinite;
}

@keyframes move {
    from {
        transform: translateY(0vh);
    }
    to {
        transform: translateY(-20vh);
    }
}