Statistics
| Branch: | Tag: | Revision:

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

History | View | Annotate | Download (126.4 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 35px; 
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
#networkscreate:hover {
2583
    background-color: #FF9955;
2584
}
2585

    
2586
#createcontainer {
2587
}
2588

    
2589
#networks-container {
2590
}
2591

    
2592
#networks-pane .public-networks {
2593
    background: #EFF7FA repeat scroll 0 0;
2594
    margin: 0 0 0px;
2595
    padding: 0 0 15px 0px;
2596
}
2597

    
2598
#networks-pane .private-networks .network:last-child {
2599
    border-bottom: none;
2600
}
2601

    
2602
#networks-pane .private-networks {
2603
    background: #EFF7FA repeat scroll 0 0;
2604
    padding: 15px 20px 20px 0px;
2605
    margin-top: 18px;
2606
}
2607

    
2608
.private-networks .network-cont:last-child {
2609
    border-bottom: none;
2610
}
2611

    
2612
.private-networks .network-cont {
2613
    border-bottom: 1px solid #D1E7F0;
2614
    padding-bottom:5px;
2615
    margin-bottom: 5px;
2616
    width: 520px;
2617
}
2618

    
2619
.private-networks .network {
2620
    padding-top: 10px;
2621
    padding-bottom: 10px;
2622
}
2623

    
2624
#public-template, #private-template, #public-machine-template, #private-machine-template {
2625
    display:none;
2626
}
2627

    
2628
div.network-cont.disable-destroy .actions .destroy {
2629
    display: none !important;
2630
}
2631

    
2632
div.network-cont.pending .actions .action-add {
2633
    display: none;
2634
}
2635

    
2636
div.network-cont.in-error .actions .action-add {
2637
    display: none;
2638
}
2639

    
2640
div.network a.action-network-add {
2641
    display: none;
2642
}
2643

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

    
2650
div.network {
2651
    clear: both;
2652
    padding: 5px 20px 5px 20px;
2653
    width: 480px;
2654
    position: relative;
2655
}
2656

    
2657
#private-template {
2658
    margin: 2px 0 0 -30px;
2659
}
2660

    
2661
div.network-placeholder {
2662
    margin-left: 33px;
2663
}
2664

    
2665
div.private-networks div.network-placeholder {
2666
}
2667

    
2668
div.network-cable {
2669
    border-left: 3px solid #FF7F2A;
2670
    float: left;
2671
    margin-left: -40px;
2672
    margin-top: -45px;
2673
    height: 185px;
2674
    overflow: hidden;
2675
}
2676

    
2677
.first div.network-cable {
2678
    height:143px;
2679
    margin-top:-6px;
2680
    position: relative;
2681
}
2682

    
2683
div.network-contents div.machines-list div.first {
2684
    margin-top:0;
2685
}
2686

    
2687
.last div.network-cable {
2688
    height:85px;
2689
}
2690

    
2691
div.firewall-cable {
2692
    border-left: 3px solid #FF7F2A;
2693
    float: left;
2694
    margin-left: -100px;
2695
    margin-top: -20px;
2696
    height: 110px;
2697
}
2698

    
2699
.last div.firewall-cable {
2700
    display:none;
2701
}
2702

    
2703
div.network a:hover {
2704
    text-decoration: underline;
2705
    cursor: pointer;
2706
}
2707

    
2708
#networks-container .name {
2709
    font-size: 75%;
2710
}
2711

    
2712
div.network-machines, div.firewall {
2713
    font-size: 75%;
2714
    margin-left: 70px;
2715
}
2716

    
2717
div.firewall {
2718
    margin-left: 60px;
2719
    margin-bottom: 3px;
2720
    margin-top: -3px;
2721
}
2722

    
2723
div.firewall .firewall-options {
2724
    float: left;
2725
}
2726

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

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

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

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

    
2747
div.firewall-label.darker {
2748
    background-color: #4085a5;
2749
}
2750

    
2751
.state {
2752
}
2753

    
2754
.network .state {
2755
    font-size: 75%;
2756
    position: absolute;
2757
    right: 10px;
2758
    top: 5px;
2759
}
2760

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

    
2772
div.network div.machine-actions {
2773
    text-decoration: none;
2774
    float: right;
2775
    margin: -17px -180px 0 0;
2776
    font-weight: normal;
2777
    font-size: 75%;
2778
}
2779

    
2780
div.network div.actions a, div.network div.machine-actions a {
2781
    text-decoration: none;
2782
    height: 15px;
2783
    color: black;
2784
    visibility: hidden;
2785
    display: block;
2786
}
2787

    
2788

    
2789
div.network div.machine-actions a {
2790
    margin: 8px 0 0 8px;
2791
}
2792
div.network div.net-actions a {
2793
    margin: 0 0 8px 8px;
2794
    width: 168px;
2795
}
2796
div.network div.action-container {
2797
    bottom: auto;
2798
}
2799

    
2800
div.network div.net-actions .confirm_single {
2801
    position: absolute;
2802
    left: 96px;
2803
    width: 150px;
2804
    margin: 0 0px -5px 0;
2805
    font-size: 100%;
2806
}
2807

    
2808
div.network div.actions a:hover, div.network div.machine-actions a:hover {
2809
    display: block;
2810
    background-color:#A1C8DB;
2811
    opacity: 0.8;
2812
    filter: alpha(opacity = 80);
2813
}
2814

    
2815
div.network.expand .net-actions a {
2816
    visibility: visible;
2817
}
2818

    
2819
div.network:hover div.actions a, div.network-machine:hover div.machine-actions a {
2820
    visibility: visible;
2821
}
2822

    
2823
div.network div.machine-actions a.action-destroy.selected {
2824
    color: #880000 !important;
2825
}
2826

    
2827
div.network div.actions a.visible,
2828
div.network div.net-vm-actions a.visible,
2829
div.network div.actions a.selected:hover, div.network div.machine-actions a.selected {
2830
    background-color: transparent !important;
2831
    visibility: visible!important;
2832
}
2833

    
2834
div.network .net-vm-actions .confirm_single {
2835
    font-size: 100% !important;
2836
    margin-right: -20px !important;
2837
    position: absolute !important;
2838
    top: 7px;
2839
    right:0;
2840
}
2841

    
2842
div.network .nic-ip {
2843
  font-size: 0.8em;
2844
}
2845

    
2846
div.network div.display a {
2847
    visibility: visible;
2848
}
2849

    
2850
div.network-machine div.machine-actions a.action-details {
2851
    margin-top: 7px;
2852
    width: 168px;
2853
}
2854

    
2855
div.network .net-actions {
2856
    margin-right:5px !important;
2857
    margin-top:0px !important;
2858
    height: 80px !important;
2859
}
2860

    
2861
div.network .net-actions .action-container.destroy {
2862
    position: relative;
2863
    bottom: auto;
2864
}
2865

    
2866
div.network:hover {
2867
    background-color: #A1C8DB !important;
2868
}
2869

    
2870
.network-logos {
2871
    float:left;
2872
    padding-right: 10px;
2873
}
2874

    
2875
.network-logos:hover {
2876
    cursor: pointer;
2877
}
2878

    
2879
.state div {
2880
    text-align: right;
2881
    margin: 4px 1px -4px;
2882
}
2883

    
2884
.public-networks .state div {
2885
    margin-top: 4px;
2886
}
2887

    
2888
.private-networks .state div {
2889
    margin-top: 9px;
2890
    margin-bottom: -12px;
2891
}
2892

    
2893
.network .name-div {
2894
    margin-bottom: 15px;
2895
    margin-top: 0px;
2896
}
2897

    
2898
div.indicator {
2899
    clear: none;
2900
    float: right;
2901
    height: 11px;
2902
    margin: 3px -1px;
2903
    width: 10px;
2904
}
2905

    
2906
#private-networks {
2907
    margin-top: 20px;
2908
}
2909

    
2910
.private-networks .editbuttons {
2911
    margin-right: 117px;
2912
    margin-top: 1px;
2913
}
2914

    
2915
.private-networks div.confirm_single {
2916
    margin: 45px -219px -5px 0;
2917
    font-size: 80%;
2918
}
2919

    
2920
.private-networks .network-machine div.confirm_single {
2921
    margin: 0 -199px 0 0;
2922
}
2923

    
2924
.private-networks .state {
2925
}
2926

    
2927
.private-networks div.machines-list {
2928
    padding-top: 3px;
2929
}
2930

    
2931
span.rename-network, span.configure {
2932
    background-repeat: no-repeat;
2933
    color: transparent;
2934
    font-size: 75%;
2935
    font-weight: normal;
2936
    margin-left: 10px;
2937
    margin-right: 10px;
2938
    padding-left: 10px;
2939
    text-align: left;
2940
}
2941

    
2942
span.rename-network {
2943
    cursor: pointer;
2944
}
2945

    
2946
div.name-div:hover span.rename-network {
2947
    color: #3D3D3D;
2948
    margin-top: 0.4em;
2949
    background-image: url("../images/pencil.png");
2950
    background-position: 0 3px;
2951
}
2952

    
2953
div.network:hover a.rename {
2954
    color: #3d3d3d;
2955
}
2956

    
2957
.network-separator {
2958
    background-color: #5CA1C0;
2959
    height: 1px;
2960
    margin: 2px 0 0 -5px;
2961
    width: 480px;
2962
    font-size: 1%;
2963
    line-height: 1px;
2964
}
2965

    
2966
.network-contents {
2967
    margin-left: -4px;
2968
    width: 504px;
2969
    clear: both;
2970
    background: url("../images/orange-border.png") no-repeat;
2971
    background-position: 33px bottom;
2972
}
2973
.network-contents.last-expanded {
2974
    background-position-y: -2600px;
2975
}
2976

    
2977
.network-machine {
2978
    border-bottom: 1px solid #5CA1C0;
2979
}
2980
.network-machine:last-child {
2981
    border-bottom: none;
2982
}
2983

    
2984
.network-machine .state div {
2985
    text-align: left;
2986
}
2987

    
2988
.network-machine {
2989
    margin-left: 35px;
2990
    padding-bottom: 10px;
2991
    padding-left: 5px;
2992
    padding-top: 10px;
2993
    position: relative;
2994
}
2995

    
2996
.network-machine .ips {
2997
    position: absolute;
2998
    right:0;
2999
    top:40px;
3000
    text-align: right;
3001
    padding-right: 10px;
3002
    font-size: 70%;
3003
}
3004

    
3005
.network-machine .logo {
3006
    float:left;
3007
    padding-right: 10px;
3008
    position:relative;
3009
}
3010

    
3011
#networks-container .machine-name {
3012
    text-decoration: none !important;
3013
    margin-bottom: 10px;
3014
    color: #000000;
3015
    margin-top: -4px;
3016
}
3017

    
3018
.private-networks .separator {
3019
    background-color: #5CA1C0;
3020
    height: 1px;
3021
    margin: 3px 0 -2px -10px;
3022
    width: 485px;
3023
}
3024

    
3025
.network-machine .state {
3026
    margin-right: 18px;
3027
}
3028

    
3029
.network-machine .state .status {
3030
    margin-bottom: 4px;
3031
}
3032

    
3033
.machine-name .name {
3034
}
3035

    
3036
.machine-name .namecontainer {
3037
    line-height: 18px;
3038
    margin-bottom: 20px;
3039
}
3040

    
3041
div.network-machine:hover {
3042
    background-color: #84B7D0;
3043
}
3044

    
3045
.machines {
3046
    width: 416px;
3047
    margin-bottom: -8px;
3048
    margin-top: 10px;
3049
}
3050

    
3051
div.empty-network-slot {
3052
    height: 60px;
3053
}
3054

    
3055
div.network-remove-machine, div.network-add-machine {
3056
    background-color: #FB822F;
3057
    color: #bc4b00;
3058
    width:90px;
3059
    height:18px;
3060
    float:left;
3061
    margin:40px 0 0 -100px;
3062
}
3063

    
3064
span.remove-icon {
3065
    font-size: 80%;
3066
    margin-left: 15px;
3067
    position: relative;
3068
    bottom:1px;
3069
}
3070

    
3071
div.add-icon {
3072
    margin-left: 15px;
3073
    margin-top: -1px;
3074
    cursor: pointer;
3075
}
3076

    
3077
span.remove-icon:hover, span.add-icon:hover {
3078
    cursor:pointer;
3079
    color: #fff;
3080
}
3081

    
3082
div.network-add-machine {
3083
    margin:43px 0 0 0px;
3084
}
3085

    
3086
.firewall-on {
3087
    color: #42E342;
3088
}
3089

    
3090
.firewall-off {
3091
    color: #F82E2E;
3092
}
3093

    
3094
.firewall-content {
3095
    color: black;
3096
    font-size: 60%;
3097
    margin-left: 60px;
3098
    height: 55px;
3099
}
3100

    
3101
.firewall-content .checkbox-legends {
3102
    cursor: pointer;
3103
}
3104

    
3105
.firewall-content .checkbox-legends.current {
3106
    font-weight: bold;
3107
}
3108

    
3109
.firewall-content .checkbox-legends {
3110
    vertical-align: text-top;
3111
}
3112

    
3113
.checkbox-legends a {
3114
    color: black;
3115
    text-decoration: underline;
3116
    font-size: 100%;
3117
}
3118

    
3119
h5.machine-connect {
3120
    font-size: 75%;
3121
    margin-bottom: 3px;
3122
    height: 23px;
3123
}
3124

    
3125
.machine-connect span {
3126
    text-decoration: underline;
3127
}
3128

    
3129
h5.machine-connect span:hover {
3130
    cursor: pointer;
3131
}
3132

    
3133
.firewall-apply {
3134
    background-color: #4085a5;
3135
    border: medium none;
3136
    float: right;
3137
    font-size: 105%;
3138
    height: 18px;
3139
    margin-right: 5px;
3140
    margin-top: 3px;
3141
    width: 75px;
3142
    position: relative;
3143
    bottom:20px;
3144
}
3145

    
3146
.firewall-apply:hover {
3147
    background-color:#5CA1C0;
3148
}
3149

    
3150
.name-div {
3151
    margin: -9px 0 30px 70px;
3152
}
3153

    
3154
.machine-name-div {
3155
    margin-bottom: 20px;
3156
    margin-left: 60px;
3157
}
3158

    
3159
div.reboot-dialog {
3160
    display: none;
3161
    color: black;
3162
    background-color: #4085A5;
3163
    font-size: 75%;
3164
    margin-top: 15px;
3165
    width: 698px;
3166
    z-index: 1;
3167
}
3168

    
3169
div#reboot-machine-template, div.reboot-machine-entry {
3170
    display: none;
3171
    padding: 0 0 10px 35px;
3172
    width: 300px;
