Если на быструю руку, то например так:
.navbar {
margin-bottom: 0px;
float: none;
}
.navbar-nav > li > a {
text-transform: uppercase;
color: #000;
}
.nav > li > a:hover,
.nav > li > a:focus {
color: #77a407;
background: transparent;
}
.navbar-toggle .icon-bar {
background: #77a407;
}
.intro {
background: url(http://widefon.com/_ld/126/89465606.jpg) center no-repeat;
-webkit-background-size: cover;
background-size: cover;
position: relative;
min-height: 420px;
height: 100%;
padding-top: 2rem;
}
.intro.container-fluid {
padding-left: 0;
padding-right: 0px;
}
.title {
background: rgba(0,0,0,.52);
margin-bottom: 1rem;
}
.title h2 {
color: #fff;
margin: 2rem auto;
}
.box span,
.title span {
color: #77a407;
}
.btn-submit {
background: #77a407;
border: 1px solid #77a407;
color: #fff;
width: 17%;
}
.my-form {
background: rgba(4, 4, 4, 0.78);
padding: 2rem;
}
.my-form.form-inline .form-group input {
width: 100%;
}
.box {
padding: 3rem 3rem 3rem;
font-size: 2rem;
position: relative;
}
.box p {
position: relative;
z-index: 2;
color: #fff;
}
.box:after {
content: '';
top: 0;
left: 0rem;
right: 0rem;
bottom: 0;
position: absolute;
background: rgba(0,0,0,.52);
}
@media (min-width: 768px) {
.my-form.form-inline .form-group {
width: 25.75%;
margin-right: 1%;
}
}
@media (min-width: 992px) {
.box {
padding: 3rem 3rem 100px;
}
.box:after {
left: -3rem;
right: 3rem;
transform: skew(155deg);
}
.fix.container {
position: absolute;
bottom: 0;
left: 0;
right: 0;
}
}
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>JS Bin</title>
<script src="https://code.jquery.com/jquery-1.11.3.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/css/bootstrap.css" />
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/3.3.2/js/bootstrap.js"></script>
</head>
<body>
<div class="container">
<div class="row">
<div class="col-md-12">
<nav class="navbar">
<div class="navbar-header">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#myNavbar">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
</div>
<div class="collapse navbar-collapse" id="myNavbar">
<ul class="col-md-12 nav navbar-nav">
<li class="col-md-2 text-center active"><a href="#">Home</a></li>
<li class="col-md-2 text-center"> <a href="#">Page 1</a> </li>
<li class="col-md-2 text-center"><a href="#">Page 2</a></li>
<li class="col-md-2 text-center"><a href="#">Page 3</a></li>
<li class="col-md-2 text-center"><a href="#">Page 4</a></li>
<li class="col-md-2 text-center"><a href="#">Page 5</a></li>
</ul>
</div>
</nav>
</div>
</div>
</div>
<div class="container-fluid intro">
<div class="title text-center">
<div class="container">
<div class="row">
<div class="col-md-12">
<h2>Lorem ipsum dolor <span>sit amet</span>, consectetur adipisicing elit. <span>Placeat, aliquid.</span></h2>
</div>
</div>
</div>
</div>
<div class="container fix">
<div class="row">
<div class="col-md-6">
<div class="box">
<p>
Lorem ipsum dolor sit amet, <span>consectetur</span> adipisicing elit. Reiciendis ullam a ipsum autem ipsa commodi excepturi officiis <span>nobis maxime</span> quis.
</p>
</div>
</div>
</div>
</div>
<div class="container fix">
<div class="row">
<div class="col-md-12">
<form class="form-inline text-center my-form" role="form">
<div class="form-group">
<label class="sr-only" for="exampleInputEmail2">Email</label>
<input type="email" class="form-control" id="exampleInputEmail2" placeholder="Enter email">
</div>
<div class="form-group">
<label class="sr-only" for="exampleInputPassword2">Пароль</label>
<input type="password" class="form-control" id="exampleInputPassword2" placeholder="Password">
</div>
<div class="form-group">
<label class="sr-only" for="exampleInputText2">Text</label>
<input type="text" class="form-control" id="exampleInputText2" placeholder="Text input" >
</div>
<button type="submit" class="btn btn-default btn-submit">Войти</button>
</form>
</div>
</div>
</div>
</div>
</body>
</html>
ПРИМЕР НА JSBIN