Statistics
| Branch: | Tag: | Revision:

root / ui / static / main.css @ 4f1968db

History | View | Annotate | Download (97.7 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
body {
20
    background: url(./body-bg.png) repeat-x #FFFFFF;
21
    text-align:center;
22
    font-size: 16px;
23
}
24

    
25
a, a:hover, a:active, a:focus, div:focus, span:focus, li:focus {
26
    outline: none;
27
}
28

    
29
#okeanos-image {
30
    position: absolute;
31
    bottom: -0px;
32
    right: 0;
33
    z-index:0;
34
}
35

    
36
#container {
37
    position: relative;
38
        margin:0 auto;
39
        width: 100%;
40
        background: transparent;
41
}
42

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

    
52
#content {
53
    padding-bottom: 10px;
54
    width: 100%;
55
}
56

    
57
div#wrapper {
58
    width: 700px;
59
    margin: 0em auto;
60
    text-align: left;
61
}
62

    
63
#footer {
64
    height: 80px;
65
    background-color: #4085A5;
66
    width:100%;
67
}
68

    
69
#footer-container {
70
    height: 80px;
71
    width: 100%;
72
    left:0;
73
    z-index:10;
74
}
75

    
76
#footer div.grnet-sign {
77
    margin-top:10px;
78
}
79

    
80
#footer div.grnet-sign a{
81
    color: #72ADC8;
82
}
83

    
84
#footer div.grnet-sign a:hover {
85
    color: #FFFFFF;
86
}
87

    
88
ol, ul {
89
    list-style: none;
90
}
91

    
92
blockquote, q {
93
    quotes: none;
94
}
95

    
96
blockquote:before, blockquote:after,
97
q:before, q:after {
98
    content: '';
99
    content: none;
100
}
101

    
102
/* remember to define focus styles! */
103
:focus {
104
    outline: 1px dotted #87AADE;
105
}
106

    
107
/* remember to highlight inserts somehow! */
108
ins {
109
    text-decoration: none;
110
}
111

    
112
del {
113
    text-decoration: line-through;
114
}
115

    
116
/* tables still need 'cellspacing="0"' in the markup */
117
table {
118
    border-collapse: collapse;
119
    border-spacing: 0;
120
}
121

    
122
h5 {
123
    font-weight: normal;
124
    margin-bottom:3px;
125
}
126

    
127
.tab-name, 
128
.machine-container .name,
129
h5.namecontainer span,
130
.single .machine-detail.title {
131
    font-family: 'Ubuntu';
132
}
133

    
134
.create-container a {
135
    font-family: 'Open Sans', sans-serif;
136
}
137

    
138
/* root element for tabs  */
139
.tab-name {
140
    background-color: #5CA1C0;
141
    color: #FFFFFF;
142
    float: right;
143
    font-size: 150%;
144
    height: 31px;
145
    text-align: right;
146
    padding-right: 15px;
147
    width: 170px;
148
}
149

    
150
.tab-separator {
151
    background-color: white;
152
    float: left;
153
    width: 2px;
154
    height: 23px;
155
    margin-top: 4px;
156
}
157

    
158
ul.css-tabs {
159
    padding: 0;
160
    height:31px;
161
    background-color: #5CA1C0;
162
}
163

    
164
ul.css-tabs .secondary {
165
    position:relative;
166
}
167

    
168
/* single tab */
169
ul.css-tabs li {
170
    float:left;
171
    padding:0;
172
    list-style-type:none;
173
}
174

    
175
ul.css-tabs .current {
176
    background: #4085A5;
177
}
178

    
179
/* link inside the tab. uses a background image */
180
ul.css-tabs a {
181
    float:left;
182
    display:block;
183
    text-decoration:none;
184
    color:#d2d2d2;
185
    position:relative;
186
    outline:0;
187
    padding: 4px 25px 0;
188
    height: 27px;
189
}
190

    
191
ul.css-tabs a:hover {
192
    background: #74AEC9;
193
}
194

    
195
/* selected tab */
196
ul.css-tabs a.current,
197
ul.css-tabs a.active {
198
    cursor:default;
199
    background: #4085A5;
200
}
201

    
202
/* tab pane */
203
div.css-panes {
204
/*    border-top: 10px solid #87aade;
205
    border-bottom: 10px solid #87aade;  */
206
    background: transparent;
207
}
208

    
209
.css-panes > div.pane {
210
    display:none;
211
}
212

    
213
.panes-menu {
214
    height: 30px;
215
    margin-bottom: 10px;
216
}
217
/* CSS3 border radius for various elements. yea - CSS isn't perfect */
218
.rounded, #sheet input, .error {
219
    border-radius: 5px;
220
    -webkit-border-radius: 5px;
221
    -moz-border-radius: 5px;
222
    -o-border-radius: 5px;
223
    -khtml-border-radius: 5px;
224
}
225

    
226
/*validation error message*/
227
/*.error {*/
228
    /*background-color:#E8FF6D;*/
229
    /*padding:4px;*/
230
    /*-webkit-box-shadow: #000 0 0 9pt;*/
231
    /*-moz-box-shadow: #000 0 0 9pt;*/
232
/*}*/
233
.error {
234
    color: #f00 !important;
235
}
236

    
237
/* nested arrow inside error message. It's 100% CSS. No images. */
238
.error em {
239
    border: 10px solid;
240
    border-color: #E8FF6D transparent transparent;
241
    bottom: -17px;
242
    display: block;
243
    height: 0;
244
    left: 10px;
245
    position: absolute;
246
    width: 0;
247
}
248

    
249
/* input field that caused validation error */
250
.invalid {
251
    background-color: rgba(221, 233, 255, 0.898) !important;
252
}
253

    
254
#beforecreate {
255
    background-color: #FF9955;
256
    height: 32px;
257
    width: 13px;
258
}
259

    
260
.pane-top {
261
    height: 70px;
262
    position: relative;
263
    background: #EFF7FA 0px 0px;
264
    /*margin-bottom: -2px;*/
265
}
266

    
267
#machines-pane-top.empty {
268
    background: transparent;
269
}
270

    
271
#beforecreate {
272
    border-left: 16px solid #efefef;
273
    margin-left: -16px;
274
}
275

    
276
.create-container {
277
    line-height: 4em;
278
}
279

    
280
#createcontainer a {
281
}
282

    
283
#create {
284
    background-color: #FF7F2A;
285
    color: #000;
286
    cursor: pointer;
287
    text-decoration: none;
288
    font-size:100%;
289
}
290

    
291
#create:hover {
292
    background-color: #FF9955;
293
}
294

    
295
#console-header {
296
    height: 67px;
297
    margin-bottom:15px;
298
    background: url("./header-bg.png") repeat-x scroll 0 0 #FFFFFF;
299
}
300

    
301
.header-logo {
302
    padding-top: 28px;
303
}
304

    
305
div#footer-text a {
306
    color: #FFFFFF;
307
    text-decoration: none;
308
}
309

    
310
div#footer-text{
311
    color: #FFFFFF;
312
    font-size: 75%;
313
    padding-top: 10px;
314
}
315

    
316
#footer-bg {
317
    background: url("./footer-bg.png") no-repeat scroll 0 0 #4085A5;
318
    background-position:right;
319
}
320

    
321
.modal {
322
    background-color:#fff;
323
    display:none;
324
    width:30em;
325
    padding:1em;
326
    text-align:left;
327
}
328

    
329
/* server wizard scrollable root element and network wizard */
330
#wizard, #networks-wizard {
331
    font-size:75%;
332
    height:425px;
333
    width:453px;
334
    overflow:hidden;
335
    position:absolute !important;
336
}
337

    
338
/* scrollable items */
339
#wizard .items {
340
    width:20000em;
341
    clear:both;
342
    position:absolute;
343
    display:block;
344
    padding: 0;
345
    margin: 0;
346
    border:none;
347
    background:none;
348
}
349

    
350
/* single item */
351
#wizard .page, #networks-wizard div.container {
352
    padding: 0px 40px 20px 15px;
353
    width:447px;
354
    float:left;
355
    display:block;
356
    border:none;
357
    background-color: transparent;
358
}
359

    
360
#networks-wizard div.container {
361
    background-color: #ECF4F8;
362
    width:400px;
363
    height: 180px;
364
    margin-bottom:50px;
365
}
366

    
367
/* title */
368
#wizard h2, #networks-wizard h2 {
369
    color: #FF7B24;
370
    font-size: 100%;
371
    font-style: italic;
372
    font-weight: bold;
373
    margin-left: 37px;
374
    margin-top: 17px;
375
}
376

    
377
#networks-wizard h2 {
378
    margin-top: 15px;
379
}
380

    
381
#wizard li {
382
    margin-bottom:1.2em;
383
}
384

    
385
#wizard .pane li {
386
    margin: 0;
387
}
388

    
389
#wizard label {
390
    font-size:120%;
391
    display:block;
392
    clear: both;
393
}
394

    
395
#wizard label strong {
396
    position:relative;
397
    top:-1px;
398
    font-size: 80%;
399
    font-weight: normal;
400
}
401

    
402
#wizard label em {
403
    font-size:75%;
404
    color:#666;
405
    font-style:normal;
406
}
407

    
408
#wizard .text {
409
    width: 270px;
410
    padding: 5px;
411
    margin-top: 10px;
412
    border: 1px solid #ccc;
413
    color: #456;
414
    letter-spacing: 1px;
415
}
416

    
417
#wizard select {
418
    border:1px solid #ccc;
419
    width:94%;
420
    padding:4px;
421
    display: none;
422
}
423

    
424
#wizard .double label {
425
    width:50%;
426
    float:left;
427
}
428

    
429
#wizard .double .text {
430
    width:93%;
431
}
432

    
433
#wizard .clearfix {
434
    clear:left;
435
    padding-top:10px;
436
}
437

    
438
#wizard .right {
439
    float:right;
440
}
441

    
442
#wizard .error {
443
    border:1px solid red;
444
}
445

    
446
#wizard a:hover div.image {
447
    background-color: #C5DEE9;
448
}
449

    
450
.selecteddiv {
451
    background-color: #C5DEE9 !important;
452
}
453

    
454
#wizard label a:hover strong {
455
    color: black;
456
}
457

    
458
#wizard div.image span.size {
459
    font-size: 75%;
460
    color: #666;
461
}
462

    
463
#wizard div.image .radio {
464
    float: left;
465
    margin-top: 10px;
466
}
467

    
468
#wizard div.image span.image-id, #wizard div.image span.description {
469
    font-size: 75%;
470
    color: #666;
471
    font-weight: normal;
472
    display:inline;
473
}
474

    
475
#wizard a:hover div.image span.image-id, #wizard a:hover div.image span.description, #wizard a:hover div.image span.size {
476
    color: black;
477
}
478

    
479
#wizard .cost {
480
    color: #79A4C1;
481
    margin-top: 40px;
482
    clear:both;
483
    margin-left: 15px;
484
    font-size: 95%;
485
}
486

    
487
#wizard #status {
488
    height: 50px;
489
    background-color: #4085A5;
490
}
491

    
492
#wizard .headernumber {
493
    font-size: 410%;
494
}
495

    
496
#wizard .headerbody {
497
    font-size: 120%;
498
    font-weight: normal;
499
    display: inline;
500
    top: -15px;
501
    position: relative;
502
}
503

    
504
#wizard .first {
505
    left: -10px;
506
}
507

    
508
#wizard .checked {
509
    color: #64a6c4 !important;
510
}
511

    
512
#wizard .li-2 {
513
    margin-top: -1px !important;
514
}
515

    
516
#wizard .img-check {
517
    margin-bottom: 8px;
518
    margin-left: -8px;
519
}
520

    
521
#wizard .li-1 .img-check {
522
    margin-left: 2px;
523
}
524

    
525
#wizard .topruler, #networks-wizard .topruler, #wizard .bottomruler, #networks-wizard .bottomruler {
526
    background-color: #CDE2EC;
527
    color: #CDE2EC;
528
    border: 0 none;
529
    height: 4px;
530
    margin-left: -1px;
531
    width: 447px;
532
    margin-bottom: 6px;
533
    margin-top: 4px;
534
}
535

    
536
#wizard .bottomruler, #networks-wizard .bottomruler {
537
    margin-top:6px;
538
}
539

    
540
#networks-wizard .topruler, #networks-wizard .bottomruler {
541
    width: 455px;
542
    float: left;
543
}
544

    
545
#wizard #cancel, #networks-wizard .cancel {
546
    background-color: #4085A5;
547
    border-color: #4085A5;
548
    text-align: center !important;
549
}
550

    
551
#wizard #cancel:hover, #networks-wizard .cancel:hover {
552
    background-color: #7DB4CD;
553
    border-color: #7DB4CD;
554
}
555

    
556
#wizard #start, #networks-wizard .create {
557
    text-align: center;
558
    background-color: #FF7F2A;
559
    border-color: #FF7F2A;
560
}
561

    
562
:focus {
563
    outline: none;
564
    -moz-outline-style: none;
565
}
566

    
567
#wizard .img-next {
568
    margin: 0 -4px -1px 8px;
569
}
570

    
571
#wizard .img-prev {
572
    margin: 0 8px -1px -4px;
573
}
574

    
575
#networks-wizard .create {
576
    float:right;
577
    width: 140px;
578
}
579

    
580
.overlay-networks-create .form-actions {
581
    float: right;
582
    margin-top: -26px !important;
583
}
584

    
585
#wizard #start:hover, #networks-wizard .create:hover {
586
    background-color: #FF9651;
587
    border-color: #FF9651;
588
}
589

    
590
#wizard .separator-end {
591
    position: absolute;
592
    background-color: #387693;
593
    height: 5px;
594
    margin-left: -14px;
595
    margin-top: 382px;
596
    width: 550px;
597
}
598

    
599
.page ul {
600
    height: 270px;
601
    overflow: auto;
602
}
603

    
604
.panes ul.pane {
605
    height: 220px;
606
}
607

    
608
#wizard #tabscontainer {
609
    background-color: #CDE2EC;
610
    height: 20px;
611
    width: 448px;
612
}
613

    
614
.page ul.tabs {
615
    overflow: hidden;
616
    height: auto;
617
    margin-bottom: -1px;
618
    margin-top: -1px;
619
}
620

    
621
.page ul.tabs li {
622
    float: right;
623
    margin: 0 0.2em;
624
}
625

    
626
#status li {
627
    float: left;
628
    color: #387693;
629
    padding: 0 1px 0 37px;
630
    bottom: 0px;
631
}
632

    
633
#status li.active .headernumber {
634
    color: #FFFFFF;
635
}
636

    
637
#status li.active .headerbody {
638
    color: #FFFFFF;
639
}
640

    
641
div.image-container {
642
    border-bottom: 1px solid #CCCCCC;
643
    margin-left: 10px;
644
    margin-right: 10px;
645
}
646

    
647
#page2-container {
648
    background-color: #ECF4F8;
649
    height: 193px;
650
    margin-top: 3px;
651
    padding-top: 25px;
652
}
653

    
654
#page3-container {
655
    background-color: #ECF4F8;
656
    height: 245px;
657
    margin-bottom: 32px;
658
    padding-left: 50px;
659
}
660

    
661
/* slider root element */
662
.slider {
663
    border: 1px solid #666;
664
    cursor: pointer;
665
    display: inline !important;
666
    float: left;
667
    margin: 5px 0 20px 10px;
668
    position: relative;
669
    width: 250px;
670
}
671

    
672
.sliders {
673
    float:left;
674
    width: 40px;
675
    margin-left: 10px;
676
    margin-top: 3px;
677
}
678

    
679
.units {
680
    padding-left:10px;
681
}
682

    
683
.slider-container {
684
    padding-bottom: 15px;
685
    margin-left: 5px;
686
}
687

    
688
/* drag handle */
689
.handle {
690
    -moz-box-shadow: 0 0 2px #000000;
691
    background: url("./h30.png") repeat-x scroll 0 0 #FFFFFF;
692
    border: 1px solid #000000;
693
    cursor: move;
694
    display: block;
695
    height: 10px;
696
    margin-top: -8px;
697
    position: absolute;
698
    width: 8px;
699
}
700

    
701
/* progress bar (enabled with progress: true) */
702
.progress {
703
    height: 3px;
704
    background-color: #387693;
705
}
706

    
707
/* the input field */
708
.range {
709
    border: 1px solid #387693;
710
    float: left;
711
    font-size: 100%;
712
    margin: -3px 0 0 15px;
713
    padding: 2px 5px 2px 0;
714
    text-align: right;
715
    width: 50px;
716
}
717

    
718
.selectedrange {
719
    border-color: #5599FF;
720
}
721

    
722
#credits-indicator {
723
    background-color: #ECF4F8;
724
    float: none;
725
    margin: 0 0 0 10px;
726
    border: 1px solid #387693;
727
    color: #387693;
