My fullscreen parallax image is not responsive and does not scale well

When the browser displays a fullscreen image will do so taking three factors in account:

- display resolution (width and height)

- display mode (portrait or landscape)

- image aspect ratio (width vs height)

So to display using the current resolution and display mode and preserving the aspect ratio, the browser will crop the image: in portrait will preserve the height whereas in landscape mode will preserve the width, cropping the rest that does not fit in current res.

The attached images visually explains the cropping process.