How to fix scroll logo animation from ending abruptly?

[Mukta_92]

Hii!! I have created a “scroll Logo Animation effect” under the Hero section by custom coding(HTML & CSS). Now problem is all the logos are not scrolling smoothly and infinity. After ending the scroll white space shows. I want to remove white space, one after the other should not end.
Please see the screenshot.

My site - https://thedigitime.myshopify.com/
Password- 707

An example site something I like - https://getsnooz.com/

https://section.store/pages/device-bundle#scrolling-logo-cloud

Code -

//////

.logo-container { display: flex; animation: scrollAnimation 17s linear infinite; } .logo-container img { width: 220px; /* Adjust the width as needed */ margin-right: 140px; /* Adjust the margin as needed */ } @keyframes scrollAnimation { 0% { transform: translateX(100%); } 100% { transform: translateX(-100%); } }

/////

[Mukta_92]

Unable to do that by copying their codes. If you can please provide all HTML and CSS code. Thank you.