728
}
729

    
730
/* machines */
731
.machine-container {
732
    position:relative;
733
}
734

    
735
.icon .machine-container.last .machine-data-cont, .machine-container:last-child .machine-data-cont {
736
    margin-bottom:0;
737
    padding-bottom: 0;
738
    border-bottom: none;
739
}
740

    
741
.icon .machine-container.last .machine-data, .machine-container:last-child .machine-data {
742
    border-bottom: none;
743
}
744

    
745
.icon .machine-container .subtitle {
746
    font-size: 0.70em;
747
    color: #222;
748
    line-height: 23px;
749
    height: 23px;
750
    margin-top: -5px;
751
}
752

    
753
.icon .machine-container .subtitle {
754
    
755
}
756

    
757
.icon .machine-container .info {
758
    margin-top: 2px;
759
    height: 17px;
760
}
761

    
762
.icon .machine-container .building-progress {
763
    vertical-align: top;
764
}
765

    
766
.ip-version-label {
767
    font-size: 0.8em;
768
    padding: 0.3em;
769
    background-color: #C4DDE9;
770
    color: #000;
771
}
772

    
773
.icon .machine-data {
774
    width: 520px;
775
    float: left;
776
    background-color: transparent;
777
}
778

    
779
.icon .machine-info {
780
    padding: 10px 0;
781
}
782

    
783
.icon .machine-details .name {
784
    height: 28px;
785
}
786

    
787
.icon .machine-connect {
788
    width: 80px;
789
    float: left;
790
}
791

    
792
.icon .machine-details {
793
    width: 310px;
794
    float: left;
795
    margin-top: -6px;
796
}
797

    
798
.icon .state {
799
    font-size: 98%;
800
    width: 120px;
801
    margin-right: 10px;
802
    float: left;
803
    height: 55px;
804
    margin-top: -5px;
805
}
806

    
807
.vm-actions {
808
    position: relative;
809
}
810

    
811
.icon .vm-actions {
812
    /*display: none;*/
813
}
814

    
815
.icon .vm-actions, .network .vm-actions {
816
    width: 180px;
817
    height: 78px;
818
    float: left;
819
}
820
.network .vm-actions {
821
    width: 185px;
822
}
823

    
824
.icon .machine-container:hover .machine-data {
825
    background-color:#A1C8DB !important;
826
}
827

    
828
.icon .machine-container:hover .vm-actions {
829
    display: block;
830
}
831

    
832
.vm-actions {
833
    font-size: 75%;
834
}
835

    
836
.vm-actions a {
837
    color: black;
838
    height: 15px;
839
    margin: 0 0 1px 4px;
840
    padding: 1px;
841
    padding-left: 8px;
842
    display: block;
843
}
844

    
845
.vm-actions a:hover {
846
    background-color:#A1C8DB;
847
    color: #fff;
848
    border-left: 4px solid #7DB4CD;
849
    padding-left: 4px;
850
}
851

    
852
.vm-actions a.selected {
853
    color: #FF7F2A !important;
854
}
855

    
856
.vm-actions a.selected {
857
    background-color:transparent;
858
}
859

    
860
.vm-actions .action-container {
861
    position: relative;
862
}
863

    
864
.vm-actions .action-container .confirm_single {
865
    position: absolute;
866
    right: -20px;
867
    top: -2px;
868
}
869

    
870
div.list div.actions a.enabled.destroy {
871
    color: #981D1D;
872
}
873

    
874
.vm-actions .action-container.destroy {
875
    position: absolute;
876
    bottom: -2px;
877
    width: 100%;
878
    left: 0px;
879
    background: transparent;
880
}
881

    
882
.vm-actions .action-container.destroy a {
883
    color: #981D1D;
884
}
885

    
886
.icon .light-background .machine-data, div.network.light-background, div.network.expand {
887
    background-color:#aed2e3 !important;
888
}
889

    
890
.single .light-background {
891
    background-color:#aed2e3;
892
}
893

    
894
.icon .machine-data-cont {
895
    margin-bottom: 5px;
896
    padding-bottom: 5px;
897
    border-bottom: 1px solid #D1E7F0;
898
    width: 520px;
899
    float: left;
900
}
901
.icon .terminated .machine-data-cont {
902
    border-color: #B6CED6;
903
}
904

    
905
.machine a {
906
    font-weight: normal;
907
    text-decoration: none;
908
}
909

    
910
.machine span.name, .machine span.ip {
911
    font-size: 75%;
912
    color: black;
913
    margin-top: 6px;
914
}
915

    
916
.machine span.name {
917
    font-weight: bold;
918
}
919

    
920
.oldValue {
921
    display:none;
922
}
923

    
924
.state {
925
}
926

    
927
.state div {
928
    text-align: right;
929
    margin-right: 3px;
930
}
931

    
932
/* icon view actions */
933
div.machine div.actions a.shutdown-padding {
934
    margin-bottom: 22px;
935
}
936

    
937
div.actions a.enabled:hover{
938
    color: black !important;
939
    text-decoration: underline;
940
    display: block;
941
}
942

    
943
div.machine:hover .actions a {
944
    visibility: visible;
945
}
946

    
947
div.machine div.display a{
948
    visibility: visible;
949
}
950

    
951
div.machine div.actions .disabled {
952
    display: none;
953
}
954

    
955
div.single-container div.vm-actions .disabled {
956
    display: none;
957
}
958

    
959
div.machine div.actions .disabled {
960
    display: none;
961
}
962

    
963
div.connect-arrow {
964
    background: url(/static/connect-arrow.png) no-repeat;
965
    height: 28px;
966
    width:14px;
967
    position: absolute;
968
    display: none;
969
}
970

    
971
.machine div.connect-arrow {
972
    display: none;
973
    left: -3px;
974
    position: absolute;
975
    top: 9px;
976
}
977

    
978
div.connect-arrow:hover, div.connect-arrow.border-hover, div.connect-arrow-ie, div.connect-arrow.border-ie {
979
    cursor: pointer;
980
    background: url(/static/connect-arrow-hover.png) no-repeat;
981
    height: 28px;
982
    width:26px;
983
}
984

    
985
div.connect-border {
986
    opacity: 0.8;
987
    filter: alpha(opacity = 80);
988
    background-color:#4fe0c3;
989
    height:28px;
990
    width: 12px;
991
    position: absolute;
992
    display: none;
993
}
994

    
995
div.connect-border:hover {
996
    cursor: pointer;
997
}
998

    
999
.machine div.connect-border {
1000
    display: none;
1001
    left: -15px;
1002
    position: absolute;
1003
    top: 9px;
1004
}
1005

    
1006
.standard .machine .logo {
1007
    float: left;
1008
    width: 50px;
1009
    height: 54px;
1010
    margin: 4px 14px 0;
1011
}
1012
.machine .logo {
1013
    background-image: url("./icons/machines/medium/unknown-sprite.png");
1014
    background-repeat: no-repeat;
1015
    cursor: pointer;
1016
}
1017

    
1018
.standard .machine .single-image-state1 {
1019
    background-position: 0px 0;
1020
}
1021

    
1022
.standard .machine .single-image-state3 {
1023
    background-position: -100px 0;
1024
}
1025

    
1026
.standard .machine .single-image-state4 {
1027
    background-position: -150px 0;
1028
}
1029

    
1030
.standard .machine .single-image-state2 {
1031
    background-position: -50px 0;
1032
}
1033

    
1034
.standard .running .machine .logo {
1035
   cursor: pointer;
1036
}
1037

    
1038
.list .machine img {
1039
    margin: 0;
1040
}
1041

    
1042
.icon div.ip, .icon div.ips {
1043
    font-size: 75%;
1044
}
1045

    
1046
div.indicators {
1047
    margin-right: 2px !important;
1048
}
1049
div.indicator1, div.indicator2, div.indicator3, div.indicator4 {
1050
    background-color: #63cf1c;
1051
    width:10px;
1052
    height:11px;
1053
    clear: none;
1054
    float:right;
1055
    -webkit-transition: background-color .75s ease-out;
1056
    -o-transition: background-color .75s ease-out;
1057
    -moz-transition: background-color .75s ease-out;
1058
    transition: color .75s ease-out;
1059
}
1060

    
1061
.view-separator {
1062
    color:#5F8DD3;
1063
}
1064

    
1065
.running.disabled {
1066
    background: transparent;
1067
}
1068

    
1069
.running-state .indicator1, .running-state .indicator2, .running-state .indicator3, .running-state .indicator4 {
1070
    background-color: #63cf1c;
1071
}
1072

    
1073
.rebooting-state .indicator1, .rebooting-state .indicator2, .rebooting-state .indicator3, .rebooting-state .indicator4 {
1074
    background-color: #d4aa00;
1075
}
1076

    
1077
.error-state .indicator1, .error-state .indicator2, .error-state .indicator3, .error-state .indicator4 {
1078
    background-color: #ff0000;
1079
}
1080

    
1081
.terminated-state .indicator1, .terminated-state .indicator2, .terminated-state .indicator3, .terminated-state .indicator4 {
1082
    background-color: #5e1616;
1083
}
1084

    
1085
.build-state .indicator1, .build-state .indicator2, .build-state .indicator3, .build-state .indicator4 {
1086
    background-color: #FF7F2A;
1087
}
1088

    
1089
.destroying-state .indicator1, .destroying-state .indicator3, .destroying-state .indicator2, .destroying-state .indicator4 {
1090
    background-color: #4085a5 !important;
1091
}
1092

    
1093
.shutting-state .indicator1, .shutting-state .indicator3, .shutting-state .indicator2, .shutting-state .indicator4 {
1094
    background-color: #940606;
1095
}
1096

    
1097
.starting-state .indicator1, .starting-state .indicator2, .starting-state .indicator3, .starting-state .indicator4 {
1098
    background-color: #9ed976;
1099
}
1100

    
1101
.network-indicator .indicator1, .network-indicator .indicator2, .network-indicator .indicator3, .network-indicator .indicator4 {
1102
    background-color: #63cf1c;
1103
}
1104

    
1105
.network-indicator.in-progress .indicator1, .network-indicator.in-progress .indicator2, .network-indicator.in-progress .indicator3, .network-indicator.in-progress .indicator4 {
1106
    background-color: #FF7F2A;
1107
}
1108

    
1109
.running, .terminated {
1110
    background: #EFF7FA repeat scroll 0 0;
1111
    padding-bottom: 15px;
1112
}
1113

    
1114
.running, #machinesview-list, .single {
1115
}
1116

    
1117
.terminated {
1118
    background:#DCE5E8  repeat scroll 0 0;
1119
    padding-top: 15px;
1120
    margin-top: 15px;
1121
}
1122

    
1123
span.rename {
1124
    background-repeat: no-repeat;
1125
    color: transparent;
1126
    font-size: 75%;
1127
    font-weight: normal;
1128
    margin-left: 10px;
1129
    padding-left: 10px;
1130
    text-align: left;
1131
    cursor: pointer;
1132
}
1133

    
1134
div.name:hover span.rename, span.rename_hovered {
1135
    color: #3D3D3D;
1136
    margin-top: 0.4em;
1137
    background-image: url(./pencil.png);
1138
    background-position: 0 3px;
1139
}
1140

    
1141
.machine div.info {
1142
    font-size: 75%;
1143
}
1144

    
1145
div.machine:hover div.info-header, div.machine:hover div.toggler div.down {
1146
    background-color: #84b7d0;
1147
}
1148

    
1149
div.machine div.info-label.darker, .single div.tags-label.darker, div.network .darker {
1150
    background-color: #5CA1C0;
1151
}
1152

    
1153
.machine div.info div.info-label {
1154
    font-size: 75%;
1155
    height:16px;
1156
    width: 30px;
1157
    padding: 1px 0 0 5px;
1158
}
1159

    
1160
.machine div.info div.toggler, .single div.tags div.toggler, div.network div.toggler {
1161
    width:15px;
1162
    height:17px;
1163
    margin-top: -11px;
1164
    margin-left: 37px;
1165
}
1166

    
1167
div.network div.toggler {
1168
    margin-left: 90px;
1169
}
1170

    
1171
.machine div.info div.down {
1172
    background: url(/static/down-arrow.png) no-repeat scroll 1px 1px;
1173
}
1174

    
1175
.single div.tags div.down {
1176
    background: url(/static/down-arrow.png) no-repeat scroll 2px 2px;
1177
}
1178

    
1179
.network div.network-machines div.down {
1180
    background: url(/static/down-arrow.png) no-repeat scroll 2px 2px;
1181
}
1182

    
1183
.network div.network-machine div.firewall div.down {
1184
    background: url(/static/down-arrow.png) no-repeat scroll 2px 2px;
1185
}
1186

    
1187
.machine div.info div.up {
1188
    background: url(/static/up-arrow.png) no-repeat scroll 1px 0;
1189
}
1190

    
1191
.single div.tags div.up {
1192
    background: url(/static/up-arrow.png) no-repeat scroll 2px 2px;
1193
}
1194

    
1195
.network div.network-machines div.up {
1196
    background: url(/static/up-arrow.png) no-repeat scroll 2px 2px;
1197
}
1198

    
1199
.network div.network-machine div.firewall div.up {
1200
    background: url(/static/up-arrow.png) no-repeat scroll 2px 2px;
1201
}
1202

    
1203
button {
1204
    background-color: #87AADE;
1205
    border: 1px solid #87AADE;
1206
    color: #FFFFFF;
1207
    cursor: pointer;
1208
    height: 23px;
1209
    width: 120px;
1210
}
1211

    
1212
button.next {
1213
    background-color: #4085A5;
1214
    border-color: #4085A5;
1215
    text-align: right;
1216
}
1217

    
1218
button.next:hover {
1219
    background-color: #7DB4CD;
1220
    border-color: #7DB4CD;
1221
}
1222

    
1223
button.prev {
1224
    background-color: #4085A5;
1225
    border-color: #4085A5;
1226
    margin-left: -1px;
1227
    text-align: left;
1228
}
1229

    
1230
button.prev:hover {
1231
    background-color: #7DB4CD;
1232
    border-color: #7DB4CD;
1233
}
1234

    
1235
.image-logo {
1236
    float: left;
1237
    margin-right: 1em;
1238
    margin-left: 1.5em;
1239
    margin-top: 4px;
1240
}
1241

    
1242
.icon div.image {
1243
    clear: both;
1244
    display: block;
1245
    margin-bottom: 3px;
1246
    margin-top: 3px;
1247
    padding: 5px;
1248
}
1249

    
1250
div#view-select {
1251
    clear: both;
1252
    color: white;
1253
    position: absolute;
1254
    right: 15px;
1255
    top: 15px;
1256
}
1257

    
1258
a.machines_view_link {
1259
    text-decoration: none;
1260
    font-size: 0.7em;
1261
    padding: 4px;
1262
    padding-right: 8px;
1263
    color: #5CA1C0;
1264
    margin-left: 5px;
1265
    background-repeat: no-repeat;
1266
    background-color: #C9DFEA;
1267
}
1268

    
1269
a.machines_view_link span {
1270
    float: left;
1271
}
1272

    
1273
a.machines_view_link span.ico {
1274
    width: 17px;
1275
    height: 15px;
1276
    margin-right: 10px;
1277
    background-position: -36px 0;
1278
}
1279

    
1280
a.machines_view_link:hover {
1281
    background-color: #A1C8DB;
1282
    color: #fff;
1283
}
1284
a.machines_view_link:hover span.ico {
1285
    background-position: -0px 0px;   
1286
}
1287

    
1288
a.machines_view_link.activelink span.ico {
1289
    background-position: -18px 0px;
1290
}
1291
a.machines_view_link.activelink {
1292
    color: #fff;
1293
    background-color: #5CA1C0;
1294
}
1295

    
1296
div#view-select a {
1297
    display: block;
1298
    float: left;
1299
}
1300

    
1301
a#list:hover {
1302
    background: #5f8dd3;
1303
}
1304

    
1305
a#machines_view_icon_link:active, a#machines_view_list_link:active {
1306
    color:white;
1307
}
1308

    
1309
a#machines_view_icon_link span.ico {
1310
    background-image: url(./icon-view.png);
1311
}
1312

    
1313
a#machines_view_list_link span.ico {
1314
    background-image: url(./list-view.png);
1315
}
1316

    
1317
a#machines_view_single_link span.ico {
1318
    background-image: url(./single-view.png);
1319
}
1320

    
1321
#machinetype {
1322
    background-color: #CDE2EC;
1323
    height: 25px;
1324
    margin-bottom: 0px !important;
1325
}
1326

    
1327
div.machine-type {
1328
    float: left;
1329
    margin: 4px 18px 20px;
1330
}
1331

    
1332
.machine-type .active {
1333
    color: #FFFFFF
1334
}
1335

    
1336
div.machine-type label.disabled {
1337
    color: #aaa !important;
1338
}
1339

    
1340
#machinesview {
1341
}
1342

    
1343
#machines-pane {
1344
}
1345

    
1346
.list#machinesview {
1347
    margin-left: -20px;
1348
    display:none;
1349
}
1350

    
1351
#machinesview-list.list {
1352
    background: #EFF7FA  repeat scroll 0 0;
1353
    padding-left: 15px;
1354
    padding-bottom: 15px;
1355
}
1356

    
1357
#machinesview_content {
1358
    display:none;
1359
}
1360

    
1361
.list-machines {
1362
    min-width: 515px;
1363
}
1364

    
1365
#emptymachineslist {
1366
    background-color: #6BA9C6;
1367
    color: #A0A0A0;
1368
    display: none;
1369
    padding: 65px 150px 35px;
1370
    text-align: justify;
1371
    margin-top: -70px;
1372
}
1373

    
1374
#welcomeheader {
1375
    color:white;
1376
    text-align: center;
1377
}
1378

    
1379
.welcomebody {
1380
    color: white;
1381
    font-size:80%;
1382
}
1383

    
1384
.welcomebody a {
1385
    color: white;
1386
}
1387

    
1388
.welcomefooter {
1389
    color: white;
1390
    font-size:60%;
1391
}
1392

    
1393
.welcomefooter a {
1394
    color: white;
1395
}
1396

    
1397
.emptycreatecontainer {
1398
    margin-left: 430px !important;
1399
    position: absolute;
1400
    margin-top: 5px !important;
1401
    width: 180px;
1402
    background-color: #CCCCCC;
1403
    padding: 5px;
1404
    padding-left: 10px;
1405
}
1406

    
1407
.emptycreate {
1408
    margin: 20px 10px 5px 0 !important;
1409
}
1410

    
1411
#createbody {
1412
    display:none;
1413
    font-size: 80%;
1414
}
1415

    
1416
div.list label img {
1417
    margin: 5px 5px -3px 0;
1418
}
1419

    
1420
div.list label {
1421
    color: #3D3D3D;
1422
    font-size: 75%;
1423
}
1424

    
1425
div.list .state {
1426
    margin-top: 7px;
1427
    margin-right: 10px;
1428
}
1429

    
1430
div.list table tbody {
1431
    margin-top: 8px;
1432
}
1433

    
1434
div.list table tr.checked td {
1435
    background-color: #A1C8DB !important;
1436
}
1437

    
1438
div.list table tr:hover td,
1439
div.list table tr.inactive:hover td,
1440
div.list table tr.error:hover td {
1441
    background-color: #A1C8DB;
1442
    color: #fff;
1443
}
1444

    
1445
div.list table td.name {
1446
    min-width: 170px;
1447
}
1448

    
1449
div.list table td.status {
1450
    font-size: 0.9em !important; 
1451
    text-align: right;
1452
    min-width: 90px;
1453
    color: #000;
1454
}
1455

    
1456
div.list table td.flavor {
1457
    font-size: 0.8em;
1458
}
1459

    
1460
div.list table td {
1461
    border-bottom: 1px solid #DDD;
1462
}
1463

    
1464
div.list table tr.error td.status {
1465
    color: #800000 !important;
1466
    font-weight: bold;
1467
}
1468

    
1469
div.list table tr.error td {
1470
    background-color: #DCE5E8;
1471
}
1472

    
1473
div.list table tr.inactive td {
1474
    background-color: #DCE5E8;
1475
}
1476

    
1477
div.list .stopped {
1478
    margin-top: 8px;
1479
}
1480

    
1481
/* root element for tabs  */
1482
#wizard ul.tabs {
1483
    margin-right: -1px;
1484
    float: right;
1485
}
1486

    
1487
#wizard div.panes {
1488
    height: 247px;
1489
    clear:both;
1490
    margin-top: 3px;
1491
}
1492

    
1493
.typebody {
1494
    font-size: 80%;
1495
    font-weight: normal;
1496
    position: relative;
1497
    top: -3px;
1498
}
1499

    
1500
.typehover {
1501
    color: #FFFFFF;
1502
}
1503

    
1504
#label-name {
1505
    margin-top: 10px;
1506
}
1507

    
1508
/* single tab */
1509
#wizard ul.tabs li {
1510
    margin-bottom: 0;
1511
    list-style-type:none;
1512
    float: left;
1513
}
1514

    
1515
/* link inside the tab. uses a background image */
1516
#wizard ul.tabs a {
1517
    display:block;
1518
    padding: 0.2em 0.5em 0.1em 0.4em;
1519
    text-decoration:none;
1520
    color: #FFFFFF;
1521
    position:relative;
1522
    top:1px;
1523
    outline:0;
1524
    background-color: transparent;
1525
    text-align: center;
1526
    width: 100px;
1527
    white-space: nowrap;
1528
    height: 17px;
1529
}
1530

    
1531
#wizard ul.tabs a:hover {
1532
    color: #FFFFFF;
1533
    background-color:#4085A5;
1534
}
1535

    
1536
/* selected tab */
1537
#wizard ul.tabs a.current {
1538
    color: white;
1539
    background-color: #7DB4CD;
1540
    cursor: default;
1541
}
1542

    
1543
#wizard #standard-images {
1544
    background-color: #ECF4F8;
1545
}
1546

    
1547
div.list div.actions {
1548
    display: none;
1549
    clear: left;
1550
    float: right;
1551
    margin-right: 15px;
1552
    margin-top: 37px;
1553
    text-align: right;
1554
    width: 120px;
1555
}
1556

    
1557
div.list div.actions a {
1558
    clear: left;
1559
    color: #A1A1A1;
1560
    display: block;
1561
    font-size:75%;
1562
    margin-bottom: 2px;
1563
}
1564

    
1565
div.list div.actions a:hover {
1566
    background-color: transparent;
1567
}
1568

    
1569
div.list div.actions a.enabled {
1570
    color: #3D3D3D;
1571
}
1572

    
1573
div.list div.actions a.enabled:hover{
1574
    cursor: pointer;
1575
    color: black;
1576
    text-decoration: underline;
1577
}
1578

    
1579
div.list div.actions a.selected {
1580
    color: #FF7F2A !important;
1581
}
1582

    
1583
input.machine {
1584
    width: 13px;
1585
    height: 13px;
1586
    top: -1px;
1587
    overflow: hidden;
1588
}
1589

    
1590
.description-container {
1591
    display: inline-block;
1592
    position: relative;
1593
    width: 300px;
1594
}
1595

    
1596
#wizard .button-container {
1597
    height: 20px;
1598
}
1599

    
1600

    
1601
/* metadata dropdown combo */
1602
.meta-key {
1603
    margin-right: 18px;
1604
    float:left;
1605
}
1606

    
1607
/* notification box */
1608
#yes-no {
1609
    height: 150px;
1610
    z-index: 9999;
1611
    border-bottom: 5px solid #4085A5;
1612
}
1613

    
1614
#yes-no p, #yes-no button {
1615
    margin-top: 15px;
1616
}
1617

    
1618
#error-success, .notification-box {
1619
    z-index: 9999;
1620
    border-bottom: 5px solid #4085A5;
1621
    min-height: 150px;
1622
    top: 50px !important;
1623
    position: absolute;
1624
}
1625

    
1626
#error-success p, .notification-box p {
1627
    margin-top: 5px;
1628
}
1629

    
1630
.error-report {
1631
    display: none;
1632
}
1633

    
1634
#error-success .error-report {
1635
    position: absolute;
1636
    top: 140px;
1637
    right: 40px;
1638
}
1639

    
1640
.error .error-report {
1641
    display: block;
1642
}
1643

    
1644
#error-success .error-report .errormsg {
1645
    display: none;
1646
}
1647

    
1648
#error-success .error-report .success {
1649
    display: none;
1650
}
1651

    
1652
#error-success .error-report .sending {
1653
    display: none;
1654
}
1655

    
1656
#error-success .error-report .send-btn {
1657
    color: #4085A5;
1658
    text-decoration: underline;
1659
    cursor: pointer;
1660
}
1661

    
1662
#error-success strong, .notification-box strong {
1663
    color: #F49C1A;
1664
}
1665

    
1666
#error-success .close, .notification-box .close {
1667
    background-image: url("./close-popup.png");
1668
    background-repeat: no-repeat;
1669
    cursor: pointer;
1670
    height: 13px;
1671
    position: absolute;
1672
    right: 7px;
1673
    top: 9px;
1674
    width: 13px;
1675
}
1676

    
1677
.popup-header-error {
1678
    background-color: #800000 !important;
1679
}
1680

    
1681
.popup-border-error {
1682
    border-color: #800000 !important;
1683
    width:auto;
1684
}
1685

    
1686
.popup-details-error {
1687
    border: none !important;
1688
}
1689

    
1690
.popup-separator-error {
1691
    margin-bottom: 5px !important;
1692
}
1693

    
1694
#error-success .popup-header, .notification-box .popup-header {
1695
    background-color: #4085A5;
1696
    color: white;
1697
    font-size: 95%;
1698
    font-weight: normal;
1699
    height: 20px;
1700
    margin-left: -16px;
1701
    margin-top: -16px;
1702
    padding-bottom: 2px;
1703
    padding-left: 30px;
1704
    padding-top: 10px;
1705
    width: 482px;
1706
    margin-right:-16px;
1707
}
1708

    
1709

    
1710
#error-success.success h3 span.header-box, .notification-box h3 span.header-box {
1711
    background-color: #71c837;
1712
    display: block;
1713
    background-image: url("./save-green.png");
1714
    background-position: right 0;
1715
    background-repeat: no-repeat;
1716
    width: 80px;
1717
    padding: 3px 3px 3px 8px;
1718
    margin-top: -6px;
1719
    font-size: 90% !important;
1720
    margin-left: -11px;
1721
}
1722

    
1723
#error-success .popup-body, .notification-box .popup-body {
1724
    background: url("./popup-bg.png") repeat-x scroll 0 0 transparent;
1725
    margin-left: -16px;
1726
    margin-right: -16px;
1727
    margin-top: 1px;
1728
    min-height: 142px;
1729
    padding-top: 10px;
1730
}
1731

    
1732
#error-success .popup-body-inner, .notification-box .popup-body-inner {
1733
    background: url("./popup-inner-bg.png") repeat-x scroll 0 0 transparent;
1734
    font-size: 80%;
1735
    min-height: 120px;
1736
    margin-left: 20px;
1737
    padding-left: 15px;
1738
    width: 460px;
1739
}
1740

    
1741
#error-success .popup-separator, .notification-box .popup-seperator {
1742
    background-color: #74AEC9;
1743
    height: 1px;
1744
    font-size:1%;
1745
    width: 442px;
1746
    margin-bottom: 30px;
1747
}
1748

    
1749
#error-success .machine-now-building {
1750
    font-size: 95%;
1751
    padding-bottom: 7px;
1752
    padding-top: 10px;
1753
}
1754

    
1755
#error-success.success .machine-now-building {
1756
    padding-bottom: 14px !important;
1757
}
1758

    
1759
#error-success .password-container, .notification-box .password-container {
1760
    width: 430px;
1761
    padding: 5px;
1762
    border: 2px solid #75b54a;
1763
    background-color: #aade87;
1764
}
1765

    
1766
#error-success .password-header, .notification-box .password-header {
1767
    margin-bottom: 5px;
1768
}
1769

    
1770
#error-success .password, .notification-box .password {
1771
    color: #447821;
1772
}
1773

    
1774
#error-success .popup-details, .notification-box .popup-details {
1775
    border: 2px solid #FF7F2A;
1776
    float: left;
1777
    margin-left: 10px;
1778
    padding: 2px;
1779
}
1780

    
1781
#error-success.success .popup-details, .notification-box .popup-details {
1782
    border: none !important;
1783
    float: none !important;
1784
    margin-left: none !important;
1785
    margin-top: 10px;
1786
}
1787

    
1788
#error-success.success .popup-separator, .notification-box .popup-seperator {
1789
    margin-bottom: 14px !important;
1790
}
1791

    
1792
#error-success .write-password, .notification-box .write-password {
1793
    margin-bottom: 5px;
1794
    padding-left: 30px;
1795
}
1796

    
1797
#error-success .write-password-password, .notification-box .write-password-password {
1798
    padding-left: 30px;
1799
    color: #447821;
1800
    display: inline;
1801
    font-size: 110%;
1802
    font-weight: bold;
1803
}
1804

    
1805
#error-success .write-password-details, .notification-box .write-password-details {
1806
    font-size: 75%;
1807
}
1808

    
1809
.more-details {
1810
    display: block;
1811
}
1812

    
1813
.notification-box h3 span.header-box {
1814
    background: transparent;
1815
}
1816

    
1817
.notification-box .machine-now-building {
1818
    padding: 20px 0;
1819
}
1820

    
1821
.notification-box .header-box {
1822
    width: auto !important;
1823
}
1824

    
1825
.notification-box .password {
1826
    text-align: center;
1827
}
1828
.notification-box .password a:hover {
1829
    background-color: #447821;
1830
    color: #fff;
1831
}
1832

    
1833
.notification-box .password a {
1834
    padding: 0.2em;
1835
    text-align: center;
1836
    color: #447821;
1837
    font-weight: bold;
1838
    font-size: 1.2em;
1839
    text-decoration: none;
1840
}
1841

    
1842
.popup-details a:link, .popup-details a:visited{
1843
    color: black;
1844
}
1845

    
1846
/* Confirmation boxes */
1847
div.confirm_single, div.confirm_multiple, div.action_error {
1848
    display: none;
1849
    color: black;
1850
}
1851

    
1852
div.confirm_single button, div.confirm_multiple button, div.action_error button {
1853
    font-size: 100%;
1854
    cursor: pointer;
1855
    color: black;
1856
    height: 20px !important;
1857
}
1858

    
1859
div.confirm_single button {
1860
    border: none;
1861
    font-family: Arial, Helvetica, sans-serif;
1862
    line-height: 1em;
1863
    vertical-align: middle;
1864
    padding: 2px 6px;
1865
    padding-bottom:4px;
1866
    height: 15px;
1867
}
1868

    
1869
div.confirm_single button.yes {
1870
    width: 90px;
1871
    background-color:#FF7F2A;
1872
}
1873

    
1874
div.confirm_single button.yes:hover {
1875
    background-color: #FF9955;
1876
}
1877

    
1878
div.confirm_single button.no {
1879
    width: 20px;
1880
    margin-left:-5px;
1881
    background-color: #FF9955;
1882
    color:#d95d0a;
1883
}
1884

    
1885
div.confirm_single button.no:hover {
1886
    color: white;
1887
}
1888

    
1889
div.confirm_multiple_cont {
1890
    background-color: #406A7D;
1891
    margin-top: 0px;
1892
    padding: 3px;
1893
    border-top: 1px solid #444;
1894
    border-bottom: 1px solid #444;
1895
    padding-top:0px;
1896
    margin-top: -1px;
1897
}
1898

    
1899
div.confirm_reboot_required {
1900
}
1901

    
1902
div.confirm_multiple {
1903
    font-size: 65%;
1904
    z-index: 8000;
1905
    /*height: 28px;*/
1906
    width: 700px;
1907
    margin-top: 15px;
1908
}
1909

    
1910
div.confirm_multiple p {
1911
    float: left;
1912
    color: #FFF;
1913
    font-weight: bold;
1914
    margin: 7px 0 0 10px;
1915
}
1916

    
1917
#networks-pane {
1918
    display: none;
1919
}
1920

    
1921
#networks-pane div.confirm_multiple p {
1922
    margin: 7px 0 0 100px;
1923
}
1924

    
1925
div.confirm_multiple button {
1926
    float: right;
1927
    background-color: transparent;
1928
    border: 1px solid #5CA1C0;
1929
    margin: 4px 5px 0 0;
1930
}
1931

    
1932
div.confirm_multiple button.yes {
1933
    border-color: #FF7F2A;
1934
    padding: 0 12px;
1935
}
1936

    
1937
div.confirm_multiple button.yes:hover {
1938
    background-color: #FF7F2A;
1939
}
1940

    
1941
div.confirm_multiple button.no {
1942
    padding: 0px 16px;
1943
}
1944

    
1945
div.confirm_multiple button.no:hover {
1946
    background-color: #5CA1C0;
1947
}
1948

    
1949
div.action_error {
1950
    width: 120px;
1951
    margin: 14px 0 0 37px;
1952
    background-color: #981D1D;
1953
    font-size: 75%;
1954
    z-index:1;
1955
    color: #FFF;
1956
    position:absolute;
1957
    top: 0px;
1958
}
1959

    
1960
div.action_error .action-error-msg {
1961
    background-color: #fff;
1962
    color: #981D1D;
1963
    border: 1px solid #981D1D;
1964
    padding: 4px;
1965
}
1966
div.action_error .action-error-msg .action {
1967
    font-weight: bold;
1968
}
1969

    
1970
div.action_error .action-error-msg {
1971
    font-size: 0.8em;
1972
}
1973

    
1974
.action_error button {
1975
    width: 75px;
1976
    background-color: transparent;
1977
    border: 1px solid;
1978
    border-color: #981D1D;
1979
    color: #fff !important;
1980
    float: left;
1981
}
1982

    
1983
div.action_error button.details {
1984
    padding-right: 5px;
1985
    width: 100px;
1986
    border-bottom: 2px solid #981D1D;
1987
    border-right: 1px solid #981D1D;
1988
    border-left: 2px solid #981D1D;
1989
    background-color: #E24B4B;
1990
}
1991

    
1992
div.action_error button.close-action-error {
1993
    background-image: url("./option-action-remove.png");
1994
    background-color: #fff;
1995
    background-repeat: no-repeat;
1996
    background-position: center center;
1997
    width: 20px;
1998
    border-bottom: 2px solid #981D1D;
1999
    border-right: 2px solid #981D1D;
2000
    border-top: 1px solid #981D1D;
2001
}
2002

    
2003
div.action_error button.details:hover {
2004
    background-color: #FF7F2A;
2005
}
2006

    
2007
div#aboutuser{
2008
    float:right;
2009
    clear: both;
2010
    color: #FFFFFF;
2011
    font-size: 75%;
2012
    margin-top: -25px;
2013
}
2014

    
2015
div#user{
2016
    clear: both;
2017
    color: #FFFFFF;
2018
    font-size: 75%;
2019
    margin-top: 38px;
2020
    padding-bottom: 10px;
2021
    z-index: 500;
2022
    position: absolute;
2023
    right:0;
2024
}
2025

    
2026
div#user a{
2027
    color: #FFFFFF;
2028
    text-decoration: none;
2029
}
2030

    
2031
div#user a.current_lang {
2032
    color: #72ADC8;
2033
}
2034

    
2035
div#user .usermenu {
2036
    float: left;
2037
    cursor: pointer;
2038
    overflow: hidden;
2039
    padding-top: 5px;
2040
    margin-top: -5px;
2041
    position: relative;
2042
}
2043

    
2044
div#user .username {
2045
    display: block;
2046
    margin-right: 10px;
2047
    padding-right: 18px;
2048
    padding-left: 4em;
2049
    height: 20px;
2050
    background: url("./down-arrow-light.png") no-repeat right;
2051
    background-position: right 6px;
2052
    font-weight: normal;
2053
}
2054

    
2055
div#user .hovered {
2056
    background: #599EBD;
2057
    overflow: visible;
2058
    border-bottom: 1px solid #C7DFE9;
2059
}
2060

    
2061
div#user .hovered .username {
2062
    background-image: url("./down-arrow-lighter.png");
2063
}
2064

    
2065
div#user .active {
2066
    background-color: #BED5E0 !important;
2067
}
2068

    
2069
div#user .active .username {
2070
    color: #599EBD;
2071
    background-image: url("./down-arrow-lighter.png");
2072
}
2073

    
2074
div#user .useractions {
2075
    display: none;
2076
}
2077

    
2078
div#user .active .useractions {
2079
    display: block;
2080
    text-align: right;
2081
    color: #4085A5;
2082
    background-color: #D0E3ED;
2083
    margin-top:-1px;
2084
    border-top:1px solid #fff;
2085
    position: relative;
2086
    top: 1px;
2087
    box-shadow: 1px 1px 1px #aaa;
2088
    -moz-box-shadow: 1px 1px 1px #aaa;
2089
    -webkit-box-shadow: 1px 1px 1px #aaa;
2090
    z-index: 2000;
2091
}
2092

    
2093
div#user .useractions li {
2094
    padding: 2px 10px;
2095
    border-bottom: 1px solid #efefef;
2096
    text-align: right;
2097
    display: block;
2098
    background-color: transparent;
2099
}
2100

    
2101
div#user .useractions li a {
2102
    color: #4085A5;
2103
    display: inline-block;
2104
    padding:5px 0;
2105
    padding-left: 30px;
2106
    padding-bottom: 6px;
2107
    background-repeat: no-repeat;
2108
    background-position: center left;
2109
}
2110

    
2111
div#user .useractions li.hovered {
2112
    background-color: #E1EFF6;
2113
}
2114

    
2115
div#user .useractions li.last {
2116
    border-bottom: none;
2117
}
2118

    
2119
div#user .useractions .logout a {
2120
    background-image: url("./icon-logout.png");
2121
}
2122

    
2123
div#user .langmenu {
2124
    float: left;
2125
    border-left: 1px solid #ffffff;
2126
    padding-left: 10px;
2127
    margin-left: -1px;
2128
}
2129

    
2130
div#user .langmenu .sep {
2131
    display: inline-block;
2132
    color: #72ADC8;
2133
}
2134

    
2135
.separator {
2136
    background-color: #74AEC9;
2137
    height: 10px;
2138
    width: 700px;
2139
    font-size: 1px;
2140
    line-height: 0px;
2141
}
2142

    
2143
#disks.separator {
2144
    background-color: #dea842;
