/* Container Styling */
.company-container {
    margin-top: 5rem;
    text-align: center;
    padding: 20px;
    background-color: #f7f7f7;
  }
  
  .company-title {
    font-weight: bold;
    font-size: 2rem;
    margin-bottom: 20px;
  }
  
  /* Marquee Container */
  .marquee-container {
    overflow: hidden; /* Hide overflow to create the scrolling effect */
    white-space: nowrap;
    width: 100%;
    border-radius: 10px;
  }
  
  .marquee-item {
    display: inline-flex;
    animation: scrollLeft 10s linear infinite; /* Infinite automatic scroll */
  }
  
  /* Adjust the total width for seamless scrolling */
  .marquee-item::after {
    content: "";
    display: inline-block;
    width: 130px; /* This should match the width of one logo */
  }
  
  /* Marquee Images */
  .marquee-item img {
    width: 130px; /* Adjust the logo size */
    height: 5rem;
    margin-right: 20px;
    border: 1px solid lightblue;
    border-radius: 10px;
    padding: 10px;
  }
  
  /* Continuous Scroll Animation */
  @keyframes scrollLeft {
    0% {
      transform: translateX(0); /* Start from the left */
    }
    100% {
      transform: translateX(-53%); /* Move to the left */
    }
  }
  
  /* Responsive Adjustments */
  @media (max-width: 768px) {
    .marquee-item img {
      width: 90px; /* Reduce logo size for smaller screens */
    }
  }
  
  @media (max-width: 480px) {
    .marquee-item img {
      width: 70px; /* Further reduce logo size for mobile */
    }
  }