1body {
 2    background: #007b6b;
 3    background: linear-gradient(#009789, #007b6b, #009789);
 4}
 5
 6main {
 7    max-width: 640px;
 8    margin: 80px auto;
 9    background-color: #d5ffba;
10    padding: 20px;
11    border-radius: 4px;
12    border: 4px solid #ffc107;
13    box-shadow: 8px 8px 10px rgba(60, 20, 0, 0.3);
14}
15
16h1 {
17    font-family: 'Droid Serif', serif;
18}
19
20p, label {
21    font-family: 'Crimson Text', serif;
22    font-size: 18px;
23}
24
25a {
26    color: #009789;
27    padding: 2px;
28    border-radius: 2px;
29}
30
31code {
32    color: #007b6b;
33    font-size: 16px;
34}
35
36pre, textarea {
37    color: #b1ddd9;
38    background-color: #212121;
39    font-family: monospace;
40    padding: 8px 12px;
41    overflow-x: scroll;
42}
43
44textarea {
45  white-space: pre;
46  overflow-wrap: normal;
47}
48
49/* Flaired edges, by Tomas Theunissen
50   Reference: https://www.css-tricks.com/examples/hrs/ 
51*/
52hr {
53    height: 30px;
54    border-style: solid;
55    border-color: #ffc107;
56    border-width: 1px 0 0 0;
57    border-radius: 20px;
58}
59hr:before {
60    display: block;
61    content: "";
62    height: 30px;
63    margin-top: -31px;
64    border-style: solid;
65    border-color: #ffc107;
66    border-width: 0 0 1px 0;
67    border-radius: 20px;
68}
69
70/* Less padding on mobile */
71@media (max-width:1000px) {
72    main {
73        margin: auto auto;
74    }
75}