.logo-marquee {
  height: auto;
  display: flex;
  justify-content: center;
  align-items: center;
}

:root {
  --marquee-width: 95vw;
  --marquee-height: 20vh;
  /* --marquee-elements: 12; */ /* defined with JavaScript */
  --marquee-elements-displayed: 5;
  --marquee-element-width: calc(var(--marquee-width) / var(--marquee-elements-displayed));
  --marquee-animation-duration: calc(var(--marquee-elements) * 3s);
 
}

.marquee {
  width:90vw;
  overflow: hidden;
  position: relative;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

.marquee  ul {
  list-style: none;
  height: 100%;
  display: flex;
  animation: scrolling var(--marquee-animation-duration) linear infinite;
}
/* .marquee  ul:hover {
  animation-play-state: paused;
  cursor:pointer;
} */
@keyframes scrolling {
  0% { transform: translateX(0); }
  100% { transform: translateX(calc(-1 * var(--marquee-element-width) * var(--marquee-elements))); }
}
.marquee ul li {
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center;
  flex-shrink: 0;
  width: var(--marquee-element-width);
  max-height: 100%;
  width:auto;
  padding:20px;
  box-sizing: border-box;
  font-size: calc(var(--marquee-height)*3/4); /* 5rem; */
  white-space: nowrap;
}

.marquee ul li::before { 
	content:none;
}

.marquee ul li img {
  //filter: grayscale(100%);
  width: 80%;
  /* height: 100%; */
  border: 5px solid #fff;
}