<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.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="big-title">
<h3 class="big_title">About Us</h3>
<p class="title-para">Find Your Dream Home</p>
</div>
<div class="big-title2">
<h3 class="big_title2">ABOUT US</h3>
<p class="title-para2">Find Your Dream Home</p>
</div>
<div class="big-title3 text-center">
<h3 class="big_title3">Welcome To Our Tournament!</h3>
<p class="title-para3">Fresh and Local Delivered</p>
</div>
<div class="big-title4 text-left">
<h3 class="big_title4">Subscribe to Newsletter</h3>
<p class="title-para4">Donec porta lacus vitae urna placerat, vitae dapibus nulla eleifend. Donec aliquam neque quis felis viverra pulvinar. Aliquam erat volutpat. Nam enim metus, faucibus non porttitor id, laoreet quis sapien.</p>
</div>
<div class="row text-center">
<span class="glyphicon glyphicon-user icon"></span>
<h3 class="big-title5">About US</h3>
</div>
<div class="row">
<h3 class="big-title6">About Us</h3>
<p class="title-para6 text-center">Duis turpis arcu, dictum eu tincidunt id, congue vel urna. Quisque posuere, ipsum eu faucibus cursus, ex tortor elementum leo, eget varius lorem quam a nisl. Mauris ut enim sed tortor auctor luctus at vitae est.</p>
</div>
/*!
TITLE TEXT 1
*/
.big-title {
margin-bottom: 3em;
}
h3.big_title {
font-size: 2em;
color: #212121;
text-transform: uppercase;
position: relative;
text-align: center;
font-weight: 700;
}
p.title-para {
text-align: center;
font-size: 0.9em;
color: #585857;
letter-spacing: 8px;
}
h3.big_title:after {
content: '';
background: #0066b2;
height: 4px;
width: 7%;
position: absolute;
top: 46%;
left: 36%;
}
/*!
TITLE TEXT 2
*/
.big-title2 {
margin-bottom: 3em;
}
h3.big_title2 {
font-size: 2em;
color: #212121;
text-transform: uppercase;
position: relative;
text-align: center;
font-weight: 700;
}
p.title-para2 {
text-align: center;
font-size: 0.9em;
color: #585857;
letter-spacing: 8px;
}
h3.big_title2:after {
content: '';
background: #f23232;
height: 4px;
width: 7%;
position: absolute;
top: 46%;
left: 56%;
}
/*!
TITLE TEXT 3
*/
.big-title3 {
margin-bottom: 3em;
}
h3.big_title3 {
color: #212121;
font-size: 3.5em;
font-weight: 700;
margin: 0 auto;
text-shadow: 2px 2px 2px rgba(179, 171, 171, 0.8);
-webkit-text-shadow: 2px 2px 2px rgba(179, 171, 171, 0.8);
-moz-text-shadow: 2px 2px 2px rgba(179, 171, 171, 0.8);
-o-text-shadow: 2px 2px 2px rgba(179, 171, 171, 0.8);
-ms-text-shadow: 2px 2px 2px rgba(179, 171, 171, 0.8);
letter-spacing: 1px;
position: relative;
}
p.title-para3 {
color: #34bf49;
display: block;
margin: .5em 0 1em;
letter-spacing: 6px;
font-size: 0.9em;
}
h3.big_title3:after {
content: '';
background: #f23232;
height: 4px;
width: 27%;
position: absolute;
top: 160%;
left: 36%;
}
/*!
TITLE TEXT 4
*/
.big-title4 {
margin-bottom: 3em;
}
h3.big_title4 {
font-size: 40px;
color: #fab001;
padding-bottom: 0em;
font-weight: 600;
}
p.title-para4 {
line-height: 20px;
margin: 2em 0 0;
color: #777;
}
/*!
TITLE TEXT 5
*/
.icon {
font-size :60px;
padding-top : 5px;
color:#39a50b;
}
.big-title5 {
font-size: 3em;
color: #212121;
text-align: center;
text-transform: capitalize;
font-weight: 700;
letter-spacing: 1px;
position: relative;
}
/*!
TITLE TEXT 6
*/
.big-title6 {
text-align: center;
font-size: 40px;
margin-bottom: 60px;
color: #000;
font-weight: 600;
text-transform: capitalize;
letter-spacing: 2px;
position: relative;
}
p.title-para6 {
color: #999;
line-height: 1.8em;
margin-top: 2em;
font-size: 15px;
}
h3.big-title6:before, h2.big-title6:before {
content: '';
background: #ccc;
height: 2px;
width: 13%;
position: absolute;
bottom: -25%;
left: 43%;
}
h3.big-title6:after, h2.big-title6:after {
content: '';
background: #03A9F4;
height: 5px;
width: 4%;
position: absolute;
bottom: -12px;
left: 645px;
}
