Statistics
| Branch: | Tag: | Revision:

root / ui / static / main.css @ f2141829

History | View | Annotate | Download (67.5 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
    background: url(./body-bg.png) repeat-x scroll 0 0 #FFFFFF;
25
    height: 100%;
26
    text-align:center;
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("./body-bg2.png") no-repeat scroll right bottom transparent;
38
}
39

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

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

    
54
div#wrapper {
55
    width: 700px;
56
    margin: 0em auto;
57
    text-align: left;
58
}
59

    
60
#footer {
61
    height: 119px;
62
    background-color: #4085A5;
63
    position:absolute;
64
    left: 0;
65
    bottom: 0;
66
    width:100%;
67
}
68

    
69
#footer div.grnet-sign {
70
    margin-top:10px;
71
}
72

    
73
#footer div.grnet-sign a{
74
    color: #72ADC8;
75
}
76

    
77
#footer div.grnet-sign a:hover {
78
    color: #FFFFFF;
79
}
80

    
81
ol, ul {
82
    list-style: none;
83
}
84

    
85
blockquote, q {
86
    quotes: none;
87
}
88

    
89
blockquote:before, blockquote:after,
90
q:before, q:after {
91
    content: '';
92
    content: none;
93
}
94

    
95
/* remember to define focus styles! */
96
:focus {
97
    outline: 1px dotted #87AADE;
98
}
99

    
100
/* remember to highlight inserts somehow! */
101
ins {
102
    text-decoration: none;
103
}
104

    
105
del {
106
    text-decoration: line-through;
107
}
108

    
109
/* tables still need 'cellspacing="0"' in the markup */
110
table {
111
    border-collapse: collapse;
112
    border-spacing: 0;
113
}
114

    
115
h5 {
116
    font-weight: normal;
117
    margin-bottom:3px;
118
}
119

    
120
/* root element for tabs  */
121
.tab-name {
122
    background-color: #5CA1C0;
123
    color: #FFFFFF;
124
    float: left;
125
    font-size: 150%;
126
    height: 28px;
127
    text-align: center;
128
    width: 170px;
129
}
130

    
131
.tab-separator {
132
    background-color: white;
133
    float: left;
134
    width: 2px;
135
    height: 23px;
136
    margin-top: 4px;
137
}
138

    
139
ul.css-tabs {
140
    padding: 0;
141
    height:31px;
142
    background-color: #5CA1C0;
143
}
144

    
145
ul.css-tabs .secondary {
146
    position:relative;
147
}
148

    
149
/* single tab */
150
ul.css-tabs li {
151
    float:left;
152
    padding:0;
153
    list-style-type:none;
154
}
155

    
156
ul.css-tabs .current {
157
    background: #4085A5;
158
}
159

    
160
/* link inside the tab. uses a background image */
161
ul.css-tabs a {
162
    float:left;
163
    display:block;
164
    text-decoration:none;
165
    color:#d2d2d2;
166
    position:relative;
167
    outline:0;
168
    padding: 4px 25px 0;
169
    height: 27px;
170
}
171

    
172
ul.css-tabs a:hover {
173
    background: #74AEC9;
174
}
175

    
176
/* selected tab */
177
ul.css-tabs a.current {
178
    cursor:default;
179
}
180

    
181
ul.css-tabs a.current:hover {
182
    background: #4085A5;
183
}
184
/* tab pane */
185
div.css-panes {
186
/*    border-top: 10px solid #87aade;
187
    border-bottom: 10px solid #87aade;  */
188
    background: transparent;
189
}
190

    
191
.css-panes > div.pane {
192
    display:none;
193
}
194

    
195
/* CSS3 border radius for various elements. yea - CSS isn't perfect */
196
.rounded, #sheet input, .error {
197
    border-radius: 5px;
198
    -webkit-border-radius: 5px;
199
    -moz-border-radius: 5px;
200
    -o-border-radius: 5px;
201
    -khtml-border-radius: 5px;
202
}
203

    
204
/* validation error message */
205
.error {
206
    background-color:#E8FF6D;
207
    padding:4px;
208
    -webkit-box-shadow: #000 0 0 9pt;
209
    -moz-box-shadow: #000 0 0 9pt;
210
}
211

    
212
/* nested arrow inside error message. It's 100% CSS. No images. */
213
.error em {
214
    border: 10px solid;
215
    border-color: #E8FF6D transparent transparent;
216
    bottom: -17px;
217
    display: block;
218
    height: 0;
219
    left: 10px;
220
    position: absolute;
221
    width: 0;
222
}
223

    
224
/* input field that caused validation error */
225
.invalid {
226
    background-color: rgba(221, 233, 255, 0.898) !important;
227
}
228

    
229
#beforecreate {
230
    position:relative;
231
    background-color: #FF9955;
232
    float: left;
233
    height: 32px;
234
    margin-left: -13px;
235
    margin-top: -7px;
236
    width: 13px;
237
}
238

    
239
#network-page #beforecreate {
240
    margin-top: -8px;
241
}
242

    
243
#ie-fix {
244
    z-index: 1000;
245
    position: relative;
246
}
247
#createcontainer {
248
    margin-top: 20px;
249
    margin-bottom: 10px;
250
    z-index: 1000;
251
}
252

    
253
#create {
254
    background-color: #FF7F2A;
255
    color: #000;
256
    cursor: pointer;
257
    padding: 7px 24px;
258
    text-decoration: none;
259
    font-size:100%;
260
}
261

    
262
#create:hover {
263
    background-color: #FF9955;
264
}
265

    
266
#console-header {
267
    height: 67px;
268
    margin-bottom:15px;
269
    background: url("./header-bg.png") repeat-x scroll 0 0 #FFFFFF;
270
}
271

    
272
.header-logo {
273
    padding-top: 28px;
274
}
275

    
276
div#footer-text a {
277
    color: #FFFFFF;
278
    text-decoration: none;
279
}
280

    
281
div#footer-text{
282
    clear: both;
283
    color: #FFFFFF;
284
    font-size: 75%;
285
    left: 22%;
286
    padding-top: 10px;
287
    position: absolute;
288
    width: 700px;
289
}
290

    
291
#footer-bg {
292
    background: url("./footer-bg.png") no-repeat scroll 0 0 #4085A5;
293
    float:right;
294
    width: 700px;
295
    height: 119px;
296
    background-position:right;
297
}
298

    
299
.modal {
300
    background-color:#fff;
301
    display:none;
302
    width:30em;
303
    padding:1em;
304
    text-align:left;
305
}
306

    
307
/* server wizard scrollable root element and network wizard */
308
#wizard, #networks-wizard {
309
    font-size:75%;
310
    height:405px;
311
    width:453px;
312
    overflow:hidden;
313
    position:absolute !important;
314
}
315

    
316
/* scrollable items */
317
#wizard .items {
318
    width:20000em;
319
    clear:both;
320
    position:absolute;
321
    display:block;
322
    padding: 0;
323
    margin: 0;
324
    border:none;
325
    background:none;
326
}
327

    
328
/* single item */
329
#wizard .page, #networks-wizard div.container {
330
    padding: 0px 40px 20px 15px;
331
    width:447px;
332
    float:left;
333
    display:block;
334
    border:none;
335
    background-color: transparent;
336
}
337

    
338
#networks-wizard div.container {
339
    background-color: #ECF4F8;
340
    width:400px;
341
    height: 180px;
342
    margin-bottom:50px;
343
}
344

    
345
/* title */
346
#wizard h2, #networks-wizard h2 {
347
    color: #FF7B24;
348
    font-size: 100%;
349
    font-style: italic;
350
    font-weight: bold;
351
    margin-left: 37px;
352
    margin-top: 17px;
353
}
354

    
355
#networks-wizard h2 {
356
    margin-top: 15px;
357
}
358

    
359
#wizard li {
360
    margin-bottom:1.2em;
361
}
362

    
363
#wizard .pane li {
364
    margin: 0;
365
}
366

    
367
#wizard label {
368
    font-size:120%;
369
    display:block;
370
    clear: both;
371
}
372

    
373
#wizard label strong {
374
    position:relative;
375
    top:-1px;
376
    font-size: 80%;
377
    font-weight: normal;
378
}
379

    
380
#wizard label em {
381
    font-size:75%;
382
    color:#666;
383
    font-style:normal;
384
}
385

    
386
#wizard .text {
387
    width: 270px;
388
    padding: 5px;
389
    margin-top: 10px;
390
    border: 1px solid #ccc;
391
    color: #456;
392
    letter-spacing: 1px;
393
}
394

    
395
#wizard select {
396
    border:1px solid #ccc;
397
    width:94%;
398
    padding:4px;
399
    display: none;
400
}
401

    
402
#wizard .double label {
403
    width:50%;
404
    float:left;
405
}
406

    
407
#wizard .double .text {
408
    width:93%;
409
}
410

    
411
#wizard .clearfix {
412
    clear:left;
413
    padding-top:10px;
414
}
415

    
416
#wizard .right {
417
    float:right;
418
}
419

    
420
#wizard .error {
421
    border:1px solid red;
422
}
423

    
424
#wizard a:hover div.image {
425
    background-color: #C5DEE9;
426
}
427

    
428
.selecteddiv {
429
    background-color: #C5DEE9 !important;
430
}
431

    
432
#wizard label a:hover strong {
433
    color: black;
434
}
435

    
436
#wizard div.image span.size {
437
    font-size: 75%;
438
    color: #666;
439
}
440

    
441
#wizard div.image .radio {
442
    float: left;
443
    margin-top: 10px;
444
}
445

    
446
#wizard div.image span.image-id, #wizard div.image span.description {
447
    font-size: 75%;
448
    color: #666;
449
    font-weight: normal;
450
    display:inline;
451
}
452

    
453
#wizard a:hover div.image span.image-id, #wizard a:hover div.image span.description, #wizard a:hover div.image span.size {
454
    color: black;
455
}
456

    
457
#wizard .cost {
458
    color: #79A4C1;
459
    margin-top: 40px;
460
    clear:both;
461
    margin-left: 15px;
462
    font-size: 95%;
463
}
464

    
465
#wizard #status {
466
    height: 50px;
467
    background-color: #4085A5;
468
}
469

    
470
#wizard .headernumber {
471
    font-size: 410%;
472
}
473

    
474
#wizard .headerbody {
475
    font-size: 120%;
476
    font-weight: normal;
477
    display: inline;
478
    top: -15px;
479
    position: relative;
480
}
481

    
482
#wizard .first {
483
    left: -10px;
484
}
485

    
486
#wizard .checked {
487
    color: #64a6c4 !important;
488
}
489

    
490
#wizard .li-2 {
491
    margin-top: -1px !important;
492
}
493

    
494
#wizard .img-check {
495
    margin-bottom: 8px;
496
    margin-left: -8px;
497
}
498

    
499
#wizard .li-1 .img-check {
500
    margin-left: 2px;
501
}
502

    
503
#wizard .topruler, #networks-wizard .topruler, #wizard .bottomruler, #networks-wizard .bottomruler {
504
    background-color: #CDE2EC;
505
    color: #CDE2EC;
506
    border: 0 none;
507
    height: 4px;
508
    margin-left: -1px;
509
    width: 447px;
510
    margin-bottom: 6px;
511
    margin-top: 4px;
512
}
513

    
514
#wizard .bottomruler, #networks-wizard .bottomruler {
515
    margin-top:6px;
516
}
517

    
518
#networks-wizard .topruler, #networks-wizard .bottomruler {
519
    width: 455px;
520
    float: left;
521
}
522

    
523
#wizard #cancel, #networks-wizard .cancel {
524
    background-color: #4085A5;
525
    border-color: #4085A5;
526
    text-align: center !important;
527
}
528

    
529
#wizard #cancel:hover, #networks-wizard .cancel:hover {
530
    background-color: #7DB4CD;
531
    border-color: #7DB4CD;
532
}
533

    
534
#wizard #start, #networks-wizard .create {
535
    text-align: center;
536
    background-color: #FF6600;
537
    border-color: #FF6600;
538
}
539

    
540
#wizard .img-next {
541
    margin: 0 -4px -1px 8px;
542
}
543

    
544
#wizard .img-prev {
545
    margin: 0 8px -1px -4px;
546
}
547

    
548
#networks-wizard .create {
549
    float:right;
550
    width: 140px;
551
}
552

    
553
#wizard #start:hover, #networks-wizard .create:hover {
554
    background-color: #FF9651;
555
    border-color: #FF9651;
556
}
557

    
558
#wizard .separator-end {
559
    position: absolute;
560
    background-color: #387693;
561
    height: 5px;
562
    margin-left: -14px;
563
    margin-top: 362px;
564
    width: 550px;
