<nav class="navbar navbar-default navbar-fixed-top">

<div class="container">

<!-- Brand and toggle get grouped for better mobile display -->

<div class="navbar-header page-scroll">

<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">

<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 page-scroll" href="#page-top">{{site.title}}</a>

</div>

<!-- Collect the nav links, forms, and other content for toggling -->

<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">

<ul class="nav navbar-nav navbar-right">

<li class="hidden">

<a href="#page-top"></a>

</li>

<li>

<a class="page-scroll" href="#services">Services</a>

</li>

<li>

<a class="page-scroll" href="#portfolio">Portfolio</a>

</li>

<li>

<a class="page-scroll" href="#about">About</a>

</li>

<li>

<a class="page-scroll" href="#team">Team</a>

</li>

<li>

<a class="page-scroll" href="#contact">Contact</a>

</li>

</ul>

</div>

<!-- /.navbar-collapse -->

</div>

<!-- /.container-fluid -->

</nav>

<!-- Header -->

<header>

<div class="container">

<div class="intro-text">

<div class="intro-lead-in">Welcome To Our Studio!</div>

<div class="intro-heading">It's Nice To Meet You</div>

<a href="#services" class="page-scroll btn btn-xl">Tell Me More</a>

</div>

</div>

</header>