/* (A) FIXED WRAPPER */
.hwrap {
    overflow: hidden; /* HIDE SCROLL BAR */
    background: #eee;
    background: #f9f6f6;
}

/* (B) MOVING TICKER WRAPPER */
.hmove {
    display: flex;
}

/* (C) ITEMS - INTO A LONG HORIZONTAL ROW */
.hitem {
    flex-shrink: 0;
    /*width: 100%;*/
    box-sizing: border-box;
    padding: 10px;
    padding-left:5rem;
    text-align: center;

}
.hitem>a{
    text-decoration:none;
    text-shadow:0px 1px 2px #fff;
    border-right:3px solid red;
    padding-right:1rem;
}

/* (D) ANIMATION - MOVE ITEMS FROM RIGHT TO LEFT */
/* 4 ITEMS -400%, CHANGE THIS IF YOU ADD/REMOVE ITEMS */
@keyframes tickerh {
    0% {
        transform: translate3d(100%, 0, 0);
    }

    100% {
        transform: translate3d(-400%, 0, 0);
    }
}

.hmove {
    animation: tickerh linear 60s infinite;
}

    .hmove:hover {
        animation-play-state: paused;
    }

@media only screen and (max-width: 768px) {
    .hmove {
        animation-duration: 20s;
    }
}