Make Blog Thumbnails Zoom In on Hover?

I have a basic grid blog. I'd like the image thumbnails to zoom in slightly on hover while the outer size of the thumbnail remains the same. My current code grows the entire size of the image instead of keeping the outer box the same size while zooming in. I'd greatly appreciate it if anyone could help tweak my code accordingly!

My blog page is https://www.glassworkpixie.com/blog/studio-journal

Below is my current CSS:

.blog-basic-grid .image-wrapper {
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease;
}

.blog-basic-grid .image-wrapper:hover {
-webkit-transform: scale(1.1); /* Safari and Chrome */
-moz-transform: scale(1.1); /* Firefox */
-ms-transform: scale(1.1); /* IE 9 */
-o-transform: scale(1.1); /* Opera */
transform: scale(1.1); /* W3C */
}

That worked perfectly! Thank you so much, I really appreciate it!

2 minutes ago, GlassworkPixie said:

That worked perfectly! Thank you so much, I really appreciate it!

Happy to help! Thanks for marking it as the solution, can you give it a like too? Thanks!