This is a flip effect for the text using CSS. The letters are separated with a tag in HTML, the CSS adds the effect along with the width, font, and animation. The cursive style of Cookie family matches this fill effect. The animation lasts for 2s and starts over again and goes forever (infinite). The effect is applied to each span element with animation-delay of 1sec each. To maintain the space between the two worlds, the 4th span (letter) is set with the margin to the right. The keyframe property set the animation and rotates each element by 1 turn. The media screen property sets the font size for different screen size. Overall the effect added is easy, with little understanding of CSS styling and animations you can have a perfect text effect for your website. Also, these animations are is not supported in Internet Explorer 9 and earlier versions.