static/style.css (view raw)
1html,
2body {
3 background: #021012;
4}
5
6a {
7 color: white;
8 display: inline-block;
9 margin: 0 20px;
10 position: relative;
11 text-decoration: none;
12}
13
14a:after {
15 content: "";
16 height: 1px;
17 background: white;
18 position: absolute;
19 pointer-events: none;
20 bottom: -5px;
21 left: 0;
22 right: 0;
23 opacity: 0;
24 transform: scale(0, 1);
25 transition: all 200ms;
26}
27
28a:hover:after {
29 opacity: 1;
30 transform: scale(1, 1);
31}
32
33.container {
34 position: absolute;
35 overflow: hidden;
36 top: 0;
37 bottom: 0;
38 left: 0;
39 right: 0;
40 color: white;
41 font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif;
42
43 -webkit-animation: fadein 2s;
44 -moz-animation: fadein 2s;
45 -ms-animation: fadein 2s;
46 -o-animation: fadein 2s;
47 animation: fadein 2s;
48}
49
50@keyframes fadein {
51 from { opacity: 0; }
52 to { opacity: 1; }
53}
54
55@-moz-keyframes fadein {
56 from { opacity: 0; }
57 to { opacity: 1; }
58}
59
60@-webkit-keyframes fadein {
61 from { opacity: 0; }
62 to { opacity: 1; }
63}
64
65.introduction {
66 position: absolute;
67 top: 50%;
68 transform: translateY(-50%);
69 width: 100%;
70}
71
72.logo {
73 width: 250px;
74}
75
76.footer {
77 color: #666;
78 bottom: 20px;
79 font-size: 14px;
80 position: absolute;
81 width: 100%;
82 text-align: center;
83 margin-bottom: 20px;
84}
85
86.footer a {
87 color: #666;
88 margin: 0;
89 transition: all 200ms;
90}
91
92.footer a:hover {
93 color: white;
94}
95
96.left {
97 display: inline-block;
98 margin-bottom: 30px;
99 margin-left: 0;
100 margin-right: 30px;
101}
102
103.right {
104 display: inline-block;
105}
106
107.right a {
108 display: inline-block;
109 margin-right: 30px;
110}
111
112@media only screen and (max-width: 40em) {
113 .left {
114 display: block;
115 margin-right: 0;
116 }
117 .right {
118 display: block;
119 }
120 .right a:last-child {
121 margin-right: 0;
122 }