yes - here the link to a gallery-page
https://josef-test2.weebly.com/projects.html

This should do it for you on the live site if you add it to Settings > SEO > Header Code:

<style>
	.fancybox-overlay
	{
		background: #fff !important;
	}
</style>

YESSSSS - THANK YOU- this works
this is great! WOW
and is there also a way to move the navigation-signs to the side of the page? or at least make the arrows and the X grey?

Try this code instead:

<style>
	.fancybox-overlay
	{
		background: #fff !important;
	}
	.fancybox-next
	{
		right: -56px !important;
	}
	.fancybox-prev
	{
		left: -56px !important;
	}
	.fancybox-nav
	{
		width: 50% !important;
	}
</style>

This will move the arrows off of the drop shadow so they don't look funny on top of it.

thanx Adam, 

the BG gets white, the rest is unfortunately not working - i know that with developpe-rtools it has that effect (my small coding-experience let me figure that out ..) - but on the site it is not working

I also tried to make the captions white, writing black and added (without success)

.fancybox-title
{ color: #000000 !important; }
.fancybox-title { background: #ffffff !important; }

why oh why is that so?

It looks like it's being overriden by later CSS code. Try moving the code to Settings > SEO > Footer Code.

yes it worked!!!!! but i had to put <style></style> in between each element (and uploaded other navigation-arrows) - i also changed the captions and got rid of the shadow-box (i am sure there is a more "elegant way" to do that - and that there is a way to leave the shadows and set the captions-background to transparent - i am not that code-savvy, will still look into that - unless you got a quick answer?)

in the header i left: <style> .fancybox-overlay { background: #fff !important; } </style>
and as you told me: in the footer I put:
<style> .fancybox-opened .fancybox-skin { box-shadow: 0 0px 0px rgba(255, 255, 255, 0.5); } </style>
 <style> .fancybox-next { right: -56px !important } </style>
 <style> .fancybox-prev { left: -56px !important; } </style>
<style> .fancybox-close { right: -56px !important; } </style>

<style> .fancybox-nav { width: 50% !important; } </style>
<style> .fancybox-title { text-align: center !important; } </style>
 <style> .fancybox-title { color: #878787 !important; } </style>
<style> .fancybox-title { background: #ffffff !important; } </style>

This is probably the quickest way to do it and will also probably keep working if you change themes, so I probably wouldn't do it a different way if it was me.

thanx Adam for the compliment - now that i started i will try to tweak some more - maybe you got any hint on how i can get the navigation-arrows to remain always on the side of the page (when the images are popped up of course) ?

That would be a little trickier since they're currently positioned absolutely based on the dimensions of the container element of the image. Without editing the HTML itself it might be a bit tricky, and that could also break some of the javascript functionality of the lightbox.

oh - ok - i guess i won't try it then .... thanx once again
oh - one last question: any idea how to set a backgroundcolor on transparent? i tried with opacity to 0 but this ain't working