.scrolling-banner {
  position: relative;
  padding: 0px 10px;
  margin: 0px auto;
  overflow: hidden;
}
.scrolling-banner .banner {
  display: flex;
  align-items: center;
  list-style-type: none;
}
.scrolling-banner .banner,
.scrolling-banner .banner-item {
  margin: 0 auto;
}
.scrolling-banner .banner-item {
  display: flex;
  flex-shrink: 0;
  padding-left: var(--scrolling-banner-gutter-mobile);
  padding-right: var(--scrolling-banner-gutter-mobile);
}
@media screen and (min-width: 481px) {
  .scrolling-banner .banner-item {
    padding-left:10px;
    padding-right: 0px;
  }
}
.scrolling-banner .show-fade:after,
.scrolling-banner .show-fade:before {
  content: "";
  position: absolute;
  z-index: 1;
  top: 0;
  width: 30%;
  height: 100%;
  opacity: 1;
  pointer-events: none;
}
.scrolling-banner .show-fade:before {
  left: 0;
  background: linear-gradient(
    90deg,
    var(--color-scheme-background-color) 15%,
    rgba(255, 255, 255, 0) 85%
  );
}
.scrolling-banner .show-fade:after {
  right: 0;
  background: linear-gradient(
    270deg,
    var(--color-scheme-background-color) 15%,
    rgba(255, 255, 255, 0) 85%
  );
}
.scrolling-banner .divider {
  display: block;
  height: 100%;
  border-right: 1px solid var(--color-scheme-border-color);
  margin: 0 var(--scrolling-banner-gutter-mobile);
}
@media screen and (min-width: 481px) {
  .scrolling-banner .divider {
    margin: 0 var(--scrolling-banner-gutter-desktop);
  }
}
.scrolling-banner .icon--placeholder {
  max-width: unset;
  width: auto;
}
.scrolling-banner .content-image {
  width: auto;
}
.scrolling-banner scrolling-banner {
  rotate: var(--scrolling-banner-rotate);
}
@media (prefers-reduced-motion) {
  scrolling-banner {
    display: flex;
    overflow: hidden;
  }
  scrolling-banner .banner[data-duplicated] {
    display: none;
  }
  .scrolling-banner .banner {
    flex-wrap: nowrap;
    align-items: normal;
    /* width: 1400px; */
  }
  
  @media screen and (max-width: 640px) {
   .scrolling-banner .banner-item {
    margin-top: 10px;
  }
  }
}
  .scrolling-banner .banner-item {
    align-items: center;
  }
  .scrolling-banner .divider {
    display: flex;
    height: unset;
  }
}
@media (prefers-reduced-motion: no-preference) {
  scrolling-banner {
    display: grid;
    grid: auto/auto-flow max-content;
    transition: transform 0.6s ease-out;
  }
  scrolling-banner.animation-direction-normal {
    justify-content: start;
    overflow: hidden;
  }
  scrolling-banner.animation-direction-normal .banner {
    animation-name: translateLeft;
  }
  scrolling-banner.animation-direction-reverse {
    justify-content: end;
  }
  scrolling-banner.animation-direction-reverse .banner {
    animation-name: translateRight;
  }
  scrolling-banner .banner {
    animation-duration: var(--scrolling-banner-animation-speed);
    animation-timing-function: linear;
    animation-iteration-count: infinite;
  }
  scrolling-banner:hover .banner {
    animation-play-state: paused;
  }
}
@keyframes translateLeft {
  0% {
    transform: translate(0);
  }
  100% {
    transform: translate(-100%);
  }
}
@keyframes translateRight {
  0% {
    transform: translate(0);
  }
  100% {
    transform: translate(100%);
  }
}
@media only screen and (max-width: 767px) {
  .scrolling-banner .banner{
    flex-wrap: wrap;
    flex: 1;
    overflow: hidden;
  }
  .scrolling-banner{padding: 0px}
  .scrolling-banner .banner-item{width: 48%;margin-top: 10px}
  .scrolling-banner .content-image{height: 100% !important;width:100%}
  .scrolling-banner .banner-item:nth-child(3),.scrolling-banner .banner-item:nth-child(4){
    display: none
  }
}