3173
}
3174

    
3175
div.reboot-dialog p {
3176
    color: #FFFFFF;
3177
    padding: 10px 0 10px 10px;
3178
}
3179

    
3180
div.reboot-dialog button {
3181
    float:right;
3182
    border: 1px solid #FF7F2A;
3183
    background-color: transparent;
3184
    font-size:100%;
3185
}
3186

    
3187
div.reboot-dialog button:hover {
3188
    background-color: #FF7F2A;
3189
}
3190

    
3191
div.reboot-dialog button.reboot-all {
3192
    margin: -30px 35px 0 0;
3193
}
3194

    
3195
div.reboot-dialog button.reboot-single {
3196
    color: black;
3197
    margin-top: -20px;
3198
}
3199

    
3200
div.reboot-dialog div.code, div.reboot-dialog div.action, div.reboot-dialog div.message, div.reboot-dialog button.details {
3201
    display:none;
3202
}
3203

    
3204
div.reboot-dialog button.details {
3205
    border-color: #800000;
3206
    margin-top: -20px;
3207
}
3208

    
3209
div.reboot-dialog button.details:hover {
3210
    background-color: #800000;
3211
}
3212

    
3213
/* Metadata */
3214
.machine .info-content {
3215
    display: none;
3216
}
3217

    
3218
.metadata-container {
3219
    line-height: 12px;
3220
    height: 85px;
3221
    background-color: #84b7d0;
3222
}
3223

    
3224
.metadata-column {
3225
    border-right: 1px solid #5CA1C0;
3226
    color: black;
3227
    float: left;
3228
    font-size: 60%;
3229
    margin-top: 3px;
3230
    height: 70px;
3231
    padding-bottom: 5px;
3232
}
3233

    
3234
.vm-stats {
3235
    padding-left: 10px;
3236
    padding-right: 5px;
3237
    width: 220px;
3238
}
3239

    
3240
.vm-stats div.stat-content {
3241
    height: 18px;
3242
}
3243

    
3244
.vm-stats div.stat-content img {
3245
    margin: 0;
3246
}
3247

    
3248
.vm-stats div img.stat-busy {
3249
    margin-top: -7px;
3250
    margin-left: 90px;
3251
}
3252

    
3253
.vm-stats div.stat-content img.busy {
3254
    margin-left: 95px;
3255
}
3256

    
3257
.vm-stats div.stat-error {
3258
    display:none;
3259
}
3260

    
3261
div.stat-error {
3262
    color: #f00;
3263
}
3264

    
3265
.single div.stat-error {
3266
    text-align: center;
3267
    font-size: 0.8em;
3268
}
3269

    
3270
.metadata-column {
3271
    margin-top: 4px;
3272
}
3273

    
3274
.vm-details {
3275
    width: 130px;
3276
    margin-left:17px;
3277
}
3278

    
3279
.vm-details.metadata-column {
3280
    padding-top: 5px;
3281
    height: 65px;
3282
}
3283

    
3284
.vm-details .image-details {
3285
    margin-top: 8px;
3286
}
3287

    
3288
.vm-details .vm-detail {
3289
    display: block;
3290
}
3291

    
3292
.vm-details span.value {
3293
    color: #444;
3294
}
3295

    
3296
.single-container .lower .stat-busy {
3297
    margin-top: 10px;
3298
    margin-left: 325px;
3299
}
3300

    
3301
.vm-metadata {
3302
    padding-left: 10px;
3303
    width: 100px;
3304
    border: none;
3305
}
3306

    
3307
.metadata-left {
3308
}
3309

    
3310
.metadata-right {
3311
    width: 73px;
3312
    float:left;
3313
    height: 35px;
3314
    padding-left: 5px;
3315
    position:relative;
3316
    overflow:hidden;
3317
}
3318

    
3319
.metadata-right .items {
3320
    position:absolute;
3321
    height:20000em;
3322
}
3323

    
3324
.metadata-keys-container {
3325
    height: 60px;
3326
    float: left;
3327
}
3328

    
3329
.single .metadata-keys-container {
3330
    float: none;
3331
    height: auto;
3332
    margin-bottom: 5px;
3333
}
3334

    
3335
.single a.manage-metadata {
3336
    font-size: 80%;
3337
    margin-left:4px;
3338
    color: #383838;
3339
}
3340

    
3341
a.manage-metadata, a.stats-report {
3342
    font-size: 100%;
3343
    color: black;
3344
    margin-left:17px;
3345
    text-decoration: underline;
3346
}
3347

    
3348
a.stats-report {
3349
    margin: 15px 0  0 80px;
3350
}
3351

    
3352
div.machine a.manage-metadata:hover {
3353
    background-color: transparent;
3354
}
3355

    
3356
.single .metadata-actions, .single .metadata-keys-container .items {
3357
    padding-left: 5px;
3358
}
3359
.metadata-actions, .metadata-keys-container .items{
3360
    margin-top: 5px;
3361
}
3362

    
3363
.singe .metadata-actions, .single .metadata-keys-container .items{
3364
    font-size: 80%;
3365
    line-height: 12px;
3366
    width: 300px;
3367
}
3368

    
3369
.metadata-actions .prev,  .metadata-actions .next{
3370
    float:left;
3371
    width:29px;
3372
    height:6px;
3373
    cursor: pointer;
3374
}
3375

    
3376
.metadata-actions .prev {
3377
    background: url("../images/roll-up.png") no-repeat scroll 0 0 transparent;
3378
}
3379

    
3380
.metadata-actions .next {
3381
    background: url("../images/roll-down.png") no-repeat scroll 0 0 transparent;
3382
}
3383

    
3384
.scrollable {
3385
    position:relative;
3386
    overflow:hidden;
3387
    height: 35px;
3388
    width: 120px;
3389
    margin-bottom:2px;
3390
}
3391

    
3392
.scrollable .items {
3393
    position:absolute;
3394
    height:20000em;
3395
}
3396

    
3397
/* single view */
3398
.single {
3399
    color: #383838;
3400
}
3401

    
3402
.single .column1 {
3403
    float: left;
3404
    margin: 1px 0 25px 17px;
3405
    width: 140px;
3406
}
3407

    
3408
.single .column1 .state {
3409
    float: left;
3410
    margin-left: 4px;
3411
    padding-bottom: 6px;
3412
    padding-top: 3px;
3413
    position: relative;
3414
    right: 0;
3415
    text-align: center;
3416
    width: 126px;
3417
}
3418

    
3419
.single .column1 .state-label {
3420
    padding-top: 5px;
3421
}
3422

    
3423
.single .column1 .indicators {
3424
    margin-right: 38px !important;
3425
}
3426

    
3427
.single div.connect-arrow {
3428
    margin-left: -17px;
3429
}
3430

    
3431
.single div.connect-border {
3432
    margin-left: -29px;
3433
}
3434

    
3435
.single .single-actions {
3436
    width: 150px;
3437
    height: 60px;
3438
    margin-bottom: 45px;
3439
    margin-left: -10px;
3440
}
3441

    
3442
.single .vm-actions .action-container {
3443
    margin-bottom: 1px;
3444
}
3445

    
3446
.single .vm-actions .action-container .confirm_single {
3447
    right: -45px;
3448
}
3449

    
3450
.single .vm-actions .action-container.destroy .confirm_single {
3451
}
3452

    
3453
.single .vm-actions .action-container.destroy {
3454
    bottom: -20px;
3455
}
3456

    
3457
.single a.single-action {
3458
    text-decoration: none;
3459
    cursor: pointer;
3460
    display: block;
3461
}
3462

    
3463
.single a.single-action:hover {
3464
    background-color:#A1C8DB;
3465
    width: 162px;
3466
    opacity: 0.8;
3467
    filter: alpha(opacity = 80);
3468
}
3469

    
3470
.single .destroy a.single-action.selected {
3471
    color: #880000 !important;
3472
}
3473

    
3474
.single a.single-action.selected {
3475
    color: #FF7F2A !important;
3476
    width: 50px !important;
3477
}
3478

    
3479
.single a.single-action.selected:hover {
3480
    background-color:transparent;
3481
}
3482

    
3483
.single .spinner, .single .action-indicator {
3484
    margin: 15px 45px 0 0px !important
3485
}
3486

    
3487
.single .action-indicator {
3488
    margin-right: 55px !important;
3489
}
3490

    
3491
.single .wave {
3492
    margin: 15px 53px 0 0px !important
3493
}
3494

    
3495
.icon div.action_error {
3496
    font-size: 100%;
3497
}
3498

    
3499
.single div.action_error {
3500
    position: absolute;
3501
    top: 29px;
3502
    right: 35px;
3503
}
3504

    
3505
.single .column2 {
3506
    background-color: #A1C8DB;
3507
    float: left;
3508
    font-size: 78%;
3509
    line-height: 17px;
3510
    margin: 0 0 10px 5px;
3511
    width: 358px;
3512
}
3513

    
3514
.single .column2 .machine-labels {
3515
    float: left;
3516
    font-size: 90%;
3517
    margin-left: 10px;
3518
    margin-top: 10px;
3519
    width: 125px;
3520
}
3521

    
3522
.single .machine-detail.title {
3523
    background-color: #74AEC9;
3524
    color: #fff;
3525
    padding: 4px 6px;
3526
    font-size: 0.8em;
3527
    width: 346px;
3528
    margin-left: 5px;
3529
    float: left;
3530
}
3531

    
3532
.single .column2 .machine-details {
3533
    float: right;
3534
    text-align: right;
3535
    font-size: 90%;
3536
    width: 210px;
3537
    margin-right: 10px;
3538
    margin-top: 10px;
3539
}
3540

    
3541
.single .column2 .name, .single .column2 .disk, .single .column2 .image-size, .single .column2 .ipv6 {
3542
    margin-bottom: 13px;
3543
}
3544

    
3545
.single .tags {
3546
    clear: both;
3547
    margin-bottom: 10px;
3548
    margin-left: 10px;
3549
}
3550

    
3551
.single .tags-label {
3552
    float: left;
3553
    padding: 0 5px;
3554
    width: 30px;
3555
}
3556

    
3557
.single .tags-down-arrow {
3558
    background: url("../images/tags-down-arrow.png") no-repeat scroll 1px 7px transparent;
3559
    float: left;
3560
    height: 16px;
3561
    width: 9px;
3562
}
3563

    
3564
.single .tags-header .info-header{
3565
    padding-top:0;
3566
    padding-bottom:0;
3567
}
3568

    
3569
.single .tags-header {
3570
    font-size: 0.62em;
3571
    cursor: pointer;
3572
    float: left;
3573
    margin-bottom:5px;
3574
}
3575

    
3576
.single .tags-header span.label {
3577
    font-size: 104%;
3578
}
3579

    
3580
.single .tags-content {
3581
    background-color: #84B7D0;
3582
    clear: both;
3583
    height: auto;
3584
    padding-bottom: 5px;
3585
    padding-top: 5px;
3586
    width: 300px;
3587
}
3588

    
3589
.single .column3 {
3590
    background-color: #A1C8DB;
3591
    width: 150px;
3592
    overflow: visible;
3593
    padding-bottom: 10px;
3594
    position: absolute;
3595
    right: 20px;
3596
    top: 130px;
3597
}
3598

    
3599
.single .col3 {
3600
    float: right;
3601
    width: 150px;
3602
    margin-right: 15px;
3603
    margin-bottom: 15px;
3604
}
3605

    
3606
.single .column3 .controls {
3607
    font-size: 80%;
3608
    height: 20px;
3609
    padding-left: 7px;
3610
    padding-right: 7px;
3611
    padding-top: 8px;
3612
    padding-bottom: 5px;
3613
    border-bottom: 1px solid #84B7D0;
3614
}
3615

    
3616
.single .column3 .vm-control:hover {
3617
    background-color: #5CA1C0;
3618
}
3619

    
3620
.single .column3 .previous {
3621
    float:left;
3622
    width: 72px;
3623
}
3624

    
3625
.single .column3 .next {
3626
    float: right;
3627
    text-align: center;
3628
    width: 60px;
3629
}
3630

    
3631
.single .column3 .next-label {
3632
    float: right;
3633
    margin-right: 3px;
3634
    margin-top: -2px;
3635
}
3636

    
3637
.single .column3 .next-arrow {
3638
    float: right;
3639
    height: 18px;
3640
    width: 10px;
3641
    background: url("../images/right-arrow.png") no-repeat scroll 3px 2px transparent;
3642
}
3643

    
3644
.single .column3 .prev-label {
3645
    float: left;
3646
    margin-left: 3px;
3647
    margin-top: -2px;
3648
}
3649

    
3650
.single .column3 .prev-arrow {
3651
    background: url("../images/left-arrow.png") no-repeat scroll 3px 2px transparent;
3652
    float: left;
3653
    height: 18px;
3654
    width: 10px;
3655
}
3656

    
3657
.single .column3 .separator {
3658
    width: 135px;
3659
    height: 1px;
3660
    background-color: #84B7D0;
3661
    margin: 0 0 0 7px;
3662
    clear: both;
3663
}
3664

    
3665
.single .column3 .servers {
3666
    font-size: 80%;
3667
    line-height: 15px;
3668
    padding-top: 10px;
3669
    text-align: right;
3670
    overflow: visible;
3671
    position: relative;
3672
}
3673

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

    
3694
.single .toggler {
3695
    color: #FFFFFF;
3696
    float: right;
3697
    font-size: 140%;
3698
}
3699

    
3700
.single .cpu-usage, .single .network-usage {
3701
    text-align: center;
3702
    padding-top: 15px;
3703
    margin-bottom: 5px;
3704
    font-size: 90%;
3705
    font-weight: bold;
3706
}
3707

    
3708
.single .cpu-graph, .single .network-graph {
3709
    margin-left: 20px;
3710
    margin-bottom:30px;
3711
    width: 660px;
3712
}
3713

    
3714
.single div.lower .stats-select .stats-select-option.selected {
3715
    background-color: #4085A5;
3716
    color: #fff;
3717
}
3718

    
3719
.single div.lower .stats-select .stats-select-option {
3720
    cursor: pointer;
3721
    background-color: #DDF1FB;
3722
    color: #4085A5;
3723
    display: block;
3724
    float: left;
3725
    padding: 7px 10px;
3726
    font-size: 0.7em;
3727
}
3728

    
3729
.single div.lower img.stats {
3730
    margin-left: 82px;
3731
}
3732

    
3733
.single div.lower img.stats {
3734
    display: none;
3735
}
3736

    
3737
.single .single-image {
3738
    width: 126px;
3739
    height: 136px;
3740
    margin-bottom: 10px;
3741
    margin-left: 4px;
3742
    background-image: url("../images/icons/machines/large/unknown-sprite.png");
3743
    background-repeat: no-repeat;
3744
    cursor: pointer;
3745
}
3746

    
3747
.single .single-image-state1 {
3748
    background-position: 0px 0;
3749
}
3750

    
3751
.single .single-image-state3 {
3752
    background-position: -252px 0;
3753
}
3754

    
3755
.single .single-image-state4 {
3756
    background-position: -378px 0;
3757
}
3758

    
3759
.single .single-image-state2 {
3760
    background-position: -126px 0;
3761
}
3762

    
3763
.single .column3 .previous, .single .column3 .next {
3764
    cursor: pointer;
3765
    background-color: #84B7D0;
3766
    color: white;
3767
    font-size: 100%;
3768
    height: 15px;
3769
    padding-top: 2px;
3770
}
3771

    
3772
.single .column3 .disabled {
3773
    opacity: 0.5;
3774
    filter: alpha(opacity = 50);
3775
}
3776

    
3777
.single div.lower {
3778
    clear:both;
3779
    background: #EFF7FA repeat scroll 0 0;
3780
    width: 700px;
3781
    padding-bottom: 15px;
3782
}
3783

    
3784
.single div.upper {
3785
    background: transparent;
3786
    margin-bottom: 10px;
3787
    overflow: visible;
3788
    overflow: hidden;
3789
    width: 700px;
3790
    background: #EFF7FA repeat scroll 0 0;
3791
}
3792

    
3793
/* console css */
3794
.console-header-logo {
3795
    padding-top: 16px;
3796
    margin-left: 30px;
3797
    position: fixed;
3798
}
3799

    
3800
#console-header div.help-text {
3801
    font-size: 70%;
