Hi, the spy-scroll isn`t working properly: the home link keeps highlighted all time and schedule link doesn`t work.

<!-- Bootstrap CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/css/bootstrap.min.css" integrity="sha384-rwoIResjU2yc3z8GV/NPeZWAv56rSmLldC3R/AZzGRnGxQQKnKkoFVhFQhNUwEyJ" crossorigin="anonymous">

<!-- navbar -->
<nav class="navbar fixed-top navbar-toggleable-md navbar-inverse bg-primary">
    <div class="container">  
  <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>

  <div class="collapse navbar-collapse" id="navbarNav">
    <ul class="navbar-nav mr-auto">
      <li class="nav-item active">
        <a class="nav-link" href="#home">Home <span class="sr-only">(current)</span></a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#about">About</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#speakers">Speakers</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="schedule">Schedule</a>
      </li>
    </ul>
  </div>
  <a class="navbar-brand ml-lg-auto mr-0 hidden-xs-down" href="http://www.teamtreehouse.com">Presented by Treehouse</a>
  </div>
</nav>

<!-- jumbotron -->

<div class="jumbotron jumbotron-fluid bg-info text-white">
    <div class="container text-sm-center pt-5">

      <h1 class="display-2">Full Stack Conf</h1>
      <p class="lead">A One-day Conference about All Things JavaScript!</p>

      <div class="btn-group mt-2" role="group" aria-label="Basic example">
        <button type="button" class="btn btn-primary btn-lg" data-toggle="modal" data-target="#register">Register Now</button>
        <a class="btn btn-secondary btn-lg" href="#speakers">See Speakers</a>
      </div>

    </div>
</div>

<!-- /jumbotron -->


<div class="container pt-5">

<!-- about -->  

</div>
<div class="col-md-4 col-xl-3">
  <h3 class="mb-4">Expert Speakers</h3>
  <p>Our expert speaker lineup was just announced, so don't wait too long before grabbing your tickets!</p>
  <p>Want to meet the international JavaScript community and share skills with some of the world's top experts, hackers, and makers? Be the first to know what to expect for the future of JavaScript.</p>
  <p>Full Stack Conf is committed to being inclusive and welcoming for everyone. We look forward to another intensive day of learning and sharing.</p>

</div>
<div class="col-md-4 col-xl-3">
  <h3 class="mb-4">What You'll Learn</h3>
    <div class="list-group">
      <a href="#" class="list-group-item"><strong>MongoDB</strong>: NoSQL database</a>
      <a href="#" class="list-group-item"><strong>Angular</strong>: JavaScript framework </a>
      <a href="#" class="list-group-item"><strong>Express</strong>: Framework for Node</a>
      <a href="#" class="list-group-item"><strong>Node.js</strong>: JavaScript environment</a>
      <a href="#" class="list-group-item"><strong>ES2015</strong>: Latest version of JavaScript</a>
      <a href="#" class="list-group-item"><strong>Babel</strong>: JavaScript compiler</a>
    </div>
</div>

    <!-- speakers -->
    <h1 id="speakers" class="display-4 text-center my-5 text-muted">Speakers</h1>

<div class="col-md-6 col-lg-4">
  <div class="card mb-3">
    <img class="card-img-top img-fluid" src="images/nodestradamus.png" alt="Card image cap">
    <div class="card-block">
      <h4 class="card-title">NodeStradamus</h4>
      <p class="card-text">NodeStra" is a software engineer and philosopher trying to leave the world better than he found it. He codes for non-profits, eCommerce, and large-scale web apps. </p>
      <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
    </div>
  </div>
</div>

<div class="col-md-6 col-lg-4">
  <div class="card mb-3">
    <img class="card-img-top img-fluid" src="images/geo.png" alt="Card image cap">
    <div class="card-block">
      <h4 class="card-title">Geo "Lo" Cation</h4>
      <p class="card-text">Geo is a JavaScript developer working on large-scale applications. He's also a teacher who strives to support students in removing all barriers to learning code and rock. </p>
      <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
    </div>
  </div>
</div>

<div class="col-md-6 col-lg-4">
  <div class="card mb-3">
    <img class="card-img-top img-fluid" src="images/ecma.png" alt="Card image cap">
    <div class="card-block">
      <h4 class="card-title">Ecma Scriptnstuff</h4>
      <p class="card-text">Ecma found her passion for computers and programming over 15 years ago. She is excited to introduce people to the wonderful world of JavaScript. </p>
      <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
    </div>
  </div>
</div>

<div class="col-md-6 col-lg-4">
  <div class="card mb-3">
    <img class="card-img-top img-fluid" src="images/jay.png" alt="Card image cap">
    <div class="card-block">
      <h4 class="card-title">Jay Query</h4>
      <p class="card-text">Jay is a developer, author of CSS: The Missing Manual, JavaScript &amp; jQuery: The Missing Manual, and web development teacher. </p>
      <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
    </div>
  </div>
</div>

<div class="col-md-6 col-lg-4">
  <div class="card mb-3">
    <img class="card-img-top img-fluid" src="images/json.png" alt="Card image cap">
    <div class="card-block">
      <h4 class="card-title">Json Babel</h4>
      <p class="card-text">All of his professional life, Json has worked with computers online; he is a polyglot programmer and likes using the right tools for the job. </p>
      <p class="card-text"><small class="text-muted">Last updated 3 mins ago</small></p>
    </div>
  </div>
</div>

    <!-- schedule -->
