.endless__ticker {
  position: relative;
  display: flex;
  overflow: hidden;
  user-select: none;
  gap: 20px;
  background-color: rgba(18, 19, 20, 1);
}
.endless__ticker:before,
.endless__ticker:after {
  content: "";
  height: 100%;
  top: 0;
  width: 10%;
  position: absolute;
  z-index: 1;
  pointer-events: none;
}

.endless__ticker-items {
  flex-shrink: 0;
  display: flex;  
  justify-content: space-around;
  min-width: 100%;
}

@media screen and (min-width:769px) {
    .endless__ticker-items {
        gap: 20px;
    }
}
@media screen and (max-width:768px) {
    .endless__ticker-items {
        gap: 10px;
    }
}

.endless__ticker-item {
  flex: 0 0 auto;
  width: fit-content;
  height: fit-content;
  border-radius: 6px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 25px;
  color: #fff;
  margin: 10px 0;
  transition: all 0.1s ease-in-out;
}

@media screen and (min-width:769px) {
    .endless__ticker-item {
        font-size: 25px;
    }
}
@media screen and (max-width:768px) {
    .endless__ticker-item {
        font-size: 16px;
    }
}

.endless__ticker-item.endless__ticker-item--green {
    color: #00CABE;
}

.endless__ticker-item-image {
    height: 100%;
    display: flex;
    align-items: center;
}

@media screen and (min-width:769px) {
    .endless__ticker-item-image img {
        width: 24px;
    }
}
@media screen and (max-width:768px) {
    .endless__ticker-item-image img {
        width: 16px;
    }
}


.marquee {
  animation: scroll 40s linear infinite;
}


@keyframes scroll {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(calc(-100% - 20px));
  }
}