CSS+JS Carousel loses style when scrolling through it

I have two carousels on my home page that seem to lose styling effects when transitioning between the first and last carousel item.

Any tips on what to change or where to look would be greatly appreciated. I’ve tried to look for JS events that may cause it with no success, but it doesn’t seem like anything would be making it lose the styling.

The home page is: Home Page

Once the styling breaks it seems to restore after sliding on the carousel more, but I’d like it to remain consistent the entire time. If there’s a snippet or file I can send please let me know and I’ll post a pastebin here.


By “lose styling effects” I assume you mean changing it’s font size.

It happens because you have CSS

#hometext {
  font-size: 16px;

but this id appears only in first visible item on carousel (which changes during swiping).

Id in HTML must be unique (apears max once in source). Just change this to class instead:

.hometext {
  font-size: 16px;

and in carousel

<p class="hometext">Want a custom picture of you and your familiar? Submit your idea for a quote!</p>