Statistics
| Branch: | Tag: | Revision:

root / ui / static / main.css @ 7b287e66

History | View | Annotate | Download (66.1 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: 31px;
234
    margin-left: -13px;
235
    margin-top: -6px;
236
    width: 13px;
237
}
238

    
239
#ie-fix {
240
    z-index: 1000;
241
    position: relative;
242
}
243
#createcontainer {
244
    margin-top: 20px;
245
    margin-bottom: 10px;
246
    z-index: 1000;
247
}
248

    
249
#create {
250
    background-color: #FF7F2A;
251
    color: #000;
252
    cursor: pointer;
253
    padding: 7px 24px;
254
    text-decoration: none;
255
    font-size:100%;
256
}
257

    
258
#create:hover {
259
    background-color: #FF9955;
260
}
261

    
262
#console-header {
263
    height: 67px;
264
    margin-bottom:15px;
265
    background: url("./header-bg.png") repeat-x scroll 0 0 #FFFFFF;
266
}
267

    
268
.header-logo {
269
    padding-top: 28px;
270
}
271

    
272
div#footer-text a {
273
    color: #FFFFFF;
274
    text-decoration: none;
275
}
276

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

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

    
295
.modal {
296
    background-color:#fff;
297
    display:none;
298
    width:30em;
299
    padding:1em;
300
    text-align:left;
301
}
302

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

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

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

    
334
#networks-wizard div.container {
335
    background-color: #ECF4F8;
336
    width:400px;
337
    height: 180px;
338
    margin-bottom:50px;
339
}
340

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

    
351
#networks-wizard h2 {
352
    margin-top: 15px;
353
}
354

    
355
#wizard li {
356
    margin-bottom:1.2em;
357
}
358

    
359
#wizard .pane li {
360
    margin: 0;
361
}
362

    
363
#wizard label {
364
    font-size:120%;
365
    display:block;
366
    clear: both;
367
}
368

    
369
#wizard label strong {
370
    position:relative;
371
    top:-1px;
372
    font-size: 80%;
373
    font-weight: normal;
374
}
375

    
376
#wizard label em {
377
    font-size:75%;
378
    color:#666;
379
    font-style:normal;
380
}
381

    
382
#wizard .text {
383
    width: 270px;
384
    padding: 5px;
385
    margin-top: 10px;
386
    border: 1px solid #ccc;
387
    color: #456;
388
    letter-spacing: 1px;
389
}
390

    
391
#wizard select {
392
    border:1px solid #ccc;
393
    width:94%;
394
    padding:4px;
395
    display: none;
396
}
397

    
398
#wizard .double label {
399
    width:50%;
400
    float:left;
401
}
402

    
403
#wizard .double .text {
404
    width:93%;
405
}
406

    
407
#wizard .clearfix {
408
    clear:left;
409
    padding-top:10px;
410
}
411

    
412
#wizard .right {
413
    float:right;
414
}
415

    
416
#wizard .error {
417
    border:1px solid red;
418
}
419

    
420
#wizard a:hover div.image {
421
    background-color: #C5DEE9;
422
}
423

    
424
.selecteddiv {
425
    background-color: #C5DEE9 !important;
426
}
427

    
428
#wizard label a:hover strong {
429
    color: black;
430
}
431

    
432
#wizard div.image span.size {
433
    font-size: 75%;
434
    color: #666;
435
}
436

    
437
#wizard div.image .radio {
438
    float: left;
439
    margin-top: 10px;
440
}
441

    
442
#wizard div.image span.image-id, #wizard div.image span.description {
443
    font-size: 75%;
444
    color: #666;
445
    font-weight: normal;
446
    display:inline;
447
}
448

    
449
#wizard a:hover div.image span.image-id, #wizard a:hover div.image span.description, #wizard a:hover div.image span.size {
450
    color: black;
451
}
452

    
453
#wizard .cost {
454
    color: #79A4C1;
455
    margin-top: 40px;
456
    clear:both;
457
    margin-left: 15px;
458
    font-size: 95%;
459
}
460

    
461
#wizard #status {
462
    height: 50px;
463
    background-color: #4085A5;
464
}
465

    
466
#wizard .headernumber {
467
    font-size: 410%;
468
}
469

    
470
#wizard .headerbody {
471
    font-size: 120%;
472
    font-weight: normal;
473
    display: inline;
474
    top: -15px;
475
    position: relative;
476
}
477

    
478
#wizard .first {
479
    left: -10px;
480
}
481

    
482
#wizard .checked {
483
    color: #64a6c4 !important;
484
}
485

    
486
#wizard .li-2 {
487
    margin-top: -1px !important;
488
}
489

    
490
#wizard .img-check {
491
    margin-bottom: 8px;
492
    margin-left: -8px;
493
}
494

    
495
#wizard .li-1 .img-check {
496
    margin-left: 2px;
497
}
498

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

    
510
#wizard .bottomruler, #networks-wizard .bottomruler {
511
    margin-top:6px;
512
}
513

    
514
#networks-wizard .topruler, #networks-wizard .bottomruler {
515
    width: 455px;
516
    float: left;
517
}
518

    
519
#wizard #cancel, #networks-wizard .cancel {
520
    background-color: #4085A5;
521
    border-color: #4085A5;
522
    text-align: center !important;
523
}
524

    
525
#wizard #cancel:hover, #networks-wizard .cancel:hover {
526
    background-color: #7DB4CD;
527
    border-color: #7DB4CD;
528
}
529

    
530
#wizard #start, #networks-wizard .create {
531
    text-align: center;
532
    background-color: #FF6600;
533
    border-color: #FF6600;
534
}
535

    
536
#wizard .img-next {
537
    margin: 0 -4px -1px 8px;
538
}
539

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

    
544
#networks-wizard .create {
545
    float:right;
546
    width: 140px;
547
}
548

    
549
#wizard #start:hover, #networks-wizard .create:hover {
550
    background-color: #FF9651;
551
    border-color: #FF9651;
552
}
553

    
554
#wizard .separator-end {
555
    position: absolute;
556
    background-color: #387693;
557
    height: 5px;
558
    margin-left: -14px;
559
    margin-top: 362px;
560
    width: 550px;
561
}
562

    
563
.page ul {
564
    height: 270px;
565
    overflow: auto;
566
}
567

    
568
.panes ul.pane {
569
    height: 220px;
570
}
571

    
572
#wizard #tabscontainer {
573
    background-color: #CDE2EC;
574
    height: 20px;
575
    width: 448px;
576
}
577

    
578
.page ul.tabs {
579
    overflow: hidden;
580
    height: auto;
581
    margin-bottom: -1px;
582
    margin-top: -1px;
583
}
584

    
585
.page ul.tabs li {
586
    float: right;
587
    margin: 0 0.2em;
588
}
589

    
590
#status li {
591
    float: left;
592
    color: #387693;
593
    padding: 0 1px 0 37px;
594
    bottom: 0px;
595
}
596

    
597
#status li.active .headernumber {
598
    color: #FFFFFF;
599
}
600

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

    
605
div.image-container {
606
    border-bottom: 1px solid #CCCCCC;
607
    margin-left: 10px;
608
    margin-right: 10px;
609
}
610

    
611
#page2-container {
612
    background-color: #ECF4F8;
613
    height: 193px;
614
    margin-top: 3px;
615
    padding-top: 25px;
616
}
617

    
618
#page3-container {
619
    background-color: #ECF4F8;
620
    height: 245px;
621
    margin-bottom: 32px;
622
    padding-left: 50px;
623
}
624

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

    
636
.sliders {
637
    float:left;
638
    width: 40px;
639
    margin-left: 10px;
640
    margin-top: 3px;
641
}
642

    
643
.units {
644
    padding-left:10px;
645
}
646

    
647
.slider-container {
648
    padding-bottom: 15px;
649
    margin-left: 5px;
650
}
651

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

    
665
/* progress bar (enabled with progress: true) */
666
.progress {
667
    height: 3px;
668
    background-color: #387693;
669
}
670

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

    
682
.selectedrange {
683
    border-color: #5599FF;
684
}
685

    
686
#credits-indicator {
687
    background-color: #ECF4F8;
688
    float: none;
689
    margin: 0 0 0 10px;
690
    border: 1px solid #387693;
691
    color: #387693;
