Como eu posso usar media query com Jquery no meu site?

Meu site é :https://xraros.000webhostapp.com/

To com seguinte problema eu adicionei esse código:

jQuery(document).ready(function() {
 if($(window).width()<=820)
 {

 $('#menu').hide();
 }
	});

	no arquivo carrega.js com a intenção de ocultar o menu só quando a tela estive com 820px de largurar ou menos, mais isso não esta acontecendo, como podem ver no meu site esse script n esta funcionando ele ta ocultando o menu em todas as resoluções, como faço pra deixar o menu oculto na resolução de 820px pra baixo?