Editing CSS


Can anyone guide me on how to edit CSS in a widget, please?
My site’s link is: http://budh-shash.rhcloud.com/

In the front page, there is a section called “Our Work”. I want to introduce opacity to the block of code under the div tag with class=“panel-widget-style”

The current code generated by wordpress is:

<div style="color: inherit; background-color: rgb(214, 214, 214);" class="panel-widget-style">
<h3 class="widget-title" style="color: inherit;">our work</h3>        <div>....</div>

I want to edit this section so that the final result looks like this:

<div style="color: inherit; background-color: rgba(39, 37, 37, 0.34);" class="panel-widget-style">
<h3 class="widget-title" style="color: inherit;">our work</h3>        <div>....</div>

How can I make this change without really editing the html?

Please help!


Hello there,

Thank you for getting in touch.

Could you please try to add the following CSS code through the Simple Custom CSS plugin?

#pgc-10-3-0 .panel-widget-style{
  background-color: rgba(39, 37, 37, 0.34) !important;

Let me know how it goes. I’ll wait to hear back from you regarding your stats.

Warmest regards,

Hi Kharis,

Thank you for helping me with this.

I just realized that this method of editing CSS on pages can be very empowering to those that want to customize the theme further.
I’m using the pro version for my website.