692
}
693

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

    
704
div.machine {
705
    margin-left: -7px;
706
    min-height: 65px;
707
    padding-left: 7px;
708
    padding-right: 5px;
709
    padding-top: 2px;
710
    width: 516px;
711
}
712

    
713
div.machine:hover {
714
    background-color:#A1C8DB !important;
715
}
716

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

    
721
.single .light-background {
722
    background-color:#aed2e3;
723
}
724

    
725
.machine a {
726
    font-weight: normal;
727
    text-decoration: none;
728
}
729

    
730
div.machine-details {
731
    width: 400px;
732
    float:left;
733
}
734

    
735
.machine span.name, .machine a.ip {
736
    font-size: 75%;
737
    color: black;
738
    margin-top: 6px;
739
}
740

    
741
.machine span.name {
742
    font-weight: bold;
743
}
744

    
745
.oldValue {
746
    display:none;
747
}
748

    
749
.state {
750
    margin-top: -40px;
751
}
752

    
753
.state div {
754
    text-align: right;
755
    margin-right: 3px;
756
}
757

    
758
/* icon view actions */
759
div.machine div.actions {
760
    float: right;
761
    font-size: 75%;
762
    font-weight: normal;
763
    height: 68px;
764
    position: absolute;
765
    right: -63px;
766
    width: 70px;
767
    top: 0px;
768
}
769

    
770
div.machine div.actions a {
771
    color: black;
772
    visibility: hidden;
773
    height: 15px;
774
    width: 180px;
775
    margin: 0 0 2px 8px;
776
    display: block;
777
}
778

    
779
div.machine div.actions a:hover {
780
    background-color:#A1C8DB;
781
    opacity: 0.8;
782
    filter: alpha(opacity = 80);
783
}
784

    
785
div.machine div.actions a.selected {
786
    color: #FF7F2A !important;
787
    width: 50px;
788
}
789

    
790
div.machine div.actions a.selected:hover {
791
    background-color:transparent;
792
}
793

    
794
div.machine div.actions a.action-shutdown {
795
    display: block;
796
}
797

    
798
div.machine div.actions a.shutdown-padding {
799
    margin-bottom: 22px;
800
}
801

    
802
div.action-container {
803
    overflow: visible;
804
}
805

    
806
div.actions a.enabled:hover{
807
    color: black !important;
808
    text-decoration: underline;
809
    display: block;
810
}
811

    
812
div.machine:hover .actions a {
813
    visibility: visible;
814
}
815

    
816
div.machine div.display a{
817
    visibility: visible;
818
}
819

    
820
div.running div.machine div.actions .disabled {
821
    display: none;
822
}
823

    
824
div.terminated div.machine div.actions .disabled {
825
    display: none;
826
}
827

    
828
div.terminated div.machine div.actions a.action-destroy {
829
    position: absolute;
830
    bottom: 0;
831
}
832

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

    
838
div.connect-arrow {
839
    background: url(/static/connect-arrow.png) no-repeat;
840
    height: 28px;
841
    width:14px;
842
    position: absolute;
843
}
844

    
845
.machine div.connect-arrow {
846
    display: none;
847
    left: -3px;
848
    position: absolute;
849
    top: 9px;
850
}
851

    
852
div.connect-arrow:hover, div.connect-arrow.border-hover, div.connect-arrow-ie, div.connect-arrow.border-ie {
853
    cursor: pointer;
854
    background: url(/static/connect-arrow-hover.png) no-repeat;
855
    height: 28px;
856
    width:26px;
857
}
858

    
859
div.connect-border {
860
    opacity: 0.8;
861
    filter: alpha(opacity = 80);
862
    background-color:#4fe0c3;
863
    height:28px;
864
    width: 12px;
865
    position: absolute;
866
}
867

    
868
div.connect-border:hover {
869
    cursor: pointer;
870
}
871

    
872
.machine div.connect-border {
873
    display: none;
874
    left: -15px;
875
    position: absolute;
876
    top: 9px;
877
}
878

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

    
891
.standard .machine .single-image-state1 {
892
    background-position: 0px 0;
893
}
894

    
895
.standard .machine .single-image-state3 {
896
    background-position: -100px 0;
897
}
898

    
899
.standard .machine .single-image-state4 {
900
    background-position: -150px 0;
901
}
902

    
903
.standard .machine .single-image-state2 {
904
    background-position: -50px 0;
905
}
906

    
907
.standard .running .machine .logo {
908
   cursor: pointer;
909
}
910

    
911
.list .machine img {
912
    margin: 0;
913
}
914

    
915
div.ip, div.ips {
916
    font-size: 75%;
917
    position: relative;
918
    float: right;
919
    top:1px;
920
    right: 18px;
921
    text-align: right;
922
}
923

    
924
div.indicators {
925
    margin-right: 2px !important;
926
}
927
div.indicator1, div.indicator2, div.indicator3, div.indicator4 {
928
    background-color: #63cf1c;
929
    width:10px;
930
    height:11px;
931
    clear: none;
932
    float:right;
933
}
934

    
935
.view-separator {
936
    color:#5F8DD3;
937
}
938

    
939
.running {
940
    background: url("./terminated-bg.png") repeat scroll 0 0 transparent;
941
    margin-top: -76px;
942
    padding-bottom: 15px;
943
    width: 699px;
944
    padding-top: 60px;
945
}
946

    
947
.running-state .indicator1, .running-state .indicator2, .running-state .indicator3, .running-state .indicator4 {
948
    background-color: #63cf1c;
949
}
950

    
951
.rebooting-state .indicator1, .rebooting-state .indicator2, .rebooting-state .indicator3, .rebooting-state .indicator4 {
952
    background-color: #d4aa00;
953
}
954

    
955
.error-state .indicator1, .error-state .indicator2, .error-state .indicator3, .error-state .indicator4 {
956
    background-color: #ff0000;
957
}
958

    
959
.terminated-state .indicator1, .terminated-state .indicator2, .terminated-state .indicator3, .terminated-state .indicator4 {
960
    background-color: #5e1616;
961
}
962

    
963
.build-state .indicator1, .build-state .indicator2, .build-state .indicator3, .build-state .indicator4 {
964
    background-color: #FF7F2A;
965
}
966

    
967
.destroying-state .indicator1, .destroying-state .indicator3, .destroying-state .indicator2, .destroying-state .indicator4 {
968
    background-color: #4085a5 !important;
969
}
970

    
971
.shutting-state .indicator1, .shutting-state .indicator3, .shutting-state .indicator2, .shutting-state .indicator4 {
972
    background-color: #940606;
973
}
974

    
975
.starting-state .indicator1, .starting-state .indicator2, .starting-state .indicator3, .starting-state .indicator4 {
976
    background-color: #9ed976;
977
}
978

    
979
.network-indicator .indicator1, .network-indicator .indicator2, .network-indicator .indicator3, .network-indicator .indicator4 {
980
    background-color: #63cf1c;
981
}
982

    
983
.terminated {
984
    background: url("./running-bg.png") repeat scroll 0 0 transparent;
985
    margin-bottom: 17px;
986
    margin-top: 15px;
987
    padding-bottom: 15px;
988
    padding-top: 15px;
989
    width: 699px;
990
}
991

    
992
span.rename {
993
    background-repeat: no-repeat;
994
    color: transparent;
995
    font-size: 75%;
996
    font-weight: normal;
997
    margin-left: 10px;
998
    padding-left: 10px;
999
    text-align: left;
1000
    cursor: pointer;
1001
}
1002

    
1003
div.name:hover span.rename {
1004
    color: #3D3D3D;
1005
    margin-top: 0.4em;
1006
    background-image: url(./pencil.png);
1007
    background-position: 0 3px;
1008
}
1009

    
1010
.machine div.info {
1011
    float:left;
1012
    margin-bottom: 8px;
1013
    margin-top:3px;
1014
}
1015

    
1016
.machine div.info div.info-header {
1017
    background-color: #A1C8DB;
1018
    color: white;
1019
    height: 17px;
1020
    width: 50px;
1021
    cursor: pointer;
1022
}
1023

    
1024
div.machine:hover div.info-header, div.machine:hover div.toggler div.down {
1025
    background-color: #84b7d0;
1026
}
1027

    
1028
div.machine div.info-label.darker, .single div.tags-label.darker, div.network .darker {
1029
    background-color: #5CA1C0;
1030
}
1031

    
1032
.machine div.info div.info-label {
1033
    font-size: 75%;
1034
    height:16px;
1035
    width: 30px;
1036
    padding: 1px 0 0 5px;
1037
}
1038

    
1039
.machine div.info div.toggler, .single div.tags div.toggler, div.network div.toggler {
1040
    width:15px;
1041
    height:17px;
1042
    margin-top: -11px;
1043
    margin-left: 37px;
1044
}
1045

    
1046
div.network div.toggler {
1047
    margin-left: 90px;
1048
}
1049

    
1050
.machine div.info div.down {
1051
    background: url(/static/down-arrow.png) no-repeat scroll 1px 1px;
1052
}
1053

    
1054
.single div.tags div.down {
1055
    background: url(/static/down-arrow.png) no-repeat scroll 2px 2px;
1056
}
1057

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

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

    
1066
.machine div.info div.up {
1067
    background: url(/static/up-arrow.png) no-repeat scroll 1px 0;
1068
}
1069

    
1070
.single div.tags div.up {
1071
    background: url(/static/up-arrow.png) no-repeat scroll 2px 2px;
1072
}
1073

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

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

    
1082
button {
1083
    background-color: #87AADE;
1084
    border: 1px solid #87AADE;
1085
    color: #FFFFFF;
1086
    cursor: pointer;
1087
    height: 23px;
1088
    width: 120px;
1089
}
1090

    
1091
button.next {
1092
    background-color: #4085A5;
1093
    border-color: #4085A5;
1094
    text-align: right;
1095
}
1096

    
1097
button.next:hover {
1098
    background-color: #7DB4CD;
1099
    border-color: #7DB4CD;
1100
}
1101

    
1102
button.prev {
1103
    background-color: #4085A5;
1104
    border-color: #4085A5;
1105
    margin-left: -1px;
1106
    text-align: left;
1107
}
1108

    
1109
button.prev:hover {
1110
    background-color: #7DB4CD;
1111
    border-color: #7DB4CD;
1112
}
1113

    
1114
.image-logo {
1115
    float: left;
1116
    margin-right: 1em;
1117
    margin-left: 1.5em;
1118
    margin-top: 4px;
1119
}
1120

    
1121
div.image {
1122
    clear: both;
1123
    display: block;
1124
    margin-bottom: 3px;
1125
    margin-top: 3px;
1126
    padding: 5px;
1127
}
1128

    
1129
div#view-select {
1130
    float: right;
1131
    clear: both;
1132
    color: white;
1133
    position: relative;
1134
    right: 5px;
1135
    top: -35px;
1136
    display: none;
1137
    z-index: 1000;
1138
}
1139

    
1140
a#standard, a#list, a#single {
1141
    text-decoration: none;
1142
    height: 15px;
1143
    width: 17px;
1144
    padding: 1px 8px 2px 9px;
1145
}
1146

    
1147
div#view-select a {
1148
    color:#5f8dd3;
1149
}
1150

    
1151
a#list:hover {
1152
    background: #5f8dd3;
1153
}
1154

    
1155
a#standard:active, a#list:active {
1156
    color:white;
1157
}
1158

    
1159
a#standard {
1160
    background: url(./icon-view.png) no-repeat -36px 0;
1161
}
1162

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

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

    
1171
a#standard:hover {
1172
    background: url(./icon-view.png) no-repeat -18px 0;
1173
}
1174

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

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

    
1183
a#standard.activelink {
1184
    background: url(./icon-view.png) no-repeat 0px 0;
1185
}
1186

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

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

    
1195
#machinetype {
1196
    background-color: #CDE2EC;
1197
    height: 25px;
1198
    margin-bottom: 0px !important;
1199
}
1200

    
1201
div.machine-type {
1202
    float: left;
1203
    margin: 4px 18px 20px;
1204
}
1205

    
1206
.machine-type .active {
1207
    color: #FFFFFF
1208
}
1209

    
1210
#machinesview {
1211
    min-height: 270px;
1212
    margin-top: 40px;
1213
}
1214

    
1215
.list#machinesview {
1216
    margin-left: -20px;
1217
    display:none;
1218
}
1219

    
1220
#machinesview-list.list {
1221
    background: url("./terminated-bg.png") repeat scroll 0 0 transparent;
1222
    margin-top: -76px;
1223
    padding-left: 15px;
1224
    padding-top: 76px;
1225
    min-height: 270px;
1226
}
1227

    
1228
#machinesview_content {
1229
    display:none;
1230
}
1231

    
1232
.list-machines {
1233
    min-width: 515px;
1234
}
1235

    
1236
#emptymachineslist {
1237
    background-color: #6BA9C6;
1238
    color: #A0A0A0;
1239
    display: none;
1240
    margin-top: -45px;
1241
    padding: 65px 150px 35px;
1242
    text-align: justify;
