@-webkit-keyframes scroll { 0% {  -webkit-transform: translateX(0); transform: translateX(0);} 100% { -webkit-transform: translateX(calc(-250px * 7)); transform: translateX(calc(-250px * 7));}}

@keyframes scroll { 0% {  -webkit-transform: translateX(0); transform: translateX(0);} 100% { -webkit-transform: translateX(calc(-250px * 7));transform: translateX(calc(-250px * 7));}}

.slider { background: white; height: 100px; margin-top: 50px; overflow: hidden; position: relative; width: 100%; margin-bottom: 50px;}

.slider::before, .slider::after {  background: -webkit-gradient(linear, left top, right top, from(white), to(rgba(255, 255, 255, 0)));  background: linear-gradient(to right, white 0%, rgba(255, 255, 255, 0) 100%);  content: "";  height: 100px;  position: absolute;  width: 200px;  z-index: 2;}

.slider::after { right: 0; top: 0; -webkit-transform: rotateZ(180deg);transform: rotateZ(180deg);}

.slider::before { left: 0; top: 0;}

.slider .slide-track { display: -webkit-box; display: -ms-flexbox; display: flex; width: calc(250px * 14);}

.slide img {  -webkit-transition: all 0.5s ease;  -moz-transition: all 0.5s ease;  -o-transition: all 0.5s ease;  -ms-transition: all 0.5s ease;  transition: all 0.5s ease;}

.slider .slide {  height: 100px;  width: 250px;}

.slide .move {  -webkit-animation: bannermove 30s linear infinite;-moz-animation: bannermove 30s linear infinite;-ms-animation: bannermove 30s linear infinite;-o-animation: bannermove 30s linear infinite;animation: bannermove 30s linear infinite;}
 
@keyframes "bannermove" { 0% { margin-left: 0px;}100% { margin-left: -1024px}}
 
@-moz-keyframes bannermove {0% { margin-left: 0px;}100% {margin-left: -1024px}}
 
@-webkit-keyframes "bannermove" {0% { margin-left: 0px;}100% { margin-left: -1024px}}
 
@-ms-keyframes "bannermove" {0% {  margin-left: 0px; } 100% {  margin-left: -100px; }}
 
@-o-keyframes "bannermove" {0% { margin-left: 0px;} 100% { margin-left: -100px; }}