Нужна помощь с меню.
 

Здравствуйте. Долго парюсь, никак не могу сделать адаптивное меню на jqery. Без посторонней помощи не справлюсь, помогите пожалуйста - знающие!

Ссылка на сайт с адаптивным меню.

Проблема в том, что сейчас при втором(повторном) открытии меню на разрешении 991px, появляется .modal-wrapper а .menu не появляется, потому что оно скрывается стилем.
Я перебаловал много вариантов, через window resize решить проблему, но везде вылазят косяки, которые затрагивают то или иное действие или эффект.
Работа кода, получается такой себе - кубик рубик. Стою на месте, не могу никак сделать полноценную работу меню.
Скрипт меню находится в файле main.js, внутри после /* закоментированные куски кода, не пугайтесь их :)

$(document).ready(function() {
	$('.menu-call').click(function(event) {
		$('.menu').addClass('open-menu').removeClass('close-menu').css('visibility', 'visible');
		$('.modal-wrapper, .close-layer').css('visibility', 'visible');
		$('.modal-wrapper').css('opacity', '1').css('transition', '.5s ease-in-out');
	});
	$('.modal-wrapper, .close-layer').click(function (e){ // событие клика по веб-документу
		var div = $(".menu"); // тут указываем ID элемента
		if (!div.is(e.target) // если клик был не по нашему блоку
		    && div.has(e.target).length === 0) {
			div.addClass('close-menu');
			$(".modal-wrapper, .close-layer").css('visibility', 'hidden');
			$('.modal-wrapper').css('opacity', '0');
		}
	});
});

протестируйте

добавил .removeClass('close-menu') в 3 строку