1243
}
1244

    
1245
#welcomeheader {
1246
    color:white;
1247
    text-align: center;
1248
}
1249

    
1250
.welcomebody {
1251
    color: white;
1252
    font-size:80%;
1253
}
1254

    
1255
.welcomebody a {
1256
    color: white;
1257
}
1258

    
1259
.welcomefooter {
1260
    color: white;
1261
    font-size:60%;
1262
}
1263

    
1264
.welcomefooter a {
1265
    color: white;
1266
}
1267

    
1268
.emptycreatecontainer {
1269
    margin-left: 430px !important;
1270
    position: absolute;
1271
    margin-top: 5px !important;
1272
    width: 180px;
1273
    background-color: #CCCCCC;
1274
    padding: 5px;
1275
    padding-left: 10px;
1276
}
1277

    
1278
.emptycreate {
1279
    margin: 20px 10px 5px 0 !important;
1280
}
1281

    
1282
#createbody {
1283
    display:none;
1284
    font-size: 80%;
1285
}
1286

    
1287
div.list label img {
1288
    margin: 5px 5px -3px 0;
1289
}
1290

    
1291
div.list label {
1292
    color: #3D3D3D;
1293
    font-size: 75%;
1294
}
1295

    
1296
div.list .state {
1297
    margin-top: 7px;
1298
    margin-right: 10px;
1299
}
1300

    
1301
div.list table tbody {
1302
    margin-top: 8px;
1303
}
1304

    
1305
div.list .stopped {
1306
    margin-top: 8px;
1307
}
1308

    
1309
/* root element for tabs  */
1310
#wizard ul.tabs {
1311
    margin-right: -1px;
1312
    float: right;
1313
}
1314

    
1315
#wizard div.panes {
1316
    height: 247px;
1317
    clear:both;
1318
    margin-top: 3px;
1319
}
1320

    
1321
.typebody {
1322
    font-size: 80%;
1323
    font-weight: normal;
1324
    position: relative;
1325
    top: -3px;
1326
}
1327

    
1328
.typehover {
1329
    color: #FFFFFF;
1330
}
1331

    
1332
#label-name {
1333
    margin-top: 10px;
1334
}
1335

    
1336
/* single tab */
1337
#wizard ul.tabs li {
1338
    margin-bottom: 0;
1339
    list-style-type:none;
1340
    float: left;
1341
}
1342

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

    
1359
#wizard ul.tabs a:hover {
1360
    color: #FFFFFF;
1361
    background-color:#4085A5;
1362
}
1363

    
1364
/* selected tab */
1365
#wizard ul.tabs a.current {
1366
    color: white;
1367
    background-color: #7DB4CD;
1368
    cursor: default;
1369
}
1370

    
1371
#wizard #standard-images {
1372
    background-color: #ECF4F8;
1373
}
1374

    
1375
div.list div.actions {
1376
    display: none;
1377
    clear: left;
1378
    float: right;
1379
    margin-right: 15px;
1380
    margin-top: 37px;
1381
    text-align: right;
1382
    width: 120px;
1383
}
1384

    
1385
div.list div.actions a {
1386
    clear: left;
1387
    color: #A1A1A1;
1388
    display: block;
1389
    font-size:75%;
1390
    margin-bottom: 2px;
1391
}
1392

    
1393
div.list div.actions a:hover {
1394
    background-color: transparent;
1395
}
1396

    
1397
div.list div.actions a.enabled {
1398
    color: #3D3D3D;
1399
}
1400

    
1401
div.list div.actions a.enabled:hover{
1402
    cursor: pointer;
1403
    color: black;
1404
    text-decoration: underline;
1405
}
1406

    
1407
div.list div.actions a.selected {
1408
    color: #FF7F2A !important;
1409
}
1410

    
1411
input.machine {
1412
    width: 13px;
1413
    height: 13px;
1414
    top: -1px;
1415
    overflow: hidden;
1416
}
1417

    
1418
.description-container {
1419
    display: inline-block;
1420
    position: relative;
1421
    width: 300px;
1422
}
1423

    
1424
#wizard .button-container {
1425
    height: 20px;
1426
}
1427

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

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

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

    
1465
#metadata-wizard .popup-title, #metadata-wizard .machine-name, #add-machines-wizard .popup-title, #add-machines-wizard .network-name {
1466
    font-size: 120%;
1467
    padding-bottom: 7px;
1468
    padding-top: 10px;
1469
    float:left;
1470
}
1471

    
1472
#metadata-wizard .popup-title {
1473
    padding-bottom: 0px;
1474
    font-size: 120%;
1475
}
1476

    
1477
#metadata-wizard .name-container {
1478
    display: inline-block;
1479
    clear: both;
1480
}
1481

    
1482
#add-machines-wizard .network-name {
1483
    padding-left: 5px;
1484
}
1485

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

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

    
1506
#metadata-wizard .popup-separator, #add-machines-wizard .popup-separator {
1507
    background-color: #74AEC9;
1508
    height: 1px;
1509
    width: 402px;
1510
    margin-bottom: 30px;
1511
    clear: left;
1512
    font-size: 1px;
1513
}
1514

    
1515
#metadata-wizard .metadata-pair-template {
1516
    height: 15px;
1517
    padding-top: 2px;
1518
    width: 350px;
1519
}
1520

    
1521
#metadata-wizard div.metadata-pair-template:hover {
1522
    background-color: #74AEC9;
1523
}
1524

    
1525
#metadata-wizard .metadata-container, #add-machines-wizard .machines-container {
1526
    background-color: transparent;
1527
    float: left;
1528
    width: 400px;
1529
    font-size: 120%;
1530
}
1531

    
1532
#metadata-wizard .machine-icon {
1533
    float: left;
1534
    padding-left: 10px;
1535
    padding-right: 3px;
1536
    padding-top: 7px;
1537
}
1538

    
1539
#metadata-wizard .large-spinner, #add-machines-wizard .large-spinner {
1540
    display: block;
1541
    margin: 50px 0 0 185px;
1542
}
1543

    
1544
#metadata-wizard .metadata-key {
1545
    float: left;
1546
    width: 110px;
1547
    padding-left: 5px;
1548
}
1549

    
1550
#metadata-wizard .metadata-value {
1551
    width: auto;
1552
}
1553

    
1554
#metadata-wizard .metadata-add-template {
1555
    background-color: #74AEC9;
1556
    width: 350px;
1557
    position: relative;
1558
    overflow: visible;
1559
}
1560

    
1561
#metadata-wizard #add-meta-value {
1562
    margin-left: 25px;
1563
    width: 150px;
1564
}
1565

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

    
1577
#metadata-wizard .buttons, #add-machines-wizard .buttons {
1578
    border-top: 2px solid #4085A5;
1579
    height: 30px;
1580
    margin-left: 25px;
1581
    margin-right: 40px;
1582
    width: 400px;
1583
    font-size: 120%;
1584
}
1585

    
1586
#metadata-wizard button.save, #add-machines-wizard button.cancel {
1587
    float: left;
1588
    height: 23px;
1589
    margin: 10px 0 0 0;
1590
    width: 87px;
1591
    background-color: #4085A5;
1592
    border-color: #4085A5;
1593
}
1594

    
1595
#metadata-wizard button.save:hover, #add-machines-wizard button.cancel:hover {
1596
    background-color: #7DB4CD;
1597
    border-color: #7DB4CD;
1598
}
1599

    
1600
#metadata-wizard button.create, #add-machines-wizard button.add {
1601
    height: 23px;
1602
    margin: 10px 0 0 0;
1603
    background-color: #FF6600;
1604
    border-color: #FF6600;
1605
}
1606

    
1607
#metadata-wizard button.create:hover, #add-machines-wizard button.add:hover {
1608
    background-color: #FF9651;
1609
    border-color: #FF9651;
1610
}
1611

    
1612
#metadata-wizard .editbuttons {
1613
    margin-top: 4px;
1614
    margin-right: 0;
1615
}
1616

    
1617
#metadata-wizard .vertical-separator {
1618
    height: 17px;
1619
    width: 1px;
1620
    background-color: #74AEC9;
1621
    float:left;
1622
    margin-right: 10px;
1623
}
1624

    
1625
#metadata-wizard h3, #add-machines-wizard h3 {
1626
    font-weight:normal;
1627
}
1628

    
1629
#metadata-wizard .metadata-edit {
1630
    clear: none;
1631
    cursor: pointer;
1632
    float: right;
1633
    margin-right: 0;
1634
    width: 40px;
1635
    margin-top: -14px;
1636
    display:none;
1637
}
1638

    
1639
#metadata-wizard .metadata-edit .edit, #metadata-wizard .metadata-edit .remove {
1640
    background-repeat: no-repeat;
1641
    color: transparent;
1642
    font-size: 75%;
1643
    float: left;
1644
    width: 16px;
1645
    height: 16px;
1646
}
1647

    
1648
#metadata-wizard .addbuttons {
1649
    display: block;
1650
    clear: none;
1651
    width: 40px;
1652
    margin-right: -1px !important;
1653
    margin-top: 2px;
1654
    float:right;
1655
    cursor: pointer;
1656
}
1657

    
1658
.metadata-pair-template .editbuttons {
1659
    margin-top: -19px !important;
1660
    margin-right: -2px !important;
1661
}
1662

    
1663
#metadata-wizard .metadata-edit .edit {
1664
    background-image: url("./meta-edit.png");
1665
    margin-left: 2px;
1666
}
1667

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

    
1679
#metadata-wizard .editbuttons .save {
1680
    background-image: url("./meta-save.png");
1681
    padding-top:0;
1682
}
1683

    
1684
#metadata-wizard .addbuttons .cancel {
1685
    background-image: url("./meta-remove.png");
1686
    margin-left: 3px;
1687
}
1688

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

    
1694
#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 {
1695
    background-color: #4287a7;
1696
}
1697

    
1698
#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 {
1699
    background-color: #74AEC9;
1700
}
1701

    
1702
#metadata-wizard .addbuttons .cancel, #metadata-wizard .addbuttons .save {
1703
    width: 16px;
1704
    height: 16px;
1705
    float: left;
1706
    background-repeat: no-repeat;
1707
    color: transparent;
1708
}
1709

    
1710
#metadata-wizard .metatextbox {
1711
    font-size: 90%;
1712
    height: 18px;
1713
    margin-top: -2px;
1714
    color: black;
1715
    width: 150px;
1716
}
1717

    
1718
#metadata-wizard p, #add-machines-wizard p {
1719
    margin-left: 7px;
1720
    width: 200px;
1721
}
1722

    
1723
#metadata-wizard div.bottomruler, #add-machines-wizard div.bottomruler {
1724
    background-color: #666;
