bloc de div image qui affiche une div au survol

Bonjour,

Voila je rencontre un petit problème avec mon code.

Affiche div au survol d une div image

Décrivez ici votre code ou ce que vous cherchez à faire

 <div class="inner">
      <h2>AVANTAGES</h2>
    <div class="col-md-12 marginPara">
        <div class="ImgAvantages1"><img src="images/avantage1.png">
      <div class="col-md-12 marginPara avantage1">
      <p>L’efficacité lumineuse est de 140 Lm/W,
      soit 30% plus efficace qu’un Led de dernière génération.
      Sa lumière est la plus uniforme du marché.
      Sa perte d’efficacité est de 1% tous les 5 ans.</p>
      </div>
    </div>
    <div class="ImgAvantages2"><img src="images/avantage2.png">
        <div class="col-md-12 marginPara avantage2">
        <p>Economie d’énergie avec
        80% de moins d’énergie que les lumières traditionnelles.
        30% de moins que la génération de Led.
        Plus de lumière et consommation réduite.</p>
        </div>

    </div>  
    <div class="ImgAvantages3"><img src="images/avantage3.png">
        <div class="col-md-12 marginPara avantage3">
        <p>Le système d’éclairage avec la plus longue durée de vie.
        Minimum de 100.000 heures,
        Soit plus de 10 années avec 24h/24 365 jours par an.
        Aucun entretien.</p>
        </div>

    </div>  
    <div class="ImgAvantages4"><img src="images/avantage4.png">
          <div class="col-md-12 marginPara avantage4">
           <p>Résistant aux températures comprises entre -40°C et +70°C
          Résistant aux chocs
          Résistant aux vibrations
          Résistant à l’eau</p> 
          </div>

    </div>  
    <div class="ImgAvantages5"><img src="images/avantage5.png">
        <div class="col-md-12 marginPara avantage5">
       <p>Angle d’éclairage de plus de 180°.
       Plage de fonctionnement entre 60 et 300 volts.
       Températures de couleurs comprises entre 2 250 et 6 000 k
       Dimérisation 100% </p>
       </div>
    </div>  
 </div>   
</div>

Le css
.ImgAvantages1,.ImgAvantages2,.ImgAvantages3,.ImgAvantages4,.ImgAvantages5{
 float: left;
 margin-right: 48px;
 margin-left: 10px;

} 
.avantage1,.avantage2,.avantage3,.avantage4,.avantage5{
background-color: #FFF;
padding: 20px 50px !important;
border: 3px solid black;
display: none;
}
.ImgAvantages1:hover  .avantage1{
  display: block;
}
.ImgAvantages2:hover  .avantage2{
  display: block;
}
.ImgAvantages3:hover  .avantage3{
 display: block; 
}
.ImgAvantages4:hover  .avantage4{
  display: block;
}
.ImgAvantages5:hover  .avantage5{
  display: block;
}

Ce que je veux

j ai 5 images qui doivent afficher une div au survol avec un display:none pour les autres.
Sinon je pense que je prefererais une animation qui montre la première div image puis passe a la suivante et faire une boucle.
Mais déja le système de div multiple galère pour se placer.

Ce que j'obtiens