Statistics
| Branch: | Tag: | Revision:

root / ui / static / main.css @ 60a4743d

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.light-background, div.network.light-background {
714
    background-color:#aed2e3 !important;
715
}
716

    
717
div.machine:hover {
718
    background-color:#A1C8DB !important;
719
}
720

    
721

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
1929

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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