Statistics
| Branch: | Tag: | Revision:

root / ui / static / main.css @ bb253902

History | View | Annotate | Download (50.9 kB)

1
html, body, div, span, applet, object, iframe,
2
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
3
a, abbr, acronym, address, big, cite, code,
4
del, dfn, em, font, img, ins, kbd, q, s, samp,
5
small, strike, strong, sub, sup, tt, var,
6
b, u, i, center,
7
dl, dt, dd, ol, ul, li,
8
fieldset, form, label, legend,
9
table, caption, tbody, tfoot, thead, tr, th, td {
10
    margin: 0;
11
    padding: 0;
12
    border: 0;
13
    font-size: 100%;
14
    vertical-align: baseline;
15
    background: transparent;
16
    font-family: Verdana, 'PT Sans', sans-serif;
17
}
18

    
19
html {
20
    height: 100%;
21
}
22

    
23
body {
24
    line-height: 1;
25
    background: url(../static/body-bg.png) repeat-x scroll 0 0 #FFFFFF;
26
    height: 100%;
27
}
28

    
29
#container {
30
        position:relative;
31
        margin:0 auto;
32
        width: 100%;
33
        background:#f0f0f0;
34
        height:auto !important;
35
        height:100%;
36
        min-height:100%;
37
    background: url("../static/body-bg2.png") no-repeat scroll right bottom transparent;
38
}
39

    
40
#header {
41
    height: 93px;
42
    background: url("../static/header-bg.png") repeat-x scroll 0 0 #FFFFFF;
43
    margin: 0 auto;
44
    width: 700px;
45
}
46

    
47

    
48
#content {
49
    padding-bottom: 183px;
50
    width: 100%;
51
}
52

    
53
#footer {
54
    height: 119px;
55
    background-color: #4085A5;
56
        position:absolute;
57
    bottom: 0;
58
    width:100%;
59
}
60

    
61
ol, ul {
62
    list-style: none;
63
}
64

    
65
blockquote, q {
66
    quotes: none;
67
}
68

    
69
blockquote:before, blockquote:after,
70
q:before, q:after {
71
    content: '';
72
    content: none;
73
}
74

    
75
/* remember to define focus styles! */
76
:focus {
77
    outline: 1px dotted #87AADE;
78
}
79

    
80
/* remember to highlight inserts somehow! */
81
ins {
82
    text-decoration: none;
83
}
84

    
85
del {
86
    text-decoration: line-through;
87
}
88

    
89
/* tables still need 'cellspacing="0"' in the markup */
90
table {
91
    border-collapse: collapse;
92
    border-spacing: 0;
93
}
94

    
95
h5 {
96
    font-weight: normal;
97
    font-size: 9pt;
98
    margin-bottom:3px;
99
}
100

    
101
/* root element for tabs  */
102
.tab-name {
103
    background-color: #5CA1C0;
104
    color: #FFFFFF;
105
    float: left;
106
    font-size: 150%;
107
    height: 28px;
108
    padding-top: 3px;
109
    text-align: center;
110
    width: 170px;
111
}
112

    
113
.tab-separator {
114
    background-color: white;
115
    float: left;
116
    width: 2px;
117
    height: 23px;
118
    margin-top: 4px;
119
}
120

    
121
ul.css-tabs {
122
    padding: 0;
123
    height:31px;
124
    background-color: #5CA1C0;
125
}
126

    
127
ul.css-tabs .secondary {
128
    position:relative;
129
}
130

    
131
/* single tab */
132
ul.css-tabs li {
133
    float:left;
134
    padding:0;
135
    list-style-type:none;
136
}
137

    
138
ul.css-tabs .current {
139
    background: #4085A5;
140
}
141

    
142
/* link inside the tab. uses a background image */
143
ul.css-tabs a {
144
    float:left;
145
    display:block;
146
    text-decoration:none;
147
    color:#d2d2d2;
148
    position:relative;
149
    outline:0;
150
    padding: 4px 25px 0;
151
    height: 27px;
152
}
153

    
154
ul.css-tabs a:hover {
155
    background: #74AEC9;
156
}
157

    
158
/* selected tab */
159
ul.css-tabs a.current {
160
    cursor:default;
161
}
162

    
163
ul.css-tabs a.current:hover {
164
    background: #4085A5;
165
}
166
/* tab pane */
167
div.css-panes {
168
/*    border-top: 10px solid #87aade;
169
    border-bottom: 10px solid #87aade;  */
170
    background: transparent;
171
}
172

    
173
.css-panes > div.pane {
174
    display:none;
175
    padding:0px 20px;
176
    margin: 0 1em;
177
}
178

    
179
/* CSS3 border radius for various elements. yea - CSS isn't perfect */
180
.rounded, #sheet input, .error {
181
    border-radius: 5px;
182
    -webkit-border-radius: 5px;
183
    -moz-border-radius: 5px;
184
    -o-border-radius: 5px;
185
    -khtml-border-radius: 5px;
186
}
187

    
188
/* validation error message */
189
.error {
190
    background-color:#E8FF6D;
191
    padding:4px;
192
    -webkit-box-shadow: #000 0 0 9pt;
193
    -moz-box-shadow: #000 0 0 9pt;
194
}
195

    
196
/* nested arrow inside error message. It's 100% CSS. No images. */
197
.error em {
198
    border: 10px solid;
199
    border-color: #E8FF6D transparent transparent;
200
    bottom: -17px;
201
    display: block;
202
    height: 0;
203
    left: 10px;
204
    position: absolute;
205
    width: 0;
206
}
207

    
208
/* input field that caused validation error */
209
.invalid {
210
    background-color: rgba(221, 233, 255, 0.898) !important;
211
}
212

    
213
#beforecreate {
214
    background-color: #FF9955;
215
    float: left;
216
    height: 32px;
217
    margin-left: -50px;
218
    margin-top: 8px;
219
    width: 20px;
220
}
221

    
222
#createcontainer {
223
    margin-top: 20px;
224
    margin-bottom: 10px;
225
    display:none;
226
}
227

    
228
#create {
229
    background-color: #FF7F2A;
230
    color: #000;
231
    cursor: pointer;
232
    display: none;
233
    padding: 7px 24px;
234
    margin: 0 0 0 -36px;
235
    width: 125px;
236
    text-decoration: none;
237
    font-size:100%;
238
}
239

    
240
#create:hover {
241
    background-color: #FF9955;
242
}
243

    
244
#console-header {
245
    height: 67px;
246
    background: url("../static/header-bg.png") repeat-x scroll 0 0 #FFFFFF;
247
}
248

    
249
.header-logo {
250
    padding-top: 19px;
251
}
252

    
253
div#footer-text a {
254
    color: #FFFFFF;
255
    text-decoration: none;
256
}
257

    
258

    
259
div#footer-text{
260
    clear: both;
261
    color: #FFFFFF;
262
    font-size: 75%;
263
    left: 50%;
264
    margin-left: -250px;
265
    padding-top: 10px;
266
    position: absolute;
267
    width: 700px;
268
}
269

    
270
#footer-bg {
271
    background: url("../static/footer-bg.png") no-repeat scroll 0 0 #4085A5;
272
    float:right;
273
    width: 700px;
274
    height: 119px;
275
    background-position:right;
276
}
277

    
278

    
279
div#wrapper {
280
    width: 700px;
281
    margin: 0em auto;
282
}
283

    
284
.modal {
285
    background-color:#fff;
286
    display:none;
287
    width:30em;
288
    padding:1em;
289
    text-align:left;
290
}
291

    
292
/* server wizard scrollable root element and network wizard */
293
#wizard, #networks-wizard {
294
    font-size:9pt;
295
    height:405px;
296
    width:453px;
297
    overflow:hidden;
298
    position:absolute !important;
299
}
300

    
301
/* scrollable items */
302
#wizard .items {
303
    width:20000em;
304
    clear:both;
305
    position:absolute;
306
    display:block;
307
    padding: 0;
308
    margin: 0;
309
    border:none;
310
    background:none;
311
}
312

    
313
/* single item */
314
#wizard .page, #networks-wizard div.container {
315
    padding: 15px 40px 20px 15px;
316
    width:447px;
317
    float:left;
318
    display:block;
319
    border:none;
320
    background-color: transparent;
321
}
322

    
323
#networks-wizard div.container {
324
    background-color: #ECF4F8;
325
    width:400px;
326
    height: 180px;
327
    margin-bottom:50px;
328
}
329

    
330
/* title */
331
#wizard h2, #networks-wizard h2 {
332
    color: black;
333
    font-size: 100%;
334
    font-weight: normal;
335
    padding-left: 20px;
336
}
337

    
338
#networks-wizard h2 {
339
    margin-top: 15px;
340
}
341

    
342
#wizard li {
343
    margin-bottom:1.2em;
344
}
345

    
346
#wizard .pane li {
347
    margin: 0;
348
}
349

    
350
#wizard label {
351
    font-size:16px;
352
    display:block;
353
    clear: both;
354
}
355

    
356
#wizard label strong {
357
    position:relative;
358
    top:-1px;
359
    font-size: 80%;
360
    font-weight: normal;
361
}
362

    
363
#wizard label em {
364
    font-size:9pt;
365
    color:#666;
366
    font-style:normal;
367
}
368

    
369
#wizard .text {
370
    width: 270px;
371
    padding: 5px;
372
    margin-top: 10px;
373
    border: 1px solid #ccc;
374
    color: #456;
375
    letter-spacing: 1px;
376
}
377

    
378
#wizard select {
379
    border:1px solid #ccc;
380
    width:94%;
381
    padding:4px;
382
    display: none;
383
}
384

    
385
#wizard .double label {
386
    width:50%;
387
    float:left;
388
}
389

    
390
#wizard .double .text {
391
    width:93%;
392
}
393

    
394
#wizard .clearfix {
395
    clear:left;
396
    padding-top:10px;
