Responsive random quote section

I’ll try using the random quote slider.

The yellow background and quote signs is not from the Easy Random Quotes plugin. It’s an image that I added in the “Color Section”:

“Custom Background Image”: quotes-background.png
Full Size – 1030 x 180
Center Center < Background Image Position
No Repeat < Background Repeat (also tried stretch to fit)
Scroll < Background Attachment
No minimum height, use section to define height < Section Minimum Height

I added the plugin short code [erq] in a “Text Block” that’s within the “Color Section” mentioned above.

I removed the background image from the Color section and added the above css to Quick CSS as you suggested. The background image is not centered and is not resizing responsively when the larger random quotes appear.

Any ideas?

* FYI: I previously placed the following styles in the enfold-child/style.css file to style the quotes and author:

/* START Easy Random Quotes plugin section */

/* jv: investigate > For Developers: Section ID > id="section-quotes" later.
#section-quotes {
	background-color: #bbff00;
}
*/

#quotes {
	text-align: center;
	margin: 0 5%;
}

/* jv: Formats quote */
p.quotes-caption {
	margin: 0 0;
	font-size: 1.25em;
	line-height: 1.3em;
	color: #0f75bc;
}

/* jv: Formats quote signature under quote */
p.quotes-signature {
	margin: 5px 0 0 0;
	font-size: 1.15em;
	line-height: 1.3em;
	font-style: italic;
	color: #898989;
}

/* END Easy Random Quotes plugin */