2145
}
2146

    
2147
#networks.separator {
2148
    background-color: #6c535d;
2149
}
2150

    
2151
.network-machine h5 {
2152
    margin-bottom: 26px;
2153
    margin-top:0px;
2154
}
2155

    
2156
.machine-container .separator {
2157
    width: 508px;
2158
    height: 1px;
2159
    margin-top: 2px;
2160
    background-color: #5CA1C0;
2161
    margin-left: 13px;
2162
}
2163

    
2164
.editbuttons {
2165
    display: block;
2166
    clear: none;
2167
    width: 40px;
2168
    margin-right: 0px;
2169
    padding-top: 2px;
2170
    float: right;
2171
    cursor: pointer;
2172
    position: relative;
2173
    z-index: 1000;
2174
}
2175

    
2176
div.editbuttons div.save:hover, div.editbuttons div.cancel:hover {
2177
    background-color: #84b7d0;
2178
}
2179

    
2180
div.editbuttons div.cancel:hover {
2181
    background-image: url("./cancel-onhover.png");
2182
}
2183

    
2184
.editbuttons .cancel, .editbuttons .save {
2185
    background-repeat: no-repeat;
2186
    color: transparent;
2187
    height: 16px;
2188
    width: 16px;
2189
    float: left;
2190
}
2191

    
2192
.editbuttons .cancel {
2193
    background-image: url("./cancel.png");
2194
    margin-left: 3px;
2195
}
2196

    
2197
.editbuttons .save {
2198
    background-image: url("./save.png");
2199
    margin-left: 1px;
2200
}
2201

    
2202
.editbuttons img {
2203
    float:none !important;
2204
    margin: 0px !important;
2205
}
2206

    
2207
.network .namecontainer {
2208
    font-size: 1.1em;
2209
}
2210
.network .machine-name-div .namecontainer {
2211
    font-size: 1em;
2212
    font-weight: bold;
2213
}
2214

    
2215

    
2216
.namecontainer .name {
2217
    position: relative;
2218
}
2219

    
2220
.namecontainer .name .nametextbox, .network-rename-input {
2221
    z-index: 1000;
2222
}
2223

    
2224
.nametextbox, .network-rename-input {
2225
    font-size: 65%;
2226
    width: 240px;
2227
}
2228

    
2229
.large-spinner {
2230
    background: url("./icons/indicators/large/progress.gif");
2231
    margin-left: 298px;
2232
    margin-top: 0px;
2233
    height: 31px;
2234
    width: 49px;
2235
    position: absolute;
2236
    top: 200px;
2237
}
2238

    
2239
#machinesview-icon .large-spinner {
2240
    top: 170px;
2241
}
2242

    
2243
.list .large-spinner {
2244
    margin-top:-30px;
2245
}
2246

    
2247
.single .large-spinner {
2248
    margin-top: 50px;
2249
}
2250

    
2251
div#networks-container {
2252
    display: none;
2253
}
2254

    
2255
div#networks-container .large-spinner {
2256
    margin-top: 50px;
2257
}
2258

    
2259
/* tables in list view */
2260
div.list div.dataTables_filter {
2261
    font-size: 75%;
2262
    margin-bottom: 12px;
2263
}
2264

    
2265
div.list div.dataTables_filter input{
2266
    font-size: 100%;
2267
}
2268

    
2269
.dataTables_wrapper {
2270
    width: 515px;
2271
    padding-bottom: 40px;
2272
}
2273

    
2274
div.list table thead .sorting, div.list table thead .sorting_desc, div.list table thead .sorting_asc {
2275
    padding-right: 15px !important;
2276
}
2277

    
2278
div.list table {
2279
    width: 515px;
2280
    font-size: 75%;
2281
}
2282

    
2283
div.list table tbody td {
2284
    color: #3D3D3D;
2285
    padding:6px;
2286
    vertical-align: middle;
2287
    height: 20px;
2288
}
2289

    
2290
div.list table thead tr {
2291
    border-bottom: 1px solid #aaa;
2292
}
2293
div.list table thead tr th {
2294
    background-color: #CDE2EC;
2295
    background-image: url(bg.gif);
2296
    background-repeat: no-repeat;
2297
    background-position: right 11px;
2298
    font-weight: normal;
2299
    border: 1px solid transparent;
2300
    border-bottom: none;
2301
    padding: 4px;
2302
    text-align: left;
2303
    vertical-align: middle;
2304
    cursor: pointer;
2305
}
2306

    
2307
div.list table thead .sorting_asc, div.list table thead .sorting_desc {
2308
    background-color: #5CA1C0;
2309
}
2310

    
2311
div.list table thead .sorting_asc {
2312
    background-image: url(asc.gif);
2313
}
2314

    
2315
div.list table thead .sorting_desc {
2316
    background-image: url(desc.gif);
2317
}
2318

    
2319
div.list table .selection div.expand-icon {
2320
    background-image: url(asc.gif);
2321
    background-repeat: no-repeat;
2322
    position: relative;
2323
    cursor: pointer;
2324
    width: 15px;
2325
    height: 4px;
2326
    left: 19px;
2327
    top: -11px;
2328
}
2329

    
2330
ul.dropdown-selector {
2331
    background-color: #E6EEEE;
2332
    position: absolute;
2333
    margin-left: 1px;
2334
    display: block;
2335
    top: 255px;
2336
    font-size:75%;
2337
    width:40px;
2338
}
2339

    
2340
ul.dropdown-selector li {
2341
    padding: 4px;
2342
}
2343

    
2344
ul.dropdown-selector li:hover {
2345
    background-color: #5CA1C0;
2346
}
2347

    
2348
ul.dropdown-selector li a{
2349
    color: black;
2350
    text-decoration: none;
2351
}
2352

    
2353
div.list table span.imagetag {
2354
    display: none;
2355
}
2356

    
2357
div.list table thead .vmos {
2358
    width: 20px !important;
2359
    vertical-align:middle;
2360
}
2361

    
2362
div.list table .selection {
2363
    width: 20px !important;
2364
    text-align: left;
2365
    background-image: none;
2366
    padding-left: 6px;
2367
}
2368

    
2369
div.list table thead .vmflavor {
2370
    width: 100px !important;
2371
}
2372

    
2373
/* group column commented out for v0.5
2374
div.list table thead .vmgroup {
2375
    width: 40px !important;
2376
}
2377
*/
2378

    
2379
div.list table thead .vmstatus {
2380
    width: 50px !important;
2381
}
2382

    
2383
div.list table thead .vmname {
2384
    width: 110px !important;
2385
}
2386

    
2387
.spinner, .action-indicator {
2388
    clear: right;
2389
    float:right;
2390
    margin: 10px 6px 0 15px;
2391
}
2392

    
2393
.icon .spinner {
2394
    margin: 20px 4px 0 15px !important;
2395
}
2396

    
2397
.single .state .spinner {
2398
    margin: 20px 55px 0 15px !important;
2399
}
2400

    
2401
.action-indicator {
2402
    margin-right: 18px;
2403
}
2404

    
2405
.list span.action-indicator {
2406
    display: block;
2407
    width: 15px;
2408
    height: 20px;
2409
    margin: 0 !important;
2410
    float: none;
2411
}
2412

    
2413
.wave {
2414
    clear: right;
2415
    float:right !important;
2416
    margin: 10px 15px 0 15px !important;
2417
}
2418

    
2419
#networks-pane .spinner {
2420
    margin-top: 18px !important;
2421
}
2422

    
2423
.hidden {
2424
    display:none;
2425
}
2426

    
2427
div.actions a.selected, div.actions a.selected:hover, div.machine-actions a.selected, div.machine-actions a.selected:hover {
2428
    display:block !important;
2429
}
2430

    
2431
.action_error .message, .action_error .code {
2432
    display: none;
2433
}
2434

    
2435
.fixed {
2436
    bottom: 0;
2437
    position: fixed !important;
2438
}
2439

    
2440
/* Networks */
2441
#networks-pane {
2442
    background-color: transparent;
2443
    color: black;
2444
}
2445

    
2446
#networkscreate {
2447
}
2448

    
2449
.createbutton {
2450
    color: black;
2451
    background-color: #FF7F2A;
2452
    cursor: pointer;
2453
    padding: 7px 24px;
2454
    text-decoration: none;
2455
    border-left: 15px solid #FF9955;
2456
    margin-left: -15px;
2457
}
2458

    
2459
#networkscreate:hover {
2460
    background-color: #FF9955;
2461
}
2462

    
2463
#createcontainer {
2464
}
2465

    
2466
#networks-container {
2467
}
2468

    
2469
#networks-pane .public-networks {
2470
    background: #EFF7FA repeat scroll 0 0;
2471
    margin: 0 0 0px;
2472
    padding: 0 0 15px 0px;
2473
}
2474

    
2475
#networks-pane .private-networks .network:last-child {
2476
    border-bottom: none;
2477
}
2478

    
2479
#networks-pane .private-networks {
2480
    background: #EFF7FA repeat scroll 0 0;
2481
    padding: 15px 20px 20px 0px;
2482
    margin-top: 18px;
2483
}
2484

    
2485
.private-networks .network-cont:last-child {
2486
    border-bottom: none;
2487
}
2488

    
2489
.private-networks .network-cont {
2490
    border-bottom: 1px solid #D1E7F0;
2491
    padding-bottom:5px;
2492
    margin-bottom: 5px;
2493
    width: 520px;
2494
}
2495

    
2496
.private-networks .network {
2497
    padding-top: 10px;
2498
    padding-bottom: 10px;
2499
}
2500

    
2501
#public-template, #private-template, #public-machine-template, #private-machine-template {
2502
    display:none;
2503
}
2504

    
2505
div.network a.action-network-add {
2506
    display: none;
2507
}
2508

    
2509
div.network a.action-network-destroy {
2510
    margin-top: 32px !important;
2511
    width: 50px;
2512
    display: none;
2513
}
2514

    
2515
div.network {
2516
    clear: both;
2517
    padding: 5px 20px 5px 20px;
2518
    width: 480px;
2519
    position: relative;
2520
}
2521

    
2522
#private-template {
2523
    margin: 2px 0 0 -30px;
2524
}
2525

    
2526
div.network-placeholder {
2527
    margin-left: 33px;
2528
}
2529

    
2530
div.private-networks div.network-placeholder {
2531
}
2532

    
2533
div.network-cable {
2534
    border-left: 3px solid #FF7F2A;
2535
    float: left;
2536
    margin-left: -40px;
2537
    margin-top: -45px;
2538
    height: 185px;
2539
    overflow: hidden;
2540
}
2541

    
2542
.first div.network-cable {
2543
    height:143px;
2544
    margin-top:-6px;
2545
    position: relative;
2546
}
2547

    
2548
div.network-contents div.machines-list div.first {
2549
    margin-top:0;
2550
}
2551

    
2552
.last div.network-cable {
2553
    height:85px;
2554
}
2555

    
2556
div.firewall-cable {
2557
    border-left: 3px solid #FF7F2A;
2558
    float: left;
2559
    margin-left: -100px;
2560
    margin-top: -20px;
2561
    height: 110px;
2562
}
2563

    
2564
.last div.firewall-cable {
2565
    display:none;
2566
}
2567

    
2568
div.network a:hover {
2569
    text-decoration: underline;
2570
    cursor: pointer;
2571
}
2572

    
2573
#networks-container .name {
2574
    font-size: 75%;
2575
}
2576

    
2577
div.network-machines, div.firewall {
2578
    font-size: 75%;
2579
    margin-left: 70px;
2580
}
2581

    
2582
div.firewall {
2583
    margin-left: 60px;
2584
    margin-bottom: 3px;
2585
    margin-top: -3px;
2586
}
2587

    
2588
div.machines-header, div.firewall-header {
2589
    background-color: #A1C8DB;
2590
    color: white;
2591
    cursor: pointer;
2592
    height: 17px;
2593
    width: 103px;
2594
}
2595

    
2596
 div.private-networks div.machines-header {
2597
    margin-top: -5px;
2598
}
2599

    
2600
div.network:hover div.machines-header, div.network:hover div.firewall-header {
2601
    background-color: #84b7d0;
2602
}
2603

    
2604
div.network-machine:hover div.firewall-header {
2605
    background-color: #5CA1C0;
2606
}
2607

    
2608
div.firewall-label.darker {
2609
    background-color: #4085a5;
2610
}
2611

    
2612
.state {
2613
}
2614

    
2615
.network .state {
2616
    font-size: 75%;
2617
    position: absolute;
2618
    right: 10px;
2619
    top: 5px;
2620
}
2621

    
2622
div.network div.actions {
2623
    float: right;
2624
    font-size: 75%;
2625
    font-weight: normal;
2626
    height: 70px;
2627
    width: 100px;
2628
    position: absolute;
2629
    right: -100px;
2630
    top: 0;
2631
}
2632

    
2633
div.network div.machine-actions {
2634
    text-decoration: none;
2635
    float: right;
2636
    margin: -17px -180px 0 0;
2637
    font-weight: normal;
2638
    font-size: 75%;
2639
}
2640

    
2641
div.network div.actions a, div.network div.machine-actions a {
2642
    text-decoration: none;
2643
    height: 15px;
2644
    color: black;
2645
    visibility: hidden;
2646
    display: block;
2647
}
2648

    
2649

    
2650
div.network div.machine-actions a {
2651
    margin: 8px 0 0 8px;
2652
}
2653
div.network div.net-actions a {
2654
    margin: 0 0 8px 8px;
2655
    width: 168px;
2656
}
2657
div.network div.action-container {
2658
    bottom: auto;
2659
}
2660

    
2661
div.network div.net-actions .confirm_single {
2662
    position: absolute;
2663
    left: 96px;
2664
    width: 200px;
2665
    margin: 0 0px -5px 0;
2666
    font-size: 100%;
2667
}
2668

    
2669
div.network div.actions a:hover, div.network div.machine-actions a:hover {
2670
    display: block;
2671
    background-color:#A1C8DB;
2672
    opacity: 0.8;
2673
    filter: alpha(opacity = 80);
2674
}
2675

    
2676
div.network.expand .net-actions a {
2677
    visibility: visible;
2678
}
2679

    
2680
div.network:hover div.actions a, div.network-machine:hover div.machine-actions a {
2681
    visibility: visible;
2682
}
2683

    
2684
div.network div.actions a.selected:hover, div.network div.machine-actions a.selected {
2685
    background-color: transparent !important;
2686
    visibility: visible!important;
2687
}
2688

    
2689
div.network .net-vm-actions .confirm_single {
2690
    font-size: 100% !important;
2691
    margin-right: -20px !important;
2692
    position: absolute !important;
2693
    top: 7px;
2694
    right:0;
2695
}
2696

    
2697
div.network div.display a {
2698
    visibility: visible;
2699
}
2700

    
2701
div.network-machine div.machine-actions a.action-details {
2702
    margin-top: 7px;
2703
    width: 168px;
2704
}
2705

    
2706
div.network .net-actions {
2707
    margin-right:5px !important;
2708
    margin-top:0px !important;
2709
    height: 80px !important;
2710
}
2711

    
2712
div.network .net-actions .action-container.destroy {
2713
    position: relative;
2714
    bottom: auto;
2715
}
2716

    
2717
div.network:hover {
2718
    background-color: #A1C8DB !important;
2719
}
2720

    
2721
.network-logos {
2722
    float:left;
2723
    padding-right: 10px;
2724
}
2725

    
2726
.network-logos:hover {
2727
    cursor: pointer;
2728
}
2729

    
2730
.state div {
2731
    text-align: right;
2732
    margin: 4px 1px -4px;
2733
}
2734

    
2735
.public-networks .state div {
2736
    margin-top: 4px;
2737
}
2738

    
2739
.private-networks .state div {
2740
    margin-top: 9px;
2741
    margin-bottom: -12px;
2742
}
2743

    
2744
.network .name-div {
2745
    margin-bottom: 15px;
2746
    margin-top: 0px;
2747
}
2748

    
2749
div.indicator {
2750
    clear: none;
2751
    float: right;
2752
    height: 11px;
2753
    margin: 3px -1px;
2754
    width: 10px;
2755
}
2756

    
2757
#private-networks {
2758
    margin-top: 20px;
2759
}
2760

    
2761
.private-networks .editbuttons {
2762
    margin-right: 117px;
2763
    margin-top: 1px;
2764
}
2765

    
2766
.private-networks div.confirm_single {
2767
    margin: 45px -219px -5px 0;
2768
    font-size: 80%;
2769
}
2770

    
2771
.private-networks .network-machine div.confirm_single {
2772
    margin: 0 -199px 0 0;
2773
}
2774

    
2775
.private-networks .state {
2776
}
2777

    
2778
.private-networks div.machines-list {
2779
    padding-top: 3px;
2780
}
2781

    
2782
span.rename-network, span.configure {
2783
    background-repeat: no-repeat;
2784
    color: transparent;
2785
    font-size: 75%;
2786
    font-weight: normal;
2787
    margin-left: 10px;
2788
    padding-left: 10px;
2789
    text-align: left;
2790
}
2791

    
2792
span.rename-network {
2793
    cursor: pointer;
2794
}
2795

    
2796
div.name-div:hover span.rename-network {
2797
    color: #3D3D3D;
2798
    margin-top: 0.4em;
2799
    background-image: url(./pencil.png);
2800
    background-position: 0 3px;
2801
}
2802

    
2803
div.network:hover a.rename {
2804
    color: #3d3d3d;
2805
}
2806

    
2807
.network-separator {
2808
    background-color: #5CA1C0;
2809
    height: 1px;
2810
    margin: 2px 0 0 -5px;
2811
    width: 480px;
2812
    font-size: 1%;
2813
    line-height: 1px;
2814
}
2815

    
2816
.network-contents {
2817
    margin-left: -4px;
2818
    width: 504px;
2819
    clear: both;
2820
    background: url("./orange-border.png") no-repeat;
2821
    background-position: 33px bottom;
2822
}
2823
.network-contents.last-expanded {
2824
    background-position-y: -2600px;
2825
}
2826

    
2827
.network-machine {
2828
    border-bottom: 1px solid #5CA1C0;
2829
}
2830
.network-machine:last-child {
2831
    border-bottom: none;
2832
}
2833

    
2834
.network-machine .state div {
2835
    text-align: left;
2836
}
2837

    
2838
.network-machine {
2839
    margin-left: 35px;
2840
    padding-bottom: 10px;
2841
    padding-left: 5px;
2842
    padding-top: 10px;
2843
    position: relative;
2844
}
2845

    
2846
.network-machine .ips {
2847
    position: absolute;
2848
    right:0;
2849
    top:40px;
2850
    text-align: right;
2851
    padding-right: 10px;
2852
    font-size: 70%;
2853
}
2854

    
2855
.network-machine .logo {
2856
    float:left;
2857
    padding-right: 10px;
2858
    position:relative;
2859
}
2860

    
2861
#networks-container .machine-name {
2862
    text-decoration: none !important;
