"border with animate"
Bootstrap 4.0.0 Snippet by muhamed122

<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js"></script> <script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container-fluid"> <div class="row"> <div class="col-md-12 backg"> <div class="col-md-4"> <div class="border"> <i class="fa fa-heart fa-5x icn_red wow pulse animated" data-wow-iteration="infinite" data-wow-duration="500ms" style="visibility: visible;-webkit-animation-duration: 500ms; -moz-animation-duration: 500ms; animation-duration: 500ms;-webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite;"></i> <h4>Founded In</h4> <h2>2013</h2> </div> </div> <div class="col-md-4"> <div class="border"> <i class="fa fa-heart fa-5x icn_blue wow shake animated" data-wow-iteration="infinite" data-wow-duration="1500ms" style="visibility: visible;-webkit-animation-duration: 1500ms; -moz-animation-duration: 1500ms; animation-duration: 1500ms;-webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite;"></i> <h4>Projects</h4> <h2>102</h2> </div> </div> <div class="col-md-4"> <div class="border"> <i class="fa fa-heart fa-5x icn_green wow bounce animated" data-wow-iteration="infinite" data-wow-duration="800ms" style="visibility: visible;-webkit-animation-duration: 800ms; -moz-animation-duration: 800ms; animation-duration: 800ms;-webkit-animation-iteration-count: infinite; -moz-animation-iteration-count: infinite; animation-iteration-count: infinite;"></i> <h4>Teams</h4> <h2>11</h2> </div> </div> </div> </div> </div>
.border { border-radius: 24px; background-color: #FFFFFF; box-shadow: 0 6px 30px 0 rgba(0,0,0,0.06); padding: 100px; text-align: center; margin-top: 54px; } .border h2 { color: #10426E; font-size: 39px; font-weight: 600; letter-spacing: 2px; line-height: 44px; text-align: center; } .border h4 { color: #10426E; font-size: 24px; font-weight: bold; letter-spacing: 1px; line-height: 29px; } .col-md-12.backg { background: #FCFCFC; padding: 0px 89px; height: 497px; } i.fa.fa-heart.fa-5x.icn_red.wow.pulse.animated { color: #FF3D6A; } i.fa.fa-heart.fa-5x.icn_blue.wow.shake.animated { color: #337ab7; }

Related: See More


Questions / Comments: