<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.2.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<link href='http://fonts.googleapis.com/css?family=Oswald:700|Lobster|Pacifico|Armata|Josefin+Sans|Lobster|Shadows+Into+Light|Black+Ops+One' rel='stylesheet' type='text/css'>
<div class="row">
<div class="col-md-6">
<form>
<div class="row">
<div class="col-md-6"><h1>Please Login</h1></div>
<div class="col-md-6"><h2>Metro look login site</h1><br /></div>
</div>
<div class='input'>
<label for='username'><span class='glyphicon glyphicon-user'></span></label>
<input type='text' class='input' placeholder='Username' name='username'/><br />
</div>
<div class='input'>
<label for='username'><span class='glyphicon glyphicon-lock'></span></label>
<input type='password' class='input' placeholder='Password' /><br />
</div>
<input type="submit" class='button' value='Login' />
</form>
</div>
<div class="col-md-6">
<div class="css-shapes-preview">
<h1 class='headng'>PORTFOLIO</h1>
<p>A new login portfolio for website</p>
</div>
</div>