1725
    height: 20px;
1726
    margin-top: 17px;
1727
}
1728

    
1729
#metadata-wizard button.remove {
1730
    height: 15px;
1731
    width: 70px;
1732
    background-color: #d35f5f;
1733
    border-color: #d35f5f;
1734
}
1735

    
1736
#metadata-wizard button.edit {
1737
    height: 15px;
1738
    width: 70px;
1739
    background-color: #666;
1740
    border-color: #666;
1741
    margin-top: -12px;
1742
}
1743

    
1744
#metadata-wizard input {
1745
    font-style: italic;
1746
    color: #ccc;
1747
}
1748

    
1749
#metadata-wizard textarea.edit-meta-value {
1750
    font-style: normal;
1751
    text-align: left;
1752
    color: black;
1753
    margin-top: 2px;
1754
    width:200px;
1755
    height: 49px;
1756
}
1757

    
1758
#metadata-wizard input {
1759
    font-size: 80%;
1760
}
1761

    
1762
#metadata-wizard input.key {
1763
    height: 15px;
1764
    left: 460px;
1765
    position: absolute;
1766
    top: 83px;
1767
    width: 230px;
1768
}
1769

    
1770
#metadata-wizard textarea.value {
1771
    width: 267px;
1772
    height: 170px;
1773
    overflow: auto;
1774
}
1775

    
1776
#metadata-wizard .input-enabled {
1777
    color: black;
1778
    text-align: left;
1779
    font-style: normal;
1780
}
1781

    
1782
#metadata-wizard label.meta-value {
1783
    vertical-align: top;
1784
}
1785

    
1786
#metadata-wizard button.cancel, #metadata-wizard #edit-dialog button.close {
1787
    float: left;
1788
    margin: 4px 0 0 25px;
1789
    background-color: #d35f5f;
1790
    border-color: #d35f5f;
1791
}
1792

    
1793
/* metadata dropdown combo */
1794
.meta-key {
1795
    margin-right: 18px;
1796
    float:left;
1797
}
1798
#metadata-wizard .textdropdown-outer {
1799
    float: left;
1800
    overflow: visible;
1801
}
1802

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

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

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

    
1838
#metadata-wizard ul li:hover {
1839
    background-color: #efefef;
1840
    cursor: pointer;
1841
}
1842

    
1843
#metadata-wizard .dropdownitem {
1844
    margin-left: 10px;
1845
}
1846

    
1847
#metadata-wizard #txtdropdown:focus {
1848
    outline: 0 none;
1849
}
1850

    
1851
#metadata-wizard #add-meta-key {
1852
    height: 16px;
1853
    margin-left: 5px;
1854
    margin-top: 2px;
1855
    width: 105px !important;
1856
}
1857

    
1858
/* notification box */
1859
#yes-no {
1860
    height: 150px;
1861
    z-index: 9999;
1862
    border-bottom: 5px solid #4085A5;
1863
}
1864

    
1865
#yes-no p, #yes-no button {
1866
    margin-top: 15px;
1867
}
1868

    
1869
#error-success {
1870
    z-index: 9999;
1871
    border-bottom: 5px solid #4085A5;
1872
    min-height: 150px;
1873
    top: 120px !important;
1874
    position: absolute !important;
1875
}
1876

    
1877
#error-success p {
1878
    margin-top: 5px;
1879
}
1880

    
1881
#error-success strong {
1882
    color: #F49C1A;
1883
}
1884

    
1885
#error-success .close {
1886
    background-image: url("./close-popup.png");
1887
    background-repeat: no-repeat;
1888
    cursor: pointer;
1889
    height: 13px;
1890
    position: absolute;
1891
    right: 7px;
1892
    top: 9px;
1893
    width: 13px;
1894
}
1895

    
1896
.popup-header-error {
1897
    background-color: #800000 !important;
1898
}
1899

    
1900
.popup-border-error {
1901
    border-color: #800000 !important;
1902
    width:auto;
1903
}
1904

    
1905
.popup-details-error {
1906
    border: none !important;
1907
}
1908

    
1909
.popup-separator-error {
1910
    margin-bottom: 5px !important;
1911
}
1912

    
1913
#error-success .popup-header {
1914
    background-color: #4085A5;
1915
    color: white;
1916
    font-size: 95%;
1917
    font-weight: normal;
1918
    height: 20px;
1919
    margin-left: -16px;
1920
    margin-top: -16px;
1921
    padding-bottom: 2px;
1922
    padding-left: 30px;
1923
    padding-top: 10px;
1924
    width: 482px;
1925
    margin-right:-16px;
1926
}
1927

    
1928

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

    
1942
#error-success .popup-body {
1943
    background: url("./popup-bg.png") repeat-x scroll 0 0 transparent;
1944
    margin-left: -16px;
1945
    margin-right: -16px;
1946
    margin-top: 1px;
1947
    min-height: 142px;
1948
    padding-top: 10px;
1949
}
1950

    
1951
#error-success .popup-body-inner {
1952
    background: url("./popup-inner-bg.png") repeat-x scroll 0 0 transparent;
1953
    font-size: 80%;
1954
    min-height: 120px;
1955
    margin-left: 20px;
1956
    padding-left: 15px;
1957
    width: 460px;
1958
}
1959

    
1960
#error-success .popup-separator {
1961
    background-color: #74AEC9;
1962
    height: 1px;
1963
    font-size:1%;
1964
    width: 442px;
1965
    margin-bottom: 30px;
1966
}
1967

    
1968
#error-success .machine-now-building {
1969
    font-size: 95%;
1970
    padding-bottom: 7px;
1971
    padding-top: 10px;
1972
}
1973

    
1974
#error-success.success .machine-now-building {
1975
    padding-bottom: 14px !important;
1976
}
1977

    
1978
#error-success .password-container {
1979
    width: 430px;
1980
    padding: 5px;
1981
    border: 2px solid #75b54a;
1982
    background-color: #aade87;
1983
}
1984

    
1985
#error-success .password-header {
1986
    margin-bottom: 5px;
1987
}
1988

    
1989
#error-success .password {
1990
    color: #447821;
1991
}
1992

    
1993
#error-success .popup-details {
1994
    border: 2px solid #FF7F2A;
1995
    float: left;
1996
    margin-left: 10px;
1997
    padding: 2px;
1998
}
1999

    
2000
#error-success.success .popup-details {
2001
    border: none !important;
2002
    float: none !important;
2003
    margin-left: none !important;
2004
    margin-top: 10px;
2005
}
2006

    
2007
#error-success.success .popup-separator {
2008
    margin-bottom: 14px !important;
2009
}
2010

    
2011
#error-success .write-password {
2012
    margin-bottom: 5px;
2013
    padding-left: 30px;
2014
}
2015

    
2016
#error-success .write-password-password {
2017
    padding-left: 30px;
2018
    color: #447821;
2019
    display: inline;
2020
    font-size: 110%;
2021
    font-weight: bold;
2022
}
2023

    
2024
#error-success .write-password-details {
2025
    font-size: 75%;
2026
}
2027

    
2028
.more-details {
2029
    display: block;
2030
}
2031

    
2032
.popup-details a:link, .popup-details a:visited{
2033
    color: black;
2034
}
2035

    
2036
/* Confirmation boxes */
2037
div.confirm_single, div.confirm_multiple, div.action_error {
2038
    display: none;
2039
    color: black;
2040
}
2041

    
2042
div.action-container.destroy div.confirm_single {
2043
    bottom: 0;
2044
    position: absolute;
2045
    left: 83px;
2046
}
2047

    
2048
div.terminated div.action-container.destroy div.confirm_single {
2049
    margin-top: 30px;
2050
}
2051

    
2052
div.confirm_single button, div.confirm_multiple button, div.action_error button {
2053
    font-size: 100%;
2054
    cursor: pointer;
2055
    color: black;
2056
    height: 20px !important;
2057
}
2058

    
2059
div.confirm_single {
2060
    float: right;
2061
    margin: -20px -122px 0 0;
2062
}
2063

    
2064
div.confirm_single button {
2065
    border: none;
2066
}
2067

    
2068
div.confirm_single button.yes {
2069
    width: 90px;
2070
    background-color:#FF7F2A;
2071
}
2072

    
2073
div.confirm_single button.yes:hover {
2074
    background-color: #FF9955;
2075
}
2076

    
2077
div.confirm_single button.no {
2078
    width: 20px;
2079
    margin-left:-5px;
2080
    background-color: #FF9955;
2081
    color:#d95d0a;
2082
}
2083

    
2084
div.confirm_single button.no:hover {
2085
    color: white;
2086
}
2087

    
2088
div.confirm_multiple {
2089
    background-color: #4085A5;
2090
    font-size: 75%;
2091
    z-index: 1;
2092
    position: absolute;
2093
    width: 698px;
2094
    height: 28px;
2095
    margin-top: 15px;
2096
}
2097

    
2098
div.confirm_multiple p {
2099
    float: left;
2100
    color: #FF7F2A;
2101
    font-weight: bold;
2102
    margin: 7px 0 0 200px;
2103
}
2104

    
2105
#networks-pane div.confirm_multiple p {
2106
    margin: 7px 0 0 100px;
2107
}
2108

    
2109
div.confirm_multiple button {
2110
    float: right;
2111
    background-color: transparent;
2112
    border: 1px solid #5CA1C0;
2113
    margin: 4px 5px 0 0;
2114
}
2115

    
2116
div.confirm_multiple button.yes {
2117
    border-color: #FF7F2A;
2118
    padding: 0 12px;
2119
}
2120

    
2121
div.confirm_multiple button.yes:hover {
2122
    background-color: #FF7F2A;
2123
}
2124

    
2125
div.confirm_multiple button.no {
2126
    padding: 0px 16px;
2127
}
2128

    
2129
div.confirm_multiple button.no:hover {
2130
    background-color: #5CA1C0;
2131
}
2132

    
2133
div.action_error {
2134
    width: 80px;
2135
    height: 60px;
2136
    padding: 5px;
2137
    margin: -2px 0 0 595px;
2138
    background-color: #4085A5;
2139
    font-size: 75%;
2140
    line-height: 1.5;
2141
    z-index:1;
2142
    color: #FF7F2A;
2143
    position:absolute;
2144
    top: 0px;
2145
}
2146

    
2147
.action_error button {
2148
    width: 80px !important;
2149
    background-color: transparent;
2150
    border: 1px solid;
2151
    padding: 0px;
2152
    border-color: #FF7F2A;
2153
}
2154

    
2155
div.action_error button.details {
2156
    margin: 5px 0 0 0px;
2157
    padding: 0 15px;
2158
}
2159

    
2160
div.action_error button.details:hover {
2161
    background-color: #FF7F2A;
2162
}
2163

    
2164
div#aboutuser{
2165
    float:right;
