Commit | Line | Data |
---|---|---|
72b294bb | 1 | body { |
2 | transform-origin: 0 0; | |
3 | overflow: hidden; | |
4 | text-align: center; | |
5 | } | |
6 | ||
7 | .clock-container { | |
8 | position: relative; | |
9 | width: 650px; | |
10 | margin-left: auto; | |
11 | margin-right: auto; | |
12 | } | |
13 | ||
14 | .flags > div { | |
15 | display: inline-block; | |
16 | visibility: hidden; | |
17 | animation: blinker 1s linear infinite; | |
18 | font-size: 200%; | |
19 | font-family: "DejaVu Sans",FreeSerif,Code2000,"BabelStone Han","Lucida Sans"; | |
20 | } | |
21 | ||
22 | #flag-left { | |
23 | position: absolute; | |
24 | top: 35%; | |
25 | z-index: 9999; | |
26 | left: 5%; | |
27 | } | |
28 | #flag-right { | |
29 | position: absolute; | |
30 | top: 35%; | |
31 | z-index: 9999; | |
32 | right: 5%; | |
33 | } | |
34 | ||
35 | @keyframes blinker { | |
36 | 50% { opacity: 0; } | |
37 | } | |
38 | ||
39 | .timers { | |
40 | clear: both; | |
41 | width: 530px; /* 570, -40 for aesthetic reason */ | |
42 | position: absolute; | |
43 | top: 50%; | |
44 | z-index: 9999; | |
45 | left: 0; | |
46 | right: 0; | |
47 | margin-left: auto; | |
48 | margin-right: auto; | |
49 | } | |
50 | ||
51 | .timer { | |
52 | font-size: 400%; | |
53 | display: inline-block; | |
54 | } | |
55 | ||
56 | #timer-left { | |
57 | float: left; | |
58 | } | |
59 | #timer-right { | |
60 | float: right; | |
61 | } | |
62 | ||
63 | .indicators { | |
64 | font-size: 167%; | |
65 | display: inline-block; | |
66 | position: absolute; | |
67 | left: 0; | |
68 | right: 0; | |
69 | margin-left: auto; | |
70 | margin-right: auto; | |
71 | } | |
72 | ||
73 | h1 { | |
6f474901 | 74 | width: 20ch; |
72b294bb | 75 | text-align: center; |
6f474901 AIL |
76 | position: absolute; |
77 | top: 70%; | |
78 | z-index: 9999; | |
79 | left: 0; | |
80 | right: 0; | |
81 | margin-left: auto; | |
82 | margin-right: auto; | |
72b294bb | 83 | } |
84 | ||
85 | .commands { | |
86 | clear: both; | |
87 | margin: 0 auto; | |
88 | width: 650px; | |
89 | position: absolute; | |
90 | left: 0; | |
91 | right: 0; | |
92 | margin-left: auto; | |
93 | margin-right:auto; | |
94 | bottom: 5%; | |
95 | z-index: 9999; | |
96 | } | |
97 | ||
98 | .cmd { | |
99 | display: inline-block; | |
100 | cursor: pointer; | |
101 | background-color: #FFF; | |
102 | padding: 5px; | |
103 | border: 3px solid #800000; | |
104 | border-radius: 5px; | |
105 | } |