Firefox readability in KDE Plasma theme

I've started using KDE Plasma Workspace in Cent OS 7 a few weeks ago, and I love every bit of it. Except when it comes to its theme ruining firefox's readability. The worst case scenario I had is when I'm on Google Developers site it turned both background and text into dark grey!

After I tried addons and making sure that "Apply colors to non-KDE4 applications" is unchecked in my settings which doesn't fix the issue., here's the solution that worked for me. Note that it came from multiple sites that are lost to me now.

1. Open a new tab in firefox and go to about:support

2. Find "Profile directory" and click on "Open directory"

3. Create a new folder in it called "chrome", note that it is case-sensitive

4. Create a new file called "userContent.css", again, it is case-sensitve

5. Paste the following text in the file:

Note that creating your own userContent.css is not recommended by several users I found online, but so far I have not notice any problems doing this so let's hope that's the end of it!