Just the source code for my personal website.
1* {
2 box-sizing: border-box;
3}
4
5.button-bar {
6 display: flex;
7 text-align: center;
8 justify-content: center;
9 margin: 1em 0;
10}
11
12.button {
13 background-color: #fc6fdd;
14 color: #f7f7f7;
15 text-align: center;
16 text-decoration: none;
17 padding: 8px 1.2em;
18 margin: 0 10px;
19
20 transition: background-color .1s;
21}
22
23.button:hover {
24 background-color: #f444ce;
25}
26
27body {
28 background-color: #f7f7f7;
29}
30
31body p {
32 line-height: 1.6;
33}
34
35#carrd-container {
36 font-size: 90%;
37}
38
39#carrd-container p {
40 line-height: 1.5;
41}
42
43#carrd-container ul {
44 box-sizing: content-box;
45 margin-right: 5%;
46 text-align: left;
47 line-height: 1.5;
48}
49
50[class*=col-] {
51 width: 100%;
52 padding: 0 15px;
53 float: left;
54}
55
56.col-center {
57 width: 100%;
58}
59
60.col-left,
61.col-right {
62 width: 0;
63}
64
65.col-center header,
66.col-center main,
67.col-center footer,
68.col-center article {
69 padding: 10px auto;
70}
71
72.emphasis {
73 background-color: rgba(144, 144, 144, 0.25);
74}
75
76@media only screen and (min-width: 768px) {
77
78 .col-left,
79 .col-right {
80 width: 20%;
81 }
82
83 .col-center {
84 width: 60%;
85 }
86
87 [class*=col-] {
88 padding: 5px;
89 }
90
91 #carrd-container {
92 font-size: 100%;
93 }
94
95 #carrd-container ul {
96 text-align: center;
97 list-style-position: inside;
98 }
99
100 #dms {
101 margin: 1em;
102 }
103}
104
105footer p {
106 font-size: small;
107}