Boa tarde caros amigos do fórum.
 
Comecei a trabalhar com sites responsivos (bootstrap) há pouco tempo e ainda não tenho pleno domínio no assunto.
 
Bom, desenvolvi um site (não responsivo) pra um cliente há alguns meses e o proprietário pediu recentemente para que eu o torna-se responsivo. Acontece que o site tem um sub-menu pra o link Produtos. Causam-me dois problemas:
 
1) Quando o site é visualizado em aparelhos móveis os links não ficam um embaixo do outro, como deveriam ficar;
2) Os links do sub-menu não pode aparecer da forma que está aparecendo, pois dessa maneira só os dois primeiros são mostrados.
 
Pra ajudar vou disponibilizar o link do site. Peço que vejam ele no 'Responsive Mode Design', pois o problema é só quando ele é exibido em dispositivos móveis. Importante: para fazer o sub-menu, utilizei um arquivo CSS (menu.css), provavelmente é isso que está dando o problema, mas não consigo descobrir como corrigir.
 
Link para o site
 
Qualquer ajuda é bem vinda e agradeço desde já à todos que se propuserem a ajudar.

Resolvido

Oi, pessoal!
 
Estou com um problema em um site que estou tentando desenvolver. Quando clico em algum item/ link constido dentro do meu menu responsivo, ele não fecha automaticamente após o clique, mas eu gostaria que isso acontecesse. Alguém consegue me ajudar?
Agradeço muito.
Segue parte do código:
<header id="header"> <nav id="main-menu" class="navbar navbar-default navbar-fixed-top" role="banner"> <div class="container"> <div class="navbar-header"> <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="index.html"><img src="images/logo.png" alt=""/></a> </div> <div class="collapse navbar-collapse navbar-right"> <ul class="nav navbar-nav"> <li class="scroll active"><a href="#home">Home</a></li> <li class="scroll"><a href="#proposta">Proposta</a></li> <li class="scroll"><a href="#beneficios">Diferenciais</a></li> <li class="scroll"><a href="#escolas">Escolas</a></li> <li class="scroll"><a href="#services">Produtos</a></li> <li class="scroll"><a href="#get-in-touch">Contato</a></li> </ul> </div> </div><!--/.container--> </nav><!--/nav--> </header><!--/header-->