2863
    margin-bottom: 10px;
2864
    color: #000000;
2865
    margin-top: -4px;
2866
}
2867

    
2868
.private-networks .separator {
2869
    background-color: #5CA1C0;
2870
    height: 1px;
2871
    margin: 3px 0 -2px -10px;
2872
    width: 485px;
2873
}
2874

    
2875
.network-machine .state {
2876
    margin-right: 18px;
2877
}
2878

    
2879
.network-machine .state .status {
2880
    margin-bottom: 4px;
2881
}
2882

    
2883
.machine-name .name {
2884
}
2885

    
2886
.machine-name .namecontainer {
2887
    line-height: 18px;
2888
    margin-bottom: 20px;
2889
}
2890

    
2891
div.network-machine:hover {
2892
    background-color: #84B7D0;
2893
}
2894

    
2895
.machines {
2896
    width: 416px;
2897
    margin-bottom: -8px;
2898
    margin-top: 10px;
2899
}
2900

    
2901
div.empty-network-slot {
2902
    height: 60px;
2903
}
2904

    
2905
div.network-remove-machine, div.network-add-machine {
2906
    background-color: #FB822F;
2907
    color: #bc4b00;
2908
    width:90px;
2909
    height:18px;
2910
    float:left;
2911
    margin:40px 0 0 -100px;
2912
}
2913

    
2914
span.remove-icon {
2915
    font-size: 80%;
2916
    margin-left: 15px;
2917
    position: relative;
2918
    bottom:1px;
2919
}
2920

    
2921
div.add-icon {
2922
    margin-left: 15px;
2923
    margin-top: -1px;
2924
    cursor: pointer;
2925
}
2926

    
2927
span.remove-icon:hover, span.add-icon:hover {
2928
    cursor:pointer;
2929
    color: #fff;
2930
}
2931

    
2932
div.network-add-machine {
2933
    margin:43px 0 0 0px;
2934
}
2935

    
2936
.firewall-on {
2937
    color: #42E342;
2938
}
2939

    
2940
.firewall-off {
2941
    color: #F82E2E;
2942
}
2943

    
2944
.firewall-content {
2945
    color: black;
2946
    font-size: 60%;
2947
    margin-left: 60px;
2948
    height: 55px;
2949
    margin-bottom: 17px;
2950
}
2951

    
2952
.firewall-content .checkbox-legends {
2953
    cursor: pointer;
2954
}
2955

    
2956
.firewall-content .checkbox-legends.current {
2957
    font-weight: bold;
2958
}
2959

    
2960
.firewall-content .checkbox-legends {
2961
    vertical-align: text-top;
2962
}
2963

    
2964
.checkbox-legends a {
2965
    color: black;
2966
    text-decoration: underline;
2967
    font-size: 100%;
2968
}
2969

    
2970
h5.machine-connect {
2971
    font-size: 75%;
2972
    margin-bottom: 3px;
2973
}
2974

    
2975
.machine-connect span {
2976
    text-decoration: underline;
2977
}
2978

    
2979
h5.machine-connect span:hover {
2980
    cursor: pointer;
2981
}
2982

    
2983
.firewall-apply {
2984
    background-color: #4085a5;
2985
    border: medium none;
2986
    float: right;
2987
    font-size: 105%;
2988
    height: 18px;
2989
    margin-right: 5px;
2990
    margin-top: 3px;
2991
    width: 75px;
2992
}
2993

    
2994
.firewall-apply:hover {
2995
    background-color:#5CA1C0;
2996
}
2997

    
2998
.name-div {
2999
    margin: -9px 0 30px 70px;
3000
}
3001

    
3002
.machine-name-div {
3003
    margin-bottom: 20px;
3004
    margin-left: 60px;
3005
}
3006

    
3007
div.reboot-dialog {
3008
    display: none;
3009
    color: black;
3010
    background-color: #4085A5;
3011
    font-size: 75%;
3012
    margin-top: 15px;
3013
    width: 698px;
3014
    z-index: 1;
3015
}
3016

    
3017
div#reboot-machine-template, div.reboot-machine-entry {
3018
    display: none;
3019
    padding: 0 0 10px 35px;
3020
    width: 300px;
3021
}
3022

    
3023
div.reboot-dialog p {
3024
    color: #FFFFFF;
3025
    padding: 10px 0 10px 10px;
3026
}
3027

    
3028
div.reboot-dialog button {
3029
    float:right;
3030
    border: 1px solid #FF7F2A;
3031
    background-color: transparent;
3032
    font-size:100%;
3033
}
3034

    
3035
div.reboot-dialog button:hover {
3036
    background-color: #FF7F2A;
3037
}
3038

    
3039
div.reboot-dialog button.reboot-all {
3040
    margin: -30px 35px 0 0;
3041
}
3042

    
3043
div.reboot-dialog button.reboot-single {
3044
    color: black;
3045
    margin-top: -20px;
3046
}
3047

    
3048
div.reboot-dialog div.code, div.reboot-dialog div.action, div.reboot-dialog div.message, div.reboot-dialog button.details {
3049
    display:none;
3050
}
3051

    
3052
div.reboot-dialog button.details {
3053
    border-color: #800000;
3054
    margin-top: -20px;
3055
}
3056

    
3057
div.reboot-dialog button.details:hover {
3058
    background-color: #800000;
3059
}
3060

    
3061
/* Metadata */
3062
.machine .info-content {
3063
    display: none;
3064
}
3065

    
3066
.metadata-container {
3067
    line-height: 12px;
3068
    height: 85px;
3069
    background-color: #84b7d0;
3070
}
3071

    
3072
.metadata-column {
3073
    border-right: 1px solid #5CA1C0;
3074
    color: black;
3075
    float: left;
3076
    font-size: 60%;
3077
    margin-top: 3px;
3078
    height: 70px;
3079
    padding-bottom: 5px;
3080
}
3081

    
3082
.vm-stats {
3083
    padding-left: 10px;
3084
    padding-right: 5px;
3085
    width: 220px;
3086
}
3087

    
3088
.vm-stats div.stat-content {
3089
    height: 18px;
3090
}
3091

    
3092
.vm-stats div.stat-content img {
3093
    margin: 0;
3094
}
3095

    
3096
.vm-stats div img.stat-busy {
3097
    margin-top: -7px;
3098
    margin-left: 90px;
3099
}
3100

    
3101
.vm-stats div.stat-content img.busy {
3102
    margin-left: 95px;
3103
}
3104

    
3105
.vm-stats div.stat-error {
3106
    display:none;
3107
}
3108

    
3109
div.stat-error {
3110
    color: #f00;
3111
}
3112

    
3113
.single div.stat-error {
3114
    text-align: center;
3115
    font-size: 0.8em;
3116
}
3117

    
3118
.metadata-column {
3119
    margin-top: 4px;
3120
}
3121

    
3122
.vm-details {
3123
    width: 130px;
3124
    margin-left:17px;
3125
}
3126

    
3127
.vm-details.metadata-column {
3128
    padding-top: 5px;
3129
    height: 65px;
3130
}
3131

    
3132
.vm-details .image-details {
3133
    margin-top: 8px;
3134
}
3135

    
3136
.vm-details .vm-detail {
3137
    display: block;
3138
}
3139

    
3140
.vm-details span.value {
3141
    color: #444;
3142
}
3143

    
3144
.single-container .lower .stat-busy {
3145
    margin-top: 10px;
3146
    margin-left: 325px;
3147
}
3148

    
3149
.vm-metadata {
3150
    padding-left: 10px;
3151
    width: 100px;
3152
    border: none;
3153
}
3154

    
3155
.metadata-left {
3156
}
3157

    
3158
.metadata-right {
3159
    width: 73px;
3160
    float:left;
3161
    height: 35px;
3162
    padding-left: 5px;
3163
    position:relative;
3164
    overflow:hidden;
3165
}
3166

    
3167
.metadata-right .items {
3168
    position:absolute;
3169
    height:20000em;
3170
}
3171

    
3172
.metadata-keys-container {
3173
    height: 60px;
3174
    float: left;
3175
}
3176

    
3177
.single .metadata-keys-container {
3178
    float: none;
3179
    height: auto;
3180
    margin-bottom: 5px;
3181
}
3182

    
3183
.single a.manage-metadata {
3184
    font-size: 80%;
3185
    margin-left:4px;
3186
    color: #383838;
3187
}
3188

    
3189
a.manage-metadata, a.stats-report {
3190
    font-size: 100%;
3191
    color: black;
3192
    margin-left:17px;
3193
    text-decoration: underline;
3194
}
3195

    
3196
a.stats-report {
3197
    margin: 15px 0  0 80px;
3198
}
3199

    
3200
div.machine a.manage-metadata:hover {
3201
    background-color: transparent;
3202
}
3203

    
3204
.single .metadata-actions, .single .metadata-keys-container .items {
3205
    padding-left: 5px;
3206
}
3207
.metadata-actions, .metadata-keys-container .items{
3208
    margin-top: 5px;
3209
}
3210

    
3211
.singe .metadata-actions, .single .metadata-keys-container .items{
3212
    font-size: 80%;
3213
    line-height: 12px;
3214
    width: 300px;
3215
}
3216

    
3217
.metadata-actions .prev,  .metadata-actions .next{
3218
    float:left;
3219
    width:29px;
3220
    height:6px;
3221
    cursor: pointer;
3222
}
3223

    
3224
.metadata-actions .prev {
3225
    background: url("./roll-up.png") no-repeat scroll 0 0 transparent;
3226
}
3227

    
3228
.metadata-actions .next {
3229
    background: url("./roll-down.png") no-repeat scroll 0 0 transparent;
3230
}
3231

    
3232
.scrollable {
3233
    position:relative;
3234
    overflow:hidden;
3235
    height: 35px;
3236
    width: 120px;
3237
    margin-bottom:2px;
3238
}
3239

    
3240
.scrollable .items {
3241
    position:absolute;
3242
    height:20000em;
3243
}
3244

    
3245
/* single view */
3246
.single {
3247
    color: #383838;
3248
}
3249

    
3250
.single .column1 {
3251
    float: left;
3252
    margin: 1px 0 25px 17px;
3253
    width: 140px;
3254
}
3255

    
3256
.single .column1 .state {
3257
    float: left;
3258
    margin-left: 4px;
3259
    padding-bottom: 6px;
3260
    padding-top: 3px;
3261
    position: relative;
3262
    right: 0;
3263
    text-align: center;
3264
    width: 126px;
3265
}
3266

    
3267
.single .column1 .state-label {
3268
    padding-top: 5px;
3269
}
3270

    
3271
.single .column1 .indicators {
3272
    margin-right: 38px !important;
3273
}
3274

    
3275
.single div.connect-arrow {
3276
    margin-left: -17px;
3277
}
3278

    
3279
.single div.connect-border {
3280
    margin-left: -29px;
3281
}
3282

    
3283
.single .single-actions {
3284
    width: 150px;
3285
    height: 60px;
3286
    margin-bottom: 45px;
3287
    margin-left: -10px;
3288
}
3289

    
3290
.single .vm-actions .action-container {
3291
    margin-bottom: 1px;
3292
}
3293

    
3294
.single .vm-actions .action-container .confirm_single {
3295
    right: -45px;
3296
}
3297

    
3298
.single .vm-actions .action-container.destroy .confirm_single {
3299
}
3300

    
3301
.single .vm-actions .action-container.destroy {
3302
    bottom: -20px;
3303
}
3304

    
3305
.single a.single-action {
3306
    text-decoration: none;
3307
    cursor: pointer;
3308
    display: block;
3309
}
3310

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

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

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

    
3327
.single .spinner, .single .action-indicator {
3328
    margin: 15px 45px 0 0px !important
3329
}
3330

    
3331
.single .action-indicator {
3332
    margin-right: 55px !important;
3333
}
3334

    
3335
.single .wave {
3336
    margin: 15px 53px 0 0px !important
3337
}
3338

    
3339
.icon div.action_error {
3340
    font-size: 100%;
3341
}
3342

    
3343
.single div.action_error {
3344
    position: absolute;
3345
    top: 29px;
3346
    right: 35px;
3347
}
3348

    
3349
.single .column2 {
3350
    background-color: #A1C8DB;
3351
    float: left;
3352
    font-size: 78%;
3353
    line-height: 17px;
3354
    margin: 0 0 10px 5px;
3355
    width: 358px;
3356
}
3357

    
3358
.single .column2 .machine-labels {
3359
    float: left;
3360
    font-size: 90%;
3361
    margin-left: 10px;
3362
    margin-top: 10px;
3363
    width: 125px;
3364
}
3365

    
3366
.single .machine-detail.title {
3367
    background-color: #74AEC9;
3368
    color: #fff;
3369
    padding: 4px 6px;
3370
    font-size: 0.8em;
3371
    width: 346px;
3372
    margin-left: 5px;
3373
    float: left;
3374
}
3375

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

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

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

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

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

    
3408
.single .tags-header .info-header{
3409
    padding-top:0;
3410
    padding-bottom:0;
3411
}
3412

    
3413
.single .tags-header {
3414
    font-size: 0.62em;
3415
    cursor: pointer;
3416
    float: left;
3417
    margin-bottom:5px;
3418
}
3419

    
3420
.single .tags-header span.label {
3421
    font-size: 104%;
3422
}
3423

    
3424
.single .tags-content {
3425
    background-color: #84B7D0;
3426
    clear: both;
3427
    height: auto;
3428
    padding-bottom: 5px;
3429
    padding-top: 5px;
3430
    width: 300px;
3431
}
3432

    
3433
.single .column3 {
3434
    background-color: #A1C8DB;
3435
    width: 150px;
3436
    overflow: visible;
3437
    padding-bottom: 10px;
3438
    position: absolute;
3439
    right: 20px;
3440
    top: 130px;
3441
}
3442

    
3443
.single .col3 {
3444
    float: right;
3445
    width: 150px;
3446
    margin-right: 15px;
3447
    margin-bottom: 15px;
3448
}
3449

    
3450
.single .column3 .controls {
3451
    font-size: 80%;
3452
    height: 20px;
3453
    padding-left: 7px;
3454
    padding-right: 7px;
3455
    padding-top: 8px;
3456
    padding-bottom: 5px;
3457
    border-bottom: 1px solid #84B7D0;
3458
}
3459

    
3460
.single .column3 .vm-control:hover {
3461
    background-color: #5CA1C0;
3462
}
3463

    
3464
.single .column3 .previous {
3465
    float:left;
3466
    width: 72px;
3467
}
3468

    
3469
.single .column3 .next {
3470
    float: right;
3471
    text-align: center;
3472
    width: 60px;
3473
}
3474

    
3475
.single .column3 .next-label {
3476
    float: right;
3477
    margin-right: 3px;
3478
    margin-top: -2px;
3479
}
3480

    
3481
.single .column3 .next-arrow {
3482
    float: right;
3483
    height: 18px;
3484
    width: 10px;
3485
    background: url("./right-arrow.png") no-repeat scroll 3px 2px transparent;
3486
}
3487

    
3488
.single .column3 .prev-label {
3489
    float: left;
3490
    margin-left: 3px;
3491
    margin-top: -2px;
3492
}
3493

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

    
3501
.single .column3 .separator {
3502
    width: 135px;
3503
    height: 1px;
3504
    background-color: #84B7D0;
3505
    margin: 0 0 0 7px;
3506
    clear: both;
3507
}
3508

    
3509
.single .column3 .servers {
3510
    font-size: 80%;
3511
    line-height: 15px;
3512
    padding-top: 10px;
3513
    text-align: right;
3514
    overflow: visible;
3515
    position: relative;
3516
}
3517

    
3518
.single .column3 .server-name {
3519
    margin-left: 10px;
3520
    padding-right: 5px;
3521
    cursor: pointer;
3522
    padding-bottom: 2px;
3523
}
3524
div.single div.column3 div.server-name:hover {
3525
    background-color: #5CA1C0;
3526
}
3527
.single .column3 .column3-selected {
3528
    background-color: #84B7D0;
3529
    color: white;
3530
    opacity: 0.8;
3531
    padding-left: 9px;
3532
    width: 160px;
3533
    filter: alpha(opacity = 80);
3534
    position: relative;
3535
    width: 126px;
3536
}
3537

    
3538
.single .toggler {
3539
    color: #FFFFFF;
3540
    float: right;
3541
    font-size: 140%;
3542
}
3543

    
3544
.single .cpu-usage, .single .network-usage {
3545
    text-align: center;
3546
    padding-top: 15px;
3547
    margin-bottom: 5px;
3548
    font-size: 90%;
3549
    font-weight: bold;
3550
}
3551

    
3552
.single .cpu-graph, .single .network-graph {
3553
    margin-left: 20px;
3554
    margin-bottom:30px;
3555
    width: 660px;
3556
}
3557

    
3558
.single div.lower img.stats {
3559
    margin-left: 82px;
3560
}
3561

    
3562
.single div.lower img.stats {
3563
    display: none;
3564
}
3565

    
3566
.single .single-image {
3567
    width: 126px;
3568
    height: 136px;
3569
    margin-bottom: 10px;
3570
    margin-left: 4px;
3571
    background-image: url("./icons/machines/large/unknown-sprite.png");
3572
    background-repeat: no-repeat;
3573
    cursor: pointer;
3574
}
3575

    
3576
.single .single-image-state1 {
3577
    background-position: 0px 0;
3578
}
3579

    
3580
.single .single-image-state3 {
3581
    background-position: -252px 0;
3582
}
3583

    
3584
.single .single-image-state4 {
3585
    background-position: -378px 0;
3586
}
3587

    
3588
.single .single-image-state2 {
3589
    background-position: -126px 0;
3590
}
3591

    
3592
.single .column3 .previous, .single .column3 .next {
3593
    cursor: pointer;
3594
    background-color: #84B7D0;
3595
    color: white;
3596
    font-size: 100%;
3597
    height: 15px;
3598
    padding-top: 2px;
3599
}
3600

    
3601
.single .column3 .disabled {
3602
    opacity: 0.5;
3603
    filter: alpha(opacity = 50);
3604
}
3605

    
3606
.single div.lower {
3607
    clear:both;
3608
    background: #EFF7FA repeat scroll 0 0;
3609
    width: 700px;
3610
    padding-bottom: 15px;
3611
}
3612

    
3613
.single div.upper {
3614
    background: transparent;
3615
    margin-bottom: 10px;
3616
    overflow: visible;
3617
    width: 700px;
3618
    background: #EFF7FA repeat scroll 0 0;
3619
}
3620

    
3621
/* console css */
3622
.console-header-logo {
3623
    padding-top: 17px;
3624
    margin-left: 30px;
3625
    position: fixed;
3626
}
3627

    
3628
#console-header div.help-text {
3629
    font-size: 75%;
