"h2"
Bootstrap 4.1.1 Snippet by jeevan123456

Post to Facebook Tweet this

<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 ----------> <body> <p> <span> HOW MUCH DO YOU RATE MOVIE? </span> </p> </body>
body { background: #090d00; color: rgba(255, 255, 255, 0.5); text-align: center; } p { border: 4px double rgba(255, 255, 255, 0.25); border-width: 4px 0; padding: 1.5em 0em; position: absolute; top: 18%; left: 50%; width: 40em; margin: 0 0 0 -20em; } span { text-transform: uppercase; font: 700 4em/1 "Oswald", sans-serif; padding: .25em 0 .325em; display: block; text-shadow: 0 0 80px rgba(255, 255, 255, 0.9); animation: bounce-top 2s infinite both; } @keyframes bounce-top { 0% { transform: translateY(-45px); animation-timing-function: ease-in; opacity: 1; } 24% { opacity: 1; } 40% { transform: translateY(-24px); animation-timing-function: ease-in; } 65% { transform: translateY(-12px); animation-timing-function: ease-in; } 82% { transform: translateY(-6px); animation-timing-function: ease-in; } 93% { transform: translateY(-4px); animation-timing-function: ease-in; } 25%, 55%, 75%, 87% { transform: translateY(0px); animation-timing-function: ease-out; } 100% { transform: translateY(0px); animation-timing-function: ease-out; opacity: 1; } }

Related: See More

Full Calendar

Questions / Comments: