<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="container">
<div class="row">
<div class="col-sm-4 col-lg-4">
<!--<div class="jumbotron jumbotron-sm">-->
<div class="container">
<div class="row">
<div class="col-md-9 col-sm-12">
<h3 class="h3"><strong> Contact us </strong></h3>
<hr class="colorgraph colorgraph-footer"><br><br>
</div>
</div>
<div class="row">
<div class="col-md-6 col-sm-12">
<!--<div class="well well-sm">-->
<form>
<h4><strong>Send Us a Message </strong><span class="glyphicon glyphicon-comment"></span></h4>
<!--<hr class="colorgraph colorgraph">--><hr>
<div class="row">
<div class="col-md-6 col-sm-12">
<div class="form-group">
<label for="name">Name</label>
<input type="text" class="form-control" id="name" placeholder="Enter name" required="required" />
</div>
<div class="form-group">
<label for="email">Email Address</label>
<div class="input-group">
<span class="input-group-addon">
<span class="glyphicon glyphicon-envelope"></span>
</span>
<input type="email" class="form-control" id="email" placeholder="Enter email" required="required" />
</div>
</div>
<div class="form-group">
<label for="subject">Subject</label>
<select id="subject" name="subject" class="form-control" required="required">
<option value="na" selected="">Choose One:</option>
<option value="service">Doubts</option>
<option value="suggestions">Suggestions</option>
<option value="product">Other</option>
</select>
</div>
</div>
<div class="col-md-6 col-sm-12">
<div class="form-group">
<label for="name">Message</label>
<textarea name="message" id="message" class="form-control" rows="9" cols="25" required="required"placeholder="Message"></textarea>
</div>
<div class="form-group">
<button type="submit" class="btn btn-primary" id="btnContactUs">Send Message</button>
</div>
</div>
<!--<div class="col-md-12">
<button type="submit" class="btn btn-primary" id="btnContactUs">
Send Message</button>
</div>-->
</div>
</form>
<!--</div>-->
</div>
<div class="col-md-3 col-sm-12">
<form>
<h4><span class="glyphicon glyphicon-home"></span><strong> Reach Out to Us</strong></h4>
<!--<hr class="colorgraph">--><hr>
<address>
<span class="glyphicon glyphicon-phone"></span> 9477522691, 9475484561
</address>
<address>
<span class="glyphicon glyphicon-envelope"></span>
<a href="mailto:#">contact@xeqt.in</a>
</address>
</form>
</div>
<!--</div>-->
</div>
</div>
</div>
</div>
</div>
.jumbotron {
background: #fff;
color: #000;
border-radius: 0px;
}
.jumbotron-sm { padding-top: 24px;
padding-bottom: 24px; }
.jumbotron small {
color: #000;
}
.h3 small {
font-size: 20px;
}
/* Colorgraph divider */
.colorgraph {
height: 5px;
border-top: 0;
background: #c4e17f;
border-radius: 5px;
background-image: -webkit-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
background-image: -moz-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
background-image: -o-linear-gradient(left, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
background-image: linear-gradient(to right, #c4e17f, #c4e17f 12.5%, #f7fdca 12.5%, #f7fdca 25%, #fecf71 25%, #fecf71 37.5%, #f0776c 37.5%, #f0776c 50%, #db9dbe 50%, #db9dbe 62.5%, #c49cde 62.5%, #c49cde 75%, #669ae1 75%, #669ae1 87.5%, #62c2e4 87.5%, #62c2e4);
}
.colorgraph-header {
position: absolute;
top: 0;
margin: 0;
width: 100%;
height: 3px;
z-index: 100;
}
.colorgraph-footer {
position: static;
bottom: 0;
margin: 0;
width: 100%;
height: 5px;
z-index: 100;
}
