1 | html * { |
---|
2 | margin: 0; |
---|
3 | /*padding: 0; SELECT NOT DISPLAYED CORRECTLY IN FIREFOX */ |
---|
4 | |
---|
5 | } |
---|
6 | |
---|
7 | /* GENERAL */ |
---|
8 | |
---|
9 | .spinner { |
---|
10 | padding: 5px; |
---|
11 | position: absolute; |
---|
12 | right: 0; |
---|
13 | } |
---|
14 | |
---|
15 | body { |
---|
16 | text-align: center; |
---|
17 | width: 980px |
---|
18 | background: #fff; |
---|
19 | color: #222; |
---|
20 | font: 14px verdana, arial, helvetica, sans-serif; |
---|
21 | background: transparent url("../images/brushed_metal.png") repeat fixed center; |
---|
22 | } |
---|
23 | |
---|
24 | #wrapper { |
---|
25 | margin: 0 auto; |
---|
26 | padding: 0; |
---|
27 | width: 1024px; |
---|
28 | } |
---|
29 | |
---|
30 | #top { |
---|
31 | background: url("../images/topBg.png") no-repeat scroll center; |
---|
32 | width: 1020px; |
---|
33 | height: 31px; |
---|
34 | } |
---|
35 | |
---|
36 | #content { |
---|
37 | padding: 0px 20px 20px; |
---|
38 | background: url("../images/contentbg.png") repeat-y scroll center; |
---|
39 | width: 980px; |
---|
40 | /*border: 1px solid #ccc;*/ |
---|
41 | } |
---|
42 | |
---|
43 | #Header { |
---|
44 | background: transparent url("../images/logo.png") no-repeat scroll center; |
---|
45 | width: 980px; |
---|
46 | height: 136px; |
---|
47 | /*border: 1px solid;*/ |
---|
48 | } |
---|
49 | #HeaderLink{ |
---|
50 | display: block; |
---|
51 | width: 958px; |
---|
52 | height: 136px; |
---|
53 | } |
---|
54 | |
---|
55 | /* Navigation plugin, top level. */ |
---|
56 | #menu { |
---|
57 | float: left; |
---|
58 | /*border: 1px solid #ccc;*/ |
---|
59 | } |
---|
60 | |
---|
61 | a:link, a:visited, a:hover { |
---|
62 | color: #666; |
---|
63 | font-weight: bold; |
---|
64 | text-decoration: none; |
---|
65 | } |
---|
66 | |
---|
67 | img { |
---|
68 | border: 0px; |
---|
69 | } |
---|
70 | |
---|
71 | h1 { |
---|
72 | color: #006dba; |
---|
73 | font-weight: normal; |
---|
74 | font-size: 17px; |
---|
75 | margin: 0 0 .3em 0; |
---|
76 | } |
---|
77 | |
---|
78 | ul { |
---|
79 | padding-left: 15px; |
---|
80 | } |
---|
81 | |
---|
82 | input, select, textarea { |
---|
83 | background-color: #fcfcfc; |
---|
84 | border: 1px solid #ccc; |
---|
85 | font: 14px verdana, arial, helvetica, sans-serif; |
---|
86 | margin: 2px 0; |
---|
87 | padding: 2px 4px; |
---|
88 | } |
---|
89 | select { |
---|
90 | padding: 2px 2px 2px 0; |
---|
91 | } |
---|
92 | textarea { |
---|
93 | width: 450px; |
---|
94 | height: 150px; |
---|
95 | vertical-align: top; |
---|
96 | } |
---|
97 | |
---|
98 | input:focus, select:focus, textarea:focus { |
---|
99 | border: 1px solid #b2d1ff; |
---|
100 | } |
---|
101 | |
---|
102 | .body { |
---|
103 | padding: 20px 20px 20px 20px; |
---|
104 | text-align: center; |
---|
105 | /*border: 1px solid #ccc;*/ |
---|
106 | } |
---|
107 | |
---|
108 | /* Logout and Top Navigation Level */ |
---|
109 | |
---|
110 | .appControl { |
---|
111 | height: 2em; |
---|
112 | } |
---|
113 | |
---|
114 | .logoutButton { |
---|
115 | float: right; |
---|
116 | padding: 0.3em 0px 0.3em 0; |
---|
117 | font-size: 14px; |
---|
118 | margin: 0 50px 0 0; |
---|
119 | /*border: 1px solid #ccc;*/ |
---|
120 | } |
---|
121 | |
---|
122 | .logoutButton:hover { |
---|
123 | color: red; |
---|
124 | padding: 0.5em 0px 0.1em 0; |
---|
125 | } |
---|
126 | |
---|
127 | /* ORIGINAL NAVIGATION MENU */ |
---|
128 | |
---|
129 | .nav { |
---|
130 | text-align: centre; |
---|
131 | background: url("../images/linkPanel_long.png") top no-repeat; |
---|
132 | padding: 10px 0px 0px 0px; |
---|
133 | width: 980px; |
---|
134 | height: 40px; |
---|
135 | } |
---|
136 | |
---|
137 | .menuButton { |
---|
138 | font-size: 14px; |
---|
139 | padding: 0 5px; |
---|
140 | } |
---|
141 | .menuButton a { |
---|
142 | color: #333; |
---|
143 | padding: 14px 25px; |
---|
144 | } |
---|
145 | .menuButton a.home { |
---|
146 | /*background: url(../images/skin/house.png) center left no-repeat;*/ |
---|
147 | color: #333; |
---|
148 | /*padding: 25px;*/ |
---|
149 | } |
---|
150 | .menuButton a.list { |
---|
151 | /*background: url(../images/skin/database_table.png) center left no-repeat;*/ |
---|
152 | color: #333; |
---|
153 | /*padding-left: 25px;*/ |
---|
154 | } |
---|
155 | .menuButton a.create { |
---|
156 | /*background: url(../images/skin/database_add.png) center left no-repeat;*/ |
---|
157 | color: #333; |
---|
158 | /*padding-left: 25px;*/ |
---|
159 | } |
---|
160 | |
---|
161 | /* MESSAGES AND ERRORS */ |
---|
162 | |
---|
163 | .message { |
---|
164 | background: #f3f8fc url(../images/skin/information.png) 8px 50% no-repeat; |
---|
165 | border: 1px solid #b2d1ff; |
---|
166 | color: #006dba; |
---|
167 | margin: 10px 0 5px 0; |
---|
168 | padding: 5px 5px 5px 0px |
---|
169 | } |
---|
170 | |
---|
171 | div.errors { |
---|
172 | background: #fff3f3; |
---|
173 | border: 1px solid red; |
---|
174 | color: #cc0000; |
---|
175 | margin: 10px 0 5px 0; |
---|
176 | padding: 5px 0 5px 0; |
---|
177 | } |
---|
178 | div.errors ul { |
---|
179 | list-style: none; |
---|
180 | padding: 0; |
---|
181 | } |
---|
182 | div.errors li { |
---|
183 | background: url(../images/skin/exclamation.png) 8px 0% no-repeat; |
---|
184 | line-height: 16px; |
---|
185 | padding-left: 30px; |
---|
186 | } |
---|
187 | |
---|
188 | td.errors select { |
---|
189 | border: 1px solid red; |
---|
190 | } |
---|
191 | td.errors input { |
---|
192 | border: 1px solid red; |
---|
193 | } |
---|
194 | td.errors textarea { |
---|
195 | border: 1px solid red; |
---|
196 | } |
---|
197 | |
---|
198 | input.time { |
---|
199 | width:40px; |
---|
200 | } |
---|
201 | input.time.errors { |
---|
202 | border: 1px solid red; |
---|
203 | } |
---|
204 | input.description { |
---|
205 | width:450px; |
---|
206 | } |
---|
207 | |
---|
208 | /* TABLES */ |
---|
209 | |
---|
210 | table { |
---|
211 | border: 1px solid #ccc; |
---|
212 | width: 100% |
---|
213 | } |
---|
214 | tr { |
---|
215 | border: 0; |
---|
216 | } |
---|
217 | td, th { |
---|
218 | font: 14px verdana, arial, helvetica, sans-serif; |
---|
219 | line-height: 17px; |
---|
220 | padding: 5px 6px; |
---|
221 | text-align: left; |
---|
222 | vertical-align: top; |
---|
223 | } |
---|
224 | th { |
---|
225 | background: #fff url(../images/skin/shadow.jpg); |
---|
226 | color: #555; |
---|
227 | font-size: 14px; |
---|
228 | font-weight: bold; |
---|
229 | line-height: 17px; |
---|
230 | padding: 2px 6px; |
---|
231 | } |
---|
232 | th a:link, th a:visited, th a:hover { |
---|
233 | color: #333; |
---|
234 | display: block; |
---|
235 | font-size: 14px; |
---|
236 | text-decoration: none; |
---|
237 | width: 100%; |
---|
238 | } |
---|
239 | th.asc a, th.desc a { |
---|
240 | background-position: right; |
---|
241 | background-repeat: no-repeat; |
---|
242 | } |
---|
243 | th.asc a { |
---|
244 | background-image: url(../images/skin/sorted_asc.gif); |
---|
245 | } |
---|
246 | th.desc a { |
---|
247 | background-image: url(../images/skin/sorted_desc.gif); |
---|
248 | } |
---|
249 | |
---|
250 | .odd { |
---|
251 | background: #f7f7f7; |
---|
252 | } |
---|
253 | .even { |
---|
254 | background: #fff; |
---|
255 | } |
---|
256 | |
---|
257 | .clickableOdd { |
---|
258 | background: #f7f7f7; |
---|
259 | cursor: pointer; |
---|
260 | } |
---|
261 | .clickableEven { |
---|
262 | background: #fff; |
---|
263 | cursor: pointer; |
---|
264 | } |
---|
265 | |
---|
266 | /* LIST */ |
---|
267 | |
---|
268 | .list table { |
---|
269 | border-collapse: collapse; |
---|
270 | } |
---|
271 | .list th, .list td { |
---|
272 | border-left: 1px solid #ddd; |
---|
273 | } |
---|
274 | .list th:hover, .list tr:hover { |
---|
275 | background: #b2d1ff; |
---|
276 | } |
---|
277 | |
---|
278 | /* PAGINATION */ |
---|
279 | |
---|
280 | .paginateButtons { |
---|
281 | /*background: #fff url(../images/skin/shadow.jpg) bottom repeat-x;*/ |
---|
282 | /*border: 1px solid #ccc;*/ |
---|
283 | border-top: 0; |
---|
284 | color: #666; |
---|
285 | font-size: 14px; |
---|
286 | overflow: hidden; |
---|
287 | padding: 10px 3px; |
---|
288 | } |
---|
289 | .paginateButtons a { |
---|
290 | background: #fff; |
---|
291 | border: 1px solid #ccc; |
---|
292 | border-color: #ccc #aaa #aaa #ccc; |
---|
293 | color: #666; |
---|
294 | margin: 0 3px; |
---|
295 | padding: 2px 6px; |
---|
296 | } |
---|
297 | .paginateButtons span { |
---|
298 | padding: 2px 3px; |
---|
299 | } |
---|
300 | |
---|
301 | /* DIALOG */ |
---|
302 | |
---|
303 | .dialog table { |
---|
304 | padding: 5px 0; |
---|
305 | } |
---|
306 | |
---|
307 | .prop { |
---|
308 | padding: 5px; |
---|
309 | } |
---|
310 | .prop .name { |
---|
311 | text-align: left; |
---|
312 | width: 15%; |
---|
313 | white-space: nowrap; |
---|
314 | } |
---|
315 | .prop .value { |
---|
316 | text-align: left; |
---|
317 | width: 85%; |
---|
318 | } |
---|
319 | |
---|
320 | /* ACTION BUTTONS */ |
---|
321 | |
---|
322 | .buttons { |
---|
323 | background: #fff url(../images/skin/shadow.jpg) bottom repeat-x; |
---|
324 | border: 1px solid #ccc; |
---|
325 | color: #666; |
---|
326 | font-size: 14px; |
---|
327 | margin-top: -1px; |
---|
328 | margin-bottom: 5px; |
---|
329 | overflow: hidden; |
---|
330 | padding: 0; |
---|
331 | } |
---|
332 | |
---|
333 | .buttons input { |
---|
334 | background: #fff; |
---|
335 | border: 0; |
---|
336 | color: #333; |
---|
337 | cursor: pointer; |
---|
338 | font-size: 14px; |
---|
339 | font-weight: bold; |
---|
340 | margin-left: 3px; |
---|
341 | overflow: visible; |
---|
342 | padding: 2px 6px; |
---|
343 | } |
---|
344 | .buttons input.delete { |
---|
345 | background: transparent url(../images/skin/database_delete.png) 5px 50% no-repeat; |
---|
346 | padding-left: 28px; |
---|
347 | } |
---|
348 | .buttons input.trash { |
---|
349 | background: transparent url(../images/skin/bin_closed.png) 5px 50% no-repeat; |
---|
350 | padding-left: 28px; |
---|
351 | } |
---|
352 | .buttons input.restore { |
---|
353 | background: transparent url(../images/skin/bin_empty.png) 5px 50% no-repeat; |
---|
354 | padding-left: 28px; |
---|
355 | } |
---|
356 | .buttons input.cancel { |
---|
357 | background: transparent url(../images/skin/cross.png) 5px 50% no-repeat; |
---|
358 | padding-left: 28px; |
---|
359 | } |
---|
360 | .buttons input.complete { |
---|
361 | background: transparent url(../images/skin/tick.png) 5px 50% no-repeat; |
---|
362 | padding-left: 28px; |
---|
363 | } |
---|
364 | .buttons input.reopen { |
---|
365 | background: transparent url(../images/skin/door_open.png) 5px 50% no-repeat; |
---|
366 | padding-left: 28px; |
---|
367 | } |
---|
368 | .buttons input.approve { |
---|
369 | background: transparent url(../images/skin/database_gear.png) 5px 50% no-repeat; |
---|
370 | padding-left: 28px; |
---|
371 | } |
---|
372 | .buttons input.renegeApproval { |
---|
373 | background: transparent url(../images/skin/cog_delete.png) 5px 50% no-repeat; |
---|
374 | padding-left: 28px; |
---|
375 | } |
---|
376 | .buttons input.edit { |
---|
377 | background: transparent url(../images/skin/database_edit.png) 5px 50% no-repeat; |
---|
378 | padding-left: 28px; |
---|
379 | } |
---|
380 | .buttons input.save { |
---|
381 | background: transparent url(../images/skin/database_save.png) 5px 50% no-repeat; |
---|
382 | padding-left: 28px; |
---|
383 | } |
---|
384 | .buttons input.add { |
---|
385 | background: transparent url(../images/skin/database_add.png) 5px 50% no-repeat; |
---|
386 | padding-left: 28px; |
---|
387 | } |
---|
388 | .buttons input.search { |
---|
389 | background: transparent url(../images/skin/database_search.png) 5px 50% no-repeat; |
---|
390 | padding-left: 28px; |
---|
391 | } |
---|
392 | .buttons input.link { |
---|
393 | background: transparent url(../images/skin/database_link.png) 5px 50% no-repeat; |
---|
394 | padding-left: 28px; |
---|
395 | } |
---|
396 | .buttons input.go { |
---|
397 | background: transparent url(../images/skin/database_go.png) 5px 50% no-repeat; |
---|
398 | padding-left: 28px; |
---|
399 | } |
---|
400 | .buttons input.table { |
---|
401 | background: transparent url(../images/skin/database_table.png) 5px 50% no-repeat; |
---|
402 | padding-left: 28px; |
---|
403 | } |
---|
404 | |
---|
405 | #bottom { |
---|
406 | background: url("../images/bottomBg.png") no-repeat scroll center; |
---|
407 | width: 1020px; |
---|
408 | height: 100px; |
---|
409 | } |
---|
410 | |
---|
411 | /* Overlay Pane and filterPane plugin*/ |
---|
412 | div.overlayPane { |
---|
413 | position: absolute; |
---|
414 | width:70%; |
---|
415 | left: 50%; |
---|
416 | margin-left: -36%; |
---|
417 | top: 50%; |
---|
418 | margin-top: -26%; |
---|
419 | border: 2px solid #666666; |
---|
420 | background-color: white; |
---|
421 | padding: 5px; |
---|
422 | z-index: 1; |
---|
423 | } |
---|
424 | |
---|
425 | .overlayTable { |
---|
426 | width: 100%; |
---|
427 | } |
---|
428 | |
---|
429 | a.remove img { |
---|
430 | border:none; |
---|
431 | } |
---|
432 | |
---|
433 | /* Navigation Plugin Override */ |
---|
434 | .navigation { |
---|
435 | padding: 0px 0px 0px 50px; |
---|
436 | list-style-type: none; |
---|
437 | clear: both; |
---|
438 | font-size: 14px; |
---|
439 | /*overflow: hidden;*/ /* Clearing floats */ |
---|
440 | } |
---|
441 | |
---|
442 | .navigation li { |
---|
443 | float: left; |
---|
444 | /*border: 0px*/ |
---|
445 | /* border: 1px solid #888; */ |
---|
446 | /*border-left-color: #bbb;*/ /* Highlight border-color */ |
---|
447 | } |
---|
448 | |
---|
449 | .navigation li.navigation_first { |
---|
450 | /*border-left-color: #888; */ |
---|
451 | } |
---|
452 | |
---|
453 | .navigation li.navigation_active { |
---|
454 | /*border-left-color: #555;*/ /* Highlight border-color of active item */ |
---|
455 | } |
---|
456 | |
---|
457 | .navigation li a { |
---|
458 | /* color: #fff; */ |
---|
459 | /* background-color: #aaa; */ |
---|
460 | padding: 0.3em 0.75em 0; |
---|
461 | display: block; |
---|
462 | text-decoration: none; |
---|
463 | } |
---|
464 | |
---|
465 | .navigation li a:hover { |
---|
466 | color: red; |
---|
467 | /* background-color: #999; */ |
---|
468 | /* font-weight: normal; */ |
---|
469 | /* font-size: 14px; */ |
---|
470 | padding: 0.5em 0.75em; |
---|
471 | /*cursor: default;*/ |
---|
472 | } |
---|
473 | |
---|
474 | .navigation li.navigation_active a { |
---|
475 | /* background-color: #555; */ |
---|
476 | /* color: #fff;*/ |
---|
477 | color: #006dba; |
---|
478 | /*color: black;*/ |
---|
479 | font-weight: bold; |
---|
480 | font-size: 17px; |
---|
481 | margin: 0 0 0 0; |
---|
482 | /*cursor: default;*/ |
---|
483 | } |
---|
484 | |
---|
485 | .navigation li.navigation_active a:hover { |
---|
486 | color: #006dba; |
---|
487 | font-weight: bold; |
---|
488 | font-size: 17px; |
---|
489 | padding: 0.3em 0.75em; |
---|
490 | /*background-color: #555;*/ |
---|
491 | } |
---|
492 | |
---|
493 | /* Sub navigation */ |
---|
494 | .subnavigation { |
---|
495 | /*padding: 0px 0px 0px 165px;*/ |
---|
496 | padding: 0px 0px 0px 105px; |
---|
497 | list-style-type: none; |
---|
498 | clear: both; |
---|
499 | overflow: hidden; /* Clearing floats */ |
---|
500 | } |
---|
501 | .subnavigation li { |
---|
502 | float: left; |
---|
503 | /* background-color: #555; */ |
---|
504 | padding: 0em 0.75em; |
---|
505 | border-width: 0px 0; |
---|
506 | } |
---|
507 | .subnavigation li a { |
---|
508 | color: #006dba; |
---|
509 | font-weight: bold; |
---|
510 | font-size: 17px; |
---|
511 | display: block; |
---|
512 | /*padding: 0px 0;*/ |
---|
513 | /* border-color: #555; */ |
---|
514 | border-style: solid; |
---|
515 | border-width: 0px 0; |
---|
516 | text-decoration: none; |
---|
517 | /*margin: 0 0 0 0;*/ |
---|
518 | /*cursor: default;*/ |
---|
519 | } |
---|
520 | |
---|
521 | .subnavigation li a:visited { |
---|
522 | color: #006dba; |
---|
523 | } |
---|
524 | |
---|
525 | .subnavigation li a:hover { |
---|
526 | /*color: red;*/ |
---|
527 | /*border-color: black;*/ |
---|
528 | border-width: 1px 0; |
---|
529 | } |
---|
530 | .subnavigation li.subnavigation_active a { |
---|
531 | /*color: #e0e0e0; */ |
---|
532 | /*cursor: default;*/ |
---|
533 | /*border-color: #e0e0e0;*/ |
---|
534 | border-width: 1px 0; |
---|
535 | } |
---|