Gallery stack 3 background opacity

Hi,
I’m building a new website using Foundation 6 and Gallery Stack 3 (ScenicByMarnix.com).
The black background of the lightbox is slightly transparant and I would like it to be perfect black without transparency. I’ve tried to add the following CSS code to the page and I can change the color as well as the opacity with it but I never get non-transparant. See attached screenshot.

This is the CSS code I use:
#Choco_overlay {
background-color: rgba(0,0,0,1)!important;
}

How can I get a non-transparant background ?

Hi @marnixvm,

When I visit your site, unless I’m mistaken, the background colour of the lightbox is perfect black with just a hint of transparency:

This is reflected in the CSS too:

If you don’t need any transparency, either leave out the setting entirely or set it to 0. (it’s currently set at 0.9).

If leaving out the setting entirely makes the lightbox default to transparency, then the transparency is hardcoded and you’ll need to set it to 0 manually. Add !important to force override the default CSS that the stack generates.

Cheers,
Erwin

Thx Erwin for your reply and you insight.

I can see this Opacity: 0.9 but I don’t see the location in RW where I can overide it. Any idea ?

I’ve tried the following code in the CSS tabs both at the level of the page and at the site level. Same result. Although I can change the background color and transparancy with it but the maximum transparancy I get is 0.9. Never 1.

#Choco_overlay {
background-color: rgba(0,0,0,1) !important;
}

And if I use for example:
#Choco_overlay {
background-color: rgba(0,0,255,0.5) !important;
}
I get a blue half transparant background…

Hi Erwin,

Problem is solved and works fine.
I used the following CSS code:

#Choco_overlay {
background-color: rgb(0,0,0); opacity: 1 !important;
}

This works as I wanted it to work.

Thx for your help.
Kind regards,
Marnix

2 Likes