72
|
1 /* body-wide font choice and stuff */
|
69
|
2 body {
|
|
3 color: white;
|
|
4 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
|
72
|
5 }
|
|
6
|
|
7 .header {
|
69
|
8 text-align: center;
|
72
|
9 justify-content: center;
|
69
|
10 }
|
72
|
11
|
|
12 .title {
|
69
|
13 text-align: center;
|
72
|
14 display: inline-block;
|
|
15 /* dumb little hack to get this to render properly on mobile */
|
|
16 padding: 0 0.75em;
|
|
17 }
|
|
18
|
|
19 .avatar {
|
|
20 display: inline-block;
|
|
21
|
|
22 border: 4px solid black;
|
|
23 width: 200px;
|
|
24 height: auto;
|
69
|
25 }
|
72
|
26
|
|
27 .content {
|
|
28 background-color: rgba(0, 0, 0, 0.5);
|
|
29
|
|
30 /* essentially equivalent to `margin: auto;`
|
|
31 * except it has a minimum value of 1em to make it
|
|
32 * look nice on mobile
|
|
33 */
|
|
34 margin-inline: max(1em, 50% - 46.88em/2);
|
|
35
|
|
36 margin-top: 1em;
|
|
37 padding: 1em 1.5em;
|
69
|
38 }
|
72
|
39
|
|
40 /* generic drop shadows I heavily use these in... everything,
|
|
41 * so having them as their own classes is pretty nice :)
|
|
42 */
|
|
43 .drop-shadow-text {
|
|
44 text-shadow: 0.125em 0.125em 0.125em rgba(0, 0, 0, 0.5);
|
69
|
45 }
|
72
|
46
|
|
47 .drop-shadow-box {
|
|
48 box-shadow: 0.125em 0.125em 0.625em rgba(0, 0, 0, 0.5);
|
69
|
49 }
|