Subversion Repositories LCARS

Rev

Rev 38 | Rev 43 | Go to most recent revision | Show entire file | Regard whitespace | Details | Blame | Last modification | View Log | RSS feed

Rev 38 Rev 40
Line 89... Line 89...
89
89
90
#content {
90
#content {
91
  /* position: relative; */
91
  /* position: relative; */
92
}
92
}
93
93
-
 
94
/* 0.0 to 0.6 s */
-
 
95
@-webkit-keyframes content {
-
 
96
  from {
-
 
97
    opacity: 0;
-
 
98
  }
-
 
99
 
-
 
100
  /* 0.6 s */
-
 
101
  99% {
-
 
102
    opacity: 0;
-
 
103
  }
-
 
104
}
-
 
105
-
 
106
.empty.fade-in #content {
-
 
107
  -webkit-animation-name: content;
-
 
108
  -webkit-animation-duration: 0.6s;
-
 
109
  -webkit-animation-timing-function: linear;
-
 
110
}
-
 
111
94
a {
112
a {
95
  text-decoration: none;
113
  text-decoration: none;
96
}
114
}
97
115
98
a:link:hover,
116
a:link:hover,
Line 212... Line 230...
212
  border-top-left-radius: 1.2em;
230
  border-top-left-radius: 1.2em;
213
  border-bottom-left-radius: 1.2em;
231
  border-bottom-left-radius: 1.2em;
214
  min-width: 10em;
232
  min-width: 10em;
215
}
233
}
216
234
217
/* 0.0 to 1.0 s */
235
/* 0.0 to 0.5 s */
218
@-webkit-keyframes bow-top {
236
@-webkit-keyframes bow-top {
219
  from {
237
  from {
220
    left: 90%;
238
    left: 90%;
221
    border-top-left-radius: 0;    
239
    border-top-left-radius: 0;    
222
    border-bottom-left-radius: 0;    
240
    border-bottom-left-radius: 0;    
223
  }
241
  }
224
}
242
}
225
     
243
     
226
.fade-in #bow-top {
244
.fade-in #bow-top {
227
  -webkit-animation-name: bow-top;
245
  -webkit-animation-name: bow-top;
228
  -webkit-animation-duration: 1s;
246
  -webkit-animation-duration: 0.5s;
229
  -webkit-animation-timing-function: linear;
247
  -webkit-animation-timing-function: linear;
230
}
248
}
231
249
232
#bow-top .text {
250
#bow-top .text {
233
  position: absolute;
251
  position: absolute;
234
  margin: 0;
252
  margin: 0;
235
  left: 4.33em;
253
  left: 4.33em;
236
  top: 0;
254
  top: 0;
237
  right: 0.65em;
255
  right: 0.75em;
238
  height: 1em;
256
  height: 1em;
239
  text-align: right;
257
  text-align: right;
240
  color: #fc0;
258
  color: #fc0;
241
  font-size: 2.4em;
259
  font-size: 2.4em;
242
  padding-right: 0.1em;
260
  padding-right: 0.1em;
Line 246... Line 264...
246
264
247
.empty #bow-top .text {
265
.empty #bow-top .text {
248
  left: 0.93em;
266
  left: 0.93em;
249
}
267
}
250
268
251
/* 0.0 to 1.0 s */
269
/* 0.0 to 0.5 s */
252
@-webkit-keyframes bow-top-text {
270
@-webkit-keyframes bow-top-text {
253
  from {
271
  from {
254
    opacity: 0;
272
    opacity: 0;
255
  }
273
  }
256
 
274
 
Line 260... Line 278...
260
  }
278
  }
261
}
279
}
262
280
263
.fade-in #bow-top .text {
281
.fade-in #bow-top .text {
264
  -webkit-animation-name: bow-top-text;
282
  -webkit-animation-name: bow-top-text;
265
  -webkit-animation-duration: 1s;
283
  -webkit-animation-duration: 0.5s;
266
  -webkit-animation-timing-function: linear;
284
  -webkit-animation-timing-function: linear;
267
}
285
}
268
286
269
#bow-top .text span {
287
#bow-top .text span {
270
  padding-right: 0.1em;
288
  padding-right: 0.1em;
Line 283... Line 301...
283
  padding-top: 0.2em;
301
  padding-top: 0.2em;
284
  padding-bottom: 0.2em;
302
  padding-bottom: 0.2em;
285
  background-color: #000;
303
  background-color: #000;
286
}
304
}
287
305
-
 
306
/* 0.0 to 0.5 s */
-
 
307
@-webkit-keyframes footer {
-
 
308
  from {
-
 
309
    left: 90%;
-
 
310
    border-top-left-radius: 0;    
-
 
311
    border-bottom-left-radius: 0;    
-
 
312
  }
-
 
313
}
-
 
314
-
 
315
.empty.fade-in #footer {
-
 
316
  -webkit-animation-name: footer;
-
 
317
  -webkit-animation-duration: 0.5s;
-
 
318
  -webkit-animation-timing-function: linear;
-
 
319
}
-
 
320
288
.empty #footer {
321
.empty #footer {
289
  position: absolute;
322
  position: absolute;
290
  bottom: 0;
323
  bottom: 0;
291
  left: 0;
324
  left: 0;
292
  right: 0;
325
  right: 0;
293
  height: 2em;