3630
    font-weight:bold;
3631
    color:#FFFFFF;
3632
    float:left;
3633
    position: absolute;
3634
    margin: 45px 0 0 2px;
3635
}
3636

    
3637
div.console-container {
3638
    margin: 0 0em;
3639
    height: auto;
3640
}
3641

    
3642
#wrapper.console {
3643
    width: auto;
3644
}
3645

    
3646
.console-info {
3647
    font-size:80%;
3648
    color: white;
3649
    float:left;
3650
    position:relative;
3651
    margin: 15px 0 0 480px;
3652
}
3653

    
3654
applet {
3655
    width:100%;
3656
    height:100%;
3657
}
3658

    
3659
div.console-footer {
3660
    /* this is for version 0.5*/
3661
    display: none;
3662
}
3663

    
3664
.console-footer #footer-text{
3665
    float:left;
3666
    left: auto;
3667
    margin-left:30px;
3668
}
3669

    
3670
/* add network wizard (see also #wizard for shared classes) */
3671
#networks-wizard .header {
3672
    background-color: #4085A5;
3673
    height: 56px;
3674
}
3675

    
3676
#networks-wizard div.name-input {
3677
    margin: 75px 0 0 55px;
3678
}
3679

    
3680
#networks-wizard input {
3681
    border: 1px solid #CCCCCC;
3682
    color: #445566;
3683
    letter-spacing: 1px;
3684
    width: 170px;
3685
}
3686

    
3687
#networks-wizard span.help {
3688
    font-style: italic;
3689
    font-size: 80%;
3690
    margin-left: 10px;
3691
}
3692

    
3693
#networks-wizard .separator-end {
3694
    background-color: #387693;
3695
    height: 6px;
3696
    width: 479px;
3697
    margin-left: -13px;
3698
    margin-top: 19px;
3699
}
3700

    
3701
.red {
3702
    color: red;
3703
}
3704

    
3705
/* add server to network wizard (see also #metadata-wizard for shared classes) */
3706
#add-machines-wizard span.machine-name {
3707
    margin-left: 4px;
3708
    vertical-align: text-top;
3709
}
3710

    
3711
#add-machines-wizard img.list-logo {
3712
    margin: 2px 1px 1px;
3713
}
3714

    
3715
.css-panes {
3716
    clear: both;
3717
}
3718

    
3719
.last .firewall-content {
3720
    margin-bottom:13px;
3721
}
3722

    
3723
#pub .last .network-separator {
3724
    display:none;
3725
}
3726

    
3727
.public-networks .empty-network-slot {
3728
    display: none;
3729
}
3730

    
3731
.clearfix {
3732
    display: block;
3733
    width: auto;
3734
    zoom: 1;
3735
}
3736

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

    
3747
* html .clearfix {
3748
    display: inline-block;
3749
}
3750

    
3751
.icon .wave {
3752
    margin-right: 4px !important;
3753
    margin-top: 15px !important;
3754
}
3755

    
3756
.icon .status {
3757
    margin-right: 3px;
3758
}
3759

    
3760
#machinesview .status, .single .state {
3761
    font-size: 75%;
3762
}
3763

    
3764
#machinesview-list div.action-indicator {
3765
    margin:0 !important;
3766
    float: none !important;
3767
}
3768

    
3769
.icon div.action-indicator {
3770
    margin-top: 14px;
3771
    margin-right: 4px;
3772
}
3773

    
3774
div.action-indicator {
3775
    width: 15px;
3776
    height: 20px;
3777
    background-repeat: no-repeat;
3778
    background-position: 0 0;
3779
}
3780

    
3781
tbody.machines div.action-indicator {
3782
    position: relative;
3783
    top: -2px;
3784
}
3785
div.state .destroy, tbody.machines .destroy {
3786
    background-image: url("./icons/actions/medium/destroy.png");
3787
}
3788
div.state .console, tbody.machines .console {
3789
    background-image: url("./icons/actions/medium/console.png");
3790
}
3791
div.state .start, tbody.machines .start {
3792
    background-image: url("./icons/actions/medium/start.png");
3793
}
3794
div.state .reboot, tbody.machines .reboot {
3795
    background-image: url("./icons/actions/medium/reboot.png");
3796
}
3797
div.state .shutdown, tbody.machines .shutdown {
3798
    background-image: url("./icons/actions/medium/shutdown.png");
3799
}
3800

    
3801

    
3802
.no-invitations-left {
3803
    margin-bottom: 20px;
3804
    color: #E44848;
3805
}
3806

    
3807
.invitations #field_name_name, .invitations #field_email_name {
3808
    float: left;
3809
    display: block;
3810
    width: 180px;
3811
}
3812
.invitations input {
3813
    width: 170px;
3814
}
3815

    
3816
.invitations #fieldheaders span.description {
3817
    font-size: 0.8em;
3818
    color: #666;
3819
    margin-left: 2px;
3820
}
3821

    
3822
.invitations #fields {
3823
    margin-top: 5px;
3824
}
3825

    
3826
.invitations .add-field-container {
3827
    margin-top: 5px;
3828
}
3829

    
3830
.invitations #errors {
3831
    padding: 5px;
3832
    background-color: #800000;
3833
}
3834

    
3835
.invitations #errors p {
3836
    margin-bottom: 10px;
3837
    font-size: 0.95em;
3838
    padding-top:0;
3839
    margin-top:0;
3840
    color: #fff;
3841
}
3842

    
3843
.invitations #errors li {
3844
    font-size: 0.85em;
3845
    color: #ddd;
3846
}
3847

    
3848
.invitations #errors {
3849
    font-size: 100%;
3850
    margin-bottom: 10px;
3851
}
3852

    
3853
#invsent {
3854
    padding-top: 10px;
3855
}
3856

    
3857
#invsent h3.overlay-inner-title {
3858
    font-size: 1.2em;
3859
    font-weight: normal;
3860
    border-bottom: 1px solid #B0D0E0;
3861
}
3862

    
3863
#invsent .icons-info img {
3864
    vertical-align: middle;
3865
}
3866

    
3867
#invsent .icons-info {
3868
    margin-top: 10px;
3869
    font-size: 0.7em;
3870
}
3871

    
3872
#invsent .icons-info span {
3873
    margin-right: 10px;
3874
}
3875

    
3876
.notification-box .invitations {
3877
    padding-bottom: 0;
3878
}
3879
.notification-box .invitations .sub-text {
3880
    display: none;
3881
}
3882

    
3883
h3.overlay-inner-title {
3884
    color: #4085A5;
3885
    font-size: 2em;
3886
}
3887

    
3888
#invsent .message {
3889
    font-size: 0.9em;
3890
    padding: 5px 0;
3891
    margin-top: 5px;
3892
    margin-bottom: -10px;
3893
    color: #5CAD54;
3894
}
3895

    
3896
#invsent .errormsg {
3897
    color: #AE2B34;
3898
}
3899

    
3900
#add-name-container {
3901
    margin-bottom: 10px;   
3902
}
3903

    
3904
.remove-field-trigger, .add-field-trigger {
3905
    cursor: pointer;
3906
}
3907

    
3908
.add-field-trigger img {
3909
    vertical-align: middle;
3910
}
3911

    
3912
.invitations form {
3913
    margin-bottom: 20px;
3914
}
3915

    
3916
#invsent h3 {
3917
    font-size: 0.8em;
3918
    font-weight: bold;
3919
}
3920

    
3921
#invsent h3 span {
3922
    font-weight: normal;
3923
    font-size: 0.9em;
3924
    margin-right: 5px;
3925
    display: block;
3926
    margin-top: -2px;
3927
}
3928

    
3929
#invsent ul {
3930
    margin-top: 3px;
3931
}
3932

    
3933
#invsent li {
3934
    color: #4085A5;
3935
    font-size: 1.1em;
3936
    padding-top: 0.5em;
3937
    border-bottom: 1px solid #efefef;
3938
    padding-bottom: 0.5em;
3939
    font-size: 0.9em;
3940
    position: relative;
3941
}
3942

    
3943
#invsent li:hover {
3944
    background-color: #efefef;
3945
}
3946

    
3947
#invsent li img {
3948
    position: absolute;
3949
    left:20px;
3950
    bottom: 2px;
3951
}
3952

    
3953
#invsent h3 img {
3954
    float: none;
3955
    vertical-align: middle;
3956
    margin-left: 3px;
3957
}
3958

    
3959
#invsent .name {
3960
    float: left;
3961
    width: 55%;
3962
    padding-left: 20px;
3963
}
3964

    
3965
#invsent .email {
3966
    float: left;
3967
    width: 40%;
3968
}
3969

    
3970
#invsent li.accepted {
3971
    color: #ABD49C;
3972
}
3973

    
3974
#invsent li img {
3975
    margin-left: -20px;
3976
    margin-top: 1px;
3977
}
3978

    
3979
#invsent li img.resend {
3980
    cursor: pointer;
3981
}
3982

    
3983
.invitations #field_email_name {
3984
}
3985

    
3986
#invform #fields input {
3987
    margin-right: 10px;
3988
}
3989

    
3990
.machine-now-building {
3991
    padding-right: 15px !important;
3992
    text-align: justify;
3993
}
3994

    
3995
.sub-text {
3996
    padding-top: 15px;
3997
    padding-right: 15px;
3998
    text-align: justify;
3999
    font-style: italic;
4000
    font-size: 0.8em !important;
4001
}
4002

    
4003
#notification-box a {
4004
    color: #4085A5;
4005
}
4006

    
4007
#notification-box .machine-title img {
4008
    vertical-align: middle;
4009
}
4010

    
4011
#notifiaction-box .password-header {
4012
    margin-bottom: 0 !important;
4013
}
4014

    
4015
#notification-box .password-container a {
4016
    color: #fff;
4017
    text-decoration: underline;
4018
}
4019

    
4020
#notification-box .password-container a:hover {
4021
    background-color: #fff;
4022
    color: #4085A5;
4023
}
4024

    
4025
#notification-box .password-container {
4026
    background: #4085A5;
4027
    border: none;
4028
}
4029

    
4030
#notification-box .password-container .password a {
4031
    font-weight: normal !important;
4032
}
4033

    
4034
#notification-box .cmd {
4035
    color: #fff;
4036
    font-family: monospace;
4037
    font-size: 1.6em;
4038
}
4039

    
4040
.machine-container .separator {
4041
    background-color: #B0D1E0;
4042
}
4043

    
4044
#creation-password-overlay div.password-cont {
4045
    margin: 10px auto;
4046
    padding: 10px;
4047
    border: 2px solid #75B54A;
4048
    background-color: #AADE87;
4049
    color: #447821;
4050
    text-align: left;
4051
    padding-left: 5em;
4052
    position: relative;
4053
}
4054

    
4055
#creation-password-overlay {
4056
    position: relative;
4057
}
4058

    
4059
#creation-password-overlay .form-action {
4060
    position: absolute;
4061
    bottom: 15px;
4062
    right: 13px;
4063
    font-size: 0.8em;
4064
}
4065

    
4066
#creation-password-overlay .password {
4067
    font-size: 1.3em;
4068
    font-weight: bold;
4069
    margin-right: 5em;
4070
    float: right;
4071
}
4072

    
4073
.feedback-form .description {
4074
    margin-bottom: 25px;
4075
}
4076

    
4077
.feedback-form label {
4078
    display: block;
4079
    font-weight: bold;
4080
    margin-bottom: 10px;
4081
    font-size: 0.8em;
4082
}
4083

    
4084
.feedback-form .form-actions {
4085
    border-top: none;
4086
}
4087

    
4088
.nospace {
4089
    padding-top: 0 !important;
4090
    padding-bottom: 0 !important;
4091
}
4092

    
4093
.noborder {
4094
    border-top: none !important;
4095
    border-bottom: none !important;
4096
}
4097

    
4098
.overlay .feedback-form .messages.description {
4099
    padding-bottom:0;
4100
    margin-bottom: 0;
4101
}
4102

    
4103
.feedback-form .messages .error-message {
4104
    color: #f00;
4105
}
4106

    
4107
.feedback-form .messages .success-message {
4108
    color: #8AA87F;
4109
}
4110

    
4111
.feedback-form .feedback-message {
4112
    width: 548px;
4113
    height: 200px;
4114
    border: 1px solid #ddd;
4115
    padding: 5px;
4116
}
4117

    
4118
#feedback-form .empty-error-msg {
4119
    display: none;
4120
}
4121

    
4122
#feedback-form .data-text {
4123
    display: none;
4124
}
4125

    
4126
#feedback-form .message {
4127
    display: none;
4128
}
4129

    
4130
#feedback-form label {
4131
    display: block;
4132
    font-size: 0.85em;
4133
    font-weight: bold;
4134
}
4135

    
4136
#feedback-form label.inline {
4137
    display: inline;
4138
    padding-left: 5px;
4139
}
4140

    
4141
#feedback-form p {
4142
    padding: 1em 0;
4143
    color: #444;
4144
    margin-bottom: 10px;
4145
}
4146

    
4147
#feedback-form .description {
4148
    font-style: italic;
4149
    font-size: 0.9em;
4150
    color: #888;
4151
}
4152

    
4153
#feedback-form .feedback-text {
4154
    width: 98%;
4155
    height: 100px;
4156
    margin-top: 10px;
4157
    margin-bottom: 10px;
4158
}
4159

    
4160
#feedback-form .submit-data {
4161
    display: none;
4162
}
4163

    
4164
#feedback-form .submit, #invform .submit {
4165
    background-color: #4085A5;
4166
    color: #fff;
4167
    border: none;
4168
    padding: 5px 16px;
4169
    cursor: pointer;
4170
    font-size: 1em;
4171
    position: relative;
4172
}
4173

    
4174
#feedback .submit {
4175
    float: right;
4176
    right: 10px;
4177
    margin-top: 10px;
4178
}
4179

    
4180

    
4181
#feedback-form .submit:hover, #invform .submit:hover {
4182
    background-color: #549FC3;
4183
}
4184

    
4185
.feedback-intro {
4186
    padding-right: 15px !important;
4187
    text-align: justify;
4188
}
4189

    
4190
.popup-body .message {
4191
    padding: 20px 5px;
4192
    display: none;
4193
}
4194

    
4195
.popup-body .loading {
4196
    color: #fff;
4197
}
4198

    
4199
.popup-body .success {
4200
    color: #1F921A;
4201
}
4202

    
4203
.popup-body .errormsg {
4204
    color: #E32424;
4205
}
4206

    
4207

    
4208
.close-msg-box {
4209
    display: block;
4210
    margin-top: 10px;
4211
    cursor: pointer;
4212
    color: #4085A5;
4213
    text-decoration: underline;
4214
}
4215

    
4216

    
4217
.console .ip-version-label {
4218
    margin: 0 5px;
4219
}
4220

    
4221
.ipv6-text, .ipv4-text {
4222
    font-size: 0.9em;
4223
}
4224

    
4225
.tooltip {
4226
    background-color: #C4DDE9;
4227
    color: #000;
4228
    font-size: 0.7em;
4229
    padding: 0.2em 0.5em;
4230
    border: 1px solid #888;
4231
    z-index: 50000;
4232
}
4233

    
4234
/*404 and 500 pages*/
4235

    
4236
.error_page {
4237
    position: relative;
4238
    top: 40px;
4239
    padding-bottom: 140px !important;
4240
}
4241

    
4242
.error_page h1 {
4243
    font-weight: normal;
4244
}
4245

    
4246
.error_page .msg_header {
4247
    margin: 0px;
4248
    font-size: 10em;
4249
    position: absolute;
4250
    left: -5px;
4251
    top: 0px;
4252
    color: #4085A5;
4253
    font-family: arial, verdana;
4254
}
4255

    
4256
.error_page p.error_desc {
4257
    color: #fff;
4258
    font-size: 0.8em;
4259
}
4260

    
4261
.error_page {
4262
    padding-right: 50px !important;
4263
    padding-left: 100px !important;
4264
}
4265

    
4266
.error_page .error_content {
4267
    padding-left: 150px;
4268
    padding-top: 97px;
4269
}
4270

    
4271
.error_page .error_content .links, .info_content .links {
4272
    margin-top: 10px;
4273
    margin-left: 20px;
4274
}
4275

    
4276
.error_page .http_error .code {
4277
    letter-spacing: -10px;
4278
    font-size: 9em;
4279
}
4280

    
4281
.error_page .http_error .msg {
4282
    letter-spacing: -1px;
4283
    font-size: 2em;
4284
}
4285

    
4286
.error_page .http_error {
4287
    position: absolute;
4288
    right: 0px;
4289
    bottom: 0px;
4290
    color: #75B3D0;
4291
    line-height: 1em;
4292
}
4293

    
4294
.error_page .error_content a, .info_content .links a {
4295
    color: #4085A5;
4296
    font-weight: bold;
4297
    margin-right: 10px;
4298
    font-size: 0.9em;
4299
}
4300

    
4301
.error_body #container, .info_body #container {
4302
    background-position: right 200px;
