JSFiddle - React, Tailwind, and code Playground

HTML

<a href="http://example.com"><div class="thumbnail boxsize"><div class="thumbnailcontainer"><img style="max-width:100%;max-height:120px;" src="https://gametimersnation.files.wordpress.com/2010/08/380px-madden_nfl_09_falcons_logo_large.png" alt=""></div><div class="overlay"><img style="max-width:20px;max-height:20px;" src="http://cdn2.bigcommerce.com/server2700/cb998/product_images/uploaded_images/lock-icon.png" /></div></div></a>
<a href="http://example.com"><div class="thumbnail boxsize"><div class="thumbnailcontainer"><img style="max-width:100%;max-height:120px;" src="https://gametimersnation.files.wordpress.com/2010/08/380px-madden_nfl_09_falcons_logo_large.png" alt=""></div></div></a>
<a href="http://example.com"><div class="thumbnail boxsize"><div class="thumbnailcontainer"><img style="max-width:100%;max-height:120px;" src="http://www.nitrografixx.com/wp-content/gallery/nfl-team-images/Denver_Broncos_Logo.png" alt=""></div></div></a>
<div class="thumbnail boxsize"><div class="thumbnailcontainer"><img style="max-width:100%;max-height:120px;" src="https://marketingbean.files.wordpress.com/2008/01/300px-greenbaypackers_100svg.png" alt=""></div></div><div class="thumbnail boxsize"><div class="thumbnailcontainer"><img style="max-width:100%;max-height:120px;" src="http://trumanreview.com/wp-content/uploads/2014/01/Detroit-Lions-Logo.png" alt=""></div></div><div class="thumbnail boxsize"><div class="thumbnailcontainer"><img style="max-width:100%;max-height:120px;" src="http://trumanreview.com/wp-content/uploads/2014/01/Detroit-Lions-Logo.png" alt=""></div><div class="overlay"><img style="max-width:20px;max-height:20px;" src="http://cdn2.bigcommerce.com/server2700/cb998/product_images/uploaded_images/lock-icon.png" /></div></div>
<br class="clearboth">
<a href="http://example.com"><div class="thumbnail boxsize"><div class="thumbnailcontainer"><img style="max-width:100%;max-height:120px;"...

CSS

body {
    text-align: center;
}
.thumbnail img {
    width: 100%;
    max-width: 100%;
    height: auto;
}
.overlay {
    position: absolute;
    top: 0;
    right: 0;
}
.thumbnail {
    width: 120px;
    height: 120px;
    border: 1px solid #999;
    margin: 0 8px 15px 8px;
    padding: 5px;
    -webkit-box-shadow: 2px 2px 5px 3px #888;
    -moz-box-shadow: 2px 2px 5px 3px #888;
    box-shadow: 2px 2px 5px 3px #888;
    border: 0px solid;
    border-color:#ddd;
    display:inline-block;
    vertical-align:middle;
    text-align:center;
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -khtml-border-radius: 5px;
    position: relative;
}
.thumbnailcontainer {
    display:table-cell;
    vertical-align:middle;
}
.thumbnailcontainer img {
    display:block;
    margin: 0 auto;
}
.clearboth {
    clear: both;
}
.boxsize {
    max-width:120px;
    max-height:120px;
    vertical-align: middle;
}
.thumbnail:hover {
    opacity: 0.6;
    filter: alpha(opacity=30);
}