Hi,

We sincerely apologize for the inconvenience and for the delayed response over the weekend.

To resolve this issue, please edit the menu item assigned to that page and add the following page class in the Page Display tab:

fixed-menu

You can refer to this screenshot for guidance: https://prnt.sc/JD2tQhm0fDOs

After saving the menu item, clear your Joomla and browser cache, then check the page again. This should restore the expected scrolling behavior where the cards collapse one by one, just like in the demo.

Please let us know if the issue persists after applying this change, and we'll be happy to investigate further.

Well that solved the scrolling behaviour for the cards but it messed up my sticky header and main menu. Now, my header is over the "top" section and the background color of the header with the menu is gone.

Could you please share the page url?

Look at the hidden content.

Please remove the class that was added to the menu, then add the following CSS code under Template Options → Custom Code → Custom CSS:

.body-wrapper > .body-innerwrapper {
    overflow-x: visible;
}

After applying the changes, please clear both the Joomla cache and your browser cache to ensure the updated styles are loaded and the changes are reflected correctly.

That fixed it with the scrollable section working fine too.

Thank you for your help.

You're most welcome! I'm glad to hear the issue has been resolved and that the scrollable section is working properly now.

If you have any other questions or need further assistance, please don't hesitate to let us know. We're always happy to help.

Please marked the issue as solved

I was testing this page on mobile and the scrolling part is very difficult to read what is written as the images keep scrolling over the text. Can we stop this behavior on mobile only?

I fixed it by wrapping this css with @media screen and (min-width: 768px) {....} so it only applies to larger devices.