index.html

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Map App for Beginners</title>
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
    <link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap-theme.min.css">
    <style>
      html {
        position: relative;
        min-height: 100%;
      }
      body { margin-bottom: 60px; }
      .footer {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: 60px;
        background-color: #f5f5f5;
      }
      body > .container {
        padding: 60px 15px 0;
      }
      .container .text-muted {
        margin: 20px 0;
      }
      .footer > .container {
        padding-right: 15px;
        padding-left: 15px;
      }
    </style>
    <!--[if lt IE 9]>
      <script src="//oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
      <script src="//oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
    <![endif]-->
  </head>
  <body>
    <nav class="navbar navbar-default navbar-fixed-top">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#navbar" aria-expanded="false" aria-controls="navbar">
            <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="#">Map App for Beginners</a>
        </div>
        <div id="navbar" class="collapse navbar-collapse">
          <ul class="nav navbar-nav">
            <li class="active"><a href="#">Home</a></li>
            <li><a href="cultural-fund-map/">Cultural Fund</a></li>
            <li><a href="philly-aging-out/">Philly Aging Out</a></li>
          </ul>
        </div><!--/.nav-collapse -->
      </div>
    </nav>

    <!-- Begin page content -->
    <div class="container">
      <div class="page-header">
        <h1>Welcome to the Map App for Beginners landing page!</h1>
      </div>
      <p class="lead">
        Please use the navigation bar above to explore our maps. One focuses on the distribution of
        Philadelphia Cultural Fund grant funds, which is the city government’s only mechanism for direct
        funding of arts and culture organizations. The other shows the impact of gentrification on
        Philadelphia’s elderly population.
      </p>
    </div>

    <footer class="footer">
      <div class="container">
        <p class="text-muted">Open Source Mentorship Program (OSMP) 2015 Map App for Beginners, by: Christina Deemer and Danae Mobley</p>
      </div>
    </footer>

    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
  </body>
</html>