As for the first question, this is what I would do:
{{#if: {{{noboost|}}} | |
{{!}} colspan="2" class="infobox_section" {{!}} Statistic Boosts }}
This way, if you input {{{noboost}}}, nothing will show up, but if you don't, the header will appear like normal.
(Someone please verify this, I'm still new at coding, so this may be incorrect.)
The second question is more complicated, given the coding you've used for your infobox headers so far. First, you'd have to get the colors you want to include, and expand the coding so it looks something like this:
| style="background: #marscolor1; color: #marscolor2; border-color: #marscolor3"
or whatever you want the style to be. (This could include making templates for each color, if you want, but I don't know how to do that) Then, to make it vary depending on the element, you need to put in switch statements. They work like this:
{{#switch: {{{element|}}} | mars = blahblahblah | mercury = blahblahblah | jupiter = blahblahblah | venus = blahblahblah | }}
You'd put this probably inside the style="stuff" section, and then on the page, you input one of the four elements, and the colors should correspond.
(Also needs verification.)
These are the methods I would employ. If you want me to help you work through this, I'd be happy to assist.