2166
    clear: both;
2167
    color: #FFFFFF;
2168
    font-size: 75%;
2169
    margin-top: -25px;
2170
}
2171

    
2172
div#user{
2173
    clear: both;
2174
    color: #FFFFFF;
2175
    font-size: 75%;
2176
    margin-top: 38px;
2177
    padding-bottom: 10px;
2178
    z-index: 400;
2179
    position: absolute;
2180
    right:0;
2181
}
2182

    
2183
div#user a{
2184
    color: #FFFFFF;
2185
    text-decoration: none;
2186
}
2187

    
2188
div#user a.current_lang {
2189
    color: #72ADC8;
2190
}
2191

    
2192
div#user .usermenu {
2193
    float: left;
2194
    cursor: pointer;
2195
    overflow: hidden;
2196
    padding-top: 5px;
2197
    margin-top: -5px;
2198
    position: relative;
2199
}
2200

    
2201
div#user .username {
2202
    display: block;
2203
    margin-right: 10px;
2204
    padding-right: 18px;
2205
    padding-left: 4em;
2206
    height: 20px;
2207
    background: url("./down-arrow-light.png") no-repeat right;
2208
    background-position: right 6px;
2209
    font-weight: normal;
2210
}
2211

    
2212
div#user .hovered {
2213
    background: #599EBD;
2214
    overflow: visible;
2215
    border-bottom: 1px solid #C7DFE9;
2216
}
2217

    
2218
div#user .hovered .username {
2219
    background-image: url("./down-arrow-lighter.png");
2220
}
2221

    
2222
div#user .active {
2223
    background-color: #BED5E0 !important;
2224
}
2225

    
2226
div#user .active .username {
2227
    color: #599EBD;
2228
    background-image: url("./down-arrow-lighter.png");
2229
}
2230

    
2231
div#user .useractions {
2232
    display: none;
2233
}
2234

    
2235
div#user .active .useractions {
2236
    display: block;
2237
    text-align: right;
2238
    color: #4085A5;
2239
    background-color: #D0E3ED;
2240
    margin-top:-1px;
2241
    border-top:1px solid #fff;
2242
    position: relative;
2243
    top: 1px;
2244
}
2245

    
2246
div#user .useractions li {
2247
    padding: 5px 10px;
2248
    border-bottom: 1px solid #efefef;
2249
    text-align: right;
2250
    display: block;
2251
    background-color: transparent;
2252
}
2253

    
2254
div#user .useractions li a {
2255
    color: #4085A5;
2256
    display: inline-block;
2257
    padding:5px 0;
2258
    padding-left: 30px;
2259
    padding-bottom: 6px;
2260
    background-repeat: no-repeat;
2261
    background-position: center left;
2262
}
2263

    
2264
div#user .useractions li.hovered {
2265
    background-color: #E1EFF6;
2266
}
2267

    
2268
div#user .useractions li.last {
2269
    border-bottom: none;
2270
}
2271

    
2272
div#user .useractions .logout a {
2273
    background-image: url("./icon-logout.png");
2274
}
2275

    
2276
div#user .langmenu {
2277
    float: left;
2278
    border-left: 1px solid #ffffff;
2279
    padding-left: 10px;
2280
    margin-left: -1px;
2281
}
2282

    
2283
div#user .langmenu .sep {
2284
    display: inline-block;
2285
    color: #72ADC8;
2286
}
2287

    
2288
.separator {
2289
    background-color: #74AEC9;
2290
    height: 10px;
2291
    width: 700px;
2292
    font-size: 1px;
2293
    line-height: 0px;
2294
}
2295

    
2296
#disks.separator {
2297
    background-color: #dea842;
2298
}
2299

    
2300
#networks.separator {
2301
    background-color: #6c535d;
2302
}
2303

    
2304
.network-machine h5 {
2305
    margin-bottom: 26px;
2306
    margin-top:0px;
2307
}
2308

    
2309
.machine-container .separator {
2310
    width: 508px;
2311
    height: 1px;
2312
    margin-top: 2px;
2313
    background-color: #5CA1C0;
2314
    margin-left: 13px;
2315
}
2316

    
2317
.machine h5 {
2318
    margin: -3px 0px 4px 0px;
2319
}
2320

    
2321
.machine h5.namecontainer {
2322
    margin-top: 1px;
2323
}
2324

    
2325
.editbuttons {
2326
    display: block;
2327
    clear: none;
2328
    width: 40px;
2329
    margin-right: 32%;
2330
    padding-top: 2px;
2331
    float: right;
2332
    cursor: pointer;
2333
    position: relative;
2334
    z-index: 1000;
2335
}
2336

    
2337
div.editbuttons div.save:hover, div.editbuttons div.cancel:hover {
2338
    background-color: #84b7d0;
2339
}
2340

    
2341
div.editbuttons div.cancel:hover {
2342
    background-image: url("./cancel-onhover.png");
2343
}
2344

    
2345
.editbuttons .cancel, .editbuttons .save {
2346
    background-repeat: no-repeat;
2347
    color: transparent;
2348
    height: 16px;
2349
    width: 16px;
2350
    float: left;
2351
}
2352

    
2353
.editbuttons .cancel {
2354
    background-image: url("./cancel.png");
2355
    margin-left: 3px;
2356
}
2357

    
2358
.editbuttons .save {
2359
    background-image: url("./save.png");
2360
    margin-left: 1px;
2361
}
2362

    
2363
.editbuttons img {
2364
    float:none !important;
2365
    margin: 0px !important;
2366
}
2367

    
2368
.namecontainer {
2369
    height: 18px;
2370
    margin-top: 9px;
2371
}
2372

    
2373
.nametextbox {
2374
    font-size: 95%;
2375
}
2376

    
2377
.large-spinner {
2378
    background: url("./icons/indicators/large/progress.gif");
2379
    margin-left: 298px;
2380
    margin-top: 0px;
2381
    height: 31px;
2382
    width: 31px;
2383
    position: absolute;
2384
}
2385

    
2386
.list .large-spinner {
2387
    margin-top:-30px;
2388
}
2389

    
2390
.single .large-spinner {
2391
    margin-top: 50px;
2392
}
2393

    
2394
div#networks-container .large-spinner {
2395
    margin-top: 50px;
2396
}
2397

    
2398
/* tables in list view */
2399
div.list div.dataTables_filter {
2400
    font-size: 75%;
2401
    display: none;
2402
    margin-bottom: 12px;
2403
}
2404

    
2405
div.list div.dataTables_filter input{
2406
    font-size: 100%;
2407
}
2408

    
2409
.dataTables_wrapper {
2410
    width: 515px;
2411
    padding-bottom: 40px;
2412
}
2413

    
2414
div.list table thead .sorting, div.list table thead .sorting_desc, div.list table thead .sorting_asc {
2415
    padding-right: 15px !important;
2416
}
2417

    
2418
div.list table {
2419
    width: 515px;
2420
    font-size: 75%;
2421
}
2422

    
2423
div.list table tbody td {
2424
    color: #3D3D3D;
2425
    padding:6px;
2426
    vertical-align: middle;
2427
}
2428

    
2429
div.list table thead tr th {
2430
    background-color: #CDE2EC;
2431
    background-image: url(bg.gif);
2432
    background-repeat: no-repeat;
2433
    background-position: right 11px;
2434
    font-weight: normal;
2435
    border: 1px solid transparent;
2436
    border-bottom: none;
2437
    padding: 4px;
2438
    text-align: left;
2439
    vertical-align: middle;
2440
    cursor: pointer;
2441
}
2442

    
2443
div.list table thead .sorting_asc, div.list table thead .sorting_desc {
2444
    background-color: #5CA1C0;
2445
}
2446

    
2447
div.list table thead .sorting_asc {
2448
    background-image: url(asc.gif);
2449
}
2450

    
2451
div.list table thead .sorting_desc {
2452
    background-image: url(desc.gif);
2453
}
2454

    
2455
div.list table .selection div.expand-icon {
2456
    background-image: url(asc.gif);
2457
    background-repeat: no-repeat;
2458
    position: relative;
2459
    cursor: pointer;
2460
    width: 15px;
2461
    height: 4px;
2462
    left: 19px;
2463
    top: -11px;
2464
}
2465

    
2466
ul.dropdown-selector {
2467
    background-color: #E6EEEE;
2468
    position: absolute;
2469
    margin-left: 1px;
2470
    display: block;
2471
    top: 255px;
2472
    font-size:75%;
2473
    width:40px;
2474
}
2475

    
2476
ul.dropdown-selector li {
2477
    padding: 4px;
2478
}
2479

    
2480
ul.dropdown-selector li:hover {
2481
    background-color: #5CA1C0;
2482
}
2483

    
2484
ul.dropdown-selector li a{
2485
    color: black;
2486
    text-decoration: none;
2487
}
2488

    
2489
div.list table span.imagetag {
2490
    display: none;
2491
}
2492

    
2493
div.list table thead .vmos {
2494
    width: 20px !important;
2495
    vertical-align:middle;
2496
}
2497

    
2498
div.list table .selection {
2499
    width: 20px !important;
2500
    text-align: left;
2501
    background-image: none;
2502
    padding-left: 6px;
2503
}
2504

    
2505
div.list table thead .vmflavor {
2506
    width: 100px !important;
2507
}
2508

    
2509
/* group column commented out for v0.5
2510
div.list table thead .vmgroup {
2511
    width: 40px !important;
2512
}
2513
*/
2514

    
2515
div.list table thead .vmstatus {
2516
    width: 50px !important;
2517
}
2518

    
2519
div.list table thead .vmname {
2520
    width: 110px !important;
2521
}
2522

    
2523
.spinner, .action-indicator {
2524
    clear: right;
2525
    float:right !important;
2526
    margin: 10px 6px 0 15px !important;
2527
}
2528
.action-indicator {
2529
    margin-right: 18px !important;
2530
}
2531

    
2532
.wave {
2533
    clear: right;
2534
    float:right !important;
2535
    margin: 10px 15px 0 15px !important;
2536
}
2537

    
2538
#networks-pane .spinner {
2539
    margin-top: 18px !important;
2540
}
2541

    
2542
.hidden {
2543
    display:none;
2544
}
2545

    
2546
div.actions a.selected, div.actions a.selected:hover, div.machine-actions a.selected, div.machine-actions a.selected:hover {
2547
    display:block !important;
2548
}
2549

    
2550
.action_error .message, .action_error .code {
2551
    display: none;
2552
}
2553

    
2554
.fixed {
2555
    bottom: 0;
2556
    position: fixed !important;
2557
}
2558

    
2559
/* Networks */
2560
#networks-pane {
2561
    background-color: transparent;
