Statistics
| Branch: | Tag: | Revision:

root / snf-cyclades-app / synnefo / ui / static / snf / css / main.css @ fb7e2d64

History | View | Annotate | Download (127.9 kB)

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

    
19
body {
20
    background: url("../images/body-bg.png") repeat-x #FFFFFF;
21
    text-align:center;
22
    font-size: 16px;
23
    background-position: 0px 34px; 
24
    overflow-y: scroll;
25
}
26

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

    
31
pre {
32
    font-family: monospace;
33
}
34

    
35
#okeanos-image {
36
    position: absolute;
37
    bottom: -0px;
38
    right: 0;
39
    z-index:0;
40
}
41

    
42
#container {
43
    position: relative;
44
        margin:0 auto;
45
        width: 100%;
46
        background: transparent;
47
    z-index: 1;
48
}
49

    
50
#header {
51
    height: 93px;
52
    background: url("../images/header-bg.png") repeat-x scroll 0 0 transparent;
53
    margin: 0 auto;
54
    width: 700px;
55
    text-align: left;
56
    position: relative;
57
    z-index: 50;
58
}
59

    
60
#content {
61
    padding-bottom: 10px;
62
    width: 100%;
63
}
64

    
65
div#wrapper {
66
    width: 700px;
67
    margin: 0em auto;
68
    text-align: left;
69
}
70

    
71
#footer a {
72
    color: #fff;
73
}
74

    
75
#footer .software .version {
76
    font-weight: bold;
77
}
78

    
79
#footer .software {
80
    font-size: 0.6em;
81
    margin-top: 7px;
82
    color: #fff;
83
}
84

    
85
#footer {
86
    height: 80px;
87
    background-color: #4085A5;
88
    width:100%;
89
}
90

    
91
#footer-container {
92
    height: 80px;
93
    width: 100%;
94
    left:0;
95
    z-index:10;
96
}
97

    
98
#footer div.grnet-sign {
99
    margin-top:10px;
100
}
101

    
102
#footer div.grnet-sign a{
103
    color: #72ADC8;
104
}
105

    
106
#footer div.grnet-sign a:hover {
107
    color: #FFFFFF;
108
}
109

    
110
ol, ul {
111
    list-style: none;
112
}
113

    
114
blockquote, q {
115
    quotes: none;
116
}
117

    
118
blockquote:before, blockquote:after,
119
q:before, q:after {
120
    content: '';
121
    content: none;
122
}
123

    
124
/* remember to define focus styles! */
125
:focus {
126
    outline: 1px dotted #87AADE;
127
}
128

    
129
/* remember to highlight inserts somehow! */
130
ins {
131
    text-decoration: none;
132
}
133

    
134
del {
135
    text-decoration: line-through;
136
}
137

    
138
/* tables still need 'cellspacing="0"' in the markup */
139
table {
140
    border-collapse: collapse;
141
    border-spacing: 0;
142
}
143

    
144
h5 {
145
    font-weight: normal;
146
    margin-bottom:3px;
147
}
148

    
149
.tab-name, 
150
.machine-container .name,
151
h5.namecontainer span,
152
.single .machine-detail.title {
153
    font-family: 'Ubuntu', sans-serif;
154
}
155

    
156
.create-container a {
157
    font-family: 'Open Sans', sans-serif;
158
}
159

    
160
/* root element for tabs  */
161
.tab-name {
162
    background-color: #5CA1C0;
163
    color: #FFFFFF;
164
    float: right;
165
    font-size: 150%;
166
    height: 31px;
167
    text-align: right;
168
    padding-right: 15px;
169
    width: 170px;
170
}
171

    
172
.tab-separator {
173
    background-color: white;
174
    float: left;
175
    width: 2px;
176
    height: 23px;
177
    margin-top: 4px;
178
}
179

    
180
ul.css-tabs {
181
    padding: 0;
182
    height:31px;
183
    background-color: #5CA1C0;
184
}
185

    
186
ul.css-tabs .secondary {
187
    position:relative;
188
}
189

    
190
/* single tab */
191
ul.css-tabs li {
192
    float:left;
193
    padding:0;
194
    list-style-type:none;
195
}
196

    
197
ul.css-tabs .current {
198
    background: #4085A5;
199
}
200

    
201
/* link inside the tab. uses a background image */
202
ul.css-tabs a {
203
    float:left;
204
    display:block;
205
    text-decoration:none;
206
    color:#d2d2d2;
207
    position:relative;
208
    outline:0;
209
    padding: 4px 25px 0;
210
    height: 27px;
211
}
212

    
213
ul.css-tabs a:hover {
214
    background: #74AEC9;
215
}
216

    
217
/* selected tab */
218
ul.css-tabs a.current,
219
ul.css-tabs a.active {
220
    cursor:default;
221
    background: #4085A5;
222
}
223

    
224
/* tab pane */
225
div.css-panes {
226
/*    border-top: 10px solid #87aade;
227
    border-bottom: 10px solid #87aade;  */
228
    background: transparent;
229
}
230

    
231
.css-panes > div.pane {
232
    display:none;
233
}
234

    
235
.panes-menu {
236
    height: 30px;
237
    margin-bottom: 10px;
238
}
239
/* CSS3 border radius for various elements. yea - CSS isn't perfect */
240
.rounded, #sheet input, .error-rounded {
241
    border-radius: 5px;
242
    -webkit-border-radius: 5px;
243
    -moz-border-radius: 5px;
244
    -o-border-radius: 5px;
245
    -khtml-border-radius: 5px;
246
}
247

    
248
/*validation error message*/
249
/*.error {*/
250
    /*background-color:#E8FF6D;*/
251
    /*padding:4px;*/
252
    /*-webkit-box-shadow: #000 0 0 9pt;*/
253
    /*-moz-box-shadow: #000 0 0 9pt;*/
254
/*}*/
255
.error {
256
    color: #f00 !important;
257
}
258

    
259
/* nested arrow inside error message. It's 100% CSS. No images. */
260
.error em {
261
    border: 10px solid;
262
    border-color: #E8FF6D transparent transparent;
263
    bottom: -17px;
264
    display: block;
265
    height: 0;
266
    left: 10px;
267
    position: absolute;
268
    width: 0;
269
}
270

    
271
/* input field that caused validation error */
272
.invalid {
273
    background-color: rgba(221, 233, 255, 0.898) !important;
274
}
275

    
276
#beforecreate {
277
    background-color: #FF9955;
278
    height: 32px;
279
    width: 13px;
280
}
281

    
282
.pane-top {
283
    height: 70px;
284
    position: relative;
285
    background: #EFF7FA 0px 0px;
286
    /*margin-bottom: -2px;*/
287
}
288

    
289
#machines-pane-top.empty {
290
    background: transparent;
291
}
292

    
293
#beforecreate {
294
    border-left: 16px solid #efefef;
295
    margin-left: -16px;
296
}
297

    
298
.create-container {
299
    line-height: 4em;
300
}
301

    
302
#createcontainer a {
303
}
304

    
305
#create {
306
    background-color: #FF7F2A;
307
    color: #000;
308
    cursor: pointer;
309
    text-decoration: none;
310
    font-size:100%;
311
}
312

    
313
#create:hover {
314
    background-color: #FF9955;
315
}
316

    
317
#console-header {
318
    height: 79px;
319
    margin-bottom:15px;
320
    background: url("../images/header-bg.png") repeat-x scroll 0 0 #FFFFFF;
321
}
322

    
323
.header-logo {
324
    padding-top: 28px;
325
}
326

    
327
div#footer-text a {
328
    color: #FFFFFF;
329
    text-decoration: none;
330
}
331

    
332
div#footer-text{
333
    color: #FFFFFF;
334
    font-size: 75%;
335
    padding-top: 10px;
336
}
337

    
338
#footer-bg {
339
    background: url("../images/footer-bg.png") no-repeat scroll 0 0 #4085A5;
340
    background-position:right;
341
}
342

    
343
.modal {
344
    background-color:#fff;
345
    display:none;
346
    width:30em;
347
    padding:1em;
348
    text-align:left;
349
}
350

    
351
/* server wizard scrollable root element and network wizard */
352
#wizard, #networks-wizard {
353
    font-size:75%;
354
    height:425px;
355
    width:453px;
356
    overflow:hidden;
357
    position:absolute !important;
358
}
359

    
360
/* scrollable items */
361
#wizard .items {
362
    width:20000em;
363
    clear:both;
364
    position:absolute;
365
    display:block;
366
    padding: 0;
367
    margin: 0;
368
    border:none;
369
    background:none;
370
}
371

    
372
/* single item */
373
#wizard .page, #networks-wizard div.container {
374
    padding: 0px 40px 20px 15px;
375
    width:447px;
376
    float:left;
377
    display:block;
378
    border:none;
379
    background-color: transparent;
380
}
381

    
382
#networks-wizard div.container {
383
    background-color: #ECF4F8;
384
    width:400px;
385
    height: 180px;
386
    margin-bottom:50px;
387
}
388

    
389
/* title */
390
#wizard h2, #networks-wizard h2 {
391
    color: #FF7B24;
392
    font-size: 100%;
393
    font-style: italic;
394
    font-weight: bold;
395
    margin-left: 37px;
396
    margin-top: 17px;
397
}
398

    
399
#networks-wizard h2 {
400
    margin-top: 15px;
401
}
402

    
403
#wizard li {
404
    margin-bottom:1.2em;
405
}
406

    
407
#wizard .pane li {
408
    margin: 0;
409
}
410

    
411
#wizard label {
412
    font-size:120%;
413
    display:block;
414
    clear: both;
415
}
416

    
417
#wizard label strong {
418
    position:relative;
419
    top:-1px;
420
    font-size: 80%;
421
    font-weight: normal;
422
}
423

    
424
#wizard label em {
425
    font-size:75%;
426
    color:#666;
427
    font-style:normal;
428
}
429

    
430
#wizard .text {
431
    width: 270px;
432
    padding: 5px;
433
    margin-top: 10px;
434
    border: 1px solid #ccc;
435
    color: #456;
436
    letter-spacing: 1px;
437
}
438

    
439
#wizard select {
440
    border:1px solid #ccc;
441
    width:94%;
442
    padding:4px;
443
    display: none;
444
}
445

    
446
#wizard .double label {
447
    width:50%;
448
    float:left;
449
}
450

    
451
#wizard .double .text {
452
    width:93%;
453
}
454

    
455
#wizard .clearfix {
456
    clear:left;
457
    padding-top:10px;
458
}
459

    
460
#wizard .right {
461
    float:right;
462
}
463

    
464
#wizard .error {
465
    border:1px solid red;
466
}
467

    
468
#wizard a:hover div.image {
469
    background-color: #C5DEE9;
470
}
471

    
472
.selecteddiv {
473
    background-color: #C5DEE9 !important;
474
}
475

    
476
#wizard label a:hover strong {
477
    color: black;
478
}
479

    
480
#wizard div.image span.size {
481
    font-size: 75%;
482
    color: #666;
483
}
484

    
485
#wizard div.image .radio {
486
    float: left;
487
    margin-top: 10px;
488
}
489

    
490
#wizard div.image span.image-id, #wizard div.image span.description {
491
    font-size: 75%;
492
    color: #666;
493
    font-weight: normal;
494
    display:inline;
495
}
496

    
497
#wizard a:hover div.image span.image-id, #wizard a:hover div.image span.description, #wizard a:hover div.image span.size {
498
    color: black;
499
}
500

    
501
#wizard .cost {
502
    color: #79A4C1;
503
    margin-top: 40px;
504
    clear:both;
505
    margin-left: 15px;
506
    font-size: 95%;
507
}
508

    
509
#wizard #status {
510
    height: 50px;
511
    background-color: #4085A5;
512
}
513

    
514
#wizard .headernumber {
515
    font-size: 410%;
516
}
517

    
518
#wizard .headerbody {
519
    font-size: 120%;
520
    font-weight: normal;
521
    display: inline;
522
    top: -15px;
523
    position: relative;
524
}
525

    
526
#wizard .first {
527
    left: -10px;
528
}
529

    
530
#wizard .checked {
531
    color: #64a6c4 !important;
532
}
533

    
534
#wizard .li-2 {
535
    margin-top: -1px !important;
536
}
537

    
538
#wizard .img-check {
539
    margin-bottom: 8px;
540
    margin-left: -8px;
541
}
542

    
543
#wizard .li-1 .img-check {
544
    margin-left: 2px;
545
}
546

    
547
#wizard .topruler, #networks-wizard .topruler, #wizard .bottomruler, #networks-wizard .bottomruler {
548
    background-color: #CDE2EC;
549
    color: #CDE2EC;
550
    border: 0 none;
551
    height: 4px;
552
    margin-left: -1px;
553
    width: 447px;
554
    margin-bottom: 6px;
555
    margin-top: 4px;
556
}
557

    
558
#wizard .bottomruler, #networks-wizard .bottomruler {
559
    margin-top:6px;
560
}
561

    
562
#networks-wizard .topruler, #networks-wizard .bottomruler {
563
    width: 455px;
564
    float: left;
565
}
566

    
567
#wizard #cancel, #networks-wizard .cancel {
568
    background-color: #4085A5;
569
    border-color: #4085A5;
570
    text-align: center !important;
571
}
572

    
573
#wizard #cancel:hover, #networks-wizard .cancel:hover {
574
    background-color: #7DB4CD;
575
    border-color: #7DB4CD;
576
}
577

    
578
#wizard #start, #networks-wizard .create {
579
    text-align: center;
580
    background-color: #FF7F2A;
581
    border-color: #FF7F2A;
582
}
583

    
584
:focus {
585
    outline: none;
586
    -moz-outline-style: none;
587
}
588

    
589
#wizard .img-next {
590
    margin: 0 -4px -1px 8px;
591
}
592

    
593
#wizard .img-prev {
594
    margin: 0 8px -1px -4px;
595
}
596

    
597
#networks-wizard .create {
598
    float:right;
599
    width: 140px;
600
}
601

    
602
.overlay-networks-create .form-action {
603
  float: left;
604
}
605

    
606
.overlay-networks-create .fixpos {
607
  margin-top: 3px;
608
}
609

    
610
.overlay-networks-create .col-fields.bordered {
611
  border-bottom: 1px solid #CCC;
612
  margin-bottom: 10px;
613
  padding-bottom: 10px;
614
}
615

    
616
.overlay-networks-create .col-fields {
617
  margin-bottom: 10px;
618
}
619

    
620
form .fields-desc {
621
  font-size: 0.8em !important; 
622
  margin: 5px 0;
623
  padding-bottom: 0 !important;
624
}
625

    
626
.overlay-networks-create form select {
627
  padding: 1px;
628
}
629

    
630
.overlay-networks-create #network-create-subnet-custom {
631
  width: 125px;
632
}
633

    
634
.overlay-networks-create .col-fields .form-field {
635
  float: left;
636
  margin-right: 20px;
637
}
638

    
639
.overlay-networks-create .col-fields .right-field {
640
  float: right;
641
  width: 210px;
642
  margin-right: 0px;
643
}
644

    
645
.overlay-networks-create .use-dhcp {
646
  width: auto;
647
}
648

    
649
#wizard #start:hover, #networks-wizard .create:hover {
650
    background-color: #FF9651;
651
    border-color: #FF9651;
652
}
653

    
654
#wizard .separator-end {
655
    position: absolute;
656
    background-color: #387693;
657
    height: 5px;
658
    margin-left: -14px;
659
    margin-top: 382px;
660
    width: 550px;
661
}
662

    
663
.page ul {
664
    height: 270px;
665
    overflow: auto;
666
}
667

    
668
.panes ul.pane {
669
    height: 220px;
670
}
671

    
672
#wizard #tabscontainer {
673
    background-color: #CDE2EC;
674
    height: 20px;
675
    width: 448px;
676
}
677

    
678
.page ul.tabs {
679
    overflow: hidden;
680
    height: auto;
681
    margin-bottom: -1px;
682
    margin-top: -1px;
683
}
684

    
685
.page ul.tabs li {
686
    float: right;
687
    margin: 0 0.2em;
688
}
689

    
690
#status li {
691
    float: left;
692
    color: #387693;
693
    padding: 0 1px 0 37px;
694
    bottom: 0px;
695
}
696

    
697
#status li.active .headernumber {
698
    color: #FFFFFF;
699
}
700

    
701
#status li.active .headerbody {
702
    color: #FFFFFF;
703
}
704

    
705
div.image-container {
706
    border-bottom: 1px solid #CCCCCC;
707
    margin-left: 10px;
708
    margin-right: 10px;
709
}
710

    
711
#page2-container {
712
    background-color: #ECF4F8;
713
    height: 193px;
714
    margin-top: 3px;
715
    padding-top: 25px;
716
}
717

    
718
#page3-container {
719
    background-color: #ECF4F8;
720
    height: 245px;
721
    margin-bottom: 32px;
722
    padding-left: 50px;
723
}
724

    
725
/* slider root element */
726
.slider {
727
    border: 1px solid #666;
728
    cursor: pointer;
729
    display: inline !important;
730
    float: left;
731
    margin: 5px 0 20px 10px;
732
    position: relative;
733
    width: 250px;
734
}
735

    
736
.sliders {
737
    float:left;
738
    width: 40px;
739
    margin-left: 10px;
740
    margin-top: 3px;
741
}
742

    
743
.units {
744
    padding-left:10px;
745
}
746

    
747
.slider-container {
748
    padding-bottom: 15px;
749
    margin-left: 5px;
750
}
751

    
752
/* drag handle */
753
.handle {
754
    -moz-box-shadow: 0 0 2px #000000;
755
    background: url("../images/h30.png") repeat-x scroll 0 0 #FFFFFF;
756
    border: 1px solid #000000;
757
    cursor: move;
758
    display: block;
759
    height: 10px;
760
    margin-top: -8px;
761
    position: absolute;
762
    width: 8px;
763
}
764

    
765
/* progress bar (enabled with progress: true) */
766
.progress {
767
    height: 3px;
768
    background-color: #387693;
769
}
770

    
771
/* the input field */
772
.range {
773
    border: 1px solid #387693;
774
    float: left;
775
    font-size: 100%;
776
    margin: -3px 0 0 15px;
777
    padding: 2px 5px 2px 0;
778
    text-align: right;
779
    width: 50px;
780
}
781

    
782
.selectedrange {
783
    border-color: #5599FF;
784
}
785

    
786
#credits-indicator {
787
    background-color: #ECF4F8;
788
    float: none;
789
    margin: 0 0 0 10px;
790
    border: 1px solid #387693;
791
    color: #387693;
792
}
793

    
794
/* machines */
795
.machine-container {
796
    position:relative;
797
}
798

    
799
.icon .machine-container.last .machine-data-cont, .machine-container:last-child .machine-data-cont {
800
    margin-bottom:0;
801
    padding-bottom: 0;
802
    border-bottom: none;
803
}
804

    
805
.icon .machine-container.last .machine-data, .machine-container:last-child .machine-data {
806
    border-bottom: none;
807
}
808

    
809
.icon .machine-container .subtitle {
810
    font-size: 0.70em;
811
    color: #222;
812
    line-height: 23px;
813
    height: 23px;
814
    margin-top: -5px;
815
}
816

    
817
.icon .machine-container .subtitle {
818
    
819
}
820

    
821
.icon .machine-container .info {
822
    margin-top: 2px;
823
    height: 17px;
824
}
825

    
826
.icon .machine-container .building-progress {
827
    vertical-align: top;
828
}
829

    
830
.icon .build-progress {
831
    margin-left: -3px;
832
}
833

    
834
#machinesview .build-progress .message {
835
  padding: 3px;
836
}
837

    
838
#machinesview .build-progress .btn:hover {
839
  background-color: #387693;
840
}
841

    
842
#machinesview .column1 .build-progress .btn {
843
    margin-top: 5px;
844
    display: inline-block;
845
}
846

    
847
#machinesview .build-progress .btn {
848
    cursor: pointer;
849
    background-color: #5e1616;
850
    color: #FFF;
851
    padding: 3px;
852
}
853

    
854
.ip-version-label {
855
    font-size: 0.8em;
856
    padding: 0.3em;
857
    background-color: #C4DDE9;
858
    color: #000;
859
}
860

    
861
.icon .machine-data {
862
    width: 520px;
863
    float: left;
864
    background-color: transparent;
865
}
866

    
867
.icon .machine-info {
868
    padding: 10px 0;
869
}
870

    
871
.icon .machine-details .name {
872
    height: 24px;
873
}
874

    
875
.icon .machine-connect {
876
    width: 80px;
877
    float: left;
878
}
879

    
880
.icon .machine-details {
881
    width: 310px;
882
    float: left;
883
    margin-top: -5px;
884
}
885

    
886
.icon .state {
887
    font-size: 98%;
888
    width: 120px;
889
    margin-right: 10px;
890
    float: left;
891
    height: 55px;
892
    margin-top: -5px;
893
}
894

    
895
.vm-actions {
896
    position: relative;
897
}
898

    
899
.icon .vm-actions {
900
    /*display: none;*/
901
}
902

    
903
.icon .vm-actions, .network .vm-actions {
904
    width: 180px;
905
    height: 76px;
906
    float: left;
907
}
908

    
909
.network .vm-actions {
910
    width: 185px;
911
}
912

    
913
.icon .machine-container:hover .machine-data {
914
    background-color:#A1C8DB !important;
915
}
916

    
917
.icon .machine-container:hover .vm-actions {
918
    display: block;
919
}
920

    
921
.vm-actions {
922
    font-size: 75%;
923
}
924

    
925
.vm-actions a {
926
    color: black;
927
    height: 15px;
928
    margin: 0 0 1px 4px;
929
    padding: 1px;
930
    padding-left: 8px;
931
    display: block;
932
}
933

    
934
.vm-actions a:hover {
935
    background-color:#A1C8DB;
936
    color: #fff;
937
    border-left: 4px solid #7DB4CD;
938
    padding-left: 4px;
939
}
940

    
941
.vm-actions a.selected {
942
    color: #FF7F2A !important;
943
}
944

    
945
.vm-actions a.selected {
946
    background-color:transparent;
947
}
948

    
949
.vm-actions .action-container {
950
    position: relative;
951
}
952

    
953
.vm-actions .action-container .confirm_single {
954
    position: absolute;
955
    right: -20px;
956
    top: -2px;
957
}
958

    
959
div.list div.actions a.enabled.destroy {
960
}
961

    
962
.vm-actions .action-container.destroy {
963
    position: absolute;
964
    bottom: -1px;
965
    width: 100%;
966
    left: 0px;
967
    background: transparent;
968
}
969

    
970
.vm-actions .action-container.destroy a {
971
}
972

    
973
.icon .light-background .machine-data, div.network.light-background, div.network.expand {
974
    background-color:#aed2e3 !important;
975
}
976

    
977
.single .light-background {
978
    background-color:#aed2e3;
979
}
980

    
981
.icon .machine-data-cont {
982
    margin-bottom: 5px;
983
    padding-bottom: 5px;
984
    border-bottom: 1px solid #D1E7F0;
985
    width: 520px;
986
    float: left;
987
}
988
.icon .terminated .machine-data-cont {
989
    border-color: #B6CED6;
990
}
991

    
992
.machine a {
993
    font-weight: normal;
994
    text-decoration: none;
995
}
996

    
997
.machine span.name, .machine span.ip {
998
    font-size: 75%;
999
    color: black;
1000
    margin-top: 6px;
1001
}
1002

    
1003
.machine span.name {
1004
    font-weight: bold;
1005
}
1006

    
1007
.oldValue {
1008
    display:none;
1009
}
1010

    
1011
.state {
1012
}
1013

    
1014
.state div {
1015
    text-align: right;
1016
    margin-right: 3px;
1017
}
1018

    
1019
/* icon view actions */
1020
div.machine div.actions a.shutdown-padding {
1021
    margin-bottom: 22px;
1022
}
1023

    
1024
div.actions a.enabled:hover{
1025
    color: black !important;
1026
    text-decoration: underline;
1027
    display: block;
1028
}
1029

    
1030
div.machine:hover .actions a {
1031
    visibility: visible;
1032
}
1033

    
1034
div.machine div.display a{
1035
    visibility: visible;
1036
}
1037

    
1038
div.machine div.actions .disabled {
1039
    display: none;
1040
}
1041

    
1042
div.single-container div.vm-actions .disabled {
1043
    display: none;
1044
}
1045

    
1046
div.machine div.actions .disabled {
1047
    display: none;
1048
}
1049

    
1050
div.connect-arrow {
1051
    background: url("../images/connect-arrow.png") no-repeat;
1052
    height: 28px;
1053
    width:14px;
1054
    position: absolute;
1055
    display: none;
1056
}
1057

    
1058
.machine div.connect-arrow {
1059
    display: none;
1060
    left: -3px;
1061
    position: absolute;
1062
    top: 9px;
1063
}
1064

    
1065
div.connect-arrow:hover, div.connect-arrow.border-hover, div.connect-arrow-ie, div.connect-arrow.border-ie {
1066
    cursor: pointer;
1067
    background: url("../images/connect-arrow-hover.png") no-repeat;
1068
    height: 28px;
1069
    width:26px;
1070
}
1071

    
1072
div.connect-border {
1073
    opacity: 0.8;
1074
    filter: alpha(opacity = 80);
1075
    background-color:#4fe0c3;
1076
    height:28px;
1077
    width: 12px;
1078
    position: absolute;
1079
    display: none;
1080
}
1081

    
1082
div.connect-border:hover {
1083
    cursor: pointer;
1084
}
1085

    
1086
.machine div.connect-border {
1087
    display: none;
1088
    left: -15px;
1089
    position: absolute;
1090
    top: 9px;
1091
}
1092

    
1093
.standard .machine .logo {
1094
    float: left;
1095
    width: 50px;
1096
    height: 54px;
1097
    margin: 1px 14px 0;
1098
}
1099
.machine .logo {
1100
    background-image: url("../images/icons/machines/medium/unknown-sprite.png");
1101
    background-repeat: no-repeat;
1102
    cursor: pointer;
1103
}
1104

    
1105
.standard .machine .single-image-state1 {
1106
    background-position: 0px 0;
1107
}
1108

    
1109
.standard .machine .single-image-state3 {
1110
    background-position: -100px 0;
1111
}
1112

    
1113
.standard .machine .single-image-state4 {
1114
    background-position: -150px 0;
1115
}
1116

    
1117
.standard .machine .single-image-state2 {
1118
    background-position: -50px 0;
1119
}
1120

    
1121
.standard .running .machine .logo {
1122
   cursor: pointer;
1123
}
1124

    
1125
.list .machine img {
1126
    margin: 0;
1127
}
1128

    
1129
.icon div.ip, .icon div.ips {
1130
    font-size: 75%;
1131
}
1132

    
1133
.icon div.indicators {
1134
    float: right;
1135
}
1136

    
1137
div.indicators {
1138
    margin-right: 2px !important;
1139
    cursor: pointer;
1140
}
1141

    
1142
div.indicator1, div.indicator2, div.indicator3, div.indicator4 {
1143
    background-color: #63cf1c;
1144
    width:10px;
1145
    height:11px;
1146
    clear: none;
1147
    float:right;
1148
    -webkit-transition: background-color .75s ease-out;
1149
    -o-transition: background-color .75s ease-out;
1150
    -moz-transition: background-color .75s ease-out;
1151
    transition: background-color .75s ease-out;
1152
}
1153

    
1154
.view-separator {
1155
    color:#5F8DD3;
1156
}
1157

    
1158
.running.disabled {
1159
    background: transparent;
1160
}
1161

    
1162
.running-state .indicator1, .running-state .indicator2, .running-state .indicator3, .running-state .indicator4 {
1163
    background-color: #63cf1c;
1164
}
1165

    
1166
.rebooting-state .indicator1, .rebooting-state .indicator2, .rebooting-state .indicator3, .rebooting-state .indicator4 {
1167
    background-color: #d4aa00;
1168
}
1169

    
1170
.error-state .indicator1, .error-state .indicator2, .error-state .indicator3, .error-state .indicator4 {
1171
    background-color: #ff0000 !important;
1172
}
1173

    
1174
.terminated-state .indicator1, .terminated-state .indicator2, .terminated-state .indicator3, .terminated-state .indicator4 {
1175
    background-color: #5e1616;
1176
}
1177

    
1178
.build-state .indicator1, .build-state .indicator2, .build-state .indicator3, .build-state .indicator4 {
1179
    background-color: #FF7F2A;
1180
}
1181

    
1182
.destroying-state .indicator1, .destroying-state .indicator3, .destroying-state .indicator2, .destroying-state .indicator4 {
1183
    background-color: #4085a5 !important;
1184
}
1185

    
1186
.shutting-state .indicator1, .shutting-state .indicator3, .shutting-state .indicator2, .shutting-state .indicator4 {
1187
    background-color: #940606;
1188
}
1189

    
1190
.starting-state .indicator1, .starting-state .indicator2, .starting-state .indicator3, .starting-state .indicator4 {
1191
    background-color: #9ed976;
1192
}
1193

    
1194
.network-indicator .indicator1, .network-indicator .indicator2, .network-indicator .indicator3, .network-indicator .indicator4 {
1195
    background-color: #63cf1c;
1196
}
1197

    
1198
.network-indicator.in-progress .indicator1, .network-indicator.in-progress .indicator2, .network-indicator.in-progress .indicator3, .network-indicator.in-progress .indicator4 {
1199
    background-color: #FF7F2A;
1200
}
1201

    
1202
.running, .terminated {
1203
    background: #EFF7FA repeat scroll 0 0;
1204
    padding-bottom: 15px;
1205
}
1206

    
1207
.running, #machinesview-list, .single {
1208
}
1209

    
1210
.terminated {
1211
    background:#DCE5E8  repeat scroll 0 0;
1212
    padding-top: 15px;
1213
    margin-top: 15px;
1214
}
1215

    
1216
span.rename {
1217
    background-repeat: no-repeat;
1218
    color: transparent;
1219
    font-size: 75%;
1220
    font-weight: normal;
1221
    margin-left: 10px;
1222
    padding-left: 10px;
1223
    text-align: left;
1224
    cursor: pointer;
1225
}
1226

    
1227
div.name:hover span.rename, span.rename_hovered {
1228
    color: #3D3D3D;
1229
    margin-top: 0.4em;
1230
    background-image: url("../images/pencil.png");
1231
    background-position: 0 3px;
1232
}
1233

    
1234
.machine div.info {
1235
    font-size: 75%;
1236
}
1237

    
1238
div.machine:hover div.info-header, div.machine:hover div.toggler div.down {
1239
    background-color: #84b7d0;
1240
}
1241

    
1242
div.machine div.info-label.darker, .single div.tags-label.darker, div.network .darker {
1243
    background-color: #5CA1C0;
1244
}
1245

    
1246
.machine div.info div.info-label {
1247
    font-size: 75%;
1248
    height:16px;
1249
    width: 30px;
1250
    padding: 1px 0 0 5px;
1251
}
1252

    
1253
.machine div.info div.toggler, .single div.tags div.toggler, div.network div.toggler {
1254
    width:15px;
1255
    height:17px;
1256
    margin-top: -11px;
1257
    margin-left: 37px;
1258
}
1259

    
1260
div.network div.toggler {
1261
    margin-left: 90px;
1262
}
1263

    
1264
.machine div.info div.down {
1265
    background: url(../images/down-arrow.png) no-repeat scroll 1px 1px;
1266
}
1267

    
1268
.single div.tags div.down {
1269
    background: url(../images/down-arrow.png) no-repeat scroll 2px 2px;
1270
}
1271

    
1272
.network div.network-machines div.down {
1273
    background: url(../images/down-arrow.png) no-repeat scroll 2px 2px;
1274
}
1275

    
1276
.network div.network-machine div.firewall div.down {
1277
    background: url(../images/down-arrow.png) no-repeat scroll 2px 2px;
1278
}
1279

    
1280
.machine div.info div.up {
1281
    background: url(../images/up-arrow.png) no-repeat scroll 1px 0;
1282
}
1283

    
1284
.single div.tags div.up {
1285
    background: url(../images/up-arrow.png) no-repeat scroll 2px 2px;
1286
}
1287

    
1288
.network div.network-machines div.up {
1289
    background: url(../images/up-arrow.png) no-repeat scroll 2px 2px;
1290
}
1291

    
1292
.network div.network-machine div.firewall div.up {
1293
    background: url(../images/up-arrow.png) no-repeat scroll 2px 2px;
1294
}
1295

    
1296
button {
1297
    background-color: #87AADE;
1298
    border: 1px solid #87AADE;
1299
    color: #FFFFFF;
1300
    cursor: pointer;
1301
    height: 23px;
1302
    width: 120px;
1303
}
1304

    
1305
button.next {
1306
    background-color: #4085A5;
1307
    border-color: #4085A5;
1308
    text-align: right;
1309
}
1310

    
1311
button.next:hover {
1312
    background-color: #7DB4CD;
1313
    border-color: #7DB4CD;
1314
}
1315

    
1316
button.prev {
1317
    background-color: #4085A5;
1318
    border-color: #4085A5;
1319
    margin-left: -1px;
1320
    text-align: left;
1321
}
1322

    
1323
button.prev:hover {
1324
    background-color: #7DB4CD;
1325
    border-color: #7DB4CD;
1326
}
1327

    
1328
.image-logo {
1329
    float: left;
1330
    margin-right: 1em;
1331
    margin-left: 1.5em;
1332
    margin-top: 4px;
1333
}
1334

    
1335
.icon div.image {
1336
    clear: both;
1337
    display: block;
1338
    margin-bottom: 3px;
1339
    margin-top: 3px;
1340
    padding: 5px;
1341
}
1342

    
1343
div#view-select {
1344
    clear: both;
1345
    color: white;
1346
    position: absolute;
1347
    right: 15px;
1348
    top: 15px;
1349
}
1350

    
1351
a.machines_view_link {
1352
    text-decoration: none;
1353
    font-size: 0.7em;
1354
    padding: 4px;
1355
    padding-right: 8px;
1356
    color: #5CA1C0;
1357
    margin-left: 5px;
1358
    background-repeat: no-repeat;
1359
    background-color: #C9DFEA;
1360
}
1361

    
1362
a.machines_view_link span {
1363
    float: left;
1364
}
1365

    
1366
a.machines_view_link span.ico {
1367
    width: 17px;
1368
    height: 15px;
1369
    margin-right: 10px;
1370
    background-position: -36px 0;
1371
}
1372

    
1373
a.machines_view_link:hover {
1374
    background-color: #A1C8DB;
1375
    color: #fff;
1376
}
1377
a.machines_view_link:hover span.ico {
1378
    background-position: -0px 0px;   
1379
}
1380

    
1381
a.machines_view_link.activelink span.ico {
1382
    background-position: -18px 0px;
1383
}
1384
a.machines_view_link.activelink {
1385
    color: #fff;
1386
    background-color: #5CA1C0;
1387
}
1388

    
1389
div#view-select a {
1390
    display: block;
1391
    float: left;
1392
}
1393

    
1394
a#list:hover {
1395
    background: #5f8dd3;
1396
}
1397

    
1398
a#machines_view_icon_link:active, a#machines_view_list_link:active {
1399
    color:white;
1400
}
1401

    
1402
a#machines_view_icon_link span.ico {
1403
    background-image: url("../images/icon-view.png");
1404
}
1405

    
1406
a#machines_view_list_link span.ico {
1407
    background-image: url("../images/list-view.png");
1408
}
1409

    
1410
a#machines_view_single_link span.ico {
1411
    background-image: url("../images/single-view.png");
1412
}
1413

    
1414
#machinetype {
1415
    background-color: #CDE2EC;
1416
    height: 25px;
1417
    margin-bottom: 0px !important;
1418
}
1419

    
1420
div.machine-type {
1421
    float: left;
1422
    margin: 4px 18px 20px;
1423
}
1424

    
1425
.machine-type .active {
1426
    color: #FFFFFF
1427
}
1428

    
1429
div.machine-type label.disabled {
1430
    color: #aaa !important;
1431
}
1432

    
1433
#machinesview {
1434
}
1435

    
1436
#machines-pane {
1437
}
1438

    
1439
.list#machinesview {
1440
    margin-left: -20px;
1441
    display:none;
1442
}
1443

    
1444
#machinesview-list.list {
1445
    background: #EFF7FA  repeat scroll 0 0;
1446
    padding-left: 15px;
1447
    padding-bottom: 15px;
1448
}
1449

    
1450
#machinesview_content {
1451
    display:none;
1452
}
1453

    
1454
.list-machines {
1455
    min-width: 515px;
1456
}
1457

    
1458
#emptymachineslist {
1459
    background-color: #6BA9C6;
1460
    color: #A0A0A0;
1461
    display: none;
1462
    padding: 65px 150px 35px;
1463
    text-align: justify;
1464
    margin-top: -70px;
1465
}
1466

    
1467
#welcomeheader {
1468
    color:white;
1469
    text-align: center;
1470
}
1471

    
1472
.welcomebody {
1473
    color: white;
1474
    font-size:80%;
1475
}
1476

    
1477
.welcomebody a {
1478
    color: white;
1479
}
1480

    
1481
.welcomefooter {
1482
    color: white;
1483
    font-size:60%;
1484
}
1485

    
1486
.welcomefooter a {
1487
    color: white;
1488
}
1489

    
1490
.emptycreatecontainer {
1491
    margin-left: 430px !important;
1492
    position: absolute;
1493
    margin-top: 5px !important;
1494
    width: 180px;
1495
    background-color: #CCCCCC;
1496
    padding: 5px;
1497
    padding-left: 10px;
1498
}
1499

    
1500
.emptycreate {
1501
    margin: 20px 10px 5px 0 !important;
1502
}
1503

    
1504
#createbody {
1505
    display:none;
1506
    font-size: 80%;
1507
}
1508

    
1509
div.list label img {
1510
    margin: 5px 5px -3px 0;
1511
}
1512

    
1513
div.list label {
1514
    color: #3D3D3D;
1515
    font-size: 75%;
1516
}
1517

    
1518
div.list .state {
1519
    margin-top: 7px;
1520
    margin-right: 10px;
1521
}
1522

    
1523
div.list table tbody {
1524
    margin-top: 8px;
1525
}
1526

    
1527
div.list table tr.checked td {
1528
    background-color: #A1C8DB !important;
1529
}
1530

    
1531
div.list table tr:hover td,
1532
div.list table tr.inactive:hover td,
1533
div.list table tr.error:hover td {
1534
    background-color: #A1C8DB;
1535
    color: #fff;
1536
}
1537

    
1538
div.list table td.name {
1539
    min-width: 170px;
1540
}
1541

    
1542
div.list table td.status {
1543
    font-size: 0.9em !important; 
1544
    text-align: right;
1545
    min-width: 90px;
1546
    color: #000;
1547
}
1548

    
1549
div.list table td.flavor {
1550
    font-size: 0.8em;
1551
}
1552

    
1553
div.list table td {
1554
    border-bottom: 1px solid #DDD;
1555
}
1556

    
1557
div.list table tr.error td.status {
1558
    color: #800000 !important;
1559
    font-weight: bold;
1560
}
1561

    
1562
div.list table tr.error td {
1563
    background-color: #DCE5E8;
1564
}
1565

    
1566
div.list table tr.inactive td {
1567
    background-color: #DCE5E8;
1568
}
1569

    
1570
div.list .stopped {
1571
    margin-top: 8px;
1572
}
1573

    
1574
/* root element for tabs  */
1575
#wizard ul.tabs {
1576
    margin-right: -1px;
1577
    float: right;
1578
}
1579

    
1580
#wizard div.panes {
1581
    height: 247px;
1582
    clear:both;
1583
    margin-top: 3px;
1584
}
1585

    
1586
.typebody {
1587
    font-size: 80%;
1588
    font-weight: normal;
1589
    position: relative;
1590
    top: -3px;
1591
}
1592

    
1593
.typehover {
1594
    color: #FFFFFF;
1595
}
1596

    
1597
#label-name {
1598
    margin-top: 10px;
1599
}
1600

    
1601
/* single tab */
1602
#wizard ul.tabs li {
1603
    margin-bottom: 0;
1604
    list-style-type:none;
1605
    float: left;
1606
}
1607

    
1608
/* link inside the tab. uses a background image */
1609
#wizard ul.tabs a {
1610
    display:block;
1611
    padding: 0.2em 0.5em 0.1em 0.4em;
1612
    text-decoration:none;
1613
    color: #FFFFFF;
1614
    position:relative;
1615
    top:1px;
1616
    outline:0;
1617
    background-color: transparent;
1618
    text-align: center;
1619
    width: 100px;
1620
    white-space: nowrap;
1621
    height: 17px;
1622
}
1623

    
1624
#wizard ul.tabs a:hover {
1625
    color: #FFFFFF;
1626
    background-color:#4085A5;
1627
}
1628

    
1629
/* selected tab */
1630
#wizard ul.tabs a.current {
1631
    color: white;
1632
    background-color: #7DB4CD;
1633
    cursor: default;
1634
}
1635

    
1636
#wizard #standard-images {
1637
    background-color: #ECF4F8;
1638
}
1639

    
1640
div.list div.actions {
1641
    display: none;
1642
    clear: left;
1643
    float: right;
1644
    margin-right: 15px;
1645
    margin-top: 37px;
1646
    text-align: right;
1647
    width: 120px;
1648
}
1649

    
1650
div.list div.actions a {
1651
    clear: left;
1652
    color: #A1A1A1;
1653
    display: block;
1654
    font-size:75%;
1655
    margin-bottom: 2px;
1656
}
1657

    
1658
div.list div.actions a:hover {
1659
    background-color: transparent;
1660
}
1661

    
1662
div.list div.actions a.enabled {
1663
    color: #3D3D3D;
1664
}
1665

    
1666
div.list div.actions a.enabled:hover{
1667
    cursor: pointer;
1668
    color: black;
1669
    text-decoration: underline;
1670
}
1671

    
1672
div.list div.actions a.selected {
1673
    color: #FF7F2A !important;
1674
}
1675

    
1676
input.machine {
1677
    width: 13px;
1678
    height: 13px;
1679
    top: -1px;
1680
    overflow: hidden;
1681
}
1682

    
1683
.description-container {
1684
    display: inline-block;
1685
    position: relative;
1686
    width: 300px;
1687
}
1688

    
1689
#wizard .button-container {
1690
    height: 20px;
1691
}
1692

    
1693

    
1694
/* metadata dropdown combo */
1695
.meta-key {
1696
    margin-right: 18px;
1697
    float:left;
1698
}
1699

    
1700
/* notification box */
1701
#yes-no {
1702
    height: 150px;
1703
    z-index: 9999;
1704
    border-bottom: 5px solid #4085A5;
1705
}
1706

    
1707
#yes-no p, #yes-no button {
1708
    margin-top: 15px;
1709
}
1710

    
1711
#error-success, .notification-box {
1712
    z-index: 9999;
1713
    border-bottom: 5px solid #4085A5;
1714
    min-height: 150px;
1715
    top: 50px !important;
1716
    position: absolute;
1717
}
1718

    
1719
#error-success p, .notification-box p {
1720
    margin-top: 5px;
1721
}
1722

    
1723
.error-report {
1724
    display: none;
1725
}
1726

    
1727
#error-success .error-report {
1728
    position: absolute;
1729
    top: 140px;
1730
    right: 40px;
1731
}
1732

    
1733
.error .error-report {
1734
    display: block;
1735
}
1736

    
1737
#error-success .error-report .errormsg {
1738
    display: none;
1739
}
1740

    
1741
#error-success .error-report .success {
1742
    display: none;
1743
}
1744

    
1745
#error-success .error-report .sending {
1746
    display: none;
1747
}
1748

    
1749
#error-success .error-report .send-btn {
1750
    color: #4085A5;
1751
    text-decoration: underline;
1752
    cursor: pointer;
1753
}
1754

    
1755
#error-success strong, .notification-box strong {
1756
    color: #F49C1A;
1757
}
1758

    
1759
#error-success .close, .notification-box .close {
1760
    background-image: url("../images/close-popup.png");
1761
    background-repeat: no-repeat;
1762
    cursor: pointer;
1763
    height: 13px;
1764
    position: absolute;
1765
    right: 7px;
1766
    top: 9px;
1767
    width: 13px;
1768
}
1769

    
1770
.popup-header-error {
1771
    background-color: #800000 !important;
1772
}
1773

    
1774
.popup-border-error {
1775
    border-color: #800000 !important;
1776
    width:auto;
1777
}
1778

    
1779
.popup-details-error {
1780
    border: none !important;
1781
}
1782

    
1783
.popup-separator-error {
1784
    margin-bottom: 5px !important;
1785
}
1786

    
1787
#error-success .popup-header, .notification-box .popup-header {
1788
    background-color: #4085A5;
1789
    color: white;
1790
    font-size: 95%;
1791
    font-weight: normal;
1792
    height: 20px;
1793
    margin-left: -16px;
1794
    margin-top: -16px;
1795
    padding-bottom: 2px;
1796
    padding-left: 30px;
1797
    padding-top: 10px;
1798
    width: 482px;
1799
    margin-right:-16px;
1800
}
1801

    
1802

    
1803
#error-success.success h3 span.header-box, .notification-box h3 span.header-box {
1804
    background-color: #71c837;
1805
    display: block;
1806
    background-image: url("../images/save-green.png");
1807
    background-position: right 0;
1808
    background-repeat: no-repeat;
1809
    width: 80px;
1810
    padding: 3px 3px 3px 8px;
1811
    margin-top: -6px;
1812
    font-size: 90% !important;
1813
    margin-left: -11px;
1814
}
1815

    
1816
#error-success .popup-body, .notification-box .popup-body {
1817
    background: url("../images/popup-bg.png") repeat-x scroll 0 0 transparent;
1818
    margin-left: -16px;
1819
    margin-right: -16px;
1820
    margin-top: 1px;
1821
    min-height: 142px;
1822
    padding-top: 10px;
1823
}
1824

    
1825
#error-success .popup-body-inner, .notification-box .popup-body-inner {
1826
    background: url("../images/popup-inner-bg.png") repeat-x scroll 0 0 transparent;
1827
    font-size: 80%;
1828
    min-height: 120px;
1829
    margin-left: 20px;
1830
    padding-left: 15px;
1831
    width: 460px;
1832
}
1833

    
1834
#error-success .popup-separator, .notification-box .popup-seperator {
1835
    background-color: #74AEC9;
1836
    height: 1px;
1837
    font-size:1%;
1838
    width: 442px;
1839
    margin-bottom: 30px;
1840
}
1841

    
1842
#error-success .machine-now-building {
1843
    font-size: 95%;
1844
    padding-bottom: 7px;
1845
    padding-top: 10px;
1846
}
1847

    
1848
#error-success.success .machine-now-building {
1849
    padding-bottom: 14px !important;
1850
}
1851

    
1852
#error-success .password-container, .notification-box .password-container {
1853
    width: 430px;
1854
    padding: 5px;
1855
    border: 2px solid #75b54a;
1856
    background-color: #aade87;
1857
}
1858

    
1859
#error-success .password-header, .notification-box .password-header {
1860
    margin-bottom: 5px;
