Hi - I'd like to add focus functionality to the items in the portfolio masonry grid.  Tried the CSS below, but didn't work.  Please advise..

.item:hover .item-content, .item:focus .item-content {
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
 }
 .item:hover .item-overlay, .item:focus .item-overlay {
   background: rgba(0,0,0,0.8);
   opacity: 1;
 }
 .item:hover .item-cat, .item:focus .item-cat {
   opacity: 1;
   -webkit-transition: all 0.4s ease-in-out;
   -moz-transition: all 0.4s ease-in-out;
   -o-transition: all 0.4s ease-in-out;
   -ms-transition: all 0.4s ease-in-out;
   transition: all 0.4s ease-in-out;
   -webkit-transform: translateY(0px);
   transform: translateY(0px);
 }
 .item:hover .item-title, .item:focus .item-title {
   opacity: 1;
   -webkit-transition: all 0.5s ease-in-out 0.3s;
   -moz-transition: all 0.5s ease-in-out 0.3s;
   -o-transition: all 0.5s ease-in-out 0.3s;
   -ms-transition: all 0.5s ease-in-out 0.3s;
   transition: all 0.5s ease-in-out 0.3s;
   -webkit-transform: translateY(0px);
   transform: translateY(0px);
 }

Hi - I found this code which works.  Please advise on how to implement, especially the HTML and jQuery, within the Nerduck theme for the .item-overlay, .item-content, .item-title, .item-cat in the masonry portfolio .  Thanks.

http://jsfiddle.net/c_kick/s9rB4/