3802
    font-weight:bold;
3803
    color:#FFFFFF;
3804
    position: absolute;
3805
    height: 20px;
3806
    top: 79px;
3807
}
3808

    
3809
div.console-container {
3810
    margin: 0 0em;
3811
    height: auto;
3812
}
3813

    
3814
#wrapper.console {
3815
    width: auto;
3816
}
3817

    
3818
.console-info {
3819
    font-size:80%;
3820
    color: white;
3821
    position:absolute;
3822
    margin: 15px 0 0 480px;
3823
}
3824

    
3825
applet {
3826
    width:100%;
3827
    height:100%;
3828
}
3829

    
3830
div.console-footer {
3831
    /* this is for version 0.5*/
3832
    display: none;
3833
}
3834

    
3835
.console-footer #footer-text{
3836
    float:left;
3837
    left: auto;
3838
    margin-left:30px;
3839
}
3840

    
3841
/* add network wizard (see also #wizard for shared classes) */
3842
#networks-wizard .header {
3843
    background-color: #4085A5;
3844
    height: 56px;
3845
}
3846

    
3847
#networks-wizard div.name-input {
3848
    margin: 75px 0 0 55px;
3849
}
3850

    
3851
#networks-wizard input {
3852
    border: 1px solid #CCCCCC;
3853
    color: #445566;
3854
    letter-spacing: 1px;
3855
    width: 170px;
3856
}
3857

    
3858
#networks-wizard span.help {
3859
    font-style: italic;
3860
    font-size: 80%;
3861
    margin-left: 10px;
3862
}
3863

    
3864
#networks-wizard .separator-end {
3865
    background-color: #387693;
3866
    height: 6px;
3867
    width: 479px;
3868
    margin-left: -13px;
3869
    margin-top: 19px;
3870
}
3871

    
3872
.red {
3873
    color: red;
3874
}
3875

    
3876
/* add server to network wizard (see also #metadata-wizard for shared classes) */
3877
#add-machines-wizard span.machine-name {
3878
    margin-left: 4px;
3879
    vertical-align: text-top;
3880
}
3881

    
3882
#add-machines-wizard img.list-logo {
3883
    margin: 2px 1px 1px;
3884
}
3885

    
3886
.css-panes {
3887
    clear: both;
3888
    position: relative;
3889
    z-index: 10;
3890
}
3891

    
3892
.last .firewall-content {
3893
}
3894

    
3895
#pub .last .network-separator {
3896
    display:none;
3897
}
3898

    
3899
.public-networks .empty-network-slot {
3900
    display: none;
3901
}
3902

    
3903
.clearfix {
3904
    display: block;
3905
    width: auto;
3906
    zoom: 1;
3907
}
3908

    
3909
/* float clearing for all browsers except the devil one */
3910
.clearfix:after{
3911
  clear: both;
3912
  content: ".";
3913
  display: block;
3914
  height: 0;
3915
  visibility: hidden;
3916
  font-size: 0;
3917
}
3918

    
3919
* html .clearfix {
3920
    display: inline-block;
3921
}
3922

    
3923
.icon .cont-toggler {
3924
    margin-top: -1px;
3925
}
3926

    
3927
.icon .wave {
3928
    margin-right: 4px !important;
3929
    margin-top: 15px !important;
3930
}
3931

    
3932
.icon .status {
3933
    margin-right: 3px;
3934
}
3935

    
3936
#machinesview .status, .single .state {
3937
    font-size: 75%;
3938
}
3939

    
3940
#machinesview-list div.action-indicator {
3941
    margin:0 !important;
3942
    float: none !important;
3943
}
3944

    
3945
.icon div.action-indicator {
3946
    margin-top: 14px;
3947
    margin-right: 4px;
3948
}
3949

    
3950
div.action-indicator {
3951
    width: 15px;
3952
    height: 20px;
3953
    background-repeat: no-repeat;
3954
    background-position: 0 0;
3955
}
3956

    
3957
tbody.machines div.action-indicator {
3958
    position: relative;
3959
    top: -2px;
3960
}
3961
div.state .destroy, tbody.machines .destroy {
3962
    background-image: url("../images/icons/actions/medium/destroy.png");
3963
}
3964
div.state .console, tbody.machines .console {
3965
    background-image: url("../images/icons/actions/medium/console.png");
3966
}
3967
div.state .start, tbody.machines .start {
3968
    background-image: url("../images/icons/actions/medium/start.png");
3969
}
3970
div.state .reboot, tbody.machines .reboot {
3971
    background-image: url("../images/icons/actions/medium/reboot.png");
3972
}
3973
div.state .shutdown, tbody.machines .shutdown {
3974
    background-image: url("../images/icons/actions/medium/shutdown.png");
3975
}
3976

    
3977
h3.overlay-inner-title {
3978
    color: #4085A5;
3979
    font-size: 2em;
3980
}
3981

    
3982
#add-name-container {
3983
    margin-bottom: 10px;   
3984
}
3985

    
3986
.remove-field-trigger, .add-field-trigger {
3987
    cursor: pointer;
3988
}
3989

    
3990
.add-field-trigger img {
3991
    vertical-align: middle;
3992
}
3993

    
3994
.machine-now-building {
3995
    padding-right: 15px !important;
3996
    text-align: justify;
3997
}
3998

    
3999
.sub-text {
4000
    padding-top: 15px;
4001
    padding-right: 15px;
4002
    text-align: justify;
4003
    font-style: italic;
4004
    font-size: 0.8em !important;
4005
}
4006

    
4007
#notification-box a {
4008
    color: #4085A5;
4009
}
4010

    
4011
#notification-box .machine-title img {
4012
    vertical-align: middle;
4013
}
4014

    
4015
#notifiaction-box .password-header {
4016
    margin-bottom: 0 !important;
4017
}
4018

    
4019
#notification-box .password-container a {
4020
    color: #fff;
4021
    text-decoration: underline;
4022
}
4023

    
4024
#notification-box .password-container a:hover {
4025
    background-color: #fff;
4026
    color: #4085A5;
4027
}
4028

    
4029
#notification-box .password-container {
4030
    background: #4085A5;
4031
    border: none;
4032
}
4033

    
4034
#notification-box .password-container .password a {
4035
    font-weight: normal !important;
4036
}
4037

    
4038
#notification-box .cmd {
4039
    color: #fff;
4040
    font-family: monospace;
4041
    font-size: 1.6em;
4042
}
4043

    
4044
.machine-container .separator {
4045
    background-color: #B0D1E0;
4046
}
4047

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

    
4059
#creation-password-overlay {
4060
    position: relative;
4061
}
4062

    
4063
#creation-password-overlay .form-action {
4064
    position: absolute;
4065
    bottom: 15px;
4066
    right: 13px;
4067
    font-size: 0.8em;
4068
}
4069

    
4070
#creation-password-overlay .password-label {
4071
    float: left;
4072
}
4073

    
4074
#creation-password-overlay .password {
4075
    font-size: 1.5em;
4076
    font-weight: bold;
4077
    letter-spacing: 2px;
4078
    font-family: Georgia, Times, serif;
4079
    margin-right: 5em;
4080
    float: right;
4081
    margin-top: -4px;
4082
}
4083

    
4084
.feedback-form .description {
4085
    margin-bottom: 25px;
4086
}
4087

    
4088
.feedback-form label {
4089
    display: block;
4090
    font-weight: bold;
4091
    margin-bottom: 10px;
4092
    font-size: 0.8em;
4093
}
4094

    
4095
.feedback-form .form-actions {
4096
    border-top: none;
4097
}
4098

    
4099
.nospace {
4100
    padding-top: 0 !important;
4101
    padding-bottom: 0 !important;
4102
}
4103

    
4104
.noborder {
4105
    border-top: none !important;
4106
    border-bottom: none !important;
4107
}
4108

    
4109
.overlay .feedback-form .messages.description {
4110
    padding-bottom:0;
4111
    margin-bottom: 0;
4112
}
4113

    
4114
.feedback-form .messages .error-message {
4115
    color: #f00;
4116
}
4117

    
4118
.feedback-form .messages .success-message {
4119
    color: #8AA87F;
4120
}
4121

    
4122
.feedback-form .feedback-message {
4123
    width: 548px;
4124
    height: 200px;
4125
    border: 1px solid #ddd;
4126
    padding: 5px;
4127
}
4128

    
4129
#feedback-form .empty-error-msg {
4130
    display: none;
4131
}
4132

    
4133
#feedback-form .data-text {
4134
    display: none;
4135
}
4136

    
4137
#feedback-form .message {
4138
    display: none;
4139
}
4140

    
4141
#feedback-form label {
4142
    display: block;
4143
    font-size: 0.85em;
4144
    font-weight: bold;
4145
}
4146

    
4147
#feedback-form label.inline {
4148
    display: inline;
4149
    padding-left: 5px;
4150
}
4151

    
4152
#feedback-form p {
4153
    padding: 1em 0;
4154
    color: #444;
4155
    margin-bottom: 10px;
4156
}
4157

    
4158
#feedback-form .description {
4159
    font-style: italic;
4160
    font-size: 0.9em;
4161
    color: #888;
4162
}
4163

    
4164
#feedback-form .feedback-text {
4165
    width: 98%;
4166
    height: 100px;
4167
    margin-top: 10px;
4168
    margin-bottom: 10px;
4169
}
4170

    
4171
#feedback-form .submit-data {
4172
    display: none;
4173
}
4174

    
4175
#feedback-form .submit, #invform .submit {
4176
    background-color: #4085A5;
4177
    color: #fff;
4178
    border: none;
4179
    padding: 5px 16px;
4180
    cursor: pointer;
4181
    font-size: 1em;
4182
    position: relative;
4183
}
4184

    
4185
#feedback .submit {
4186
    float: right;
4187
    right: 10px;
4188
    margin-top: 10px;
4189
}
4190

    
4191

    
4192
#feedback-form .submit:hover, #invform .submit:hover {
4193
    background-color: #549FC3;
4194
}
4195

    
4196
.feedback-intro {
4197
    padding-right: 15px !important;
4198
    text-align: justify;
4199
}
4200

    
4201
.popup-body .message {
4202
    padding: 20px 5px;
4203
    display: none;
4204
}
4205

    
4206
.popup-body .loading {
4207
    color: #fff;
4208
}
4209

    
4210
.popup-body .success {
4211
    color: #1F921A;
4212
}
4213

    
4214
.popup-body .errormsg {
4215
    color: #E32424;
4216
}
4217

    
4218

    
4219
.close-msg-box {
4220
    display: block;
4221
    margin-top: 10px;
4222
    cursor: pointer;
4223
    color: #4085A5;
4224
    text-decoration: underline;
4225
}
4226

    
4227

    
4228
.console .ip-version-label {
4229
    margin: 0 5px;
4230
}
4231

    
4232
.ipv6-text, .ipv4-text {
4233
    font-size: 0.9em;
4234
}
4235

    
4236
.tooltip {
4237
    background-color: #C4DDE9;
4238
    color: #000;
4239
    font-size: 0.7em;
4240
    padding: 0.2em 0.5em;
4241
    border: 1px solid #888;
4242
    z-index: 50000;
4243
}
4244

    
4245
/*404 and 500 pages*/
4246

    
4247
.error_page {
4248
    position: relative;
4249
    top: 40px;
4250
    padding-bottom: 140px !important;
4251
}
4252

    
4253
.error_page h1 {
4254
    font-weight: normal;
4255
}
4256

    
4257
.error_page .msg_header {
4258
    margin: 0px;
4259
    font-size: 10em;
4260
    position: absolute;
4261
    left: -5px;
4262
    top: 0px;
4263
    color: #4085A5;
4264
    font-family: arial, verdana;
4265
}
4266

    
4267
.error_page p.error_desc {
4268
    color: #fff;
4269
    font-size: 0.8em;
4270
}
4271

    
4272
.error_page {
4273
    padding-right: 50px !important;
4274
    padding-left: 100px !important;
4275
}
4276

    
4277
.error_page .error_content {
4278
    padding-left: 150px;
4279
    padding-top: 97px;
4280
}
4281

    
4282
.error_page .error_content .links, .info_content .links {
4283
    margin-top: 10px;
4284
    margin-left: 20px;
4285
}
4286

    
4287
.error_page .http_error .code {
4288
    letter-spacing: -10px;
4289
    font-size: 9em;
4290
}
4291

    
4292
.error_page .http_error .msg {
4293
    letter-spacing: -1px;
4294
    font-size: 2em;
4295
}
4296

    
4297
.error_page .http_error {
4298
    position: absolute;
4299
    right: 0px;
4300
    bottom: 0px;
4301
    color: #75B3D0;
4302
    line-height: 1em;
4303
}
4304

    
4305
.error_page .error_content a, .info_content .links a {
4306
    color: #4085A5;
4307
    font-weight: bold;
4308
    margin-right: 10px;
4309
    font-size: 0.9em;
4310
}
4311

    
4312
.error_body #container, .info_body #container {
4313
    background-position: right 200px;
4314
}
4315

    
4316
.info_page h1 {
4317
    color: #4085A5;
4318
    font-size: 2em;
4319
    font-weight: normal;
4320
}
4321

    
4322
.info_page p {
4323
    color: #ffffff;
4324
    margin: 1em 0;
4325
}
4326

    
4327
.info_body p a, .error_body p a{
4328
    color: #4085A5;
4329
    text-decoration: underline;
4330
}
4331

    
4332
.error_404 .http_error .code {
4333
    letter-spacing: -7px;
4334
}
4335

    
4336
.network-progress-indicator {
4337
    position: relative;
4338
    display: none;
4339
}
4340

    
4341
.network-progress-indicator img {
4342
    position: absolute;
4343
    bottom: 44px;
4344
    left: 340px;
4345
}
4346

    
4347

    
4348
.single .progress-message {
4349
    margin-top: 90px;
4350
    font-size: 0.6em;
4351
    padding: 0 10px;
4352
    text-align: center;
4353
}
4354

    
4355
/*metadata keys/values*/
4356
.items .tag-item  {
4357
    display: block;
4358
}
4359

    
4360
.single .items .tag-item .key {
4361
    width: 60px;
4362
}
4363

    
4364
.running .scrollable, .terminated .scrollable {
4365
    height: 42px;
4366
}
4367

    
4368
.items .tag-item .key {
4369
    margin-right: 5px;
4370
    width: 30px;
4371
    display: block;
4372
    float: left;
4373
    color: #000;
4374
}
4375

    
4376
.items .tag-item .value {
4377
    color: #444;
4378
}
4379

    
4380
#machinesview-list {
4381
    display: none;