1861
}
1862

    
1863
#error-success .password, .notification-box .password {
1864
    color: #447821;
1865
}
1866

    
1867
#error-success .popup-details, .notification-box .popup-details {
1868
    border: 2px solid #FF7F2A;
1869
    float: left;
1870
    margin-left: 10px;
1871
    padding: 2px;
1872
}
1873

    
1874
#error-success.success .popup-details, .notification-box .popup-details {
1875
    border: none !important;
1876
    float: none !important;
1877
    margin-left: none !important;
1878
    margin-top: 10px;
1879
}
1880

    
1881
#error-success.success .popup-separator, .notification-box .popup-seperator {
1882
    margin-bottom: 14px !important;
1883
}
1884

    
1885
#error-success .write-password, .notification-box .write-password {
1886
    margin-bottom: 5px;
1887
    padding-left: 30px;
1888
}
1889

    
1890
#error-success .write-password-password, .notification-box .write-password-password {
1891
    padding-left: 30px;
1892
    color: #447821;
1893
    display: inline;
1894
    font-size: 110%;
1895
    font-weight: bold;
1896
}
1897

    
1898
#error-success .write-password-details, .notification-box .write-password-details {
1899
    font-size: 75%;
1900
}
1901

    
1902
.more-details {
1903
    display: block;
1904
}
1905

    
1906
.notification-box h3 span.header-box {
1907
    background: transparent;
1908
}
1909

    
1910
.notification-box .machine-now-building {
1911
    padding: 20px 0;
1912
}
1913

    
1914
.notification-box .header-box {
1915
    width: auto !important;
1916
}
1917

    
1918
.notification-box .password {
1919
    text-align: center;
1920
}
1921
.notification-box .password a:hover {
1922
    background-color: #447821;
1923
    color: #fff;
1924
}
1925

    
1926
.notification-box .password a {
1927
    padding: 0.2em;
1928
    text-align: center;
1929
    color: #447821;
1930
    font-weight: bold;
1931
    font-size: 1.2em;
1932
    text-decoration: none;
1933
}
1934

    
1935
.popup-details a:link, .popup-details a:visited {
1936
    color: black;
1937
}
1938

    
1939
.destroy .confirm_single .yes {
1940
    background-color: #880000;
1941
    color: #fff;
1942
}
1943

    
1944
.destroy .confirm_single .no {
1945
    background-color: #CC0000;
1946
    color: #880000;
1947
}
1948

    
1949
.destroy .confirm_single .yes:hover {
1950
    background-color:#CC0000;
1951
}
1952

    
1953
div.list div.actions a.selected#action-destroy {
1954
    color: #880000 !important;
1955
}
1956

    
1957
.vm-actions .destroy a#action-destroy.selected {
1958
    color: #880000 !important;
1959
}
1960

    
1961
/* Confirmation boxes */
1962
div.confirm_single, div.confirm_multiple, div.action_error {
1963
    display: none;
1964
    color: black;
1965
}
1966

    
1967
div.confirm_single button, div.confirm_multiple button, div.action_error button {
1968
    font-size: 100%;
1969
    cursor: pointer;
1970
    color: black;
1971
    height: 20px !important;
1972
}
1973

    
1974
div.confirm_single button {
1975
    border: none;
1976
    font-family: Arial, Helvetica, sans-serif;
1977
    line-height: 1em;
1978
    vertical-align: middle;
1979
    padding: 2px 6px;
1980
    padding-bottom:4px;
1981
    height: 15px;
1982
}
1983

    
1984
div.confirm_single button.yes {
1985
    width: 90px;
1986
    background-color:#FF7F2A;
1987
}
1988

    
1989
div.confirm_single button.yes:hover {
1990
    background-color: #FF9955;
1991
}
1992

    
1993
div.confirm_single button.no {
1994
    width: 20px;
1995
    margin-left:-5px;
1996
    background-color: #FF9955;
1997
    color:#d95d0a;
1998
}
1999

    
2000
div.confirm_single button.no:hover {
2001
    color: white;
2002
}
2003

    
2004
div.confirm_multiple_cont {
2005
    background-color: #406A7D;
2006
    margin-top: 0px;
2007
    padding: 3px;
2008
    border-top: 1px solid #444;
2009
    border-bottom: 1px solid #444;
2010
    padding-top:0px;
2011
    margin-top: -1px;
2012
}
2013

    
2014
div.confirm_reboot_required {
2015
}
2016

    
2017
div.confirm_multiple {
2018
    font-size: 65%;
2019
    z-index: 8000;
2020
    /*height: 28px;*/
2021
    width: 700px;
2022
    margin-top: 15px;
2023
}
2024

    
2025
div.confirm_multiple p {
2026
    float: left;
2027
    color: #FFF;
2028
    font-weight: bold;
2029
    margin: 7px 0 0 10px;
2030
}
2031

    
2032
#networks-pane {
2033
    display: none;
2034
}
2035

    
2036
#networks-pane div.confirm_multiple p {
2037
    margin: 7px 0 0 100px;
2038
}
2039

    
2040
div.confirm_multiple button {
2041
    float: right;
2042
    background-color: transparent;
2043
    border: 1px solid #5CA1C0;
2044
    margin: 4px 5px 0 0;
2045
}
2046

    
2047
div.confirm_multiple button.yes {
2048
    border-color: #FF7F2A;
2049
    padding: 0 12px;
2050
}
2051

    
2052
div.confirm_multiple button.yes:hover {
2053
    background-color: #FF7F2A;
2054
}
2055

    
2056
div.confirm_multiple button.no {
2057
    padding: 0px 16px;
2058
}
2059

    
2060
div.confirm_multiple button.no:hover {
2061
    background-color: #5CA1C0;
2062
}
2063

    
2064
div.action_error {
2065
    width: 120px;
2066
    margin: 14px 0 0 37px;
2067
    background-color: #981D1D;
2068
    font-size: 75%;
2069
    z-index:1;
2070
    color: #FFF;
2071
    position:absolute;
2072
    top: 0px;
2073
}
2074

    
2075
div.action_error .action-error-msg {
2076
    background-color: #fff;
2077
    color: #981D1D;
2078
    border: 1px solid #981D1D;
2079
    padding: 4px;
2080
}
2081
div.action_error .action-error-msg .action {
2082
    font-weight: bold;
2083
}
2084

    
2085
div.action_error .action-error-msg {
2086
    font-size: 0.8em;
2087
}
2088

    
2089
.action_error button {
2090
    width: 75px;
2091
    background-color: transparent;
2092
    border: 1px solid;
2093
    border-color: #981D1D;
2094
    color: #fff !important;
2095
    float: left;
2096
}
2097

    
2098
div.action_error button.details {
2099
    padding-right: 5px;
2100
    width: 100px;
2101
    border-bottom: 2px solid #981D1D;
2102
    border-right: 1px solid #981D1D;
2103
    border-left: 2px solid #981D1D;
2104
    background-color: #E24B4B;
2105
}
2106

    
2107
div.action_error button.close-action-error {
2108
    background-image: url("../images/option-action-remove.png");
2109
    background-color: #fff;
2110
    background-repeat: no-repeat;
2111
    background-position: center center;
2112
    width: 20px;
2113
    border-bottom: 2px solid #981D1D;
2114
    border-right: 2px solid #981D1D;
2115
    border-top: 1px solid #981D1D;
2116
}
2117

    
2118
div.action_error button.details:hover {
2119
    background-color: #FF7F2A;
2120
}
2121

    
2122
div#aboutuser{
2123
    float:right;
2124
    clear: both;
2125
    color: #FFFFFF;
2126
    font-size: 75%;
2127
    margin-top: -25px;
2128
}
2129

    
2130
div#user{
2131
    clear: both;
2132
    color: #FFFFFF;
2133
    font-size: 75%;
2134
    margin-top: 38px;
2135
    padding-bottom: 10px;
2136
    position: absolute;
2137
    right:0;
2138
}
2139

    
2140
div#user a{
2141
    color: #FFFFFF;
2142
    text-decoration: none;
2143
}
2144

    
2145
div#user a.current_lang {
2146
    color: #72ADC8;
2147
}
2148

    
2149
div#user .usermenu {
2150
    float: left;
2151
    cursor: pointer;
2152
    overflow: hidden;
2153
    padding-top: 5px;
2154
    margin-top: -6px;
2155
    position: relative;
2156
}
2157

    
2158
div#user .username {
2159
    display: block;
2160
    margin-right: 10px;
2161
    padding-right: 18px;
2162
    padding-left: 4em;
2163
    min-width: 70px;
2164
    text-align: right;
2165
    height: 20px;
2166
    background: url("../images/down-arrow-light.png") no-repeat right;
2167
    background-position: right 6px;
2168
    font-weight: normal;
2169
}
2170

    
2171
div#user .hovered {
2172
    background: #599EBD;
2173
    overflow: visible;
2174
    border-bottom: 1px solid #C7DFE9;
2175
}
2176

    
2177
div#user .hovered .username {
2178
    background-image: url("../images/down-arrow-lighter.png");
2179
}
2180

    
2181
div#user .active {
2182
    background-color: #BED5E0 !important;
2183
}
2184

    
2185
div#user .active .username {
2186
    color: #599EBD;
2187
    background-image: url("../images/down-arrow-lighter.png");
2188
}
2189

    
2190
div#user .useractions {
2191
    display: none;
2192
}
2193

    
2194
div#user .active .useractions {
2195
    display: block;
2196
    text-align: right;
2197
    color: #4085A5;
2198
    background-color: #D0E3ED;
2199
    margin-top:-1px;
2200
    border-top:1px solid #fff;
2201
    position: relative;
2202
    top: 1px;
2203
    box-shadow: 1px 1px 1px #aaa;
2204
    -moz-box-shadow: 1px 1px 1px #aaa;
2205
    -webkit-box-shadow: 1px 1px 1px #aaa;
2206
}
2207

    
2208
div#user .useractions li {
2209
    padding: 2px 10px;
2210
    border-bottom: 1px solid #efefef;
2211
    text-align: right;
2212
    display: block;
2213
    background-color: transparent;
2214
}
2215

    
2216
div#user .useractions li a {
2217
    color: #4085A5;
2218
    display: inline-block;
2219
    padding:5px 0;
2220
    padding-left: 30px;
2221
    padding-bottom: 6px;
2222
    background-repeat: no-repeat;
2223
    background-position: center left;
2224
}
2225

    
2226
div#user .useractions li.hovered {
2227
    background-color: #E1EFF6;
2228
}
2229

    
2230
div#user .useractions li.last {
2231
    border-bottom: none;
2232
}
2233

    
2234
div#user .useractions .logout a {
2235
    background-image: url("../images/icon-logout.png");
2236
}
2237

    
2238
div#user .langmenu {
2239
    float: left;
2240
    border-left: 1px solid #ffffff;
2241
    padding-left: 10px;
2242
    margin-left: -1px;
2243
}
2244

    
2245
div#user .langmenu .sep {
2246
    display: inline-block;
2247
    color: #72ADC8;
2248
}
2249

    
2250
.separator {
2251
    background-color: #74AEC9;
2252
    height: 10px;
2253
    width: 700px;
2254
    font-size: 1px;
2255
    line-height: 0px;
2256
}
2257

    
2258
#disks.separator {
2259
    background-color: #dea842;
2260
}
2261

    
2262
#networks.separator {
2263
    background-color: #6c535d;
2264
}
2265

    
2266
.network-machine h5 {
2267
    margin-bottom: 20px;
2268
    margin-top:0px;
2269
}
2270

    
2271
.machine-container .separator {
2272
    width: 508px;
2273
    height: 1px;
2274
    margin-top: 2px;
2275
    background-color: #5CA1C0;
2276
    margin-left: 13px;
2277
}
2278

    
2279
.editbuttons {
2280
    display: block;
2281
    clear: none;
2282
    width: 40px;
2283
    margin-right: 0px;
2284
    padding-top: 0px;
2285
    float: right;
2286
    cursor: pointer;
2287
    position: relative;
2288
    z-index: 1000;
2289
}
2290

    
2291
div.editbuttons div.save:hover, div.editbuttons div.cancel:hover {
2292
    background-color: #84b7d0;
2293
}
2294

    
2295
div.editbuttons div.cancel:hover {
2296
    background-image: url("../images/cancel-onhover.png");
2297
}
2298

    
2299
.editbuttons .cancel, .editbuttons .save {
2300
    background-repeat: no-repeat;
2301
    color: transparent;
2302
    height: 16px;
2303
    width: 16px;
2304
    float: left;
2305
}
2306

    
2307
.editbuttons .cancel {
2308
    background-image: url("../images/cancel.png");
2309
    margin-left: 3px;
2310
}
2311

    
2312
.editbuttons .save {
2313
    background-image: url("../images/save.png");
2314
    margin-left: 1px;
2315
}
2316

    
2317
.editbuttons img {
2318
    float:none !important;
2319
    margin: 0px !important;
2320
}
2321

    
2322
.network .namecontainer {
2323
    font-size: 1.1em;
2324
}
2325
.network .machine-name-div .namecontainer {
2326
    font-size: 1em;
2327
    font-weight: bold;
2328
}
2329

    
2330

    
2331
.namecontainer .name {
2332
    position: relative;
2333
}
2334

    
2335
.namecontainer .name .nametextbox, .network-rename-input {
2336
    z-index: 1000;
2337
}
2338

    
2339
.icon .nametextbox {
2340
    width: 255px;
2341
}
2342

    
2343
.nametextbox, .network-rename-input {
2344
    position: relative;
2345
    top: -3px;
2346
    font-size: 65%;
2347
    width: 240px;
2348
    border: 1px solid #aaaaaa;
2349
    padding: 2px;
2350
}
2351

    
2352
.large-spinner {
2353
    background: url("../images/icons/indicators/large/progress.gif");
2354
    margin-left: 298px;
2355
    margin-top: 0px;
2356
    height: 31px;
2357
    width: 49px;
2358
    position: absolute;
2359
    top: 200px;
2360
}
2361

    
2362
#machinesview-icon .large-spinner {
2363
    top: 170px;
2364
}
2365

    
2366
.list .large-spinner {
2367
    margin-top:-30px;
2368
}
2369

    
2370
.single .large-spinner {
2371
    margin-top: 50px;
2372
}
2373

    
2374
div#networks-container {
2375
    display: none;
2376
}
2377

    
2378
div#networks-container .large-spinner {
2379
    margin-top: 50px;
2380
}
2381

    
2382
/* tables in list view */
2383
div.list div.dataTables_filter {
2384
    font-size: 75%;
2385
    margin-bottom: 12px;
2386
}
2387

    
2388
div.list div.dataTables_filter input{
2389
    font-size: 100%;
2390
}
2391

    
2392
.dataTables_wrapper {
2393
    width: 515px;
2394
    padding-bottom: 40px;
2395
}
2396

    
2397
div.list table thead .sorting, div.list table thead .sorting_desc, div.list table thead .sorting_asc {
2398
    padding-right: 15px !important;
2399
}
2400

    
2401
div.list table {
2402
    width: 515px;
2403
    font-size: 75%;
2404
}
2405

    
2406
div.list table tbody td {
2407
    color: #3D3D3D;
2408
    padding:6px;
2409
    vertical-align: middle;
2410
    height: 20px;
2411
}
2412

    
2413
div.list table thead tr {
2414
    border-bottom: 1px solid #aaa;
2415
}
2416
div.list table thead tr th {
2417
    background-color: #CDE2EC;
2418
    background-image: url("../images/bg.gif");
2419
    background-repeat: no-repeat;
2420
    background-position: right 11px;
2421
    font-weight: normal;
2422
    border: 1px solid transparent;
2423
    border-bottom: none;
2424
    padding: 4px;
2425
    text-align: left;
2426
    vertical-align: middle;
2427
    cursor: pointer;
2428
}
2429

    
2430
div.list table thead .sorting_asc, div.list table thead .sorting_desc {
2431
    background-color: #5CA1C0;
2432
}
2433

    
2434
div.list table thead .sorting_asc {
2435
    background-image: url("../images/asc.gif");
2436
}
2437

    
2438
div.list table thead .sorting_desc {
2439
    background-image: url("../images/desc.gif");
2440
}
2441

    
2442
div.list table .selection div.expand-icon {
2443
    background-image: url("../images/asc.gif");
2444
    background-repeat: no-repeat;
2445
    position: relative;
2446
    cursor: pointer;
2447
    width: 15px;
2448
    height: 4px;
2449
    left: 19px;
2450
    top: -11px;
2451
}
2452

    
2453
ul.dropdown-selector {
2454
    background-color: #E6EEEE;
2455
    position: absolute;
2456
    margin-left: 1px;
2457
    display: block;
2458
    top: 255px;
2459
    font-size:75%;
2460
    width:40px;
2461
}
2462

    
2463
ul.dropdown-selector li {
2464
    padding: 4px;
2465
}
2466

    
2467
ul.dropdown-selector li:hover {
2468
    background-color: #5CA1C0;
2469
}
2470

    
2471
ul.dropdown-selector li a{
2472
    color: black;
2473
    text-decoration: none;
2474
}
2475

    
2476
div.list table span.imagetag {
2477
    display: none;
2478
}
2479

    
2480
div.list table thead .vmos {
2481
    width: 20px !important;
2482
    vertical-align:middle;
2483
}
2484

    
2485
div.list table .selection {
2486
    width: 20px !important;
2487
    text-align: left;
2488
    background-image: none;
2489
    padding-left: 6px;
2490
}
2491

    
2492
div.list table thead .vmflavor {
2493
    width: 100px !important;
2494
}
2495

    
2496
/* group column commented out for v0.5
2497
div.list table thead .vmgroup {
2498
    width: 40px !important;
2499
}
2500
*/
2501

    
2502
div.list table thead .vmstatus {
2503
    width: 50px !important;
2504
}
2505

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

    
2510
.spinner, .action-indicator {
2511
    clear: right;
2512
    float:right;
2513
    margin: 10px 6px 0 15px;
2514
}
2515

    
2516
.icon .spinner {
2517
    margin: 20px 4px 0 15px !important;
2518
}
2519

    
2520
.single .state .spinner {
2521
    margin: 20px 55px 0 15px !important;
2522
}
2523

    
2524
.action-indicator {
2525
    margin-right: 18px;
2526
}
2527

    
2528
.list span.action-indicator {
2529
    display: block;
2530
    width: 15px;
2531
    height: 20px;
2532
    margin: 0 !important;
2533
    float: none;
2534
}
2535

    
2536
.wave {
2537
    clear: right;
2538
    float:right !important;
2539
    margin: 10px 15px 0 15px !important;
2540
}
2541

    
2542
#networks-pane .spinner {
2543
    margin-top: 18px !important;
2544
}
2545

    
2546
.hidden {
2547
    display:none;
2548
}
2549

    
2550
div.actions a.selected, div.actions a.selected:hover, div.machine-actions a.selected, div.machine-actions a.selected:hover {
2551
    display:block !important;
2552
}
2553

    
2554
.action_error .message, .action_error .code {
2555
    display: none;
2556
}
2557

    
2558
.fixed {
2559
    bottom: 0;
2560
    position: fixed !important;
2561
}
2562

    
2563
/* Networks */
2564
#networks-pane {
2565
    background-color: transparent;
2566
    color: black;
2567
}
2568

    
2569
#networkscreate {
2570
}
2571

    
2572
.createbutton {
2573
    color: black;
2574
    background-color: #FF7F2A;
2575
    cursor: pointer;
2576
    padding: 7px 24px;
2577
    text-decoration: none;
2578
    border-left: 15px solid #FF9955;
2579
    margin-left: -15px;
2580
}
2581

    
2582
.createbutton.disabled, #networkscreate.disabled {
2583
  background-color: #888 !important;
2584
  border-left-color: #aaa !important;
2585
  cursor: help !important;
2586
  color: #ccc !important;
2587
}
2588

    
2589
#networkscreate:hover {
2590
    background-color: #FF9955;
2591
}
2592

    
2593
#createcontainer {
2594
}
2595

    
2596
#networks-container {
2597
}
2598

    
2599
#networks-pane .public-networks {
2600
    background: #EFF7FA repeat scroll 0 0;
2601
    margin: 0 0 0px;
2602
    padding: 0 0 15px 0px;
2603
}
2604

    
2605
#networks-pane .private-networks .network:last-child {
2606
    border-bottom: none;
2607
}
2608

    
2609
#networks-pane .private-networks {
2610
    background: #EFF7FA repeat scroll 0 0;
2611
    padding: 15px 20px 20px 0px;
2612
    margin-top: 18px;
2613
}
2614

    
2615
.private-networks .network-cont:last-child {
2616
    border-bottom: none;
2617
}
2618

    
2619
.private-networks .network-cont {
2620
    border-bottom: 1px solid #D1E7F0;
2621
    padding-bottom:5px;
2622
    margin-bottom: 5px;
2623
    width: 520px;
2624
}
2625

    
2626
.private-networks .network {
2627
    padding-top: 10px;
2628
    padding-bottom: 10px;
2629
}
2630

    
2631
#public-template, #private-template, #public-machine-template, #private-machine-template {
2632
    display:none;
2633
}
2634

    
2635
div.network-cont.disable-destroy .actions .destroy {
2636
    display: none !important;
2637
}
2638

    
2639
div.network-cont.pending .actions .action-add {
2640
    display: none;
2641
}
2642

    
2643
div.network-cont.in-error .actions .action-add {
2644
    display: none;
2645
}
2646

    
2647
div.network a.action-network-add {
2648
    display: none;
2649
}
2650

    
2651
div.network a.action-network-destroy {
2652
    margin-top: 32px !important;
2653
    width: 50px;
2654
    display: none;
2655
}
2656

    
2657
div.network {
2658
    clear: both;
2659
    padding: 5px 20px 5px 20px;
2660
    width: 480px;
2661
    position: relative;
2662
}
2663

    
2664
#private-template {
2665
    margin: 2px 0 0 -30px;