565
}
566

    
567
.page ul {
568
    height: 270px;
569
    overflow: auto;
570
}
571

    
572
.panes ul.pane {
573
    height: 220px;
574
}
575

    
576
#wizard #tabscontainer {
577
    background-color: #CDE2EC;
578
    height: 20px;
579
    width: 448px;
580
}
581

    
582
.page ul.tabs {
583
    overflow: hidden;
584
    height: auto;
585
    margin-bottom: -1px;
586
    margin-top: -1px;
587
}
588

    
589
.page ul.tabs li {
590
    float: right;
591
    margin: 0 0.2em;
592
}
593

    
594
#status li {
595
    float: left;
596
    color: #387693;
597
    padding: 0 1px 0 37px;
598
    bottom: 0px;
599
}
600

    
601
#status li.active .headernumber {
602
    color: #FFFFFF;
603
}
604

    
605
#status li.active .headerbody {
606
    color: #FFFFFF;
607
}
608

    
609
div.image-container {
610
    border-bottom: 1px solid #CCCCCC;
611
    margin-left: 10px;
612
    margin-right: 10px;
613
}
614

    
615
#page2-container {
616
    background-color: #ECF4F8;
617
    height: 193px;
618
    margin-top: 3px;
619
    padding-top: 25px;
620
}
621

    
622
#page3-container {
623
    background-color: #ECF4F8;
624
    height: 245px;
625
    margin-bottom: 32px;
626
    padding-left: 50px;
627
}
628

    
629
/* slider root element */
630
.slider {
631
    border: 1px solid #666;
632
    cursor: pointer;
633
    display: inline !important;
634
    float: left;
635
    margin: 5px 0 20px 10px;
636
    position: relative;
637
    width: 250px;
638
}
639

    
640
.sliders {
641
    float:left;
642
    width: 40px;
643
    margin-left: 10px;
644
    margin-top: 3px;
645
}
646

    
647
.units {
648
    padding-left:10px;
649
}
650

    
651
.slider-container {
652
    padding-bottom: 15px;
653
    margin-left: 5px;
654
}
655

    
656
/* drag handle */
657
.handle {
658
    -moz-box-shadow: 0 0 2px #000000;
659
    background: url("./h30.png") repeat-x scroll 0 0 #FFFFFF;
660
    border: 1px solid #000000;
661
    cursor: move;
662
    display: block;
663
    height: 10px;
664
    margin-top: -8px;
665
    position: absolute;
666
    width: 8px;
667
}
668

    
669
/* progress bar (enabled with progress: true) */
670
.progress {
671
    height: 3px;
672
    background-color: #387693;
673
}
674

    
675
/* the input field */
676
.range {
677
    border: 1px solid #387693;
678
    float: left;
679
    font-size: 100%;
680
    margin: -3px 0 0 15px;
681
    padding: 2px 5px 2px 0;
682
    text-align: right;
683
    width: 50px;
684
}
685

    
686
.selectedrange {
687
    border-color: #5599FF;
688
}
689

    
690
#credits-indicator {
691
    background-color: #ECF4F8;
692
    float: none;
693
    margin: 0 0 0 10px;
694
    border: 1px solid #387693;
695
    color: #387693;
696
}
697

    
698
/* machines */
699
.machine-container {
700
    min-height: 65px;
701
    margin: 2px 0 0 3px;
702
    padding: 0 4px 0;
703
    clear: both;
704
    width: 523px;
705
    position:relative;
706
}
707

    
708
div.machine {
709
    margin-left: -7px;
710
    min-height: 65px;
711
    padding-left: 7px;
712
    padding-right: 5px;
713
    padding-top: 2px;
714
    width: 516px;
715
}
716

    
717
div.machine.light-background, div.network.light-background {
718
    background-color:#aed2e3 !important;
719
}
720

    
721
div.machine:hover {
722
    background-color:#A1C8DB !important;
723
}
724

    
725

    
726
.single .light-background {
727
    background-color:#aed2e3;
728
}
729

    
730
.machine a {
731
    font-weight: normal;
732
    text-decoration: none;
733
}
734

    
735
div.machine-details {
736
    width: 400px;
737
    float:left;
738
}
739

    
740
.machine span.name, .machine a.ip {
741
    font-size: 75%;
742
    color: black;
743
    margin-top: 6px;
744
}
745

    
746
.machine span.name {
747
    font-weight: bold;
748
}
749

    
750
.oldValue {
751
    display:none;
752
}
753

    
754
.state {
755
    margin-top: -40px;
756
}
757

    
758
.state div {
759
    text-align: right;
760
    margin-right: 3px;
761
}
762

    
763
/* icon view actions */
764
div.machine div.actions {
765
    float: right;
766
    font-size: 75%;
767
    font-weight: normal;
768
    height: 68px;
769
    position: absolute;
770
    right: -63px;
771
    width: 70px;
772
    top: 0px;
773
}
774

    
775
div.machine div.actions a {
776
    color: black;
777
    visibility: hidden;
778
    height: 15px;
779
    width: 180px;
780
    margin: 0 0 2px 8px;
781
    display: block;
782
}
783

    
784
div.machine div.actions a:hover {
785
    background-color:#A1C8DB;
786
    opacity: 0.8;
787
    filter: alpha(opacity = 80);
788
}
789

    
790
div.machine div.actions a.selected {
791
    color: #FF7F2A !important;
792
    width: 50px;
793
}
794

    
795
div.machine div.actions a.selected:hover {
796
    background-color:transparent;
797
}
798

    
799
div.machine div.actions a.action-shutdown {
800
    display: block;
801
}
802

    
803
div.machine div.actions a.shutdown-padding {
804
    margin-bottom: 22px;
805
}
806

    
807
div.action-container {
808
    overflow: visible;
809
}
810

    
811
div.actions a.enabled:hover{
812
    color: black !important;
813
    text-decoration: underline;
814
    display: block;
815
}
816

    
817
div.machine:hover .actions a {
818
    visibility: visible;
819
}
820

    
821
div.machine div.display a{
822
    visibility: visible;
823
}
824

    
825
div.running div.machine div.actions .disabled {
826
    display: none;
827
}
828

    
829
div.terminated div.machine div.actions .disabled {
830
    display: none;
831
}
832

    
833
div.terminated div.machine div.actions a.action-destroy {
834
    position: absolute;
835
    bottom: 0;
836
}
837

    
838
div.running div.machine div.actions a.action-destroy {
839
    position: absolute;
840
    bottom: 0;
841
}
842

    
843
div.connect-arrow {
844
    background: url(/static/connect-arrow.png) no-repeat;
845
    height: 28px;
846
    width:14px;
847
    position: absolute;
848
}
849

    
850
.machine div.connect-arrow {
851
    display: none;
852
    left: -3px;
853
    position: absolute;
854
    top: 9px;
855
}
856

    
857
div.connect-arrow:hover, div.connect-arrow.border-hover, div.connect-arrow-ie, div.connect-arrow.border-ie {
858
    cursor: pointer;
859
    background: url(/static/connect-arrow-hover.png) no-repeat;
860
    height: 28px;
861
    width:26px;
862
}
863

    
864
div.connect-border {
865
    opacity: 0.8;
866
    filter: alpha(opacity = 80);
867
    background-color:#4fe0c3;
868
    height:28px;
869
    width: 12px;
870
    position: absolute;
871
}
872

    
873
div.connect-border:hover {
874
    cursor: pointer;
875
}
876

    
877
.machine div.connect-border {
878
    display: none;
879
    left: -15px;
880
    position: absolute;
881
    top: 9px;
882
}
883

    
884
.standard .machine .logo {
885
    float: left;
886
    width: 50px;
887
    height: 54px;
888
    margin: 4px 14px 0;
889
}
890
.machine .logo {
891
    background-image: url("./icons/machines/medium/unknown-sprite.png");
892
    background-repeat: no-repeat;
893
    cursor: pointer;
894
}
895

    
896
.standard .machine .single-image-state1 {
897
    background-position: 0px 0;
898
}
899

    
900
.standard .machine .single-image-state3 {
901
    background-position: -100px 0;
902
}
903

    
904
.standard .machine .single-image-state4 {
905
    background-position: -150px 0;
906
}
907

    
908
.standard .machine .single-image-state2 {
909
    background-position: -50px 0;
910
}
911

    
912
.standard .running .machine .logo {
913
   cursor: pointer;
914
}
915

    
916
.list .machine img {
917
    margin: 0;
918
}
919

    
920
div.ip, div.ips {
921
    font-size: 75%;
922
    position: relative;
923
    float: right;
924
    top:1px;
925
    right: 18px;
926
    text-align: right;
927
}
928

    
929
div.indicators {
930
    margin-right: 2px !important;
931
}
932
div.indicator1, div.indicator2, div.indicator3, div.indicator4 {
933
    background-color: #63cf1c;
934
    width:10px;
935
    height:11px;
936
    clear: none;
937
    float:right;
938
}
939

    
940
.view-separator {
941
    color:#5F8DD3;
942
}
943

    
944
.running {
945
    background: url("./terminated-bg.png") repeat scroll 0 0 transparent;
946
    margin-top: -76px;
947
    padding-bottom: 15px;
948
    width: 699px;
949
    padding-top: 60px;
950
}
951

    
952
.running-state .indicator1, .running-state .indicator2, .running-state .indicator3, .running-state .indicator4 {
953
    background-color: #63cf1c;
954
}
955

    
956
.rebooting-state .indicator1, .rebooting-state .indicator2, .rebooting-state .indicator3, .rebooting-state .indicator4 {
957
    background-color: #d4aa00;
958
}
959

    
960
.error-state .indicator1, .error-state .indicator2, .error-state .indicator3, .error-state .indicator4 {
961
    background-color: #ff0000;
962
}
963

    
964
.terminated-state .indicator1, .terminated-state .indicator2, .terminated-state .indicator3, .terminated-state .indicator4 {
965
    background-color: #5e1616;
966
}
967

    
968
.build-state .indicator1, .build-state .indicator2, .build-state .indicator3, .build-state .indicator4 {
969
    background-color: #FF7F2A;
970
}
971

    
972
.destroying-state .indicator1, .destroying-state .indicator3, .destroying-state .indicator2, .destroying-state .indicator4 {
973
    background-color: #4085a5 !important;
974
}
975

    
976
.shutting-state .indicator1, .shutting-state .indicator3, .shutting-state .indicator2, .shutting-state .indicator4 {
977
    background-color: #940606;
978
}
979

    
980
.starting-state .indicator1, .starting-state .indicator2, .starting-state .indicator3, .starting-state .indicator4 {
981
    background-color: #9ed976;
982
}
983

    
984
.network-indicator .indicator1, .network-indicator .indicator2, .network-indicator .indicator3, .network-indicator .indicator4 {
985
    background-color: #63cf1c;
986
}
987

    
988
.terminated {
989
    background: url("./running-bg.png") repeat scroll 0 0 transparent;
990
    margin-bottom: 17px;
991
    margin-top: 15px;
992
    padding-bottom: 15px;
993
    padding-top: 15px;
994
    width: 699px;
995
}
996

    
997
span.rename {
998
    background-repeat: no-repeat;
999
    color: transparent;
1000
    font-size: 75%;
1001
    font-weight: normal;
1002
    margin-left: 10px;
1003
    padding-left: 10px;
1004
    text-align: left;
1005
    cursor: pointer;
1006
}
1007

    
1008
div.name:hover span.rename {
1009
    color: #3D3D3D;
1010
    margin-top: 0.4em;
1011
    background-image: url(./pencil.png);
1012
    background-position: 0 3px;
1013
}
1014

    
1015
.machine div.info {
1016
    float:left;
1017
    margin-bottom: 8px;
1018
    margin-top:3px;
1019
}
1020

    
1021
.machine div.info div.info-header {
1022
    background-color: #A1C8DB;
1023
    color: white;
1024
    height: 17px;
1025
    width: 50px;
1026
    cursor: pointer;
1027
}
1028

    
1029
div.machine:hover div.info-header, div.machine:hover div.toggler div.down {
1030
    background-color: #84b7d0;
1031
}
1032

    
1033
div.machine div.info-label.darker, .single div.tags-label.darker, div.network .darker {
1034
    background-color: #5CA1C0;
1035
}
1036

    
1037
.machine div.info div.info-label {
1038
    font-size: 75%;
1039
    height:16px;
1040
    width: 30px;
1041
    padding: 1px 0 0 5px;
1042
}
1043

    
1044
.machine div.info div.toggler, .single div.tags div.toggler, div.network div.toggler {
1045
    width:15px;
1046
    height:17px;
1047
    margin-top: -11px;
1048
    margin-left: 37px;
1049
}
1050

    
1051
div.network div.toggler {
1052
    margin-left: 90px;
1053
}
1054

    
1055
.machine div.info div.down {
1056
    background: url(/static/down-arrow.png) no-repeat scroll 1px 1px;
1057
}
1058

    
1059
.single div.tags div.down {
1060
    background: url(/static/down-arrow.png) no-repeat scroll 2px 2px;
1061
}
1062

    
1063
.network div.network-machines div.down {
1064
    background: url(/static/down-arrow.png) no-repeat scroll 2px 2px;
1065
}
1066

    
1067
.network div.network-machine div.firewall div.down {
1068
    background: url(/static/down-arrow.png) no-repeat scroll 2px 2px;
1069
}
1070

    
1071
.machine div.info div.up {
1072
    background: url(/static/up-arrow.png) no-repeat scroll 1px 0;
1073
}
1074

    
1075
.single div.tags div.up {
1076
    background: url(/static/up-arrow.png) no-repeat scroll 2px 2px;
1077
}
1078

    
1079
.network div.network-machines div.up {
1080
    background: url(/static/up-arrow.png) no-repeat scroll 2px 2px;
1081
}
1082

    
1083
.network div.network-machine div.firewall div.up {
1084
    background: url(/static/up-arrow.png) no-repeat scroll 2px 2px;
1085
}
1086

    
1087
button {
1088
    background-color: #87AADE;
1089
    border: 1px solid #87AADE;
1090
    color: #FFFFFF;
1091
    cursor: pointer;
1092
    height: 23px;
1093
    width: 120px;
1094
}
1095

    
1096
button.next {
1097
    background-color: #4085A5;
1098
    border-color: #4085A5;
1099
    text-align: right;
1100
}
1101

    
1102
button.next:hover {
1103
    background-color: #7DB4CD;
1104
    border-color: #7DB4CD;
1105
}
1106

    
1107
button.prev {
1108
    background-color: #4085A5;
1109
    border-color: #4085A5;
1110
    margin-left: -1px;
1111
    text-align: left;
1112
}
1113

    
1114
button.prev:hover {
1115
    background-color: #7DB4CD;
1116
    border-color: #7DB4CD;
1117
}
1118

    
1119
.image-logo {
1120
    float: left;
1121
    margin-right: 1em;
1122
    margin-left: 1.5em;
1123
    margin-top: 4px;
1124
}
1125

    
1126
div.image {
1127
    clear: both;
1128
    display: block;
1129
    margin-bottom: 3px;
1130
    margin-top: 3px;
1131
    padding: 5px;
1132
}
1133

    
1134
div#view-select {
1135
    float: right;
