Background gradient opacity

I know this has been asked before and I have used the CSS code to lower the opacity (as seen here: http://support.webmandesign.eu/forums/topic/how-to-change-the-level-of-greyscale/) but it appears to only lower the opacity on the top of the background/header images and not towards the bottom. I want to lower the opacity of the gradient fill at the bottom of the image on this site: http://www.emilyjroberts.co.uk

Also how can I include a logo in the middle as well as the title + title description text I have there currently. I want to position it like this: http://www.emilyjroberts.co.uk/version4

And finally, how do I stop the thumbnails from looking so pixelated and ugly? Such as on this page: http://www.emilyjroberts.co.uk/portfolio/
Is there also a lightbox that can be added to the Jetpack portfolio?

How can I do these things? Thanks so much for your time and the wonderful theme, I love the look! 🙂