2666
}
2667

    
2668
div.network-placeholder {
2669
    margin-left: 33px;
2670
}
2671

    
2672
div.private-networks div.network-placeholder {
2673
}
2674

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

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

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

    
2694
.last div.network-cable {
2695
    height:85px;
2696
}
2697

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

    
2706
.last div.firewall-cable {
2707
    display:none;
2708
}
2709

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

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

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

    
2724
div.firewall {
2725
    margin-left: 60px;
2726
    margin-bottom: 3px;
2727
    margin-top: -3px;
2728
}
2729

    
2730
div.firewall .firewall-options {
2731
    float: left;
2732
}
2733

    
2734
div.machines-header, div.firewall-header {
2735
    background-color: #A1C8DB;
2736
    color: white;
2737
    cursor: pointer;
2738
    height: 17px;
2739
    width: 103px;
2740
}
2741

    
2742
 div.private-networks div.machines-header {
2743
    margin-top: -5px;
2744
}
2745

    
2746
div.network:hover div.machines-header, div.network:hover div.firewall-header {
2747
    background-color: #84b7d0;
2748
}
2749

    
2750
div.network-machine:hover div.firewall-header {
2751
    background-color: #5CA1C0;
2752
}
2753

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

    
2758
.state {
2759
}
2760

    
2761
.network .state {
2762
    font-size: 75%;
2763
    position: absolute;
2764
    right: 10px;
2765
    top: 5px;
2766
}
2767

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

    
2779
div.network div.machine-actions {
2780
    text-decoration: none;
2781
    float: right;
2782
    margin: -17px -180px 0 0;
2783
    font-weight: normal;
2784
    font-size: 75%;
2785
}
2786

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

    
2795

    
2796
div.network div.machine-actions a {
2797
    margin: 8px 0 0 8px;
2798
}
2799
div.network div.net-actions a {
2800
    margin: 0 0 8px 8px;
2801
    width: 168px;
2802
}
2803
div.network div.action-container {
2804
    bottom: auto;
2805
}
2806

    
2807
div.network div.net-actions .confirm_single {
2808
    position: absolute;
2809
    left: 96px;
2810
    width: 150px;
2811
    margin: 0 0px -5px 0;
2812
    font-size: 100%;
2813
}
2814

    
2815
div.network div.actions a:hover, div.network div.machine-actions a:hover {
2816
    display: block;
2817
    background-color:#A1C8DB;
2818
    opacity: 0.8;
2819
    filter: alpha(opacity = 80);
2820
}
2821

    
2822
div.network.expand .net-actions a {
2823
    visibility: visible;
2824
}
2825

    
2826
div.network:hover div.actions a, div.network-machine:hover div.machine-actions a {
2827
    visibility: visible;
2828
}
2829

    
2830
div.network div.machine-actions a.action-destroy.selected {
2831
    color: #880000 !important;
2832
}
2833

    
2834
div.network div.actions a.visible,
2835
div.network div.net-vm-actions a.visible,
2836
div.network div.actions a.selected:hover, div.network div.machine-actions a.selected {
2837
    background-color: transparent !important;
2838
    visibility: visible!important;
2839
}
2840

    
2841
div.network .net-vm-actions .confirm_single {
2842
    font-size: 100% !important;
2843
    margin-right: -20px !important;
2844
    position: absolute !important;
2845
    top: 7px;
2846
    right:0;
2847
}
2848

    
2849
div.network .nic-ip {
2850
  font-size: 0.8em;
2851
}
2852

    
2853
div.network div.display a {
2854
    visibility: visible;
2855
}
2856

    
2857
div.network-machine div.machine-actions a.action-details {
2858
    margin-top: 7px;
2859
    width: 168px;
2860
}
2861

    
2862
div.network .net-actions {
2863
    margin-right:5px !important;
2864
    margin-top:0px !important;
2865
    height: 80px !important;
2866
}
2867

    
2868
div.network .net-actions .action-container.destroy {
2869
    position: relative;
2870
    bottom: auto;
2871
}
2872

    
2873
div.network:hover {
2874
    background-color: #A1C8DB !important;
2875
}
2876

    
2877
.network-logos {
2878
    float:left;
2879
    padding-right: 10px;
2880
}
2881

    
2882
.network-logos:hover {
2883
    cursor: pointer;
2884
}
2885

    
2886
.state div {
2887
    text-align: right;
2888
    margin: 4px 1px -4px;
2889
}
2890

    
2891
.public-networks .state div {
2892
    margin-top: 4px;
2893
}
2894

    
2895
.private-networks .state div {
2896
    margin-top: 9px;
2897
    margin-bottom: -12px;
2898
}
2899

    
2900
.network .name-div {
2901
    margin-bottom: 15px;
2902
    margin-top: 0px;
2903
}
2904

    
2905
div.indicator {
2906
    clear: none;
2907
    float: right;
2908
    height: 11px;
2909
    margin: 3px -1px;
2910
    width: 10px;
2911
}
2912

    
2913
#private-networks {
2914
    margin-top: 20px;
2915
}
2916

    
2917
.private-networks .editbuttons {
2918
    margin-right: 117px;
2919
    margin-top: 1px;
2920
}
2921

    
2922
.private-networks div.confirm_single {
2923
    margin: 45px -219px -5px 0;
2924
    font-size: 80%;
2925
}
2926

    
2927
.private-networks .network-machine div.confirm_single {
2928
    margin: 0 -199px 0 0;
2929
}
2930

    
2931
.private-networks .state {
2932
}
2933

    
2934
.private-networks div.machines-list {
2935
    padding-top: 3px;
2936
}
2937

    
2938
span.rename-network, span.configure {
2939
    background-repeat: no-repeat;
2940
    color: transparent;
2941
    font-size: 75%;
2942
    font-weight: normal;
2943
    margin-left: 10px;
2944
    margin-right: 10px;
2945
    padding-left: 10px;
2946
    text-align: left;
2947
}
2948

    
2949
span.rename-network {
2950
    cursor: pointer;
2951
}
2952

    
2953
div.name-div:hover span.rename-network {
2954
    color: #3D3D3D;
2955
    margin-top: 0.4em;
2956
    background-image: url("../images/pencil.png");
2957
    background-position: 0 3px;
2958
}
2959

    
2960
div.network:hover a.rename {
2961
    color: #3d3d3d;
2962
}
2963

    
2964
.network-separator {
2965
    background-color: #5CA1C0;
2966
    height: 1px;
2967
    margin: 2px 0 0 -5px;
2968
    width: 480px;
2969
    font-size: 1%;
2970
    line-height: 1px;
2971
}
2972

    
2973
.network-contents {
2974
    margin-left: -4px;
2975
    width: 504px;
2976
    clear: both;
2977
    background: url("../images/orange-border.png") no-repeat;
2978
    background-position: 33px bottom;
2979
}
2980
.network-contents.last-expanded {
2981
    background-position-y: -2600px;
2982
}
2983

    
2984
.network-machine {
2985
    border-bottom: 1px solid #5CA1C0;
2986
}
2987
.network-machine:last-child {
2988
    border-bottom: none;
2989
}
2990

    
2991
.network-machine .state div {
2992
    text-align: left;
2993
}
2994

    
2995
.network-machine {
2996
    margin-left: 35px;
2997
    padding-bottom: 10px;
2998
    padding-left: 5px;
2999
    padding-top: 10px;
3000
    position: relative;
3001
}
3002

    
3003
.network-machine .ips {
3004
    position: absolute;
3005
    right:0;
3006
    top:40px;
3007
    text-align: right;
3008
    padding-right: 10px;
3009
    font-size: 70%;
3010
}
3011

    
3012
.network-machine .logo {
3013
    float:left;
3014
    padding-right: 10px;
3015
    position:relative;
3016
}
3017

    
3018
#networks-container .machine-name {
3019
    text-decoration: none !important;
3020
    margin-bottom: 10px;
3021
    color: #000000;
3022
    margin-top: -4px;
3023
}
3024

    
3025
.private-networks .separator {
3026
    background-color: #5CA1C0;
3027
    height: 1px;
3028
    margin: 3px 0 -2px -10px;
3029
    width: 485px;
3030
}
3031

    
3032
.network-machine .state {
3033
    margin-right: 18px;
3034
}
3035

    
3036
.network-machine .state .status {
3037
    margin-bottom: 4px;
3038
}
3039

    
3040
.machine-name .name {
3041
}
3042

    
3043
.machine-name .namecontainer {
3044
    line-height: 18px;
3045
    margin-bottom: 20px;
3046
}
3047

    
3048
div.network-machine:hover {
3049
    background-color: #84B7D0;
3050
}
3051

    
3052
.machines {
3053
    width: 416px;
3054
    margin-bottom: -8px;
3055
    margin-top: 10px;
3056
}
3057

    
3058
div.empty-network-slot {
3059
    height: 60px;
3060
}
3061

    
3062
div.network-remove-machine, div.network-add-machine {
3063
    background-color: #FB822F;
3064
    color: #bc4b00;
3065
    width:90px;
3066
    height:18px;
3067
    float:left;
3068
    margin:40px 0 0 -100px;
3069
}
3070

    
3071
span.remove-icon {
3072
    font-size: 80%;
3073
    margin-left: 15px;
3074
    position: relative;
3075
    bottom:1px;
3076
}
3077

    
3078
div.add-icon {
3079
    margin-left: 15px;
3080
    margin-top: -1px;
3081
    cursor: pointer;
3082
}
3083

    
3084
span.remove-icon:hover, span.add-icon:hover {
3085
    cursor:pointer;
3086
    color: #fff;
3087
}
3088

    
3089
div.network-add-machine {
3090
    margin:43px 0 0 0px;
3091
}
3092

    
3093
.firewall-on {
3094
    color: #42E342;
3095
}
3096

    
3097
.firewall-off {
3098
    color: #F82E2E;
3099
}
3100

    
3101
.firewall-content {
3102
    color: black;
3103
    font-size: 60%;
3104
    margin-left: 60px;
3105
    height: 55px;
3106
}
3107

    
3108
.firewall-content .checkbox-legends {
3109
    cursor: pointer;
3110
}
3111

    
3112
.firewall-content .checkbox-legends.current {
3113
    font-weight: bold;
3114
}
3115

    
3116
.firewall-content .checkbox-legends {
3117
    vertical-align: text-top;
3118
}
3119

    
3120
.checkbox-legends a {
3121
    color: black;
3122
    text-decoration: underline;
3123
    font-size: 100%;
3124
}
3125

    
3126
h5.machine-connect {
3127
    font-size: 75%;
3128
    margin-bottom: 3px;
3129
    height: 23px;
3130
}
3131

    
3132
.machine-connect span {
3133
    text-decoration: underline;
3134
}
3135

    
3136
h5.machine-connect span:hover {
3137
    cursor: pointer;
3138
}
3139

    
3140
.firewall-apply {
3141
    background-color: #4085a5;
3142
    border: medium none;
3143
    float: right;
3144
    font-size: 105%;
3145
    height: 18px;
3146
    margin-right: 5px;
3147
    margin-top: 3px;
3148
    width: 75px;
3149
    position: relative;
3150
    bottom:20px;
3151
}
3152

    
3153
.firewall-apply:hover {
3154
    background-color:#5CA1C0;
3155
}
3156

    
3157
.name-div {
3158
    margin: -9px 0 30px 70px;
3159
}
3160

    
3161
.machine-name-div {
3162
    margin-bottom: 20px;
3163
    margin-left: 60px;
3164
}
3165

    
3166
div.reboot-dialog {
3167
    display: none;
3168
    color: black;
3169
    background-color: #4085A5;
3170
    font-size: 75%;
3171
    margin-top: 15px;
3172
    width: 698px;
3173
    z-index: 1;
3174
}
3175

    
3176
div#reboot-machine-template, div.reboot-machine-entry {
3177
    display: none;
3178
    padding: 0 0 10px 35px;
3179
    width: 300px;
3180
}
3181

    
3182
div.reboot-dialog p {
3183
    color: #FFFFFF;
3184
    padding: 10px 0 10px 10px;
3185
}
3186

    
3187
div.reboot-dialog button {
3188
    float:right;
3189
    border: 1px solid #FF7F2A;
3190
    background-color: transparent;
3191
    font-size:100%;
3192
}
3193

    
3194
div.reboot-dialog button:hover {
3195
    background-color: #FF7F2A;
3196
}
3197

    
3198
div.reboot-dialog button.reboot-all {
3199
    margin: -30px 35px 0 0;
3200
}
3201

    
3202
div.reboot-dialog button.reboot-single {
3203
    color: black;
3204
    margin-top: -20px;
3205
}
3206

    
3207
div.reboot-dialog div.code, div.reboot-dialog div.action, div.reboot-dialog div.message, div.reboot-dialog button.details {
3208
    display:none;
3209
}
3210

    
3211
div.reboot-dialog button.details {
3212
    border-color: #800000;
3213
    margin-top: -20px;
3214
}
3215

    
3216
div.reboot-dialog button.details:hover {
3217
    background-color: #800000;
3218
}
3219

    
3220
/* Metadata */
3221
.machine .info-content {
3222
    display: none;
3223
}
3224

    
3225
.metadata-container {
3226
    line-height: 12px;
3227
    height: 85px;
3228
    background-color: #84b7d0;
3229
}
3230

    
3231
.metadata-column {
3232
    border-right: 1px solid #5CA1C0;
3233
    color: black;
3234
    float: left;
3235
    font-size: 60%;
3236
    margin-top: 3px;
3237
    height: 70px;
3238
    padding-bottom: 5px;
3239
}
3240

    
3241
.vm-stats {
3242
    padding-left: 10px;
3243
    padding-right: 5px;
3244
    width: 220px;
3245
}
3246

    
3247
.vm-stats div.stat-content {
3248
    height: 18px;
3249
}
3250

    
3251
.vm-stats div.stat-content img {
3252
    margin: 0;
3253
}
3254

    
3255
.vm-stats div img.stat-busy {
3256
    margin-top: -7px;
3257
    margin-left: 90px;
3258
}
3259

    
3260
.vm-stats div.stat-content img.busy {
3261
    margin-left: 95px;
3262
}
3263

    
3264
.vm-stats div.stat-error {
3265
    display:none;
3266
}
3267

    
3268
div.stat-error {
3269
    color: #f00;
3270
}
3271

    
3272
.single div.stat-error {
3273
    text-align: center;
3274
    font-size: 0.8em;
3275
}
3276

    
3277
.metadata-column {
3278
    margin-top: 4px;
3279
}
3280

    
3281
.vm-details {
3282
    width: 130px;
3283
    margin-left:17px;
3284
}
3285

    
3286
.vm-details.metadata-column {
3287
    padding-top: 5px;
3288
    height: 65px;
3289
}
3290

    
3291
.vm-details .image-details {
3292
    margin-top: 8px;
3293
}
3294

    
3295
.vm-details .vm-detail {
3296
    display: block;
3297
}
3298

    
3299
.vm-details span.value {
3300
    color: #444;
3301
}
3302

    
3303
.single-container .lower .stat-busy {
3304
    margin-top: 10px;
3305
    margin-left: 325px;
3306
}
3307

    
3308
.vm-metadata {
3309
    padding-left: 10px;
3310
    width: 100px;
3311
    border: none;
3312
}
3313

    
3314
.metadata-left {
3315
}
3316

    
3317
.metadata-right {
3318
    width: 73px;
3319
    float:left;
3320
    height: 35px;
3321
    padding-left: 5px;
3322
    position:relative;
3323
    overflow:hidden;
3324
}
3325

    
3326
.metadata-right .items {
3327
    position:absolute;
3328
    height:20000em;
3329
}
3330

    
3331
.metadata-keys-container {
3332
    height: 60px;
3333
    float: left;
3334
}
3335

    
3336
.single .metadata-keys-container {
3337
    float: none;
3338
    height: auto;
3339
    margin-bottom: 5px;
3340
}
3341

    
3342
.single a.manage-metadata {
3343
    font-size: 80%;
3344
    margin-left:4px;
3345
    color: #383838;
3346
}
3347

    
3348
a.manage-metadata, a.stats-report {
3349
    font-size: 100%;
3350
    color: black;
3351
    margin-left:17px;
3352
    text-decoration: underline;
3353
}
3354

    
3355
a.stats-report {
3356
    margin: 15px 0  0 80px;
3357
}
3358

    
3359
div.machine a.manage-metadata:hover {
3360
    background-color: transparent;
3361
}
3362

    
3363
.single .metadata-actions, .single .metadata-keys-container .items {
3364
    padding-left: 5px;
3365
}
3366
.metadata-actions, .metadata-keys-container .items{
3367
    margin-top: 5px;
3368
}
3369

    
3370
.singe .metadata-actions, .single .metadata-keys-container .items{
3371
    font-size: 80%;
3372
    line-height: 12px;
3373
    width: 300px;
3374
}
3375

    
3376
.metadata-actions .prev,  .metadata-actions .next{
3377
    float:left;
3378
    width:29px;
3379
    height:6px;
3380
    cursor: pointer;
3381
}
3382

    
3383
.metadata-actions .prev {
3384
    background: url("../images/roll-up.png") no-repeat scroll 0 0 transparent;
3385
}
3386

    
3387
.metadata-actions .next {
3388
    background: url("../images/roll-down.png") no-repeat scroll 0 0 transparent;
3389
}
3390

    
3391
.scrollable {
3392
    position:relative;
3393
    overflow:hidden;
3394
    height: 35px;
3395
    width: 120px;
3396
    margin-bottom:2px;
3397
}
3398

    
3399
.scrollable .items {
3400
    position:absolute;
3401
    height:20000em;
3402
}
3403

    
3404
/* single view */
3405
.single {
3406
    color: #383838;
3407
}
3408

    
3409
.single .column1 {
3410
    float: left;
3411
    margin: 1px 0 25px 17px;
3412
    width: 140px;
3413
}
3414

    
3415
.single .column1 .state {
3416
    float: left;
3417
    margin-left: 4px;
3418
    padding-bottom: 6px;
3419
    padding-top: 3px;
3420
    position: relative;
3421
    right: 0;
3422
    text-align: center;
3423
    width: 126px;
3424
}
3425

    
3426
.single .column1 .state-label {
3427
    padding-top: 5px;
3428
}
3429

    
3430
.single .column1 .indicators {
3431
    margin-right: 38px !important;
3432
}
3433

    
3434
.single div.connect-arrow {
3435
    margin-left: -17px;
3436
}
3437

    
3438
.single div.connect-border {
3439
    margin-left: -29px;
3440
}
3441

    
3442
.single .single-actions {
3443
    width: 150px;
3444
    height: 60px;
3445
    margin-bottom: 45px;
3446
    margin-left: -10px;
3447
}
3448

    
3449
.single .vm-actions .action-container {
3450
    margin-bottom: 1px;
3451
}
3452

    
3453
.single .vm-actions .action-container .confirm_single {
3454
    right: -45px;
3455
}
3456

    
3457
.single .vm-actions .action-container.destroy .confirm_single {
3458
}
3459

    
3460
.single .vm-actions .action-container.destroy {
3461
    bottom: -20px;
3462
}
3463

    
3464
.single a.single-action {
3465
    text-decoration: none;
3466
    cursor: pointer;
3467
    display: block;
3468
}
3469

    
3470
.single a.single-action:hover {
3471
    background-color:#A1C8DB;
3472
    width: 162px;
3473
    opacity: 0.8;
3474
    filter: alpha(opacity = 80);
3475
}
3476

    
3477
.single .destroy a.single-action.selected {
3478
    color: #880000 !important;
3479
}
3480

    
3481
.single a.single-action.selected {
3482
    color: #FF7F2A !important;
3483
    width: 50px !important;
3484
}
3485

    
3486
.single a.single-action.selected:hover {
3487
    background-color:transparent;
3488
}
3489

    
3490
.single .spinner, .single .action-indicator {
3491
    margin: 15px 45px 0 0px !important
3492
}
3493

    
3494
.single .action-indicator {
3495
    margin-right: 55px !important;
3496
}
3497

    
3498
.single .wave {
3499
    margin: 15px 53px 0 0px !important
3500
}
3501

    
3502
.icon div.action_error {
3503
    font-size: 100%;
3504
}
3505

    
3506
.single div.action_error {
3507
    position: absolute;
3508
    top: 29px;
3509
    right: 35px;
3510
}
3511

    
3512
.single .column2 {
3513
    background-color: #A1C8DB;
3514
    float: left;
3515
    font-size: 78%;
3516
    line-height: 17px;
3517
    margin: 0 0 10px 5px;
3518
    width: 358px;
3519
}
3520

    
3521
.single .column2 .machine-labels {
3522
    float: left;
3523
    font-size: 90%;
3524
    margin-left: 10px;
3525
    margin-top: 10px;
3526
    width: 125px;
3527
}
3528

    
3529
.single .machine-detail.title {
3530
    background-color: #74AEC9;
3531
    color: #fff;
3532
    padding: 4px 6px;
3533
    font-size: 0.8em;
3534
    width: 346px;
3535
    margin-left: 5px;
3536
    float: left;
3537
}
3538

    
3539
.single .column2 .machine-details {
3540
    float: right;
3541
    text-align: right;
3542
    font-size: 90%;
3543
    width: 210px;
3544
    margin-right: 10px;
3545
    margin-top: 10px;
3546
}
3547

    
3548
.single .column2 .name, .single .column2 .disk, .single .column2 .image-size, .single .column2 .ipv6 {
3549
    margin-bottom: 13px;
3550
}
3551

    
3552
.single .tags {
3553
    clear: both;
3554
    margin-bottom: 10px;
3555
    margin-left: 10px;
3556
}
3557

    
3558
.single .tags-label {
3559
    float: left;
3560
    padding: 0 5px;
3561
    width: 30px;
3562
}
3563

    
3564
.single .tags-down-arrow {
3565
    background: url("../images/tags-down-arrow.png") no-repeat scroll 1px 7px transparent;
3566
    float: left;
3567
    height: 16px;
3568
    width: 9px;
3569
}
3570

    
3571
.single .tags-header .info-header{
3572
    padding-top:0;
3573
    padding-bottom:0;
3574
}
3575

    
3576
.single .tags-header {
3577
    font-size: 0.62em;
3578
    cursor: pointer;
3579
    float: left;
3580
    margin-bottom:5px;
3581
}
3582

    
3583
.single .tags-header span.label {
3584
    font-size: 104%;
3585
}
3586

    
3587
.single .tags-content {
3588
    background-color: #84B7D0;
3589
    clear: both;
3590
    height: auto;
3591
    padding-bottom: 5px;
3592
    padding-top: 5px;
3593
    width: 300px;
3594
}
3595

    
3596
.single .column3 {
3597
    background-color: #A1C8DB;
3598
    width: 150px;
3599
    overflow: visible;
3600
    padding-bottom: 10px;
3601
    position: absolute;
3602
    right: 20px;
3603
    top: 130px;
3604
}
3605

    
3606
.single .col3 {
3607
    float: right;
3608
    width: 150px;
3609
    margin-right: 15px;
3610
    margin-bottom: 15px;
3611
}
3612

    
3613
.single .column3 .controls {
3614
    font-size: 80%;
3615
    height: 20px;
3616
    padding-left: 7px;
3617
    padding-right: 7px;
3618
    padding-top: 8px;
3619
    padding-bottom: 5px;
3620
    border-bottom: 1px solid #84B7D0;
3621
}
3622

    
3623
.single .column3 .vm-control:hover {
3624
    background-color: #5CA1C0;
3625
}
3626

    
3627
.single .column3 .previous {
3628
    float:left;
3629
    width: 72px;
3630
}
3631

    
3632
.single .column3 .next {
3633
    float: right;
3634
    text-align: center;
3635
    width: 60px;
3636
}
3637

    
3638
.single .column3 .next-label {
3639
    float: right;
3640
    margin-right: 3px;
3641
    margin-top: -2px;
3642
}
3643

    
3644
.single .column3 .next-arrow {
3645
    float: right;
3646
    height: 18px;
3647
    width: 10px;
3648
    background: url("../images/right-arrow.png") no-repeat scroll 3px 2px transparent;
3649
}
3650

    
3651
.single .column3 .prev-label {
3652
    float: left;
3653
    margin-left: 3px;
3654
    margin-top: -2px;
3655
}
3656

    
3657
.single .column3 .prev-arrow {
3658
    background: url("../images/left-arrow.png") no-repeat scroll 3px 2px transparent;
3659
    float: left;
3660
    height: 18px;
3661
    width: 10px;
3662
}
3663

    
3664
.single .column3 .separator {
3665
    width: 135px;
3666
    height: 1px;
3667
    background-color: #84B7D0;
3668
    margin: 0 0 0 7px;
3669
    clear: both;
3670
}
3671

    
3672
.single .column3 .servers {
3673
    font-size: 80%;
3674
    line-height: 15px;
3675
    padding-top: 10px;
3676
    text-align: right;
3677
    overflow: visible;
3678
    position: relative;
3679
}
3680

    
3681
.single .column3 .server-name {
3682
    margin-left: 10px;
3683
    padding-right: 5px;
3684
    cursor: pointer;
3685
    padding-bottom: 2px;
3686
}
3687
div.single div.column3 div.server-name:hover {
3688
    background-color: #5CA1C0;
3689
}
3690
.single .column3 .column3-selected {
3691
    background-color: #84B7D0;
3692
    color: white;
3693
    opacity: 0.8;
3694
    padding-left: 9px;
3695
    width: 160px;
3696
    filter: alpha(opacity = 80);
3697
    position: relative;
3698
    width: 126px;
3699
}
3700

    
3701
.single .toggler {
3702
    color: #FFFFFF;
3703
    float: right;
3704
    font-size: 140%;
3705
}
3706

    
3707
.single .cpu-usage, .single .network-usage {
3708
    text-align: center;
3709
    padding-top: 15px;
3710
    margin-bottom: 5px;
3711
    font-size: 90%;
3712
    font-weight: bold;
3713
}
3714

    
3715
.single .cpu-graph, .single .network-graph {
3716
    margin-left: 20px;
3717
    margin-bottom:30px;
3718
    width: 660px;
3719
}
3720

    
3721
.single div.lower .stats-select .stats-select-option.selected {
3722
    background-color: #4085A5;
3723
    color: #fff;
3724
}
3725

    
3726
.single div.lower .stats-select .stats-select-option {
3727
    cursor: pointer;
3728
    background-color: #DDF1FB;
3729
    color: #4085A5;
3730
    display: block;
3731
    float: left;
3732
    padding: 7px 10px;
3733
    font-size: 0.7em;
3734
}
3735

    
3736
.single div.lower img.stats {
3737
    margin-left: 82px;
3738
}
3739

    
3740
.single div.lower img.stats {
3741
    display: none;
3742
}
3743

    
3744
.single .single-image {
3745
    width: 126px;
3746
    height: 136px;
3747
    margin-bottom: 10px;
3748
    margin-left: 4px;
3749
    background-image: url("../images/icons/machines/large/unknown-sprite.png");
3750
    background-repeat: no-repeat;
3751
    cursor: pointer;
3752
}
3753

    
3754
.single .single-image-state1 {
3755
    background-position: 0px 0;
3756
}
3757

    
3758
.single .single-image-state3 {
3759
    background-position: -252px 0;
3760
}
3761

    
3762
.single .single-image-state4 {
3763
    background-position: -378px 0;
3764
}
3765

    
3766
.single .single-image-state2 {
3767
    background-position: -126px 0;
3768
}
3769

    
3770
.single .column3 .previous, .single .column3 .next {
3771
    cursor: pointer;
3772
    background-color: #84B7D0;
3773
    color: white;
3774
    font-size: 100%;
3775
    height: 15px;
3776
    padding-top: 2px;
3777
}
3778

    
3779
.single .column3 .disabled {
3780
    opacity: 0.5;
3781
    filter: alpha(opacity = 50);
3782
}
3783

    
3784
.single div.lower {
3785
    clear:both;
3786
    background: #EFF7FA repeat scroll 0 0;
3787
    width: 700px;
3788
    padding-bottom: 15px;
3789
}
3790

    
3791
.single div.upper {
3792
    background: transparent;
3793
    margin-bottom: 10px;
3794
    overflow: visible;
3795
    overflow: hidden;
3796
    width: 700px;
3797
    background: #EFF7FA repeat scroll 0 0;
3798
}
3799

    
3800
/* console css */
3801
.console-header-logo {
3802
    padding-top: 16px;
3803
    margin-left: 30px;
3804
    position: fixed;
3805
}
3806

    
3807
#console-header div.help-text {
3808
    font-size: 70%;