1136
    clear: both;
1137
    color: white;
1138
    position: relative;
1139
    right: 5px;
1140
    top: -35px;
1141
    display: none;
1142
    z-index: 1000;
1143
}
1144

    
1145
a#standard, a#list, a#single {
1146
    text-decoration: none;
1147
    height: 15px;
1148
    width: 17px;
1149
    padding: 1px 8px 2px 9px;
1150
}
1151

    
1152
div#view-select a {
1153
    color:#5f8dd3;
1154
}
1155

    
1156
a#list:hover {
1157
    background: #5f8dd3;
1158
}
1159

    
1160
a#standard:active, a#list:active {
1161
    color:white;
1162
}
1163

    
1164
a#standard {
1165
    background: url(./icon-view.png) no-repeat -36px 0;
1166
}
1167

    
1168
a#list {
1169
    background: url(./list-view.png) no-repeat -36px 0;
1170
}
1171

    
1172
a#single {
1173
    background: url(./single-view.png) no-repeat -36px 0;
1174
}
1175

    
1176
a#standard:hover {
1177
    background: url(./icon-view.png) no-repeat -18px 0;
1178
}
1179

    
1180
a#list:hover {
1181
    background: url(./list-view.png) no-repeat -18px 0;
1182
}
1183

    
1184
a#single:hover {
1185
    background: url(./single-view.png) no-repeat -18px 0;
1186
}
1187

    
1188
a#standard.activelink {
1189
    background: url(./icon-view.png) no-repeat 0px 0;
1190
}
1191

    
1192
a#list.activelink {
1193
    background: url(./list-view.png) no-repeat 0px 0;
1194
}
1195

    
1196
a#single.activelink {
1197
    background: url(./single-view.png) no-repeat 0px 0;
1198
}
1199

    
1200
#machinetype {
1201
    background-color: #CDE2EC;
1202
    height: 25px;
1203
    margin-bottom: 0px !important;
1204
}
1205

    
1206
div.machine-type {
1207
    float: left;
1208
    margin: 4px 18px 20px;
1209
}
1210

    
1211
.machine-type .active {
1212
    color: #FFFFFF
1213
}
1214

    
1215
#machinesview {
1216
    min-height: 270px;
1217
    margin-top: 40px;
1218
}
1219

    
1220
.list#machinesview {
1221
    margin-left: -20px;
1222
    display:none;
1223
}
1224

    
1225
#machinesview-list.list {
1226
    background: url("./terminated-bg.png") repeat scroll 0 0 transparent;
1227
    margin-top: -76px;
1228
    padding-left: 15px;
1229
    padding-top: 76px;
1230
    min-height: 270px;
1231
}
1232

    
1233
#machinesview_content {
1234
    display:none;
1235
}
1236

    
1237
.list-machines {
1238
    min-width: 515px;
1239
}
1240

    
1241
#emptymachineslist {
1242
    background-color: #6BA9C6;
1243
    color: #A0A0A0;
1244
    display: none;
1245
    margin-top: -45px;
1246
    padding: 65px 150px 35px;
1247
    text-align: justify;
1248
}
1249

    
1250
#welcomeheader {
1251
    color:white;
1252
    text-align: center;
1253
}
1254

    
1255
.welcomebody {
1256
    color: white;
1257
    font-size:80%;
1258
}
1259

    
1260
.welcomebody a {
1261
    color: white;
1262
}
1263

    
1264
.welcomefooter {
1265
    color: white;
1266
    font-size:60%;
1267
}
1268

    
1269
.welcomefooter a {
1270
    color: white;
1271
}
1272

    
1273
.emptycreatecontainer {
1274
    margin-left: 430px !important;
1275
    position: absolute;
1276
    margin-top: 5px !important;
1277
    width: 180px;
1278
    background-color: #CCCCCC;
1279
    padding: 5px;
1280
    padding-left: 10px;
1281
}
1282

    
1283
.emptycreate {
1284
    margin: 20px 10px 5px 0 !important;
1285
}
1286

    
1287
#createbody {
1288
    display:none;
1289
    font-size: 80%;
1290
}
1291

    
1292
div.list label img {
1293
    margin: 5px 5px -3px 0;
1294
}
1295

    
1296
div.list label {
1297
    color: #3D3D3D;
1298
    font-size: 75%;
1299
}
1300

    
1301
div.list .state {
1302
    margin-top: 7px;
1303
    margin-right: 10px;
1304
}
1305

    
1306
div.list table tbody {
1307
    margin-top: 8px;
1308
}
1309

    
1310
div.list .stopped {
1311
    margin-top: 8px;
1312
}
1313

    
1314
/* root element for tabs  */
1315
#wizard ul.tabs {
1316
    margin-right: -1px;
1317
    float: right;
1318
}
1319

    
1320
#wizard div.panes {
1321
    height: 247px;
1322
    clear:both;
1323
    margin-top: 3px;
1324
}
1325

    
1326
.typebody {
1327
    font-size: 80%;
1328
    font-weight: normal;
1329
    position: relative;
1330
    top: -3px;
1331
}
1332

    
1333
.typehover {
1334
    color: #FFFFFF;
1335
}
1336

    
1337
#label-name {
1338
    margin-top: 10px;
1339
}
1340

    
1341
/* single tab */
1342
#wizard ul.tabs li {
1343
    margin-bottom: 0;
1344
    list-style-type:none;
1345
    float: left;
1346
}
1347

    
1348
/* link inside the tab. uses a background image */
1349
#wizard ul.tabs a {
1350
    display:block;
1351
    padding: 0.2em 0.5em 0.1em 0.4em;
1352
    text-decoration:none;
1353
    color: #FFFFFF;
1354
    position:relative;
1355
    top:1px;
1356
    outline:0;
1357
    background-color: transparent;
1358
    text-align: center;
1359
    width: 100px;
1360
    white-space: nowrap;
1361
    height: 17px;
1362
}
1363

    
1364
#wizard ul.tabs a:hover {
1365
    color: #FFFFFF;
1366
    background-color:#4085A5;
1367
}
1368

    
1369
/* selected tab */
1370
#wizard ul.tabs a.current {
1371
    color: white;
1372
    background-color: #7DB4CD;
1373
    cursor: default;
1374
}
1375

    
1376
#wizard #standard-images {
1377
    background-color: #ECF4F8;
1378
}
1379

    
1380
div.list div.actions {
1381
    display: none;
1382
    clear: left;
1383
    float: right;
1384
    margin-right: 15px;
1385
    margin-top: 37px;
1386
    text-align: right;
1387
    width: 120px;
1388
}
1389

    
1390
div.list div.actions a {
1391
    clear: left;
1392
    color: #A1A1A1;
1393
    display: block;
1394
    font-size:75%;
1395
    margin-bottom: 2px;
1396
}
1397

    
1398
div.list div.actions a:hover {
1399
    background-color: transparent;
1400
}
1401

    
1402
div.list div.actions a.enabled {
1403
    color: #3D3D3D;
1404
}
1405

    
1406
div.list div.actions a.enabled:hover{
1407
    cursor: pointer;
1408
    color: black;
1409
    text-decoration: underline;
1410
}
1411

    
1412
div.list div.actions a.selected {
1413
    color: #FF7F2A !important;
1414
}
1415

    
1416
input.machine {
1417
    width: 13px;
1418
    height: 13px;
1419
    top: -1px;
1420
    overflow: hidden;
1421
}
1422

    
1423
.description-container {
1424
    display: inline-block;
1425
    position: relative;
1426
    width: 300px;
1427
}
1428

    
1429
#wizard .button-container {
1430
    height: 20px;
1431
}
1432

    
1433
/* metadata editing and add machines to network overlays */
1434
#metadata-wizard, #add-machines-wizard {
1435
    position:absolute !important;
1436
    overflow:hidden;
1437
    width:450px;
1438
    display:none;
1439
    background-color:#fff;
1440
    text-align:left;
1441
    font-size: 80%;
1442
    border-bottom: 5px solid #4085A5;
1443
}
1444

    
1445
#metadata-wizard .close, #add-machines-wizard .close  {
1446
    background-image: url("./close-popup.png");
1447
    background-repeat: no-repeat;
1448
    cursor: pointer;
1449
    height: 13px;
1450
    position: absolute;
1451
    right: 7px;
1452
    top: 9px;
1453
    width: 13px;
1454
}
1455

    
1456
#metadata-wizard .popup-header, #add-machines-wizard .popup-header {
1457
    background-color: #4085A5;
1458
    color: white;
1459
    font-size: 95%;
1460
    font-weight: normal;
1461
    height: 20px;
1462
    margin-left: -16px;
1463
    margin-top: -16px;
1464
    padding-bottom: 2px;
1465
    padding-left: 30px;
1466
    padding-top: 10px;
1467
    width: 482px;
1468
}
1469

    
1470
#metadata-wizard .popup-title, #metadata-wizard .machine-name, #add-machines-wizard .popup-title, #add-machines-wizard .network-name {
1471
    font-size: 120%;
1472
    padding-bottom: 7px;
1473
    padding-top: 10px;
1474
    float:left;
1475
}
1476

    
1477
#metadata-wizard .popup-title {
1478
    padding-bottom: 0px;
1479
    font-size: 120%;
1480
}
1481

    
1482
#metadata-wizard .name-container {
1483
    display: inline-block;
1484
    clear: both;
1485
}
1486

    
1487
#add-machines-wizard .network-name {
1488
    padding-left: 5px;
1489
}
1490

    
1491
#metadata-wizard .popup-body, #add-machines-wizard .popup-body {
1492
    background-image: url("./meta-wiz-bg.png");
1493
    margin-left: -16px;
1494
    margin-right: -16px;
1495
    margin-top: 1px;
1496
    height: 250px;
1497
    overflow-y: auto;
1498
    overflow-x: hidden;
1499
}
1500

    
1501
#metadata-wizard .popup-body-inner, #add-machines-wizard .popup-body-inner {
1502
    background: url("./meta-wiz-inner-bg.png") repeat-x scroll 0 0 transparent;
1503
    font-size: 80%;
1504
    height: 180px;
1505
    margin-left: 25px;
1506
    margin-top: 10px;
1507
    padding-left: 15px;
1508
    width: 420px;
