Menu que amumenta com hover

E o seguinte quero fazer que quando o usuario passe o mouse por cima da box ela abra um fundo abaixo com informações sobre o serviço no caso nome e descrição segue o codigo:

HTML:

	<div class="container" id="services">
 <div class="content">
 <div class="heading">
 <h2>
 <span></span>
 <a href="">Nossos Serviços</a>
 </h2>
 </div>
 </div>
 <div class="content" id="services__itens">
 <div class="services__item show"><img src="imagens/tc.jpg" class="img-responsive" alt=""></div>
 <div class="services__item show"><img src="imagens/tc1.jpg" class="img-responsive" alt=""></div>
 <div class="services__item show"><img src="" alt=""></div>
 <div class="services__item show"><img src="" alt=""></div>
 <div class="services__item hidden"><h2>Serviço 1<h2></div>
 </div>
	</div>

SCSS:

#services{
	#services__itens{
 .services__item{
 @include make-xs-column(12);
 @include make-sm-column(6);
 @include make-md-column(3);

 min-height: 300px;
 margin-bottom: 30px;
 background: #CCC;
 background-clip: content-box;
 }
	}
}

JS:

$(document).ready(function(){
	$(".hidden").hide();
	$(".show").hover(function(){
 $(this).toggleClass("active").next().slideToggle("slow");
 return false;
	});
});