3809
    font-weight:bold;
3810
    color:#FFFFFF;
3811
    position: absolute;
3812
    height: 20px;
3813
    top: 79px;
3814
}
3815

    
3816
div.console-container {
3817
    margin: 0 0em;
3818
    height: auto;
3819
}
3820

    
3821
#wrapper.console {
3822
    width: auto;
3823
}
3824

    
3825
.console-info {
3826
    font-size:80%;
3827
    color: white;
3828
    position:absolute;
3829
    margin: 15px 0 0 480px;
3830
}
3831

    
3832
applet {
3833
    width:100%;
3834
    height:100%;
3835
}
3836

    
3837
div.console-footer {
3838
    /* this is for version 0.5*/
3839
    display: none;
3840
}
3841

    
3842
.console-footer #footer-text{
3843
    float:left;
3844
    left: auto;
3845
    margin-left:30px;
3846
}
3847

    
3848
/* add network wizard (see also #wizard for shared classes) */
3849
#networks-wizard .header {
3850
    background-color: #4085A5;
3851
    height: 56px;
3852
}
3853

    
3854
#networks-wizard div.name-input {
3855
    margin: 75px 0 0 55px;
3856
}
3857

    
3858
#networks-wizard input {
3859
    border: 1px solid #CCCCCC;
3860
    color: #445566;
3861
    letter-spacing: 1px;
3862
    width: 170px;
3863
}
3864

    
3865
#networks-wizard span.help {
3866
    font-style: italic;
3867
    font-size: 80%;
3868
    margin-left: 10px;
3869
}
3870

    
3871
#networks-wizard .separator-end {
3872
    background-color: #387693;
3873
    height: 6px;
3874
    width: 479px;
3875
    margin-left: -13px;
3876
    margin-top: 19px;
3877
}
3878

    
3879
.red {
3880
    color: red;
3881
}
3882

    
3883
/* add server to network wizard (see also #metadata-wizard for shared classes) */
3884
#add-machines-wizard span.machine-name {
3885
    margin-left: 4px;
3886
    vertical-align: text-top;
3887
}
3888

    
3889
#add-machines-wizard img.list-logo {
3890
    margin: 2px 1px 1px;
3891
}
3892

    
3893
.css-panes {
3894
    clear: both;
3895
    position: relative;
3896
    z-index: 10;
3897
}
3898

    
3899
.last .firewall-content {
3900
}
3901

    
3902
#pub .last .network-separator {
3903
    display:none;
3904
}
3905

    
3906
.public-networks .empty-network-slot {
3907
    display: none;
3908
}
3909

    
3910
.clearfix {
3911
    display: block;
3912
    width: auto;
3913
    zoom: 1;
3914
}
3915

    
3916
/* float clearing for all browsers except the devil one */
3917
.clearfix:after{
3918
  clear: both;
3919
  content: ".";
3920
  display: block;
3921
  height: 0;
3922
  visibility: hidden;
3923
  font-size: 0;
3924
}
3925

    
3926
* html .clearfix {
3927
    display: inline-block;
3928
}
3929

    
3930
.icon .cont-toggler {
3931
    margin-top: -1px;
3932
}
3933

    
3934
.icon .wave {
3935
    margin-right: 4px !important;
3936
    margin-top: 15px !important;
3937
}
3938

    
3939
.icon .status {
3940
    margin-right: 3px;
3941
}
3942

    
3943
#machinesview .status, .single .state {
3944
    font-size: 75%;
3945
}
3946

    
3947
#machinesview-list div.action-indicator {
3948
    margin:0 !important;
3949
    float: none !important;
3950
}
3951

    
3952
.icon div.action-indicator {
3953
    margin-top: 14px;
3954
    margin-right: 4px;
3955
}
3956

    
3957
div.action-indicator {
3958
    width: 15px;
3959
    height: 20px;
3960
    background-repeat: no-repeat;
3961
    background-position: 0 0;
3962
}
3963

    
3964
tbody.machines div.action-indicator {
3965
    position: relative;
3966
    top: -2px;
3967
}
3968
div.state .destroy, tbody.machines .destroy {
3969
    background-image: url("../images/icons/actions/medium/destroy.png");
3970
}
3971
div.state .console, tbody.machines .console {
3972
    background-image: url("../images/icons/actions/medium/console.png");
3973
}
3974
div.state .start, tbody.machines .start {
3975
    background-image: url("../images/icons/actions/medium/start.png");
3976
}
3977
div.state .reboot, tbody.machines .reboot {
3978
    background-image: url("../images/icons/actions/medium/reboot.png");
3979
}
3980
div.state .shutdown, tbody.machines .shutdown {
3981
    background-image: url("../images/icons/actions/medium/shutdown.png");
3982
}
3983

    
3984
h3.overlay-inner-title {
3985
    color: #4085A5;
3986
    font-size: 2em;
3987
}
3988

    
3989
#add-name-container {
3990
    margin-bottom: 10px;   
3991
}
3992

    
3993
.remove-field-trigger, .add-field-trigger {
3994
    cursor: pointer;
3995
}
3996

    
3997
.add-field-trigger img {
3998
    vertical-align: middle;
3999
}
4000

    
4001
.machine-now-building {
4002
    padding-right: 15px !important;
4003
    text-align: justify;
4004
}
4005

    
4006
.sub-text {
4007
    padding-top: 15px;
4008
    padding-right: 15px;
4009
    text-align: justify;
4010
    font-style: italic;
4011
    font-size: 0.8em !important;
4012
}
4013

    
4014
#notification-box a {
4015
    color: #4085A5;
4016
}
4017

    
4018
#notification-box .machine-title img {
4019
    vertical-align: middle;
4020
}
4021

    
4022
#notifiaction-box .password-header {
4023
    margin-bottom: 0 !important;
4024
}
4025

    
4026
#notification-box .password-container a {
4027
    color: #fff;
4028
    text-decoration: underline;
4029
}
4030

    
4031
#notification-box .password-container a:hover {
4032
    background-color: #fff;
4033
    color: #4085A5;
4034
}
4035

    
4036
#notification-box .password-container {
4037
    background: #4085A5;
4038
    border: none;
4039
}
4040

    
4041
#notification-box .password-container .password a {
4042
    font-weight: normal !important;
4043
}
4044

    
4045
#notification-box .cmd {
4046
    color: #fff;
4047
    font-family: monospace;
4048
    font-size: 1.6em;
4049
}
4050

    
4051
.machine-container .separator {
4052
    background-color: #B0D1E0;
4053
}
4054

    
4055
#creation-password-overlay div.password-cont {
4056
    margin: 10px auto;
4057
    padding: 10px;
4058
    border: 2px solid #75B54A;
4059
    background-color: #AADE87;
4060
    color: #447821;
4061
    text-align: left;
4062
    padding-left: 5em;
4063
    position: relative;
4064
}
4065

    
4066
#creation-password-overlay {
4067
    position: relative;
4068
}
4069

    
4070
#creation-password-overlay .form-action {
4071
    position: absolute;
4072
    bottom: 15px;
4073
    right: 13px;
4074
    font-size: 0.8em;
4075
}
4076

    
4077
#creation-password-overlay .password-label {
4078
    float: left;
4079
}
4080

    
4081
#creation-password-overlay .password {
4082
    font-size: 1.5em;
4083
    font-weight: bold;
4084
    letter-spacing: 2px;
4085
    font-family: Georgia, Times, serif;
4086
    margin-right: 5em;
4087
    float: right;
4088
    margin-top: -4px;
4089
}
4090

    
4091
.feedback-form .description {
4092
    margin-bottom: 25px;
4093
}
4094

    
4095
.feedback-form label {
4096
    display: block;
4097
    font-weight: bold;
4098
    margin-bottom: 10px;
4099
    font-size: 0.8em;
4100
}
4101

    
4102
.feedback-form .form-actions {
4103
    border-top: none;
4104
}
4105

    
4106
.nospace {
4107
    padding-top: 0 !important;
4108
    padding-bottom: 0 !important;
4109
}
4110

    
4111
.noborder {
4112
    border-top: none !important;
4113
    border-bottom: none !important;
4114
}
4115

    
4116
.overlay .feedback-form .messages.description {
4117
    padding-bottom:0;
4118
    margin-bottom: 0;
4119
}
4120

    
4121
.feedback-form .messages .error-message {
4122
    color: #f00;
4123
}
4124

    
4125
.feedback-form .messages .success-message {
4126
    color: #8AA87F;
4127
}
4128

    
4129
.feedback-form .feedback-message {
4130
    width: 548px;
4131
    height: 200px;
4132
    border: 1px solid #ddd;
4133
    padding: 5px;
4134
}
4135

    
4136
#feedback-form .empty-error-msg {
4137
    display: none;
4138
}
4139

    
4140
#feedback-form .data-text {
4141
    display: none;
4142
}
4143

    
4144
#feedback-form .message {
4145
    display: none;
4146
}
4147

    
4148
#feedback-form label {
4149
    display: block;
4150
    font-size: 0.85em;
4151
    font-weight: bold;
4152
}
4153

    
4154
#feedback-form label.inline {
4155
    display: inline;
4156
    padding-left: 5px;
4157
}
4158

    
4159
#feedback-form p {
4160
    padding: 1em 0;
4161
    color: #444;
4162
    margin-bottom: 10px;
4163
}
4164

    
4165
#feedback-form .description {
4166
    font-style: italic;
4167
    font-size: 0.9em;
4168
    color: #888;
4169
}
4170

    
4171
#feedback-form .feedback-text {
4172
    width: 98%;
4173
    height: 100px;
4174
    margin-top: 10px;
4175
    margin-bottom: 10px;
4176
}
4177

    
4178
#feedback-form .submit-data {
4179
    display: none;
4180
}
4181

    
4182
#feedback-form .submit, #invform .submit {
4183
    background-color: #4085A5;
4184
    color: #fff;
4185
    border: none;
4186
    padding: 5px 16px;
4187
    cursor: pointer;
4188
    font-size: 1em;
4189
    position: relative;
4190
}
4191

    
4192
#feedback .submit {
4193
    float: right;
4194
    right: 10px;
4195
    margin-top: 10px;
4196
}
4197

    
4198

    
4199
#feedback-form .submit:hover, #invform .submit:hover {
4200
    background-color: #549FC3;
4201
}
4202

    
4203
.feedback-intro {
4204
    padding-right: 15px !important;
4205
    text-align: justify;
4206
}
4207

    
4208
.popup-body .message {
4209
    padding: 20px 5px;
4210
    display: none;
4211
}
4212

    
4213
.popup-body .loading {
4214
    color: #fff;
4215
}
4216

    
4217
.popup-body .success {
4218
    color: #1F921A;
4219
}
4220

    
4221
.popup-body .errormsg {
4222
    color: #E32424;
4223
}
4224

    
4225

    
4226
.close-msg-box {
4227
    display: block;
4228
    margin-top: 10px;
4229
    cursor: pointer;
4230
    color: #4085A5;
4231
    text-decoration: underline;
4232
}
4233

    
4234

    
4235
.console .ip-version-label {
4236
    margin: 0 5px;
4237
}
4238

    
4239
.ipv6-text, .ipv4-text {
4240
    font-size: 0.9em;
4241
}
4242

    
4243
.tooltip {
4244
    background-color: #C4DDE9;
4245
    color: #000;
4246
    font-size: 0.7em;
4247
    padding: 0.2em 0.5em;
4248
    border: 1px solid #888;
4249
    z-index: 50000;
4250
}
4251

    
4252
/*404 and 500 pages*/
4253

    
4254
.error_page {
4255
    position: relative;
4256
    top: 40px;
4257
    padding-bottom: 140px !important;
4258
}
4259

    
4260
.error_page h1 {
4261
    font-weight: normal;
4262
}
4263

    
4264
.error_page .msg_header {
4265
    margin: 0px;
4266
    font-size: 10em;
4267
    position: absolute;
4268
    left: -5px;
4269
    top: 0px;
4270
    color: #4085A5;
4271
    font-family: arial, verdana;
4272
}
4273

    
4274
.error_page p.error_desc {
4275
    color: #fff;
4276
    font-size: 0.8em;
4277
}
4278

    
4279
.error_page {
4280
    padding-right: 50px !important;
4281
    padding-left: 100px !important;
4282
}
4283

    
4284
.error_page .error_content {
4285
    padding-left: 150px;
4286
    padding-top: 97px;
4287
}
4288

    
4289
.error_page .error_content .links, .info_content .links {
4290
    margin-top: 10px;
4291
    margin-left: 20px;
4292
}
4293

    
4294
.error_page .http_error .code {
4295
    letter-spacing: -10px;
4296
    font-size: 9em;
4297
}
4298

    
4299
.error_page .http_error .msg {
4300
    letter-spacing: -1px;
4301
    font-size: 2em;
4302
}
4303

    
4304
.error_page .http_error {
4305
    position: absolute;
4306
    right: 0px;
4307
    bottom: 0px;
4308
    color: #75B3D0;
4309
    line-height: 1em;
4310
}
4311

    
4312
.error_page .error_content a, .info_content .links a {
4313
    color: #4085A5;
4314
    font-weight: bold;
4315
    margin-right: 10px;
4316
    font-size: 0.9em;
4317
}
4318

    
4319
.error_body #container, .info_body #container {
4320
    background-position: right 200px;
4321
}
4322

    
4323
.info_page h1 {
4324
    color: #4085A5;
4325
    font-size: 2em;
4326
    font-weight: normal;
4327
}
4328

    
4329
.info_page p {
4330
    color: #ffffff;
4331
    margin: 1em 0;
4332
}
4333

    
4334
.info_body p a, .error_body p a{
4335
    color: #4085A5;
4336
    text-decoration: underline;
4337
}
4338

    
4339
.error_404 .http_error .code {
4340
    letter-spacing: -7px;
4341
}
4342

    
4343
.network-progress-indicator {
4344
    position: relative;
4345
    display: none;
4346
}
4347

    
4348
.network-progress-indicator img {
4349
    position: absolute;
4350
    bottom: 44px;
4351
    left: 340px;
4352
}
4353

    
4354

    
4355
.single .progress-message {
4356
    margin-top: 90px;
4357
    font-size: 0.6em;
4358
    padding: 0 10px;
4359
    text-align: center;
4360
}
4361

    
4362
/*metadata keys/values*/
4363
.items .tag-item  {
4364
    display: block;
4365
}
4366

    
4367
.single .items .tag-item .key {
4368
    width: 60px;
4369
}
4370

    
4371
.running .scrollable, .terminated .scrollable {
4372
    height: 42px;
4373
}
4374

    
4375
.items .tag-item .key {
4376
    margin-right: 5px;
4377
    width: 30px;
4378
    display: block;
4379
    float: left;
4380
    color: #000;
4381
}
4382

    
4383
.items .tag-item .value {
4384
    color: #444;
4385
}
4386

    
4387
#machinesview-list {
4388
    display: none;
4389
}
4390

    
4391
#machinesview-single {
4392
    position: relative;
4393
    display: none;
4394
}
4395

    
4396
#machinesview-icon {
4397
    display: none;
4398
}
4399

    
4400
#machinesview-icon, #machinesview-single, #machinesview-list {
4401
    
4402
}
4403

    
4404
tbody.machines .spinner {
4405
    margin-top: 0!important;
4406
    margin: 0 !important;
4407
    float: none !important;
4408
}
4409

    
4410
.slider .slider-point {
4411
    width: 4px;
4412
    height: 3px;
4413
    margin-left: 1px;
4414
    background-color: transparent;
4415
    display: block;
4416
    position: absolute;
4417
    z-index: 10;
4418
    bottom: 0px;
4419
}
4420

    
4421
.slider .slider-point-light {
4422
    background-color: transparent;
4423
}
4424

    
4425
.slider-point-text {
4426
    font-size: 0.6em;
4427
    position: absolute;
4428
    top: 4px;
4429
    border-top: 5px solid #C5DEE9;
4430
    padding: 3px;
4431
    color: #4085A5;
4432
    display: block;
4433
    min-width: 6px;
4434
    text-align: middle;
4435
}
4436

    
4437
.slider .handle {
4438
    z-index: 50;
4439
}
4440

    
4441
.modal p.desc {
4442
    margin: 5px 0;
4443
    margin-left: 37px;
4444
    font-size: 0.8em;
4445
    color: #888;
4446
}
4447

    
4448
.api_overlay_template {
4449
    display: none;
4450
}
4451

    
4452
.api_content .password-container .password {
4453
    color: #fff;
4454
    font-size: 1.1em;
4455
}
4456

    
4457
#disks-pane {
4458
    margin-top: 58px;
4459
}
4460

    
4461
span.resend-msg {
4462
    display: block;
4463
    margin-bottom: 5px;
4464
}
4465

    
4466
.success-msg {
4467
    background-color: #5CAD54;
4468
    color: #fff;
4469
    padding: 0.4em;
4470
    border: 1px solid #ddd;
4471
}
4472

    
4473
.error-msg {
4474
    background-color: #800000;
4475
    color: #fff;
4476
    padding: 0.4em;
4477
    border: 1px solid #ddd;
4478
}
4479

    
4480
.success-msg em, .error-msg em {
4481
    font-weight: bold;
4482
    font-style: normal;
4483
    font-size: 0.9em;
4484
}
4485

    
4486
.pagination {
4487
            font-size: 80%;
4488
        }
4489
        
