72b294bb |
1 | body { |
2 | transform-origin: 0 0; |
3 | overflow: hidden; |
4 | text-align: center; |
5 | } |
6 | |
7 | .clock-container { |
8 | position: relative; |
9 | } |
10 | |
11 | .flags { |
12 | width: 570px; |
13 | display: flex; |
14 | justify-content: space-between; |
15 | position: absolute; |
16 | top: 40%; |
17 | z-index: 9999; |
18 | left: 0; |
19 | right: 0; |
20 | margin-left: auto; |
21 | margin-right: auto; |
22 | } |
23 | |
24 | .flags > div { |
25 | visibility: hidden; |
26 | animation: blinker 1s linear infinite; |
27 | font-size: 25pt; |
28 | font-family: "DejaVu Sans",FreeSerif,Code2000,"BabelStone Han","Lucida Sans"; |
29 | } |
30 | |
31 | @keyframes blinker { |
32 | 50% { opacity: 0; } |
33 | } |
34 | |
35 | .timers { |
36 | width: 650px; |
37 | display: flex; |
38 | justify-content: center; |
39 | align-items: center; |
40 | /*margin-bottom: 96pt;*/ |
41 | position: absolute; |
42 | top: 50%; |
43 | z-index: 9999; |
44 | left: 0; |
45 | right: 0; |
46 | margin-left: auto; |
47 | margin-right: auto; |
48 | } |
49 | |
50 | .timer { |
51 | margin-left: 48pt; |
52 | margin-right: 48pt; |
53 | font-size: 48pt; |
54 | } |
55 | |
56 | .indicators { |
57 | width: 20pt; |
58 | font-size: 20pt; |
59 | } |
60 | |
61 | h1 { |
62 | text-align: center; |
63 | } |
64 | |
65 | .commands { |
66 | margin: 0 auto; |
67 | width: 650px; |
68 | display: flex; |
69 | justify-content: space-around; |
70 | position: absolute; |
71 | left: 0; |
72 | right: 0; |
73 | margin-left: auto; |
74 | margin-right:auto; |
75 | bottom: 5%; |
76 | z-index: 9999; |
77 | } |
78 | |
79 | .cmd { |
80 | cursor: pointer; |
81 | background-color: #FFF; |
82 | padding: 5px; |
83 | border: 3px solid #800000; |
84 | border-radius: 5px; |
85 | } |