<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"> <div class="row" style="margin: 240px 0 360px 0;"> <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12" style="text-align: center;"> <a href="/main/page/products" class="hvr-back-pulse" target="_blank">Products</a> </div> <div class="col-lg-6 col-md-6 col-sm-12 col-xs-12"> </div> </div> </div>

.container { background-image: url(https://bufiles.blob.core.windows.net/co3606/pr_bg/product_bg5.png); } @-webkit-keyframes hvr-back-pulse { 50% { background-color: rgba(181, 32, 37, 0.75); } } @keyframes hvr-back-pulse { 50% { background-color: rgba(181, 32, 37, 0.75); } } .hvr-back-pulse { display: inline-block; vertical-align: middle; -webkit-transform: translateZ(0); transform: translateZ(0); box-shadow: 0 0 1px rgba(0, 0, 0, 0); -webkit-backface-visibility: hidden; backface-visibility: hidden; -moz-osx-font-smoothing: grayscale; overflow: hidden; -webkit-transition-duration: 0.5s; transition-duration: 0.5s; -webkit-transition-property: color, background-color; transition-property: color, background-color; font-size: 24pt; color: #010101; border: 1px solid #010101; padding: 15px 60px; font-weight: 100; font-family: 'Raleway', san-serif; } .hvr-back-pulse:hover, .hvr-back-pulse:focus, .hvr-back-pulse:active { -webkit-animation-name: hvr-back-pulse; animation-name: hvr-back-pulse; -webkit-animation-duration: 1s; animation-duration: 1s; -webkit-animation-delay: 0.5s; animation-delay: 0.5s; -webkit-animation-timing-function: linear; animation-timing-function: linear; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; background-color: #B52025; background-color: #B52025; color: #fff; border: 1px solid #B52025; text-decoration: none; }