4490
.pagination a {
4491
    text-decoration: none;
4492
        border: solid 1px #AAE;
4493
        color: #15B;
4494
}
4495

    
4496
.pagination a, .pagination span {
4497
    display: block;
4498
    float: left;
4499
    padding: 0.3em 0.5em;
4500
    margin-right: 5px;
4501
        margin-bottom: 5px;
4502
        min-width:1em;
4503
        text-align:center;
4504
}
4505

    
4506
.pagination .current {
4507
    background: #4085A5;
4508
    color: #fff;
4509
        border: solid 1px #AAE;
4510
}
4511

    
4512
.pagination .current.prev, .pagination .current.next{
4513
        color:#999;
4514
        border-color:#999;
4515
        background:#fff;
4516
}
4517

    
4518
table.list-machines .wave {
4519
    float: none !important;
4520
    margin: 0 !important;
4521
}
4522

    
4523
.overlay {
4524
    display: none;
4525
}
4526

    
4527
.overlay .copy-content .clip-copy  {
4528
    right: 10px;
4529
    top:8px;
4530
    border: 1px solid #fff;
4531
}
4532

    
4533
.overlay .copy-content {
4534
    background-color: #387693;
4535
    color: #fff;
4536
    padding: 10px;
4537
    font-size: 1.2em;
4538
    text-align: center;
4539
    position: relative;
4540
}
4541

    
4542
.overlay {
4543
    background-color: #fff;
4544
    border: 2px solid #444;
4545
    text-align: left;
4546

    
4547
    -moz-box-shadow: 0 0 90px 5px #000;
4548
    -webkit-box-shadow: 0 0 90px 5px #000;
4549
    box-shadow: 0 0 90px 5px #000;
4550
    width: 600px;
4551
}
4552

    
4553
.overlay.overlay-createvm {
4554
    width: 640px;
4555
}
4556

    
4557
.overlay a {
4558
    color: #387693;
4559
}
4560

    
4561
.overlay .diagnostics-list {
4562
    height: 400px;
4563
    overflow: scroll;
4564
    overflow-y: scroll;
4565
    overflow-x: hidden;
4566
}
4567

    
4568
.overlay .overlay-content .description.subinfo, .overlay .extra-info {
4569
    margin-bottom:0;
4570
    border-bottom: none;
4571
    padding-bottom:0;
4572
    margin-top: 10px;
4573
    padding-top:10px;
4574
    border-top: 1px solid #64a6c4;
4575
    /*border-top: 1px solid #DBE6EB;*/
4576
    font-size: 0.8em;
4577
}
4578

    
4579
.overlay .overlay-content .important {
4580
    color: #800000;
4581
}
4582

    
4583
.overlay .overlay-content .description.noborder {
4584
  margin-bottom:0;
4585
  border:0;
4586
}
4587

    
4588
.overlay .overlay-content .description {
4589
    color: #444;
4590
    border-bottom: 1px solid #64a6c4;
4591
    margin-bottom: 10px;
4592
    padding-bottom: 10px;
4593
    font-size: 0.9em;
4594
    line-height: 1.6em;
4595
}
4596

    
4597
.overlay .overlay-content .empty-message {
4598
    margin-bottom: 5px;
4599
}
4600

    
4601
.overlay h3.overlay-header {
4602
    font-size: 0.9em;
4603
    text-align: left;
4604
    padding: 0.8em;
4605
    padding-left: 1em;
4606
    font-weight: normal;
4607
    border-bottom: 1px solid #ddd;
4608
}
4609

    
4610
.overlay h3.overlay-header .title {
4611
    float: left;
4612
}
4613

    
4614
.overlay .container {
4615
    position: relative;
4616
    padding-top: 1em;
4617
    padding: 0.5em;
4618
    background-image: url("../images/popup-bg.png");
4619
    background-repeat: repeat-x;
4620
}
4621

    
4622
.overlay .content {
4623
    background-color: transparent;
4624
    background-image: url("../images/popup-inner-bg.png");
4625
    padding: 1em;
4626
    font-size: 0.8em;
4627
    background-repeat: repeat-x;
4628
    -moz-box-shadow: 0 0 1px 1px #888;
4629
    -webkit-box-shadow: 0 0 1px 1px #888;
4630
    box-shadow: 0 0 1px 1px #888;
4631
}
4632

    
4633
.overlay .message {
4634
}
4635

    
4636
.overlay .actions {
4637
    position: absolute;
4638
    right: 0.75em;
4639
    top: 0.6em;
4640
}
4641

    
4642
.overlay .actions span {
4643
    font-size: 0.8em;
4644
    color: #fff;
4645
    cursor: pointer;
4646
    margin-left: 10px;
4647
    display: block;
4648
    float: left;
4649
    background-color: #4085A5;
4650
    padding: 0.2em 0.4em;
4651
}
4652

    
4653
.overlay-error .error-more-details {
4654
    margin-top: 5px;
4655
    max-height: 210px;
4656
    overflow: auto;
4657
}
4658

    
4659
.overlay-error .key.details.expand {
4660
    background-image: url("../images/plus-8.png");
4661
}
4662

    
4663
.overlay-error .key.details {
4664
    background-color: #5189A3;
4665
    cursor: pointer;
4666
    background-image: url("../images/minus-8.png");
4667
    background-repeat: no-repeat;
4668
    background-position: 545px;
4669
}
4670

    
4671
.overlay-error .container {
4672
    padding-top: 1.9em;
4673
}
4674

    
4675
.overlay-error .error-details {
4676
    font-size: 0.8em;
4677
    margin-top: 10px;
4678
}
4679

    
4680
.overlay-error .error-details anonymous {
4681
    display: block;
4682
    margin-top: 10px;
4683
}
4684

    
4685
.overlay-error h3.overlay-header {
4686
    background-color: #800000;
4687
    color: #fff;
4688
}
4689

    
4690
.overlay-error.non-critical h3.overlay-header {
4691
    background-color: #987249;
4692
}
4693

    
4694
.overlay-error span.key {
4695
    font-weight: normal;
4696
    display: block;
4697
    margin-top: 0.5em;
4698
    background-color: #74AEC9;
4699
    color: #fff;
4700
    padding: 0.4em;
4701
    font-size: 0.8em;
4702
    font-weight: bold;
4703
}
4704

    
4705
.overlay-error .indicator {
4706
    background-color: #880000;
4707
    color: #fff;
4708
    padding: 4px;
4709
    display: block;
4710
    float: left;
4711
    border: 1px solid #444;
4712
}
4713

    
4714
.overlay-error .nav-btn:hover {
4715
    
4716
}
4717

    
4718
.overlay-error .nav-btn {
4719
    margin-left: 5px;
4720
    color: #fff;
4721
    display: block;
4722
    float: left;
4723
    padding: 4px;
4724
    background-color: #AAA;
4725
    border: 1px solid #444;
4726
}
4727

    
4728
.overlay-error .error-nav {
4729
    position: absolute;
4730
    right: 0px;
4731
    bottom: -25px;
4732
    font-size: 0.8em;
4733
}
4734

    
4735
.overlay-error span.value, .overlay-error div.value {
4736
    padding: 0.4em;
4737
    display: block;
4738
    margin-bottom: 0.3em;
4739
}
4740

    
4741
.overlay h3 .closeme {
4742
    float: right;
4743
    font-size: 0.7em;
4744
    margin-top: 0.2em;
4745
    cursor: pointer;
4746
}
4747

    
4748
.overlay .overlay-header .subtitle {
4749
    display: block;
4750
    font-size: 0.8em;
4751
    color: #ddd;
4752
}
4753

    
4754
.overlay .overlay-header .subtitle img {
4755
    vertical-align: middle;
4756
    margin-left: 10px;
4757
    margin-bottom: 2px;
4758
}
4759

    
4760
.overlay-info .msg-log-entry .src {
4761
    color: #4085A5;
4762
    float: right;
4763
    font-size: 0.9em;
4764
}
4765

    
4766
.overlay-info .msg-log-entry .date {
4767
    font-style: italic;
4768
}
4769

    
4770
.overlay-info .msg-log-entry pre {
4771
    color: #333;
4772
    width: 100%;
4773
    display: none;
4774
    margin: 10px 0;
4775
}
4776

    
4777
.msg-log-entry.warning {
4778
    color: #E57F01;
4779
}
4780

    
4781
.overlay-info .msg-log-entry.with-details .src {
4782
    margin-right: 15px;
4783
}
4784

    
4785
.overlay-info .msg-log-entry.with-details {
4786
    cursor: pointer;
4787
}
4788

    
4789
.overlay-info .msg-log-entry.with-details {
4790
    background-image: url("../images/plus-8-dark.png");
4791
    background-repeat: no-repeat;
4792
    background-position: 99% 9px;
4793
}
4794

    
4795
.overlay-info .msg-log-entry.with-details.expanded {
4796
    background-image: url("../images/minus-8-dark.png");
4797
}
4798

    
4799
.overlay-info .msg-log-entry .msg {
4800
    display: inline-block;
4801
    margin-left: 10px;
4802
}
4803

    
4804
.overlay-info .msg-log-entry {
4805
    border-bottom: 1px solid #aaa;
4806
    padding: 5px;
4807
}
4808

    
4809
.overlay-info .description.subinfo {
4810
    border: none !important;
4811
    padding-top: 0 !important;
4812
}
4813

    
4814
.overlay-info .content {
4815
    background-repeat: no-repeat;
4816
    background-position: 110% 110%;
4817
    background-color: rgba(255,255,255,0.6)
4818
}
4819

    
4820
.overlay-info .overlay-header {
4821
    background-color: #4085A5;
4822
}
4823

    
4824
.overlay-info .overlay-header .title {
4825
    color: #fff;
4826
}
4827

    
4828
.overlay-info .overlay-header .closeme {
4829
    color: #fff;
4830
}
4831

    
4832
#loading-view {
4833
    width: 600px;
4834
    margin: 0 auto;
4835
    padding: 20px 0;
4836
    font-size: 0.8em;
4837
}
4838

    
4839
#loading-view .header span {
4840
    font-weight: bold;
4841
    color: #4085A5;
4842
}
4843

    
4844
#loading-view .info {
4845
    color: #ddd;
4846
}
4847

    
4848
.options-list {
4849
    margin-top: 0.5em;
4850
    font-size: 0.8em;
4851
}
4852

    
4853
.options-list.five li {
4854
    float: left;
4855
    display: block;
4856
    width: 20%;
4857
    margin-bottom: 5px;
4858
}
4859

    
4860
.options-list.five li:nth-child(5n) .options-object-cont {
4861
    margin-right: 0;
4862
}
4863

    
4864
.options-object-cont input {
4865
    border: 1px solid #aaa;
4866
    width: 92px;
4867
    padding: 0;
4868
    margin: 0;
4869
    margin-top:3px;
4870
    padding: 2px;
4871
}
4872

    
4873
.options-list.three li {
4874
    float: left;
4875
    display: block;
4876
    width: 33%;
4877
    margin-bottom: 5px;
4878
}
4879

    
4880
.meta-list .options-list li.options-object.create .options-object-cont {
4881
    background-image: url("../images/option-action-add.png");
4882
    background-repeat: no-repeat;
4883
    background-position: 90px 5px;
4884
}
4885

    
4886
.meta-list .options-list li .options-object-cont .option-action,
4887
.meta-list .options-list li.options-object.create {
4888
    cursor: pointer !important;
4889
}
4890

    
4891
.meta-list .options-list li .options-object-cont {
4892
    cursor: inherit;
4893
}
4894

    
4895
.options-list li .options-object-cont {
4896
    padding: 5px;
4897
    margin-right: 4px;
4898
    border: 1px solid #A6D1E6;
4899
    cursor: pointer;
4900
    min-height: 35px;
4901
    position: relative;
4902
}
4903

    
4904
.options-list.three li:nth-child(3n) .options-object-cont {
4905
    margin-right: 0;
4906
}
4907

    
4908
.options-list li.selected .options-object-cont {
4909
    background-color: #efefef;
4910
    border: 2px solid #4085A5;
4911
    padding: 4px;
4912
}
4913

    
4914
.options-list li.selected .options-object-cont .title {
4915
}
4916

    
4917
.options-list li.options-object .title {
4918
    display: block;
4919
    color: #FF7F2A;
4920
    margin-bottom: 2px;
4921
}
4922

    
4923
.options-list li .option-action {
4924
    display: none;
4925
    position: absolute;
4926
    background-repeat: no-repeat;
4927
}
4928

    
4929
.options-list.five li.editing {
4930
    width: 40%;
4931
}
4932

    
4933
.options-list.five li.editing .value {
4934
    display: none;
4935
}
4936

    
4937
.options-list li .remove {
4938
    background-image: url("../images/option-action-remove.png");
4939
    width:10px;
4940
    height:10px;
4941
    right:5px;
4942
    top: 5px;
4943
}
4944

    
4945
.options-list li .edit {
4946
    background-image: url("../images/option-action-edit.png");
4947
    width:10px;
4948
    height:10px;
4949
    right:5px;
4950
    bottom: 8px;
4951
}
4952

    
4953
.options-list li:hover .option-action  {
4954
    display: block;
4955
}
4956

    
4957
.options-list li.options-object .value {
4958
    color: #4085A5;
4959
    margin-top: 5px;
4960
    display: block;
4961
}
4962

    
4963
.options-list li.selected.options-object .value {
4964
}
4965

    
4966
.options-list li .options-object-cont:hover {
4967
    background-color: #fff;
4968
}
4969

    
4970
.options-list li.selected .options-object-cont:hover {
4971
    background-color: #fff;
4972
}
4973

    
4974
.options-list li img {
4975
    float: left;
4976
    margin:2px;
4977
    margin-right: 10px;
4978
    padding-bottom:10px;
4979
}
4980

    
4981
#network-vms-select-content li.options-object .value {
4982
    margin-top: 10px;
4983
    margin-left: 30px;
4984
}
4985

    
4986
#network-vms-select-content li.options-object:hover .options-object-cont,
4987
#network-vms-select-content li.options-object .options-object-cont {
4988
    background-image: url("../images/option-action-add-dark.png");
4989
    background-repeat: no-repeat;
4990
    background-position: 160px 28px;
4991
}
4992

    
4993
#network-vms-select-content li.selected:hover .options-object-cont,
4994
#network-vms-select-content li.selected .options-object-cont {
4995
    background-image: url("../images/option-action-remove.png") !important;
4996
}
4997

    
4998
#metadata-overlay-content .view .value {
4999
    margin-top: 10px;
5000
}
5001

    
5002
#metadata-overlay-content {
5003
    position: relative;
5004
}
5005

    
5006
.vm-meta .editor .predefined .predefined-meta-key:hover {
5007
    background-color: #4e8eac;
5008
    color: #fff;
5009
}
5010

    
5011
.vm-meta .editor .predefined .predefined-meta-key {
5012
    float: left;
5013
    margin-right: 5px;
5014
    padding: 4px;
5015
    display: block;
5016
    cursor: pointer;
5017
}
5018

    
5019
.vm-meta .editor .predefined {
5020
    background-color: #A6D1E6;
5021
    font-size: 0.9em;
5022
    border-top: 1px solid #ddd;
5023
}
5024

    
5025
.vm-meta .editor input {
5026
}
5027
.vm-meta .editor {
5028
    margin-bottom: 10px;
5029
}
5030

    
5031
.vm-meta .editor .form-actions .form-action {
5032
    min-width: 50px;
5033
}
5034

    
5035
.vm-meta .editor .form-field input.meta-key {
5036
    width: 90px;
5037
}
5038

    
5039
.vm-meta .form-field {
5040
    float: left;
5041
}
5042

    
5043
.vm-meta .form-actions .form-action {
5044
    float: left;
5045
    margin-right: 10px;
5046
    height: 11px;
5047
}
5048

    
5049
.vm-meta .editor .form-actions .cancel {
5050
    margin-right: 0;
5051
}
5052

    
5053
.vm-meta .editor .form-actions {
5054
    float: right;
5055
    margin:0;
5056
    padding:0;
5057
    margin-left: 15px;
5058
    margin-top: 0px;
5059
}
5060

    
5061
.vm-meta .editor {
5062
    background-color: rgba(64, 133, 165, 0.898) !important;
5063
    background-color: #649DB8;
5064
    font-size:0.9em;
5065
}
5066

    
5067
.vm-meta .meta-key-title {
5068
    font-size: 1.3em;
5069
    color: #fff;
5070
    margin-bottom: 10px;
5071
    display: none;
5072
    float: left;
5073
}
5074

    
5075
.vm-meta .editor-content {
5076
    padding: 10px;
5077
}
5078

    
5079
.vm-meta .inner-mask {
5080
    background-color: #fff;
5081
    opacity:0.6;
5082
    position: absolute;
5083
    top:0;
5084
    left:0;
5085
}
5086

    
5087
.vm-meta .editor label {
5088
    float: left;
5089
    color: #fff;
5090
    margin-right: 2px;
5091
    padding-top:4px;
5092
    font-size: 0.9em;
5093
}
5094

    
5095
.vm-meta .editor input {
5096
    border: none;
5097
    width: 170px;
5098
    margin-left: 10px;
5099
    font-size: 0.9em;
5100
    padding: 4px;
5101
}
5102

    
5103
.vm-meta li.create .options-object-cont {
5104
    background-color: #B3C9AD ;
5105
    border-color: #788774;
5106
}
5107
.vm-meta li.create .options-object-cont .value,
5108
.vm-meta li.create .options-object-cont .title {
5109
    color: #fff;
5110
}
5111

    
5112
#createvm-overlay-content {
5113
    padding: 0;
5114
}
5115

    
5116
.overlay-createvm .container {
5117
    width: 624px !important;
5118
}
5119

    
5120
.create-vm .header-step.current {
5121
    font-weight: bold;
5122
}
5123

    
5124
.create-vm .create-step-cont {
5125
    min-height: 240px;
5126
}
5127
.create-vm .create-controls {
5128
    padding: 10px;
5129
}
5130

    
5131
.create-vm ul li {
5132
    cursor: pointer;
5133
    padding: 4px;
5134
}
5135

    
5136
.create-vm ul li.selected {
5137
    background-color: #aaa;
5138
}
5139

    
5140
.cont-toggler {
5141
    background-image: url("../images/down-arrow.png");
5142
    background-position: right;
5143
    background-repeat: no-repeat;
5144
    background-color: #A1C8DB;
5145
    display: inline-block;
5146
    border-right: 6px solid #A1C8DB;
5147
    padding:2px;
5148
    padding-right: 14px;
5149
    padding-left:0;
5150
    cursor: pointer;
5151
    color: #fff;
5152
    font-size: 0.9em;
5153
}
5154

    
5155
.cont-toggler .label {
5156
    background-color: #98BDCF;
5157
    padding: 2px;
5158
    padding-left: 5px;
5159
    padding-right: 5px;
5160
}
5161

    
5162
.cont-toggler.open {
5163
    background-color: #98BDCF;
5164
    border-color: #98BDCF;
5165
    background-image: url("../images/up-arrow.png");
5166
}
5167

    
5168
.cont-toggler.open .label {
5169
    background-color: #4085A5;
5170
}
5171

    
5172
.overlay .form label {
5173
    font-color: #444;
5174
    margin-right: 10px;
5175
}
5176

    
5177
.form-field.error label {
5178
    color: #ff0000;
5179
    text-decoration: underline;
5180
}
5181

    
5182
.form-field input {
5183
    border: 1px solid #aaa;
5184
    width: 200px;
5185
    padding: 3px;
5186
}
5187

    
5188
.form-actions {
5189
    margin-top: 5px;
5190
    padding-top:5px;
5191
    border-top: 1px solid #64a6c4;
5192
    font-size: 0.8em;
5193
}
5194

    
5195
.form-actions.plain {
5196
    margin-top: 0px;
5197
    padding-top:0px;
5198
    border-top: 0px;
5199
}
5200

    
5201
.form-action {
5202
    float: right;
5203
    min-width: 140px;
5204
    background-color: #FF7F2A;
5205
    border: 1px solid #FF7F2A;
5206
    text-align: center;
5207
    color: #FFFFFF;
5208
    cursor: pointer;
5209
    padding: 4px;
5210
}
5211

    
5212
.form-action:hover {
5213
    background-color: #FF9955;
5214
    color: #FFF;
5215
}
5216

    
5217
.form-action.prev,
5218
.form-action.cancel {
5219
    background-color: #800;
5220
    border: 1px solid #800;
5221
    float: left;
5222
}
5223

    
5224
.form-action.prev:hover,
5225
.form-action.cancel:hover {
5226
    background-color: #CC0000;
5227
    color: #fff;
5228
}
5229

    
5230
.form-action.next,
5231
.form-action.ok {
5232
    background-color: #080;
5233
    border: 1px solid #080;
5234
}
5235

    
5236
.form-action.next:hover,
5237
.form-action.ok:hover {
5238
    background-color: #00aa00;
5239
    color: #fff;
5240
}
5241

    
5242
.form-action .create,
5243
.form-action .submit {
5244

    
5245
}
5246

    
5247
.form-action.in-progress, button.in-progress {
5248
    background-image: url("../images/icons/indicators/medium/horizontal-progress.gif");
5249
    background-repeat: no-repeat;
5250
    background-position: center center;
5251
    color: transparent;
5252
}
5253

    
5254
#createvm-overlay-content {
5255
    padding: 0;
