This bug should be fixed as soon as possible because it takes too much time to a developer.
The reply above didn't help in my case (HTML template). I found the solution that works at
In the head section of your html place your custom.css below bootstrap.css.
<link href="bootstrap.css" rel="stylesheet">
<link href="custom.css" rel="stylesheet">
Then in custom.css you have to use the exact same selector for the element you want to override.
In the case of legend it just stays legend in your custom.css because bootstrap hasn't got any selectors more specific.