4382
}
4383

    
4384
#machinesview-single {
4385
    position: relative;
4386
    display: none;
4387
}
4388

    
4389
#machinesview-icon {
4390
    display: none;
4391
}
4392

    
4393
#machinesview-icon, #machinesview-single, #machinesview-list {
4394
    
4395
}
4396

    
4397
tbody.machines .spinner {
4398
    margin-top: 0!important;
4399
    margin: 0 !important;
4400
    float: none !important;
4401
}
4402

    
4403
.slider .slider-point {
4404
    width: 4px;
4405
    height: 3px;
4406
    margin-left: 1px;
4407
    background-color: transparent;
4408
    display: block;
4409
    position: absolute;
4410
    z-index: 10;
4411
    bottom: 0px;
4412
}
4413

    
4414
.slider .slider-point-light {
4415
    background-color: transparent;
4416
}
4417

    
4418
.slider-point-text {
4419
    font-size: 0.6em;
4420
    position: absolute;
4421
    top: 4px;
4422
    border-top: 5px solid #C5DEE9;
4423
    padding: 3px;
4424
    color: #4085A5;
4425
    display: block;
4426
    min-width: 6px;
4427
    text-align: middle;
4428
}
4429

    
4430
.slider .handle {
4431
    z-index: 50;
4432
}
4433

    
4434
.modal p.desc {
4435
    margin: 5px 0;
4436
    margin-left: 37px;
4437
    font-size: 0.8em;
4438
    color: #888;
4439
}
4440

    
4441
.api_overlay_template {
4442
    display: none;
4443
}
4444

    
4445
.api_content .password-container .password {
4446
    color: #fff;
4447
    font-size: 1.1em;
4448
}
4449

    
4450
#disks-pane {
4451
    margin-top: 58px;
4452
}
4453

    
4454
span.resend-msg {
4455
    display: block;
4456
    margin-bottom: 5px;
4457
}
4458

    
4459
.success-msg {
4460
    background-color: #5CAD54;
4461
    color: #fff;
4462
    padding: 0.4em;
4463
    border: 1px solid #ddd;
4464
}
4465

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

    
4473
.success-msg em, .error-msg em {
4474
    font-weight: bold;
4475
    font-style: normal;
4476
    font-size: 0.9em;
4477
}
4478

    
4479
.pagination {
4480
            font-size: 80%;
4481
        }
4482
        
4483
.pagination a {
4484
    text-decoration: none;
4485
        border: solid 1px #AAE;
4486
        color: #15B;
4487
}
4488

    
4489
.pagination a, .pagination span {
4490
    display: block;
4491
    float: left;
4492
    padding: 0.3em 0.5em;
4493
    margin-right: 5px;
4494
        margin-bottom: 5px;
4495
        min-width:1em;
4496
        text-align:center;
4497
}
4498

    
4499
.pagination .current {
4500
    background: #4085A5;
4501
    color: #fff;
4502
        border: solid 1px #AAE;
4503
}
4504

    
4505
.pagination .current.prev, .pagination .current.next{
4506
        color:#999;
4507
        border-color:#999;
4508
        background:#fff;
4509
}
4510

    
4511
table.list-machines .wave {
4512
    float: none !important;
4513
    margin: 0 !important;
4514
}
4515

    
4516
.overlay {
4517
    display: none;
4518
}
4519

    
4520
.overlay .copy-content .clip-copy  {
4521
    right: 10px;
4522
    top:8px;
4523
    border: 1px solid #fff;
4524
}
4525

    
4526
.overlay .copy-content {
4527
    background-color: #387693;
4528
    color: #fff;
4529
    padding: 10px;
4530
    font-size: 1.2em;
4531
    text-align: center;
4532
    position: relative;
4533
}
4534

    
4535
.overlay {
4536
    background-color: #fff;
4537
    border: 2px solid #444;
4538
    text-align: left;
4539

    
4540
    -moz-box-shadow: 0 0 90px 5px #000;
4541
    -webkit-box-shadow: 0 0 90px 5px #000;
4542
    box-shadow: 0 0 90px 5px #000;
4543
    width: 600px;
4544
}
4545

    
4546
.overlay a {
4547
    color: #387693;
4548
}
4549

    
4550
.overlay .diagnostics-list {
4551
    height: 400px;
4552
    overflow: scroll;
4553
    overflow-y: scroll;
4554
    overflow-x: hidden;
4555
}
4556
.overlay .overlay-content .description.subinfo {
4557
    margin-bottom:0;
4558
    border-bottom: none;
4559
    padding-bottom:0;
4560
    margin-top: 10px;
4561
    padding-top:10px;
4562
    border-top: 1px solid #64a6c4;
4563
    /*border-top: 1px solid #DBE6EB;*/
4564
    font-size: 0.8em;
4565
}
4566

    
4567
.overlay .overlay-content .important {
4568
    color: #800000;
4569
}
4570

    
4571
.overlay .overlay-content .description {
4572
    color: #444;
4573
    border-bottom: 1px solid #64a6c4;
4574
    margin-bottom: 10px;
4575
    padding-bottom: 10px;
4576
    font-size: 0.9em;
4577
    line-height: 1.6em;
4578
}
4579
.overlay .overlay-content .empty-message {
4580
    margin-bottom: 5px;
4581
}
4582

    
4583
.overlay h3.overlay-header {
4584
    font-size: 0.9em;
4585
    text-align: left;
4586
    padding: 0.8em;
4587
    padding-left: 1em;
4588
    font-weight: normal;
4589
    border-bottom: 1px solid #ddd;
4590
}
4591

    
4592
.overlay h3.overlay-header .title {
4593
    float: left;
4594
}
4595

    
4596
.overlay .container {
4597
    position: relative;
4598
    padding-top: 1em;
4599
    padding: 0.5em;
4600
    background-image: url("../images/popup-bg.png");
4601
    background-repeat: repeat-x;
4602
}
4603

    
4604
.overlay .content {
4605
    background-color: transparent;
4606
    background-image: url("../images/popup-inner-bg.png");
4607
    padding: 1em;
4608
    font-size: 0.8em;
4609
    background-repeat: repeat-x;
4610
    -moz-box-shadow: 0 0 1px 1px #888;
4611
    -webkit-box-shadow: 0 0 1px 1px #888;
4612
    box-shadow: 0 0 1px 1px #888;
4613
}
4614

    
4615
.overlay .message {
4616
}
4617

    
4618
.overlay .actions {
4619
    position: absolute;
4620
    right: 0.75em;
4621
    top: 0.6em;
4622
}
4623

    
4624
.overlay .actions span {
4625
    font-size: 0.8em;
4626
    color: #fff;
4627
    cursor: pointer;
4628
    margin-left: 10px;
4629
    display: block;
4630
    float: left;
4631
    background-color: #4085A5;
4632
    padding: 0.2em 0.4em;
4633
}
4634

    
4635
.overlay-error .error-more-details {
4636
    margin-top: 5px;
4637
    max-height: 210px;
4638
    overflow: auto;
4639
}
4640

    
4641
.overlay-error .key.details.expand {
4642
    background-image: url("../images/plus-8.png");
4643
}
4644

    
4645
.overlay-error .key.details {
4646
    background-color: #5189A3;
4647
    cursor: pointer;
4648
    background-image: url("../images/minus-8.png");
4649
    background-repeat: no-repeat;
4650
    background-position: 545px;
4651
}
4652

    
4653
.overlay-error .container {
4654
    padding-top: 1.9em;
4655
}
4656

    
4657
.overlay-error .error-details {
4658
    font-size: 0.8em;
4659
    margin-top: 10px;
4660
}
4661

    
4662
.overlay-error .error-details anonymous {
4663
    display: block;
4664
    margin-top: 10px;
4665
}
4666

    
4667
.overlay-error h3.overlay-header {
4668
    background-color: #800000;
4669
    color: #fff;
4670
}
4671

    
4672
.overlay-error.non-critical h3.overlay-header {
4673
    background-color: #987249;
4674
}
4675

    
4676
.overlay-error span.key {
4677
    font-weight: normal;
4678
    display: block;
4679
    margin-top: 0.5em;
4680
    background-color: #74AEC9;
4681
    color: #fff;
4682
    padding: 0.4em;
4683
    font-size: 0.8em;
4684
    font-weight: bold;
4685
}
4686

    
4687
.overlay-error .indicator {
4688
    background-color: #880000;
4689
    color: #fff;
4690
    padding: 4px;
4691
    display: block;
4692
    float: left;
4693
    border: 1px solid #444;
4694
}
4695

    
4696
.overlay-error .nav-btn:hover {
4697
    
4698
}
4699

    
4700
.overlay-error .nav-btn {
4701
    margin-left: 5px;
4702
    color: #fff;
4703
    display: block;
4704
    float: left;
4705
    padding: 4px;
4706
    background-color: #AAA;
4707
    border: 1px solid #444;
4708
}
4709

    
4710
.overlay-error .error-nav {
4711
    position: absolute;
4712
    right: 0px;
4713
    bottom: -25px;
4714
    font-size: 0.8em;
4715
}
4716

    
4717
.overlay-error span.value, .overlay-error div.value {
4718
    padding: 0.4em;
4719
    display: block;
4720
    margin-bottom: 0.3em;
4721
}
4722

    
4723
.overlay h3 .closeme {
4724
    float: right;
4725
    font-size: 0.7em;
4726
    margin-top: 0.2em;
4727
    cursor: pointer;
4728
}
4729

    
4730
.overlay .overlay-header .subtitle {
4731
    display: block;
4732
    font-size: 0.8em;
4733
    color: #ddd;
4734
}
4735

    
4736
.overlay .overlay-header .subtitle img {
4737
    vertical-align: middle;
4738
    margin-left: 10px;
4739
    margin-bottom: 2px;
4740
}
4741

    
4742
.overlay-info .msg-log-entry .src {
4743
    color: #4085A5;
4744
    float: right;
4745
    font-size: 0.9em;
4746
}
4747

    
4748
.overlay-info .msg-log-entry .date {
4749
    font-style: italic;
4750
}
4751

    
4752
.overlay-info .msg-log-entry pre {
4753
    color: #333;
4754
    width: 100%;
4755
    display: none;
4756
    margin: 10px 0;
4757
}
4758

    
4759
.msg-log-entry.warning {
4760
    color: #E57F01;
4761
}
4762

    
4763
.overlay-info .msg-log-entry.with-details .src {
4764
    margin-right: 15px;
4765
}
4766

    
4767
.overlay-info .msg-log-entry.with-details {
4768
    cursor: pointer;
4769
}
4770

    
4771
.overlay-info .msg-log-entry.with-details {
4772
    background-image: url("../images/plus-8-dark.png");
4773
    background-repeat: no-repeat;
4774
    background-position: 99% 9px;
4775
}
4776

    
4777
.overlay-info .msg-log-entry.with-details.expanded {
4778
    background-image: url("../images/minus-8-dark.png");
4779
}
4780

    
4781
.overlay-info .msg-log-entry .msg {
4782
    display: inline-block;
4783
    margin-left: 10px;
4784
}
4785

    
4786
.overlay-info .msg-log-entry {
4787
    border-bottom: 1px solid #aaa;
4788
    padding: 5px;
4789
}
4790

    
4791
.overlay-info .description.subinfo {
4792
    border: none !important;
4793
    padding-top: 0 !important;
4794
}
4795

    
4796
.overlay-info .content {
4797
    background-repeat: no-repeat;
4798
    background-position: 110% 110%;
4799
    background-color: rgba(255,255,255,0.6)
4800
}
4801

    
4802
.overlay-info .overlay-header {
4803
    background-color: #4085A5;
4804
}
4805

    
4806
.overlay-info .overlay-header .title {
4807
    color: #fff;
4808
}
4809

    
4810
.overlay-info .overlay-header .closeme {
4811
    color: #fff;
4812
}
4813

    
4814
#loading-view {
4815
    width: 600px;
4816
    margin: 0 auto;
4817
    padding: 20px 0;
4818
    font-size: 0.8em;
4819
}
4820

    
4821
#loading-view .header span {
4822
    font-weight: bold;
4823
    color: #4085A5;
4824
}
4825

    
4826
#loading-view .info {
4827
    color: #ddd;
4828
}
4829

    
4830
.options-list {
4831
    margin-top: 0.5em;
4832
    font-size: 0.8em;
4833
}
4834

    
4835
.options-list.five li {
4836
    float: left;
4837
    display: block;
4838
    width: 20%;
4839
    margin-bottom: 5px;
4840
}
4841

    
4842
.options-list.five li:nth-child(5n) .options-object-cont {
4843
    margin-right: 0;
4844
}
4845

    
4846
.options-object-cont input {
4847
    border: 1px solid #aaa;
4848
    width: 92px;
4849
    padding: 0;
4850
    margin: 0;
4851
    margin-top:3px;
4852
    padding: 2px;
4853
}
4854

    
4855
.options-list.three li {
4856
    float: left;
4857
    display: block;
4858
    width: 33%;
4859
    margin-bottom: 5px;
4860
}
4861

    
4862
.meta-list .options-list li.options-object.create .options-object-cont {
4863
    background-image: url("../images/option-action-add.png");
4864
    background-repeat: no-repeat;
4865
    background-position: 90px 5px;
4866
}
4867

    
4868
.meta-list .options-list li .options-object-cont .option-action,
4869
.meta-list .options-list li.options-object.create {
4870
    cursor: pointer !important;
4871
}
4872

    
4873
.meta-list .options-list li .options-object-cont {
4874
    cursor: inherit;
4875
}
4876

    
4877
.options-list li .options-object-cont {
4878
    padding: 5px;
4879
    margin-right: 4px;
4880
    border: 1px solid #A6D1E6;
4881
    cursor: pointer;
4882
    min-height: 35px;
4883
    position: relative;
4884
}
4885

    
4886
.options-list.three li:nth-child(3n) .options-object-cont {
4887
    margin-right: 0;
4888
}
4889

    
4890
.options-list li.selected .options-object-cont {
4891
    background-color: #efefef;
4892
    border: 2px solid #4085A5;
4893
    padding: 4px;
4894
}
4895

    
4896
.options-list li.selected .options-object-cont .title {
4897
}
4898

    
4899
.options-list li.options-object .title {
4900
    display: block;
4901
    color: #FF7F2A;
4902
    margin-bottom: 2px;
4903
}
4904

    
4905
.options-list li .option-action {
4906
    display: none;
4907
    position: absolute;
4908
    background-repeat: no-repeat;
4909
}
4910

    
4911
.options-list.five li.editing {
4912
    width: 40%;
4913
}
4914

    
4915
.options-list.five li.editing .value {
4916
    display: none;
4917
}
4918

    
4919
.options-list li .remove {
4920
    background-image: url("../images/option-action-remove.png");
4921
    width:10px;
4922
    height:10px;
4923
    right:5px;
4924
    top: 5px;
4925
}
4926

    
4927
.options-list li .edit {
4928
    background-image: url("../images/option-action-edit.png");
4929
    width:10px;
4930
    height:10px;
4931
    right:5px;
4932
    bottom: 8px;
4933
}
4934

    
4935
.options-list li:hover .option-action  {
4936
    display: block;
4937
}
4938

    
4939
.options-list li.options-object .value {
4940
    color: #4085A5;
4941
    margin-top: 5px;
4942
    display: block;
4943
}
4944

    
4945
.options-list li.selected.options-object .value {
4946
}
4947

    
4948
.options-list li .options-object-cont:hover {
4949
    background-color: #fff;
4950
}
4951

    
4952
.options-list li.selected .options-object-cont:hover {
4953
    background-color: #fff;
4954
}
4955

    
4956
.options-list li img {
4957
    float: left;
4958
    margin:2px;
4959
    margin-right: 10px;
4960
    padding-bottom:10px;
4961
}
4962

    
4963
#network-vms-select-content li.options-object .value {
4964
    margin-top: 10px;
4965
    margin-left: 30px;
4966
}
4967

    
4968
#network-vms-select-content li.options-object:hover .options-object-cont,
4969
#network-vms-select-content li.options-object .options-object-cont {
4970
    background-image: url("../images/option-action-add-dark.png");
4971
    background-repeat: no-repeat;
4972
    background-position: 160px 28px;
4973
}
4974

    
4975
#network-vms-select-content li.selected:hover .options-object-cont,
4976
#network-vms-select-content li.selected .options-object-cont {
4977
    background-image: url("../images/option-action-remove.png") !important;
4978
}
4979

    
4980
#metadata-overlay-content .view .value {
4981
    margin-top: 10px;
4982
}
4983

    
4984
#metadata-overlay-content {
4985
    position: relative;
4986
}
4987

    
4988
.vm-meta .editor .predefined .predefined-meta-key:hover {
4989
    background-color: #4e8eac;
4990
    color: #fff;
4991
}
4992

    
4993
.vm-meta .editor .predefined .predefined-meta-key {
4994
    float: left;
4995
    margin-right: 5px;
4996
    padding: 4px;
4997
    display: block;
4998
    cursor: pointer;
4999
}
5000

    
5001
.vm-meta .editor .predefined {
5002
    background-color: #A6D1E6;
5003
    font-size: 0.9em;
5004
    border-top: 1px solid #ddd;
5005
}
5006

    
5007
.vm-meta .editor input {
5008
}
5009
.vm-meta .editor {
5010
    margin-bottom: 10px;
5011
}
5012

    
5013
.vm-meta .editor .form-actions .form-action {
5014
    min-width: 50px;
5015
}
5016

    
5017
.vm-meta .editor .form-field input.meta-key {
5018
    width: 90px;
5019
}
5020

    
5021
.vm-meta .form-field {
5022
    float: left;
5023
}
5024

    
5025
.vm-meta .form-actions .form-action {
5026
    float: left;
5027
    margin-right: 10px;
5028
    height: 11px;
5029
}
5030

    
5031
.vm-meta .editor .form-actions .cancel {
5032
    margin-right: 0;
5033
}
5034

    
5035
.vm-meta .editor .form-actions {
5036
    float: right;
5037
    margin:0;
5038
    padding:0;
5039
    margin-left: 15px;
5040
    margin-top: 0px;
5041
}
5042

    
5043
.vm-meta .editor {
5044
    background-color: rgba(64, 133, 165, 0.898) !important;
5045
    background-color: #649DB8;
5046
    font-size:0.9em;
5047
}
5048

    
5049
.vm-meta .meta-key-title {
5050
    font-size: 1.3em;
5051
    color: #fff;
5052
    margin-bottom: 10px;
5053
    display: none;
5054
    float: left;
5055
}
5056

    
5057
.vm-meta .editor-content {
5058
    padding: 10px;
5059
}
5060

    
5061
.vm-meta .inner-mask {
5062
    background-color: #fff;
5063
    opacity:0.6;
5064
    position: absolute;
5065
    top:0;
5066
    left:0;
5067
}
5068

    
5069
.vm-meta .editor label {
5070
    float: left;
5071
    color: #fff;
5072
    margin-right: 2px;
5073
    padding-top:4px;
5074
    font-size: 0.9em;
5075
}
5076

    
5077
.vm-meta .editor input {
5078
    border: none;
5079
    width: 170px;
5080
    margin-left: 10px;
5081
    font-size: 0.9em;
5082
    padding: 4px;
5083
}
5084

    
5085
.vm-meta li.create .options-object-cont {
5086
    background-color: #B3C9AD ;
5087
    border-color: #788774;
5088
}
5089
.vm-meta li.create .options-object-cont .value,
5090
.vm-meta li.create .options-object-cont .title {
5091
    color: #fff;
5092
}
5093

    
5094
#createvm-overlay-content {
5095
    padding: 0;
5096
}
5097

    
5098
.overlay-createvm .container {
5099
    width: 584px !important;
5100
}
5101

    
5102
.create-vm .header-step.current {
5103
    font-weight: bold;
5104
}
5105

    
5106
.create-vm .create-step-cont {
5107
    min-height: 240px;
5108
}
5109
.create-vm .create-controls {
5110
    padding: 10px;
5111
}
5112

    
5113
.create-vm ul li {
5114
    cursor: pointer;
5115
    padding: 4px;
5116
}
5117

    
5118
.create-vm ul li.selected {
5119
    background-color: #aaa;
5120
}
5121

    
5122
.cont-toggler {
5123
    background-image: url("../images/down-arrow.png");
5124
    background-position: right;
5125
    background-repeat: no-repeat;
5126
    background-color: #A1C8DB;
5127
    display: inline-block;
5128
    border-right: 6px solid #A1C8DB;
5129
    padding:2px;
5130
    padding-right: 14px;
5131
    padding-left:0;
5132
    cursor: pointer;
5133
    color: #fff;
5134
    font-size: 0.9em;
5135
}
5136

    
5137
.cont-toggler .label {
5138
    background-color: #98BDCF;
5139
    padding: 2px;
5140
    padding-left: 5px;
5141
    padding-right: 5px;
5142
}
5143

    
5144
.cont-toggler.open {
5145
    background-color: #98BDCF;
5146
    border-color: #98BDCF;
5147
    background-image: url("../images/up-arrow.png");
5148
}
5149

    
5150
.cont-toggler.open .label {
5151
    background-color: #4085A5;
5152
}
5153

    
5154
.overlay .form label {
5155
    font-color: #444;
5156
    margin-right: 10px;
5157
}
5158

    
5159
.form-field.error label {
5160
    color: #ff0000;
5161
    text-decoration: underline;
5162
}
5163

    
5164
.form-field input {
5165
    border: 1px solid #aaa;
5166
    width: 200px;
5167
    padding: 3px;
5168
}
5169

    
5170
.form-actions {
5171
    margin-top: 5px;
5172
    padding-top:5px;
5173
    border-top: 1px solid #64a6c4;
5174
    font-size: 0.8em;
5175
}
5176

    
5177
.form-actions.plain {
5178
    margin-top: 0px;
5179
    padding-top:0px;
5180
    border-top: 0px;
5181
}
5182

    
5183
.form-action {
5184
    float: right;
5185
    min-width: 140px;
5186
    background-color: #FF7F2A;
5187
    border: 1px solid #FF7F2A;
5188
    text-align: center;
5189
    color: #FFFFFF;
5190
    cursor: pointer;
5191
    padding: 4px;
5192
}
5193

    
5194
.form-action:hover {
5195
    background-color: #FF9955;
5196
    color: #FFF;
5197
}
5198

    
5199
.form-action.prev,
5200
.form-action.cancel {
5201
    background-color: #800;
5202
    border: 1px solid #800;
5203
    float: left;
5204
}
5205

    
5206
.form-action.prev:hover,
5207
.form-action.cancel:hover {
5208
    background-color: #CC0000;
5209
    color: #fff;
5210
}
5211

    
5212
.form-action.next,
5213
.form-action.ok {
5214
    background-color: #080;
5215
    border: 1px solid #080;
5216
}
5217

    
5218
.form-action.next:hover,
5219
.form-action.ok:hover {
5220
    background-color: #00aa00;
5221
    color: #fff;
5222
}
5223

    
5224
.form-action .create,
5225
.form-action .submit {
5226

    
5227
}
5228

    
5229
.form-action.in-progress, button.in-progress {
5230
    background-image: url("../images/icons/indicators/medium/horizontal-progress.gif");
5231
    background-repeat: no-repeat;
5232
    background-position: center center;
5233
    color: transparent;
5234
}
5235

    
5236
#createvm-overlay-content {
5237
    padding: 0;
