Book a Demo!
CoCalc Logo Icon
StoreFeaturesDocsShareSupportNewsAboutPoliciesSign UpSign In
titaniumnetwork-dev
GitHub Repository: titaniumnetwork-dev/Incognito-old
Path: blob/main/static/src/gs/public/hexgl/css/multi.css
1324 views
1
@-webkit-keyframes anim {
2
0% { -webkit-transform: translateY(10px) }
3
50% { -webkit-transform: translateY(-10px) }
4
100% { -webkit-transform: translateY(10px) }
5
}
6
@-moz-keyframes anim {
7
0% { -moz-transform: translateY(10px) }
8
50% { -moz-transform: translateY(-10px) }
9
100% { -moz-transform: translateY(10px) }
10
}
11
@-o-keyframes anim {
12
0% { -o-transform: translateY(10px) }
13
50% { -o-transform: translateY(-10px) }
14
100% { -o-transform: translateY(10px) }
15
}
16
@keyframes anim {
17
0% { transform: translateY(10px) }
18
50% { transform: translateY(-10px) }
19
100% { transform: translateY(10px) }
20
}
21
22
@-webkit-keyframes animbg {
23
0% { -webkit-transform: translateY(5px) }
24
50% { -webkit-transform: translateY(-5px) }
25
100% { -webkit-transform: translateY(5px) }
26
}
27
@-moz-keyframes animbg {
28
0% { -moz-transform: translateY(5px) }
29
50% { -moz-transform: translateY(-5px) }
30
100% { -moz-transform: translateY(5px) }
31
}
32
@-o-keyframes animbg {
33
0% { -o-transform: translateY(5px) }
34
50% { -o-transform: translateY(-5px) }
35
100% { -o-transform: translateY(5px) }
36
}
37
@keyframes animbg {
38
0% { transform: translateY(5px) }
39
50% { transform: translateY(-5px) }
40
100% { transform: translateY(5px) }
41
}
42
43
* {
44
-webkit-touch-callout: none;
45
-webkit-user-select: none;
46
-khtml-user-select: none;
47
-moz-user-select: none;
48
-ms-user-select: none;
49
user-select: none;
50
}
51
52
html, body {
53
overflow: hidden;
54
font-family: 'BebasNeueRegular', arial, sans-serif;
55
background: white;
56
}
57
58
#global {
59
position: absolute;
60
top: 0;
61
right: 0;
62
bottom: 0;
63
left: 0;
64
z-index: 0;
65
background: url('bg.jpg') no-repeat center center fixed;
66
overflow: hidden;
67
text-align: center;
68
-moz-background-size: cover;
69
-webkit-background-size: cover;
70
-ms-background-size: cover;
71
-o-background-size: cover;
72
background-size: cover;
73
-webkit-transform: translateZ(0);
74
-moz-transform: translateZ(0);
75
-o-transform: translateZ(0);
76
transform: translateZ(0);
77
-webkit-animation: animbg 3s ease-in-out infinite;
78
-moz-animation: animbg 3s ease-in-out infinite;
79
-o-animation: animbg 3s ease-in-out infinite;
80
animation: animbg 3s ease-in-out infinite;
81
}
82
83
#title {
84
position: absolute;
85
top: 5%;
86
right: 0;
87
bottom: 5%;
88
left: 0;
89
z-index: 1;
90
background: url('title.png') no-repeat center top;
91
-moz-background-size: auto 50%;
92
-webkit-background-size: auto 50%;
93
-ms-background-size: auto 50%;
94
-o-background-size: auto 50%;
95
background-size: auto 50%;
96
-webkit-transform: translateZ(0);
97
-moz-transform: translateZ(0);
98
-o-transform: translateZ(0);
99
transform: translateZ(0);
100
-webkit-animation: anim 3s ease-in-out infinite;
101
-moz-animation: anim 3s ease-in-out infinite;
102
-o-animation: anim 3s ease-in-out infinite;
103
animation: anim 3s ease-in-out infinite;
104
}
105
106
#menucontainer {
107
position: absolute;
108
top: auto;
109
right: 0;
110
bottom: 10%;
111
left: 0;
112
z-index: 2;
113
}
114
115
#menu {
116
position: relative;
117
display: block;
118
width: 100%;
119
max-width: 600px;
120
margin: auto;
121
text-align: center;
122
font-size: 2em;
123
font-family: 'BebasNeueRegular', arial, sans-serif;
124
text-transform: uppercase;
125
color: #4190bb;
126
}
127
128
#menu div {
129
padding: 0.1em 0 0 0;
130
margin: 0 0;
131
cursor: pointer;
132
-moz-text-shadow: 0 0 10px rgb(255,255,255);
133
-webkit-text-shadow: 0 0 10px rgb(255,255,255);
134
text-shadow: 0 0 10px rgb(255,255,255);
135
-webkit-transform-origin-y: 50%;
136
-webkit-transition: -webkit-transform 0.2s;
137
-webkit-transform: translateZ(0px) scaleY(0.8);
138
transform-origin-y: 50%;
139
transition: transform 0.2s ease;
140
transform: translateZ(0px) scaleY(0.8);
141
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjQwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIwLjUiLz4KICAgIDxzdG9wIG9mZnNldD0iNjAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjAuNSIvPgogICAgPHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSIjZmZmZmZmIiBzdG9wLW9wYWNpdHk9IjAiLz4KICA8L2xpbmVhckdyYWRpZW50PgogIDxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjZ3JhZC11Y2dnLWdlbmVyYXRlZCkiIC8+Cjwvc3ZnPg==);
142
background: -moz-linear-gradient(left, rgba(255,255,255,0) 0%, rgba(255,255,255,0.5) 40%, rgba(255,255,255,0.5) 60%, rgba(255,255,255,0) 100%); /* FF3.6+ */
143
background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(255,255,255,0)), color-stop(40%,rgba(255,255,255,0.5)), color-stop(60%,rgba(255,255,255,0.5)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
144
background: -webkit-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.5) 40%,rgba(255,255,255,0.5) 60%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
145
background: -o-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.5) 40%,rgba(255,255,255,0.5) 60%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */
146
background: -ms-linear-gradient(left, rgba(255,255,255,0) 0%,rgba(255,255,255,0.5) 40%,rgba(255,255,255,0.5) 60%,rgba(255,255,255,0) 100%); /* IE10+ */
147
background: linear-gradient(to right, rgba(255,255,255,0) 0%,rgba(255,255,255,0.5) 40%,rgba(255,255,255,0.5) 60%,rgba(255,255,255,0) 100%); /* W3C */
148
}
149
150
#menu div:hover {
151
color: #f66439;
152
-webkit-transform: scaleY(1.0);
153
transform: scaleY(1.1);
154
}
155
156
#start {
157
font-size: 1.8em;
158
color: #f66439;
159
}
160
161
#start:hover {
162
color: #f8854b !important;
163
}
164
165
#step-2 {
166
position: absolute;
167
top: 0;
168
right: 0;
169
bottom: 0;
170
left: 0;
171
background: black;
172
vertical-align: bottom;
173
text-align: center;
174
padding: 20px;
175
color: white;
176
font-size: 2em;
177
background-repeat: no-repeat;
178
background-position: center center;
179
-moz-background-size: 60% auto;
180
-webkit-background-size: 60% auto;
181
-ms-background-size: 60% auto;
182
-o-background-size: 60% auto;
183
background-size: 60% auto;
184
}
185
186
#step-3 {
187
position: absolute;
188
top: 0;
189
right: 0;
190
bottom: 0;
191
left: 0;
192
background: black;
193
}
194
195
#step-3 #progressbar {
196
position: absolute;
197
top: 0;
198
right: auto;
199
bottom: 0;
200
left: 0;
201
width: 0%;
202
background: white;
203
}
204
205
#step-5 {
206
position: absolute;
207
top: 0;
208
right: 0;
209
bottom: 0;
210
left: 0;
211
background: black;
212
text-align: center;
213
padding: 100px 20px;
214
color: white;
215
font-size: 2em;
216
}
217
218
#step-5 #time {
219
font-size: 4em
220
}
221
222
#leapinfo {
223
position: absolute;
224
top: 0;
225
right: 0;
226
bottom: 0;
227
left: 0;
228
background: rgba(0,0,0,0.8);
229
color: white;
230
text-align: center;
231
font-size: 3em;
232
padding-top: 200px;
233
z-index: 999999;
234
}
235
236
#credits {
237
position: absolute;
238
top: 0;
239
right: 0;
240
bottom: 0;
241
left: 0;
242
z-index: 9999;
243
background: black;
244
overflow-y: auto;
245
text-align: center;
246
color: white;
247
font-size: 1.1em;
248
padding: 40px 20px;
249
}
250
251
#credits h3 {
252
font-size: 2em;
253
color: #666;
254
}
255
256
#credits b {
257
font-size: 1.2em;
258
color: #bbb;
259
}
260
261
#credits h4 {
262
color: #555;
263
font-size: 1.2em;
264
}
265
266