I’m actually surprised you have it working the way it is. There are many issues with your code. I don’t normally use Codepen, so I’m unfamiliar with that, but you have an error that prevents your code to run. It looks like you combined HTML inside your CSS and JS in your Codepen.
I been out of the game for several months and have to relearn a lot of what I’ve learned in the past, but I wouldn’t even know why your source code runs the way it is. Maybe just because it’s not valid don’t mean it won’t work, but maybe someone can make sense of why things aren’t working for you.
I would suggest making it valid, then seeing if those changes would work. I see div tags that aren’t closed out, I see styles not inside the head, I see you are using HTML4, meta tags not inside the head.
Then I ran a validator…it gave 75 errors.
I tried posting the link, but it won’t load.
I’ve tried several times, only a few times it works. There must be issues with the server. This is the last error message I received:
Error: X-UA-Compatible HTTP header must have the value IE=edge, was IE=Edge,chrome=1.
2.Internal Error: Oops. That was not supposed to happen. A bug manifested itself in the application internals. Unable to continue. Sorry. The admin was notified.
The result cannot be determined due to a non-document-error.