<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/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 ---------->
<link href="https://fonts.googleapis.com/css?family=Arimo" rel="stylesheet">
<div class="footer-top">
<div class="container">
<div class="footer-logo col-xs-12 text-center">
<h2 align="center" class="cssanimation leSnake sequence">Endlessness</h2>
</div>
<h3 align="center">Design by <a target="_blank" href="http://www.wedoodles.com/">Koshik ojha</h3>
</div>
</div>
body{margin:0;padding:0;}
.footer-top{
background-color: #0F3661;
padding: 75px 0;}
.footer-logo h2 {
color: #fff;
font-size: 50px;
margin: 0;
text-transform: uppercase;
text-align:center;
font-family: 'Arimo', sans-serif;
}
h3{color:#fff;padding-top:5%;font-family: 'Arimo', sans-serif;}
h3 a{text-decoration:none;color:#fff;font-weight:900}
h2{width:100%;text-align:center;}
.open,.wipe{
margin:0 auto;
overflow:hidden
}
.open,.typing,.wipe{
overflow:hidden
}
.cssanimation,.cssanimation span{
-webkit-animation-duration:1s;
animation-duration:1s;
-webkit-animation-fill-mode:both;
animation-fill-mode:both
}
.cssanimation span{
display:inline-block
}
.infinite{
-webkit-animation-iteration-count:infinite!important;
animation-iteration-count:infinite!important
}
.leSnake span{
-webkit-animation:leSnake 1.5s ease-in-out;
animation:leSnake 1.5s ease-in-out;
-webkit-animation-iteration-count:infinite;
animation-iteration-count:infinite
}
@-webkit-keyframes leSnake{
from,to{
-webkit-transform:translateY(0);
transform:translateY(0)
}
50%{
-webkit-transform:translateY(30px);
transform:translateY(30px)
}
}
@keyframes leSnake{
from,to{
-webkit-transform:translateY(0);
transform:translateY(0)
}
50%{
-webkit-transform:translateY(30px);
transform:translateY(30px)
}
}
function animateSequence(){for(var n=document.getElementsByClassName("sequence"),a=0;a<n.length;a++){var e=n[a],t=e.innerHTML;t=t.trim();var i="",m=100;for(l=0;l<t.length;l++)" "!=t[l]?(i+='<span style="animation-delay:'+m+"ms; -moz-animation-delay:"+m+"ms; -webkit-animation-delay:"+m+'ms; ">'+t[l]+"</span>",m+=150):i+=t[l];e.innerHTML=i}}function animateRandom(){for(var n=document.getElementsByClassName("random"),a=0;a<n.length;a++){var e=n[a],t=e.innerHTML;t=t.trim();var i=70,m=new Array,o=new Array;for(j=0;j<t.length;j++){for(;;){var r=getRandomInt(0,t.length-1);if(-1==m.indexOf(r))break}m[j]=r}for(l=0;l<m.length;l++){var s="",d=m[l];" "!=t[d]?(s='<span style="animation-delay:'+i+"ms; -moz-animation-delay:"+i+"ms; -webkit-animation-delay:"+i+'ms; ">'+t[d]+"</span>",o[d]=s):o[d]=t[d],i+=80}o=o.join(""),e.innerHTML=o}}function getRandomInt(n,a){return Math.floor(Math.random()*(a-n+1))+n}window.onload=function(){animateSequence(),animateRandom()};