How to make CSS image hover effect AJAX compatible?

Site URL: http://herzbergdesign.com

Hi all,

I'm working on the website for my design business (not web design, obviously), and am having a small issue.
I am using custom images with click-through links, and added a piece of CSS I found online that expands these images when you hover over them (using them on home page as well as a few others).
The issue is that they only work after a few page reloads (or very specifically, reloading the "branding" page will make them work throughout the website). After some thorough Googling, I am under the impression that this has to do with AJAX loading. I'd rather not turn this off just to make some dumb CSS animations work. Is there an easy way to make this work? Here's the code:

a img.thumb-image {
   display: inline-block;
   vertical-align: middle;
   -webkit-transform: translateZ(0);
           transform: translateZ(0);
   box-shadow: 0 0 1px rgba(0, 0, 0, 0);
   -webkit-backface-visibility: hidden;
           backface-visibility: hidden;
       -moz-osx-font-smoothing: grayscale;
   -webkit-transition-duration: 0.3s;
           transition-duration: 0.3s;
   -webkit-transition-property: transform;
           transition-property: transform;
 }
 a img.thumb-image:hover,
 a img.thumb-image:active {
   -webkit-transform: scale(1.1);
           transform: scale(1.1);
 }

Whelp. After hours of trying to figure this out, I solved the issue 6 minutes after posting here.
Instead of using page injection, putting the code in the custom CSS area made everything work flawlessly.