4303
}
4304

    
4305
.info_page h1 {
4306
    color: #4085A5;
4307
    font-size: 2em;
4308
    font-weight: normal;
4309
}
4310

    
4311
.info_page p {
4312
    color: #ffffff;
4313
    margin: 1em 0;
4314
}
4315

    
4316
.info_body p a, .error_body p a{
4317
    color: #4085A5;
4318
    text-decoration: underline;
4319
}
4320

    
4321
.error_404 .http_error .code {
4322
    letter-spacing: -7px;
4323
}
4324

    
4325
.network-progress-indicator {
4326
    position: relative;
4327
    display: none;
4328
}
4329

    
4330
.network-progress-indicator img {
4331
    position: absolute;
4332
    bottom: 44px;
4333
    left: 340px;
4334
}
4335

    
4336

    
4337
.single .progress-message {
4338
    margin-top: 90px;
4339
    font-size: 0.6em;
4340
    padding: 0 10px;
4341
    text-align: center;
4342
}
4343

    
4344
/*metadata keys/values*/
4345
.items .tag-item  {
4346
    display: block;
4347
}
4348

    
4349
.single .items .tag-item .key {
4350
    width: 60px;
4351
}
4352

    
4353
.running .scrollable, .terminated .scrollable {
4354
    height: 42px;
4355
}
4356

    
4357
.items .tag-item .key {
4358
    margin-right: 5px;
4359
    width: 30px;
4360
    display: block;
4361
    float: left;
4362
    color: #000;
4363
}
4364

    
4365
.items .tag-item .value {
4366
    color: #444;
4367
}
4368

    
4369
#machinesview-list {
4370
    display: none;
4371
}
4372

    
4373
#machinesview-single {
4374
    position: relative;
4375
    display: none;
4376
}
4377

    
4378
#machinesview-icon {
4379
    display: none;
4380
}
4381

    
4382
#machinesview-icon, #machinesview-single, #machinesview-list {
4383
    
4384
}
4385

    
4386
tbody.machines .spinner {
4387
    margin-top: 0!important;
4388
    margin: 0 !important;
4389
    float: none !important;
4390
}
4391

    
4392
.slider .slider-point {
4393
    width: 4px;
4394
    height: 3px;
4395
    margin-left: 1px;
4396
    background-color: transparent;
4397
    display: block;
4398
    position: absolute;
4399
    z-index: 10;
4400
    bottom: 0px;
4401
}
4402

    
4403
.slider .slider-point-light {
4404
    background-color: transparent;
4405
}
4406

    
4407
.slider-point-text {
4408
    font-size: 0.6em;
4409
    position: absolute;
4410
    top: 4px;
4411
    border-top: 5px solid #C5DEE9;
4412
    padding: 3px;
4413
    color: #4085A5;
4414
    display: block;
4415
    min-width: 6px;
4416
    text-align: middle;
4417
}
4418

    
4419
.slider .handle {
4420
    z-index: 50;
4421
}
4422

    
4423
.modal p.desc {
4424
    margin: 5px 0;
4425
    margin-left: 37px;
4426
    font-size: 0.8em;
4427
    color: #888;
4428
}
4429

    
4430
.api_overlay_template {
4431
    display: none;
4432
}
4433

    
4434
.api_content .password-container .password {
4435
    color: #fff;
4436
    font-size: 1.1em;
4437
}
4438

    
4439
#disks-pane {
4440
    margin-top: 58px;
4441
}
4442

    
4443
span.resend-msg {
4444
    display: block;
4445
    margin-bottom: 5px;
4446
}
4447

    
4448
.success-msg {
4449
    background-color: #5CAD54;
4450
    color: #fff;
4451
    padding: 0.4em;
4452
    border: 1px solid #ddd;
4453
}
4454

    
4455
.error-msg {
4456
    background-color: #800000;
4457
    color: #fff;
4458
    padding: 0.4em;
4459
    border: 1px solid #ddd;
4460
}
4461

    
4462
.success-msg em, .error-msg em {
4463
    font-weight: bold;
4464
    font-style: normal;
4465
    font-size: 0.9em;
4466
}
4467

    
4468
.pagination {
4469
            font-size: 80%;
4470
        }
4471
        
4472
.pagination a {
4473
    text-decoration: none;
4474
        border: solid 1px #AAE;
4475
        color: #15B;
4476
}
4477

    
4478
.pagination a, .pagination span {
4479
    display: block;
4480
    float: left;
4481
    padding: 0.3em 0.5em;
4482
    margin-right: 5px;
4483
        margin-bottom: 5px;
4484
        min-width:1em;
4485
        text-align:center;
4486
}
4487

    
4488
.pagination .current {
4489
    background: #4085A5;
4490
    color: #fff;
4491
        border: solid 1px #AAE;
4492
}
4493

    
4494
.pagination .current.prev, .pagination .current.next{
4495
        color:#999;
4496
        border-color:#999;
4497
        background:#fff;
4498
}
4499

    
4500
#invsent .pagination {
4501
    margin-top: 10px;
4502
}
4503

    
4504
table.list-machines .wave {
4505
    float: none !important;
4506
    margin: 0 !important;
4507
}
4508

    
4509
.overlay {
4510
    display: none;
4511
}
4512

    
4513
.overlay {
4514
    background-color: #fff;
4515
    border: 2px solid #444;
4516
    text-align: left;
4517

    
4518
    -moz-box-shadow: 0 0 90px 5px #000;
4519
    -webkit-box-shadow: 0 0 90px 5px #000;
4520
    box-shadow: 0 0 90px 5px #000;
4521
    width: 600px;
4522
}
4523

    
4524
.overlay a {
4525
    color: #387693;
4526
}
4527

    
4528
.overlay .overlay-content .description.subinfo {
4529
    margin-bottom:0;
4530
    border-bottom: none;
4531
    padding-bottom:0;
4532
    margin-top: 10px;
4533
    padding-top:10px;
4534
    border-top: 1px solid #64a6c4;
4535
    /*border-top: 1px solid #DBE6EB;*/
4536
    font-size: 0.8em;
4537
}
4538

    
4539
.overlay .overlay-content .important {
4540
    color: #800000;
4541
}
4542

    
4543
.overlay .overlay-content .description {
4544
    color: #444;
4545
    border-bottom: 1px solid #64a6c4;
4546
    margin-bottom: 10px;
4547
    padding-bottom: 10px;
4548
    font-size: 0.9em;
4549
    line-height: 1.6em;
4550
}
4551
.overlay .overlay-content .empty-message {
4552
    margin-bottom: 5px;
4553
}
4554

    
4555
.overlay h3.header {
4556
    font-size: 0.9em;
4557
    text-align: left;
4558
    padding: 0.8em;
4559
    padding-left: 1em;
4560
    font-weight: normal;
4561
    border-bottom: 1px solid #ddd;
4562
}
4563

    
4564
.overlay h3.header .title {
4565
    float: left;
4566
}
4567

    
4568
.overlay .container {
4569
    position: relative;
4570
    padding-top: 1em;
4571
    padding: 0.5em;
4572
    background-image: url("./popup-bg.png");
4573
    background-repeat: repeat-x;
4574
}
4575

    
4576
.overlay .content {
4577
    background-color: transparent;
4578
    background-image: url("./popup-inner-bg.png");
4579
    padding: 1em;
4580
    font-size: 0.8em;
4581
    background-repeat: repeat-x;
4582
    -moz-box-shadow: 0 0 1px 1px #888;
4583
    -webkit-box-shadow: 0 0 1px 1px #888;
4584
    box-shadow: 0 0 1px 1px #888;
4585
}
4586

    
4587
.overlay .message {
4588
}
4589

    
4590
.overlay .actions {
4591
    position: absolute;
4592
    right: 0.75em;
4593
    top: 0.6em;
4594
}
4595

    
4596
.overlay .actions span {
4597
    font-size: 0.8em;
4598
    color: #fff;
4599
    cursor: pointer;
4600
    margin-left: 10px;
4601
    display: block;
4602
    float: left;
4603
    background-color: #4085A5;
4604
    padding: 0.2em 0.4em;
4605
}
4606

    
4607
.overlay-error .error-more-details {
4608
    margin-top: 5px;
4609
    max-height: 210px;
4610
    overflow: auto;
4611
}
4612

    
4613
.overlay-error .key.details.expand {
4614
    background-image: url("./plus-8.png");
4615
}
4616

    
4617
.overlay-error .key.details {
4618
    background-color: #5189A3;
4619
    cursor: pointer;
4620
    background-image: url("./minus-8.png");
4621
    background-repeat: no-repeat;
4622
    background-position: 545px;
4623
}
4624

    
4625
.overlay-error .container {
4626
    padding-top: 1.9em;
4627
}
4628

    
4629
.overlay-error .error-details {
4630
    font-size: 0.8em;
4631
    margin-top: 10px;
4632
}
4633

    
4634
.overlay-error .error-details anonymous {
4635
    display: block;
4636
    margin-top: 10px;
4637
}
4638

    
4639
.overlay-error h3.header {
4640
    background-color: #800000;
4641
    color: #fff;
4642
}
4643

    
4644
.overlay-error.non-critical h3.header {
4645
    background-color: #987249;
4646
}
4647

    
4648
.overlay-error span.key {
4649
    font-weight: normal;
4650
    display: block;
4651
    margin-top: 0.5em;
4652
    background-color: #74AEC9;
4653
    color: #fff;
4654
    padding: 0.4em;
4655
    font-size: 0.8em;
4656
    font-weight: bold;
4657
}
4658

    
4659
.overlay-error .indicator {
4660
    background-color: #880000;
4661
    color: #fff;
4662
    padding: 4px;
4663
    display: block;
4664
    float: left;
4665
    border: 1px solid #444;
4666
}
4667

    
4668
.overlay-error .nav-btn:hover {
4669
    
4670
}
4671

    
4672
.overlay-error .nav-btn {
4673
    margin-left: 5px;
4674
    color: #fff;
4675
    display: block;
4676
    float: left;
4677
    padding: 4px;
4678
    background-color: #AAA;
4679
    border: 1px solid #444;
4680
}
4681

    
4682
.overlay-error .error-nav {
4683
    position: absolute;
4684
    right: 0px;
4685
    bottom: -25px;
4686
    font-size: 0.8em;
4687
}
4688

    
4689
.overlay-error span.value, .overlay-error div.value {
4690
    padding: 0.4em;
4691
    display: block;
4692
    margin-bottom: 0.3em;
4693
}
4694

    
4695
.overlay h3 .closeme {
4696
    float: right;
4697
    font-size: 0.7em;
4698
    margin-top: 0.2em;
4699
    cursor: pointer;
4700
}
4701

    
4702
.overlay .header .subtitle {
4703
    display: block;
4704
    font-size: 0.8em;
4705
    color: #ddd;
4706
}
4707

    
4708
.overlay .header .subtitle img {
4709
    vertical-align: middle;
4710
    margin-left: 10px;
4711
    margin-bottom: 2px;
4712
}
4713

    
4714
.overlay-info .content {
4715
    background-repeat: no-repeat;
4716
    background-position: 110% 110%;
4717
    background-color: rgba(255,255,255,0.6)
4718
}
4719

    
4720
.overlay-info .header {
4721
    background-color: #4085A5;
4722
}
4723

    
4724
.overlay-info .header .title {
4725
    color: #fff;
4726
}
4727

    
4728
.overlay-info .header .closeme {
4729
    color: #fff;
4730
}
4731

    
4732
#loading-view {
4733
    width: 600px;
4734
    margin: 0 auto;
4735
    padding: 20px 0;
4736
    font-size: 0.8em;
4737
}
4738

    
4739
#loading-view .header span {
4740
    font-weight: bold;
4741
    color: #4085A5;
4742
}
4743

    
4744
#loading-view .info {
4745
    color: #ddd;
4746
}
4747

    
4748
.options-list {
4749
    margin-top: 0.5em;
4750
    font-size: 0.8em;
4751
}
4752

    
4753
.options-list.five li {
4754
    float: left;
4755
    display: block;
4756
    width: 20%;
4757
    margin-bottom: 5px;
4758
}
4759

    
4760
.options-list.five li:nth-child(5n) .options-object-cont {
4761
    margin-right: 0;
4762
}
4763

    
4764
.options-object-cont input {
4765
    border: 1px solid #aaa;
4766
    width: 92px;
4767
    padding: 0;
4768
    margin: 0;
4769
    margin-top:3px;
4770
    padding: 2px;
4771
}
4772

    
4773
.options-list.three li {
4774
    float: left;
4775
    display: block;
4776
    width: 33%;
4777
    margin-bottom: 5px;
4778
}
4779

    
4780
.meta-list .options-list li.options-object.create .options-object-cont {
4781
    background-image: url("./option-action-add.png");
4782
    background-repeat: no-repeat;
4783
    background-position: 90px 5px;
4784
}
4785

    
4786
.meta-list .options-list li .options-object-cont .option-action,
4787
.meta-list .options-list li.options-object.create {
4788
    cursor: pointer !important;
4789
}
4790

    
4791
.meta-list .options-list li .options-object-cont {
4792
    cursor: inherit;
4793
}
4794

    
4795
.options-list li .options-object-cont {
4796
    padding: 4px;
4797
    margin-right: 4px;
4798
    border: 1px solid #A6D1E6;
4799
    cursor: pointer;
4800
    min-height: 35px;
4801
    position: relative;
4802
}
4803

    
4804
.options-list.three li:nth-child(3n) .options-object-cont {
4805
    margin-right: 0;
4806
}
4807

    
4808
.options-list li.selected .options-object-cont {
4809
    background-color: #4085A5;
4810
    border: 1px solid #fff;
4811
}
4812

    
4813
.options-list li.selected .options-object-cont .title {
4814
    color: #fff;
4815
}
4816

    
4817
.options-list li.options-object .title {
4818
    display: block;
4819
    color: #FF7F2A;
4820
    margin-bottom: 2px;
4821
}
4822

    
4823
.options-list li .option-action {
4824
    display: none;
4825
    position: absolute;
4826
    background-repeat: no-repeat;
4827
}
4828

    
4829
.options-list.five li.editing {
4830
    width: 40%;
4831
}
4832

    
4833
.options-list.five li.editing .value {
4834
    display: none;
4835
}
4836

    
4837
.options-list li .remove {
4838
    background-image: url("./option-action-remove.png");
4839
    width:10px;
4840
    height:10px;
4841
    right:5px;
4842
    bottom: 5px;
4843
}
4844

    
4845
.options-list li .edit {
4846
    background-image: url("./option-action-edit.png");
4847
    width:10px;
4848
    height:10px;
4849
    right:5px;
4850
    top: 5px;
4851
}
4852

    
4853
.options-list li:hover .option-action  {
4854
    display: block;
4855
}
4856

    
4857
.options-list li.options-object .value {
4858
    color: #4085A5;
4859
    margin-top: 5px;
4860
    display: block;
4861
}
4862

    
4863
.options-list li.selected.options-object .value {
4864
    color: #ddd;
4865
}
4866
.options-list li .options-object-cont:hover {
4867
    background-color: #fff;
4868
}
4869

    
4870
.options-list li.selected .options-object-cont:hover {
4871
    background-color: #A6D1E6;
4872
}
4873

    
4874
.options-list li img {
4875
    float: left;
4876
    margin:2px;
4877
    margin-right: 10px;
4878
    padding-bottom:10px;
4879
}
4880

    
4881
#metadata-overlay-content {
4882
    position: relative;
4883
}
4884

    
4885
.vm-meta .editor .predefined .predefined-meta-key:hover {
4886
    background-color: #4e8eac;
4887
    color: #fff;
4888
}
4889

    
4890
.vm-meta .editor .predefined .predefined-meta-key {
4891
    float: left;
4892
    margin-right: 5px;
4893
    padding: 4px;
4894
    display: block;
4895
    cursor: pointer;
4896
}
4897

    
4898
.vm-meta .editor .predefined {
4899
    background-color: #A6D1E6;
4900
    font-size: 0.9em;
4901
    border-top: 1px solid #ddd;
4902
}
4903

    
4904
.vm-meta .editor input {
4905
}
4906
.vm-meta .editor {
4907
    margin-bottom: 10px;
4908
}
4909

    
4910
.vm-meta .editor .form-actions .form-action {
4911
    min-width: 50px;
4912
}
4913

    
4914
.vm-meta .editor .form-field input.meta-key {
4915
    width: 90px;
4916
}
4917

    
4918
.vm-meta .form-field {
4919
    float: left;
4920
}
4921

    
4922
.vm-meta .form-actions .form-action {
4923
    float: left;
4924
    margin-right: 10px;
4925
    height: 11px;
4926
}
4927

    
4928
.vm-meta .editor .form-actions .cancel {
4929
    margin-right: 0;
4930
}
4931

    
4932
.vm-meta .editor .form-actions {
4933
    float: right;
4934
    margin:0;
4935
    padding:0;
4936
    margin-left: 15px;
4937
    margin-top: 0px;
4938
}
4939

    
4940
.vm-meta .editor {
4941
    background-color: rgba(64, 133, 165, 0.898) !important;
4942
    background-color: #649DB8;
4943
    font-size:0.9em;
4944
}
4945

    
4946
.vm-meta .meta-key-title {
4947
    font-size: 1.3em;
4948
    color: #fff;
4949
    margin-bottom: 10px;
4950
    display: none;
4951
    float: left;
4952
}
4953

    
4954
.vm-meta .editor-content {
4955
    padding: 10px;
4956
}
4957

    
4958
.vm-meta .inner-mask {
4959
    background-color: #fff;
4960
    opacity:0.6;
4961
    position: absolute;
4962
    top:0;
4963
    left:0;
4964
}
4965

    
4966
.vm-meta .editor label {
4967
    float: left;
4968
    color: #fff;
4969
    margin-right: 2px;
4970
    padding-top:4px;
4971
    font-size: 0.9em;
4972
}
4973

    
4974
.vm-meta .editor input {
4975
    border: none;
4976
    width: 170px;
4977
    margin-left: 10px;
4978
    font-size: 0.9em;
4979
    padding: 4px;
4980
}
4981

    
4982
.vm-meta li.create .options-object-cont {
4983
    background-color: #B3C9AD ;
4984
    border-color: #788774;
4985
}
4986
.vm-meta li.create .options-object-cont .value,
4987
.vm-meta li.create .options-object-cont .title {
4988
    color: #fff;
4989
}
4990

    
4991
#createvm-overlay-content {
4992
    padding: 0;