397
}
398

    
399
#wizard .right {
400
    float:right;
401
}
402

    
403
#wizard .error {
404
    border:1px solid red;
405
}
406

    
407
#wizard a:hover div.image {
408
    background-color: #C5DEE9;
409
}
410

    
411
.selecteddiv {
412
    background-color: #C5DEE9 !important;
413
}
414

    
415
#wizard label a:hover strong {
416
    color: black;
417
}
418

    
419
#wizard div.image span.size {
420
    font-size: 9pt;
421
    color: #666;
422
}
423

    
424
#wizard div.image .radio {
425
    float: left;
426
    margin-top: 10px;
427
}
428

    
429
#wizard div.image span.image-id, #wizard div.image span.description {
430
    font-size: 9pt;
431
    color: #666;
432
    font-weight: normal;
433
    display:inline;
434
}
435

    
436
#wizard a:hover div.image span.image-id, #wizard a:hover div.image span.description, #wizard a:hover div.image span.size {
437
    color: black;
438
}
439

    
440
#wizard .cost {
441
    color: #79A4C1;
442
    margin-top: 40px;
443
    clear:both;
444
    padding-left: 15px;
445
    font-size: 95%;
446
}
447

    
448
#wizard #status {
449
    height: 50px;
450
    background: #4085A5;
451
    width: 450px;
452
}
453

    
454
#wizard .headernumber {
455
    font-size: 470%;
456
}
457

    
458
#wizard .headerbody {
459
    font-size: 120%;
460
    font-weight: normal;
461
    display: inline;
462
    top: -15px;
463
    position: relative;
464
}
465

    
466
#wizard .first {
467
    left: -8px;
468
}
469

    
470
#wizard .third {
471
    margin-top: -1px !important;
472
}
473

    
474
#wizard .topruler, #networks-wizard .topruler {
475
    background-color: #CDE2EC;
476
    border: 0 none;
477
    height: 4px;
478
    margin-left: -1px;
479
    width: 447px;
480
    margin-bottom: 6px;
481
    margin-top: 6px;
482
}
483

    
484
#wizard .bottomruler, #networks-wizard .bottomruler {
485
    background-color: #CDE2EC;
486
    border: 0 none;
487
    height: 4px;
488
    margin-left: -1px;
489
    width: 447px;
490
    margin-bottom:6px;
491
    margin-top:6px;
492
}
493

    
494
#networks-wizard .topruler, #networks-wizard .bottomruler {
495
    width: 455px;
496
    float: left;
497
}
498

    
499
#wizard #cancel, #networks-wizard .cancel {
500
    background-color: #4085A5;
501
    border-color: #4085A5;
502
    text-align: center !important;
503
}
504

    
505
#wizard #cancel:hover, #networks-wizard .cancel:hover {
506
    background-color: #7DB4CD;
507
    border-color: #7DB4CD;
508
}
509

    
510
#wizard #start, #networks-wizard .create {
511
    text-align: center;
512
    background-color: #FF6600;
513
    border-color: #FF6600;
514
}
515

    
516
#networks-wizard .create {
517
    float:right;
518
    width: 140px;
519
}
520

    
521
#wizard #start:hover, #networks-wizard .create:hover {
522
    background-color: #FF9651;
523
    border-color: #FF9651;
524
}
525

    
526
#wizard .separator-end {
527
    background-color: #387693;
528
    height: 5px;
529
    margin-left: -14px;
530
    margin-top: 362px;
531
    width: 550px;
532
}
533

    
534
.page ul {
535
    height: 270px;
536
    overflow: auto;
537
}
538

    
539
.panes ul.pane {
540
    height: 220px;
541
}
542

    
543
#wizard #tabscontainer {
544
    background-color: #CDE2EC;
545
    height: 20px;
546
    margin-top: -3px;
547
    width: 448px;
548
}
549

    
550
.page ul.tabs {
551
    overflow: hidden;
552
    height: auto;
553
    margin-bottom: 3px;
554
    margin-top: -1px;
555
}
556

    
557
.page ul.tabs li {
558
    float: right;
559
    margin: 0 0.2em;
560
}
561

    
562
#status li {
563
    float: left;
564
    color: #387693;
565
    padding: 0px 32px 0 33px;
566
    bottom: 0px;
567
}
568

    
569
#status li.active .headernumber {
570
    color: #FFFFFF;
571
}
572

    
573
#status li.active .headerbody {
574
    color: #FFFFFF;
575
}
576

    
577
div.image-container {
578
    border-bottom: 1px solid #CCCCCC;
579
    margin-left: 10px;
580
    margin-right: 10px;
581
}
582

    
583
#page2-container {
584
    background-color: #ECF4F8;
585
    padding-top: 25px;
586
    height: 180px;
587
}
588

    
589
#page3-container {
590
    background-color: #ECF4F8;
591
    padding-left: 50px;
592
    height: 244px;
593
    margin-bottom: 32px;
594
}
595

    
596
/* slider root element */
597
.slider {
598
    border: 1px solid #666;
599
    cursor: pointer;
600
    display: inline !important;
601
    float: left;
602
    margin: 5px 0 20px 10px;
603
    position: relative;
604
    width: 250px;
605
}
606

    
607
.sliders {
608
    float:left;
609
    width: 40px;
610
    margin-left: 10px;
611
    margin-top: 3px;
612
}
613

    
614
.units {
615
    padding-left:10px;
616
}
617

    
618
.slider-container {
619
    padding-bottom: 15px;
620
    margin-left: 5px;
621
}
622

    
623
/* drag handle */
624
.handle {
625
    -moz-box-shadow: 0 0 2px #000000;
626
    background: url("../static/h30.png") repeat-x scroll 0 0 #FFFFFF;
627
    border: 1px solid #000000;
628
    cursor: move;
629
    display: block;
630
    height: 10px;
631
    margin-top: -8px;
632
    position: absolute;
633
    width: 8px;
634
}
635

    
636
/* progress bar (enabled with progress: true) */
637
.progress {
638
    height: 3px;
639
    background-color: #387693;
640
}
641

    
642
/* the input field */
643
.range {
644
    float: left;
645
    font-size: 100%;
646
    margin: -3px 0 0 15px;
647
    padding: 2px 10px 2px 0;
648
    text-align: right;
649
    width: 40px;
650
    border: 1px solid #387693;
651
}
652

    
653
.selectedrange {
654
    border-color: #5599FF;
655
}
656

    
657
#credits-indicator {
658
    background-color: #ECF4F8;
659
    float: none;
660
    margin: 0 0 0 10px;
661
    border: 1px solid #387693;
662
    color: #222222;
663
}
664

    
665
.machine-container {
666
    min-height: 65px;
667
    margin: 2px 0 0 -32px;
668
    padding: 0 4px 0;
669
    clear: both;
670
    width: 523px;
671
}
672

    
673
div.machine {
674
    color: #666;
675
    min-height: 65px;
676
    padding-right: 15px;
677
    padding-top: 2px;
678
}
679

    
680
.machine a {
681
    color: #3d3d3d;
682
    font-weight: normal;
683
    text-decoration: none;
684
    font-size: 9pt;
685
}
686

    
687
.machine a:hover {
688
    color: #000;
689
    text-decoration: underline;
690
}
691

    
692
.machine .name, .machine .ip {
693
    text-decoration: none !important;
694
    margin-top: 7px;
695
}
696

    
697
.oldValue {
698
    display:none;
699
}
700

    
701
.state {
702
    float: right;
703
}
704

    
705
.state div {
706
    text-align: right;
707
    margin-right: 3px;
708
}
709

    
710
div.machine div.actions {
711
    float: right;
712
    width: 70px;
713
    margin: 0 -80px 0 0;
714
    font-weight: normal;
715
    height: 68px;
716
    position: relative;
717
}
718

    
719
div.machine div.actions a {
720
    color: transparent;
721
    margin: 0 0 5px 8px;
722
    display: block;
723
}
724

    
725
div.machine div.actions a.action-shutdown {
726
    margin-bottom: 5px;
727
    display: block;
728
}
729

    
730
div.machine div.actions a.shutdown-padding {
731
    margin-bottom: 22px;
732
}
733

    
734
div.machine div.actions a.destroy-padding {
735
    margin-top: 52px;
736
}
737

    
738
div.actions a.enabled:hover{
739
    color: black !important;
740
    text-decoration: underline;
741
    display: block;
742
}
743

    
744
.machine:hover .actions a {
745
    color: #3d3d3d;
746
    display: block;
747
}
748

    
749
div.machine div.display a{
750
    color: #3d3d3d;
751
    display: block;
752
}
753

    
754
div.machine div.actions a.selected:hover {
755
    color: orange;
756
}
757

    
758
div.running div.machine div.actions .disabled {
759
    display: none;
760
}
761

    
762
div.terminated div.machine div.actions .disabled {
763
    display: none;
764
}
765

    
766
div.terminated div.machine div.actions a.action-destroy {
767
    position: absolute;
768
    bottom: 0;
769
}
770

    
771
div.running div.machine div.actions a.action-destroy {
772
    position: absolute;
773
    bottom: 0;
774
}
775

    
776
.machine:hover {
777
    background-color:#CDE2EC;
778
}
779

    
780
.standard .machine img {
781
    float: left;
782
    margin: 7px 14px 0;
783
}
784

    
785
.list .machine img {
786
    margin: 0;
787
}
788

    
789
div.ip, div.state {
790
    font-size: 9pt;
791
    color: #3d3d3d;
792
}
793

    
794
div.indicator {
795
    width:10px;
796
    height:11px;
797
    margin: 3px -1px;
798
    clear: none;
799
    float:right;
800
}
801

    
802
.view-separator {
803
    color:#5F8DD3;
804
}
805

    
806
.running .indicator {
807
    border-top: 2px solid white;
808
    border-bottom: 2px solid white;
809
    border-left: 2px solid white;
810
    border-right: 3px solid white;
811
    background-color: #4085A5;
812
}
813

    
814
.running {
815
    background-color: white;
816
    margin-left: -35px;
817
    margin-top: -76px;
818
    padding-bottom: 15px;
819
    padding-left: 35px;
820
    padding-top: 15px;
821
    width: 664px;
822
    min-height: 50px;
823
}
824

    
825
.terminated {
826
    background-color: white;
827
    margin-bottom: 17px;
828
    margin-left: -35px;
829
    margin-top: 15px;
830
    padding-bottom: 15px;
831
    padding-left: 35px;
832
    padding-top: 15px;
833
    width: 664px;
834
    opacity: 0.8;
835
    filter: alpha(opacity = 80);
836
}
837

    
838
.terminated .machine .state .status {
839
    color: #666;
840
}
841

    
842
.machine:hover div.uptime, .machine:hover a.rename, .machine:hover a.configure {
843
    color: #3d3d3d;
844
}
845

    
846
div.uptime {
847
    clear: both;
848
    color: transparent;
849
    margin-left: 1px;
850
}
851

    
852
div.machine-tabs {
853
    margin-top: 1em;
854
}
855

    
856
span.rename, span.configure {
857
    background-repeat: no-repeat;
858
    color: transparent;
859
    font-size: 9pt;
860
    font-weight: normal;
861
    margin-left: 10px;
862
    padding-left: 10px;
863
    text-align: left;
864
}
865

    
866
span.rename {
867
    cursor: pointer;
868
}
869

    
870
div.name:hover span.rename {
871
    color: #3D3D3D;
872
    margin-top: 0.4em;
873
    background-image: url(/static/pencil.png);
874
    background-position: 0 3px;
875
}
876

    
877

    
878
a.settings:hover span.configure {
879
    color: #3D3D3D;
880
}
881

    
882
button {
883
    background-color: #87AADE;
884
    border: 1px solid #87AADE;
885
    color: #FFFFFF;
886
    cursor: pointer;
887
    height: 23px;
888
    width: 120px;
889
}
890

    
891
button.next {
892
    background-color: #4085A5;
893
    border-color: #4085A5;
894
    text-align: right;
895
}
896

    
897
button.next:hover {
898
    background-color: #7DB4CD;
899
    border-color: #7DB4CD;
900
}
901

    
902
button.prev {
903
    background-color: #4085A5;
904
    border-color: #4085A5;
905
    margin-left: -1px;
906
    text-align: left;
907
}
908

    
909
button.prev:hover {
910
    background-color: #7DB4CD;
911
    border-color: #7DB4CD;
912
}
913

    
914
.image-logo {
915
    float: left;
916
    margin-right: 1em;
917
    margin-left: 1.5em;
918
    margin-top: 4px;
919
}
920

    
921
div.image {
922
    clear: both;
923
    display: block;
924
    margin-bottom: 3px;
925
    margin-top: 3px;
926
    padding: 5px;
927
}
928

    
929
div#view-select {
930
    float: right;
