JSFiddle - React, Tailwind, and code Playground
by Joe Cisneros
HTML
<script src="http://netdna.bootstrapcdn.com/bootstrap/3.0.2/js/bootstrap.min.js"></script>
<section id="Home">
<div class="nav-header">
<nav class="navbar navbar-inverse navbar-fixed-top" role="navigation">
<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="#Guidelines">Bakersfield <span>Photos</span></a>
</div>
<div id="navbar" class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-right">
<li><a href="#Guidelines">Guidelines</a></li>
<li><a href="#SubmitPhotos">Submit Photos</a></li>
<li><a href="#FAQ">FAQ</a></li>
</ul>
</div>
</div>
</nav>
</div>
</section>
<section id="Guidelines">
<div class="container">
<h1 class="page-header" data-scroll-reveal=" over 0.3s enter top ease-in-out 400px over 0.33s">Photo Submission Guidelines</h1>
<h2>When submitting a photo you are affirming:</h2>
<div class="content">
<ul>
<li>You are the photographer and copyright holder of the submitted image</li>
<li>You grant the City of Bakersfield permission to use the submitted image in any of its online and print marketing materials.</li>
<li>Submit only photos that were taken in Bakersfield. Please explain the...
CSS
@import url('http://getbootstrap.com/dist/css/bootstrap.css');