Changing background color of SyntaxHighlighter

I'm using SyntaxHighlighter on my website (using Google Blogger) with the default theme, and this HTML code...

<pre class="brush:cpp" >
int myFunc()
{
  //do something
  return 1;
}
</pre>

...produces this output (see a temporarily-created webpage sample here):

However, I'd like to make the background color, shown in this screenshot just above, grey instead of white.

Now, I know only a little about custom web design and customizing SyntaxHighlighter implementations like this, but it seems to me that looking at this link here (https://github.com/syntaxhighlighter/theme-base/blob/master/theme-base.scss) I should somehow be able to change the "background" variable from "white" as it's set by default, to grey (ex: #e5e5e5) using some sort of code like this:

<style type='text/css'>
  .SOMETHING_HERE {
    background: #e5e5e5 !important;}
</style>

Or maybe something like this (also doesn't work though):

<style type='text/css'>
  .syntaxhighlighter {
    max-height: 550px;
    background-color: #e5e5e5 !important;
    overflow-y: auto !important;
    overflow-x: auto !important;
    table {
      td.code {
        .container {
          textarea {
            background: #e5e5e5 !important;
          }
        }
      }
    }}
</style>

Am I on the right track? Is this possible? How do I do it?

In case you don't have full control over the .css or .js files, as is my case (since I followed these instructions here and am using Alex Gorbatchev's hosted files instead), there is still a way to override the !important parameters and customize your colors and settings.

You can customize any of the settings shown here (http://agorbatchev.typepad.com/pub/sh/3_0_83/styles/shThemeDefault.css), for example, as follows.

Note: I have written about how to do this on my website too, here: http://www.electricrcaircraftguy.com/2016/10/syntaxhighlighter.html.

With the default theme, this HTML...

<pre class="brush:cpp" title="test code">
int myFunc()
{
  //do something
  return 1;
}
</pre>

...yields this result:

Looking here (http://agorbatchev.typepad.com/pub/sh/3_0_83/styles/shThemeDefault.css), I can see the parameters I am currently using. For example, it contains:

.syntaxhighlighter {
  background-color: white !important;
}
.syntaxhighlighter .line.alt1 {
  background-color: white !important;
}
.syntaxhighlighter .line.alt2 {
  background-color: white !important;
}
...
.syntaxhighlighter .comments, .syntaxhighlighter .comments a {
  color: #008200 !important;
}

In order from top to bottom, as shown just above, my header background color is white and my alternating code lines 1 and 2 are both white. Comments are green (#008200). Let's change all of that. Add the following code to your blogger template, at the very end of your header, just above </head>:

<style type='text/css'>
  .syntaxhighlighter {
    max-height: 550px;
    background-color: #ff0000 !important;
    overflow-y: auto !important;
    overflow-x: auto !important;
  }
  .syntaxhighlighter .line.alt1 {
    background-color: #99ff99 !important;
  }
  .syntaxhighlighter .line.alt2 {
    background-color: #99ff99 !important;
  }
  .syntaxhighlighter .comments, .syntaxhighlighter .comments a {
    color: #000082 !important;
    font-weight: bold !important;
  }
</style>

Now, I have set my max-heightto 550 pixels (make a really long code block and you'll see it constrained to this height now, with a vertical slider to see it all), my header background color is red (#ff0000), my code background color (both alternating lines) is light green (#99ff99), and my comments are blue (#000082) and bold. Follow this format to customize anything you see in your .css theme file--example, for me, here: http://agorbatchev.typepad.com/pub/sh/3_0_83/styles/shThemeDefault.css.

Here is my final result--very different from the default look above:

Note that the font-weight parameter I set is simply a CSS styling you can apply. Many other options exist. See here: http://www.w3schools.com/cssref/pr_font_weight.asp.

Also posted here:

1. [My answer] syntaxhighlighter how to change the color of comment
2. And like I said, also on my website here: http://www.electricrcaircraftguy.com/2016/10/syntaxhighlighter.html