931
    clear: both;
932
    color: white;
933
    position: relative;
934
    right: -25px;
935
    top: -35px;
936
    display: none;
937
}
938

    
939
a#standard, a#list, a#single {
940
    text-decoration: none;
941
    height: 15px;
942
    width: 17px;
943
    padding: 1px 8px 2px 9px;
944
}
945

    
946
div#view-select a {
947
    color:#5f8dd3;
948
}
949

    
950
a#list:hover {
951
    background: #5f8dd3;
952
}
953

    
954
a#standard:active, a#list:active {
955
    color:white;
956
}
957

    
958
a#standard {
959
    background: url(/static/icon-view.png) no-repeat -36px 0;
960
}
961

    
962
a#list {
963
    background: url(/static/list-view.png) no-repeat -36px 0;
964
}
965

    
966
a#single {
967
    background: url(/static/single-view.png) no-repeat -36px 0;
968
}
969

    
970
a#standard:hover {
971
    background: url(/static/icon-view.png) no-repeat -18px 0;
972
}
973

    
974
a#list:hover {
975
    background: url(/static/list-view.png) no-repeat -18px 0;
976
}
977

    
978
a#single:hover {
979
    background: url(/static/single-view.png) no-repeat -18px 0;
980
}
981

    
982
a#standard.activelink {
983
    background: url(/static/icon-view.png) no-repeat 0px 0;
984
}
985

    
986
a#list.activelink {
987
    background: url(/static/list-view.png) no-repeat 0px 0;
988
}
989

    
990
a#single.activelink {
991
    background: url(/static/single-view.png) no-repeat 0px 0;
992
}
993

    
994
#machinetype {
995
    background-color: #CDE2EC;
996
    height: 25px;
997
    margin-bottom: 4px !important;
998
}
999

    
1000
div.machine-type {
1001
    float: left;
1002
    margin: 4px 18px 20px;
1003
}
1004

    
1005
.machine-type .active {
1006
    color: #FFFFFF
1007
}
1008

    
1009
#machinesview {
1010
    min-height: 270px;
1011
    margin-top: 30px;
1012
}
1013

    
1014
.list#machinesview {
1015
    margin-left: -20px;
1016
    display:none;
1017
}
1018

    
1019
#machinesview-list.list {
1020
    background-color: white;
1021
    margin-left: -35px;
1022
    margin-top: -76px;
1023
    padding-left: 15px;
1024
    padding-top: 76px;
1025
    width: 683px;
1026
}
1027

    
1028
#machinesview_content {
1029
    display:none;
1030
}
1031

    
1032
.list-machines {
1033
    min-width: 515px;
1034
}
1035

    
1036
#emptymachineslist {
1037
    display:none;
1038
    color: #A0A0A0;
1039
    background-image: url(/static/emptydegradebg.png);
1040
    width: 400px;
1041
    margin-top: 5px;
1042
    padding: 5px;
1043
    padding-left: 10px;
1044
    margin-left: -10px;
1045
}
1046

    
1047
#welcomeheader {
1048
    color:white;
1049
}
1050

    
1051
.welcomebody {
1052
    color:black;
1053
    font-size:80%;
1054
}
1055

    
1056
.welcomebody a {
1057
    color:black;
1058
}
1059

    
1060
.welcomefooter {
1061
    color:black;
1062
    font-size:60%;
1063
}
1064

    
1065
.welcomefooter a {
1066
    color:black;
1067
}
1068

    
1069
.emptycreatecontainer {
1070
    margin-left: 430px !important;
1071
    position: absolute;
1072
    margin-top: 5px !important;
1073
    width: 180px;
1074
    background-color: #CCCCCC;
1075
    padding: 5px;
1076
    padding-left: 10px;
1077
}
1078

    
1079
.emptycreate {
1080
    margin: 20px 10px 5px 0 !important;
1081
}
1082

    
1083
#createbody {
1084
    display:none;
1085
    font-size: 80%;
1086
}
1087

    
1088
div.list label img {
1089
    margin: 5px 5px -3px 0;
1090
}
1091

    
1092
div.list label {
1093
    color: #3D3D3D;
1094
    font-size: 9pt;
1095
}
1096

    
1097
div.list .state {
1098
    margin-top: 7px;
1099
    margin-right: 10px;
1100
}
1101

    
1102
div.list table tbody {
1103
    margin-top: 8px;
1104
}
1105

    
1106
div.list .stopped {
1107
    margin-top: 8px;
1108
}
1109

    
1110
/* root element for tabs  */
1111
#wizard ul.tabs {
1112
    margin-right: -1px;
1113
    float: right;
1114
}
1115

    
1116
#wizard div.panes {
1117
    height: 250px;
1118
    margin-bottom: 6px;
1119
    clear:both;
1120
}
1121

    
1122
.typebody {
1123
    font-size: 80%;
1124
    font-weight: normal;
1125
    position: relative;
1126
    top: -3px;
1127
}
1128

    
1129
.typehover {
1130
    color: #FFFFFF;
1131
}
1132

    
1133
#label-name {
1134
    margin-top: 15px;
1135
}
1136

    
1137
/* single tab */
1138
#wizard ul.tabs li {
1139
    margin-bottom: 0;
1140
    list-style-type:none;
1141
    float: left;
1142
}
1143

    
1144
/* link inside the tab. uses a background image */
1145
#wizard ul.tabs a {
1146
    display:block;
1147
    padding: 0.3em 0.5em 0.5em 0.4em;
1148
    text-decoration:none;
1149
    color: #FFFFFF;
1150
    position:relative;
1151
    top:1px;
1152
    outline:0;
1153
    background-color: transparent;
1154
    text-align: center;
1155
    width: 100px;
1156
    white-space: nowrap;
1157
}
1158

    
1159
#wizard ul.tabs a:hover {
1160
    color: #FFFFFF;
1161
    background-color:#4085A5;
1162
}
1163

    
1164
/* selected tab */
1165
#wizard ul.tabs a.current {
1166
    color: white;
1167
    background-color: #7DB4CD;
1168
    cursor: default;
1169
}
1170

    
1171
#wizard #standard-images {
1172
    background-color: #ECF4F8;
1173
}
1174

    
1175
div.list div.actions {
1176
    display: none;
1177
    clear: left;
1178
    float: right;
1179
    margin-right: 15px;
1180
    margin-top: 37px;
1181
    text-align: right;
1182
    width: 150px;
1183
}
1184

    
1185
div.list div.actions a {
1186
    clear: left;
1187
    color: #D3D3D3;
1188
    display: block;
1189
    font-size:9pt;
1190
    margin-bottom: 2px;
1191
}
1192

    
1193
div.list div.actions a.enabled {
1194
    color: #3D3D3D;
1195
}
1196

    
1197
div.list div.actions a.enabled:hover{
1198
    cursor: pointer;
1199
    color: black;
1200
    text-decoration: underline;
1201
}
1202

    
1203
input.machine {
1204
    width: 13px;
1205
    height: 13px;
1206
    top: -1px;
1207
    overflow: hidden;
1208
}
1209

    
1210
.description-container {
1211
    display: inline-block;
1212
    position: relative;
1213
    width: 300px;
1214
}
1215

    
1216
/* metadata editing and add machines to network overlays */
1217
#metadata-wizard, #add-machines-wizard {
1218
    position:fixed;
