I'm trying to apply a hover to an article but it's not working.
<style>
article.item{
margin: 5px;
border: 1px #90ac6e solid;
border-radius: 6px;
background:#cfe8b1;
}
article.item:hover{
margin: 5px;
border: 1px red solid;
border-radius: 6px;
background:#ffffff;
}
</style>
<article class="item" style="float:left; margin-left:10px; margin-top:15px; margin-bottom: 15px; width: 100px; height:100px; border: 1px #90ac6e solid; border-radius: 6px; background:#cfe8b1; text-align:center;">
<i class="fa fa-dashboard" aria-hidden="true" style="font-size:46pt; color:#666;"></i><br />
<em style="font-family:padrao; size: 12pt; text-decoration:none; color:#003300;">Business Intelligence</em>
</article>