Hover et delay en CSS

<div class="container">
  <div class="btn">Bouton hover</div>
  <div class="content">
Porta nunc velit augue? Et? Odio egestas sit, et lacus aenean magna purus hac nec aenean? Enim tincidunt phasellus sociis integer pulvinar! Augue montes, porttitor nisi, ultrices et urna sit, tempor urna enim eros arcu urna, nec ridiculus risus ac, mauris massa scelerisque eu, natoque, nisi montes cras, nec! Sagittis
  </div>
</div>

.container .content{
  display:none;
  background:#300;
  padding: 50px;
  color:#FFF;
}
 
.container .btn{
  background:#F00;
  color:#FFF;
  padding: 10px 20px; 
  display:inline-block;
}
 
.container .btn:hover + .content{
  display: table; 
  -webkit-animation: hover 1s ease-in-out; 
  animation: hover 1s ease-in-out;
}
 
 
@-webkit-keyframes hover {
    0% {
        opacity: 0;
        filter: alpha(opacity = 0);
    }
    70% {
        opacity: 0;
        filter: alpha(opacity = 0);
    }
    100% {
        opacity: 1;
        filter: alpha(opacity = 100);
    }
}
@keyframes hover {
    0% {
        opacity: 0;
        filter: alpha(opacity = 0);
    }
    70% {
        opacity: 0;
        filter: alpha(opacity = 0);
    }
    100% {
        opacity: 1;
        filter: alpha(opacity = 100);
    }
}