Fix a layout bug on single-project

On smaller screens (mostly tablets) there was an undue space between the first and the other photos. This commit solves it by duplicating the <header> tag, one outside the project-details and one inside, shown and hidden based on media-queries.

Signed-off-by: Emanuele <feliziani.emanuele@gmail.com>
Responsive images!

Responsive all the things! Both background-images and <img> tags, even inline background-images: everything is responsive and even takes into account pixel density.

I have investigated the <picture> element and picturefill.js, but my solution is so much leaner and cleaner overall.

Signed-off-by: Emanuele <feliziani.emanuele@gmail.com>