SOURCE

var box = document.querySelector('.box')
var bg = document.querySelector('.bg')
box.onclick = function(){
  alert(1)
}
bg.onclick = function(){
  alert(2)
}

<div class="flex">
  <div class="box flex-item"></div>
	</div>	
<div class="bg flex"></div>

.box{
	width: 100px;
  height: 100px;
  background-color: #3b98e0;
  transform: rotatey(180deg);
  -webkit-transform-style: preserve-3d;
	transform-style: preserve-3d;
}

.bg{
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background-color:#dfdfdf;
  opacity: 0.5;
}

.flex{
	display: -webkit-box;
	display: -webkit-flex;
	display: flex;
}

.flex-item{
	-webkit-box-flex: 1;
	-webkit-flex: 1;
	flex: 1;
	width: 0%;
}