326
  height: 2em;
-
 
327
  min-width: 10em;
294
  margin-bottom: 0.2em;
328
  margin-bottom: 0.2em;
295
  background-color: #999;
329
  background-color: #999;
296
  border-radius: 1.2em;
330
  border-radius: 1.2em;
297
  line-height: 0.8;
331
  line-height: 0.9;
298
}
332
}
299
333
300
.empty #footer .text {
334
.empty #footer .text {
301
  position: absolute;
335
  position: absolute;
302
  bottom: 0;
336
  margin: 0;
303
  left: 0.75em;
337
  left: 0.93em;
-
 
338
  top: 0;
304
  margin: 0 !important;
339
  right: 0.75em;
-
 
340
  height: 1em;
305
  background-color: #000;
341
  background-color: transparent;
306
  color: #fc0;
342
  color: #fc0;
307
  padding-top: 0.1em;
-
 
308
  padding-left: 0.1em;
-
 
309
  padding-right: 0.1em;
-
 
310
  text-transform: uppercase;
-
 
311
  font-size: 2.4em;
343
  font-size: 2.4em;
-
 
344
  padding-right: 0.1em;
312
  overflow: hidden;
345
  overflow: hidden;
313
  text-overflow: ellipsis;
346
  text-overflow: ellipsis;
314
}
347
}
315
348
-
 
349
/* 0.0 to 0.5 s */
-
 
350
@-webkit-keyframes footer-text {
-
 
351
  from {
-
 
352
    opacity: 0;
-
 
353
  }
-
 
354
 
-
 
355
  /* shortly before 0.5 s */
-
 
356
  99% {
-
 
357
    opacity: 0;
-
 
358
  }
-
 
359
}
-
 
360
-
 
361
.empty.fade-in #footer .text {
-
 
362
  -webkit-animation-name: footer-text;
-
 
363
  -webkit-animation-duration: 0.5s;
-
 
364
  -webkit-animation-timing-function: linear;
-
 
365
}
-
 
366
316
.empty #footer .text span {
367
.empty #footer .text span {
317
  padding-right: 0.1em;
368
  padding-right: 0.1em;
318
  padding-left: 0.1em;
-
 
319
  background-color: #000;
369
  background-color: #000;
-
 
370
  padding-left: 0.1em;
320
  text-transform: uppercase;
371
  text-transform: uppercase;
321
  white-space: nowrap;
372
  white-space: nowrap;
322
}
373
}
323
374
324
.empty .separator-left {
375
.empty .separator-left {
Line 345... Line 396...
345
  height: 3.2em;
396
  height: 3.2em;
346
  width: 9.2em;
397
  width: 9.2em;
347
  background-color: #999;
398
  background-color: #999;
348
}
399
}
349
400
350
/* 0.0 to 1.25 s */
401
/* 0.0 to 0.625 s */
351
@-webkit-keyframes bow-top-left {
402
@-webkit-keyframes bow-top-left {
352
  from {
403
  from {
353
    height: 0;
404
    height: 0;
354
  }
405
  }
355
406
356
  /* at 1.0 s */
407
  /* at 0.5 s */
357
  80% {
408
  80% {
358
    height: 0;
409
    height: 0;
359
  }
410
  }
360
}
411
}
361
     
412
     
362
.fade-in #bow-top-left {
413
.fade-in #bow-top-left {
363
  -webkit-animation-name: bow-top-left;
414
  -webkit-animation-name: bow-top-left;
364
  -webkit-animation-duration: 1.25s;  
415
  -webkit-animation-duration: 0.625s;  
365
  -webkit-animation-timing-function: linear;  
416
  -webkit-animation-timing-function: linear;  
366
}
417
}
367
418
368
.empty #bow-top-left {
419
.empty #bow-top-left {
369
  display: none;
420
  display: none;
Line 390... Line 441...
390
  top: 5.4em;
441
  top: 5.4em;
391
  width: 15.4em;
442
  width: 15.4em;
392
  overflow: auto;
443
  overflow: auto;
393
}
444
}
394
445
395
/* 0.0 to 2.25 s */
446
/* 0.0 to 1.125 s */
396
@-webkit-keyframes bow-menu {
447
@-webkit-keyframes bow-menu {
397
  from {
448
  from {
398
    opacity: 0;
449
    opacity: 0;
399
    height: 0;
450
    height: 0;
400
    overflow: hidden;
451
    overflow: hidden;
401
  }
452
  }
402
453
403
  /* at ca. 1.25 s */
454
  /* at ca. 0.61875 s */
404
  55% {
455
  55% {
405
    opacity: 0;
456
    opacity: 0;
406
  }
457
  }
407
458
408
  56% {
459
  56% {
Line 417... Line 468...
417
}
468
}
418
469
419
.fade-in #bow .menu
470
.fade-in #bow .menu
420
{
471
{
421
  -webkit-animation-name: bow-menu;
472
  -webkit-animation-name: bow-menu;
422
  -webkit-animation-duration: 2.25s;
473
  -webkit-animation-duration: 1.125s;
423
  -webkit-animation-timing-function: linear;
474
  -webkit-animation-timing-function: linear;
424
}
475
}
425
476
426
#bow ul {
477
#bow ul {
427
  margin: 0 0.2em 0.2em 0;
478
  margin: 0 0.2em 0.2em 0;