2562
    color: black;
2563
    margin-left: 1px;
2564
    margin-right: 0;
2565
}
2566

    
2567
#networkscreate {
2568
    color: black;
2569
    background-color: #FF7F2A;
2570
    cursor: pointer;
2571
    padding: 7px 24px;
2572
    text-decoration: none;
2573
}
2574

    
2575
#networkscreate:hover {
2576
    background-color: #FF9955;
2577
}
2578

    
2579
#networks-pane #beforecreate {
2580
    margin-left: -13px;
2581
    margin-top: -6px;
2582
}
2583

    
2584
#networks-container {
2585
    margin-top: 10px;
2586
    min-height: 270px;
2587
}
2588

    
2589
#networks-createcontainer {
2590
    position: absolute;
2591
    top: 155px;
2592
}
2593

    
2594
#networks-pane .public-networks {
2595
    background: url("./terminated-bg.png") repeat scroll 0 0 transparent;
2596
    margin: 0 0 18px;
2597
    padding: 70px 0 15px 35px;
2598
}
2599

    
2600
#networks-pane .private-networks {
2601
    background: url("./running-bg.png") repeat scroll 0 0 transparent;
2602
    padding: 15px 20px 20px 35px;
2603
}
2604

    
2605
#public-template, #private-template, #public-machine-template, #private-machine-template {
2606
    display:none;
2607
}
2608

    
2609
div.network a.action-network-add {
2610
    display: none;
2611
}
2612

    
2613
div.network a.action-network-destroy {
2614
    margin-top: 32px !important;
2615
    width: 50px;
2616
    display: none;
2617
}
2618

    
2619
div.network {
2620
    clear: both;
2621
    min-height: 65px;
2622
    margin: 5px 0 0 -35px;
2623
    padding: 3px 20px 0;
2624
    width: 480px;
2625
    position: relative;
2626
}
2627

    
2628
#private-template {
2629
    margin: 2px 0 0 -30px;
2630
}
2631

    
2632
div.network-placeholder {
2633
    margin-left: 33px;
2634
}
2635

    
2636
div.private-networks div.network-placeholder {
2637
    border-left: 3px solid #FF7F2A;
2638
}
2639

    
2640
div.network-cable {
2641
    border-left: 3px solid #FF7F2A;
2642
    float: left;
2643
    margin-left: -40px;
2644
    margin-top: -45px;
2645
    height: 185px;
2646
    overflow: hidden;
2647
}
2648

    
2649
.first div.network-cable {
2650
    height:143px;
2651
    margin-top:-6px;
2652
    position: relative;
2653
}
2654

    
2655
div.network-contents div.machines-list div.first {
2656
    margin-top:0;
2657
}
2658

    
2659
.last div.network-cable {
2660
    height:85px;
2661
}
2662

    
2663
div.firewall-cable {
2664
    border-left: 3px solid #FF7F2A;
2665
    float: left;
2666
    margin-left: -100px;
2667
    margin-top: -20px;
2668
    height: 110px;
2669
}
2670

    
2671
.last div.firewall-cable {
2672
    display:none;
2673
}
2674

    
2675
div.network a:hover {
2676
    text-decoration: underline;
2677
    cursor: pointer;
2678
}
2679

    
2680
#networks-container .name {
2681
    font-size: 75%;
2682
}
2683

    
2684
div.network-machines, div.firewall {
2685
    font-size: 75%;
2686
    margin-left: 70px;
2687
}
2688

    
2689
div.firewall {
2690
    margin-left: 60px;
2691
    margin-bottom: 3px;
2692
}
2693

    
2694
div.machines-header, div.firewall-header {
2695
    background-color: #A1C8DB;
2696
    color: white;
2697
    cursor: pointer;
2698
    height: 17px;
2699
    width: 103px;
2700
}
2701

    
2702
 div.private-networks div.machines-header {
2703
    margin-top: -5px;
2704
}
2705

    
2706
div.network:hover div.machines-header, div.network:hover div.firewall-header {
2707
    background-color: #84b7d0;
2708
}
2709

    
2710
div.network-machine:hover div.firewall-header {
2711
    background-color: #5CA1C0;
2712
}
2713

    
2714
div.machines-label, div.firewall-label {
2715
    width: 100%;
2716
    padding-bottom:1px;
2717
    padding-left: 3px;
2718
}
2719

    
2720
div.firewall-label.darker {
2721
    background-color: #4085a5;
2722
}
2723

    
2724
.state {
2725
    float: right;
2726
    position: absolute;
2727
    right: 10px;
2728
    top: 40px;
2729
    font-size: 75%;
2730
}
2731

    
2732
div.network div.actions {
2733
    float: right;
2734
    font-size: 75%;
2735
    font-weight: normal;
2736
    height: 70px;
2737
    width: 100px;
2738
    position: absolute;
2739
    right: -100px;
2740
    top: 0;
2741
}
2742

    
2743
div.network div.machine-actions {
2744
    text-decoration: none;
2745
    float: right;
2746
    width: 100px;
2747
    margin: -7px -100px 0 0;
2748
    font-weight: normal;
2749
    font-size: 75%;
2750
}
2751

    
2752
div.network div.actions a, div.network div.machine-actions a {
2753
    text-decoration: none;
2754
    height: 15px;
2755
    color: black;
2756
    visibility: hidden;
2757
    display: block;
2758
}
2759

    
2760
div.network div.actions a {
2761
    margin: 4px 0 0 8px;
2762
}
2763

    
2764
div.network div.machine-actions a {
2765
    margin: 8px 0 0 8px;
2766
}
2767

    
2768
div.network div.actions a:hover, div.network div.machine-actions a:hover {
2769
    display: block;
2770
    background-color:#A1C8DB;
2771
    width: 200px;
2772
    opacity: 0.8;
2773
    filter: alpha(opacity = 80);
2774
}
2775

    
2776
div.network:hover div.actions a, div.network-machine:hover div.machine-actions a {
2777
    visibility: visible;
2778
}
2779

    
2780
div.network div.actions a.selected, div.network div.machine-actions a.selected {
2781
    color: #FF7F2A !important;
2782
    width: 50px !important;
2783
}
2784

    
2785
div.network div.actions a.selected:hover, div.network div.machine-actions a.selected:hover {
2786
    background-color: transparent;
2787
}
2788

    
2789
div.network div.display a {
2790
    visibility: visible;
2791
}
2792

    
2793
div.network-machine div.machine-actions a.action-details {
2794
    margin-top: 7px;
2795
}
2796

    
2797
div.network:hover {
2798
    background-color: #A1C8DB !important;
2799
}
2800

    
2801
.network-logos {
2802
    float:left;
2803
    padding-right: 10px;
2804
}
2805

    
2806
.network-logos:hover {
2807
    cursor: pointer;
2808
}
2809

    
2810
.state div {
2811
    text-align: right;
2812
    margin: 4px 1px -4px;
2813
}
2814

    
2815
.public-networks .state div {
2816
    margin-top: 4px;
2817
}
2818

    
2819
.private-networks .state div {
2820
    margin-top: 9px;
2821
    margin-bottom: -12px;
2822
}
2823

    
2824
.public-networks .name-div {
2825
    margin-top:-7px;
2826
    margin-bottom: 23px;
2827
}
2828

    
2829
div.indicator {
2830
    clear: none;
2831
    float: right;
2832
    height: 11px;
2833
    margin: 3px -1px;
2834
    width: 10px;
2835
}
2836

    
2837
#private-networks {
2838
    margin-top: 20px;
2839
}
2840

    
2841
.private-networks .editbuttons {
2842
    margin-right: 22%;
2843
}
2844

    
2845
.private-networks div.confirm_single {
2846
    margin: 45px -219px -5px 0;
2847
    font-size: 80%;
2848
}
2849

    
2850
.private-networks .network-machine div.confirm_single {
2851
    margin: 0 -199px 0 0;
2852
}
2853

    
2854
.private-networks .state {
2855
    top: 35px;
2856
}
2857

    
2858
.private-networks div.machines-list {
2859
    padding-top: 3px;
2860
}
2861

    
2862
span.rename-network, span.configure {
2863
    background-repeat: no-repeat;
2864
    color: transparent;
2865
    font-size: 75%;
2866
    font-weight: normal;
2867
    margin-left: 10px;
2868
    padding-left: 10px;
2869
    text-align: left;
2870
}
2871

    
2872
span.rename-network {
2873
    cursor: pointer;
2874
}
2875

    
2876
div.name-div:hover span.rename-network {
2877
    color: #3D3D3D;
2878
    margin-top: 0.4em;
2879
    background-image: url(./pencil.png);
2880
    background-position: 0 3px;
2881
}
2882

    
2883
div.network:hover a.rename {
2884
    color: #3d3d3d;
2885
}
2886

    
2887
.network-separator {
2888
    background-color: #5CA1C0;
2889
    height: 1px;
2890
    margin: 2px 0 0 -5px;
2891
    width: 480px;
2892
    font-size: 1%;
2893
    line-height: 1px;
2894
}
2895

    
2896
.network-contents {
2897
    margin-left: -4px;
2898
    width: 504px;
2899
    clear: both;
2900
    padding-bottom: 7px;
2901
}
2902

    
2903
.network-machine .state div {
2904
    text-align: left;
2905
}
2906

    
2907
.network-machine {
2908
    margin-left: 35px;
2909
    padding-bottom: 5px;
2910
    padding-left: 5px;
2911
    padding-top: 5px;
2912
    margin-top: 5px;
2913
}
2914

    
2915
.network-machine .logo {
2916
    float:left;
2917
    padding-right: 10px;
2918
    position:relative;
2919
}
2920

    
2921
#networks-container .machine-name {
2922
    text-decoration: none !important;
2923
    margin-bottom: 10px;
2924
    color: #000000;
2925
    margin-top: -4px;