<ul id="schedule" class="list-group" id="schedule">
  <li class="list-group-item list-group-item-action flex-column align-items-start">
    <div class="d-flex w-100 justify-content-between">
      <h5 class="mb-1">Keynote: Internet of Things</h5>
      <span class="badge badge-default badge-pill bg-info px-2 py-2 mt-2">9:00am</span>
    </div>
    <p class="mb-1">NodeStradamus</p>
  </li>
  <li class="list-group-item list-group-item-action flex-column align-items-start">
    <div class="d-flex w-100 justify-content-between">
      <h5 class="mb-1">Angular Basics</h5>
      <span class="badge badge-default badge-pill bg-info px-2 py-2 mt-2">10:00am</span>
    </div>
    <p class="mb-1">Angela McAngular</p>
  </li>
  <li class="list-group-item list-group-item-action flex-column align-items-start">
    <div class="d-flex w-100 justify-content-between">
      <h5 class="mb-1">Hey, Mongo!</h5>
      <span class="badge badge-default badge-pill bg-info px-2 py-2 mt-2">11:00am</span>
    </div>
    <p class="mb-1">Jay Query</p>
  </li>
  <li class="list-group-item list-group-item-action list-group-item-success flex-column align-items-start">
    <div class="d-flex w-100 justify-content-between">
      <h5 class="mb-1">Lunch</h5>
      <span class="badge badge-default badge-pill bg-info px-2 py-2 mt-2">12:00pm</span>
    </div>
    <p class="mb-1">Free pizza for everyone.</p>
  </li>
   <li class="list-group-item list-group-item-action flex-column align-items-start">
    <div class="d-flex w-100 justify-content-between">
      <h5 class="mb-1">Introducing ES2015</h5>
      <span class="badge badge-default badge-pill bg-info px-2 py-2 mt-2">1:00pm</span>
    </div>
    <p class="mb-1">Ecma Scriptnstuff</p>
  </li>
  <li class="list-group-item list-group-item-action flex-column align-items-start">
    <div class="d-flex w-100 justify-content-between">
      <h5 class="mb-1">Gettin' MEAN</h5>
      <span class="badge badge-default badge-pill bg-info px-2 py-2 mt-2">2:00pm</span>
    </div>
    <p class="mb-1">Geo "Lo" Cation</p>
  </li>
  <li class="list-group-item list-group-item-action flex-column align-items-start">
    <div class="d-flex w-100 justify-content-between">
      <h5 class="mb-1">What's Babel? </h5>
      <span class="badge badge-default badge-pill bg-info px-2 py-2 mt-2">3:00pm</span>
    </div>
    <p class="mb-1">Json Babel</p>
  </li>
</ul>
<!-- /schedule -->

    <!-- callout button -->
    <button type="button" class="btn btn-outline-info btn-lg d-block mx-auto my-5" data-toggle="modal" data-target="#register">Don`t Miss Out, Register Now</button>
    <!-- /callout button -->


      <!-- signup form -->
    <hr>
    <div class="row py-4 text-muted">
      <div class="col-md-6">
        <p><strong>About Treehouse</strong></p>
        <p>Treehouse brings affordable technology education to people everywhere to help them achieve their dreams and change the world.</p>
      </div>
      <div class="col-md-6">
        <p><strong>Stay up-to-date on Full Stack Conf</strong></p>
        <div class="input-group">
          <input type="text" class="form-control" placeholder="Email">
          <span class="input-group-btn">
            <button class="btn btn-primary" type="button">Sign up</button>
          </span>
        </div>
      </div>
    </div>
    <hr>
    <!-- /signup form -->

  <!-- footer -->

    <div class="row py-3">
    <div class="col-md-7">
      <ul class="nav">
          <li class="nav-item">
            <a class="nav-link active" href="#">Community</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#">Tracks</a>
          </li>
          <li class="nav-item">
            <a class="nav-link" href="#">Link</a>
          </li>
      </ul>
    </div>
    <div class="col-md-5 text-md-right">
      <small>&copy; 2016 Full Stack Conf &amp; Treehouse</small>
    </div>
    </div>
  <!-- /footer -->

</div>
<!-- /.container -->

<!--==========

FORM MODAL

======-->

  <div id="register" class="modal fade">
      <div class="modal-dialog" role="document">
        <div class="modal-content">
          <div class="modal-header">
            <h5 class="modal-title">Register for Full Stack Conf </h5>
            <button type="button" class="close" data-dismiss="modal" aria-label="Close">
              <span aria-hidden="true">&times;</span>
            </button>
          </div>
          <div class="modal-body">
            <p>Form goes here.</p>
          </div>
          <div class="modal-footer">
            <button type="button" class="btn btn-primary">Save changes</button>
            <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
          </div>
        </div>
      </div>
</div>

<!-- jQuery first, then Tether, then Bootstrap JS. -->
<script src="https://code.jquery.com/jquery-3.1.1.slim.min.js" integrity="sha384-A7FZj7v+d/sdmMqp/nOQwliLvUsJfDHW+k9Omg/a/EheAdgtzNs3hpfag6Ed950n" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tether/1.4.0/js/tether.min.js" integrity="sha384-DztdAPBWPRXSA/3eYEEUWrWCy7G5KFbe8fFjk5JAIxUYHKkDx6Qin1DkWx51bBrb" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.6/js/bootstrap.min.js" integrity="sha384-vBWWzlZJ8ea9aCX4pEW3rVHjgjt7zpkNpZk+02D9phzyeVkE+jo0ieGizqPLForn" crossorigin="anonymous"></script>