<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.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 ---------->
<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.2.0/css/font-awesome.min.css" rel="stylesheet">
<!-- Footer 1 - Left Social/Right Menu -->
<div class="search-text">
<div class="container">
<div class="row text-center">
<div class="form">
<form id="search-form" class="form-search form-horizontal">
<input type="text" class="input-search" placeholder="Search">
<button type="submit" class="btn-search">Search</button>
</form>
</div>
</div>
</div>
</div>
<footer>
<div class="container">
<div class="row text-center">
<div class="col-md-6 col-sm-6 col-xs-12">
<ul class="list-inline">
<li>
<a href="#"><i class="fa fa-facebook fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-dropbox fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-flickr fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-github fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-linkedin fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-tumblr fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-google-plus fa-2x"></i></a>
</li>
</ul>
</div>
<div class="col-md-6 col-sm-6 col-xs-12">
<ul class="menu list-inline">
<li>
<a href="#">Home</a>
</li>
<li>
<a href="#">About</a>
</li>
<li>
<a href="#">Blog</a>
</li>
<li>
<a href="#">Gallery </a>
</li>
<li>
<a href="#">Contact</a>
</li>
</ul>
</div>
</div>
</div>
</footer>
<div class="copyright">
<div class="container">
<div class="row text-center">
<p>Copyright © 2017 All rights reserved</p>
</div>
</div>
</div>
<!-- End -->
<br><br><br><br><br><br>
<!-- Footer 2 - Right Social/Left Menu -->
<div class="search-text">
<div class="container">
<div class="row text-center">
<div class="form">
<form id="search-form" class="form-search form-horizontal">
<input type="text" class="input-search" placeholder="Search">
<button type="submit" class="btn-search">Search</button>
</form>
</div>
</div>
</div>
</div>
<footer>
<div class="container">
<div class="row text-center">
<div class="col-md-6 col-sm-6 col-xs-12">
<ul class="menu list-inline">
<li>
<a href="#">Home</a>
</li>
<li>
<a href="#">About</a>
</li>
<li>
<a href="#">Blog</a>
</li>
<li>
<a href="#">Gallery</a>
</li>
<li>
<a href="#">Contact</a>
</li>
</ul>
</div>
<div class="col-md-6 col-sm-6 col-xs-12">
<ul class="list-inline">
<li>
<a href="#"><i class="fa fa-facebook fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-dropbox fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-flickr fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-github fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-linkedin fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-tumblr fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-google-plus fa-2x"></i></a>
</li>
</ul>
</div>
</div>
</div>
</footer>
<div class="copyright">
<div class="container">
<div class="row text-center">
<p>Copyright © 2017 All rights reserved</p>
</div>
</div>
</div>
<!-- End -->
<br><br><br><br><br><br>
<!-- Footer 3 -->
<div class="search-text">
<div class="container">
<div class="row text-center">
<div class="form">
<form id="search-form" class="form-search form-horizontal">
<input type="text" class="input-search" placeholder="Search">
<button type="submit" class="btn-search">Search</button>
</form>
</div>
</div>
</div>
</div>
<footer>
<div class="container">
<div class="row text-center">
<ul class="list-inline">
<li>
<a href="#"><i class="fa fa-facebook fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-dropbox fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-flickr fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-github fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-linkedin fa-2x"></i></a>
</li>
<li>
<a href="#"><i class="fa fa-tumblr fa-2x"></i></a>
</li>
</ul>
</div>
<div class="row text-center">
<ul class="menu list-inline">
<li>
<a href="#">Home</a>
</li>
<li>
<a href="#">About</a>
</li>
<li>
<a href="#">Blog</a>
</li>
<li>
<a href="#">Gallery</a>
</li>
<li>
<a href="#">Contact</a>
</li>
</ul>
</div>
</div>
</footer>
<div class="copyright">
<div class="container">
<div class="row text-center">
<p>Copyright © 2017 All rights reserved</p>
</div>
</div>
</div>
<!-- End -->
@import url('https://fonts.googleapis.com/css?family=Roboto:100,300,400,500,700,900');
body{
font-family: 'Roboto', sans-serif;
}
.search-text{
margin-top:50px;
background-color:#7dabdb;
padding-top:60px;
padding-bottom:60px;
}
.search-text .input-search{
height:45px;
width:400px;
padding-left:20px;
color:#333;
}
.search-text .btn-search{
background-color:#7dabdb;
border:1px solid #FFF;
color:#FFF;
padding: 11px 22px;
}
.search-text .btn-search:hover{
background-color:#FFF;
color:#7dabdb;
}
.copyright{
background-color:#f0f0f0;
}
.copyright p{
margin:15px 0px;
}
footer{
background-color:#222222;
padding: 60px 0px;
}
footer .menu li a{
color:#b1aca1;
padding:10px;
text-decoration:none;
}
footer .menu li a:hover{
color:#7dabdb;
}
.fa.fa-facebook , .fa.fa-dropbox, .fa.fa-flickr , .fa.fa-github , .fa.fa-linkedin ,.fa,fa-tumblr ,.fa.fa-google-plus , .fa.fa-tumblr {
color:#b1aca1;
font-size:20px;
padding:10px;
}
.fa.fa-facebook:hover , .fa.fa-dropbox:hover , .fa.fa-flickr:hover , .fa.fa-github:hover , .fa.fa-linkedin:hover ,.fa,fa-tumblr:hover ,.fa.fa-google-plus:hover , .fa.fa-tumblr:hover {
color:#6794c2;
}