1509
}
1510

    
1511
#metadata-wizard .popup-separator, #add-machines-wizard .popup-separator {
1512
    background-color: #74AEC9;
1513
    height: 1px;
1514
    width: 402px;
1515
    margin-bottom: 30px;
1516
    clear: left;
1517
    font-size: 1px;
1518
}
1519

    
1520
#metadata-wizard .metadata-pair-template {
1521
    height: 15px;
1522
    padding-top: 2px;
1523
    width: 350px;
1524
}
1525

    
1526
#metadata-wizard div.metadata-pair-template:hover {
1527
    background-color: #74AEC9;
1528
}
1529

    
1530
#metadata-wizard .metadata-container, #add-machines-wizard .machines-container {
1531
    background-color: transparent;
1532
    float: left;
1533
    width: 400px;
1534
    font-size: 120%;
1535
}
1536

    
1537
#metadata-wizard .machine-icon {
1538
    float: left;
1539
    padding-left: 10px;
1540
    padding-right: 3px;
1541
    padding-top: 7px;
1542
}
1543

    
1544
#metadata-wizard .large-spinner, #add-machines-wizard .large-spinner {
1545
    display: block;
1546
    margin: 50px 0 0 185px;
1547
}
1548

    
1549
#metadata-wizard .metadata-key {
1550
    float: left;
1551
    width: 110px;
1552
    padding-left: 5px;
1553
}
1554

    
1555
#metadata-wizard .metadata-value {
1556
    width: auto;
1557
}
1558

    
1559
#metadata-wizard .metadata-add-template {
1560
    background-color: #74AEC9;
1561
    width: 350px;
1562
    position: relative;
1563
    overflow: visible;
1564
}
1565

    
1566
#metadata-wizard #add-meta-value {
1567
    margin-left: 25px;
1568
    width: 150px;
1569
}
1570

    
1571
#metadata-wizard button, #add-machines-wizard button {
1572
    font-size: 80%;
1573
    width: 87px;
1574
    float: right;
1575
    background-color: #5599FF;
1576
    border: 0px solid #5599FF;
1577
    padding: 0;
1578
    text-align: center;
1579
    margin-right: 8px;
1580
}
1581

    
1582
#metadata-wizard .buttons, #add-machines-wizard .buttons {
1583
    border-top: 2px solid #4085A5;
1584
    height: 30px;
1585
    margin-left: 25px;
1586
    margin-right: 40px;
1587
    width: 400px;
1588
    font-size: 120%;
1589
}
1590

    
1591
#metadata-wizard button.save, #add-machines-wizard button.cancel {
1592
    float: left;
1593
    height: 23px;
1594
    margin: 10px 0 0 0;
1595
    width: 87px;
1596
    background-color: #4085A5;
1597
    border-color: #4085A5;
1598
}
1599

    
1600
#metadata-wizard button.save:hover, #add-machines-wizard button.cancel:hover {
1601
    background-color: #7DB4CD;
1602
    border-color: #7DB4CD;
1603
}
1604

    
1605
#metadata-wizard button.create, #add-machines-wizard button.add {
1606
    height: 23px;
1607
    margin: 10px 0 0 0;
1608
    background-color: #FF6600;
1609
    border-color: #FF6600;
1610
}
1611

    
1612
#metadata-wizard button.create:hover, #add-machines-wizard button.add:hover {
1613
    background-color: #FF9651;
1614
    border-color: #FF9651;
1615
}
1616

    
1617
#metadata-wizard .editbuttons {
1618
    margin-top: 4px;
1619
    margin-right: 0;
1620
}
1621

    
1622
#metadata-wizard .vertical-separator {
1623
    height: 17px;
1624
    width: 1px;
1625
    background-color: #74AEC9;
1626
    float:left;
1627
    margin-right: 10px;
1628
}
1629

    
1630
#metadata-wizard h3, #add-machines-wizard h3 {
1631
    font-weight:normal;
1632
}
1633

    
1634
#metadata-wizard .metadata-edit {
1635
    clear: none;
1636
    cursor: pointer;
1637
    float: right;
1638
    margin-right: 0;
1639
    width: 40px;
1640
    margin-top: -14px;
1641
    display:none;
1642
}
1643

    
1644
#metadata-wizard .metadata-edit .edit, #metadata-wizard .metadata-edit .remove {
1645
    background-repeat: no-repeat;
1646
    color: transparent;
1647
    font-size: 75%;
1648
    float: left;
1649
    width: 16px;
1650
    height: 16px;
1651
}
1652

    
1653
#metadata-wizard .addbuttons {
1654
    display: block;
1655
    clear: none;
1656
    width: 40px;
1657
    margin-right: -1px !important;
1658
    margin-top: 2px;
1659
    float:right;
1660
    cursor: pointer;
1661
}
1662

    
1663
.metadata-pair-template .editbuttons {
1664
    margin-top: -19px !important;
1665
    margin-right: -2px !important;
1666
}
1667

    
1668
#metadata-wizard .metadata-edit .edit {
1669
    background-image: url("./meta-edit.png");
1670
    margin-left: 2px;
1671
}
1672

    
1673
#metadata-wizard .metadata-edit .remove, #metadata-wizard .editbuttons .remove {
1674
    background-image: url("./meta-remove.png");
1675
    margin-left: 4px;
1676
    background-repeat: no-repeat;
1677
    color: transparent;
1678
    font-size: 75%;
1679
    height: 16px;
1680
    width: 16px;
1681
    float: left;
1682
}
1683

    
1684
#metadata-wizard .editbuttons .save {
1685
    background-image: url("./meta-save.png");
1686
    padding-top:0;
1687
}
1688

    
1689
#metadata-wizard .addbuttons .cancel {
1690
    background-image: url("./meta-remove.png");
1691
    margin-left: 3px;
1692
}
1693

    
1694
#metadata-wizard .addbuttons .save {
1695
    background-image: url("./meta-save.png");
1696
    margin-left: 1px;
1697
}
1698

    
1699
#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 {
1700
    background-color: #4287a7;
1701
}
1702

    
1703
#metadata-wizard div.metadata-edit div.edit:hover, #metadata-wizard div.metadata-edit div.remove:hover, #metadata-wizard div.editbuttons div.remove:hover, #metadata-wizard div.editbuttons div.save:hover, #metadata-wizard div.addbuttons div.cancel:hover, #metadata-wizard div.addbuttons div.save:hover {
1704
    background-color: #74AEC9;
1705
}
1706

    
1707
#metadata-wizard .addbuttons .cancel, #metadata-wizard .addbuttons .save {
1708
    width: 16px;
1709
    height: 16px;
1710
    float: left;
1711
    background-repeat: no-repeat;
1712
    color: transparent;
1713
}
1714

    
1715
#metadata-wizard .metatextbox {
1716
    font-size: 90%;
1717
    height: 18px;
1718
    margin-top: -2px;
1719
    color: black;
1720
    width: 150px;
1721
}
1722

    
1723
#metadata-wizard p, #add-machines-wizard p {
1724
    margin-left: 7px;
1725
    width: 200px;
1726
}
1727

    
1728
#metadata-wizard div.bottomruler, #add-machines-wizard div.bottomruler {
1729
    background-color: #666;
1730
    height: 20px;
1731
    margin-top: 17px;
1732
}
1733

    
1734
#metadata-wizard button.remove {
1735
    height: 15px;
1736
    width: 70px;
1737
    background-color: #d35f5f;
1738
    border-color: #d35f5f;
1739
}
1740

    
1741
#metadata-wizard button.edit {
1742
    height: 15px;
1743
    width: 70px;
1744
    background-color: #666;
1745
    border-color: #666;
1746
    margin-top: -12px;
1747
}
1748

    
1749
#metadata-wizard input {
1750
    font-style: italic;
1751
    color: #ccc;
1752
}
1753

    
1754
#metadata-wizard textarea.edit-meta-value {
1755
    font-style: normal;
1756
    text-align: left;
1757
    color: black;
1758
    margin-top: 2px;
1759
    width:200px;
1760
    height: 49px;
1761
}
1762

    
1763
#metadata-wizard input {
1764
    font-size: 80%;
1765
}
1766

    
1767
#metadata-wizard input.key {
1768
    height: 15px;
1769
    left: 460px;
1770
    position: absolute;
1771
    top: 83px;
1772
    width: 230px;
1773
}
1774

    
1775
#metadata-wizard textarea.value {
1776
    width: 267px;
1777
    height: 170px;
1778
    overflow: auto;
1779
}
1780

    
1781
#metadata-wizard .input-enabled {
1782
    color: black;
1783
    text-align: left;
1784
    font-style: normal;
1785
}
1786

    
1787
#metadata-wizard label.meta-value {
1788
    vertical-align: top;
1789
}
1790

    
1791
#metadata-wizard button.cancel, #metadata-wizard #edit-dialog button.close {
1792
    float: left;
1793
    margin: 4px 0 0 25px;
1794
    background-color: #d35f5f;
1795
    border-color: #d35f5f;
1796
}
1797

    
1798
/* metadata dropdown combo */
1799
.meta-key {
1800
    margin-right: 18px;
1801
    float:left;
1802
}
1803
#metadata-wizard .textdropdown-outer {
1804
    float: left;
1805
    overflow: visible;
1806
}
1807

    
1808
#metadata-wizard .textdropdown-btn {
1809
    background: url("./dropdown-arrow.gif") no-repeat scroll center center transparent;
1810
    cursor: pointer;
1811
    float: right;
1812
    left: 90px;
1813
    margin-top: 4px;
1814
    position: absolute;
1815
    width: 20px;
1816
}
1817

    
1818
#metadata-wizard ul {
1819
    border: 1px solid #ccc;
1820
    padding: 0px;
1821
    list-style: none;
1822
    margin: 0px;
1823
    background-color: white;
1824
    height: auto !important;
1825
    padding-left: 5px;
1826
    width: 103px !important;
1827
    position: relative;
1828
}
1829

    
1830
#metadata-wizard ul li {
1831
    clear: both;
1832
    display: block;
1833
    float: right;
1834
    list-style: none outside none;
1835
    margin-bottom: 0 !important;
1836
    margin-left: 0 !important;
1837
    padding-bottom: 2px;
1838
    padding-right: 2px;
1839
    padding-top: 2px;
1840
    width: 100%;
1841
}
1842

    
1843
#metadata-wizard ul li:hover {
1844
    background-color: #efefef;
1845
    cursor: pointer;
1846
}
1847

    
1848
#metadata-wizard .dropdownitem {
1849
    margin-left: 10px;
1850
}
1851

    
1852
#metadata-wizard #txtdropdown:focus {
1853
    outline: 0 none;
1854
}
1855

    
1856
#metadata-wizard #add-meta-key {
1857
    height: 16px;
1858
    margin-left: 5px;
1859
    margin-top: 2px;
1860
    width: 105px !important;
1861
}
1862

    
1863
/* notification box */
1864
#yes-no {
1865
    height: 150px;
1866
    z-index: 9999;
1867
    border-bottom: 5px solid #4085A5;
1868
}
1869

    
1870
#yes-no p, #yes-no button {
1871
    margin-top: 15px;
1872
}
1873

    
1874
#error-success, #notification-box {
1875
    z-index: 9999;
1876
    border-bottom: 5px solid #4085A5;
1877
    min-height: 150px;
1878
    top: 120px !important;
1879
    position: absolute !important;
1880
}
1881

    
1882
#error-success p, #notification-box p {
1883
    margin-top: 5px;
1884
}
1885

    
1886
#error-success strong, #notification-box strong {
1887
    color: #F49C1A;
1888
}
1889

    
1890
#error-success .close, #notification-box .close {
1891
    background-image: url("./close-popup.png");
1892
    background-repeat: no-repeat;
1893
    cursor: pointer;
1894
    height: 13px;
1895
    position: absolute;
1896
    right: 7px;
1897
    top: 9px;
1898
    width: 13px;
1899
}
1900

    
1901
.popup-header-error {
1902
    background-color: #800000 !important;
1903
}
1904

    
1905
.popup-border-error {
1906
    border-color: #800000 !important;
1907
    width:auto;
1908
}
1909

    
1910
.popup-details-error {
1911
    border: none !important;
1912
}
1913

    
1914
.popup-separator-error {
1915
    margin-bottom: 5px !important;
1916
}
1917

    
1918
#error-success .popup-header, #notification-box .popup-header {
1919
    background-color: #4085A5;
1920
    color: white;
1921
    font-size: 95%;
1922
    font-weight: normal;
1923
    height: 20px;
1924
    margin-left: -16px;
1925
    margin-top: -16px;
1926
    padding-bottom: 2px;
1927
    padding-left: 30px;
1928
    padding-top: 10px;
1929
    width: 482px;
1930
    margin-right:-16px;
