Не свёрнутое меню

Добрый день, подскажите, где может быть ошибка в коде, при переходе к разрешению меньше 767 пикселей, меню становиться вертикальным с "гамбугером", но пункты меню остаются развёрнутыми?

<nav class="navbar navbar-default " role="navigation"> 

 <div class="navbar-header"> 
 <button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle" aria-expanded="false"> 
 <span class="sr-only">Toggle navigation</span> 
 <span class="icon-bar"></span> 
 <span class="icon-bar"></span> 
 <span class="icon-bar"></span> 
 </button> 
 <a href="#" class="navbar-brand"></a>
 </div> 


 <div id="navbarCollapse" class="collapse navbar-collapse navbar-right" >
     

  
 
 <ul class="nav navbar-nav"> 
 <li><a href="index.html">Главная</a></li> 
 
 <li><a class="page-scroll" href="#services">Услуги</a></li> 
 <li><a href="price.html">Цены</a></li> 
 <!--<li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Блог сайта <span class="caret"></span></a> 

 <ul class="dropdown-menu"> 
 <li><a href="windows.html">Windows</a></li> 
 <li><a href="#">Программы</a></li> 
 <li><a href="#">Ноутбуки</a></li> 
 <li><a href="#">Вост данных</a></li> 
 <li><a href="#">Для начинающих</a></li> 
 <li><a href="#">Интернет</a></li> 
 <li><a href="#">Безопасность</a></li> 
 <li><a href="#">Ремонт компьютеров</a></li>
 </ul> 
 
 </li> -->
 <li><a class="page-scroll" href="#contact">Контакты</a></li> 
 </ul> 

 </div>

 </nav>

Скрин https://yadi.sk/i/RRiydN7i3JCY25

<button type="button" data-target="#navbarCollapse" data-toggle="collapse" class="navbar-toggle collapsed" aria-expanded="false">

<div id="navbarCollapse" class="collapse navbar-collapse ">
  <ul class="nav navbar-nav navbar-right">
    ...
  </ul>
</div>