2926
}
2927

    
2928
.private-networks .separator {
2929
    background-color: #5CA1C0;
2930
    height: 1px;
2931
    margin: 3px 0 -2px -10px;
2932
    width: 485px;
2933
}
2934

    
2935
.network-machine .state {
2936
    margin-right: 18px;
2937
}
2938

    
2939
.network-machine .state .status {
2940
    margin-bottom: 4px;
2941
}
2942

    
2943
.machine-name .name {
2944
    margin-top: -10px !important;
2945
}
2946

    
2947
.machine-name .namecontainer {
2948
    line-height: 18px;
2949
    margin-bottom: 20px;
2950
}
2951

    
2952
div.network-machine:hover {
2953
    background-color: #84B7D0;
2954
}
2955

    
2956
.machines {
2957
    width: 416px;
2958
    margin-bottom: -8px;
2959
    margin-top: 10px;
2960
}
2961

    
2962
div.empty-network-slot {
2963
    height: 60px;
2964
}
2965

    
2966
div.network-remove-machine, div.network-add-machine {
2967
    background-color: #FB822F;
2968
    color: #bc4b00;
2969
    width:90px;
2970
    height:18px;
2971
    float:left;
2972
    margin:40px 0 0 -100px;
2973
}
2974

    
2975
span.remove-icon {
2976
    font-size: 80%;
2977
    margin-left: 15px;
2978
}
2979

    
2980
div.add-icon {
2981
    margin-left: 15px;
2982
    margin-top: -3px;
2983
    cursor: pointer;
2984
}
2985

    
2986
span.remove-icon:hover, span.add-icon:hover {
2987
    cursor:pointer;
2988
    color: #fff;
2989
}
2990

    
2991
div.network-add-machine {
2992
    margin:43px 0 0 -3px;
2993
}
2994

    
2995
.firewall-on {
2996
    color: #42E342;
2997
}
2998

    
2999
.firewall-off {
3000
    color: #F82E2E;
3001
}
3002

    
3003
.firewall-content {
3004
    color: black;
3005
    font-size: 60%;
3006
    margin-left: 60px;
3007
    height: 55px;
3008
    margin-bottom: 17px;
3009
}
3010

    
3011
.firewall-content .checkbox-legends {
3012
    vertical-align: text-top;
3013
}
3014

    
3015
.checkbox-legends a {
3016
    color: black;
3017
    text-decoration: underline;
3018
    font-size: 100%;
3019
}
3020

    
3021
h5.machine-connect {
3022
    font-size: 75%;
3023
    margin-bottom: 3px;
3024
}
3025

    
3026
.machine-connect span {
3027
    text-decoration: underline;
3028
}
3029

    
3030
h5.machine-connect span:hover {
3031
    cursor: pointer;
3032
}
3033

    
3034
.firewall-apply {
3035
    background-color: #4085a5;
3036
    border: medium none;
3037
    float: right;
3038
    font-size: 105%;
3039
    height: 18px;
3040
    margin-right: 5px;
3041
    margin-top: 3px;
3042
    width: 75px;
3043
}
3044

    
3045
.firewall-apply:hover {
3046
    background-color:#5CA1C0;
3047
}
3048

    
3049
.name-div {
3050
    margin: -9px 0 30px 70px;
3051
}
3052

    
3053
.machine-name-div {
3054
    margin-bottom: 20px;
3055
    margin-left: 60px;
3056
}
3057

    
3058
div.reboot-dialog {
3059
    display: none;
3060
    color: black;
3061
    background-color: #4085A5;
3062
    font-size: 75%;
3063
    margin-top: 15px;
3064
    width: 698px;
3065
    z-index: 1;
3066
}
3067

    
3068
div#reboot-machine-template, div.reboot-machine-entry {
3069
    display: none;
3070
    padding: 0 0 10px 35px;
3071
    width: 300px;
3072
}
3073

    
3074
div.reboot-dialog p {
3075
    color: #FFFFFF;
3076
    padding: 10px 0 10px 10px;
3077
}
3078

    
3079
div.reboot-dialog button {
3080
    float:right;
3081
    border: 1px solid #FF7F2A;
3082
    background-color: transparent;
3083
    font-size:100%;
3084
}
3085

    
3086
div.reboot-dialog button:hover {
3087
    background-color: #FF7F2A;
3088
}
3089

    
3090
div.reboot-dialog button.reboot-all {
3091
    margin: -30px 35px 0 0;
3092
}
3093

    
3094
div.reboot-dialog button.reboot-single {
3095
    color: black;
3096
    margin-top: -20px;
3097
}
3098

    
3099
div.reboot-dialog div.code, div.reboot-dialog div.action, div.reboot-dialog div.message, div.reboot-dialog button.details {
3100
    display:none;
3101
}
3102

    
3103
div.reboot-dialog button.details {
3104
    border-color: #800000;
3105
    margin-top: -20px;
3106
}
3107

    
3108
div.reboot-dialog button.details:hover {
3109
    background-color: #800000;
3110
}
3111

    
3112
/* Metadata */
3113
.info-content {
3114
    clear: both;
3115
    height: 95px;
3116
    width: 512px;
3117
}
3118

    
3119
.metadata-container {
3120
    line-height: 12px;
3121
    height: 85px;
3122
    background-color: #84b7d0;
3123
}
3124

    
3125
.metadata-column {
3126
    border-right: 1px solid #5CA1C0;
3127
    color: black;
3128
    float: left;
3129
    font-size: 60%;
3130
    margin-top: 3px;
3131
    height: 70px;
3132
    padding-bottom: 5px;
3133
}
3134

    
3135
.vm-stats {
3136
    padding-left: 10px;
3137
    padding-right: 5px;
3138
    width: 220px;
3139
}
3140

    
3141
.vm-stats div.stat-content {
3142
    height: 18px;
3143
}
3144

    
3145
.vm-stats div.stat-content img {
3146
    margin: 0;
3147
}
3148

    
3149
.vm-stats div.stat-content img.busy {
3150
    margin-left: 95px;
3151
}
3152

    
3153
.vm-stats div.stat-error {
3154
    display:none;
3155
}
3156

    
3157
.vm-details {
3158
    width: 130px;
3159
    margin-left:17px;
3160
}
3161

    
3162
.vm-metadata {
3163
    padding-left: 10px;
3164
    width: 100px;
3165
    border: none;
3166
}
3167

    
3168
.metadata-left {
3169
    float:left;
3170
    width: 30px;
3171
    height: 60px;
3172
}
3173

    
3174
.metadata-right {
3175
    width: 73px;
3176
    float:left;
3177
    height: 35px;
3178
    padding-left: 5px;
3179
    position:relative;
3180
    overflow:hidden;
3181
}
3182

    
3183
.metadata-right .items {
3184
    position:absolute;
3185
    height:20000em;
3186
}
3187

    
3188
.metadata-keys-container {
3189
    height: 60px;
3190
    float: left;
3191
}
3192

    
3193
.single .metadata-keys-container {
3194
    float: none;
3195
    height: 50px;
3196
}
3197

    
3198
.single a.manage-metadata {
3199
    font-size: 80%;
3200
    margin-left:4px;
3201
    color: #383838;
3202
}
3203

    
3204
a.manage-metadata, a.stats-report {
3205
    font-size: 100%;
3206
    color: black;
3207
    margin-left:17px;
3208
    text-decoration: underline;
3209
}
3210

    
3211
a.stats-report {
3212
    margin: 15px 0  0 80px;
3213
}
3214

    
3215
div.machine a.manage-metadata:hover {
3216
    background-color: transparent;
3217
}
3218

    
3219
.metadata-actions, .scrollable {
3220
    padding-left: 5px;
3221
}
3222

    
3223
.singe .metadata-actions, .single .scrollable {
3224
    font-size: 80%;
3225
    line-height: 12px;
3226
    width: 300px;
3227
}
3228

    
3229
.metadata-actions .prev,  .metadata-actions .next{
3230
    float:left;
3231
    width:29px;
3232
    height:6px;
3233
    cursor: pointer;
3234
}
3235

    
3236
.metadata-actions .prev {
3237
    background: url("./roll-up.png") no-repeat scroll 0 0 transparent;
3238
}
3239

    
3240
.metadata-actions .next {
3241
    background: url("./roll-down.png") no-repeat scroll 0 0 transparent;
3242
}
3243

    
3244
.scrollable {
3245
    position:relative;
3246
    overflow:hidden;
3247
    height: 35px;
3248
    width: 60px;
3249
    margin-bottom:2px;
3250
}
3251

    
3252
.scrollable .items {
3253
    position:absolute;
3254
    height:20000em;
3255
}
3256

    
3257
/* single view */
3258
.single {
3259
    color: #383838;
3260
    margin-top: -76px;
3261
    padding-bottom: 10px;
3262
    width: 679px;
3263
}
3264

    
3265
.single .column1 {
3266
    float: left;
3267
    margin: 1px 0 25px 17px;
3268
    width: 140px;
3269
}
3270

    
3271
.single .column1 .state {
3272
    float: left;
3273
    margin-left: 4px;
3274
    padding-bottom: 6px;
3275
    padding-top: 3px;
3276
    position: relative;
3277
    right: 0;
3278
    text-align: center;
3279
    width: 126px;
3280
}
3281

    
3282
.single .column1 .state-label {
3283
    padding-top: 5px;
3284
}
3285

    
3286
.single .column1 .indicators {
3287
    margin-right: 38px !important;
3288
}
3289

    
3290
.single div.connect-arrow {
3291
    margin-left: -17px;
3292
}
3293

    
3294
.single div.connect-border {
3295
    margin-left: -29px;
3296
}
3297

    
3298
.single .single-actions {
3299
    padding-bottom: 4px;
3300
    padding-left: 15px;
3301
    width: 69px;
3302
    float: left;
3303
}
3304

    
3305
.single div.single-action {
3306
    font-size: 80%;
3307
    line-height: 18px;
3308
    text-decoration: none;
3309
    cursor: pointer;
3310
}
3311

    
3312
.single div.single-action:hover {
3313
    background-color:#A1C8DB;
3314
    width: 180px;
3315
    opacity: 0.8;
3316
    filter: alpha(opacity = 80);
3317
}
3318

    
3319
.single div.single-action.selected {
3320
    color: #FF7F2A !important;
3321
    width: 50px !important;
3322
}
3323

    
3324
.single div.single-action.selected:hover {
3325
    background-color:transparent;
3326
}
3327

    
3328
.single div.confirm_single {
3329
    font-size: 80%;
3330
    margin: -19px -115px 0 0;
3331
}
3332

    
3333
.single div.action-container.destroy div.confirm_single {
3334
    margin: -18px -116px 0 0;
3335
    position: relative;
3336
    left: 0px;
3337
}
3338

    
3339
.single div.confirm_single button.no {
3340
    margin-left: -5px;
3341
}
3342

    
3343
.single .spinner, .single .action-indicator {
3344
    margin: 15px 45px 0 0px !important
3345
}
3346

    
3347
.single .action-indicator {
3348
    margin-right: 55px !important;
3349
}
3350

    
3351
.single .wave {
3352
    margin: 15px 53px 0 0px !important
3353
}
3354

    
3355
.single div.action_error {
3356
    margin: 2px 0px 0 605px !important;
3357
    position: relative;
3358
}
3359

    
3360
.single .column2 {
3361
    background-color: #A1C8DB;
3362
    float: left;
3363
    font-size: 78%;
3364
    line-height: 17px;
3365
    margin: 0 0 10px 5px;
3366
    width: 358px;
3367
}
3368

    
3369
.single .column2 .machine-labels {
3370
    float: left;
3371
    font-size: 90%;
3372
    margin-left: 10px;
3373
    margin-top: 10px;
3374
    width: 125px;
3375
}
3376

    
3377
.single .column2 .machine-details {
3378
    float: right;
3379
    text-align: right;
3380
    font-size: 90%;
3381
    width: 210px;
3382
    margin-right: 10px;
3383
    margin-top: 10px;
3384
}
3385

    
3386
.single .column2 .name, .single .column2 .disk, .single .column2 .image-size, .single .column2 .ipv6 {
3387
    margin-bottom: 13px;
3388
}
3389

    
3390
.single .tags {
3391
    clear: both;
3392
    margin-bottom: 10px;
3393
    margin-left: 10px;
3394
}
3395

    
3396
.single .tags-label {
3397
    float: left;
3398
    padding: 0 5px;
3399
    width: 30px;
3400
}
3401

    
3402
.single .tags-down-arrow {
3403
    background: url("/static/tags-down-arrow.png") no-repeat scroll 1px 7px transparent;
3404
    float: left;
3405
    height: 16px;
3406
    width: 9px;
3407
}
3408

    
3409
.single .tags-header {
3410
    background-color: #84B7D0;
3411
    cursor: pointer;
3412
    height: 16px;
3413
    width: 55px;
3414
}
3415

    
3416
.single .tags-content {
3417
    background-color: #84B7D0;
3418
    clear: both;
3419
    height: 65px;
3420
    padding-bottom: 5px;
3421
    padding-top: 5px;
3422
    width: 300px;
3423
}
3424

    
3425
.single .column3 {
3426
    background-color: #A1C8DB;
3427
    margin-left: 535px;
3428
    position: absolute;
3429
    top: 280px;
3430
    width: 150px;
3431
    overflow: visible;
3432
    padding-bottom: 10px;
3433
}
3434

    
3435
.single .column3 .controls {
3436
    font-size: 80%;
3437
    height: 20px;
3438
    padding-left: 7px;
3439
    padding-right: 7px;
3440
    padding-top: 8px;
3441
}
3442

    
3443
.single .column3 .previous {
3444
    float:left;
3445
    width: 72px;
3446
}
3447

    
3448
.single .column3 .next {
3449
    float: right;
3450
    text-align: center;
3451
    width: 60px;
3452
}
3453

    
3454
.single .column3 .next-label {
3455
    float: right;
3456
    margin-right: 3px;
3457
    margin-top: -2px;
3458
}
3459

    
3460
.single .column3 .next-arrow {
3461
    float: right;
3462
    height: 18px;
3463
    width: 10px;
3464
    background: url("./right-arrow.png") no-repeat scroll 3px 2px transparent;
3465
}
3466

    
3467
.single .column3 .prev-label {
3468
    float: left;
3469
    margin-left: 3px;
3470
    margin-top: -2px;
3471
}
3472

    
3473
.single .column3 .prev-arrow {
3474
    background: url("./left-arrow.png") no-repeat scroll 3px 2px transparent;
3475
    float: left;
3476
    height: 18px;
3477
    width: 10px;
3478
}
3479

    
3480
.single .column3 .separator {
3481
    width: 135px;
3482
    height: 1px;
3483
    background-color: #84B7D0;
3484
    margin: 0 0 0 7px;
3485
    clear: both;
3486
}
3487

    
3488
.single .column3 .servers {
3489
    font-size: 80%;
3490
    line-height: 15px;
3491
    padding-top: 10px;
3492
    text-align: right;
3493
    overflow: visible;
3494
    position: relative;
3495
}
3496

    
3497
.single .column3 .server-name {
3498
    margin-left: 10px;
3499
    padding-right: 5px;
3500
    cursor: pointer;
3501
    padding-bottom: 2px;
3502
}
3503

    
3504
div.single div.column3 div.server-name:hover, .single .column3 .column3-selected {
3505
    background-color: #84B7D0;
3506
    color: white;
3507
    opacity: 0.8;
3508
    padding-left: 9px;
3509
    text-align: left;
3510
    width: 160px;
3511
    filter: alpha(opacity = 80);
3512
    position: relative;
3513
}
3514

    
3515
.single .toggler {
3516
    color: #FFFFFF;
3517
    float: right;
3518
    font-size: 140%;
3519
}
3520

    
3521
.single .cpu-usage, .single .network-usage {
3522
    text-align: center;
3523
    padding-top: 15px;
3524
    margin-bottom: 5px;
3525
    font-size: 90%;
3526
    font-weight: bold;
3527
}
3528

    
3529
.single .cpu-graph, .single .network-graph {
3530
    margin-left: 20px;
3531
    margin-bottom:30px;
3532
    width: 660px;
3533
}
3534

    
3535
.single div.lower img.stats {
3536
    margin-left: 82px;
3537
}
3538

    
3539
.single .single-image {
3540
    width: 126px;
3541
    height: 136px;
3542
    margin-bottom: 10px;
3543
    margin-left: 4px;
3544
    background-image: url("./icons/machines/large/unknown-sprite.png");
3545
    background-repeat: no-repeat;
3546
    cursor: pointer;
3547
}
3548

    
3549
.single .single-image-state1 {
3550
    background-position: 0px 0;
3551
}
3552

    
3553
.single .single-image-state3 {
3554
    background-position: -252px 0;
3555
}
3556

    
3557
.single .single-image-state4 {
3558
    background-position: -378px 0;
3559
}
3560

    
3561
.single .single-image-state2 {
3562
    background-position: -126px 0;
3563
}
3564

    
3565
.single .column3 .previous, .single .column3 .next {
3566
    cursor: pointer;
3567
    background-color: #84B7D0;
3568
    color: white;
3569
    font-size: 100%;
3570
    height: 15px;
3571
    padding-top: 2px;
3572
}
3573

    
3574
.single .column3 .disabled {
3575
    opacity: 0.5;
3576
    filter: alpha(opacity = 50);
3577
}
3578

    
3579
.single div.lower {
3580
    clear:both;
3581
    background: url("./terminated-bg.png") repeat scroll 0 0 transparent;
3582
    width: 700px;
3583
    padding-bottom: 15px;
3584
}
3585

    
3586
.single div.upper {
3587
    background: url("./terminated-bg.png") repeat scroll 0 0 transparent;
3588
    margin-bottom: 10px;
3589
    min-height: 310px;
3590
    overflow: visible;
3591
    padding-top: 60px;
3592
    width: 700px;
3593
}
3594

    
3595
/* console css */
3596
.console-header-logo {
3597
    padding-top: 17px;
3598
    margin-left: 30px;
3599
    position: fixed;
3600
}
3601

    
3602
#console-header div.help-text {
3603
    font-size: 75%;