1931
}
1932

    
1933

    
1934
#error-success.success h3 span.header-box, #notification-box h3 span.header-box {
1935
    background-color: #71c837;
1936
    display: block;
1937
    background-image: url("./save-green.png");
1938
    background-position: right 0;
1939
    background-repeat: no-repeat;
1940
    width: 80px;
1941
    padding: 3px 3px 3px 8px;
1942
    margin-top: -6px;
1943
    font-size: 90% !important;
1944
    margin-left: -11px;
1945
}
1946

    
1947
#error-success .popup-body, #notification-box .popup-body {
1948
    background: url("./popup-bg.png") repeat-x scroll 0 0 transparent;
1949
    margin-left: -16px;
1950
    margin-right: -16px;
1951
    margin-top: 1px;
1952
    min-height: 142px;
1953
    padding-top: 10px;
1954
}
1955

    
1956
#error-success .popup-body-inner, #notification-box .popup-body-inner {
1957
    background: url("./popup-inner-bg.png") repeat-x scroll 0 0 transparent;
1958
    font-size: 80%;
1959
    min-height: 120px;
1960
    margin-left: 20px;
1961
    padding-left: 15px;
1962
    width: 460px;
1963
}
1964

    
1965
#error-success .popup-separator, #notification-box .popup-seperator {
1966
    background-color: #74AEC9;
1967
    height: 1px;
1968
    font-size:1%;
1969
    width: 442px;
1970
    margin-bottom: 30px;
1971
}
1972

    
1973
#error-success .machine-now-building {
1974
    font-size: 95%;
1975
    padding-bottom: 7px;
1976
    padding-top: 10px;
1977
}
1978

    
1979
#error-success.success .machine-now-building {
1980
    padding-bottom: 14px !important;
1981
}
1982

    
1983
#error-success .password-container, #notification-box .password-container {
1984
    width: 430px;
1985
    padding: 5px;
1986
    border: 2px solid #75b54a;
1987
    background-color: #aade87;
1988
}
1989

    
1990
#error-success .password-header, #notification-box .password-header {
1991
    margin-bottom: 5px;
1992
}
1993

    
1994
#error-success .password, #notification-box .password {
1995
    color: #447821;
1996
}
1997

    
1998
#error-success .popup-details {
1999
    border: 2px solid #FF7F2A;
2000
    float: left;
2001
    margin-left: 10px;
2002
    padding: 2px;
2003
}
2004

    
2005
#error-success.success .popup-details {
2006
    border: none !important;
2007
    float: none !important;
2008
    margin-left: none !important;
2009
    margin-top: 10px;
2010
}
2011

    
2012
#error-success.success .popup-separator {
2013
    margin-bottom: 14px !important;
2014
}
2015

    
2016
#error-success .write-password {
2017
    margin-bottom: 5px;
2018
    padding-left: 30px;
2019
}
2020

    
2021
#error-success .write-password-password {
2022
    padding-left: 30px;
2023
    color: #447821;
2024
    display: inline;
2025
    font-size: 110%;
2026
    font-weight: bold;
2027
}
2028

    
2029
#error-success .write-password-details {
2030
    font-size: 75%;
2031
}
2032

    
2033
.more-details {
2034
    display: block;
2035
}
2036

    
2037
#notification-box h3 span.header-box {
2038
    background: transparent;
2039
}
2040

    
2041
#notification-box .machine-now-building {
2042
    padding: 20px 0;
2043
}
2044

    
2045
#notification-box .header-box {
2046
    width: auto !important;
2047
}
2048

    
2049
#notification-box .password {
2050
    text-align: center;
2051
}
2052
#notification-box .password a:hover {
2053
    background-color: #447821;
2054
    color: #fff;
2055
}
2056

    
2057
#notification-box .password a {
2058
    padding: 0.2em;
2059
    text-align: center;
2060
    color: #447821;
2061
    font-weight: bold;
2062
    font-size: 1.2em;
2063
    text-decoration: none;
2064
}
2065

    
2066
.popup-details a:link, .popup-details a:visited{
2067
    color: black;
2068
}
2069

    
2070
/* Confirmation boxes */
2071
div.confirm_single, div.confirm_multiple, div.action_error {
2072
    display: none;
2073
    color: black;
2074
}
2075

    
2076
div.action-container.destroy div.confirm_single {
2077
    bottom: 0;
2078
    position: absolute;
2079
    left: 83px;
2080
}
2081

    
2082
div.terminated div.action-container.destroy div.confirm_single {
2083
    margin-top: 30px;
2084
}
2085

    
2086
div.confirm_single button, div.confirm_multiple button, div.action_error button {
2087
    font-size: 100%;
2088
    cursor: pointer;
2089
    color: black;
2090
    height: 20px !important;
2091
}
2092

    
2093
div.confirm_single {
2094
    float: right;
2095
    margin: -20px -122px 0 0;
2096
}
2097

    
2098
div.confirm_single button {
2099
    border: none;
2100
}
2101

    
2102
div.confirm_single button.yes {
2103
    width: 90px;
2104
    background-color:#FF7F2A;
2105
}
2106

    
2107
div.confirm_single button.yes:hover {
2108
    background-color: #FF9955;
2109
}
2110

    
2111
div.confirm_single button.no {
2112
    width: 20px;
2113
    margin-left:-5px;
2114
    background-color: #FF9955;
2115
    color:#d95d0a;
2116
}
2117

    
2118
div.confirm_single button.no:hover {
2119
    color: white;
2120
}
2121

    
2122
div.confirm_multiple {
2123
    background-color: #4085A5;
2124
    font-size: 75%;
2125
    z-index: 1;
2126
    position: absolute;
2127
    width: 698px;
2128
    height: 28px;
2129
    margin-top: 15px;
2130
}
2131

    
2132
div.confirm_multiple p {
2133
    float: left;
2134
    color: #FF7F2A;
2135
    font-weight: bold;
2136
    margin: 7px 0 0 200px;
2137
}
2138

    
2139
#networks-pane div.confirm_multiple p {
2140
    margin: 7px 0 0 100px;
2141
}
2142

    
2143
div.confirm_multiple button {
2144
    float: right;
2145
    background-color: transparent;
2146
    border: 1px solid #5CA1C0;
2147
    margin: 4px 5px 0 0;
2148
}
2149

    
2150
div.confirm_multiple button.yes {
2151
    border-color: #FF7F2A;
2152
    padding: 0 12px;
2153
}
2154

    
2155
div.confirm_multiple button.yes:hover {
2156
    background-color: #FF7F2A;
2157
}
2158

    
2159
div.confirm_multiple button.no {
2160
    padding: 0px 16px;
2161
}
2162

    
2163
div.confirm_multiple button.no:hover {
2164
    background-color: #5CA1C0;
2165
}
2166

    
2167
div.action_error {
2168
    width: 80px;
2169
    height: 60px;
2170
    padding: 5px;
2171
    margin: -2px 0 0 595px;
2172
    background-color: #4085A5;
2173
    font-size: 75%;
2174
    line-height: 1.5;
2175
    z-index:1;
2176
    color: #FF7F2A;
2177
    position:absolute;
2178
    top: 0px;
2179
}
2180

    
2181
.action_error button {
2182
    width: 80px !important;
2183
    background-color: transparent;
2184
    border: 1px solid;
2185
    padding: 0px;
2186
    border-color: #FF7F2A;
2187
}
2188

    
2189
div.action_error button.details {
2190
    margin: 5px 0 0 0px;
2191
    padding: 0 15px;
2192
}
2193

    
2194
div.action_error button.details:hover {
2195
    background-color: #FF7F2A;
2196
}
2197

    
2198
div#aboutuser{
2199
    float:right;
2200
    clear: both;
2201
    color: #FFFFFF;
2202
    font-size: 75%;
2203
    margin-top: -25px;
2204
}
2205

    
2206
div#user{
2207
    clear: both;
2208
    color: #FFFFFF;
2209
    font-size: 75%;
2210
    margin-top: 38px;
2211
    padding-bottom: 10px;
2212
    z-index: 400;
2213
    position: absolute;
2214
    right:0;
2215
}
2216

    
2217
div#user a{
2218
    color: #FFFFFF;
2219
    text-decoration: none;
2220
}
2221

    
2222
div#user a.current_lang {
2223
    color: #72ADC8;
2224
}
2225

    
2226
div#user .usermenu {
2227
    float: left;
2228
    cursor: pointer;
2229
    overflow: hidden;
2230
    padding-top: 5px;
2231
    margin-top: -5px;
2232
    position: relative;
2233
}
2234

    
2235
div#user .username {
2236
    display: block;
2237
    margin-right: 10px;
2238
    padding-right: 18px;
2239
    padding-left: 4em;
2240
    height: 20px;
2241
    background: url("./down-arrow-light.png") no-repeat right;
2242
    background-position: right 6px;
2243
    font-weight: normal;
2244
}
2245

    
2246
div#user .hovered {
2247
    background: #599EBD;
2248
    overflow: visible;
2249
    border-bottom: 1px solid #C7DFE9;
2250
}
2251

    
2252
div#user .hovered .username {
2253
    background-image: url("./down-arrow-lighter.png");
2254
}
2255

    
2256
div#user .active {
2257
    background-color: #BED5E0 !important;
2258
}
2259

    
2260
div#user .active .username {
2261
    color: #599EBD;
2262
    background-image: url("./down-arrow-lighter.png");
2263
}
2264

    
2265
div#user .useractions {
2266
    display: none;
2267
}
2268

    
2269
div#user .active .useractions {
2270
    display: block;
2271
    text-align: right;
2272
    color: #4085A5;
2273
    background-color: #D0E3ED;
2274
    margin-top:-1px;
2275
    border-top:1px solid #fff;
2276
    position: relative;
2277
    top: 1px;
2278
}
2279

    
2280
div#user .useractions li {
2281
    padding: 5px 10px;
2282
    border-bottom: 1px solid #efefef;
2283
    text-align: right;
2284
    display: block;
2285
    background-color: transparent;
2286
}
2287

    
2288
div#user .useractions li a {
2289
    color: #4085A5;
2290
    display: inline-block;
2291
    padding:5px 0;
2292
    padding-left: 30px;
2293
    padding-bottom: 6px;
2294
    background-repeat: no-repeat;
2295
    background-position: center left;
2296
}
2297

    
2298
div#user .useractions li.hovered {
2299
    background-color: #E1EFF6;
2300
}
2301

    
2302
div#user .useractions li.last {
2303
    border-bottom: none;
2304
}
2305

    
2306
div#user .useractions .logout a {
2307
    background-image: url("./icon-logout.png");
2308
}
2309

    
2310
div#user .langmenu {
2311
    float: left;
2312
    border-left: 1px solid #ffffff;
2313
    padding-left: 10px;
2314
    margin-left: -1px;
2315
}
2316

    
2317
div#user .langmenu .sep {
2318
    display: inline-block;
2319
    color: #72ADC8;
2320
}
2321

    
2322
.separator {
2323
    background-color: #74AEC9;
2324
    height: 10px;
2325
    width: 700px;
2326
    font-size: 1px;
2327
    line-height: 0px;
2328
}
2329

    
2330
#disks.separator {
2331
    background-color: #dea842;
2332
}
2333

    
2334
#networks.separator {
2335
    background-color: #6c535d;
2336
}
2337

    
2338
.network-machine h5 {
2339
    margin-bottom: 26px;
2340
    margin-top:0px;
2341
}
2342

    
2343
.machine-container .separator {
2344
    width: 508px;
2345
    height: 1px;
2346
    margin-top: 2px;
2347
    background-color: #5CA1C0;
2348
    margin-left: 13px;
2349
}
2350

    
2351
.machine h5 {
2352
    margin: -3px 0px 4px 0px;
2353
}
2354

    
2355
.machine h5.namecontainer {
2356
    margin-top: 1px;
2357
}
2358

    
2359
.editbuttons {
2360
    display: block;
2361
    clear: none;
2362
    width: 40px;
2363
    margin-right: 32%;
2364
    padding-top: 2px;
2365
    float: right;
2366
    cursor: pointer;
2367
    position: relative;
2368
    z-index: 1000;
2369
}
2370

    
2371
div.editbuttons div.save:hover, div.editbuttons div.cancel:hover {
2372
    background-color: #84b7d0;
2373
}
2374

    
2375
div.editbuttons div.cancel:hover {
2376
    background-image: url("./cancel-onhover.png");
2377
}
2378

    
2379
.editbuttons .cancel, .editbuttons .save {
2380
    background-repeat: no-repeat;
2381
    color: transparent;
2382
    height: 16px;
2383
    width: 16px;
2384
    float: left;
2385
}
2386

    
2387
.editbuttons .cancel {
2388
    background-image: url("./cancel.png");
2389
    margin-left: 3px;
2390
}
2391

    
2392
.editbuttons .save {
2393
    background-image: url("./save.png");
2394
    margin-left: 1px;
2395
}
2396

    
2397
.editbuttons img {
2398
    float:none !important;
2399
    margin: 0px !important;
2400
}
2401

    
2402
.namecontainer {
2403
    height: 18px;
2404
    margin-top: 9px;
2405
}
2406

    
2407
.nametextbox {
2408
    font-size: 95%;
2409
}
2410

    
2411
.large-spinner {
2412
    background: url("./icons/indicators/large/progress.gif");
2413
    margin-left: 298px;
2414
    margin-top: 0px;
2415
    height: 31px;
2416
    width: 31px;
2417
    position: absolute;
2418
}
2419

    
2420
.list .large-spinner {
2421
    margin-top:-30px;
2422
}
2423

    
2424
.single .large-spinner {
2425
    margin-top: 50px;
2426
}
2427

    
2428
div#networks-container .large-spinner {
2429
    margin-top: 50px;