1219
    overflow:hidden;
1220
    width:450px;
1221
    display:none;
1222
    background-color:#fff;
1223
    text-align:left;
1224
    font-size: 80%;
1225
    border-bottom: 5px solid #4085A5;
1226
}
1227

    
1228
#metadata-wizard .close, #add-machines-wizard .close  {
1229
    background-image: url("/static/close-popup.png");
1230
    cursor: pointer;
1231
    height: 13px;
1232
    position: absolute;
1233
    right: 7px;
1234
    top: 9px;
1235
    width: 13px;
1236
}
1237

    
1238
#metadata-wizard .popup-header, #add-machines-wizard .popup-header {
1239
    background-color: #4085A5;
1240
    color: white;
1241
    font-size: 95%;
1242
    font-weight: normal;
1243
    height: 20px;
1244
    margin-left: -16px;
1245
    margin-top: -16px;
1246
    padding-bottom: 2px;
1247
    padding-left: 30px;
1248
    padding-top: 10px;
1249
    width: 482px;
1250
}
1251

    
1252
#metadata-wizard .popup-title, #metadata-wizard .machine-name, #add-machines-wizard .popup-title, #add-machines-wizard .network-name {
1253
    font-size: 120%;
1254
    padding-bottom: 7px;
1255
    padding-top: 10px;
1256
    float:left;
1257
}
1258

    
1259
#metadata-wizard .popup-title {
1260
    padding-bottom: 0px;
1261
    font-size: 120%;
1262
}
1263

    
1264
#metadata-wizard .name-container {
1265
    display: inline-block;
1266
}
1267

    
1268
#add-machines-wizard .network-name {
1269
    padding-left: 5px;
1270
}
1271

    
1272
#metadata-wizard .popup-body, #add-machines-wizard .popup-body {
1273
    background-image: url("/static/meta-wiz-bg.png");
1274
    margin-left: -16px;
1275
    margin-right: -16px;
1276
    margin-top: 1px;
1277
    height: 250px;
1278
    overflow-y: auto;
1279
    overflow-x: hidden;
1280
}
1281

    
1282
#metadata-wizard .popup-body-inner, #add-machines-wizard .popup-body-inner {
1283
    background-image: url("/static/meta-wiz-inner-bg.png");
1284
    font-size: 80%;
1285
    height: 180px;
1286
    margin-left: 25px;
1287
    margin-top: 10px;
1288
    padding-left: 15px;
1289
    width: 420px;
1290
}
1291

    
1292
#metadata-wizard .popup-separator, #add-machines-wizard .popup-separator {
1293
    background-color: #74AEC9;
1294
    height: 1px;
1295
    width: 402px;
1296
    margin-bottom: 30px;
1297
    clear: left;
1298
}
1299

    
1300
#metadata-wizard .metadata-pair-template {
1301
    height: 15px;
1302
    padding-top: 2px;
1303
    width: 350px;
1304
}
1305

    
1306
#metadata-wizard .metadata-pair-template:hover {
1307
    background-color: #74AEC9;
1308
}
1309

    
1310
#metadata-wizard .metadata-container, #add-machines-wizard .machines-container {
1311
    float: left;
1312
    width: 400px;
1313
    font-size: 120%;
1314
}
1315

    
1316
#metadata-wizard .machine-icon {
1317
    float: left;
1318
    padding-left: 10px;
1319
    padding-right: 3px;
1320
    padding-top: 7px;
1321
}
1322

    
1323
#metadata-wizard .large-spinner, #add-machines-wizard .large-spinner {
1324
    display: block;
1325
    margin: 50px 0 0 185px;
1326
}
1327

    
1328
#metadata-wizard .metadata-key {
1329
    float: left;
1330
    width: 110px;
1331
    padding-left: 5px;
1332
}
1333

    
1334
#metadata-wizard .metadata-value {
1335
    width: 300px;
1336
}
1337

    
1338
#metadata-wizard .metadata-add-template {
1339
    background-color: #74AEC9;
1340
    width: 350px;
1341
}
1342

    
1343
#metadata-wizard #add-meta-value {
1344
    margin-left: 10px;
1345
    width: 150px;
1346
}
1347

    
1348
#metadata-wizard button, #add-machines-wizard button {
1349
    font-size: 80%;
1350
    width: 87px;
1351
    float: right;
1352
    background-color: #5599FF;
1353
    border: 0px solid #5599FF;
1354
    padding: 0;
1355
    text-align: center;
1356
    margin-right: 8px;
1357
}
1358

    
1359
#metadata-wizard .buttons, #add-machines-wizard .buttons {
1360
    border-top: 2px solid #4085A5;
1361
    height: 30px;
1362
    margin-left: 25px;
1363
    margin-right: 40px;
1364
    width: 400px;
1365
    font-size: 120%;
1366
}
1367

    
1368
#metadata-wizard button.save, #add-machines-wizard button.cancel {
1369
    float: left;
1370
    height: 23px;
1371
    margin: 10px 0 0 0;
1372
    width: 87px;
1373
    background-color: #4085A5;
1374
    border-color: #4085A5;
1375
}
1376

    
1377
#metadata-wizard button.save:hover, #add-machines-wizard button.cancel:hover {
1378
    background-color: #7DB4CD;
1379
    border-color: #7DB4CD;
1380
}
1381

    
1382
#metadata-wizard button.create, #add-machines-wizard button.add {
1383
    height: 23px;
1384
    margin: 10px 0 0 0;
1385
    background-color: #FF6600;
1386
    border-color: #FF6600;
1387
}
1388

    
1389
#metadata-wizard button.create:hover, #add-machines-wizard button.add:hover {
1390
    background-color: #FF9651;
1391
    border-color: #FF9651;
1392
}
1393

    
1394
#metadata-wizard .editbuttons {
1395
    margin-top: 4px;
1396
    margin-right: 0;
1397
}
1398

    
1399
#metadata-wizard .vertical-separator {
1400
    height: 17px;
1401
    width: 1px;
1402
    background-color: #74AEC9;
1403
    float:left;
1404
    margin-right: 10px;
1405
}
1406

    
1407
#metadata-wizard h3, #add-machines-wizard h3 {
1408
    font-weight:normal;
1409
}
1410

    
1411
#metadata-wizard .metadata-edit {
1412
    clear: none;
1413
    cursor: pointer;
1414
    float: right;
1415
    margin-right: 0;
1416
    width: 40px;
1417
    margin-top: -14px;
1418
    display:none;
1419
}
1420

    
1421
#metadata-wizard .metadata-edit .edit, #metadata-wizard .metadata-edit .remove {
1422
    background-repeat: no-repeat;
1423
    color: transparent;
1424
    font-size: 9pt;
1425
    float: left;
1426
    width: 16px;
1427
    height: 16px;
1428
}
1429

    
1430
#metadata-wizard .addbuttons {
1431
    display: block;
1432
    clear: none;
1433
    width: 40px;
1434
    margin-right: -1px !important;
1435
    margin-top: 2px;
1436
    float:right;
1437
    cursor: pointer;
1438
}
1439

    
1440
.metadata-pair-template .editbuttons {
1441
    margin-top: -19px !important;
1442
    margin-right: -2px !important;
1443
}
1444

    
1445
#metadata-wizard .metadata-edit .edit {
1446
    background-image: url("../static/meta-edit.png");
1447
    margin-left: 3px;
1448
}
1449

    
1450
#metadata-wizard .metadata-edit .remove, #metadata-wizard .editbuttons .remove {
1451
    background-image: url("../static/meta-remove.png");
1452
    margin-left: 1px;
1453
    background-repeat: no-repeat;
1454
    color: transparent;
1455
    font-size: 9pt;
1456
    height: 16px;
1457
    width: 16px;
1458
    float: left;
1459
}
1460

    
1461
#metadata-wizard .editbuttons .save {
1462
    background-image: url("../static/meta-save.png");
1463
    padding-top:0;
1464
}
1465

    
1466
#metadata-wizard .addbuttons .cancel {
1467
    background-image: url("../static/meta-remove.png");
1468
    margin-left: 3px;
1469
}
1470

    
1471
#metadata-wizard .addbuttons .save {
1472
    background-image: url("../static/meta-save.png");
1473
    margin-left: 1px;
1474
}
1475

    
1476
#metadata-wizard .metadata-edit .edit, #metadata-wizard .metadata-edit .remove, #metadata-wizard .editbuttons .remove, #metadata-wizard .editbuttons .save, #metadata-wizard .addbuttons .cancel, #metadata-wizard .addbuttons .save {
1477
    background-color: #4287a7;
1478
}
1479

    
1480
#metadata-wizard .metadata-edit .edit:hover, #metadata-wizard .metadata-edit .remove:hover, #metadata-wizard .editbuttons .remove:hover, #metadata-wizard .editbuttons .save:hover, #metadata-wizard .addbuttons .cancel:hover, #metadata-wizard .addbuttons .save:hover {
1481
    background-color: #74AEC9;
1482
}
1483

    
1484
#metadata-wizard .addbuttons .cancel, #metadata-wizard .addbuttons .save {
1485
    width: 16px;
1486
    height: 16px;
1487
    float: left;
1488
    background-repeat: no-repeat;
1489
    color: transparent;
1490
}
1491

    
1492
#metadata-wizard .metatextbox {
1493
    font-size: 90%;
1494
    height: 10px;
1495
    margin-top: -2px;
1496
    color: black;
1497
    width: 150px;
1498
}
1499

    
1500
#metadata-wizard p, #add-machines-wizard p {
1501
    margin-left: 7px;
1502
    width: 200px;
