Ao acionar o menu o que embaixo desce dando espaço, mas quando eu oculto o menu, o banner do site não volta pro lugar. Embaixo está o código JS

$('#collapse-navbar').on('show.bs.collapse', function(){
    $('.topCasaFina-banner').css('transform','translate(-50%, 10%)');
});

$('#collapse-navbar').on('hide.bs.collapse', function(){
    $('.topCasaFina-banner').css('transform','translate(-50%, -50%)');
});;

E aqui está a parte do HTML que o JavaScript está pegando

<div class="collapse navbar-collapse" id="collapse-navbar">
    <ul class="nav navbar-nav">
        <li><a href="#sobre-nos">Sobre Nós</a></li>
        <li><a href="#nossos-projetos">Nossos Projetos</a></li>
        <li><a href="#depoimentos">Depoimentos</a></li>
        <li><a href="#video">Vídeo</a></li>
         <li><a href="#contato">Contato</a></li>
    </ul>
</div>