"Number facts"
Bootstrap 3.3.0 Snippet by pksaravanan

<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 ----------> <div class="container dad" style="width: 100%; padding: 0;"> <div class="row" style="margin: 60px 0; text-align: center;"> <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12"> <p style="color: #fcfcfc; font-weight: 700; font-size: 36px; font-family: 'Karla', san-serif;">FUN FACTS<span style="font-size: 16px; font-family: 'Karla', san-serif;"><br/>LETS SEE OUR SOME HISTORY OF OURS</span></p> </div> </div> <div class="row" style="margin: 60px 0; text-align: center;"> <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12" style="text-align: center;"> <a class="fig"> 1347 <span style="font-size: 14px; font-family: 'Karla', san-serif;"><br/>COMPLETED PROJECTS</span> </a> </div> <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12" style="text-align: center;"> <a class="fig"> 2400 <span style="font-size: 14px; font-family: 'Karla', san-serif;"><br/>SATISFIED CLIENTS</span> </a> </div> <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12" style="text-align: center;"> <a class="fig"> 170 <span style="font-size: 14px; font-family: 'Karla', san-serif;"><br/>TOP WEB APPLICATIONS</span> </a> </div> <div class="col-lg-3 col-md-3 col-sm-12 col-xs-12" style="text-align: center;"> <a class="fig"> 69 <span style="font-size: 14px; font-family: 'Karla', san-serif;"><br/>MASTERED DEVELOPERS</span> </a> </div> </div> </div>
@import url(https://fonts.googleapis.com/css?family=Karla:400,700); .dad { background: url("https://bufiles.blob.core.windows.net/co3605/facts/facts.jpg") center center; } .fig { color: #fcfcfc; font-family: 'Karla', san-serif; font-weight: 400; font-size: 4em; text-align: center; border-radius: 30px; display: inline-block; padding: 15px; width: 250px; border-left: 1px solid #fcfcfc; border-right: 1px solid #fcfcfc; -webkit-transition: all 1s ease; transition: all 1s ease; } .fig:hover { border-radius: 0px; color: #333; background: #fcfcfc; cursor: pointer; text-decoration: none; }

Related: See More


Questions / Comments: