JSFiddle - React, Tailwind, and code Playground

by Tan

HTML

<blockquote class="double">
"A woodhacker is a person who cuts or gathers wood, especially for fuel. The noun 'woodhacker' was first used in the mid-1500s."
</blockquote>

<div class="splashTxt">
Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Duis sit amet tempus libero. Vestibulum quis purus luctus, interdum lacus eget, imperdiet metus. Vestibulum venenatis venenatis ipsum ac tincidunt. Nunc a vehicula nisi. Pellentesque eget purus sit amet dolor tempor interdum vel at est. Integer fringilla turpis eros, vel pellentesque eros mollis ac. Nam hendrerit et mauris non porttitor.
</div>

CSS

* {box-sizing: border-box;}
html {font-size: 62.5%;font-family: Arial;}
body {margin:0;}

blockquote.double {font-family:Georgia, serif;max-width:600px;margin:8rem auto;text-align:center;font-size:2.4rem;color:var(--c4);line-height:3rem;padding:0 2rem;}

.splashTxt {max-width:800px;margin:auto;text-align:center;font-size:1.6rem;color:#222222;line-height:2.4rem;padding:0 2rem;}

@media (max-width: 480px) {
 
blockquote.double {margin:4rem auto;font-size:2rem;line-height:2.8rem;}

}