2430
}
2431

    
2432
/* tables in list view */
2433
div.list div.dataTables_filter {
2434
    font-size: 75%;
2435
    display: none;
2436
    margin-bottom: 12px;
2437
}
2438

    
2439
div.list div.dataTables_filter input{
2440
    font-size: 100%;
2441
}
2442

    
2443
.dataTables_wrapper {
2444
    width: 515px;
2445
    padding-bottom: 40px;
2446
}
2447

    
2448
div.list table thead .sorting, div.list table thead .sorting_desc, div.list table thead .sorting_asc {
2449
    padding-right: 15px !important;
2450
}
2451

    
2452
div.list table {
2453
    width: 515px;
2454
    font-size: 75%;
2455
}
2456

    
2457
div.list table tbody td {
2458
    color: #3D3D3D;
2459
    padding:6px;
2460
    vertical-align: middle;
2461
}
2462

    
2463
div.list table thead tr th {
2464
    background-color: #CDE2EC;
2465
    background-image: url(bg.gif);
2466
    background-repeat: no-repeat;
2467
    background-position: right 11px;
2468
    font-weight: normal;
2469
    border: 1px solid transparent;
2470
    border-bottom: none;
2471
    padding: 4px;
2472
    text-align: left;
2473
    vertical-align: middle;
2474
    cursor: pointer;
2475
}
2476

    
2477
div.list table thead .sorting_asc, div.list table thead .sorting_desc {
2478
    background-color: #5CA1C0;
2479
}
2480

    
2481
div.list table thead .sorting_asc {
2482
    background-image: url(asc.gif);
2483
}
2484

    
2485
div.list table thead .sorting_desc {
2486
    background-image: url(desc.gif);
2487
}
2488

    
2489
div.list table .selection div.expand-icon {
2490
    background-image: url(asc.gif);
2491
    background-repeat: no-repeat;
2492
    position: relative;
2493
    cursor: pointer;
2494
    width: 15px;
2495
    height: 4px;
2496
    left: 19px;
2497
    top: -11px;
2498
}
2499

    
2500
ul.dropdown-selector {
2501
    background-color: #E6EEEE;
2502
    position: absolute;
2503
    margin-left: 1px;
2504
    display: block;
2505
    top: 255px;
2506
    font-size:75%;
2507
    width:40px;
2508
}
2509

    
2510
ul.dropdown-selector li {
2511
    padding: 4px;
2512
}
2513

    
2514
ul.dropdown-selector li:hover {
2515
    background-color: #5CA1C0;
2516
}
2517

    
2518
ul.dropdown-selector li a{
2519
    color: black;
2520
    text-decoration: none;
2521
}
2522

    
2523
div.list table span.imagetag {
2524
    display: none;
2525
}
2526

    
2527
div.list table thead .vmos {
2528
    width: 20px !important;
2529
    vertical-align:middle;
2530
}
2531

    
2532
div.list table .selection {
2533
    width: 20px !important;
2534
    text-align: left;
2535
    background-image: none;
2536
    padding-left: 6px;
2537
}
2538

    
2539
div.list table thead .vmflavor {
2540
    width: 100px !important;
2541
}
2542

    
2543
/* group column commented out for v0.5
2544
div.list table thead .vmgroup {
2545
    width: 40px !important;
2546
}
2547
*/
2548

    
2549
div.list table thead .vmstatus {
2550
    width: 50px !important;
2551
}
2552

    
2553
div.list table thead .vmname {
2554
    width: 110px !important;
2555
}
2556

    
2557
.spinner, .action-indicator {
2558
    clear: right;
2559
    float:right !important;
2560
    margin: 10px 6px 0 15px !important;
2561
}
2562
.action-indicator {
2563
    margin-right: 18px !important;
2564
}
2565

    
2566
.wave {
2567
    clear: right;
2568
    float:right !important;
2569
    margin: 10px 15px 0 15px !important;
2570
}
2571

    
2572
#networks-pane .spinner {
2573
    margin-top: 18px !important;
2574
}
2575

    
2576
.hidden {
2577
    display:none;
2578
}
2579

    
2580
div.actions a.selected, div.actions a.selected:hover, div.machine-actions a.selected, div.machine-actions a.selected:hover {
2581
    display:block !important;
2582
}
2583

    
2584
.action_error .message, .action_error .code {
2585
    display: none;
2586
}
2587

    
2588
.fixed {
2589
    bottom: 0;
2590
    position: fixed !important;
2591
}
2592

    
2593
/* Networks */
2594
#networks-pane {
2595
    background-color: transparent;
2596
    color: black;
2597
    margin-left: 1px;
2598
    margin-right: 0;
2599
}
2600

    
2601
#networkscreate {
2602
    color: black;
2603
    background-color: #FF7F2A;
2604
    cursor: pointer;
2605
    padding: 7px 24px;
2606
    text-decoration: none;
2607
}
2608

    
2609
#networkscreate:hover {
2610
    background-color: #FF9955;
2611
}
2612

    
2613
#networks-pane #beforecreate {
2614
    margin-left: -13px;
2615
}
2616

    
2617
#networks-container {
2618
    margin-top: 10px;
2619
    min-height: 270px;
2620
}
2621

    
2622
#networks-createcontainer {
2623
    position: absolute;
2624
    top: 155px;
2625
}
2626

    
2627
#networks-pane .public-networks {
2628
    background: url("./terminated-bg.png") repeat scroll 0 0 transparent;
2629
    margin: 0 0 18px;
2630
    padding: 70px 0 15px 35px;
2631
}
2632

    
2633
#networks-pane .private-networks {
2634
    background: url("./running-bg.png") repeat scroll 0 0 transparent;
2635
    padding: 15px 20px 20px 35px;
2636
}
2637

    
2638
#public-template, #private-template, #public-machine-template, #private-machine-template {
2639
    display:none;
2640
}
2641

    
2642
div.network a.action-network-add {
2643
    display: none;
2644
}
2645

    
2646
div.network a.action-network-destroy {
2647
    margin-top: 32px !important;
2648
    width: 50px;
2649
    display: none;
2650
}
2651

    
2652
div.network {
2653
    clear: both;
2654
    min-height: 65px;
2655
    margin: 5px 0 0 -35px;
2656
    padding: 3px 20px 0;
2657
    width: 480px;
2658
    position: relative;
2659
}
2660

    
2661
#private-template {
2662
    margin: 2px 0 0 -30px;
2663
}
2664

    
2665
div.network-placeholder {
2666
    margin-left: 33px;
2667
}
2668

    
2669
div.private-networks div.network-placeholder {
2670
    border-left: 3px solid #FF7F2A;
2671
}
2672

    
2673
div.network-cable {
2674
    border-left: 3px solid #FF7F2A;
2675
    float: left;
2676
    margin-left: -40px;
2677
    margin-top: -45px;
2678
    height: 185px;
2679
    overflow: hidden;
2680
}
2681

    
2682
.first div.network-cable {
2683
    height:143px;
2684
    margin-top:-6px;
2685
    position: relative;
2686
}
2687

    
2688
div.network-contents div.machines-list div.first {
2689
    margin-top:0;
2690
}
2691

    
2692
.last div.network-cable {
2693
    height:85px;
2694
}
2695

    
2696
div.firewall-cable {
2697
    border-left: 3px solid #FF7F2A;
2698
    float: left;
2699
    margin-left: -100px;
2700
    margin-top: -20px;
2701
    height: 110px;
2702
}
2703

    
2704
.last div.firewall-cable {
2705
    display:none;
2706
}
2707

    
2708
div.network a:hover {
2709
    text-decoration: underline;
2710
    cursor: pointer;
2711
}
2712

    
2713
#networks-container .name {
2714
    font-size: 75%;
2715
}
2716

    
2717
div.network-machines, div.firewall {
2718
    font-size: 75%;
2719
    margin-left: 70px;
2720
}
2721

    
2722
div.firewall {
2723
    margin-left: 60px;
2724
    margin-bottom: 3px;
2725
}
2726

    
2727
div.machines-header, div.firewall-header {
2728
    background-color: #A1C8DB;
2729
    color: white;
2730
    cursor: pointer;
2731
    height: 17px;
2732
    width: 103px;
2733
}
2734

    
2735
 div.private-networks div.machines-header {
2736
    margin-top: -5px;
2737
}
2738

    
2739
div.network:hover div.machines-header, div.network:hover div.firewall-header {
2740
    background-color: #84b7d0;
2741
}
2742

    
2743
div.network-machine:hover div.firewall-header {
2744
    background-color: #5CA1C0;
2745
}
2746

    
2747
div.machines-label, div.firewall-label {
2748
    width: 100%;
2749
    padding-bottom:1px;
2750
    padding-left: 3px;
2751
}
2752

    
2753
div.firewall-label.darker {
2754
    background-color: #4085a5;
2755
}
2756

    
2757
.state {
2758
    float: right;
2759
    position: absolute;
2760
    right: 10px;
2761
    top: 40px;
2762
    font-size: 75%;
2763
}
2764

    
2765
div.network div.actions {
2766
    float: right;
2767
    font-size: 75%;
2768
    font-weight: normal;
2769
    height: 70px;
2770
    width: 100px;
2771
    position: absolute;
2772
    right: -100px;
2773
    top: 0;
2774
}
2775

    
2776
div.network div.machine-actions {
2777
    text-decoration: none;
2778
    float: right;
2779
    width: 100px;
2780
    margin: -7px -100px 0 0;
2781
    font-weight: normal;
2782
    font-size: 75%;
2783
}
2784

    
2785
div.network div.actions a, div.network div.machine-actions a {
2786
    text-decoration: none;
2787
    height: 15px;
2788
    color: black;
2789
    visibility: hidden;
2790
    display: block;
2791
}
2792

    
2793
div.network div.actions a {
2794
    margin: 4px 0 0 8px;
2795
}
2796

    
2797
div.network div.machine-actions a {
2798
    margin: 8px 0 0 8px;
2799
}
2800

    
2801
div.network div.actions a:hover, div.network div.machine-actions a:hover {
2802
    display: block;
2803
    background-color:#A1C8DB;
2804
    width: 200px;
2805
    opacity: 0.8;
2806
    filter: alpha(opacity = 80);
2807
}
2808

    
2809
div.network:hover div.actions a, div.network-machine:hover div.machine-actions a {
2810
    visibility: visible;
2811
}
2812

    
2813
div.network div.actions a.selected, div.network div.machine-actions a.selected {
2814
    color: #FF7F2A !important;
2815
    width: 50px !important;
2816
}
2817

    
2818
div.network div.actions a.selected:hover, div.network div.machine-actions a.selected:hover {
2819
    background-color: transparent;
2820
}
2821

    
2822
div.network div.display a {
2823
    visibility: visible;
2824
}
2825

    
2826
div.network-machine div.machine-actions a.action-details {
2827
    margin-top: 7px;
2828
}
2829

    
2830
div.network:hover {
2831
    background-color: #A1C8DB !important;
2832
}
2833

    
2834
.network-logos {
2835
    float:left;
2836
    padding-right: 10px;
2837
}
2838

    
2839
.network-logos:hover {
2840
    cursor: pointer;
2841
}
2842

    
2843
.state div {
2844
    text-align: right;
2845
    margin: 4px 1px -4px;
2846
}
2847

    
2848
.public-networks .state div {
2849
    margin-top: 4px;
2850
}
2851

    
2852
.private-networks .state div {
2853
    margin-top: 9px;
2854
    margin-bottom: -12px;
2855
}
2856

    
2857
.public-networks .name-div {
2858
    margin-top:-7px;
2859
    margin-bottom: 23px;
2860
}
2861

    
2862
div.indicator {
2863
    clear: none;
2864
    float: right;
2865
    height: 11px;
2866
    margin: 3px -1px;
2867
    width: 10px;
2868
}
2869

    
2870
#private-networks {
2871
    margin-top: 20px;
