/**
 * @author    Adilis <support@adilis.fr>
 * @copyright 2024 SAS Adilis
 * @license   http://www.adilis.fr
 */
@keyframes first-loop {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-200%);
  }
}
@keyframes loop {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
}
#nice_scroll_banner {
  background-color: var(--nsb-bg-color);
  color: var(--nsb-color);
  font-size: var(--nsb-font-size);
  line-height: var(--nsb-line-height);
  font-weight: normal;
}
@media (max-width: 768px) {
  #nice_scroll_banner {
    font-size: var(--nsb-font-size-mobile);
  }
}
#nice_scroll_banner .scroll-container {
  --nsb-half-time: calc(var(--nsb-time) / 2);
  grid-template-rows: 1fr;
  grid-template-columns: 1fr;
  grid-template-areas: "scroll-area";
  white-space: nowrap;
  overflow: hidden;
  display: grid;
  position: relative;
}
#nice_scroll_banner .scroll-container * {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
#nice_scroll_banner .scroll-container .scroll {
  grid-area: scroll-area;
  animation: loop var(--nsb-time) linear infinite;
  transform: translateX(100%);
  vertical-align: middle;
  padding: 0 1rem;
  white-space: nowrap;
  gap: 2rem;
  justify-content: space-around;
  place-items: center;
  display: flex;
}
#nice_scroll_banner .scroll-container .scroll.scroll-first {
  animation: first-loop var(--nsb-time) linear forwards;
  transform: translateX(0);
}
#nice_scroll_banner .scroll-container .scroll.scroll-last {
  animation-delay: var(--nsb-half-time);
}
#nice_scroll_banner .scroll-container .scroll .banner {
  margin: 0 1rem;
}
#nice_scroll_banner .scroll-container .scroll .banner a {
  color: var(--nsb-color);
  font-size: var(--nsb-font-size);
  line-height: var(--nsb-line-height);
  text-decoration: none;
}
@media (max-width: 768px) {
  #nice_scroll_banner .scroll-container .scroll .banner a {
    font-size: var(--nsb-font-size-mobile);
  }
}
#nice_scroll_banner .scroll-container .scroll .banner a:hover {
  color: var(--nsb-link-color-hover);
}
#nice_scroll_banner .scroll-container .scroll .banner:hover a {
  color: var(--nsb-link-color-hover);
}
#nice_scroll_banner .scroll-container:hover .scroll {
  animation-play-state: paused;
}
#nice_scroll_banner .scroll-container .scroll-fade {
  background: linear-gradient(90deg, var(--nsb-bg-color), transparent 10%, transparent 90%, var(--nsb-bg-color));
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
}

/*# sourceMappingURL=nicescrollbanner.css.map */
