<link href="//cdnjs.cloudflare.com/ajax/libs/materialize/0.98.2/css/materialize.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//cdnjs.cloudflare.com/ajax/libs/materialize/0.98.2/js/materialize.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='text-align: center'>
<div id="inTurnBlurringTextG">
<div id="inTurnBlurringTextG_1" class="inTurnBlurringTextG">L</div>
<div id="inTurnBlurringTextG_2" class="inTurnBlurringTextG">o</div>
<div id="inTurnBlurringTextG_3" class="inTurnBlurringTextG">a</div>
<div id="inTurnBlurringTextG_4" class="inTurnBlurringTextG">d</div>
<div id="inTurnBlurringTextG_5" class="inTurnBlurringTextG">i</div>
<div id="inTurnBlurringTextG_6" class="inTurnBlurringTextG">n</div>
<div id="inTurnBlurringTextG_7" class="inTurnBlurringTextG">g</div>
</div>
</div>
</div>
#inTurnBlurringTextG{
width:100%;
margin-left:25%;
}
.inTurnBlurringTextG{
color:transparent;
font-family:Arial;
font-size:100px;
text-decoration:none;
font-weight:normal;
font-style:normal;
float:left;
text-shadow: rgb(0,0,0) 0 0 0;
animation-name:bounce_inTurnBlurringTextG;
-o-animation-name:bounce_inTurnBlurringTextG;
-ms-animation-name:bounce_inTurnBlurringTextG;
-webkit-animation-name:bounce_inTurnBlurringTextG;
-moz-animation-name:bounce_inTurnBlurringTextG;
animation-duration:2.09s;
-o-animation-duration:2.09s;
-ms-animation-duration:2.09s;
-webkit-animation-duration:2.09s;
-moz-animation-duration:2.09s;
animation-iteration-count:infinite;
-o-animation-iteration-count:infinite;
-ms-animation-iteration-count:infinite;
-webkit-animation-iteration-count:infinite;
-moz-animation-iteration-count:infinite;
animation-direction:normal;
-o-animation-direction:normal;
-ms-animation-direction:normal;
-webkit-animation-direction:normal;
-moz-animation-direction:normal;
}
#inTurnBlurringTextG_1{
animation-delay:0.75s;
-o-animation-delay:0.75s;
-ms-animation-delay:0.75s;
-webkit-animation-delay:0.75s;
-moz-animation-delay:0.75s;
}
#inTurnBlurringTextG_2{
animation-delay:0.9s;
-o-animation-delay:0.9s;
-ms-animation-delay:0.9s;
-webkit-animation-delay:0.9s;
-moz-animation-delay:0.9s;
}
#inTurnBlurringTextG_3{
animation-delay:1.05s;
-o-animation-delay:1.05s;
-ms-animation-delay:1.05s;
-webkit-animation-delay:1.05s;
-moz-animation-delay:1.05s;
}
#inTurnBlurringTextG_4{
animation-delay:1.2s;
-o-animation-delay:1.2s;
-ms-animation-delay:1.2s;
-webkit-animation-delay:1.2s;
-moz-animation-delay:1.2s;
}
#inTurnBlurringTextG_5{
animation-delay:1.35s;
-o-animation-delay:1.35s;
-ms-animation-delay:1.35s;
-webkit-animation-delay:1.35s;
-moz-animation-delay:1.35s;
}
#inTurnBlurringTextG_6{
animation-delay:1.5s;
-o-animation-delay:1.5s;
-ms-animation-delay:1.5s;
-webkit-animation-delay:1.5s;
-moz-animation-delay:1.5s;
}
#inTurnBlurringTextG_7{
animation-delay:1.64s;
-o-animation-delay:1.64s;
-ms-animation-delay:1.64s;
-webkit-animation-delay:1.64s;
-moz-animation-delay:1.64s;
}
#inTurnBlurringTextG_8{
animation-delay:1.79s;
-o-animation-delay:1.79s;
-ms-animation-delay:1.79s;
-webkit-animation-delay:1.79s;
-moz-animation-delay:1.79s;
}
@keyframes bounce_inTurnBlurringTextG{
0%{
text-shadow: rgb(196,28,50) 0 0 0;
}
100%{
text-shadow: rgb(34,161,155) 0 0 88px;
}
}
@-o-keyframes bounce_inTurnBlurringTextG{
0%{
text-shadow: rgb(196,28,50) 0 0 0;
}
100%{
text-shadow: rgb(34,161,155) 0 0 88px;
}
}
@-ms-keyframes bounce_inTurnBlurringTextG{
0%{
text-shadow: rgb(196,28,50) 0 0 0;
}
100%{
text-shadow: rgb(34,161,155) 0 0 88px;
}
}
@-webkit-keyframes bounce_inTurnBlurringTextG{
0%{
text-shadow: rgb(196,28,50) 0 0 0;
}
100%{
text-shadow: rgb(34,161,155) 0 0 88px;
}
}
@-moz-keyframes bounce_inTurnBlurringTextG{
0%{
text-shadow: rgb(196,28,50) 0 0 0;
}
100%{
text-shadow: rgb(34,161,155) 0 0 88px;
}
}