1503
}
1504

    
1505
#metadata-wizard div.bottomruler, #add-machines-wizard div.bottomruler {
1506
    background-color: #666;
1507
    height: 20px;
1508
    margin-top: 17px;
1509
}
1510

    
1511
#metadata-wizard button.remove {
1512
    height: 15px;
1513
    width: 70px;
1514
    background-color: #d35f5f;
1515
    border-color: #d35f5f;
1516
}
1517

    
1518
#metadata-wizard button.edit {
1519
    height: 15px;
1520
    width: 70px;
1521
    background-color: #666;
1522
    border-color: #666;
1523
    margin-top: -12px;
1524
}
1525

    
1526
#metadata-wizard input {
1527
    font-style: italic;
1528
    color: #ccc;
1529
}
1530

    
1531
#metadata-wizard textarea.edit-meta-value {
1532
    font-style: normal;
1533
    text-align: left;
1534
    color: black;
1535
    margin-top: 2px;
1536
    width:200px;
1537
    height: 49px;
1538
}
1539

    
1540
#metadata-wizard input {
1541
    font-size: 80%;
1542
}
1543

    
1544
#metadata-wizard input.key {
1545
    height: 15px;
1546
    left: 460px;
1547
    position: absolute;
1548
    top: 83px;
1549
    width: 230px;
1550
}
1551

    
1552
#metadata-wizard textarea.value {
1553
    width: 267px;
1554
    height: 170px;
1555
    overflow: auto;
1556
}
1557

    
1558
#metadata-wizard .input-enabled {
1559
    color: black;
1560
    text-align: left;
1561
    font-style: normal;
1562
}
1563

    
1564
#metadata-wizard label.meta-value {
1565
    vertical-align: top;
1566
}
1567

    
1568
#metadata-wizard button.cancel, #metadata-wizard #edit-dialog button.close {
1569
    float: left;
1570
    margin: 4px 0 0 25px;
1571
    background-color: #d35f5f;
1572
    border-color: #d35f5f;
1573
}
1574

    
1575
/* metadata dropdown combo */
1576
.meta-key {
1577
    margin-right: 18px;
1578
    float:left;
1579
}
1580
#metadata-wizard .textdropdown-outer {
1581
    float: left;
1582
}
1583

    
1584
#metadata-wizard .textdropdown-btn {
1585
    width: 20px;
1586
    float: right;
1587
    background: url("/static/dropdown-arrow.gif") no-repeat center;
1588
    cursor: pointer;
1589
    left: 147px;
1590
    margin-top: 3px;
1591
    position: absolute;
1592
}
1593

    
1594
#metadata-wizard ul {
1595
    border: 1px solid #ccc;
1596
    padding: 0px;
1597
    list-style: none;
1598
    margin: 0px;
1599
    background-color: white;
1600
    height: auto !important;
1601
    padding-left: 5px;
1602
    width: 103px !important;
1603
}
1604

    
1605
#metadata-wizard ul li {
1606
    clear: both;
1607
    display: block;
1608
    float: right;
1609
    list-style: none outside none;
1610
    margin-bottom: 0 !important;
1611
    margin-left: 0 !important;
1612
    padding-bottom: 2px;
1613
    padding-right: 2px;
1614
    padding-top: 2px;
1615
    width: 100%;
1616
}
1617

    
1618
#metadata-wizard ul li:hover {
1619
    background-color: #efefef;
1620
    cursor: pointer;
1621
}
1622

    
1623
#metadata-wizard .dropdownitem {
1624
    margin-left: 10px;
1625
}
1626

    
1627
#metadata-wizard #txtdropdown:focus {
1628
    outline: 0 none;
1629
}
1630

    
1631
#metadata-wizard #add-meta-key {
1632
    height: 12px;
1633
    margin-left: 5px;
1634
    margin-top: 2px;
1635
    width: 108px !important;
1636
}
1637

    
1638
/* notification box */
1639
#yes-no {
1640
    height: 150px;
1641
    z-index: 9999;
1642
    border-bottom: 5px solid #4085A5;
1643
}
1644

    
1645
#yes-no p, #yes-no button {
1646
    margin-top: 15px;
1647
}
1648

    
1649
#error-success {
1650
    z-index: 9999;
1651
    border-bottom: 5px solid #4085A5;
1652
    min-height: 150px;
1653
    top: 120px !important;
1654
}
1655

    
1656
#error-success p {
1657
    margin-top: 5px;
1658
}
1659

    
1660
#error-success strong {
1661
    color: #F49C1A;
1662
}
1663

    
1664
#error-success .close {
1665
    background-image: url("/static/close-popup.png");
1666
    cursor: pointer;
1667
    height: 13px;
1668
    position: absolute;
1669
    right: 7px;
1670
    top: 9px;
1671
    width: 13px;
1672
}
1673

    
1674
.popup-header-error {
1675
    background-color: #800000 !important;
1676
}
1677

    
1678
.popup-border-error {
1679
    border-color: #800000 !important;
1680
}
1681

    
1682
.popup-details-error {
1683
    border: none !important;
1684
}
1685

    
1686
.popup-separator-error {
1687
    margin-bottom: 5px !important;
1688
}
1689

    
1690
#error-success .popup-header {
1691
    background-color: #4085A5;
1692
    color: white;
1693
    font-size: 95%;
1694
    font-weight: normal;
1695
    height: 20px;
1696
    margin-left: -16px;
1697
    margin-top: -16px;
1698
    padding-bottom: 2px;
1699
    padding-left: 30px;
1700
    padding-top: 10px;
1701
    width: 482px;
1702
}
1703

    
1704
#error-success .popup-body {
1705
    background-image: url("/static/popup-bg.png");
1706
    margin-left: -16px;
1707
    margin-right: -16px;
1708
    margin-top: 1px;
1709
    min-height: 142px;
1710
    padding-top: 10px;
1711
}
1712

    
1713
#error-success .popup-body-inner {
1714
    background-image: url("/static/popup-inner-bg.png");
1715
    font-size: 80%;
1716
    min-height: 120px;
1717
    margin-left: 20px;
1718
    padding-left: 15px;
1719
    width: 460px;
1720
}
1721

    
1722
#error-success .popup-separator {
1723
    background-color: #74AEC9;
1724
    height: 1px;
1725
    width: 442px;
1726
    margin-bottom: 30px;
1727
}
1728

    
1729
#error-success .machine-now-building {
1730
    font-size: 95%;
1731
    padding-bottom: 7px;
1732
    padding-top: 10px;
1733
}
1734

    
1735
#error-success .password-container {
1736
    float: left;
1737
    width: 100px;
1738
}
1739

    
1740
#error-success .password-header {
1741
    margin-bottom: 5px;
1742
    text-align: center;
1743
}
1744

    
1745
#error-success .password {
1746
    background-color: #FF7F2A;
1747
    height: 20px;
1748
    padding-top: 5px;
1749
    text-align: center;
1750
    width: 100px;
1751
}
1752

    
1753
#error-success .popup-details {
1754
    border: 2px solid #FF7F2A;
1755
    float: left;
1756
    margin-left: 10px;
1757
    padding: 2px;
1758
}
1759

    
1760
#error-success .write-password {
1761
    color: #FF7F2A;
1762
    margin-bottom: 5px;
1763
}
1764

    
1765
#error-success .write-password-details {
1766
    font-size: 75%;
1767
}
1768

    
1769
.more-details {
1770
    display: block;
1771
    height: 110px;
1772
}
1773

    
1774
.popup-details a:link,  .popup-details a:visited{
1775
    color: black;
1776
}
1777

    
1778
/* Confirmation boxes */
1779
div.confirm_single, div.confirm_multiple {
1780
    display: none;
1781
    background-color: #CDE2EC;
1782
    color: orange;
1783
    font-size: 9pt;
1784
}
1785

    
1786
div.confirm_multiple {
1787
    background-color: #4085A5;
1788
    z-index: 1;
1789
    position: absolute;
1790
}
1791

    
1792
div.action_error {
1793
    float: right;
1794
    width: 80px;
1795
    height: 60px;
1796
    padding: 5px;
1797
    margin: -2px -175px 0 0;
1798
    display: none;
1799
    background-color: #DCDCDC;
1800
    font-size: 9pt;
1801
    color: black;
1802
    line-height: 1.5;
1803
}
1804

    
1805
div.action_error button.details {
1806
    margin: 5px 0 0 0px;
1807
    padding: 0 15px;
1808
}
1809

    
1810
.orange {
1811
    color: orange;
1812
}
1813

    
1814
div.confirm_single button, div.confirm_multiple button, div.action_error button{
1815
    font-size: 9pt;
1816
    background-color: transparent;
1817
    border: 1px solid #5CA1C0;
1818
    color: #3D3D3D;
1819
    cursor: pointer;
1820
    padding: 0px;
1821
    height: 20px !important;
1822
}
1823

    
1824
div.confirm_single button, .action_error button {
1825
    width: 80px !important;
1826
}
1827

    
1828
div.confirm_single button.yes, div.confirm_multiple button.yes {
1829
    border-color: orange;
1830
    padding: 0 12px;
1831
}
1832

    
1833
div.confirm_single button.yes:hover, div.confirm_multiple button.yes:hover {
1834
    background-color: orange;
1835
}
1836

    
1837
div.confirm_single button.no, div.confirm_multiple button.no {
1838
    padding: 0px 16px;
1839
}
1840

    
1841
div.confirm_single button.no:hover, div.confirm_multiple button.no:hover, div.action_error button.details:hover {
1842
    background-color: #5CA1C0;
1843
}
1844

    
1845
div.confirm_single{
1846
    float: right;
1847
    width: 90px;
1848
    height: 66px;
1849
    margin: -2px -175px 0 0;
1850
}
1851

    
1852
div.confirm_single button.yes {
1853
    margin: 5px 0 0 5px;
1854
}
1855

    
1856
div.confirm_single button.no {
1857
    margin: 16px 0 0 5px;
1858
}
1859

    
1860
div.action_error {
1861
    display: none;
1862
}
1863

    
1864
div.confirm_multiple {
1865
    width: 698px;
1866
    height: 28px;
1867
    margin: 15px 0 10px -35px;
1868
}
1869

    
1870
div.confirm_multiple p {
1871
    float: left;
1872
    margin: 7px 0 0 200px;
1873
}
1874

    
1875
div.confirm_multiple button {
1876
    float: right;
1877
    margin: 4px 5px 0 0;
1878
}
1879

    
1880
div.confirm_multiple button.no {
1881
    margin-right: 15px;
1882
}
1883

    
1884
div#aboutuser{
1885
    float:right;