4993
}
4994

    
4995
.overlay-createvm .container {
4996
    width: 584px !important;
4997
}
4998

    
4999
.create-vm .header-step.current {
5000
    font-weight: bold;
5001
}
5002

    
5003
.create-vm .create-step-cont {
5004
    min-height: 240px;
5005
}
5006
.create-vm .create-controls {
5007
    padding: 10px;
5008
}
5009

    
5010
.create-vm ul li {
5011
    cursor: pointer;
5012
    padding: 4px;
5013
}
5014

    
5015
.create-vm ul li.selected {
5016
    background-color: #aaa;
5017
}
5018

    
5019
.cont-toggler {
5020
    background-image: url("./down-arrow.png");
5021
    background-position: right;
5022
    background-repeat: no-repeat;
5023
    background-color: #A1C8DB;
5024
    display: inline-block;
5025
    border-right: 6px solid #A1C8DB;
5026
    padding:2px;
5027
    padding-right: 14px;
5028
    padding-left:0;
5029
    cursor: pointer;
5030
    color: #fff;
5031
    font-size: 0.9em;
5032
}
5033

    
5034
.cont-toggler .label {
5035
    background-color: #98BDCF;
5036
    padding: 2px;
5037
    padding-left: 5px;
5038
    padding-right: 5px;
5039
}
5040

    
5041
.cont-toggler.open {
5042
    background-color: #98BDCF;
5043
    border-color: #98BDCF;
5044
    background-image: url("./up-arrow.png");
5045
}
5046

    
5047
.cont-toggler.open .label {
5048
    background-color: #4085A5;
5049
}
5050

    
5051
.overlay .form label {
5052
    font-color: #444;
5053
    margin-right: 10px;
5054
}
5055

    
5056
.form-field input {
5057
    border: 1px solid #aaa;
5058
    width: 200px;
5059
    padding: 3px;
5060
}
5061

    
5062
.form-actions {
5063
    margin-top: 5px;
5064
    padding-top:5px;
5065
    border-top: 1px solid #64a6c4;
5066
    font-size: 0.8em;
5067
}
5068

    
5069
.form-actions.plain {
5070
    margin-top: 0px;
5071
    padding-top:0px;
5072
    border-top: 0px;
5073
}
5074

    
5075
.form-action {
5076
    float: right;
5077
    min-width: 140px;
5078
    background-color: #FF7F2A;
5079
    border: 1px solid #FF7F2A;
5080
    text-align: center;
5081
    color: #FFFFFF;
5082
    cursor: pointer;
5083
    padding: 4px;
5084
}
5085

    
5086
.form-action:hover {
5087
    background-color: #FF9955;
5088
    color: #FFF;
5089
}
5090

    
5091
.form-action.prev,
5092
.form-action.cancel {
5093
    background-color: #800;
5094
    border: 1px solid #800;
5095
    float: left;
5096
}
5097

    
5098
.form-action.prev:hover,
5099
.form-action.cancel:hover {
5100
    background-color: #fff;
5101
    color: #800;
5102
}
5103

    
5104
.form-action.next,
5105
.form-action.ok {
5106
    background-color: #080;
5107
    border: 1px solid #080;
5108
}
5109

    
5110
.form-action.next:hover,
5111
.form-action.ok:hover {
5112
    background-color: #fff;
5113
    color: #080;
5114
}
5115

    
5116
.form-action .create,
5117
.form-action .submit {
5118

    
5119
}
5120

    
5121
.form-action.in-progress, button.in-progress {
5122
    background-image: url("./icons/indicators/medium/horizontal-progress.gif");
5123
    background-repeat: no-repeat;
5124
    background-position: center center;
5125
    color: transparent;
5126
}
5127

    
5128
#createvm-overlay-content {
5129
    padding: 0;
5130
}
5131

    
5132
.create-vm .image-details.selected .size {
5133
    color: #eee;
5134
}
5135

    
5136
.create-vm .image-details p {
5137
    font-size: 0.8em;
5138
    padding-left: 27px;
5139
    display:block;
5140
}
5141

    
5142
.create-vm .image-details .size {
5143
    margin-top: 2px;
5144
    font-size: 0.8em;
5145
    color: #aaa;
5146
    position: absolute;
5147
    right:5px;
5148
    top: 5px;
5149
}
5150

    
5151
.create-vm .step-cont {
5152
    margin: 15px;
5153
}
5154

    
5155
.create-vm .create-step-cont {
5156
    min-height: 250px;
5157
    float: left;
5158
    width: 584px;
5159
}
5160

    
5161
.create-vm .create-controls {
5162
    padding: 10px;
5163
    border-top: 1px solid #ddd;
5164
}
5165

    
5166
.create-vm .empty {
5167
    font-size: 0.8em;
5168
    color: #444;
5169
}
5170

    
5171
.create-vm h4 {
5172
    color: #5CA1C0;
5173
    margin-bottom: 0.5em;
5174
    font-family: arial;
5175
}
5176
.create-vm ul li {
5177
    cursor: pointer;
5178
    padding: 4px;
5179
    font-size: 0.9em;
5180
}
5181

    
5182
.create-vm ul li.selected {
5183
    background-color: #5CA1C0;
5184
    color: #fff;
5185
}
5186

    
5187
.create-vm .images-list-cont {
5188
    width: 40%;
5189
    float: left;
5190
    padding-left: 3%;
5191
    padding-right: 3%;
5192
}
5193

    
5194
.create-vm p.desc {
5195
    font-size: 0.9em;
5196
    color: #888;
5197
    margin-bottom: 10px;
5198
}
5199

    
5200
.create-vm li.role .values .val:hover {
5201
    background-color: #eee;
5202
}
5203
.create-vm li.role .values .val.selected,  .create-vm li.role .values .val.selected:hover {
5204
    color: #fff;
5205
    background-color: #5CA1C0;
5206
}
5207

    
5208
.create-vm .images-filter-cont, .create-vm .flavors-predefined-cont {
5209
    width: 18%;
5210
    padding-right: 4%;
5211
    float:left;
5212
    border-right: 1px solid #A1C8DB;
5213
    overflow: auto;
5214
}
5215

    
5216
.create-vm .flavor-options-cont {
5217
    width: 74%;
5218
    float: left;
5219
    margin-left: 20px;
5220
}
5221

    
5222
.create-vm .flavor-options-cont .flavor-options li:hover {
5223
    background-image:-webkit-linear-gradient(top, #E8F4FA, #D1E7F0);
5224
    background-image:-o-linear-gradient(top, #E8F4FA, #D1E7F0);
5225
    background-image:-moz-linear-gradient(top, #E8F4FA, #D1E7F0);
5226
    background-image:linear-gradient(top, #E8F4FA, #D1E7F0);
5227
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E8F4FA', endColorstr='#D1E7F0', GradientType=0);
5228
}
5229

    
5230
.create-vm .flavor-options-cont .flavor-options li.disabled * {
5231
    color: #eee !important;
5232
}
5233

    
5234
.create-vm .flavor-options-cont .flavor-options li.disabled {
5235
    background-image:linear-gradient(top, #aaa, #ddd);
5236
    background-image:-webkit-linear-gradient(top, #aaa, #ddd);
5237
    background-image:-o-linear-gradient(top, #aaa, #ddd);
5238
    background-image:-moz-linear-gradient(top, #aaa, #ddd);
5239
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#aaaaaa', endColorstr='#dddddd', GradientType=0);
5240
}
5241

    
5242
.create-vm .flavor-options-cont .flavor-options li.selected {
5243
    background-color: #FF9955;
5244
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5245
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5246
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5247
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5248
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF9955', endColorstr='#E88B4D', GradientType=0);
5249
    border: 1px solid #C97943;
5250
}
5251

    
5252
.create-vm .predefined-list li.disabled {
5253
    color: #ddd !important;
5254
}
5255

    
5256
.create-vm .flavor-options-cont .flavor-options li {
5257
    display: block;
5258
    float: left;
5259
    margin-right: 10px;
5260
    padding: 10px 15px;
5261
    border: 1px solid #aaa;
5262
    background-image:-webkit-linear-gradient(top, #D1E7F0, #E8F4FA);
5263
    background-image:-o-linear-gradient(top, #D1E7F0, #E8F4FA);
5264
    background-image:-moz-linear-gradient(top, #D1E7F0, #E8F4FA);
5265
    background-image:linear-gradient(top, #D1E7F0, #E8F4FA);
5266
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D1E7F0', endColorstr='#E8F4FA', GradientType=0);
5267
}
5268

    
5269
.create-vm .flavor-options-cont .flavor-options {
5270
    margin-bottom: 25px;
5271
}
5272

    
5273
.create-vm .flavor-options .metric {
5274
    font-size: 0.8em;
5275
    margin-left: 2px;
5276
}
5277

    
5278
.create-vm .flavor-options span.title {
5279
    color: #444;
5280
}
5281

    
5282
.create-vm .flavor-options span.desc {
5283
    display: block;
5284
    color: #aaa;
5285
    font-weight: normal;
5286
    font-size: 0.8em;
5287
    float: right;
5288
    margin-top: 4px;
5289
}
5290

    
5291
.create-vm .flavor-options .selected .value {
5292
    color: #FFF;
5293
}
5294

    
5295
.create-vm .flavor-options .value {
5296
    font-weight: bold;
5297
    color: #5CA1C0;
5298
}
5299

    
5300
.create-vm .flavor-options-cont h4 {
5301
    border-bottom: 1px solid #A1C8DB;
5302
    padding-bottom: 5px;
5303
}
5304

    
5305
.create-vm .images-info-cont {
5306
    width: 28%;
5307
    padding-left: 3%;
5308
    float: left;
5309
    border-left: 1px solid #A1C8DB;
5310
}
5311

    
5312
.create-vm .images-info-cont h4, .create-vm .vm-confirm .param h4{
5313
    color: #FF9955;
5314
    margin-bottom: 1em;
5315
    font-size: 1.2em;
5316
}
5317

    
5318
.create-vm .images-info-cont span.title {
5319
    color: #4085A5;
5320
    display: block;
5321
    margin-bottom: 2px;
5322
    font-size: 0.8em;
5323
}
5324

    
5325
.create-vm .type-filter li {
5326
    font-size: 0.8em;
5327
    font-weight: bold;
5328
    padding: 4px;
5329
    margin-bottom: 0px;
5330
    
5331
}
5332

    
5333
.create-vm .images-list .image-details:hover {
5334
    background-color: #eee;
5335
}
5336

    
5337
.create-vm .images-list .image-details.selected:hover {
5338
    background-color: #5CA1C0;
5339
}
5340

    
5341
.create-vm .images-list .image-details.selected {
5342
    /*font-weight: bold;*/
5343
}
5344

    
5345
.create-vm .images-list .image-details {
5346
    padding: 6px;
5347
    margin-bottom:1px;
5348
    position: relative;
5349
}
5350

    
5351
.create-vm .images-list .image-details img {
5352
    vertical-align: middle;
5353
    margin-right: 10px;
5354
}
5355

    
5356
.create-vm .images-info-cont .image-detail:last-child p {
5357
    border-bottom: none;
5358
}
5359

    
5360
.create-vm .images-info-cont h4 img {
5361
    vertical-align: middle;
5362
    margin-right: 7px;
5363
    margin-bottom: 5px;
5364
}
5365

    
5366
.create-vm .images-info-cont .description p {
5367
    font-size: 0.8em;
5368
}
5369

    
5370
.create-vm .images-info-cont p {
5371
    margin-bottom: 7px;
5372
    font-size: 0.9em;
5373
    border-bottom: 1px solid #A1C8DB;
5374
    padding-bottom: 7px;
5375
}
5376

    
5377
.create-vm .step-header {
5378
    padding: 10px;
5379
    padding-bottom:0;
5380
    margin-bottom: 10px;
5381
    background-color: #A1C8DB;
5382
    border-bottom: 1px solid #aaa;
5383
    position: relative;
5384
}
5385

    
5386
.create-vm .step-header .header-step .info span.subtitle {
5387
    font-size: 1.2em;
5388
    color: #fff;
5389
    font-weight: bold;
5390
}
5391

    
5392
.create-vm .step-header .header-step .info span {
5393
    float: none;
5394
    text-align: right;
5395
}
5396

    
5397
.create-vm .step-header .header-step .info {
5398
    position: absolute;
5399
    right: 15px;
5400
    top: 20px;
5401
    font-size: 0.8em;
5402
}
5403

    
5404
.create-vm .step-header .header-step span {
5405
    float: left;
5406
    display: block;
5407
}
5408

    
5409
.create-vm .steps-container {
5410
    width: 2000em;
5411
}
5412

    
5413
.create-vm .step-header .header-step .title {
5414
    margin-top: 20px;
5415
    font-size: 1em;
5416
    margin-left: 10px;
5417
}
5418

    
5419
#createvm-overlay-content {
5420
    width: 584px;
5421
    overflow: hidden;
5422
}
5423

    
5424
.create-vm .step-header .header-step .num {
5425
    font-size: 4em;
5426
    margin-bottom: -5px;
5427
    font-family: 'Ubuntu';
5428
    font-weight: normal !important;
5429
}
5430

    
5431
.create-vm .step-header .header-step {
5432
    color: #DCEBF1;
5433
    margin-bottom: -6px;
5434
    width: 25%;
5435
    padding-left: 0%;
5436
    display: block;
5437
    float: left;
5438
}
5439

    
5440
.create-vm .step-header .header-step.current {
5441
    color: #387693;
5442
}
5443

    
5444
.create-vm .image-filters-title {
5445
    margin-top: 1em;
5446
    margin-bottom: 0.5em;
5447
}
5448

    
5449
.create-vm .create-step-cont span.clear {
5450
    font-size: 0.8em;
5451
    font-weight: bold;
5452
    color: #A1C8DB;
5453
    display: block;
5454
}
5455

    
5456
.create-vm .category-filters li {
5457
    float:left;
5458
    display: block;
5459
    padding: 4px;
5460
    background-color: #eee;
5461
    margin-right: 5px;
5462
    font-size: 0.9em;
5463
    margin-bottom: 5px;
5464
}
5465

    
5466
.create-vm .content-cont {
5467
    height: 340px;
5468
    overflow: auto;
5469
}
5470

    
5471
.confirm-cont {
5472
    height: 250px;
5473
}
5474

    
5475
.create-vm .vm-confirm .rename input.rename-field {
5476
    font-size: 1.4em;
5477
    padding: 5px;
5478
    width: 93%;
5479
    padding-left: 30px;
5480
    background-position: 7px center;
5481
    background-repeat: no-repeat;
5482
}
5483

    
5484
.create-vm .vm-confirm .rename label {
5485
    display: block;
5486
}
5487

    
5488
.create-vm .vm-confirm .confirm-conts {
5489
    margin-top: 20px;
5490
}
5491

    
5492
.create-vm .vm-confirm .confirm-cont {
5493
    width: 30%;
5494
    margin-right: 2%;
5495
    border-right: 1px solid #A1C8DB;
5496
    float: left;
5497
}
5498

    
5499
.create-vm .vm-confirm .confirm-cont ul li .value {
5500
    float: right;
5501
    padding-top: 2px;
5502
    display: block;
5503
    width: 90px;
5504
    text-align: right;
5505
}
5506

    
5507
.create-vm .vm-confirm .confirm-cont ul li.image-description .value,
5508
.create-vm .vm-confirm .confirm-cont ul li.image-name .value {
5509
    float: none;
5510
    width: auto;
5511
    text-align:left;
5512
    width: auto;
5513
}
5514

    
5515
.create-vm .vm-confirm .confirm-cont ul li {
5516
    padding:0;
5517
    margin:0;
5518
    margin-bottom: 5px;
5519
    border-bottom: 1px solid #EEE;
5520
    padding-bottom: 7px;
5521
    margin-right: 10px;
5522
}
5523

    
5524
.create-vm .vm-confirm .confirm-cont.meta h4 {
5525
    margin-right: 0;
5526
}
5527

    
5528
.create-vm .vm-confirm .confirm-cont.meta {
5529
    margin-right:0;
5530
    border-right: none;
5531
    width: 195px;
5532
}
5533

    
5534
.create-vm .confirm-cont > h4 {
5535
    font-size: 1.2em;
5536
    margin-right: 10px;
5537
    border-bottom: 1px solid #A1C8DB;
5538
    padding-bottom: 5px;
5539
    color: #387693;
5540
}
5541

    
5542
.create-vm .confirm-cont .param.image-name {
5543
    margin-bottom: 0 !important;
5544
    border-bottom: none !important;
5545
}
5546

    
5547
.create-vm .confirm-cont .param h4 {
5548
    margin-bottom: 0px !important;
5549
    font-size: 1.1em !important; 
5550
}
5551

    
5552
.create-vm .confirm-cont .param {
5553
    margin-bottom: 7px !important;
5554
}
5555

    
5556
.create-vm .confirm-cont .value {
5557
    font-weight: bold;
5558
}
5559

    
5560
.create-vm .confirm-cont .param .value {
5561
    font-size: 0.9em;
5562
}
5563

    
5564
.create-vm .confirm-cont .param .title {
5565
    color: #387693;
5566
}
5567

    
5568
.create-vm .confirm-cont .image-description {
5569
    margin-left:0;
5570
}
5571

    
5572
.create-vm .confirm-cont .image-description .value {
5573
    font-weight: normal;
5574
    margin-left: 0 !important;
5575
}
5576

    
5577
.create-vm .confirm-cont .image-description .title {
5578
    display: none;
5579
    font-size: 0.8em;
5580
}
5581

    
5582
.create-vm .confirm-cont.meta .values span {
5583
    display:block;
5584
    float: left;
5585
    margin-right: 4px;
5586
    border: 1px solid #eee;
5587
    padding:3px;
5588
    margin-bottom: 4px;
5589
    font-size: 0.9em;
5590
}
5591

    
5592
.create-vm .confirm-cont.meta .key {
5593
    font-weight: bold;
5594
    font-size: 0.9em;
5595
    display: block;
5596
    margin-bottom: 5px;
5597
}
5598

    
5599
.create-vm .meta input {
5600
    font-size: 0.8em;
5601
}
5602

    
5603
.vm-connect .connect-cont {
5604
    margin-bottom: 20px;
5605
    border-bottom: 1px solid #A1C8DB;
5606
    padding-bottom: 20px;
5607
}
5608

    
5609
.vm-connect .connection-info {
5610
    padding-bottom: 0px;
5611
    margin-bottom: 0;
5612
    border-bottom: none;
5613
}
5614

    
5615
.vm-connect .connection-info .connect a {
5616
    color: #fff;
5617
}
5618

    
5619
.vm-connect .connection-info .connect {
5620
    background-color: #387693;
5621
    color: #fff;
5622
    padding: 10px;
5623
    font-size: 1.2em;
5624
    text-align: center;
5625
}
5626

    
5627
.clip-copy {
5628
    display: block;
5629
    width: 20px;
5630
    height: 20px;
5631
    position: absolute;
5632
    border: 1px solid #387693;
5633
    background-image: url("./clipboard.png");
5634
    background-repeat: no-repeat;
5635
    background-position: center;
5636
    cursor: pointer;
5637
    background-color: #A1C8DB;
5638
}
5639

    
5640
.password-cont .clip-copy { right: 10px; top: 8px;}