Спрятать часть карточки товара, а при наведении мыши показать - [VM2&3] Дизайн, оформление

Вопрос в следующем:
Карточка товара на странице категории. Нижняя часть с кнопками "купить" и "подробнее о товаре" (обрамил дивом) надо спрятать, а при наведении курсора показать. Желательно чтобы вылазило поверху других карточек.
Тыц
Можно CSS обойтись или надо скриптами?

Можно CSS обойтись или надо скриптами?

Можно обойтись чистым CSS3. С плавными, красивыми анимациями, блэкджеком и ш

Не подскажете? Сам не могу сообразить.

<div id="link">link<div style="display:none" id="hidden-box">скрытый текст</div></div>
<style>
#link:hover .hidden-box {
display:block
}
</style>

но лично я такую хрень не люблю и делаю через jQuery slideDown

Не работает:
В PHP обрамил свои кнопки дивами:

<div id="lin">lin<div style="display:none" id="hidden-box">               
<button class="b1c">Запрос цены</button>
               <p>
                  <?php // Product Details Button
                  echo JHTML::link ($product->link, JText::_ ('COM_VIRTUEMART_PRODUCT_DETAILS'), array('title' => $product->product_name, 'class' => 'Podrobnee'));
                  ?>
               </p>
</div>
</div>


В CSS прописал
.lin:hover .hidden-box {
display:block
}

и для надёжности

#lin:hover .hidden-box {
display:block
}
Не работает