5238
}
5239

    
5240
.create-vm .image-details.selected .size {
5241

    
5242
}
5243

    
5244
.create-vm .image-details .show-details:hover {
5245
    color: #aaa !important; 
5246
}
5247
.create-vm .image-details.selected .show-details:hover {
5248
    color: #fff !important; 
5249
}
5250

    
5251
.create-vm .image-details.selected .show-details,
5252
.create-vm .image-details.selected .size {
5253
    color: #eee;
5254
}
5255

    
5256
.create-vm .image-details.selected span.owner {
5257
    color: #fff;
5258
}
5259

    
5260

    
5261
.create-vm .image-details p {
5262
    font-size: 0.8em;
5263
    padding-left: 27px;
5264
    display:block;
5265
}
5266

    
5267
.create-vm .image-details span.owner {
5268
    display: block;
5269
    font-size: 0.9em;
5270
    float: right;
5271
    color: #FF7F2A;
5272
    position: absolute;
5273
    top: 5px;
5274
    right: 5px;
5275
}
5276

    
5277
.create-vm .select-image .show-details {
5278
    display: none;
5279
    font-size: 0.8em;
5280
    text-decoration: underline;
5281
    color: #000;
5282
    position: absolute;
5283
    bottom: 5px;
5284
    right: 5px;
5285
}
5286

    
5287
.create-vm .image-details .size {
5288
    margin-top: 2px;
5289
    font-size: 0.8em;
5290
    color: #aaa;
5291
    margin-left: 10px;
5292
}
5293

    
5294
.create-vm .step-cont {
5295
    margin: 15px;
5296
}
5297

    
5298
.create-vm .create-step-cont {
5299
    min-height: 250px;
5300
    float: left;
5301
    width: 584px;
5302
}
5303

    
5304
.create-vm .create-controls {
5305
    padding: 10px;
5306
    border-top: 1px solid #ddd;
5307
}
5308

    
5309
.create-vm .empty {
5310
    font-size: 0.8em;
5311
    color: #444;
5312
}
5313

    
5314
.create-vm h4 {
5315
    color: #5CA1C0;
5316
    margin-bottom: 0.5em;
5317
    font-family: arial;
5318
}
5319
.create-vm ul li {
5320
    cursor: pointer;
5321
    padding: 4px;
5322
    font-size: 0.9em;
5323
}
5324

    
5325
.create-vm .create-step-cont li.ssh-key-option.selected,
5326
.create-vm ul li.selected {
5327
    background-color: #FF7F2A;
5328
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5329
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5330
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5331
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5332
    color: #fff;
5333
}
5334

    
5335
.create-vm .images-list-cont.loading .loading-indicator {
5336
    display: block !important;
5337
}
5338

    
5339
.create-vm .images-list-cont .loading-indicator {
5340
    display: none;
5341
    position: absolute;
5342
    right: -13px;
5343
    top: 2px;
5344
    width: 30px;
5345
    height: 10px;
5346
    background-repeat: no-repeat;
5347
    background-image: url("../images/icons/indicators/medium/progress.gif");
5348
}
5349

    
5350
.create-vm .images-list-cont h4 {
5351
    position: relative;
5352
}
5353

    
5354
.create-vm .images-list-cont {
5355
    width: 40%;
5356
    float: left;
5357
    padding-left: 3%;
5358
    padding-right: 3%;
5359
}
5360

    
5361
.create-vm li p.desc {
5362
    font-size: 0.9em;
5363
}
5364

    
5365
.create-vm p.desc.warning {
5366
    color: #880000;
5367
}
5368

    
5369
.create-vm p.desc.empty {
5370
    color: #000;
5371
}
5372

    
5373
.create-vm p.desc {
5374
    font-size: 0.8em;
5375
    color: #888;
5376
    margin-bottom: 10px;
5377
}
5378

    
5379
.create-vm li.role .values .val:hover {
5380
    background-color: #eee;
5381
}
5382
.create-vm li.role .values .val.selected,  .create-vm li.role .values .val.selected:hover {
5383
    color: #fff;
5384
    background-color: #FF9955;
5385
}
5386

    
5387
.create-vm .images-filter-cont, .create-vm .flavors-predefined-cont {
5388
    width: 18%;
5389
    padding-right: 4%;
5390
    float:left;
5391
    border-right: 1px solid #A1C8DB;
5392
    overflow: auto;
5393
}
5394

    
5395
.create-vm .flavor-options-cont {
5396
    width: 74%;
5397
    float: left;
5398
    margin-left: 20px;
5399
}
5400

    
5401
.create-vm .flavor-options-cont .flavor-options li:hover {
5402
    background-image:-webkit-linear-gradient(top, #E8F4FA, #D1E7F0);
5403
    background-image:-o-linear-gradient(top, #E8F4FA, #D1E7F0);
5404
    background-image:-moz-linear-gradient(top, #E8F4FA, #D1E7F0);
5405
    background-image:linear-gradient(top, #E8F4FA, #D1E7F0);
5406
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E8F4FA', endColorstr='#D1E7F0', GradientType=0);
5407
}
5408

    
5409
.create-vm .flavor-options-cont .flavor-options li.disabled * {
5410
    color: #eee !important;
5411
}
5412

    
5413
.create-vm .flavor-options-cont .flavor-options li.disabled {
5414
    background-image:linear-gradient(top, #aaa, #ddd);
5415
    background-image:-webkit-linear-gradient(top, #aaa, #ddd);
5416
    background-image:-o-linear-gradient(top, #aaa, #ddd);
5417
    background-image:-moz-linear-gradient(top, #aaa, #ddd);
5418
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#aaaaaa', endColorstr='#dddddd', GradientType=0);
5419
}
5420

    
5421
.create-vm .flavor-options-cont .flavor-options li.selected {
5422
    background-color: #FF9955;
5423
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5424
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5425
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5426
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5427
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF9955', endColorstr='#E88B4D', GradientType=0);
5428
    border: 1px solid #C97943;
5429
}
5430

    
5431
.create-vm .predefined-list li.disabled {
5432
    color: #ddd !important;
5433
}
5434

    
5435
.create-vm .flavor-options-cont .flavor-options li {
5436
    display: block;
5437
    float: left;
5438
    margin-right: 10px;
5439
    margin-bottom: 9px;
5440
    padding: 9px 14px;
5441
    border: 1px solid #aaa;
5442
    background-image:-webkit-linear-gradient(top, #D1E7F0, #E8F4FA);
5443
    background-image:-o-linear-gradient(top, #D1E7F0, #E8F4FA);
5444
    background-image:-moz-linear-gradient(top, #D1E7F0, #E8F4FA);
5445
    background-image:linear-gradient(top, #D1E7F0, #E8F4FA);
5446
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D1E7F0', endColorstr='#E8F4FA', GradientType=0);
5447
}
5448

    
5449
.create-vm .flavor-options-cont .flavor-options {
5450
    margin-bottom: 2px;
5451
}
5452

    
5453

    
5454
.create-vm .flavor-options .metric {
5455
    font-size: 0.8em;
5456
    margin-left: 2px;
5457
}
5458

    
5459
.create-vm .flavor-options span.title {
5460
    color: #444;
5461
}
5462

    
5463
.create-vm .flavor-options span.desc {
5464
    display: block;
5465
    color: #aaa;
5466
    font-weight: normal;
5467
    font-size: 0.8em;
5468
    float: right;
5469
    margin-top: 4px;
5470
}
5471

    
5472
.disktip {
5473
    padding: 4px;
5474
    top: 20px;
5475
}
5476

    
5477
.create-vm .flavor-options .flavors-disk-template-list {
5478
    position: relative;
5479
}
5480

    
5481
.create-vm .flavor-options .disk_template.option {
5482
    z-index: 10;
5483
    min-width: 50px;
5484
    text-align: center;
5485
}
5486

    
5487
/*0 position is -470px*/
5488
.create-vm .flavor-options .disk-template-description {
5489
    font-size: 0.8em;
5490
    color: #444;
5491
    background-image: url("../images/horizontal-pointer.png");
5492
    background-repeat: repeat-x;
5493
    background-position: -470px 0;
5494
    padding-top: 15px;
5495
    margin-top: -10px;
5496
    font-style: italic;
5497
    display:block;
5498
    overflow: auto;
5499
    padding-bottom: 0px;
5500
    margin-bottom: 7px;
5501
    width: 100%;
5502
}
5503

    
5504
.create-vm .flavor-options .disk_template.option .description {
5505
    display: none;
5506
    position: absolute;
5507
    bottom: -20px;
5508
    left:0;
5509
    color: #888;
5510
    font-style: italic;
5511
    display: block;
5512
    background-color: #fff;
5513
    width: 100%;
5514
    text-align: left;
5515
    z-index: 0;
5516
    border-top: 1px solid #ddd;
5517
    padding-top: 3px;
5518
    display: none;
5519
}
5520

    
5521
.create-vm .flavor-options .selected .value {
5522
    color: #FFF;
5523
}
5524

    
5525
.create-vm .flavor-options .value {
5526
    font-weight: bold;
5527
    color: #5CA1C0;
5528
}
5529

    
5530
.create-vm .flavor-options-cont h4 {
5531
    border-bottom: 1px solid #A1C8DB;
5532
    padding-bottom: 5px;
5533
}
5534

    
5535
.create-vm .images-info-cont {
5536
    width: 28%;
5537
    padding-left: 3%;
5538
    float: left;
5539
    border-left: 1px solid #A1C8DB;
5540
}
5541

    
5542
.create-vm .select-image.wide .show-details {
5543
    display: inline;
5544
}
5545

    
5546
.create-vm .select-image .images-info-cont .hide {
5547
    display: none;
5548
}
5549

    
5550
.create-vm .select-image.wide .images-info-cont .hide {
5551
    display: block;
5552
    float: right;
5553
    position: absolute;
5554
    right: 10px;
5555
    top: 10px;
5556
    font-size: 0.8em;
5557
    text-decoration: underline;
5558
    color: #5CA1C0;
5559
    cursor: pointer;
5560
}
5561

    
5562
.create-vm .select-image.wide .images-list-cont {
5563
    width: 74%;
5564
    padding-right: 0;
5565
}
5566

    
5567
.create-vm .select-image.wide .images-info-cont .description .title {
5568
    display: none;
5569
    float: none;
5570
}
5571

    
5572
.create-vm .select-image.wide .images-info-cont .description p {
5573
    background-color: #fff;
5574
    border: 1px solid #ddd;
5575
    padding: 10px;
5576
    float: none;
5577
}
5578

    
5579
.create-vm .select-image.wide .selected .size {
5580
    color: #FFF !important;
5581
}
5582

    
5583
.create-vm .select-image.wide .image-details .size {
5584
    color: #5CA1C0;
5585
    position: absolute;
5586
    top: 5px;
5587
}
5588

    
5589
.create-vm .select-image.wide .images-info-cont h3 {
5590
    color: #5CA1C0;
5591
    margin: 10px 0;
5592
    margin-top: 5px;
5593
    text-align: left;
5594
    font-size: 0.9em;
5595
}
5596

    
5597
.create-vm .select-image.wide .images-info-cont .description p {
5598
    height: 50px;
5599
}
5600

    
5601
.create-vm .select-image.wide .images-info-cont .description {
5602
    width: 100% !important;
5603
    float: none !important;
5604
    background-color: transparent !important;
5605
    padding: 0 !important;
5606
    font-size: 1.1em;
5607
}
5608
.create-vm .select-image.wide .images-info-cont .extra-details {
5609
    height: 160px;
5610
    overflow-y: scroll;
5611
    padding-right: 15px;
5612
}
5613

    
5614
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail.extra-meta .title .custom {
5615
    display: inline-block;
5616
}
5617

    
5618
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail.extra-meta .title {
5619
    background-color: #999 !important;
5620
    border-color: #888 !important;
5621
}
5622
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail .custom {
5623
    float: right;
5624
    display: none;
5625
    font-size: 0.8em;
5626
    margin-left: 10px;
5627
    color: #DDD;
5628
    margin-top: 2px;
5629
}
5630

    
5631
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail {
5632
    padding: 0px;
5633
    background-color: transparent;
5634
    margin-bottom: 4px;
5635
}
5636

    
5637
.create-vm .select-image.wide .images-info-cont .extra-details .title {
5638
    float: left;
5639
    display: block;
5640
    width: 39%;
5641
    padding: 1%;
5642
    background-color: #5CA1C0;
5643
    color: #fff;
5644
    border: 1px solid #4F8DAA;
5645
    font-size: 0.8em;
5646
}
5647

    
5648
.create-vm .select-image.wide .images-info-cont .extra-details .value {
5649
    float: right;
5650
    display: block;
5651
    width: 55%;
5652
    padding: 1%;
5653
    border: none;
5654
    background-color: #FFF;
5655
    color: #444;
5656
    border: 1px solid #ddd;
5657
    margin-bottom: 0px;
5658
    font-size: 0.8em;
5659
}
5660

    
5661
.create-vm .select-image.wide .images-info-cont .image-detail {
5662
}
5663

    
5664
.create-vm .select-image.wide ul.images-list {
5665
    height: 310px;
5666
    overflow-y: scroll;
5667
    padding-right: 3%;
5668
}
5669

    
5670
.create-vm .select-image.wide .images-info-cont {
5671
    position: absolute;
5672
    width: 88%;
5673
    background-color: #DAE9F0;
5674
    padding: 2%;
5675
    border-left: none;
5676
    height: 320px;
5677
    box-shadow: 0px 0px 2px #aaa;
5678
    -moz-box-shadow: 0px 0px 2px #aaa;
5679
    -webkit-box-shadow: 0px 0px 2px #aaa;
5680
    display: none;
5681
}
5682

    
5683

    
5684
.create-vm .images-info-cont h4, .create-vm .create-step-cont .param h4{
5685
    color: #FF9955;
5686
    margin-bottom: 1em;
5687
    font-size: 1.2em;
5688
}
5689

    
5690
.create-vm .images-info-cont span.title {
5691
    color: #4085A5;
5692
    display: block;
5693
    margin-bottom: 2px;
5694
    font-size: 0.8em;
5695
}
5696

    
5697
.create-vm .type-filter li {
5698
    font-size: 0.8em;
5699
    /*font-weight: bold;*/
5700
    padding: 4px;
5701
    margin-bottom: 0px;
5702
    color: #FF7F2A;
5703
}
5704

    
5705
.create-vm .images-list li {
5706
    min-height: 30px;
5707
}
5708
.create-vm .images-list .image-details:hover {
5709
    background-color: #eee;
5710
}
5711

    
5712
.create-vm .images-list .image-details.selected:hover {
5713
    background-color: #FF7F2A;
5714
}
5715

    
5716
.create-vm .images-list .image-details.selected {
5717
    /*font-weight: bold;*/
5718
}
5719

    
5720
.create-vm .images-list .image-details {
5721
    padding: 6px;
5722
    margin-bottom:1px;
5723
    position: relative;
5724
}
5725

    
5726
.create-vm .images-list .image-details img {
5727
    vertical-align: middle;
5728
    margin-right: 10px;
5729
}
5730

    
5731
.create-vm .images-info-cont .image-detail:last-child p {
5732
    border-bottom: none;
5733
}
5734

    
5735
.create-vm .images-info-cont h4 img {
5736
    vertical-align: middle;
5737
    margin-right: 7px;
5738
    margin-bottom: 5px;
5739
}
5740

    
5741
.create-vm .images-info-cont .description p {
5742
    font-size: 0.8em;
5743
}
5744

    
5745
.create-vm .images-info-cont p {
5746
    margin-bottom: 7px;
5747
    font-size: 0.9em;
5748
    border-bottom: 1px solid #A1C8DB;
5749
    padding-bottom: 7px;
5750
}
5751

    
5752
.create-vm .step-header {
5753
    padding-bottom:0;
5754
    position: relative;
5755
}
5756

    
5757
.create-vm .step-header .header-step .info span.subtitle {
5758
    font-size: 1.2em;
5759
    color: #fff;
5760
    font-weight: bold;
5761
}
5762

    
5763
.create-vm .step-header .header-step .info span {
5764
    float: none;
5765
    text-align: right;
5766
}
5767

    
5768
.create-vm .step-header .header-step .info {
5769
    position: absolute;
5770
    right: 15px;
5771
    top: 20px;
5772
    font-size: 0.8em;
5773
}
5774

    
5775
.create-vm .step-header .header-step span {
5776
    float: left;
5777
    display: block;
5778
}
5779

    
5780
.create-vm .steps-container {
5781
    width: 2000em;
5782
}
5783

    
5784
.create-vm .step-header .header-step .title {
5785
    margin-top: 20px;
5786
    font-size: 1em;
5787
    margin-left: 10px;
5788
}
5789

    
5790
#createvm-overlay-content {
5791
    width: 584px;
5792
    overflow: hidden;
5793
}
5794

    
5795
.create-vm .steps-history .steps-history-cont.current .title {
5796
    display: block;
5797
    top: 23px;
5798
    left: 43px;
5799
    font-size: 1.2em;
5800
    color: #ffffff;
5801
    font-weight: bold;
5802
    font-family: 'Ubuntu', sans-serif !important;
5803
}
5804

    
5805
.create-vm .steps-history .steps-history-cont.current .subnum {
5806
    display: none;
5807
    float: none;
5808
    font-size: 0.9em;
5809
    font-family: 'Ubuntu', sans-serif  !important;
5810
}
5811

    
5812
.create-vm .steps-history .steps-history-cont.current .subtitle,
5813
.create-vm .steps-history .steps-history-cont.current .description {
5814
    font-family: 'Ubuntu', sans-serif  !important;
5815
}
5816

    
5817
.create-vm .steps-history .steps-history-cont.current .info {
5818
    display: block;
5819
    font-family: 'Ubuntu', sans-serif !important;
5820
}
5821

    
5822
.create-vm .steps-history .steps-history-cont.completed .title,
5823
.create-vm .steps-history .steps-history-cont.completed .num {
5824
    color: #A1C8DB;
5825
}
5826

    
5827
.create-vm .steps-history .steps-history-cont.completed {
5828
    background-color: #4085A5;
5829
    color: #fff;
5830
    cursor: pointer;
5831
}
5832

    
5833
.create-vm .steps-history .steps-history-cont.completed .steps-history-step {
5834
    background-image: url("../images/check.png");
5835
}
5836

    
5837
.create-vm .steps-history .steps-history-cont.current .steps-history-step {
5838
    width: 320px;
5839
}
5840

    
5841
.create-vm .steps-history .steps-history-cont.current .num {
5842
    color: #fff;
5843
}
5844

    
5845
.create-vm .steps-history .steps-history-cont.current .info {
5846
    color: #4085A5;
5847
    font-size: 0.8em;
5848
}
5849

    
5850
.create-vm .steps-history .steps-history-cont.current {
5851
    background-color: #A1C8DB;
5852
    color: #fff;
5853
    width: 428px;
5854
}
5855

    
5856
.create-vm .steps-history-step {
5857
    padding: 4px;
5858
    padding-left: 7px;
5859
    font-size: 1em;
5860
    font-family: 'Ubuntu', sans-serif  !important;
5861
    margin-right: 5px;
5862
    padding-top: 12px;
5863
    background-position: right 30px;
5864
    background-image: none;
5865
    background-repeat: no-repeat;
5866
}
5867

    
5868
.create-vm .steps-history {
5869
    background-color: #4085A5;
5870
}
5871

    
5872
.create-vm .steps-history .steps-history-cont.last {
5873
    border-right: none;
5874
}
5875

    
5876
.create-vm .steps-history .steps-history-cont .num {
5877
    margin-left: 5px;
5878
    margin-top: -10px;
5879
    padding-bottom: 10px;
5880
}
5881

    
5882
.create-vm .steps-history .steps-history-cont .title {
5883
    display: none;
5884
    position: absolute;
5885
    bottom: 0px;
5886
    text-align: center;
5887
    padding-bottom: 2px;
5888
    left:0;
5889
    width: 55px;
5890
    margin-left:0;
5891
    margin-top:0;
5892
    font-size: 0.8em;
5893
}
5894

    
5895
.create-vm .steps-history .steps-history-cont .subnum,
5896
.create-vm .steps-history .steps-history-cont .info {
5897
    display: none;
5898
}
5899

    
5900
.create-vm .steps-history .steps-history-cont {
5901
    height: 70px;
5902
    width: 51px;
5903
    float: left;
5904
    color: #fff;
5905
    border-right: 1px solid #A1C8DB;
5906
    color: #A1C8DB;
5907
    background-color: #4085A5;
5908
    background-position: center right;
5909
    background-image: none;
5910
    background-repeat: no-repeat;
5911

    
5912
    -webkit-transition: background-color .15s ease-in;
5913
    -o-transition: background-color .15s ease-in;
5914
    -moz-transition: background-color .15s ease-in;
5915
    transition: background-color .15s ease-in;
5916

    
5917
    border-bottom: 1px solid #aaa;
5918
}
5919

    
5920
.create-vm .step-header .header-step .num {
5921
    color: #225871;
5922
    font-size: 4em;
5923
    margin-bottom: -5px;
5924
    font-family: 'Ubuntu', sans-serif;
5925
    font-weight: normal !important;
5926
}
5927

    
5928
.create-vm .step-header .header-step {
5929
    color: #;
5930
    margin-bottom: -6px;
5931
    width: 25%;
5932
    padding-left: 0%;
5933
    display: block;
5934
    float: left;
5935
}
5936

    
5937
.create-vm .step-header .header-step.current {
5938
    color: #387693;
5939
}
5940

    
5941
.create-vm .image-filters-title {
5942
    margin-top: 1em;
5943
    margin-bottom: 0.5em;
5944
}
5945

    
5946
.create-vm .create-step-cont span.clear {
5947
    font-size: 0.8em;
5948
    font-weight: bold;
5949
    color: #A1C8DB;
5950
    display: block;
5951
}
5952

    
5953
.create-vm .category-filters li {
5954
    float:left;
5955
    display: block;
5956
    padding: 4px;
5957
    background-color: #eee;
5958
    margin-right: 5px;
5959
    font-size: 0.9em;
5960
    margin-bottom: 5px;
5961
}
5962

    
5963
.create-vm .content-cont {
5964
    height: 340px;
5965
    overflow: auto;
5966
}
5967

    
5968
.create-vm .vm-confirm .confirm-params span.cval {
5969
    margin-left: 8px;
5970
    color: #444;
5971
}
5972

    
5973
.create-vm .vm-confirm .confirm-params span.ckey {
5974
    color: #4085A5;
5975
    font-weight: bold;
5976
}
5977

    
5978
.create-vm .vm-confirm .confirm-params {
5979
    margin-bottom: 15px;
5980
}
5981

    
5982
.create-vm .vm-confirm h3.vm-name {
5983
    background-repeat: no-repeat;
5984
    background-position: left center;
5985
    font-size: 1.4em;
5986
    padding-left: 1.45em;
5987
    color: #4085A5;
5988
}
5989

    
5990
.create-vm .images-list-cont h4 a {
5991
    margin-top: 3px;
5992
    margin-right: -2px !important;
5993
}
5994
.create-vm .images-list-cont h4 a,
5995
.create-vm .list-cont h4 a {
5996
    font-size: 0.8em;
5997
    font-weight: normal;
5998
    margin-right: 5px;
5999
    float: right;
6000
    color: #FF7F2A;
6001
}
6002

    
6003
.create-vm .confirm-params {
6004
    overflow: auto;
6005
}
6006

    
6007
.create-vm .vm-confirm .ssh.confirm-params {
6008
    max-height: 150px;
6009
}
6010

    
6011
.create-vm .personalize-cont .confirm-params {
6012
    max-height: 190px;
6013
}
6014

    
6015
.create-vm .personalize-cont,
6016
.create-vm .confirm-cont {
6017
    height: 250px;
6018
}
6019

    
6020
.create-vm .create-step-cont .rename input.rename-field {
6021
    font-size: 1.4em;
6022
    padding: 5px;
6023
    width: 93%;
6024
    padding-left: 30px;
6025
    background-position: 7px center;
6026
    background-repeat: no-repeat;
6027
}
6028

    
6029
.create-vm .create-step-cont .rename label {
6030
    display: block;
6031
}
6032

    
6033
.create-vm .create-step-cont .personalize-conts,
6034
.create-vm .create-step-cont .confirm-conts {
6035
    margin-top: 20px;
6036
}
6037

    
6038
.create-vm .create-step-cont .personalize-cont,
6039
.create-vm .create-step-cont .confirm-cont {
6040
    width: 30%;
6041
    margin-right: 2%;
6042
    border-right: 1px solid #A1C8DB;
6043
    float: left;
6044
}
6045

    
6046
.create-vm .create-step-cont .confirm-cont ul li .title {
6047
    width: 55px;
6048
    float: left;
6049
}
6050

    
6051
.create-vm .create-step-cont .list-cont ul li .value {
6052
    float: right;
6053
    padding-top: 2px;
6054
    display: block;
6055
    width: 90px;
6056
    text-align: right;
6057
}
6058

    
6059
.create-vm .create-step-cont .list-cont ul li.flavor-disktype .value {
6060
    width: 45px;
6061
}
6062

    
6063
.create-vm .create-step-cont .list-cont ul li.image-description .value,
6064
.create-vm .create-step-cont .list-cont ul li.image-name .value {
6065
    float: none;
6066
    width: auto;
6067
    text-align:left;
6068
    width: auto;
6069
}
6070

    
6071
.create-vm .create-step-cont .list-cont ul li {
6072
    padding:0;
6073
    margin:0;
6074
    margin-bottom: 5px;
6075
    border-bottom: 1px solid #EEE;
6076
    padding-bottom: 7px;
6077
    margin-right: 10px;
6078
}
6079

    
6080
.create-vm .create-step-cont li.ssh-key-option .check {
6081
    float: right;
6082
    margin-right: 5px;
6083
    margin-top: 0px;
6084
}
6085

    
6086
.create-vm .create-step-cont li.ssh-key-option.selected {
6087
}
6088
.create-vm .create-step-cont li.ssh-key-option.selected:hover {
6089
    background-color: #F95;
6090
}
6091

    
6092
.create-vm .create-step-cont li.ssh-key-option:hover {
6093
    background-color: #eee;
6094
}
6095

    
6096
.create-vm .create-step-cont li.ssh-key-option.selected {
6097
}
6098

    
6099
.create-vm .create-step-cont li.ssh-key-option {
6100
    padding: 6px !important;
6101
}
6102

    
6103
.create-vm .create-step-cont .list-cont.ssh {
6104
    width: 60%;
6105
}
6106

    
6107
.create-vm .create-step-cont .list-cont.meta h4 {
6108
    margin-right: 0;
6109
}
6110

    
6111
.create-vm .create-step-cont .list-cont.meta {
6112
    margin-right:0;
6113
    border-right: none;
6114
    width: 195px;
6115
}
6116

    
6117
.create-vm .list-cont > h4 {
6118
    font-size: 1.2em;
6119
    margin-right: 10px;
6120
    border-bottom: 1px solid #A1C8DB;
6121
    padding-bottom: 5px;
6122
    color: #387693;
6123
}
6124

    
6125
.create-vm .list-cont .param.image-name {
6126
    margin-bottom: 0 !important;
6127
    border-bottom: none !important;
6128
}
6129

    
6130
.create-vm .list-cont .param h4 {
6131
    margin-bottom: 0px !important;
6132
    font-size: 1.1em !important; 
6133
}
6134

    
6135
.create-vm .list-cont .param {
6136
    margin-bottom: 7px !important;
6137
}
6138

    
6139
.create-vm .list-cont .value {
6140
    font-weight: bold;
6141
}
6142

    
6143
.create-vm .list-cont .param .value {
6144
    font-size: 0.9em;
6145
}
6146

    
6147
.create-vm .list-cont .param .title {
6148
    color: #387693;
6149
}
6150

    
6151
.create-vm .list-cont .image-description {
6152
    margin-left:0;
6153
}
6154

    
6155
.create-vm .list-cont .image-description .value {
6156
    font-weight: normal;
6157
    margin-left: 0 !important;
6158
}
6159

    
6160
.create-vm .list-cont .image-description .title {
6161
    display: none;
6162
    font-size: 0.8em;
6163
}
6164

    
6165
.create-vm .list-cont.meta .values span {
6166
    display:block;
6167
    float: left;
6168
    margin-right: 4px;
6169
    border: 1px solid #eee;
6170
    padding:3px;
6171
    margin-bottom: 4px;
6172
    font-size: 0.9em;
6173
}
6174

    
6175
.create-vm .list-cont.meta .key {
6176
    font-weight: bold;
6177
    font-size: 0.9em;
6178
    display: block;
6179
    margin-bottom: 5px;
6180
}
6181

    
6182
.create-vm .meta input {
6183
    font-size: 0.8em;
6184
}
6185

    
6186
.vm-connect .connect-cont {
6187
    margin-bottom: 20px;
6188
    border-bottom: 1px solid #A1C8DB;
6189
    padding-bottom: 20px;
6190
}
6191

    
6192
.vm-connect .connection-info {
6193
    padding-bottom: 0px;
6194
    margin-bottom: 0;
6195
    border-bottom: none;
6196
}
6197

    
6198
.vm-connect .connection-info .connect a {
6199
    color: #fff;
6200
}
6201

    
6202
.vm-connect .connection-info .connect {
6203
    background-color: #387693;
6204
    color: #fff;
6205
    padding: 10px;
6206
    font-size: 1.2em;
6207
    text-align: center;
6208
}
6209

    
6210
.clip-copy {
6211
    display: block;
6212
    width: 20px;
6213
    height: 20px;
6214
    position: absolute;
6215
    border: 1px solid #387693;
6216
    background-image: url("../images/clipboard.png");
6217
    background-repeat: no-repeat;
6218
    background-position: center;
6219
    cursor: pointer;
6220
    background-color: #A1C8DB;
6221
}
6222

    
6223
.password-cont .clip-copy { right: 10px; top: 8px;}
6224

    
6225

    
6226
.overlay-invitations {
6227
    width: 680px;
6228
}
6229
.invitations-form .sending .sending-msg {
6230
    font-size: 0.8em;
6231
    display: block !important;
6232
    margin-bottom: 5px;
6233
    color: #008800;
6234
}
6235

    
6236
.invitations-form .send-error {
6237
    font-size: 0.8em;
6238
    margin-bottom: 5px;
6239
    margin-top: 5px;
6240
    color: #800;
6241
    padding: 3px;
6242
    padding-left: 0;
6243
    display: none;
6244
}
6245

    
6246
.invitations-form .error label {
6247
    color: #000 !important;
6248
}
6249

    
6250
.invitations-form .form-field {
6251
    width: 49%;
6252
    float: left;
6253
}
6254

    
6255
.invitations-view .left.none {
6256
    background-color: #880000;
6257
}
6258

    
6259
.invitations-form {
6260
    position: relative;
6261
}
6262

    
6263
.invitations-form h3 {
6264
    float: left;
6265
}
6266

    
6267
.invitations-form .add-new-invitation {
6268
    float:left;
6269
    top:2px;
6270
    right: 20px;
6271
    width: 16px;
6272
    height: 16px;
6273
    background-image: url("../images/option-action-add.png");
6274
    background-repeat: no-repeat;
6275
    background-position: center;
6276
    text-indent: -50000em;
6277
    background-color: #4085A5;
6278
    margin-left: 15px;
6279
    cursor: pointer;
6280
}
6281

    
6282
.invitations-view .left {
6283
    font-size: 1em;
6284
    color: #fff;
6285
    font-weight: bold;
6286
    background-color: #4085A5;
6287
    padding: 4px;
6288
}
6289

    
6290
input.has-errors {
6291
    border-color: #ff0000;
6292
}
6293

    
6294
.none-left .invitations-wrapper .invitations-list {
6295
    width: 100% !important;
6296
    border-left: none !important;
6297
    padding-left: 0;
6298
}
6299

    
6300
.invitations-wrapper .invitations-list {
6301
    width: 40%;
6302
    float: left;
6303
    padding-left: 10px;
6304
    border-left: 1px solid #4085A5;
6305
    margin-left: -1px
6306
}
6307

    
6308
.invitations-wrapper .invitations-form {
6309
    width: 57%;
6310
    float: left;
6311
    border-right: 1px solid #4085A5;
6312
}
6313

    
6314
.invitations-wrapper label span {
6315
    color: #aaa;
6316
    font-size: 0.8em;
6317
}
6318

    
6319
.invitations-wrapper label {
6320
    display: block;
6321
    font-size: 0.9em;
6322
    margin-bottom:10px;
6323
    font-weight: bold;
6324
}
6325

    
6326
.invitations-view .add-new-invitation {
6327
    cursor: pointer;
6328
}
6329

    
6330
.invitations-wrapper input.name {
6331
    width: 150px;
6332
}
6333

    
6334
.invitations-wrapper input {
6335
    font-size: 0.9em;
6336
    width: 155px;
6337
    padding:4px;
6338
}
6339

    
6340
.invitations-list .invitation-sent {
6341
    border-bottom: 1px solid #A1C8DB;
6342
    padding-bottom: 5px;
6343
    margin-bottom: 5px;
6344
    position: relative;
6345
}
6346

    
6347
.invitations-view h3 {
6348
    margin-bottom: 10px;
6349
    color: #4085A5;
6350
}
6351

    
6352
.invitations-list .invitation-sent.last,
6353
.invitations-list .invitation-sent:last-child {
6354
    border-bottom: none;
6355
}
6356

    
6357

    
6358
.invitations-list .invitation-sent .email {
6359
    color: #D98147;
6360
    font-size: 0.8em;
6361
    font-weight: bold;
6362
    margin-top: 2px;
6363
}
6364

    
6365
.invitations-list .pagination a,
6366
.invitations-list .pagination span {
6367
    padding: 0.2em 0.3em;
6368
}
6369

    
6370
.invitations-list .pagination {
6371
    font-size: 0.75em;
6372
}
6373

    
6374
.invitations-list .name {
6375
    color: #444;
6376
    font-size: 0.9em;
6377
}
6378

    
6379
.invitations-list .status.sending {
6380
    background-image: url("../images/icons/indicators/small/progress.gif");
6381
}
6382

    
6383
.invitations-list .status.sent {
6384
    background-image: url("../images/invitation_accepted.png");
6385
}
6386

    
6387
.invitations-list .status.resend {
6388
    background-image: url("../images/resend.png");
6389
}
6390

    
6391
.invitations-list .status.resend {
6392
    cursor: pointer;
6393
}
6394

    
6395
.invitations-list .status {
6396
    width: 20px;
6397
    height: 15px;
6398
    position: absolute;
6399
    top:5px;
6400
    right: 2px;
6401
    background-repeat: no-repeat;
6402
    background-position: center;
6403
}
6404

    
6405
.invitations-form .form-entry:last-child {
6406
    border-bottom: none;
6407
}
6408

    
6409
.invitations-form .form-entry {
6410
    position: relative;
6411
    margin-bottom: 10px;
6412
    padding-bottom: 10px;
6413
    border-bottom: 1px solid #ddd;
6414
    margin-right: 10px;
6415
}
6416

    
6417
.invitations-form .send-invitations {
6418
    float: left;
6419
    padding: 5px;
6420
    color: #fff;
6421
    margin-right: 10px;
6422
    margin-top: 10px;
6423
}
6424

    
6425
.invitations-form .form-entry.error {
6426
    padding-bottom: 0px;
6427
}
6428

    
6429
.invitations-form .form-entry.error .remove-invitation {
6430
    bottom: 32px;
6431
}
6432

    
6433
.invitations-form .remove-invitation {
6434
    padding: 5px;
6435
    background-image: url("../images/option-action-remove.png");
6436
    background-position: center;
6437
    background-repeat: no-repeat;
6438
    color: #fff;
6439
    width: 15px;
6440
    height: 15px;
6441
    cursor: pointer;
6442
    text-indent: -50000px;
6443
    position: absolute;
6444
    right: -10px;
6445
    bottom: 14px;
6446
}
6447

    
6448
.invitations-list .resent-info,
6449
.invitations-form .top-info {
6450
    font-size: 0.8em;
6451
    margin-bottom: 10px;
6452
}
6453

    
6454
.invitations-list .msg .email,
6455
.invitations-form .success .msg .email {
6456
    font-weight: bold;
6457
}
6458

    
6459
.invitations-list .msg.err-msg,
6460
.invitations-list .success.msg,
6461
.invitations-form .success .msg {
6462
    background-color: #080;
6463
    color: white;
6464
    padding: 5px;
6465
    margin-right: 10px;
6466
    margin-bottom: 5px;
6467
}
6468
.invitations-list .msg.err-msg,
6469
.invitations-list .success.msg {
6470
    margin-right: 0px;
6471
}
6472
.invitations-list .msg.err-msg {
6473
    background-color: #800;
6474
}
6475

    
6476
.overlay .models-view .previous-view-link {
6477
    margin: -10px;
6478
    margin-bottom:10px;
6479
    padding: 10px 5px;
6480
    background-image: url("../images/left-arrow.png");
6481
    background-repeat: no-repeat;
6482
    background-position: 10px center;
6483
    padding-left: 20px;
6484
    background-color: #93D070;
6485
    cursor: pointer;
6486
    border-bottom: 1px solid #eee;
6487
    text-decoration: underline;
6488
}
6489
.models-view .quick-add {
6490
    text-decoration: underline; 
6491
    color: #4085A5;
6492
    cursor: pointer;
6493
}
6494

    
6495
.empty .items-list {
6496
    margin-top: 0 !important;
6497
}
6498

    
6499
.models-view .items-empty-msg {
6500
    border-top: 1px solid #aaa;
6501
    padding-top: 10px;
6502
    font-size: 1em;
6503
    margin-top:0 !important;
6504
}
6505

    
6506
.models-view .items-empty-msg,
6507
.models-view .model-description {
6508
    color: #444;
6509
    margin: 10px 0;
6510
}
6511

    
6512
.models-view .model-list .collection-action.disabled {
6513
    background-color: #aaa;
6514
    border-color: #aaa;
6515
    cursor: default;
6516
}
6517
.models-view .model-list .collection-action.disabled:hover {
6518
    background-color: #aaa;
6519
    border-color: #aaa;
6520
}
6521

    
6522
.models-view .model-list .collection-action:hover {
6523
    background-color: #aaa;
6524
}
6525

    
6526
.models-view .model-list .collection-action:hover {
6527
    background-color: #F95;
6528
    border-color: #F95;
6529
}
6530

    
6531
.models-view .model-list .collection-action.in-progress {
6532
    background-color: #aaa;
6533
    color: #fff;
6534
    border-color: #aaa;
6535
    background-image: url("../images/icons/indicators/small/progress.gif") !important;
6536
}
6537

    
6538
.models-view .model-list .collection-action.add-generate {
6539
    background-image: url("../images/option-action-generate-ssh.png");
6540
}
6541

    
6542
.models-view .model-list .collection-action.add {
6543
    background-image: url("../images/option-action-add.png");
6544
    padding-right: 20px !important;
6545
}
6546

    
6547
.models-view .model-list .collection-action {
6548
    float: right;
6549
    background-color: #FF7F2A;
6550
    color: #fff;
6551
    padding: 6px 8px;
6552
    margin-left: 10px;
6553
    cursor: pointer;
6554
    padding-right: 30px;
6555
    background-position: right center;
6556
    background-repeat: no-repeat;
6557
    background-clip: border-box;
6558
    border-right: 5px solid #FF7F2A;
6559
}
6560

    
6561
.models-view .items-list {
6562
    margin-top: 10px;
6563
}
6564

    
6565
.models-view .model-list ul li.model-item:last-child {
6566
    margin-bottom: 0;
6567
}
6568

    
6569
.models-view .model-list ul li.model-item {
6570
    background-color: #D4E2E8;
6571
    margin-bottom: 5px;
6572
    position: relative;
6573
}
6574

    
6575
.models-view .model-list ul li.model-item .param {
6576
    float: left;
6577
    padding: 6px;
6578
}
6579

    
6580
.models-view .model-list ul li.model-item .item-action.confirm-remove {
6581
    margin-right: -15px !important;
6582
}
6583

    
6584
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover .cancel {
6585
    color: inherit !important;
6586
}
6587

    
6588
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover {
6589
    background-color: #F95;
6590
    color: inherit !important;
6591
}
6592

    
6593
.models-view .model-list ul li.model-item .item-action.confirm-remove span.cancel {
6594
    padding: 6px !important;
6595
}
6596

    
6597
.models-view .model-list ul li.model-item .item-action.confirm-remove span {
6598
    display: block;
6599
    float: left;
6600
    padding: 6px 15px;
6601
}
6602

    
6603
.models-view .model-list ul li.model-item .item-action .cancel-remove:hover {
6604
    color: #fff !important;
6605
}
6606

    
6607
.models-view .model-list ul li.model-item .item-action.confirm-remove,
6608
.models-view .model-list ul li.model-item .item-action .do-confirm,
6609
.models-view .model-list ul li.model-item .item-action .cancel-remove {
6610
    display:none !important;
6611
    background-color: #D95D0A;
6612
    padding:0;
6613
    margin:0;
6614
}
6615

    
6616
.models-view .model-list ul li.model-item.pending-delete .item-action.remove {
6617
    display: none;
6618
}
6619

    
6620
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel {
6621
    background-color: #F95;
6622
}
6623

    
6624
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm {
6625
    background-color: #FF7F2A;
6626
}
6627

    
6628
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove,
6629
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove .do-confirm,
6630
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel-remove {
6631
    display:block !important;
6632
}
6633

    
6634
.models-view .model-list ul li.model-item.pending-delete .item-action {
6635
    display: block;
6636
}
6637

    
6638
.models-view .model-list ul li.model-item.expanded .item-action,
6639
.models-view .model-list ul li.model-item:hover .item-action {
6640
    display: block;
6641
}
6642

    
6643
.models-view .model-list ul li.model-item .item-action.hide {
6644
    background-image: url("../images/minus-8.png");
6645
}
6646
.models-view .model-list ul li.model-item .item-action.show:hover {
6647
    background-image: url("../images/plus-8.png");
6648
}
6649

    
6650
.models-view .model-list ul li.model-item .item-action.show {
6651
    background-image: url("../images/plus-8-dark.png");
6652
}
6653

    
6654
.models-view .model-list ul li.model-item .item-action.remove {
6655
    background-image: url("../images/option-action-remove.png");
6656
}
6657

    
6658
.models-view .model-list ul li.model-item .item-action.edit:hover {
6659
    background-image: url("../images/option-action-edit-light.png");
6660
}
6661

    
6662
.models-view .model-list ul li.model-item .item-action.edit {
6663
    background-image: url("../images/option-action-edit.png");
6664
}
6665
.models-view .model-list ul li.model-item .item-action.remove:hover {
6666
    background-color: #880000 !important;
6667
    border-color: #800 !important;
6668
}
6669

    
6670
.models-view .model-list ul li.model-item.expanded .item-action.show,
6671
.models-view .model-list ul li.model-item.expanded .item-action.hide,
6672
.models-view .model-list ul li .item-actions .item-action:hover {
6673
    background-color: #4085A5;
6674
    color: #fff;
6675
    border-color: #4085A5;
6676
}
6677

    
6678
.models-view .model-list ul li .item-actions {
6679
    position: absolute;
6680
    right: -10px;
6681
    top: 0px;
6682
}
6683

    
6684
.models-view .model-list ul li .item-actions .item-action {
6685
    float: right;
6686
    padding: 6px;
6687
    margin-right: 10px;
6688
    display: none;
6689
    cursor: pointer;
6690
    padding-right: 20px;
6691
    background-repeat: no-repeat;
6692
    background-position: right center;
6693
    border-right: 5px solid transparent;
6694
}
6695

    
6696
.models-view .model-list h3 {
6697
    float: left;
6698
}
6699

    
6700
.models-view h3 {
6701
    font-size: 1.2em;
6702
    margin-bottom: 1em;
6703
    margin-top: 5px;
6704
    color: #4085A5;
6705
}
6706

    
6707
.models-view .form-actions {
6708
    font-size: 1.1em;
6709
}
6710

    
6711
.models-view .model-list ul li,
6712
.models-view .model-list ul {
6713
    list-style: none;
6714
}
6715

    
6716
.models-view .model-list ul li.header {
6717
    display: none;
6718
}
6719

    
6720
.models-view .model-form textarea {
6721
    width: 99%;
6722
    height: 100px;
6723
    border: 1px solid #aaa;
6724
}
6725

    
6726

    
6727
.models-view .model-form .form-field {
6728
    margin-bottom: 10px;
6729
}
6730

    
6731
.models-view .model-form label {
6732
    display: block;
6733
    color: #406A7D;
6734
    font-size: 1.1em;
6735
    margin: 0px 0 5px 0;
6736
}
6737

    
6738
.models-view .model-form .inline label {
6739
    float: left;
6740
    margin-right: 10px;
6741
    margin-top: 10px !important;
6742
}
6743

    
6744
.models-view .model-form input.long {
6745
    width: 400px;
6746
}
6747

    
6748
.models-view .model-form .inline input {
6749
    width: auto;
6750
    margin-top: 10px;
6751
}
6752

    
6753
.models-view .model-form .inline select {
6754
    width: auto;
6755
    margin-top: 7px;
6756
}
6757

    
6758
.models-view .model-form .inline .errors,
6759
.models-view .model-form .inline .field-desc {
6760
    clear: both;
6761
}
6762

    
6763
#user_public_keys .private-download {
6764
    margin: 5px 0;
6765
    margin-top: 6px;
6766
}
6767

    
6768
#user_public_keys .private-cont form {
6769
    float: left;
6770
    margin-left: 5px;
6771
}
6772

    
6773
#user_public_keys input.form-text:hover {
6774
    background: #F95;
6775
}
6776

    
6777
#user_public_keys input.form-text {
6778
    background: #FF7F2A;
6779
    color: #fff;
6780
    border: 1px solid #F95;
6781
    padding: 0 5px;
6782
    margin: 0 5px;
6783
    margin-top: -1px;
6784
    cursor: pointer;
6785
}
6786

    
6787
#user_public_keys .form-text {
6788
    float: left;
6789
}
6790

    
6791
#user_custom_images,
6792
#user_public_keys {
6793
    font-size: 0.7em;
6794
}
6795

    
6796
#user_public_keys .download-button {
6797
    width: 30px;
6798
    height: 30px;
6799
}
6800

    
6801

    
6802
#user_public_keys #model-item-tpl {
6803
    display: none;
6804
}
6805
#user_public_keys .model-item .name {
6806
    color: #4085A5;
6807
    font-size: 1.2em;
6808
}
6809

    
6810
#user_public_keys .model-item .fingerprint .flabel {
6811
    color: #888;
6812
    float: left;
6813
    margin-right: 5px;
6814
}
6815

    
6816
#user_public_keys .model-item .fingerprint {
6817
    float: none;
6818
    clear: both;
6819
    color: #444;
6820
    font-family: monospace;
6821
    letter-spacing: 1px;
6822
    padding: 4px;
6823
    font-size: 0.9em;
6824
    border-top: 1px solid #fff;
6825
}
6826

    
6827
#user_public_keys .model-item .publicid {
6828
    display: none;
