Hi, try adding these style rules to your custom CSS:
#fancybox-content, #fancybox-outer {
background-color: rgba(0,0,0,0);
border-color: rgba(0,0,0,0);
box-shadow: none;
}
but be aware that all will show through including texts and header image, making it rather confusing for your visitors to know what is is what…
Wow thanks! Is there anyway to set opacity instead? So that it’s only semi transparent?
yes, change the last zero or the rgba code to a value between 0 (full transparency) and 1 (fully opaque). for example 0.4
or use an online color tool like http://www.css3maker.com/css-3-rgba.html to play with and get the perfect rgba value for your needs 🙂
Here is the code I used sir. Thank you very much! I’m really happy with how it turned out 🙂
#fancybox-content, #fancybox-outer {
background-color: rgba(255,255,255,0.6);
border-color: rgba(0,0,0,0);
box-shadow: none;
}