2872
}
2873

    
2874
.private-networks .editbuttons {
2875
    margin-right: 22%;
2876
}
2877

    
2878
.private-networks div.confirm_single {
2879
    margin: 45px -219px -5px 0;
2880
    font-size: 80%;
2881
}
2882

    
2883
.private-networks .network-machine div.confirm_single {
2884
    margin: 0 -199px 0 0;
2885
}
2886

    
2887
.private-networks .state {
2888
    top: 35px;
2889
}
2890

    
2891
.private-networks div.machines-list {
2892
    padding-top: 3px;
2893
}
2894

    
2895
span.rename-network, span.configure {
2896
    background-repeat: no-repeat;
2897
    color: transparent;
2898
    font-size: 75%;
2899
    font-weight: normal;
2900
    margin-left: 10px;
2901
    padding-left: 10px;
2902
    text-align: left;
2903
}
2904

    
2905
span.rename-network {
2906
    cursor: pointer;
2907
}
2908

    
2909
div.name-div:hover span.rename-network {
2910
    color: #3D3D3D;
2911
    margin-top: 0.4em;
2912
    background-image: url(./pencil.png);
2913
    background-position: 0 3px;
2914
}
2915

    
2916
div.network:hover a.rename {
2917
    color: #3d3d3d;
2918
}
2919

    
2920
.network-separator {
2921
    background-color: #5CA1C0;
2922
    height: 1px;
2923
    margin: 2px 0 0 -5px;
2924
    width: 480px;
2925
    font-size: 1%;
2926
    line-height: 1px;
2927
}
2928

    
2929
.network-contents {
2930
    margin-left: -4px;
2931
    width: 504px;
2932
    clear: both;
2933
    padding-bottom: 7px;
2934
}
2935

    
2936
.network-machine .state div {
2937
    text-align: left;
2938
}
2939

    
2940
.network-machine {
2941
    margin-left: 35px;
2942
    padding-bottom: 5px;
2943
    padding-left: 5px;
2944
    padding-top: 5px;
2945
    margin-top: 5px;
2946
}
2947

    
2948
.network-machine .logo {
2949
    float:left;
2950
    padding-right: 10px;
2951
    position:relative;
2952
}
2953

    
2954
#networks-container .machine-name {
2955
    text-decoration: none !important;
2956
    margin-bottom: 10px;
2957
    color: #000000;
2958
    margin-top: -4px;
2959
}
2960

    
2961
.private-networks .separator {
2962
    background-color: #5CA1C0;
2963
    height: 1px;
2964
    margin: 3px 0 -2px -10px;
2965
    width: 485px;
2966
}
2967

    
2968
.network-machine .state {
2969
    margin-right: 18px;
2970
}
2971

    
2972
.network-machine .state .status {
2973
    margin-bottom: 4px;
2974
}
2975

    
2976
.machine-name .name {
2977
    margin-top: -10px !important;
2978
}
2979

    
2980
.machine-name .namecontainer {
2981
    line-height: 18px;
2982
    margin-bottom: 20px;
2983
}
2984

    
2985
div.network-machine:hover {
2986
    background-color: #84B7D0;
2987
}
2988

    
2989
.machines {
2990
    width: 416px;
2991
    margin-bottom: -8px;
2992
    margin-top: 10px;
2993
}
2994

    
2995
div.empty-network-slot {
2996
    height: 60px;
2997
}
2998

    
2999
div.network-remove-machine, div.network-add-machine {
3000
    background-color: #FB822F;
3001
    color: #bc4b00;
3002
    width:90px;
3003
    height:18px;
3004
    float:left;
3005
    margin:40px 0 0 -100px;
3006
}
3007

    
3008
span.remove-icon {
3009
    font-size: 80%;
3010
    margin-left: 15px;
3011
}
3012

    
3013
div.add-icon {
3014
    margin-left: 15px;
3015
    margin-top: -3px;
3016
    cursor: pointer;
3017
}
3018

    
3019
span.remove-icon:hover, span.add-icon:hover {
3020
    cursor:pointer;
3021
    color: #fff;
3022
}
3023

    
3024
div.network-add-machine {
3025
    margin:43px 0 0 -3px;
3026
}
3027

    
3028
.firewall-on {
3029
    color: #42E342;
3030
}
3031

    
3032
.firewall-off {
3033
    color: #F82E2E;
3034
}
3035

    
3036
.firewall-content {
3037
    color: black;
3038
    font-size: 60%;
3039
    margin-left: 60px;
3040
    height: 55px;
3041
    margin-bottom: 17px;
3042
}
3043

    
3044
.firewall-content .checkbox-legends {
3045
    vertical-align: text-top;
3046
}
3047

    
3048
.checkbox-legends a {
3049
    color: black;
3050
    text-decoration: underline;
3051
    font-size: 100%;
3052
}
3053

    
3054
h5.machine-connect {
3055
    font-size: 75%;
3056
    margin-bottom: 3px;
3057
}
3058

    
3059
.machine-connect span {
3060
    text-decoration: underline;
3061
}
3062

    
3063
h5.machine-connect span:hover {
3064
    cursor: pointer;
3065
}
3066

    
3067
.firewall-apply {
3068
    background-color: #4085a5;
3069
    border: medium none;
3070
    float: right;
3071
    font-size: 105%;
3072
    height: 18px;
3073
    margin-right: 5px;
3074
    margin-top: 3px;
3075
    width: 75px;
3076
}
3077

    
3078
.firewall-apply:hover {
3079
    background-color:#5CA1C0;
3080
}
3081

    
3082
.name-div {
3083
    margin: -9px 0 30px 70px;
3084
}
3085

    
3086
.machine-name-div {
3087
    margin-bottom: 20px;
3088
    margin-left: 60px;
3089
}
3090

    
3091
div.reboot-dialog {
3092
    display: none;
3093
    color: black;
3094
    background-color: #4085A5;
3095
    font-size: 75%;
3096
    margin-top: 15px;
3097
    width: 698px;
3098
    z-index: 1;
3099
}
3100

    
3101
div#reboot-machine-template, div.reboot-machine-entry {
3102
    display: none;
3103
    padding: 0 0 10px 35px;
3104
    width: 300px;