6829
}
6830

    
6831
#user_public_keys .model-item.expanded .publicid .param-content {
6832
    padding: 5px 5px;
6833
    overflow: auto;
6834
    background-color: #FFF;
6835
    border: 1px solid #4085A5;
6836
    border-left: none;
6837
    border-right: none;
6838
    font-size: 1.1em;
6839
}
6840

    
6841
#user_public_keys .model-item.expanded .publicid .param-content textarea {
6842
    width: 100%;
6843
    height: 90px;
6844
    margin:0;
6845
    padding:0;
6846
    border:none;
6847
    overflow: auto;
6848
}
6849

    
6850
#user_public_keys .model-item.expanded .publicid {
6851
    display: block;
6852
    background-color: #fff;
6853
    width: 100%;
6854
    margin-top: 0px;
6855
    margin-left: 0px;
6856
    color: #fff;
6857
    padding:0 !important;
6858
}
6859

    
6860
.models-view .form-messages {
6861
    margin-bottom: 10px;
6862
}
6863

    
6864
.models-view .list-messages {
6865
    margin-top: 10px;
6866
}
6867

    
6868
.models-view .form-messages .error,
6869
.models-view .form-messages .success,
6870
.models-view .list-messages .error,
6871
.models-view .list-messages .success,
6872
#user_public_keys .private-cont {
6873
    background-color: #AADE87;