5256
}
5257

    
5258
.create-vm .image-details.selected .size {
5259

    
5260
}
5261

    
5262
.create-vm .image-details .show-details:hover {
5263
    color: #aaa !important; 
5264
}
5265
.create-vm .image-details.selected .show-details:hover {
5266
    color: #fff !important; 
5267
}
5268

    
5269
.create-vm .image-details.selected .show-details,
5270
.create-vm .image-details.selected .size {
5271
    color: #eee;
5272
}
5273

    
5274
.create-vm .image-details.selected span.owner {
5275
    color: #fff;
5276
}
5277

    
5278

    
5279
.create-vm .image-details p {
5280
    font-size: 0.8em;
5281
    padding-left: 27px;
5282
    display:block;
5283
}
5284

    
5285
.create-vm .image-details span.owner {
5286
    display: block;
5287
    font-size: 0.9em;
5288
    float: right;
5289
    color: #FF7F2A;
5290
    position: absolute;
5291
    top: 5px;
5292
    right: 5px;
5293
}
5294

    
5295
.create-vm .select-image .show-details {
5296
    display: none;
5297
    font-size: 0.8em;
5298
    text-decoration: underline;
5299
    color: #000;
5300
    position: absolute;
5301
    bottom: 5px;
5302
    right: 5px;
5303
}
5304

    
5305
.create-vm .image-details .size {
5306
    margin-top: 2px;
5307
    font-size: 0.8em;
5308
    color: #aaa;
5309
    margin-left: 10px;
5310
}
5311

    
5312
.create-vm .step-cont {
5313
    margin: 15px;
5314
}
5315

    
5316
.create-vm .create-step-cont {
5317
    min-height: 250px;
5318
    float: left;
5319
    width: 624px;
5320
}
5321

    
5322
.create-vm .create-controls {
5323
    padding: 10px;
5324
    border-top: 1px solid #ddd;
5325
}
5326

    
5327
.create-vm .empty {
5328
    font-size: 0.8em;
5329
    color: #444;
5330
}
5331

    
5332
.create-vm h4 {
5333
    color: #5CA1C0;
5334
    margin-bottom: 0.5em;
5335
    font-family: arial;
5336
}
5337
.create-vm ul li {
5338
    cursor: pointer;
5339
    padding: 4px;
5340
    font-size: 0.9em;
5341
}
5342

    
5343
.create-vm .create-step-cont li.ssh-key-option.selected,
5344
.create-vm ul li.selected {
5345
    background-color: #FF7F2A;
5346
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5347
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5348
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5349
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5350
    color: #fff;
5351
}
5352

    
5353
.create-vm .images-list-cont.loading .loading-indicator {
5354
    display: block !important;
5355
}
5356

    
5357
.create-vm .images-list-cont .loading-indicator {
5358
    display: none;
5359
    position: absolute;
5360
    right: -13px;
5361
    top: 2px;
5362
    width: 30px;
5363
    height: 10px;
5364
    background-repeat: no-repeat;
5365
    background-image: url("../images/icons/indicators/medium/progress.gif");
5366
}
5367

    
5368
.create-vm .images-list-cont h4 {
5369
    position: relative;
5370
}
5371

    
5372
.create-vm .images-list-cont {
5373
    width: 40%;
5374
    float: left;
5375
    padding-left: 3%;
5376
    padding-right: 3%;
5377
}
5378

    
5379
.create-vm li p.desc {
5380
    font-size: 0.9em;
5381
}
5382

    
5383
.create-vm p.desc.warning {
5384
    color: #880000;
5385
}
5386

    
5387
.create-vm p.desc.empty {
5388
    color: #000;
5389
}
5390

    
5391
.create-vm p.desc {
5392
    font-size: 0.8em;
5393
    color: #888;
5394
    margin-bottom: 10px;
5395
}
5396

    
5397
.create-vm li.role .values .val:hover {
5398
    background-color: #eee;
5399
}
5400
.create-vm li.role .values .val.selected,  .create-vm li.role .values .val.selected:hover {
5401
    color: #fff;
5402
    background-color: #FF9955;
5403
}
5404

    
5405
.create-vm .images-filter-cont, .create-vm .flavors-predefined-cont {
5406
    width: 18%;
5407
    padding-right: 4%;
5408
    float:left;
5409
    border-right: 1px solid #A1C8DB;
5410
    overflow: auto;
5411
}
5412

    
5413
.create-vm .flavor-options-cont {
5414
    width: 74%;
5415
    float: left;
5416
    margin-left: 20px;
5417
}
5418

    
5419
.create-vm .flavor-options-cont .flavor-options li:hover {
5420
    background-image:-webkit-linear-gradient(top, #E8F4FA, #D1E7F0);
5421
    background-image:-o-linear-gradient(top, #E8F4FA, #D1E7F0);
5422
    background-image:-moz-linear-gradient(top, #E8F4FA, #D1E7F0);
5423
    background-image:linear-gradient(top, #E8F4FA, #D1E7F0);
5424
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E8F4FA', endColorstr='#D1E7F0', GradientType=0);
5425
}
5426

    
5427
.create-vm .flavor-options-cont .flavor-options li.disabled * {
5428
    color: #eee !important;
5429
}
5430

    
5431
.create-vm .flavor-options-cont .flavor-options li.disabled {
5432
    background-image:linear-gradient(top, #aaa, #ddd);
5433
    background-image:-webkit-linear-gradient(top, #aaa, #ddd);
5434
    background-image:-o-linear-gradient(top, #aaa, #ddd);
5435
    background-image:-moz-linear-gradient(top, #aaa, #ddd);
5436
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#aaaaaa', endColorstr='#dddddd', GradientType=0);
5437
}
5438

    
5439
.create-vm .flavor-options-cont .flavor-options li.selected {
5440
    background-color: #FF9955;
5441
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5442
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5443
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5444
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5445
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF9955', endColorstr='#E88B4D', GradientType=0);
5446
    border: 1px solid #C97943;
5447
}
5448

    
5449
.create-vm .predefined-list li.disabled {
5450
    color: #ddd !important;
5451
}
5452

    
5453
.create-vm .flavor-options-cont .flavor-options li {
5454
    display: block;
5455
    float: left;
5456
    margin-right: 10px;
5457
    margin-bottom: 9px;
5458
    padding: 9px 14px;
5459
    border: 1px solid #aaa;
5460
    background-image:-webkit-linear-gradient(top, #D1E7F0, #E8F4FA);
5461
    background-image:-o-linear-gradient(top, #D1E7F0, #E8F4FA);
5462
    background-image:-moz-linear-gradient(top, #D1E7F0, #E8F4FA);
5463
    background-image:linear-gradient(top, #D1E7F0, #E8F4FA);
5464
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D1E7F0', endColorstr='#E8F4FA', GradientType=0);
5465
}
5466

    
5467
.create-vm .flavor-opts-list.compact li {
5468
    padding: 7px 9px;
5469
    margin-right: 7px;
5470
}
5471

    
5472
.create-vm .flavor-options-cont .flavor-options {
5473
    margin-bottom: 2px;
5474
}
5475

    
5476

    
5477
.create-vm .flavor-options .metric {
5478
    font-size: 0.8em;
5479
    margin-left: 2px;
5480
}
5481

    
5482
.create-vm .flavor-options span.title {
5483
    color: #444;
5484
}
5485

    
5486
.create-vm .flavor-options span.desc {
5487
    display: block;
5488
    color: #aaa;
5489
    font-weight: normal;
5490
    font-size: 0.8em;
5491
    float: right;
5492
    margin-top: 4px;
5493
}
5494

    
5495
.disktip {
5496
    padding: 4px;
5497
    top: 20px;
5498
}
5499

    
5500
.create-vm .flavor-options .flavors-disk-template-list {
5501
    position: relative;
5502
}
5503

    
5504
.create-vm .flavor-options .disk_template.option {
5505
    z-index: 10;
5506
    min-width: 50px;
5507
    text-align: center;
5508
}
5509

    
5510
/*0 position is -470px*/
5511
.create-vm .flavor-options .disk-template-description {
5512
    font-size: 0.8em;
5513
    color: #444;
5514
    background-image: url("../images/horizontal-pointer.png");
5515
    background-repeat: repeat-x;
5516
    background-position: -470px 0;
5517
    padding-top: 15px;
5518
    margin-top: -10px;
5519
    font-style: italic;
5520
    display:block;
5521
    overflow: auto;
5522
    padding-bottom: 0px;
5523
    margin-bottom: 7px;
5524
    width: 100%;
5525
}
5526

    
5527
.create-vm .flavor-options .disk_template.option .description {
5528
    display: none;
5529
    position: absolute;
5530
    bottom: -20px;
5531
    left:0;
5532
    color: #888;
5533
    font-style: italic;
5534
    display: block;
5535
    background-color: #fff;
5536
    width: 100%;
5537
    text-align: left;
5538
    z-index: 0;
5539
    border-top: 1px solid #ddd;
5540
    padding-top: 3px;
5541
    display: none;
5542
}
5543

    
5544
.create-vm .flavor-options .selected .value {
5545
    color: #FFF;
5546
}
5547

    
5548
.create-vm .flavor-options .value {
5549
    font-weight: bold;
5550
    color: #5CA1C0;
5551
}
5552

    
5553
.create-vm .flavor-options-cont h4 {
5554
    border-bottom: 1px solid #A1C8DB;
5555
    padding-bottom: 5px;
5556
}
5557

    
5558
.create-vm .images-info-cont {
5559
    width: 28%;
5560
    padding-left: 3%;
5561
    float: left;
5562
    border-left: 1px solid #A1C8DB;
5563
}
5564

    
5565
.create-vm .select-image.wide .show-details {
5566
    display: inline;
5567
}
5568

    
5569
.create-vm .select-image .images-info-cont .hide {
5570
    display: none;
5571
}
5572

    
5573
.create-vm .select-image.wide .images-info-cont .hide {
5574
    display: block;
5575
    float: right;
5576
    position: absolute;
5577
    right: 10px;
5578
    top: 10px;
5579
    font-size: 0.8em;
5580
    text-decoration: underline;
5581
    color: #5CA1C0;
5582
    cursor: pointer;
5583
}
5584

    
5585
.create-vm .select-image.wide .images-list-cont {
5586
    width: 74%;
5587
    padding-right: 0;
5588
}
5589

    
5590
.create-vm .select-image.wide .images-info-cont .description .title {
5591
    display: none;
5592
    float: none;
5593
}
5594

    
5595
.create-vm .select-image.wide .images-info-cont .description p {
5596
    background-color: #fff;
5597
    border: 1px solid #ddd;
5598
    padding: 10px;
5599
    float: none;
5600
}
5601

    
5602
.create-vm .select-image.wide .selected .size {
5603
    color: #FFF !important;
5604
}
5605

    
5606
.create-vm .select-image.wide .image-details .size {
5607
    color: #5CA1C0;
5608
    position: absolute;
5609
    top: 5px;
5610
}
5611

    
5612
.create-vm .select-image.wide .images-info-cont h3 {
5613
    color: #5CA1C0;
5614
    margin: 10px 0;
5615
    margin-top: 5px;
5616
    text-align: left;
5617
    font-size: 0.9em;
5618
}
5619

    
5620
.create-vm .select-image.wide .images-info-cont .description p {
5621
    height: 50px;
5622
}
5623

    
5624
.create-vm .select-image.wide .images-info-cont .description {
5625
    width: 100% !important;
5626
    float: none !important;
5627
    background-color: transparent !important;
5628
    padding: 0 !important;
5629
    font-size: 1.1em;
5630
}
5631
.create-vm .select-image.wide .images-info-cont .extra-details {
5632
    height: 160px;
5633
    overflow-y: scroll;
5634
    padding-right: 15px;
5635
}
5636

    
5637
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail.extra-meta .title .custom {
5638
    display: inline-block;
5639
}
5640

    
5641
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail.extra-meta .title {
5642
    background-color: #999 !important;
5643
    border-color: #888 !important;
5644
}
5645
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail .custom {
5646
    float: right;
5647
    display: none;
5648
    font-size: 0.8em;
5649
    margin-left: 10px;
5650
    color: #DDD;
5651
    margin-top: 2px;
5652
}
5653

    
5654
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail {
5655
    padding: 0px;
5656
    background-color: transparent;
5657
    margin-bottom: 4px;
5658
}
5659

    
5660
.create-vm .select-image.wide .images-info-cont .extra-details .title {
5661
    float: left;
5662
    display: block;
5663
    width: 39%;
5664
    padding: 1%;
5665
    background-color: #5CA1C0;
5666
    color: #fff;
5667
    border: 1px solid #4F8DAA;
5668
    font-size: 0.8em;
5669
}
5670

    
5671
.create-vm .select-image.wide .images-info-cont .extra-details .value {
5672
    float: right;
5673
    display: block;
5674
    width: 55%;
5675
    padding: 1%;
5676
    border: none;
5677
    background-color: #FFF;
5678
    color: #444;
5679
    border: 1px solid #ddd;
5680
    margin-bottom: 0px;
5681
    font-size: 0.8em;
5682
}
5683

    
5684

    
5685
.create-vm .select-image.wide .images-info-cont .image-detail {
5686
}
5687

    
5688
.create-vm .select-image.wide ul.images-list {
5689
    height: 310px;
5690
    overflow-y: scroll;
5691
    padding-right: 3%;
5692
}
5693

    
5694
.flavors-predefined-cont {
5695

    
5696
}
5697

    
5698
.flavor-options-cont {
5699
}
5700

    
5701
.create-vm .select-image.wide .images-info-cont {
5702
    position: absolute;
5703
    width: 88%;
5704
    background-color: #DAE9F0;
5705
    padding: 2%;
5706
    border-left: none;
5707
    height: 320px;
5708
    box-shadow: 0px 0px 2px #aaa;
5709
    -moz-box-shadow: 0px 0px 2px #aaa;
5710
    -webkit-box-shadow: 0px 0px 2px #aaa;
5711
    display: none;
5712
}
5713

    
5714

    
5715
.create-vm .images-info-cont h4, .create-vm .create-step-cont .param h4{
5716
    color: #FF9955;
5717
    margin-bottom: 1em;
5718
    font-size: 1.2em;
5719
}
5720

    
5721
.create-vm .images-info-cont span.title {
5722
    color: #4085A5;
5723
    display: block;
5724
    margin-bottom: 2px;
5725
    font-size: 0.8em;
5726
}
5727

    
5728
.create-vm .type-filter li {
5729
    font-size: 0.8em;
5730
    /*font-weight: bold;*/
5731
    padding: 4px;
5732
    margin-bottom: 0px;
5733
    color: #FF7F2A;
5734
}
5735

    
5736
.create-vm .images-list li {
5737
    min-height: 30px;
5738
}
5739
.create-vm .images-list .image-details:hover {
5740
    background-color: #eee;
5741
}
5742

    
5743
.create-vm .images-list .image-details.selected:hover {
5744
    background-color: #FF7F2A;
5745
}
5746

    
5747
.create-vm .images-list .image-details.selected {
5748
    /*font-weight: bold;*/
5749
}
5750

    
5751
.create-vm .images-list .image-details {
5752
    padding: 6px;
5753
    margin-bottom:1px;
5754
    position: relative;
5755
}
5756

    
5757
.create-vm .images-list .image-details img {
5758
    vertical-align: middle;
5759
    margin-right: 10px;
5760
}
5761

    
5762
.create-vm .images-info-cont .image-detail:last-child p {
5763
    border-bottom: none;
5764
}
5765

    
5766
.create-vm .images-info-cont h4 img {
5767
    vertical-align: middle;
5768
    margin-right: 7px;
5769
    margin-bottom: 5px;
5770
}
5771

    
5772
.create-vm .images-info-cont .description p {
5773
    font-size: 0.8em;
5774
}
5775

    
5776
.create-vm .images-info-cont p {
5777
    margin-bottom: 7px;
5778
    font-size: 0.9em;
5779
    border-bottom: 1px solid #A1C8DB;
5780
    padding-bottom: 7px;
5781
}
5782

    
5783
.create-vm .step-header {
5784
    padding-bottom:0;
5785
    position: relative;
5786
}
5787

    
5788
.create-vm .step-header .header-step .info span.subtitle {
5789
    font-size: 1.2em;
5790
    color: #fff;
5791
    font-weight: bold;
5792
}
5793

    
5794
.create-vm .step-header .header-step .info span {
5795
    float: none;
5796
    text-align: right;
5797
}
5798

    
5799
.create-vm .step-header .header-step .info {
5800
    position: absolute;
5801
    right: 15px;
5802
    top: 20px;
5803
    font-size: 0.8em;
5804
}
5805

    
5806
.create-vm .step-header .header-step span {
5807
    float: left;
5808
    display: block;
5809
}
5810

    
5811
.create-vm .steps-container {
5812
    width: 2000em;
5813
}
5814

    
5815
.create-vm .step-header .header-step .title {
5816
    margin-top: 20px;
5817
    font-size: 1em;
5818
    margin-left: 10px;
5819
}
5820

    
5821
#createvm-overlay-content {
5822
    width: 624px;
5823
    overflow: hidden;
5824
}
5825

    
5826
.create-vm .steps-history .steps-history-cont.current .title {
5827
    display: block;
5828
    top: 23px;
5829
    left: 43px;
5830
    font-size: 1.2em;
5831
    color: #ffffff;
5832
    font-weight: bold;
5833
    font-family: 'Ubuntu', sans-serif !important;
5834
}
5835

    
5836
.create-vm .steps-history .steps-history-cont.current .subnum {
5837
    display: none;
5838
    float: none;
5839
    font-size: 0.9em;
5840
    font-family: 'Ubuntu', sans-serif  !important;
5841
}
5842

    
5843
.create-vm .steps-history .steps-history-cont.current .subtitle,
5844
.create-vm .steps-history .steps-history-cont.current .description {
5845
    font-family: 'Ubuntu', sans-serif  !important;
5846
}
5847

    
5848
.create-vm .steps-history .steps-history-cont.current .info {
5849
    display: block;
5850
    font-family: 'Ubuntu', sans-serif !important;
5851
}
5852

    
5853
.create-vm .steps-history .steps-history-cont.completed .title,
5854
.create-vm .steps-history .steps-history-cont.completed .num {
5855
    color: #A1C8DB;
5856
}
5857

    
5858
.create-vm .steps-history .steps-history-cont.completed {
5859
    background-color: #4085A5;
5860
    color: #fff;
5861
    cursor: pointer;
5862
}
5863

    
5864
.create-vm .steps-history .steps-history-cont.completed .steps-history-step {
5865
    background-image: url("../images/check.png");
5866
}
5867

    
5868
.create-vm .steps-history .steps-history-cont.current .steps-history-step {
5869
    width: 320px;
5870
}
5871

    
5872
.create-vm .steps-history .steps-history-cont.current .num {
5873
    color: #fff;
5874
}
5875

    
5876
.create-vm .steps-history .steps-history-cont.current .info {
5877
    color: #4085A5;
5878
    font-size: 0.8em;
5879
}
5880

    
5881
.create-vm .steps-history .steps-history-cont.current {
5882
    background-color: #A1C8DB;
5883
    color: #fff;
5884
    width: 468px;
5885
}
5886

    
5887
.create-vm .steps-history-step {
5888
    padding: 4px;
5889
    padding-left: 7px;
5890
    font-size: 1em;
5891
    font-family: 'Ubuntu', sans-serif  !important;
5892
    margin-right: 5px;
5893
    padding-top: 12px;
5894
    background-position: right 30px;
5895
    background-image: none;
5896
    background-repeat: no-repeat;
5897
}
5898

    
5899
.create-vm .steps-history {
5900
    background-color: #4085A5;
5901
}
5902

    
5903
.create-vm .steps-history .steps-history-cont.last {
5904
    border-right: none;
5905
}
5906

    
5907
.create-vm .steps-history .steps-history-cont .num {
5908
    margin-left: 5px;
5909
    margin-top: -10px;
5910
    padding-bottom: 10px;
5911
}
5912

    
5913
.create-vm .steps-history .steps-history-cont .title {
5914
    display: none;
5915
    position: absolute;
5916
    bottom: 0px;
5917
    text-align: center;
5918
    padding-bottom: 2px;
5919
    left:0;
5920
    width: 55px;
5921
    margin-left:0;
5922
    margin-top:0;
5923
    font-size: 0.8em;
5924
}
5925

    
5926
.create-vm .steps-history .steps-history-cont .subnum,
5927
.create-vm .steps-history .steps-history-cont .info {
5928
    display: none;
5929
}
5930

    
5931
.create-vm .steps-history .steps-history-cont {
5932
    height: 70px;
5933
    width: 51px;
5934
    float: left;
5935
    color: #fff;
5936
    border-right: 1px solid #A1C8DB;
5937
    color: #A1C8DB;
5938
    background-color: #4085A5;
5939
    background-position: center right;
5940
    background-image: none;
5941
    background-repeat: no-repeat;
5942

    
5943
    -webkit-transition: background-color .15s ease-in;
5944
    -o-transition: background-color .15s ease-in;
5945
    -moz-transition: background-color .15s ease-in;
5946
    transition: background-color .15s ease-in;
5947

    
5948
    border-bottom: 1px solid #aaa;
5949
}
5950

    
5951
.create-vm .step-header .header-step .num {
5952
    color: #225871;
5953
    font-size: 4em;
5954
    margin-bottom: -5px;
5955
    font-family: 'Ubuntu', sans-serif;
5956
    font-weight: normal !important;
5957
}
5958

    
5959
.create-vm .step-header .header-step {
5960
    color: #;
5961
    margin-bottom: -6px;
5962
    width: 25%;
5963
    padding-left: 0%;
5964
    display: block;
5965
    float: left;
5966
}
5967

    
5968
.create-vm .step-header .header-step.current {
5969
    color: #387693;
5970
}
5971

    
5972
.create-vm .image-filters-title {
5973
    margin-top: 1em;
5974
    margin-bottom: 0.5em;
5975
}
5976

    
5977
.create-vm .create-step-cont span.clear {
5978
    font-size: 0.8em;
5979
    font-weight: bold;
5980
    color: #A1C8DB;
5981
    display: block;
5982
}
5983

    
5984
.create-vm .category-filters li {
5985
    float:left;
5986
    display: block;
5987
    padding: 4px;
5988
    background-color: #eee;
5989
    margin-right: 5px;
5990
    font-size: 0.9em;
5991
    margin-bottom: 5px;
5992
}
5993

    
5994
.create-vm .content-cont {
5995
    height: 340px;
5996
    overflow: auto;
5997
}
5998

    
5999
.create-vm .vm-confirm .confirm-params span.cval {
6000
    margin-left: 8px;
6001
    color: #444;
6002
}
6003

    
6004
.create-vm .vm-confirm .confirm-params span.ckey {
6005
    color: #4085A5;
6006
    font-weight: bold;
6007
}
6008

    
6009
.create-vm .vm-confirm .confirm-params {
6010
    margin-bottom: 15px;
6011
}
6012

    
6013
.create-vm .vm-confirm h3.vm-name {
6014
    background-repeat: no-repeat;
6015
    background-position: left center;
6016
    font-size: 1.4em;
6017
    padding-left: 1.45em;
6018
    color: #4085A5;
6019
}
6020

    
6021
.create-vm .images-list-cont h4 a {
6022
    margin-top: 3px;
6023
    margin-right: -2px !important;
6024
}
6025
.create-vm .images-list-cont h4 a,
6026
.create-vm .list-cont h4 a {
6027
    font-size: 0.8em;
6028
    font-weight: normal;
6029
    margin-right: 5px;
6030
    float: right;
6031
    color: #FF7F2A;
6032
}
6033

    
6034
.create-vm .confirm-params {
6035
    overflow: auto;
6036
}
6037

    
6038
.create-vm .vm-confirm .ssh.confirm-params {
6039
    max-height: 150px;
6040
}
6041

    
6042
.create-vm .personalize-cont .confirm-params {
6043
    max-height: 160px;
6044
    margin-right: 10px;
6045
}
6046

    
6047
.create-vm .personalize-cont,
6048
.create-vm .confirm-cont {
6049
    height: 250px;
6050
}
6051

    
6052
.create-vm .image-warning p {
6053
  width: 80%;
6054
  float: left;
6055
}
6056

    
6057
.create-vm .image-warning .untrusted-image-confirm:hover {
6058
  background-color: #7D674E;
6059
}
6060

    
6061
.create-vm .image-warning .untrusted-image-confirm {
6062
  display: inline-block;
6063
  padding: 5px;
6064
  background-color: #5C4D39;
6065
  color: #FFF;
6066
  width: 10%;
6067
  float: right;
6068
  margin-top: 4px;
6069
  margin-right: 2px;
6070
  cursor: pointer;
6071
  text-align: center;
6072
}
6073

    
6074
.create-vm .image-warning {
6075
  display: none;
6076
  background-color: #987249;
6077
  color: #fff;
6078
  padding: 10px 15px;
6079
  font-size: 0.9em;
6080
  border-top: 1px solid #AAA;
6081
}
6082

    
6083
.create-vm .create-step-cont .rename input.rename-field {
6084
    font-size: 1.4em;
6085
    padding: 5px;
6086
    width: 93%;
6087
    padding-left: 30px;
6088
    background-position: 7px center;
6089
    background-repeat: no-repeat;
6090
}
6091

    
6092
.create-vm .create-step-cont .rename label {
6093
    display: block;
6094
}
6095

    
6096
.create-vm .create-step-cont .personalize-conts,
6097
.create-vm .create-step-cont .confirm-conts {
6098
    margin-top: 20px;
6099
}
6100

    
6101
.create-vm .create-step-cont .personalize-cont,
6102
.create-vm .create-step-cont .confirm-cont {
6103
    width: 30%;
6104
    margin-right: 2%;
6105
    border-right: 1px solid #A1C8DB;
6106
    float: left;
6107
}
6108

    
6109
.create-vm .create-step-cont .confirm-cont ul li .title {
6110
    width: 55px;
6111
    float: left;
6112
}
6113

    
6114
.create-vm .create-step-cont .list-cont ul li .value {
6115
    float: right;
6116
    padding-top: 2px;
6117
    display: block;
6118
    width: 90px;
6119
    text-align: right;
6120
}
6121

    
6122
.create-vm .create-step-cont .list-cont ul li.flavor-disktype .value {
6123
    width: 45px;
6124
}
6125

    
6126
.create-vm .create-step-cont .list-cont ul li.image-description .value,
6127
.create-vm .create-step-cont .list-cont ul li.image-name .value {
6128
    float: none;
6129
    width: auto;
6130
    text-align:left;
6131
    width: auto;
6132
}
6133

    
6134
.create-vm .create-step-cont .list-cont ul li {
6135
    padding:0;
6136
    margin:0;
6137
    margin-bottom: 5px;
6138
    border-bottom: 1px solid #EEE;
6139
    padding-bottom: 7px;
6140
    margin-right: 10px;
6141
}
6142

    
6143
.create-vm .create-step-cont li.ssh-key-option .check {
6144
    float: right;
6145
    margin-right: 5px;
6146
    margin-top: 0px;
6147
}
6148

    
6149
.create-vm .create-step-cont li.ssh-key-option.selected {
6150
}
6151
.create-vm .create-step-cont li.ssh-key-option.selected:hover {
6152
    background-color: #F95;
6153
}
6154

    
6155
.create-vm .create-step-cont li.ssh-key-option:hover {
6156
    background-color: #eee;
6157
}
6158

    
6159
.create-vm .create-step-cont li.ssh-key-option.selected {
6160
}
6161

    
6162
.create-vm .create-step-cont li.ssh-key-option {
6163
    padding: 6px !important;
6164
}
6165

    
6166
.create-vm .create-step-cont .list-cont.ssh {
6167
    width: 60%;
6168
}
6169

    
6170
.create-vm .create-step-cont .list-cont.meta h4 {
6171
    margin-right: 0;
6172
}
6173

    
6174
.create-vm .create-step-cont .list-cont.meta {
6175
    margin-right:0;
6176
    border-right: none;
6177
    width: 195px;
6178
}
6179

    
6180
.create-vm .list-cont > h4 {
6181
    font-size: 1.2em;
6182
    margin-right: 10px;
6183
    border-bottom: 1px solid #A1C8DB;
6184
    padding-bottom: 5px;
6185
    color: #387693;
6186
}
6187

    
6188
.create-vm .list-cont .param.image-name {
6189
    margin-bottom: 0 !important;
6190
    border-bottom: none !important;
6191
}
6192

    
6193
.create-vm .list-cont .param h4 {
6194
    margin-bottom: 0px !important;
6195
    font-size: 1.1em !important; 
6196
}
6197

    
6198
.create-vm .list-cont .param {
6199
    margin-bottom: 7px !important;
6200
}
6201

    
6202
.create-vm .list-cont .value {
6203
    font-weight: bold;
6204
}
6205

    
6206
.create-vm .list-cont .param .value {
6207
    font-size: 0.9em;
6208
}
6209

    
6210
.create-vm .list-cont .param .title {
6211
    color: #387693;
6212
}
6213

    
6214
.create-vm .list-cont .image-description {
6215
    margin-left:0;
6216
}
6217

    
6218
.create-vm .list-cont .image-description .value {
6219
    font-weight: normal;
6220
    margin-left: 0 !important;
6221
}
6222

    
6223
.create-vm .list-cont .image-description .title {
6224
    display: none;
6225
    font-size: 0.8em;
6226
}
6227

    
6228
.create-vm .list-cont.meta .values span {
6229
    display:block;
6230
    float: left;
6231
    margin-right: 4px;
6232
    border: 1px solid #eee;
6233
    padding:3px;
6234
    margin-bottom: 4px;
6235
    font-size: 0.9em;
6236
}
6237

    
6238
.create-vm .list-cont.meta .key {
6239
    font-weight: bold;
6240
    font-size: 0.9em;
6241
    display: block;
6242
    margin-bottom: 5px;
6243
}
6244

    
6245
.create-vm .meta input {
6246
    font-size: 0.8em;
6247
}
6248

    
6249
.vm-connect .connect-cont {
6250
    margin-bottom: 20px;
6251
    border-bottom: 1px solid #A1C8DB;
6252
    padding-bottom: 20px;
6253
}
6254

    
6255
.vm-connect .connection-info {
6256
    padding-bottom: 0px;
6257
    margin-bottom: 0;
6258
    border-bottom: none;
6259
}
6260

    
6261
.vm-connect .connection-info .connect a {
6262
    color: #fff;
6263
}
6264

    
6265
.vm-connect .connection-info .connect {
6266
    background-color: #387693;
6267
    color: #fff;
6268
    padding: 10px;
6269
    font-size: 1.2em;
6270
    text-align: center;
6271
}
6272

    
6273
.clip-copy {
6274
    display: block;
6275
    width: 20px;
6276
    height: 20px;
6277
    position: absolute;
6278
    border: 1px solid #387693;
6279
    background-image: url("../images/clipboard.png");
6280
    background-repeat: no-repeat;
6281
    background-position: center;
6282
    cursor: pointer;
6283
    background-color: #A1C8DB;
6284
}
6285

    
6286
.password-cont .clip-copy { right: 10px; top: 8px;}
6287

    
6288

    
6289
.overlay-invitations {
6290
    width: 680px;
6291
}
6292
.invitations-form .sending .sending-msg {
6293
    font-size: 0.8em;
6294
    display: block !important;
6295
    margin-bottom: 5px;
6296
    color: #008800;
6297
}
6298

    
6299
.invitations-form .send-error {
6300
    font-size: 0.8em;
6301
    margin-bottom: 5px;
6302
    margin-top: 5px;
6303
    color: #800;
6304
    padding: 3px;
6305
    padding-left: 0;
6306
    display: none;
6307
}
6308

    
6309
.invitations-form .error label {
6310
    color: #000 !important;
6311
}
6312

    
6313
.invitations-form .form-field {
6314
    width: 49%;
6315
    float: left;
6316
}
6317

    
6318
.invitations-view .left.none {
6319
    background-color: #880000;
6320
}
6321

    
6322
.invitations-form {
6323
    position: relative;
6324
}
6325

    
6326
.invitations-form h3 {
6327
    float: left;
6328
}
6329

    
6330
.invitations-form .add-new-invitation {
6331
    float:left;
6332
    top:2px;
6333
    right: 20px;
6334
    width: 16px;
6335
    height: 16px;
6336
    background-image: url("../images/option-action-add.png");
6337
    background-repeat: no-repeat;
6338
    background-position: center;
6339
    text-indent: -50000em;
6340
    background-color: #4085A5;
6341
    margin-left: 15px;
6342
    cursor: pointer;
6343
}
6344

    
6345
.invitations-view .left {
6346
    font-size: 1em;
6347
    color: #fff;
6348
    font-weight: bold;
6349
    background-color: #4085A5;
6350
    padding: 4px;
6351
}
6352

    
6353
input.has-errors {
6354
    border-color: #ff0000;
6355
}
6356

    
6357
.none-left .invitations-wrapper .invitations-list {
6358
    width: 100% !important;
6359
    border-left: none !important;
6360
    padding-left: 0;
6361
}
6362

    
6363
.invitations-wrapper .invitations-list {
6364
    width: 40%;
6365
    float: left;
6366
    padding-left: 10px;
6367
    border-left: 1px solid #4085A5;
6368
    margin-left: -1px
6369
}
6370

    
6371
.invitations-wrapper .invitations-form {
6372
    width: 57%;
6373
    float: left;
6374
    border-right: 1px solid #4085A5;
6375
}
6376

    
6377
.invitations-wrapper label span {
6378
    color: #aaa;
6379
    font-size: 0.8em;
6380
}
6381

    
6382
.invitations-wrapper label {
6383
    display: block;
6384
    font-size: 0.9em;
6385
    margin-bottom:10px;
6386
    font-weight: bold;
6387
}
6388

    
6389
.invitations-view .add-new-invitation {
6390
    cursor: pointer;
6391
}
6392

    
6393
.invitations-wrapper input.name {
6394
    width: 150px;
6395
}
6396

    
6397
.invitations-wrapper input {
6398
    font-size: 0.9em;
6399
    width: 155px;
6400
    padding:4px;
6401
}
6402

    
6403
.invitations-list .invitation-sent {
6404
    border-bottom: 1px solid #A1C8DB;
6405
    padding-bottom: 5px;
6406
    margin-bottom: 5px;
6407
    position: relative;
6408
}
6409

    
6410
.invitations-view h3 {
6411
    margin-bottom: 10px;
6412
    color: #4085A5;
6413
}
6414

    
6415
.invitations-list .invitation-sent.last,
6416
.invitations-list .invitation-sent:last-child {
6417
    border-bottom: none;
6418
}
6419

    
6420

    
6421
.invitations-list .invitation-sent .email {
6422
    color: #D98147;
6423
    font-size: 0.8em;
6424
    font-weight: bold;
6425
    margin-top: 2px;
6426
}
6427

    
6428
.invitations-list .pagination a,
6429
.invitations-list .pagination span {
6430
    padding: 0.2em 0.3em;
6431
}
6432

    
6433
.invitations-list .pagination {
6434
    font-size: 0.75em;
6435
}
6436

    
6437
.invitations-list .name {
6438
    color: #444;
6439
    font-size: 0.9em;
6440
}
6441

    
6442
.invitations-list .status.sending {
6443
    background-image: url("../images/icons/indicators/small/progress.gif");
6444
}
6445

    
6446
.invitations-list .status.sent {
6447
    background-image: url("../images/invitation_accepted.png");
6448
}
6449

    
6450
.invitations-list .status.resend {
6451
    background-image: url("../images/resend.png");
6452
}
6453

    
6454
.invitations-list .status.resend {
6455
    cursor: pointer;
6456
}
6457

    
6458
.invitations-list .status {
6459
    width: 20px;
6460
    height: 15px;
6461
    position: absolute;
6462
    top:5px;
6463
    right: 2px;
6464
    background-repeat: no-repeat;
6465
    background-position: center;
6466
}
6467

    
6468
.invitations-form .form-entry:last-child {
6469
    border-bottom: none;
6470
}
6471

    
6472
.invitations-form .form-entry {
6473
    position: relative;
6474
    margin-bottom: 10px;
6475
    padding-bottom: 10px;
6476
    border-bottom: 1px solid #ddd;
6477
    margin-right: 10px;
6478
}
6479

    
6480
.invitations-form .send-invitations {
6481
    float: left;
6482
    padding: 5px;
6483
    color: #fff;
6484
    margin-right: 10px;
6485
    margin-top: 10px;
6486
}
6487

    
6488
.invitations-form .form-entry.error {
6489
    padding-bottom: 0px;
6490
}
6491

    
6492
.invitations-form .form-entry.error .remove-invitation {
6493
    bottom: 32px;
6494
}
6495

    
6496
.invitations-form .remove-invitation {
6497
    padding: 5px;
6498
    background-image: url("../images/option-action-remove.png");
6499
    background-position: center;
6500
    background-repeat: no-repeat;
6501
    color: #fff;
6502
    width: 15px;
6503
    height: 15px;
6504
    cursor: pointer;
6505
    text-indent: -50000px;
6506
    position: absolute;
6507
    right: -10px;
6508
    bottom: 14px;
6509
}
6510

    
6511
.invitations-list .resent-info,
6512
.invitations-form .top-info {
6513
    font-size: 0.8em;
6514
    margin-bottom: 10px;
6515
}
6516

    
6517
.invitations-list .msg .email,
6518
.invitations-form .success .msg .email {
6519
    font-weight: bold;
6520
}
6521

    
6522
.invitations-list .msg.err-msg,
6523
.invitations-list .success.msg,
6524
.invitations-form .success .msg {
6525
    background-color: #080;
6526
    color: white;
6527
    padding: 5px;
6528
    margin-right: 10px;
6529
    margin-bottom: 5px;
6530
}
6531
.invitations-list .msg.err-msg,
6532
.invitations-list .success.msg {
6533
    margin-right: 0px;
6534
}
6535
.invitations-list .msg.err-msg {
6536
    background-color: #800;
6537
}
6538

    
6539
.overlay .models-view .previous-view-link {
6540
    margin: -10px;
6541
    margin-bottom:10px;
6542
    padding: 10px 5px;
6543
    background-image: url("../images/left-arrow.png");
6544
    background-repeat: no-repeat;
6545
    background-position: 10px center;
6546
    padding-left: 20px;
6547
    background-color: #93D070;
6548
    cursor: pointer;
6549
    border-bottom: 1px solid #eee;
6550
    text-decoration: underline;
6551
}
6552
.models-view .quick-add {
6553
    text-decoration: underline; 
6554
    color: #4085A5;
6555
    cursor: pointer;
6556
}
6557

    
6558
.empty .items-list {
6559
    margin-top: 0 !important;
6560
}
6561

    
6562
.models-view .items-empty-msg {
6563
    border-top: 1px solid #aaa;
6564
    padding-top: 10px;
6565
    font-size: 1em;
6566
    margin-top:0 !important;
6567
}
6568

    
6569
.models-view .items-empty-msg,
6570
.models-view .model-description {
6571
    color: #444;
6572
    margin: 10px 0;
6573
}
6574

    
6575
.models-view .model-list .collection-action.disabled {
6576
    background-color: #aaa;
6577
    border-color: #aaa;
6578
    cursor: default;
6579
}
6580
.models-view .model-list .collection-action.disabled:hover {
6581
    background-color: #aaa;
6582
    border-color: #aaa;
6583
}
6584

    
6585
.models-view .model-list .collection-action:hover {
6586
    background-color: #aaa;
6587
}
6588

    
6589
.models-view .model-list .collection-action:hover {
6590
    background-color: #F95;
6591
    border-color: #F95;
6592
}
6593

    
6594
.models-view .model-list .collection-action.in-progress {
6595
    background-color: #aaa;
6596
    color: #fff;
6597
    border-color: #aaa;
6598
    background-image: url("../images/icons/indicators/small/progress.gif") !important;
6599
}
6600

    
6601
.models-view .model-list .collection-action.add-generate {
6602
    background-image: url("../images/option-action-generate-ssh.png");
6603
}
6604

    
6605
.models-view .model-list .collection-action.add {
6606
    background-image: url("../images/option-action-add.png");
6607
    padding-right: 20px !important;
6608
}
6609

    
6610
.models-view .model-list .collection-action {
6611
    float: right;
6612
    background-color: #FF7F2A;
6613
    color: #fff;
6614
    padding: 6px 8px;
6615
    margin-left: 10px;
6616
    cursor: pointer;
6617
    padding-right: 30px;
6618
    background-position: right center;
6619
    background-repeat: no-repeat;
6620
    background-clip: border-box;
6621
    border-right: 5px solid #FF7F2A;
6622
}
6623

    
6624
.models-view .items-list {
6625
    margin-top: 10px;
6626
}
6627

    
6628
.models-view .model-list ul li.model-item:last-child {
6629
    margin-bottom: 0;
6630
}
6631

    
6632
.models-view .model-list ul li.model-item {
6633
    background-color: #D4E2E8;
6634
    margin-bottom: 5px;
6635
    position: relative;
6636
}
6637

    
6638
.models-view .model-list ul li.model-item .param {
6639
    float: left;
6640
    padding: 6px;
6641
}
6642

    
6643
.models-view .model-list ul li.model-item .item-action.confirm-remove {
6644
    margin-right: -15px !important;
6645
}
6646

    
6647
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover .cancel {
6648
    color: inherit !important;
6649
}
6650

    
6651
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover {
6652
    background-color: #F95;
6653
    color: inherit !important;
6654
}
6655

    
6656
.models-view .model-list ul li.model-item .item-action.confirm-remove span.cancel {
6657
    padding: 6px !important;
6658
}
6659

    
6660
.models-view .model-list ul li.model-item .item-action.confirm-remove span {
6661
    display: block;
6662
    float: left;
6663
    padding: 6px 15px;
6664
}
6665

    
6666
.models-view .model-list ul li.model-item .item-action .cancel-remove:hover {
6667
    color: #fff !important;
6668
}
6669

    
6670
.models-view .model-list ul li.model-item .item-action.confirm-remove,
6671
.models-view .model-list ul li.model-item .item-action .do-confirm,
6672
.models-view .model-list ul li.model-item .item-action .cancel-remove {
6673
    display:none !important;
6674
    background-color: #D95D0A;
6675
    padding:0;
6676
    margin:0;
6677
}
6678

    
6679
.models-view .model-list ul li.model-item.pending-delete .item-action.remove {
6680
    display: none;
6681
}
6682

    
6683
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel {
6684
    background-color: #F95;
6685
}
6686

    
6687
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm {
6688
    background-color: #FF7F2A;
6689
}
6690

    
6691
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove,
6692
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove .do-confirm,
6693
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel-remove {
6694
    display:block !important;
6695
}
6696

    
6697
.models-view .model-list ul li.model-item.pending-delete .item-action {
6698
    display: block;
6699
}
6700

    
6701
.models-view .model-list ul li.model-item.expanded .item-action,
6702
.models-view .model-list ul li.model-item:hover .item-action {
6703
    display: block;
6704
}
6705

    
6706
.models-view .model-list ul li.model-item .item-action.hide {
6707
    background-image: url("../images/minus-8.png");
6708
}
6709
.models-view .model-list ul li.model-item .item-action.show:hover {
6710
    background-image: url("../images/plus-8.png");
6711
}
6712

    
6713
.models-view .model-list ul li.model-item .item-action.show {
6714
    background-image: url("../images/plus-8-dark.png");
6715
}
6716

    
6717
.models-view .model-list ul li.model-item .item-action.remove {
6718
    background-image: url("../images/option-action-remove.png");
6719
}
6720

    
6721
.models-view .model-list ul li.model-item .item-action.edit:hover {
6722
    background-image: url("../images/option-action-edit-light.png");
6723
}
6724

    
6725
.models-view .model-list ul li.model-item .item-action.edit {
6726
    background-image: url("../images/option-action-edit.png");
6727
}
6728
.models-view .model-list ul li.model-item .item-action.remove:hover {
6729
    background-color: #880000 !important;
6730
    border-color: #800 !important;
6731
}
6732

    
6733
.models-view .model-list ul li.model-item.expanded .item-action.show,
6734
.models-view .model-list ul li.model-item.expanded .item-action.hide,
6735
.models-view .model-list ul li .item-actions .item-action:hover {
6736
    background-color: #4085A5;
6737
    color: #fff;
6738
    border-color: #4085A5;
6739
}
6740

    
6741
.models-view .model-list ul li .item-actions {
6742
    position: absolute;
6743
    right: -10px;
6744
    top: 0px;
6745
}
6746

    
6747
.models-view .model-list ul li .item-actions .item-action {
6748
    float: right;
6749
    padding: 6px;
6750
    margin-right: 10px;
6751
    display: none;
6752
    cursor: pointer;
6753
    padding-right: 20px;
6754
    background-repeat: no-repeat;
6755
    background-position: right center;
6756
    border-right: 5px solid transparent;
6757
}
6758

    
6759
.models-view .model-list h3 {
6760
    float: left;
6761
}
6762

    
6763
.models-view h3 {
6764
    font-size: 1.2em;
6765
    margin-bottom: 1em;
6766
    margin-top: 5px;
6767
    color: #4085A5;
6768
}
6769

    
6770
.models-view .form-actions {
6771
    font-size: 1.1em;
6772
}
6773

    
6774
.models-view .model-list ul li,
6775
.models-view .model-list ul {
6776
    list-style: none;
6777
}
6778

    
6779
.models-view .model-list ul li.header {
6780
    display: none;
6781
}
6782

    
6783
.models-view .model-form textarea {
6784
    width: 99%;
6785
    height: 100px;
6786
    border: 1px solid #aaa;
6787
}
6788

    
6789

    
6790
.models-view .model-form .form-field {
6791
    margin-bottom: 10px;
6792
}
6793

    
6794
.models-view .model-form label {
6795
    display: block;
6796
    color: #406A7D;
6797
    font-size: 1.1em;
6798
    margin: 0px 0 5px 0;
6799
}
6800

    
6801
.models-view .model-form .inline label {
6802
    float: left;
6803
    margin-right: 10px;
6804
    margin-top: 10px !important;
6805
}
6806

    
6807
.models-view .model-form input.long {
6808
    width: 400px;
6809
}
6810

    
6811
.models-view .model-form .inline input {
6812
    width: auto;
6813
    margin-top: 10px;
6814
}
6815

    
6816
.models-view .model-form .inline select {
6817
    width: auto;
6818
    margin-top: 7px;
6819
}
6820

    
6821
.models-view .model-form .inline .errors,
6822
.models-view .model-form .inline .field-desc {
6823
    clear: both;
6824
}
6825

    
6826
#user_public_keys .private-download {
6827
    margin: 5px 0;
6828
    margin-top: 6px;
6829
}
6830

    
6831
#user_public_keys .private-cont form {
6832
    float: left;
6833
    margin-left: 5px;
6834
}
6835

    
6836
#user_public_keys input.form-text:hover {
6837
    background: #F95;
6838
}
6839

    
6840
#user_public_keys input.form-text {
6841
    background: #FF7F2A;
6842
    color: #fff;
6843
    border: 1px solid #F95;
6844
    padding: 0 5px;
6845
    margin: 0 5px;
6846
    margin-top: -1px;
6847
    cursor: pointer;
6848
}
6849

    
6850
#user_public_keys .form-text {
6851
    float: left;
6852
}
6853

    
6854
#user_custom_images,
6855
#user_public_keys {
6856
    font-size: 0.7em;
6857
}
6858

    
6859
#user_public_keys .download-button {
6860
    width: 30px;
6861
    height: 30px;
6862
}
6863

    
6864

    
6865
#user_public_keys #model-item-tpl {
6866
    display: none;
6867
}
6868
#user_public_keys .model-item .name {
6869
    color: #4085A5;
6870
    font-size: 1.2em;
6871
}
6872

    
6873
#user_public_keys .model-item .fingerprint .flabel {
6874
    color: #888;
6875
    float: left;
6876
    margin-right: 5px;
6877
}
6878

    
6879
#user_public_keys .model-item .fingerprint {
6880
    float: none;
6881
    clear: both;
6882
    color: #444;
6883
    font-family: monospace;
6884
    letter-spacing: 1px;
6885
    padding: 4px;
6886
    font-size: 0.9em;
6887
    border-top: 1px solid #fff;
6888
}
6889

    
6890
#user_public_keys .model-item .publicid {
6891
    display: none;
