手机上网页导航栏折叠后打不开了，该如何解决？谢谢

我从github上fork别人的github pages，但我发现这个网页在手机上打开之后，折叠的导航栏打开不了，我纯小白，不太懂，求大神帮忙！

网站的网址是gongzehao.github.io

手机端网页打开，红色圈圈的地方展开不了。下面是导航栏处的代码

<div class="navbar navbar-default navbar-fixed-top" role="navigation">
  <div class="container-fluid">
    <div class="navbar-header">
      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar-collapse-1" 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 class="navbar-brand" href="/">Allan Lab @ Leiden University</a>
    </div>
    <div class="collapse navbar-collapse" id="navbar-collapse-1">
      <ul class="nav navbar-nav navbar-right">
        <li><a href="/">Home</a></li>
        <li><a href="/team">Team</a></li>
        <li><a href="/vacancies">Vacancies</a></li>
        <li><a href="/publications">Publications</a></li>
        <li><a href="/research">Research</a></li>
        <li><a href="/pictures">(Pics)</a></li>
      </ul>
    </div>
  </div>
</div>

这是CSS里面和导航栏有关的代码

/* Top navigation bar */


p.byline {
    text-align: center;
    font-size: 18px;
    line-height: 36px;
    margin-top: -24px;
    margin-bottom: 48px;
}


pubtit {
    font-weight: bold;
}

firstp {
}

.container-fluid {
  margin-right: auto;
  margin-left: auto;
  max-width: 1000px; /* or 950px */
}

麻烦各路大神指点指点！！谢谢！！

js的代码呢？需要js的代码。