JSFiddle - React, Tailwind, and code Playground

HTML

<div style="height:100%">
<div id="top_logo" class="top_logo"></div>
</div>

<div style="min-height:1000px"

CSS

.top_logo {
position: absolute;
width: 150px;
height: 132px;
left: 50%; 
top: 50%; 
margin-left: -75px; 
margin-top: -66px;
background-color:#c2151a; 
}

JavaScript

jQuery(function(f){
    var element = f('#top_logo');
    f(window).scroll(function(){
        element['fade'+ (f(this).scrollTop() > 200 ? 'In': 'Out')](500);           
    });
});