6892
}
6893

    
6894
#user_public_keys .model-item.expanded .publicid .param-content {
6895
    padding: 5px 5px;
6896
    overflow: auto;
6897
    background-color: #FFF;
6898
    border: 1px solid #4085A5;
6899
    border-left: none;
6900
    border-right: none;
6901
    font-size: 1.1em;
6902
}
6903

    
6904
#user_public_keys .model-item.expanded .publicid .param-content textarea {
6905
    width: 100%;
6906
    height: 90px;
6907
    margin:0;
6908
    padding:0;
6909
    border:none;
6910
    overflow: auto;
6911
}
6912

    
6913
#user_public_keys .model-item.expanded .publicid {
6914
    display: block;
6915
    background-color: #fff;
6916
    width: 100%;
6917
    margin-top: 0px;
6918
    margin-left: 0px;
6919
    color: #fff;
6920
    padding:0 !important;
6921
}
6922

    
6923
.models-view .form-messages {
6924
    margin-bottom: 10px;
6925
}
6926

    
6927
.models-view .list-messages {
6928
    margin-top: 10px;
6929
}
6930

    
6931
.models-view .form-messages .error,
6932
.models-view .form-messages .success,
6933
.models-view .list-messages .error,
6934
.models-view .list-messages .success,
6935
#user_public_keys .private-cont {
6936
    background-color: #AADE87;
6937
    color: #447821;
6938
    padding: 5px;
6939
    border: 1px solid #447821;
6940
    font-size: 1.1em;
6941
    margin-top: 5px;
6942
}
6943

    
6944
.models-view .form-messages .error,
6945
.models-view .list-messages .error {
6946
    background-color: #DE8D87;
6947
    color:  #782421 !important;
6948
    border-color: #782421;
6949
}
6950

    
6951
#user_public_keys .limit-msg {
6952
    color: #800;
6953
    position: absolute;
6954
    right: 20px;
6955
    top: 25px;
6956
}
6957

    
6958
#user_public_keys .private-cont {
6959
    margin-top: 10px;
6960
}
6961

    
6962
#user_public_keys .private-cont .private-msg {
6963
    float: left;
6964
    padding:5px;
6965
    margin-top: 5px;
6966
}
6967

    
6968
#user_public_keys .private-cont textarea {
6969
    margin: 5px;
6970
    width: 97%;
6971
    height: 200px;
6972
}
6973

    
6974
#user_public_keys .private-cont .close-private:hover {
6975
    color: #Fff;
6976
}
6977

    
6978
#user_public_keys .private-cont .close-private {
6979
    float: right;
6980
    margin-right: 5px;
6981
    font-weight: bold;
6982
    cursor: pointer;
6983
    text-decoration: underline;
6984
}
6985

    
6986
#user_public_keys .model-item .key-type {
6987
    background-color: #72ADC8;
6988
    color: #fff;
6989
    text-align: center;
6990
    font-size: 0.9em;
6991
    padding:2px 10px;
6992
    margin: 4px 6px;
6993
    margin-top: 7px;
6994
    font-weight: bold;
6995
}
6996

    
6997
#user_public_keys .private-cont .down-button {
6998
}
6999

    
7000
.models-view .form-field .field-desc {
7001
    font-style: italic;
7002
    font-size: 1em;
7003
    color: #888;
7004
}
7005

    
7006
.models-view .form-field.error label {
7007
    font-weight: bold;
7008
    color: #800 !important;
7009
}
7010

    
7011
.models-view .form-field .errors {
7012
    margin: 5px 0;
7013
}
7014

    
7015
.models-view .form-field .errors .error {
7016
    background-color: transparent;
7017
    border: none;
7018
    color: #800;
7019
}
7020

    
7021
.single .suspended-notice {
7022
  right: 180px;
7023
  top: 0px;
7024
  padding: 7px;
7025
  padding-bottom: 6px;
7026
}
7027

    
7028
.icon .suspended-notice {
7029
  right: 192px;
7030
  top: 50px;
7031
}
7032

    
7033
.suspended-notice {
7034
  display: inline-block;
7035
  padding: 4px;
7036
  background-color: #8f1915;
7037
  cursor: pointer;
7038
  position: absolute;
7039
  color: #fff;
7040
  font-size: 0.6em;
7041
  display: none;
7042
}
7043

    
7044
.suspended .suspended-notice {
7045
  display: block;
7046
}
7047

    
7048
.suspended .action-indicator {
7049
  display: none !important;
7050
}