1886
    clear: both;
1887
    color: #FFFFFF;
1888
    font-size: 75%;
1889
    margin-top: -25px;
1890
}
1891

    
1892
div#user{
1893
    float:right;
1894
    clear: both;
1895
    color: #FFFFFF;
1896
    font-size: 75%;
1897
    margin-top: 43px;
1898
}
1899

    
1900
div#user a{
1901
    color: #FFFFFF;
1902
    text-decoration: none;
1903
}
1904

    
1905
div#user a.current_lang {
1906
    color: #72ADC8;
1907
}
1908

    
1909
.separator {
1910
    background-color: #74AEC9;
1911
    height: 10px;
1912
    width: 700px;
1913
    margin: 0 0 0 -36px;
1914
}
1915

    
1916
.machine-separator {
1917
    width: 508px;
1918
    height: 1px;
1919
    margin: 15px 0 0 15px;
1920
    background-color: #DCDCDC;
1921
}
1922

    
1923
#mini.separator {
1924
    width: 535px;
1925
    height: 5px;
1926
    margin: 17px 0 17px -36px;
1927
    display: none;
1928
}
1929

    
1930
#disks.separator {
1931
    background-color: #dea842;
1932
}
1933

    
1934
#images.separator {
1935
    background-color: #87a06d;
1936
}
1937

    
1938
#networks.separator {
1939
    background-color: #6c535d;
1940
}
1941

    
1942
#desktops.separator {
1943
    background-color: #dea842;
1944
}
1945

    
1946
#apps.separator {
1947
    background-color: #87a06d;
1948
}
1949

    
1950
.machine-container .separator {
1951
    width: 508px;
1952
    height: 1px;
1953
    margin-top: 2px;
1954
    background-color: #DCDCDC;
1955
    margin-left: 13px;
1956
}
1957

    
1958
.machine h5 {
1959
    margin: -1px 60px 1px 84px;
1960
}
1961

    
1962
.machine .settings {
1963
    margin-top: 9px;
1964
}
1965

    
1966
.editbuttons {
1967
    display: block;
1968
    clear: none;
1969
    width: 40px;
1970
    margin-right: 32%;
1971
    padding-top: 2px;
1972
    float: right;
1973
    cursor: pointer;
1974
}
1975

    
1976
.editbuttons .save:hover, .editbuttons .cancel:hover {
1977
    background-color: #CCCCCC;
1978
}
1979

    
1980
.editbuttons .cancel:hover {
1981
    background-image: url("../static/cancel-onhover.png");
1982
}
1983

    
1984
.editbuttons .cancel, .editbuttons .save {
1985
    background-repeat: no-repeat;
1986
    color: transparent;
1987
    height: 16px;
1988
    width: 16px;
1989
    float: left;
1990
}
1991

    
1992
.editbuttons .cancel {
1993
    background-image: url("../static/cancel.png");
1994
    margin-left: 3px;
1995
}
1996

    
1997
.editbuttons .save {
1998
    background-image: url("../static/save.png");
1999
    margin-left: 1px;
2000
}
2001

    
2002
.editbuttons img {
2003
    float:none !important;
2004
    margin: 0px !important;
2005
}
2006

    
2007
.namecontainer {
2008
    height: 18px;
2009
}
2010

    
2011
.nametextbox {
2012
    height: 13px;
2013
    font-size: 95%;
2014
}
2015

    
2016
.large-spinner {
2017
    background: url("/static/icons/indicators/large/progress.gif");
2018
    margin-left: 298px;
2019
    margin-top: 80px;
2020
    height: 31px;
2021
    width: 31px;
2022
    position: absolute;
2023
}
2024

    
2025
/* tables in list view */
2026
div.list div.dataTables_filter,  div.list div.dataTables_filter input{
2027
    font-size: 9pt;
2028
    display: none;
2029
}
2030

    
2031
div.list div.dataTables_filter input{
2032
    height: 12px;
2033
    margin-bottom: 12px;
2034
}
2035

    
2036
div.list table {
2037
    width: 515px;
2038
    font-size: 9pt;
2039
}
2040

    
2041
div.list table tbody td {
2042
    color: #3D3D3D;
2043
    padding:6px;
2044
    background-color: #FFF;
2045
    vertical-align: middle;
2046
}
2047

    
2048
div.list table thead tr th {
2049
    background-color: #5CA1C0;
2050
    background-image: url(bg.gif);
2051
    background-repeat: no-repeat;
2052
    background-position: right 11px;
2053
    font-weight: normal;
2054
    border: 1px solid #FFF;
2055
    border-bottom: none;
2056
    padding: 4px;
2057
    text-align: left;
2058
    vertical-align: middle;
2059
    cursor: pointer;
2060
}
2061

    
2062
div.list table thead .sorting_asc, div.list table thead .sorting_desc {
2063
    background-color: #87AADE;
2064
}
2065

    
2066
div.list table thead .sorting_asc {
2067
    background-image: url(asc.gif);
2068
}
2069

    
2070
div.list table thead .sorting_desc {
2071
    background-image: url(desc.gif);
2072
}
2073

    
2074
div.list table .selection div.expand-icon {
2075
    background-image: url(asc.gif);
2076
    background-repeat: no-repeat;
2077
    position: relative;
2078
    cursor: pointer;
2079
    width: 15px;
2080
    height: 4px;
2081
    left: 19px;
2082
    top: -11px;
2083
}
2084

    
2085
ul.dropdown-selector {
2086
    background-color: #E6EEEE;
2087
    position: absolute;
2088
    margin-left: 1px;
2089
    display: block;
2090
    top: 255px;
2091
    font-size:9pt;
2092
    width:40px;
2093
}
2094

    
2095
ul.dropdown-selector li {
2096
    padding: 4px;
2097
}
2098

    
2099
ul.dropdown-selector li:hover {
2100
    background-color: #87AADE;
2101
}
2102

    
2103
ul.dropdown-selector li a{
2104
    color: black;
2105
    text-decoration: none;
2106
}
2107

    
2108
div.list table span.imagetag {
2109
    display: none;
2110
}
2111

    
2112
div.list table thead .vmos {
2113
    width: 20px !important;
2114
    vertical-align:middle;
2115
}
2116

    
2117
div.list table .selection {
2118
    width: 20px !important;
2119
    text-align: left;
2120
    background-image: none;
2121
}
2122

    
2123
div.list table thead .vmflavor {
2124
    width: 100px !important;
2125
}
2126

    
2127
div.list table thead .vmgroup {
2128
    width: 40px !important;
2129
}
2130

    
2131
div.list table thead .vmstatus {
2132
    width: 50px !important;
2133
}
2134

    
2135
div.list table thead .vmname {
2136
    width: 70px !important;
2137
}
2138

    
2139
.spinner, .wave {
2140
    clear: right;
2141
    float:right !important;
2142
    margin: 5px 16px 0 15px !important;
2143
}
2144

    
2145
.hidden {
2146
    display:none;
2147
}
2148

    
2149
div.actions a.selected, div.actions a.selected:hover, div.machine-actions a.selected, div.machine-actions a.selected:hover {
2150
    display:block !important;
2151
    color: orange !important;
2152
}
2153

    
2154
.action_error .message, .action_error .code {
2155
    display: none;
2156
}
2157

    
2158
.fixed {
2159
    margin: 0 0 0 -35px !important;
2160
    bottom: 0;
2161
    position: fixed !important;
2162
}
2163

    
2164
/* Networks */
2165
#networks-pane {
2166
    background-color: transparent;
2167
    margin-left: 1px;
2168
    margin-right: 0;
2169
    padding-left: 35px;
2170
}
2171

    
2172
#networkscreate {
2173
    background-color: #FF7F2A;
2174
    color: #000000;
2175
    cursor: pointer;
2176
    padding: 7px 24px;
2177
    text-decoration: none;
2178
    width: 125px;
2179
}
2180

    
2181
#networkscreate:hover {
2182
    background-color: #FF9955;
2183
}
2184

    
2185
#networks-pane #beforecreate {
2186
    margin-left: -20px;
2187
    margin-top: -7px;
2188
}
2189

    
2190
#networks-container {
2191
    min-height: 270px;
2192
}
2193

    
2194
#networks-createcontainer {
2195
    margin-left: -36px;
2196
    margin-top: 17px;
2197
    padding-top: 30px;
2198
}
2199

    
2200
#networks-pane .public-networks {
2201
    background-color: white;
2202
    margin: -47px -20px 18px -35px;
2203
    padding: 70px 20px 15px 35px;
2204
}
2205

    
2206
#networks-pane .private-networks {
2207
    background-color: white;
2208
    margin-left: -35px;
2209
    margin-right: -20px;
2210
    padding: 15px 20px 20px 35px;
2211
}
2212

    
2213
#public-template, #private-template, #public-machine-template, #private-machine-template {
2214
    display:none;
2215
}
2216

    
2217
div.network a.action-network-add {
2218
    display: none;
2219
}
2220

    
2221
div.network a.action-network-destroy {
2222
    margin-top: 38px !important;
2223
    width: 50px;
2224
    display: none;
2225
}
2226

    
2227
div.network {
2228
    clear: both;
2229
    color: #666666;
2230
    min-height: 65px;
2231
    margin: 5px 0 0 -30px;
2232
    padding: 3px 20px 0 4px;
2233
    width: 480px;
2234
}
2235

    
2236
#private-template {
2237
    margin: 2px 0 0 -30px;
