Make overlapping div “not clickable” so that content below can be accessed?

Well there is pointer-events:none; but only few browsers modern browsers (and IE11) support it.

https://developer.mozilla.org/en/CSS/pointer-events