Brecha entre nav y jumbotron en bootstrap

Por mi vida no puedo determinar de dónde viene el espacio en blanco entre mi navegador y jumbotron, he jugado con tantas variables, pero no logro que desaparezca. Hice un cssdeck aquí http://cssdeck.com/labs/u6ws0ozl y mi código está debajo (código de Bootstrap omitido).

HTML:

    Untitled Document       

Find a place to stay.

Rent from people in over 34,000 cities and 192 countries.

Learn More

CSS:

 @charset "UTF-8"; /* CSS Document */ .navbar { background-color: #2c3e50; } .nav-pills { padding-top: 20px; padding-bottom: 20px; padding-right: 15px; padding-left: 15px; /*background-color: #2c3e50;*/ /*background-color: #2ecc71;*/ } .nav > li > a:hover, .nav > li > a:focus { text-decoration: none; background-color: #2ecc71; } .nav-pills > li.active > a, .nav-pills > li.active > a:hover, .nav-pills > li.active > a:focus { color: #fff; background-color: #2ecc71; } .navbar-custom { padding-top: 20px; } .nav a { color: #fff; font-size: 18px; font-weight: bold; font-family: 'Shift', sans-serif; /*padding: 14px 14px;*/ text-transform: uppercase; } .nav li { display: inline; } .jumbotron { background-image:url('http://goo.gl/04j7Nn'); height: 500px; } .jumbotron .container { margin-top: 0px; position: relative; top:100px; } .jumbotron h1 { color: #fff; font-size: 48px; font-family: 'Shift', sans-serif; font-weight: bold; } .jumbotron p { font-size: 20px; color: #fff; } .learn-more { background-color: #f7f7f7; } .learn-more h3 { font-family: 'Shift', sans-serif; font-size: 18px; font-weight: bold; } .learn-more a { color: #00b0ff; } .neighborhood-guides { background-color: #efefef; border-bottom: 1px solid #dbdbdb; } .neighborhood-guides h2 { color: #393c3d; font-size: 24px; } .neighborhood-guides p { font-size: 15px; margin-bottom: 13px; } 

Elimine lo siguiente de css / bootstrap.css

 .navbar{ margin-bottom: 20px; } 

O también puede anularlo agregando margin:0; a su propio archivo css:

 .navbar { background-color: #2c3e50; margin:0; /*add this*/ } 

Demo en vivo

Tienes que eliminar

 .jumbotron{ margin-bottom:20px; } 

si su diseño es:
jumbotron
(Brecha)
navbar
Entonces eliminar el margen .navbar solo no logrará el efecto deseado, ya que .jumbotron tiene margen inferior: 20px;