/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Jul 23 2026 | 06:38:23 */
/* =========================
   LOGO MARQUEE FIXED VERSION
========================= */

/* OUTER WRAPPER */
.custom-logo-marquee {
  overflow: hidden;
  width: 100%;
}

/* INNER TRACK (MOVING PART) */
.custom-logo-marquee .marquee-track {
  display: flex;
  flex-wrap: nowrap;
  width: max-content;
  animation: marqueeScroll 60s linear infinite;
}

/* LOGOS */
.custom-logo-marquee img {
  width: 120px;
  height: auto;
  object-fit: contain;
  margin-right: 40px;
  flex-shrink: 0;
}

/* ANIMATION */
@keyframes marqueeScroll {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-50%);
  }
}

/* =========================
   RESPONSIVE
========================= */

/* Tablet */
@media (max-width: 1024px) {
  .custom-logo-marquee img {
    width: 250px;
    margin-right: 30px;
  }
}

/* Mobile */
@media (max-width: 767px) {
  .custom-logo-marquee img {
    width: 180px;
    margin-right: 20px;
  }
}

/* OPTIONAL: pause on hover */
.custom-logo-marquee:hover .marquee-track {
  animation-play-state: paused;
}
/* BLACK & WHITE LOGOS */
.custom-logo-marquee img {
  filter: grayscale(100%) opacity(0.6);
  transition: all 0.3s ease;
}

/* OPTIONAL: balik color pag hover */
.custom-logo-marquee img:hover {
  filter: grayscale(0%) opacity(1);
}