change logo size

HTML

<div class="wrap">
    <div class="header">
        <div class="box"></div>
    </div>
</div>

CSS

.wrap{
    min-height:1000px;
    background:grey;
}

.header{
    position:fixed;
    background:#fff;
    height:50px;
    width:100%;
    position:relative;
    position:fixed;
    top:0px;
}

.box{
margin:0 auto;
    background:red;
    z-index:999;
    height:100px;
    width:100px;
}

JavaScript

$( window ).scroll(function() {
     if($(window).scrollTop() > 200){
       $('.box').css({'height': '50'}); 
     }else{
         $('.box').css({'height': '100'}); 
     }
    
});