Transparante hover effect

_site.scss

.div{
  @include span-columns($total-columns omega, $total-columns);
  position: relative;
  top: -80px;
  left: 0;
  z-index: 0;

  a{
    cursor: pointer;
    border-bottom: none;
    cursor: pointer;
    display: block;
    float: left;
    margin: 0;
    padding: 0;
    position: relative;
    width: 100%;

    &:before{
      content:"";
      display: block;
      position: absolute;
      top: 0;
      bottom:0;
      right:0;
      bottom: 7px;
      background: none;
      width: 100%;
      background: url(../img/blank.gif);
      zoom: 1;
      -webkit-transition: all 0.2s ease-in-out;
      -moz-transition: all 0.2s ease-in-out;
      -o-transition: all 0.2s ease-in-out;
      -ms-transition: all 0.2s ease-in-out;

      &:hover:nth-child(n) {
        filter: none;
      }
    }
    &:hover:before{
      background:rgb(17,46,134);
      background: transparent\9;
      background:rgba(17,46,134,0.5);
      filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#7f424242,endColorstr=#7f424242);
      zoom: 1;
    }
    img{
      margin: 0;
      padding:0;
    }
  }
}