JSFiddle - React, Tailwind, and code Playground

HTML

<div class="thumbnail">
    <img src="http://davidnaylor.org/temp/thunderbird-logo-200x200.png" alt="Site Pessoal"/>
    <div class="caption">
        <p><strong>Site</strong></p>
        <p>
            <a href="#" class="btn btn-info gray gly_medium" id="site-imagens" title="Veja imagens">
                <span class="glyphicon glyphicon-search"></span>
            </a>
            <a href="#" class="btn btn-info gray gly_medium" title="Acesse o site">
                <span class="glyphicon glyphicon-link"></span>
            </a>
        </p>
    </div>
</div>
<div class="thumbnail">
    <img src="https://upload.wikimedia.org/wikipedia/en/7/71/Quebec_citadelles_200x200.png" alt="Video Site"/>
    <div class="caption">
        <p><strong>Video Content Site</strong></p>
        <p>
            <a href="#" class="btn btn-info gray gly_medium" id="video-imagens" title="Veja Imagens">
                <span class="glyphicon glyphicon-search"></span>
            </a>
            <a href="#" class="btn btn-info gray gly_medium" title="Acesse o site">
                <span class="glyphicon glyphicon-link"></span>
            </a>
        </p>
    </div>
</div>
<div class="thumbnail">
    <img src="http://horoscopo.ego.globo.com/img/horoscopo.ego.globo.com/icones/signos/gemeos-g.png" alt="Video Site"/>
    <div class="caption">
        <p><strong>Video Site</strong></p>
        <p>
            <a href="#" class="btn btn-info gray gly_medium" id="video-imagens" title="Veja Imagens">
                <span class="glyphicon glyphicon-search"></span>
            </a>
            <a href="#" class="btn btn-info gray gly_medium" title="Acesse o site">
                <span class="glyphicon glyphicon-link"></span>
            </a>
        </p>
    </div>
</div>
<div class="thumbnail">
    <img src="http://horoscopo.ego.globo.com/img/horoscopo.ego.globo.com/icones/signos/cancer-g.png" alt="Video Site"/>
    <div class="caption">
        <p><strong>Video Site</strong></p>
       ...

CSS

.thumbnail{
    display:inline-block
}

.caption{
    opacity:0;
    visibility: hidden;
    transition:opacity 3s; /* aumentei o tempo para poder ser visto o transaction */
    position:absolute;
    background-color:#fff;
    width:308px;
    margin-left:-5px
}

img:hover +.caption{ 
    opacity:1;
    visibility: visible;
    z-index:1
}