ZB Venom

-transition:  0.5s opacity;
+transition:  0.5s visibility,  0.5s opacity;

Изучайте тут

.header__balance{
    font-size: 33px;
    color: #a1a1a1;
    margin-left: 10px;
}

Исходя из ответа на Ваш предыдущий вопрос собрал единую картину.
HTML:
<div class="dark"></div>
CSS:

.dark {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
  cursor: pointer;
  z-index: 9999;
}

function close_l() {
$('.dark').css({'display': 'none'})
	$('.list_load, .list_item').stop();
	$('.js-menu_toggle.opened').removeClass('opened').addClass('closed');

	$('.side_menu').css({ 'left':'-270px' });

	var count = $('.list_item').length;
	$('.list_item').css({
		'opacity':'0',
		'margin-left':'-20px'
	});
	$('.list_load').slideUp(0);
}

$(document).on('click','.dark',function(e){
 close_l();
});

$(document).on('click','.js-menu_toggle.opened',function(e){
 close_l();
});

HTML:
<div class="dark"></div>
CSS:

.dark {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
  cursor: pointer;
  z-index: 9999;
}

JS:

$(document).on('click','.js-menu_toggle.closed',function(e){
	$('.dark').css({'display': 'block'})
        //
}
$(document).on('click','.js-menu_toggle.opened',function(e){
	$('.dark').css({'display': 'none'})
       //
}