6874
    color: #447821;
6875
    padding: 5px;
6876
    border: 1px solid #447821;
6877
    font-size: 1.1em;
6878
    margin-top: 5px;
6879
}
6880

    
6881
.models-view .form-messages .error,
6882
.models-view .list-messages .error {
6883
    background-color: #DE8D87;
6884
    color:  #782421 !important;
6885
    border-color: #782421;
6886
}
6887

    
6888
#user_public_keys .limit-msg {
6889
    color: #800;
6890
    position: absolute;
6891
    right: 20px;
6892
    top: 25px;
6893
}
6894

    
6895
#user_public_keys .private-cont {
6896
    margin-top: 10px;
6897
}
6898

    
6899
#user_public_keys .private-cont .private-msg {
6900
    float: left;
6901
    padding:5px;
6902
    margin-top: 5px;
6903
}
6904

    
6905
#user_public_keys .private-cont textarea {
6906
    margin: 5px;
6907
    width: 97%;
6908
    height: 200px;
6909
}
6910

    
6911
#user_public_keys .private-cont .close-private:hover {
6912
    color: #Fff;
6913
}
6914

    
6915
#user_public_keys .private-cont .close-private {
6916
    float: right;
6917
    margin-right: 5px;
6918
    font-weight: bold;
6919
    cursor: pointer;
6920
    text-decoration: underline;
6921
}
6922

    
6923
#user_public_keys .model-item .key-type {
6924
    background-color: #72ADC8;
6925
    color: #fff;
6926
    text-align: center;
6927
    font-size: 0.9em;
6928
    padding:2px 10px;
6929
    margin: 4px 6px;
6930
    margin-top: 7px;
6931
    font-weight: bold;
6932
}
6933

    
6934
#user_public_keys .private-cont .down-button {
6935
}
6936

    
6937
.models-view .form-field .field-desc {
6938
    font-style: italic;
6939
    font-size: 1em;
6940
    color: #888;
6941
}
6942

    
6943
.models-view .form-field.error label {
6944
    font-weight: bold;
6945
    color: #800 !important;
6946
}
6947

    
6948
.models-view .form-field .errors {
6949
    margin: 5px 0;
6950
}
6951

    
6952
.models-view .form-field .errors .error {
6953
    background-color: transparent;
6954
    border: none;
6955
    color: #800;
6956
}