Highlight section without opacity - html

Question

I have one issue in current project. I am applying background image in one div and also set opacity over it using :after.. Inside it, I have taken one another div which has border & content but I need to highlight middle section without opacity using same background image.
Sample Screenshot
.first_resorts_list_right { float: left; width: 434px; overflow: hidden; height: 477px; background-size: cover!important; background: no-repeat; padding: 70px; position: relative; background-image: url(http://s17.postimg.org/fa4ru3hm7/test.jpg); }
.resort-info { border: 10px solid #fff; padding: 20px; text-align: center; color: #000; font-size: 40px; }
.bannerimage2 { display: none; }
.expose { position: relative; z-index: 99999; }
.overlay-img { background: rgba(255,255,255,0.3); width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 99998; }
<div class="first_resorts_list_right">
<div class="resort-info expose">Content</div>
<div class="overlay-img"></div>
</div>

Answer 1

I made an alternative version, with divs wraping divs (plus sharing the same background values) instead of use :after
body {
width:100%;
height: 100vh;
margin: 0px;
font-family: arial, sans-serif;
}
#container {
width:100%;
height:100%;
position: relative;
}
#big {
top:0;
left:0;
width:100%;
height: 100%;
background-image: url("http://i.imgur.com/wvIxNg1.jpg");
background-size: 100vw 100vh;
background-repeat: no-repeat;
background-position: center;
position: relative;
-webkit-filter: blur(5px); /* Chrome, Safari, Opera */
filter: blur(5px);
}
#small {
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
width: 70%;
height: 70%;
outline: 4px solid white;
left: 0;
right: 0;
margin: auto;
background-image: url("http://i.imgur.com/wvIxNg1.jpg");
background-size: 100vw 100vh;
background-position: center;
background-repeat: no-repeat;
text-align: center;
color: white;
-webkit-filter: contrast(120%); /* Chrome, Safari, Opera */
filter: contrast(120%);
}
#white {
width:100%;
height: 100%;
background-color: white;
opacity: 0.1;
}
h1 {
font-weight: 100;
position: absolute;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
left: 0;
right: 0;
margin: auto;
letter-spacing:8px;
}
<div id=container>
<div id=big>
<div id=white></div>
</div>
<div id=small><h1>FOCUS</h1></div>
</div>