2238
}
2239

    
2240
div.network-placeholder {
2241
    border-left: 3px solid #FB822F;
2242
    margin-left: 33px;
2243
}
2244

    
2245
.network a, .show-machines, span.ip, .show-firewall {
2246
    color: #3d3d3d;
2247
    font-weight: normal;
2248
    text-decoration: none;
2249
    font-size: 9pt;
2250
}
2251

    
2252
.network a:hover, .show-machines:hover, span.ip:hover, .show-firewall:hover {
2253
    color: #000;
2254
    text-decoration: underline;
2255
    cursor: pointer;
2256
}
2257

    
2258
#networks-container .name {
2259
    text-decoration: none !important;
2260
    margin-bottom: 25px;
2261
    color: #000000;
2262
    margin-top: -4px;
2263
}
2264

    
2265
.state {
2266
    float: right;
2267
}
2268

    
2269
.state div {
2270
    text-align: right;
2271
    margin-right: 3px;
2272
}
2273

    
2274
div.network div.actions {
2275
    float: right;
2276
    width: 100px;
2277
    margin:0px -120px 0 0;
2278
    font-weight: normal;
2279
}
2280

    
2281
div.network div.actions a {
2282
    color: transparent;
2283
    margin: 0 0 0 8px;
2284
    display: block;
2285
}
2286

    
2287
div.actions a.enabled:hover{
2288
    color: black !important;
2289
    text-decoration: underline;
2290
    display: block;
2291
}
2292

    
2293
.network:hover .actions a {
2294
    color: #3d3d3d;
2295
    display: block;
2296
}
2297

    
2298
div.network div.actions a.selected:hover {
2299
    color: orange;
2300
}
2301

    
2302
div.network-machine div.machine-actions a.action-details {
2303
    margin-top: 10px;
2304
}
2305

    
2306
.network:hover {
2307
    background-color: #CDE2EC;
2308
}
2309

    
2310
#internet-separator {
2311
    width: 510px;
2312
    height: 5px;
2313
    background-color: #6C535D;
2314
    margin-left: -36px;
2315
    margin-top: 20px;
2316
}
2317

    
2318
.network-logos {
2319
    float:left;
2320
    padding-right: 10px;
2321
}
2322

    
2323
.network-logos:hover {
2324
    cursor: pointer;
2325
}
2326

    
2327
#networks-container .settings {
2328
    color: #000000;
2329
}
2330

    
2331
#networks-container .network-type {
2332
    float: right;
2333
    margin-top: -4px;
2334
    margin-right: 15px;
2335
}
2336

    
2337
#networks-container .indicator {
2338
    background-color: #87AADE;
2339
    border-color: white;
2340
    border-style: solid;
2341
    border-width: 2px 3px 2px 2px;
2342
}
2343

    
2344
.state div {
2345
    margin-right: 3px;
2346
    text-align: right;
2347
}
2348

    
2349
div.indicator {
2350
    clear: none;
2351
    float: right;
2352
    height: 11px;
2353
    margin: 3px -1px;
2354
    width: 10px;
2355
}
2356

    
2357
#private-networks {
2358
    margin-top: 20px;
2359
}
2360

    
2361
.private-networks .editbuttons {
2362
    margin-right: 22%;
2363
}
2364

    
2365
.private-networks div.confirm_single {
2366
    margin: -2px -200px 0 0;
2367
}
2368

    
2369
.private-networks .network-machine div.confirm_single {
2370
    margin: -8px -180px 0 0;
2371
}
2372

    
2373
span.rename-network, span.configure {
2374
    background-repeat: no-repeat;
2375
    color: transparent;
2376
    font-size: 9pt;
2377
    font-weight: normal;
2378
    margin-left: 10px;
2379
    padding-left: 10px;
2380
    text-align: left;
2381
}
2382

    
2383
span.rename-network {
2384
    cursor: pointer;
2385
}
2386

    
2387
div.name-div:hover span.rename-network {
2388
    color: #3D3D3D;
2389
    margin-top: 0.4em;
2390
    background-image: url(/static/pencil.png);
2391
    background-position: 0 3px;
2392
}
2393

    
2394
.network:hover a.rename {
2395
    color: #3d3d3d;
2396
}
2397

    
2398
.network-separator {
2399
    background-color: #DCDCDC;
2400
    height: 1px;
2401
    margin: 2px 0 0 -5px;
2402
    width: 480px;
2403
}
2404

    
2405
.network-contents {
2406
    margin-left: -4px;
2407
    width: 504px;
2408
    clear: both;
2409
    padding-bottom: 7px;
2410
}
2411

    
2412
.network-machine .state div {
2413
    text-align: left;
2414
}
2415

    
2416
.network-machine {
2417
    margin-left: 34px;
2418
    padding-bottom: 5px;
2419
    padding-left: 5px;
2420
    padding-top: 10px;
2421
    margin-top: 2px;
2422
}
2423

    
2424
.network-machine .logo {
2425
    float:left;
2426
    padding-right: 10px;
2427
    position:relative;
2428
}
2429

    
2430
#networks-container .machine-name {
2431
    text-decoration: none !important;
2432
    margin-bottom: 10px;
2433
    color: #000000;
2434
    margin-top: -4px;
