<div class="bar"></div>
@-webkit-keyframes MOVE-BG {
0% {
-webkit-transform: translateX(0)
}
to {
-webkit-transform: translateX(85px)
}
}
@keyframes MOVE-BG {
0% {
transform: translateX(0)
}
to {
transform: translateX(85px)
}
}
.bar {
height: 3px;
width: 66px;
background: #ed1c24;
margin: 10px 0 30px;
position: relative;
border-radius: 5px;
overflow: hidden;
}
.bar:before {
content: "";
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 5px;
background: #fff;
-webkit-animation-duration: 2s;
animation-duration: 2s;
-webkit-animation-timing-function: linear;
animation-timing-function: linear;
-webkit-animation-iteration-count: infinite;
animation-iteration-count: infinite;
-webkit-animation-name: MOVE-BG;
animation-name: MOVE-BG;
}