Subversion Repositories LCARS

Rev

Rev 36 | Details | Compare with Previous | Last modification | View Log | RSS feed

Rev Author Line No. Line
73 PointedEar 1
<?php \header('Content-Type: text/css; charset=UTF-8'); ?>
36 PointedEar 2
/*
3
 * <title>CSS for PointedEars' LCARS, version 2.1, stardate 201012.30</title>
4
 */
5
 
6
/* basic fonts */
7
 
8
@font-face {
9
  font-family: "LCARS";
10
  font-style: normal;
11
  font-weight: normal;
12
  src: local("LCARS"), url(fonts/LCARS.ttf);
13
}
14
 
15
/* EOT font created with WEFT on 2002-03-23 */
16
@font-face {
17
  font-family: "Downloadable Haettenschweiler";
18
  font-style: normal;
19
  font-weight: normal;
20
  src: url(fonts/HAETTEN0.eot), url(fonts/HAETTENS.ttf);
21
}
22
 
23
/*
24
@font-face {
25
  font-family:Webdings;
26
  font-style:normal;
27
  font-weight:normal;
28
  src:url(fonts/WEBDING0.eot);
29
}
30
*/
31
 
32
@font-face {
33
  font-family: "Downloadable Zurich XCn BT";
34
  font-style: normal;
35
  font-weight: normal;
36
  src: url(fonts/ZurichXCn.pfr);
37
}
38
 
39
/* basic display */
40
 
41
* {
42
  font-family: "LCARS",
43
    Haettenschweiler, "Downloadable Haettenschweiler",
44
    "Zurich XCn BT", "Downloadable Zurich XCn BT",
45
    impact, Verdana, Geneva, Arial, Helvetica, sans-serif;
46
  font-weight: normal;
47
}
48
 
49
body {
50
  position: absolute;
51
  left: 204px;
52
  top: 216px;
53
  right: 0px;
54
  bottom: 0;
55
 
56
  /* IE 5.5+ scrollbar colors */
57
/* from Mozilla LCARS Theme (2D style) */
58
  scrollbar-3dlight-color:#000;
59
  scrollbar-arrow-color:#000;
60
  scrollbar-base-color:#000;
61
  scrollbar-darkshadow-color:#000;
62
  scrollbar-face-color:#99f;
63
  scrollbar-highlight-color:#99f;
64
  scrollbar-track-color:#000;
65
  scrollbar-shadow-color:#99f;
66
 
67
  background-color: #000;
68
  color: #99f;
69
  font-size: 131%; /* 134% */
70
}
71
 
72
h1, h2 {
73
  margin-top: 0;
74
  font-size: 120%;
75
  font-weight: normal;
76
}
77
 
78
#LCARS {
79
/*   position: relative; */
80
  position: fixed;
81
  left: 4px;
82
  top: 0;
83
  right: 4px;
84
}
85
 
86
.button {
87
  width: 100px;
88
  min-height: 40px;
89
  background-color: #c9c;
90
  color: #000;
91
  text-decoration: none;
92
  overflow: hidden;
93
}
94
 
95
#upper {
96
  position: absolute;
97
  left: 0;
98
  top: 0;
99
  right: 0;
100
  height: 180px;
101
 
102
  /* Prevents body text above */
103
  /* padding-top: 4px; */
104
  background-color: #c00;  
105
  color: #fff;  
106
}
107
 
108
.elbo {
109
  position: relative;
110
  width: 100px;
111
  height: 62px;
112
  text-align: right;
113
}
114
 
115
.elbo-button {
116
  position: relative;
117
  margin-top: 4px;
118
  height: 40px;
119
  overflow: hidden;
120
}
121
 
122
.elbo span {
123
  position: relative;
124
  right: 4px;
125
}
126
 
127
@-webkit-keyframes swish-down-up {
128
  0% {
129
    height: 0;
130
    top: 84px;
131
  }
132
 
133
  100% {
134
  }
135
}
136
 
137
#upper .elbo-button {
138
  position: absolute;
139
  min-height: 0;
140
  height: 84px;
141
 
142
  /* -webkit-animation-name: swish-down-up; */
143
  /* -webkit-animation-iteration-count: 1; */
144
  -webkit-animation-delay: 1s;
145
  -webkit-animation-duration: 1s;
146
}
147
 
148
#upper .elbo-button span {
149
  position: absolute;
150
  right: 4px;
151
  bottom: 4px;
152
}
153
 