3105
}
3106

    
3107
div.reboot-dialog p {
3108
    color: #FFFFFF;
3109
    padding: 10px 0 10px 10px;
3110
}
3111

    
3112
div.reboot-dialog button {
3113
    float:right;
3114
    border: 1px solid #FF7F2A;
3115
    background-color: transparent;
3116
    font-size:100%;
3117
}
3118

    
3119
div.reboot-dialog button:hover {
3120
    background-color: #FF7F2A;
3121
}
3122

    
3123
div.reboot-dialog button.reboot-all {
3124
    margin: -30px 35px 0 0;
3125
}
3126

    
3127
div.reboot-dialog button.reboot-single {
3128
    color: black;
3129
    margin-top: -20px;
3130
}
3131

    
3132
div.reboot-dialog div.code, div.reboot-dialog div.action, div.reboot-dialog div.message, div.reboot-dialog button.details {
3133
    display:none;
3134
}
3135

    
3136
div.reboot-dialog button.details {
3137
    border-color: #800000;
3138
    margin-top: -20px;
3139
}
3140

    
3141
div.reboot-dialog button.details:hover {
3142
    background-color: #800000;
3143
}
3144

    
3145
/* Metadata */
3146
.info-content {
3147
    clear: both;
3148
    height: 95px;
3149
    width: 512px;
3150
}
3151

    
3152
.metadata-container {
3153
    line-height: 12px;
3154
    height: 85px;
3155
    background-color: #84b7d0;
3156
}
3157

    
3158
.metadata-column {
3159
    border-right: 1px solid #5CA1C0;
3160
    color: black;
3161
    float: left;
3162
    font-size: 60%;
3163
    margin-top: 3px;
3164
    height: 70px;
3165
    padding-bottom: 5px;
3166
}
3167

    
3168
.vm-stats {
3169
    padding-left: 10px;
3170
    padding-right: 5px;
3171
    width: 220px;
3172
}
3173

    
3174
.vm-stats div.stat-content {
3175
    height: 18px;
3176
}
3177

    
3178
.vm-stats div.stat-content img {
3179
    margin: 0;
3180
}
3181

    
3182
.vm-stats div.stat-content img.busy {
3183
    margin-left: 95px;
3184
}
3185

    
3186
.vm-stats div.stat-error {
3187
    display:none;
3188
}
3189

    
3190
.vm-details {
3191
    width: 130px;
3192
    margin-left:17px;
3193
}
3194

    
3195
.vm-metadata {
3196
    padding-left: 10px;
3197
    width: 100px;
3198
    border: none;
3199
}
3200

    
3201
.metadata-left {
3202
    float:left;
3203
    width: 30px;
3204
    height: 60px;
3205
}
3206

    
3207
.metadata-right {
3208
    width: 73px;
3209
    float:left;
3210
    height: 35px;
3211
    padding-left: 5px;
3212
    position:relative;
3213
    overflow:hidden;
3214
}
3215

    
3216
.metadata-right .items {
3217
    position:absolute;
3218
    height:20000em;
3219
}
3220

    
3221
.metadata-keys-container {
3222
    height: 60px;
3223
    float: left;
3224
}
3225

    
3226
.single .metadata-keys-container {
3227
    float: none;
3228
    height: 50px;
3229
}
3230

    
3231
.single a.manage-metadata {
3232
    font-size: 80%;
3233
    margin-left:4px;
3234
    color: #383838;
3235
}
3236

    
3237
a.manage-metadata, a.stats-report {
3238
    font-size: 100%;
3239
    color: black;
3240
    margin-left:17px;
3241
    text-decoration: underline;
3242
}
3243

    
3244
a.stats-report {
3245
    margin: 15px 0  0 80px;
3246
}
3247

    
3248
div.machine a.manage-metadata:hover {
3249
    background-color: transparent;
3250
}
3251

    
3252
.metadata-actions, .scrollable {
3253
    padding-left: 5px;
3254
}
3255

    
3256
.singe .metadata-actions, .single .scrollable {
3257
    font-size: 80%;
3258
    line-height: 12px;
3259
    width: 300px;
3260
}
3261

    
3262
.metadata-actions .prev,  .metadata-actions .next{
3263
    float:left;
3264
    width:29px;
3265
    height:6px;
3266
    cursor: pointer;
3267
}
3268

    
3269
.metadata-actions .prev {
3270
    background: url("./roll-up.png") no-repeat scroll 0 0 transparent;
3271
}
3272

    
3273
.metadata-actions .next {
3274
    background: url("./roll-down.png") no-repeat scroll 0 0 transparent;
3275
}
3276

    
3277
.scrollable {
3278
    position:relative;
3279
    overflow:hidden;
3280
    height: 35px;
3281
    width: 60px;
3282
    margin-bottom:2px;
3283
}
3284

    
3285
.scrollable .items {
3286
    position:absolute;
3287
    height:20000em;
3288
}
3289

    
3290
/* single view */
3291
.single {
3292
    color: #383838;
3293
    margin-top: -76px;
3294
    padding-bottom: 10px;
3295
    width: 679px;
3296
}
3297

    
3298
.single .column1 {
3299
    float: left;
3300
    margin: 1px 0 25px 17px;
3301
    width: 140px;
3302
}
3303

    
3304
.single .column1 .state {
3305
    float: left;
3306
    margin-left: 4px;
3307
    padding-bottom: 6px;
3308
    padding-top: 3px;
3309
    position: relative;
3310
    right: 0;
3311
    text-align: center;
3312
    width: 126px;
3313
}
3314

    
3315
.single .column1 .state-label {
3316
    padding-top: 5px;
3317
}
3318

    
3319
.single .column1 .indicators {
3320
    margin-right: 38px !important;
3321
}
3322

    
3323
.single div.connect-arrow {
3324
    margin-left: -17px;
3325
}
3326

    
3327
.single div.connect-border {
3328
    margin-left: -29px;
3329
}
3330

    
3331
.single .single-actions {
3332
    padding-bottom: 4px;
3333
    padding-left: 15px;
3334
    width: 69px;
3335
    float: left;
3336
}
3337

    
3338
.single div.single-action {
3339
    font-size: 80%;
3340
    line-height: 18px;
3341
    text-decoration: none;
3342
    cursor: pointer;
3343
}
3344

    
3345
.single div.single-action:hover {
3346
    background-color:#A1C8DB;
3347
    width: 180px;
3348
    opacity: 0.8;
3349
    filter: alpha(opacity = 80);
3350
}
3351

    
3352
.single div.single-action.selected {
3353
    color: #FF7F2A !important;
3354
    width: 50px !important;
3355
}
3356

    
3357
.single div.single-action.selected:hover {
3358
    background-color:transparent;
3359
}
3360

    
3361
.single div.confirm_single {
3362
    font-size: 80%;
3363
    margin: -19px -115px 0 0;
3364
}
3365

    
3366
.single div.action-container.destroy div.confirm_single {
3367
    margin: -18px -116px 0 0;
3368
    position: relative;
3369
    left: 0px;
3370
}
3371

    
3372
.single div.confirm_single button.no {
3373
    margin-left: -5px;
3374
}
3375

    
3376
.single .spinner, .single .action-indicator {
3377
    margin: 15px 45px 0 0px !important
3378
}
3379

    
3380
.single .action-indicator {
3381
    margin-right: 55px !important;
3382
}
3383

    
3384
.single .wave {
3385
    margin: 15px 53px 0 0px !important
3386
}
3387

    
3388
.single div.action_error {
3389
    margin: 2px 0px 0 605px !important;
3390
    position: relative;
3391
}
3392

    
3393
.single .column2 {
3394
    background-color: #A1C8DB;
3395
    float: left;
3396
    font-size: 78%;
3397
    line-height: 17px;
3398
    margin: 0 0 10px 5px;
3399
    width: 358px;
3400
}
3401

    
3402
.single .column2 .machine-labels {
3403
    float: left;
3404
    font-size: 90%;
3405
    margin-left: 10px;
3406
    margin-top: 10px;
3407
    width: 125px;
3408
}
3409

    
3410
.single .column2 .machine-details {
3411
    float: right;
3412
    text-align: right;
3413
    font-size: 90%;
3414
    width: 210px;
3415
    margin-right: 10px;
3416
    margin-top: 10px;
3417
}
3418

    
3419
.single .column2 .name, .single .column2 .disk, .single .column2 .image-size, .single .column2 .ipv6 {
3420
    margin-bottom: 13px;
3421
}
3422

    
3423
.single .tags {
3424
    clear: both;
3425
    margin-bottom: 10px;
3426
    margin-left: 10px;
3427
}
3428

    
3429
.single .tags-label {
3430
    float: left;
3431
    padding: 0 5px;
3432
    width: 30px;
3433
}
3434

    
3435
.single .tags-down-arrow {
3436
    background: url("/static/tags-down-arrow.png") no-repeat scroll 1px 7px transparent;
3437
    float: left;
3438
    height: 16px;
3439
    width: 9px;
3440
}
3441

    
3442
.single .tags-header {
3443
    background-color: #84B7D0;
3444
    cursor: pointer;
3445
    height: 16px;
3446
    width: 55px;
3447
}
3448

    
3449
.single .tags-content {
3450
    background-color: #84B7D0;
3451
    clear: both;
3452
    height: 65px;
3453
    padding-bottom: 5px;
3454
    padding-top: 5px;
3455
    width: 300px;
3456
}
3457

    
3458
.single .column3 {
3459
    background-color: #A1C8DB;
3460
    margin-left: 535px;
3461
    position: absolute;
3462
    top: 280px;
3463
    width: 150px;
3464
    overflow: visible;
3465
    padding-bottom: 10px;
3466
}
3467

    
3468
.single .column3 .controls {
3469
    font-size: 80%;
3470
    height: 20px;
3471
    padding-left: 7px;
3472
    padding-right: 7px;
3473
    padding-top: 8px;
3474
}
3475

    
3476
.single .column3 .previous {
3477
    float:left;
3478
    width: 72px;
3479
}
3480

    
3481
.single .column3 .next {
3482
    float: right;
3483
    text-align: center;
3484
    width: 60px;
3485
}
3486

    
3487
.single .column3 .next-label {
3488
    float: right;
3489
    margin-right: 3px;
3490
    margin-top: -2px;
3491
}
3492

    
3493
.single .column3 .next-arrow {
3494
    float: right;
3495
    height: 18px;
3496
    width: 10px;
3497
    background: url("./right-arrow.png") no-repeat scroll 3px 2px transparent;
3498
}
3499

    
3500
.single .column3 .prev-label {
3501
    float: left;
3502
    margin-left: 3px;
3503
    margin-top: -2px;
3504
}
3505

    
3506
.single .column3 .prev-arrow {
3507
    background: url("./left-arrow.png") no-repeat scroll 3px 2px transparent;
3508
    float: left;
3509
    height: 18px;
3510
    width: 10px;
3511
}
3512

    
3513
.single .column3 .separator {
3514
    width: 135px;
3515
    height: 1px;
3516
    background-color: #84B7D0;
3517
    margin: 0 0 0 7px;
3518
    clear: both;
3519
}
3520

    
3521
.single .column3 .servers {
3522
    font-size: 80%;
3523
    line-height: 15px;
3524
    padding-top: 10px;
3525
    text-align: right;
3526
    overflow: visible;
3527
    position: relative;
3528
}
3529

    
3530
.single .column3 .server-name {
3531
    margin-left: 10px;
3532
    padding-right: 5px;
3533
    cursor: pointer;
3534
    padding-bottom: 2px;
3535
}
3536

    
3537
div.single div.column3 div.server-name:hover, .single .column3 .column3-selected {
3538
    background-color: #84B7D0;
3539
    color: white;
3540
    opacity: 0.8;
3541
    padding-left: 9px;
3542
    text-align: left;
3543
    width: 160px;
3544
    filter: alpha(opacity = 80);
3545
    position: relative;
3546
}
3547

    
3548
.single .toggler {
3549
    color: #FFFFFF;
3550
    float: right;
3551
    font-size: 140%;
3552
}
3553

    
3554
.single .cpu-usage, .single .network-usage {
3555
    text-align: center;
3556
    padding-top: 15px;
3557
    margin-bottom: 5px;
3558
    font-size: 90%;
3559
    font-weight: bold;
3560
}
3561

    
3562
.single .cpu-graph, .single .network-graph {
3563
    margin-left: 20px;
3564
    margin-bottom:30px;
3565
    width: 660px;
3566
}
3567

    
3568
.single div.lower img.stats {
3569
    margin-left: 82px;
3570
}
3571

    
3572
.single .single-image {
3573
    width: 126px;
3574
    height: 136px;
3575
    margin-bottom: 10px;
3576
    margin-left: 4px;
3577
    background-image: url("./icons/machines/large/unknown-sprite.png");
3578
    background-repeat: no-repeat;
3579
    cursor: pointer;
3580
}
3581

    
3582
.single .single-image-state1 {
3583
    background-position: 0px 0;
3584
}
3585

    
3586
.single .single-image-state3 {
3587
    background-position: -252px 0;
3588
}
3589

    
3590
.single .single-image-state4 {
3591
    background-position: -378px 0;
3592
}
3593

    
3594
.single .single-image-state2 {
3595
    background-position: -126px 0;
3596
}
3597

    
3598
.single .column3 .previous, .single .column3 .next {
3599
    cursor: pointer;
3600
    background-color: #84B7D0;
3601
    color: white;
3602
    font-size: 100%;
3603
    height: 15px;
3604
    padding-top: 2px;
3605
}
3606

    
3607
.single .column3 .disabled {
3608
    opacity: 0.5;
3609
    filter: alpha(opacity = 50);
3610
}
3611

    
3612
.single div.lower {
3613
    clear:both;
3614
    background: url("./terminated-bg.png") repeat scroll 0 0 transparent;
3615
    width: 700px;
3616
    padding-bottom: 15px;
3617
}
3618

    
3619
.single div.upper {
3620
    background: url("./terminated-bg.png") repeat scroll 0 0 transparent;
3621
    margin-bottom: 10px;
3622
    min-height: 310px;
3623
    overflow: visible;
3624
    padding-top: 60px;
3625
    width: 700px;
3626
}
3627

    
3628
/* console css */
3629
.console-header-logo {
3630
    padding-top: 17px;
3631
    margin-left: 30px;
3632
    position: fixed;
3633
}
3634

    
3635
#console-header div.help-text {
3636
    font-size: 75%;
3637
    font-weight:bold;
3638
    color:#FFFFFF;
3639
    float:left;
3640
    position: absolute;
3641
    margin: 45px 0 0 2px;
3642
}
3643

    
3644
div.console-container {
3645
    margin: 0 0em;
3646
    height: auto;
3647
}
3648

    
3649
#wrapper.console {
3650
    width: auto;
3651
}
3652

    
3653
.console-info {
3654
    font-size:80%;
3655
    color: white;
3656
    float:left;
3657
    position:relative;
3658
    margin: 25px 0 0 480px;
3659
}
3660

    
3661
applet {
3662
    width:100%;
3663
    height:100%;
3664
}
3665

    
3666
div.console-footer {
3667
    /* this is for version 0.5*/
3668
    display: none;
3669
}
3670

    
3671
.console-footer #footer-text{
3672
    float:left;
3673
    left: auto;
3674
    margin-left:30px;
3675
}
3676

    
3677
/* add network wizard (see also #wizard for shared classes) */
3678
#networks-wizard .header {
3679
    background-color: #4085A5;
3680
    height: 56px;
3681
}
3682

    
3683
#networks-wizard div.name-input {
3684
    margin: 75px 0 0 55px;
3685
}
3686

    
3687
#networks-wizard input {
3688
    border: 1px solid #CCCCCC;
3689
    color: #445566;
3690
    letter-spacing: 1px;
3691
    width: 170px;
3692
}
3693

    
3694
#networks-wizard span.help {
3695
    font-style: italic;
3696
    font-size: 80%;
3697
    margin-left: 10px;
3698
}
3699

    
3700
#networks-wizard .separator-end {
3701
    background-color: #387693;
3702
    height: 6px;
3703
    width: 479px;
3704
    margin-left: -13px;
3705
    margin-top: 22px;
3706
}
3707

    
3708
.red {
3709
    color: red;
3710
}
3711

    
3712
/* add server to network wizard (see also #metadata-wizard for shared classes) */
3713
#add-machines-wizard span.machine-name {
3714
    margin-left: 4px;
3715
    vertical-align: text-top;
3716
}
3717

    
3718
#add-machines-wizard img.list-logo {
3719
    margin: 2px 1px 1px;
3720
}
3721

    
3722
.css-panes {
3723
    clear: both;
3724
}
3725

    
3726
.last .firewall-content {
3727
    margin-bottom:13px;
3728
}
3729

    
3730
#pub .last .network-separator {
3731
    display:none;
3732
}
3733

    
3734
.public-networks .empty-network-slot {
3735
    display: none;
3736
}
3737

    
3738
/* float clearing for all browsers except the devil one */
3739
.clearfix:after{
3740
  clear: both;
3741
  content: ".";
3742
  display: block;
3743
  height: 0;
3744
  visibility: hidden;
3745
  font-size: 0;
3746
}
3747

    
3748
#machinesview-list div.action-indicator {
3749
    margin:0 !important;
3750
    float: none !important;
3751
}
3752

    
3753
div.action-indicator {
3754
    width: 15px;
3755
    height: 20px;
3756
    background-repeat: no-repeat;
3757
    background-position: 0 0;
3758
}
3759

    
3760
tbody.machines div.action-indicator {
3761
    position: relative;
3762
    top: -2px;
3763
}
3764
div.state .destroy, tbody.machines .destroy {
3765
    background-image: url("./icons/actions/medium/destroy.png");
3766
}
3767
div.state .start, tbody.machines .start {
3768
    background-image: url("./icons/actions/medium/start.png");
3769
}
3770
div.state .reboot, tbody.machines .reboot {
3771
    background-image: url("./icons/actions/medium/reboot.png");
3772
}
3773
div.state .shutdown, tbody.machines .shutdown {
3774
    background-image: url("./icons/actions/medium/shutdown.png");
3775
}
3776

    
3777

    
3778
.invitations #errors {
3779
    font-size: 75%;
3780
    color: #f00;
3781
    margin-bottom: 20px;
3782
}
3783

    
3784
#add-name-container {
3785
    margin-bottom: 10px;   
3786
}
3787

    
3788
.invitations form {
3789
    margin-bottom: 30px;
3790
}
3791

    
3792
#invsent h3 {
3793
    font-size: 0.8em;
3794
    font-weight: bold;
3795
}
3796

    
3797
#invsent span {
3798
    font-weight: normal;
3799
    font-size: 0.9em;
3800
    float: right;
3801
    margin-top: -7px;
3802
    margin-right: 10px;
3803
}
3804

    
3805
#invsent ul {
3806
    margin-top: 10px;
3807
}
3808

    
3809
#invsent li {
3810
    color: #4085A5;
3811
    font-size: 1.1em;
3812
}
3813

    
3814
.invitations #field_email_name {
3815
    margin-left: 140px;
3816
}