<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.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 ----------> <blockquote> <h1 class="gradient-text">If you want to go quickly, go alone. If you want to go far, go together.</h1> <p><cite>– Probably Not Really An African Proverb</cite></p> </blockquote>

@import "https://fonts.googleapis.com/css?family=Kaushan+Script"; .gradient-text { position: relative; text-shadow: .15em .15em .35em #888; padding: .5em; } .gradient-text::after { content: ''; position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: -webkit-radial-gradient(70% 3%, circle, #aa048b, #bb9801); background: radial-gradient(circle at 70% 3%, #aa048b, #bb9801); mix-blend-mode: screen; } html { background: #fff; } body { font-size: 4vmax; text-align: center; background: #fff; color: #000; } blockquote { margin: 0; } h1 { font-family: 'Kaushan Script', sans-serif; letter-spacing: -.1ch; margin: 0; line-height: 1.3; } p { font-family: sans-serif; font-size: 1ch; opacity: .35; }