2435
}
2436

    
2437
div.network div.machine-actions {
2438
    float: right;
2439
    width: 100px;
2440
    margin:0px -100px 0 0;
2441
    font-weight: normal;
2442
}
2443

    
2444
.discreet {
2445
    color: #969696;
2446
}
2447

    
2448
.network-contents-start-separator {
2449
    height: 3px;
2450
    background-color: #87AADE;
2451
    margin-left: 39px;
2452
    width: 410px;
2453
}
2454

    
2455
.network-contents-end-separator {
2456
    height: 3px;
2457
    background-color: #87AADE;
2458
    margin-top: 7px;
2459
    margin-left: 13px;
2460
    width: 473px;
2461
}
2462

    
2463
.network .separator {
2464
    background-color: #DCDCDC;
2465
    height: 1px;
2466
    margin-left: 5px;
2467
    margin-top: 3px;
2468
    position: absolute;
2469
    width: 473px;
2470
}
2471

    
2472
.network-machines {
2473
    margin-bottom: 10px;
2474
}
2475

    
2476
.network-machine .state {
2477
    margin-right: 18px;
2478
}
2479

    
2480
.network-machine .state .status {
2481
    margin-bottom: 4px;
2482
}
2483

    
2484
.machine-name .name {
2485
    margin-top: -10px !important;
2486
}
2487

    
2488
.machine-name .namecontainer {
2489
    line-height: 18px;
2490
    margin-bottom: 20px;
2491
}
2492

    
2493
.network-machine:hover {
2494
    background-color: #B3B3B3;
2495
}
2496

    
2497
.machines {
2498
    margin: 2px 0 0 0;
2499
    width: 410px;
2500
    background-color: #B3B3B3;
2501
}
2502

    
2503
div.empty-network-slot {
2504
    height: 60px;
2505
}
2506

    
2507
div.network-remove-machine, div.network-add-machine {
2508
    background-color: #FB822F;
2509
    color: #bc4b00;
2510
    width:90px;
2511
    float:left;
2512
    margin:41px 0 0 -100px;
2513
}
2514

    
2515
span.remove-icon {
2516
    font-size: 80%;
2517
    margin-left: 15px;
2518
}
2519

    
2520
span.add-icon {
2521
    margin-left: 15px;
2522
}
2523

    
2524
span.remove-icon:hover, span.add-icon:hover {
2525
    cursor:pointer;
2526
    color: #fff;
2527
}
2528

    
2529
div.network-add-machine {
2530
    margin:44px 0 0 0;
2531
}
2532

    
2533
.firewall-on {
2534
    color: #42E342;
2535
}
2536

    
2537
.firewall-off {
2538
    color: #F82E2E;
2539
}
2540

    
2541
div.network div.machine-actions a {
2542
    color: transparent;
2543
    margin: 0 0 0 8px;
2544
    display: block;
2545
}
2546

    
2547
div.network div.machine-actions a:hover {
2548
    color: black !important;
2549
    text-decoration: underline;
2550
    display: block;
2551
}
2552

    
2553
div.network div.display a{
2554
    color: #3d3d3d;
2555
    display: block;
2556
}
2557

    
2558
div.network div.display a:selected {
2559
    color: #3d3d3d !important;
2560
}
2561

    
2562

    
2563
.network-machine:hover .machine-actions a {
2564
    color: #3d3d3d;
2565
    display: block;
2566
}
2567

    
2568
.firewall-content {
2569
    color: black;
2570
    font-size: 60%;
2571
    margin-left: 60px;
2572
}
2573

    
2574
.firewall-content .checkbox-legends {
2575
    vertical-align: text-top;
2576
}
2577

    
2578
.checkbox-legends a {
2579
    color: black;
2580
    text-decoration: underline;
2581
    font-size: 100%;
2582
}
2583

    
2584
.machine-connect {
2585
    color:black !important;
2586
    text-decoration: underline !important;
2587
}
2588

    
2589
.machine-connect:hover {
2590
    cursor: pointer;
2591
}
2592

    
2593
.firewall-contents-start-separator {
2594
    background-color: #808080;
2595
    height: 2px;
2596
    margin-bottom: 5px;
2597
    width: 365px;
2598
}
2599

    
2600
.firewall-contents-end-separator {
2601
    background-color: #808080;
2602
    height: 2px;
2603
    margin-left: -60px;
2604
    margin-top: 5px;
2605
    width: 425px;
2606
}
2607

    
2608
.firewall-apply {
2609
    background-color: #666666;
2610
    border: medium none;
2611
    float: right;
2612
    font-size: 105%;
2613
    height: 18px;
2614
    margin-right: 5px;
2615
    margin-top: 3px;
2616
    width: 75px;
2617
}
2618

    
2619
.name-div {
2620
    margin-left: 70px;
2621
    margin-bottom: 20px;
2622
}
2623

    
2624
.machine-name-div {
2625
    margin-bottom: 22px;
2626
    margin-left: 60px;
2627
}
2628

    
2629
/* Metadata */
2630

    
2631
.info-content {
2632
    height: 95px;
2633
    width: 540px;
2634
    margin-top: 10px;
2635
}
2636

    
2637
.metadata-separator {
2638
    background-color: #808080;
2639
    height: 3px;
2640
    margin: 0 0 0 14px;
2641
    width: 492px;
2642
}
2643

    
2644
.metadata-container {
2645
    line-height: 12px;
2646
    margin-left: 14px;
2647
    margin-top: 2px;
2648
    height: 85px;
2649
}
2650

    
2651
.metadata-column {
2652
    border-right: 1px solid #CECECE;
2653
    color: black;
2654
    float: left;
2655
    font-size: 60%;
2656
    margin-top: 3px;
2657
    height: 70px;
2658
    padding-bottom: 5px;
2659
}
2660

    
2661
.vm-stats {
2662
    padding-left: 10px;
2663
    padding-right: 5px;
2664
    width: 119px;
2665
}
2666

    
2667
.vm-details {
2668
    width: 169px;
2669
}
2670

    
2671
.vm-metadata {
2672
    padding-left: 10px;
2673
    width: 129px;
2674
    border: none;
2675
}
2676

    
2677
.metadata-left {
2678
    float:left;
2679
    width: 50px;
2680
    height: 60px;
2681
}
2682

    
2683
.metadata-right {
2684
    width: 73px;
2685
    float:left;
2686
    height: 35px;
2687
    padding-left: 5px;
2688
    position:relative;
2689
    overflow:hidden;
2690
}
2691

    
2692
.metadata-right .items {
2693
    position:absolute;
2694
    height:20000em;
2695
}
2696

    
2697
.metadata-keys-container {
2698
    height: 60px;
2699
    float: left;
2700
}
2701

    
2702
a.manage-metadata {
2703
    font-size: 100%;
2704
    color: black;
2705
    margin-left:17px;
2706
    text-decoration: underline;
2707
}
2708

    
2709
.metadata-actions, .scrollable {
2710
    padding-left: 5px;
2711
}
2712

    
2713
.metadata-actions .prev,  .metadata-actions .next{
2714
    float:left;
2715
    width:29px;
2716
    height:6px;
2717
    cursor: pointer;
2718
}
2719

    
2720
.metadata-actions .prev {
2721
    background: url("/static/roll-up.png") no-repeat scroll 0 0 transparent;
2722
}
2723

    
2724
.metadata-actions .next {
2725
    background: url("/static/roll-down.png") no-repeat scroll 0 0 transparent;
2726
}
2727

    
2728
.scrollable {
2729
    position:relative;
2730
    overflow:hidden;
2731
    height: 35px;
2732
    width: 60px;
2733
    margin-bottom:2px;
2734
}
2735

    
2736
.scrollable .items {
2737
    position:absolute;
2738
    height:20000em;
2739
}
2740

    
2741
.metadata-bar {
2742
    float: right !important;
2743
    margin: 1px 7px 0 !important;
2744
}
2745

    
2746
/* single view */
2747
.single {
2748
    background-color: white;
2749
    color: #383838;
2750
    margin-left: -35px;
2751
    margin-top: -76px;
2752
    padding-bottom: 10px;
2753
    padding-left: 20px;
2754
    padding-top: 77px;
2755
    width: 679px;
2756
}
2757

    
2758
.single .column1 {
2759
    width: 140px;
2760
    float:left;
2761
    margin-bottom: 25px;
2762
}
2763

    
2764
.single .column1 .state {
2765
    width: 126px;
2766
    background-color: #999999;
2767
    float: left;
2768
    padding-bottom: 6px;
2769
    padding-top: 3px;
2770
    text-align: center;
2771
}
2772

    
2773
.single .column1 .state-label {
2774
    padding-top: 5px;
2775
}
2776

    
2777
.single .column1 .single-actions {
2778
    border: 3px solid #999999;
2779
    padding-bottom: 4px;
2780
    padding-left: 4px;
2781
    width: 119px;
2782
}
2783

    
2784
.single div.single-action {
2785
    font-size: 80%;
2786
    line-height: 16px;
2787
    text-decoration: none;
2788
    cursor: pointer;
2789
}
2790

    
2791
.single div.single-action:hover {
2792
    color: #000000;
2793
}
2794

    
2795
.single .column2 {
2796
    float: left;
2797
    font-size: 78%;
2798
    line-height: 17px;
2799
    width: 370px;
2800
    margin-bottom: 20px;
2801
}
2802

    
2803
.single .column2 .machine-labels {
2804
    width: 130px;
2805
    float:left;
2806
}
2807

    
2808
.single .column2 .machine-details {
2809
    float:left;
2810
    text-align: right;
2811
}
2812

    
2813
.single .column2 .name, .single .column2 .disk, .single .column2 .image-size, .single .column2 .ipv6 {
2814
    margin-bottom: 13px;
2815
}
2816

    
2817
.single .column3 {
2818
    width: 150px;
2819
    background-color: #CCCCCC;
2820
    height: 230px;
2821
    margin-left: 510px;
2822
    position: absolute;
2823
    top: 195px;
2824
}
2825

    
2826
.single .column3 .controls {
2827
    font-size: 80%;
2828
    height: 20px;
2829
    padding-left: 7px;
2830
    padding-right: 7px;
2831
    padding-top: 8px;
2832
}
2833

    
2834
.single .column3 .previous {
2835
    float:left;
2836
}
2837

    
2838
.single .column3 .next {
2839
    float:right;
2840
}
2841

    
2842
.single .column3 .separator {
2843
    width: 135px;
2844
    height: 1px;
2845
    background-color: #999999;
2846
    margin: 0 0 0 7px;
2847
    clear: both;
2848
}
2849

    
2850
.single .column3 .servers {
2851
    font-size: 80%;
2852
    line-height: 15px;
2853
    padding-top: 10px;
2854
    text-align: right;
2855
}
2856

    
2857
.single .column3 .server-name {
2858
    margin-left: 10px;
2859
    padding-right: 5px;
2860
    cursor: pointer;
2861
    padding-bottom: 2px;
2862
}
2863

    
2864
.single .column3 .server-name:hover {
2865
    background-color:  #999999;
2866
    color: white;
2867
}
2868

    
2869
.single .column3 .selected {
2870
    background-color:  #999999;
2871
    color: white;
2872
}
2873

    
2874
.single .disks, .single .networks, .single .stats {
2875
    background-color: #999999;
2876
    clear: both;
2877
    cursor: pointer;
2878
    height: 20px;
2879
    padding-left: 21px;
2880
    padding-top: 2px;
2881
    margin-bottom: 10px;
2882
    margin-left: -21px;
2883
    width: 500px;
2884
    font-size: 85%;
2885
}
2886

    
2887
.single .toggler {
2888
    color: #FFFFFF;
2889
    float: right;
2890
    font-size: 140%;
2891
    padding-right: 7px;
2892
    padding-top: 7px;
2893
}
2894

    
2895
.single .disks {
2896
    color: #C7A35F;
2897
}
2898

    
2899
.single .networks {
2900
    color: #9C7371;
2901
}
2902

    
2903
.single .disks-content, .single .networks-content, .single .stats-content {
2904
    height: 150px;
2905
}
2906

    
2907
.single .single-image {
2908
    width: 126px;
2909
    margin-bottom: 10px;
2910
}
2911

    
2912
.single .column3 .previous , .single .column3 .next {
2913
    cursor: pointer;
2914
}
2915

    
2916
/* console css */
2917
.console-header-logo {
2918
    padding-top: 10px;
2919
    margin-left: 30px;
2920
    position: fixed;
2921
}
2922

    
2923
div.console-container {
2924
    margin: 0 0em;
2925
    height: auto;
2926
}
2927

    
2928
#wrapper.console {
2929
    width: auto;
2930
}
2931

    
2932
.console-info {
2933
    font-size:80%;
2934
    color: white;
2935
    float:left;
2936
    position:relative;
2937
    margin: 25px 0 0 480px;
2938
}
2939

    
2940
applet {
2941
    width: 100%;
2942
    height:75%;
2943
}
2944

    
2945
.console-footer #footer-text{
2946
    float:left;
2947
    left: auto;
2948
    margin-left:30px;
2949
}
2950

    
2951
/* add network wizard (see also #wizard for shared classes) */
2952
#networks-wizard .header {
2953
    background-color: #4085A5;
2954
    height: 56px;
2955
}
2956

    
2957
#networks-wizard div.name-input {
2958
    margin: 75px 0 0 55px;
2959
}
2960

    
2961
#networks-wizard input {
2962
    border: 1px solid #CCCCCC;
2963
    color: #445566;
2964
    letter-spacing: 1px;
2965
    width: 170px;
2966
}
2967

    
2968
#networks-wizard span.help {
2969
    font-style: italic;
2970
    font-size: 80%;
2971
    margin-left: 10px;
2972
}
2973

    
2974
#networks-wizard .separator-end {
2975
    background-color: #387693;
2976
    height: 6px;
2977
    width: 478px;
2978
    margin-left: -12px;
2979
    margin-top: 9px;
2980
}
2981

    
2982
.red {
2983
    color: red;
2984
}
2985

    
2986
/* add server to network wizard (see also #metadata-wizard for shared classes) */
2987
#add-machines-wizard span.machine-name {
2988
    margin-left: 4px;
2989
    vertical-align: text-top;
2990
}
2991

    
2992
#add-machines-wizard img.list-logo {
2993
    margin: 2px 1px 1px;
2994
}