JSFiddle - React, Tailwind, and code Playground
HTML
<h1 class="style1">
Welcome to traffordcraft.net, you're probably here for one of the following. Please select one!
</h1>
CSS
html {
background-color: #00006E;
-webkit-font-smoothing: antialiased;
}
body {
margin: 0 auto;
padding: 2em 2em 4em;
max-width: 800px;
font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 16px;
line-height: 1.5em;
color: #545454;
background-color: white;
-webkit-box-shadow: 0 0 2px rgba(0, 0, 0, 0.06);
-moz-box-shadow: 0 0 2px rgba(0, 0, 0, 0.06);
box-shadow: 0 0 2px rgba(0, 0, 0, 0.06);
}
h1, h2, h3, h4, h5, h6 {
color: #222;
font-weight: 600;
line-height: 1.3em;
}
.style1 {
font-size: 25px;
color: green;
font-family:sans-serif;
}
h2 {
margin-top: 1.3em;
}
a {
color: #0083e8;
}
b, strong {
font-weight: 600;
}
samp {
display: none;
}
img {
background: transparent;
border: 10px solid rgba(0, 0, 0, 0.12);
border-radius: 4px;
display: block;
margin: 1.3em auto;
max-width: 95%;
-webkit-animation: colorize 2s cubic-bezier(0, 0, .78, .36) 1;
}
@keyframes colorize {
0% {
-webkit-filter: grayscale(100%);
}
100% {
-webkit-filter: grayscale(0%);
}
}
@-webkit-keyframes colorize {
0% {
-webkit-filter: grayscale(100%);
}
100% {
-webkit-filter: grayscale(0%);
}
}
p {
white-space:nowrap;
}