3604
    font-weight:bold;
3605
    color:#FFFFFF;
3606
    float:left;
3607
    position: absolute;
3608
    margin: 45px 0 0 2px;
3609
}
3610

    
3611
div.console-container {
3612
    margin: 0 0em;
3613
    height: auto;
3614
}
3615

    
3616
#wrapper.console {
3617
    width: auto;
3618
}
3619

    
3620
.console-info {
3621
    font-size:80%;
3622
    color: white;
3623
    float:left;
3624
    position:relative;
3625
    margin: 25px 0 0 480px;
3626
}
3627

    
3628
applet {
3629
    width:100%;
3630
    height:100%;
3631
}
3632

    
3633
div.console-footer {
3634
    /* this is for version 0.5*/
3635
    display: none;
3636
}
3637

    
3638
.console-footer #footer-text{
3639
    float:left;
3640
    left: auto;
3641
    margin-left:30px;
3642
}
3643

    
3644
/* add network wizard (see also #wizard for shared classes) */
3645
#networks-wizard .header {
3646
    background-color: #4085A5;
3647
    height: 56px;
3648
}
3649

    
3650
#networks-wizard div.name-input {
3651
    margin: 75px 0 0 55px;
3652
}
3653

    
3654
#networks-wizard input {
3655
    border: 1px solid #CCCCCC;
3656
    color: #445566;
3657
    letter-spacing: 1px;
3658
    width: 170px;
3659
}
3660

    
3661
#networks-wizard span.help {
3662
    font-style: italic;
3663
    font-size: 80%;
3664
    margin-left: 10px;
3665
}
3666

    
3667
#networks-wizard .separator-end {
3668
    background-color: #387693;
3669
    height: 6px;
3670
    width: 479px;
3671
    margin-left: -13px;
3672
    margin-top: 22px;
3673
}
3674

    
3675
.red {
3676
    color: red;
3677
}
3678

    
3679
/* add server to network wizard (see also #metadata-wizard for shared classes) */
3680
#add-machines-wizard span.machine-name {
3681
    margin-left: 4px;
3682
    vertical-align: text-top;
3683
}
3684

    
3685
#add-machines-wizard img.list-logo {
3686
    margin: 2px 1px 1px;
3687
}
3688

    
3689
.css-panes {
3690
    clear: both;
3691
}
3692

    
3693
.last .firewall-content {
3694
    margin-bottom:13px;
3695
}
3696

    
3697
#pub .last .network-separator {
3698
    display:none;
3699
}
3700

    
3701
.public-networks .empty-network-slot {
3702
    display: none;
3703
}
3704

    
3705
/* float clearing for all browsers except the devil one */
3706
.clearfix:after{
3707
  clear: both;
3708
  content: ".";
3709
  display: block;
3710
  height: 0;
3711
  visibility: hidden;
3712
  font-size: 0;
3713
}
3714

    
3715
#machinesview-list div.action-indicator {
3716
    margin:0 !important;
3717
    float: none !important;
3718
}
3719

    
3720
div.action-indicator {
3721
    width: 15px;
3722
    height: 20px;
3723
    background-repeat: no-repeat;
3724
    background-position: 0 0;
3725
}
3726

    
3727
tbody.machines div.action-indicator {
3728
    position: relative;
3729
    top: -2px;
3730
}
3731
div.state .destroy, tbody.machines .destroy {
3732
    background-image: url("./icons/actions/medium/destroy.png");
3733
}
3734
div.state .start, tbody.machines .start {
3735
    background-image: url("./icons/actions/medium/start.png");
3736
}
3737
div.state .reboot, tbody.machines .reboot {
3738
    background-image: url("./icons/actions/medium/reboot.png");
3739
}
3740
div.state .shutdown, tbody.machines .shutdown {
3741
    background-image: url("./icons/actions/medium/shutdown.png");
3742
}