.container{
width:100%;
margin:50px 0 auto;
}
.post{
width:100%;
}
.wrapper{
width: 100%;
height: 100%;
position: relative;
padding:66.66% 0 0;
margin-bottom:50px;
}
.inner{
width: 100%;
height: 100%;
background-color: #eee;
text-align: center;
position: absolute;
top:0;
left:0;
}
.content{
width: 500px;
height: auto;
margin-left:-250px;
vertical-align: center;
position: absolute;
top:50%;
left:50%;
}
.img-wrapper{
width: 100%;
height: 100%;
position: relative;
padding:66.66% 0 0;
}
.img-wrapper::before{
content: '';
width: 100%;
height: 100%;
background: #000;
opacity: 0;
position: absolute;
top:0;
left:0;
z-index: 1;
-webkit-transition: all .25s ease;
-moz-transition: all .25s ease;
-ms-transition: all .25s ease;
-o-transition: all .25s ease;
transition: all .25s ease;
}
.img-wrapper:hover::before{
opacity: 0.7;
}
.img-wrapper img{
width: 100%;
position: absolute;
top:0;
left:0;
}
]]>
