Shrink logo on Scroll

Hi,
I am currently using the free version of neve and I am trying to make my sticky header responsive based on the scroll.

I am having trouble figuring out how to add CSS to make the header logo shrink

Any help is appreciated!

Additional CSS

.header.shrink {
  font-size: 13px;
  position: fixed; 
	z-index:999999;
  top: 0;
  width: 100%;
  transition: 0.2s;
}

.site-logo.shrink img{
	max-width: 45px;
}

functions.php

<script>
jQuery(document).ready(function($) {
    $(window).scroll(function () {
        if ($(window).scrollTop() > 10) { 
            $('header').addClass('shrink');
	    $('site-logo').addClass('shrink');
        }
        else{
            $('header').removeClass('shrink');
	    $('site-logo').removeClass('shrink');
        }
    });
});
</script>

The page I need help with: [log in to see the link]