154
#upper-elbo {
155
  position: absolute;
156
  top: 92px;
157
}
158
 
159
#upper-elbo .elbo {
160
  height: 62px;
161
  background-color: #9cf;
162
  color: #000;
163
}
164
 
165
@-webkit-keyframes swish-right-left {
166
  0% {
167
    width: 0px;
168
    /* height: 0px; */
169
    left: 100px;
170
    /* top: 62px; */
171
  }
172
 
173
  100% {
174
  }
175
}
176
 
177
#upper-elbo .elbo.left {
178
  -moz-border-radius: 0 0 0 32px;
179
  -webkit-border-radius: 0 0 0 32px;
180
  border-radius: 0 0 0 32px;
181
  /* -webkit-animation-name: swish-right-left; */
182
  -webkit-animation-duration: 1s;
183
}
184
 
185
#upper-elbo .elbo.left span {
186
  top: 4px;
187
}
188
 
189
#upper-elbo .elbo.right {
190
  position: absolute;
191
  left: 100px;
192
  top: 0;
193
  width: 78px;
194
  right: 0;
195
}
196
 
197
#upper-elbo .elbo.right .black {
198
  position: absolute;
199
  left: 0;
200
  top: 0;
201
  width: 100%;
202
  height: 44px;
203
  background-color: #000;
204
  -moz-border-radius: 0 0 0 16px;
205
  -webkit-border-radius: 0 0 0 16px;
206
  border-radius: 0 0 0 16px;
207
}
208
 
209
#upper-elbo .elbo.right .terminator {
210
  position: absolute;
211
  left: 82px;
212
  top: 44px;
213
  width: 18px;
214
  height: 18px;
215
  background-color: #f90;  
216
}
217
 
218
#lower {
219
  position: absolute;
220
  top: 158px;
221
}
222
 
223
#lower-elbo {
224
  position: absolute;
225
}
226
 
227
#lower-elbo .elbo {
228
  background-color: #c66;
229
  color: #000;
230
}
231
 
232
#lower-elbo .elbo.left {
233
  -moz-border-radius: 32px 0 0 0;
234
  -webkit-border-radius: 32px 0 0 0;
235
  border-radius: 32px 0 0 0;
236
}
237
 
238
#lower-elbo .elbo.left span {
239
  position: absolute;
240
  bottom: 4px;
241
}
242
 
243
#lower-elbo h2.elbo.left  {
244
  margin-bottom: 0;
245
}
246
 
247
#lower-elbo .elbo.right {
248
  position: absolute;
249
  left: 100px;
250
  top: 0;
251
  width: 100px;
252
}
253
 
254
#lower-elbo .elbo.right .black {
255
  position: absolute;
256
  left: 0px;
257
  top: 18px;
258
  width: 100%;
259
  height: 45px;
260
  background-color: #000;
261
  -webkit-border-radius: 16px 0 0 0;
262
  border-radius: 16px 0 0 0;
263
}
264
 
265
p {
266
  margin-top: 1em;
267
  margin-bottom: 0;
268
  line-height: 1.5;
269
  text-align: justify;
270
}
271
 
272
p:first-child {
273
  margin-top: 0;
274
}
275
 
276
#content {
277
  /* position: relative; */
278
}
279
 
280
#content a {
281
  text-decoration: none;
282
}
283
 
284
#content #heading1 {
285
  position: fixed;
286
  left: 204px;
287
  top: 180px;
288
  right: 4px;
289
  height: 42px;
290
  background-color: rgba(255, 0, 0, 0.5);
291
  color: white;
292
  text-align: right;
293
}
294
 
295
#content #heading1 h1 {
296
  position: absolute;
297
  bottom: 6px;
298
  right: 0;
299
  margin-bottom: 0;
300
  padding-right: 4px;
301
}
302
 
303
#content a:link:hover,
304
#content a:link:focus
305
{
306
  background-color:#000;
307
  color: #f90;
308
}
309
 
310
#content a:link:active {
311
  background-color:#000;
312
  color: #fff;
313
}
314
 
315
#content a:link {
316
  background-color:#000;
317
  color:#fc9;
318
}
319
 
320
#content a:visited:hover,
321
#content a:visited:focus
322
{
323
  background-color:#000;
324
  color:#f90;
325
}
326
 
327
#content a:visited:active {
328
  background-color:black;
329
  color:#fff;
330
}
331
 
332
#content a:visited {
333
  background-color:black;
334
  color:#c9c;
335
}