Statistics
| Branch: | Tag: | Revision:

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

History | View | Annotate | Download (127.2 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
.createbutton.disabled, #networkscreate.disabled {
2583
  background-color: #888 !important;
2584
  border-left-color: #aaa !important;
2585
  cursor: help !important;
2586
  color: #ccc !important;
2587
}
2588

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

    
2593
#createcontainer {
2594
}
2595

    
2596
#networks-container {
2597
}
2598

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
2758
.state {
2759
}
2760

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

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

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

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

    
2795

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
2931
.private-networks .state {
2932
}
2933

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
3040
.machine-name .name {
3041
}
3042

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
3314
.metadata-left {
3315
}
3316

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
3899
.last .firewall-content {
3900
}
3901

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
4198

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

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

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

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

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

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

    
4225

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

    
4234

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

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

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

    
4252
/*404 and 500 pages*/
4253

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
4354

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
4553
.overlay a {
4554
    color: #387693;
4555
}
4556

    
4557
.overlay .diagnostics-list {
4558
    height: 400px;
4559
    overflow: scroll;
4560
    overflow-y: scroll;
4561
    overflow-x: hidden;
4562
}
4563

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

    
4575
.overlay .overlay-content .important {
4576
    color: #800000;
4577
}
4578

    
4579
.overlay .overlay-content .description.noborder {
4580
  margin-bottom:0;
4581
  border:0;
4582
}
4583

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

    
4593
.overlay .overlay-content .empty-message {
4594
    margin-bottom: 5px;
4595
}
4596

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

    
4606
.overlay h3.overlay-header .title {
4607
    float: left;
4608
}
4609

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

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

    
4629
.overlay .message {
4630
}
4631

    
4632
.overlay .actions {
4633
    position: absolute;
4634
    right: 0.75em;
4635
    top: 0.6em;
4636
}
4637

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

    
4649
.overlay-error .error-more-details {
4650
    margin-top: 5px;
4651
    max-height: 210px;
4652
    overflow: auto;
4653
}
4654

    
4655
.overlay-error .key.details.expand {
4656
    background-image: url("../images/plus-8.png");
4657
}
4658

    
4659
.overlay-error .key.details {
4660
    background-color: #5189A3;
4661
    cursor: pointer;
4662
    background-image: url("../images/minus-8.png");
4663
    background-repeat: no-repeat;
4664
    background-position: 545px;
4665
}
4666

    
4667
.overlay-error .container {
4668
    padding-top: 1.9em;
4669
}
4670

    
4671
.overlay-error .error-details {
4672
    font-size: 0.8em;
4673
    margin-top: 10px;
4674
}
4675

    
4676
.overlay-error .error-details anonymous {
4677
    display: block;
4678
    margin-top: 10px;
4679
}
4680

    
4681
.overlay-error h3.overlay-header {
4682
    background-color: #800000;
4683
    color: #fff;
4684
}
4685

    
4686
.overlay-error.non-critical h3.overlay-header {
4687
    background-color: #987249;
4688
}
4689

    
4690
.overlay-error span.key {
4691
    font-weight: normal;
4692
    display: block;
4693
    margin-top: 0.5em;
4694
    background-color: #74AEC9;
4695
    color: #fff;
4696
    padding: 0.4em;
4697
    font-size: 0.8em;
4698
    font-weight: bold;
4699
}
4700

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

    
4710
.overlay-error .nav-btn:hover {
4711
    
4712
}
4713

    
4714
.overlay-error .nav-btn {
4715
    margin-left: 5px;
4716
    color: #fff;
4717
    display: block;
4718
    float: left;
4719
    padding: 4px;
4720
    background-color: #AAA;
4721
    border: 1px solid #444;
4722
}
4723

    
4724
.overlay-error .error-nav {
4725
    position: absolute;
4726
    right: 0px;
4727
    bottom: -25px;
4728
    font-size: 0.8em;
4729
}
4730

    
4731
.overlay-error span.value, .overlay-error div.value {
4732
    padding: 0.4em;
4733
    display: block;
4734
    margin-bottom: 0.3em;
4735
}
4736

    
4737
.overlay h3 .closeme {
4738
    float: right;
4739
    font-size: 0.7em;
4740
    margin-top: 0.2em;
4741
    cursor: pointer;
4742
}
4743

    
4744
.overlay .overlay-header .subtitle {
4745
    display: block;
4746
    font-size: 0.8em;
4747
    color: #ddd;
4748
}
4749

    
4750
.overlay .overlay-header .subtitle img {
4751
    vertical-align: middle;
4752
    margin-left: 10px;
4753
    margin-bottom: 2px;
4754
}
4755

    
4756
.overlay-info .msg-log-entry .src {
4757
    color: #4085A5;
4758
    float: right;
4759
    font-size: 0.9em;
4760
}
4761

    
4762
.overlay-info .msg-log-entry .date {
4763
    font-style: italic;
4764
}
4765

    
4766
.overlay-info .msg-log-entry pre {
4767
    color: #333;
4768
    width: 100%;
4769
    display: none;
4770
    margin: 10px 0;
4771
}
4772

    
4773
.msg-log-entry.warning {
4774
    color: #E57F01;
4775
}
4776

    
4777
.overlay-info .msg-log-entry.with-details .src {
4778
    margin-right: 15px;
4779
}
4780

    
4781
.overlay-info .msg-log-entry.with-details {
4782
    cursor: pointer;
4783
}
4784

    
4785
.overlay-info .msg-log-entry.with-details {
4786
    background-image: url("../images/plus-8-dark.png");
4787
    background-repeat: no-repeat;
4788
    background-position: 99% 9px;
4789
}
4790

    
4791
.overlay-info .msg-log-entry.with-details.expanded {
4792
    background-image: url("../images/minus-8-dark.png");
4793
}
4794

    
4795
.overlay-info .msg-log-entry .msg {
4796
    display: inline-block;
4797
    margin-left: 10px;
4798
}
4799

    
4800
.overlay-info .msg-log-entry {
4801
    border-bottom: 1px solid #aaa;
4802
    padding: 5px;
4803
}
4804

    
4805
.overlay-info .description.subinfo {
4806
    border: none !important;
4807
    padding-top: 0 !important;
4808
}
4809

    
4810
.overlay-info .content {
4811
    background-repeat: no-repeat;
4812
    background-position: 110% 110%;
4813
    background-color: rgba(255,255,255,0.6)
4814
}
4815

    
4816
.overlay-info .overlay-header {
4817
    background-color: #4085A5;
4818
}
4819

    
4820
.overlay-info .overlay-header .title {
4821
    color: #fff;
4822
}
4823

    
4824
.overlay-info .overlay-header .closeme {
4825
    color: #fff;
4826
}
4827

    
4828
#loading-view {
4829
    width: 600px;
4830
    margin: 0 auto;
4831
    padding: 20px 0;
4832
    font-size: 0.8em;
4833
}
4834

    
4835
#loading-view .header span {
4836
    font-weight: bold;
4837
    color: #4085A5;
4838
}
4839

    
4840
#loading-view .info {
4841
    color: #ddd;
4842
}
4843

    
4844
.options-list {
4845
    margin-top: 0.5em;
4846
    font-size: 0.8em;
4847
}
4848

    
4849
.options-list.five li {
4850
    float: left;
4851
    display: block;
4852
    width: 20%;
4853
    margin-bottom: 5px;
4854
}
4855

    
4856
.options-list.five li:nth-child(5n) .options-object-cont {
4857
    margin-right: 0;
4858
}
4859

    
4860
.options-object-cont input {
4861
    border: 1px solid #aaa;
4862
    width: 92px;
4863
    padding: 0;
4864
    margin: 0;
4865
    margin-top:3px;
4866
    padding: 2px;
4867
}
4868

    
4869
.options-list.three li {
4870
    float: left;
4871
    display: block;
4872
    width: 33%;
4873
    margin-bottom: 5px;
4874
}
4875

    
4876
.meta-list .options-list li.options-object.create .options-object-cont {
4877
    background-image: url("../images/option-action-add.png");
4878
    background-repeat: no-repeat;
4879
    background-position: 90px 5px;
4880
}
4881

    
4882
.meta-list .options-list li .options-object-cont .option-action,
4883
.meta-list .options-list li.options-object.create {
4884
    cursor: pointer !important;
4885
}
4886

    
4887
.meta-list .options-list li .options-object-cont {
4888
    cursor: inherit;
4889
}
4890

    
4891
.options-list li .options-object-cont {
4892
    padding: 5px;
4893
    margin-right: 4px;
4894
    border: 1px solid #A6D1E6;
4895
    cursor: pointer;
4896
    min-height: 35px;
4897
    position: relative;
4898
}
4899

    
4900
.options-list.three li:nth-child(3n) .options-object-cont {
4901
    margin-right: 0;
4902
}
4903

    
4904
.options-list li.selected .options-object-cont {
4905
    background-color: #efefef;
4906
    border: 2px solid #4085A5;
4907
    padding: 4px;
4908
}
4909

    
4910
.options-list li.selected .options-object-cont .title {
4911
}
4912

    
4913
.options-list li.options-object .title {
4914
    display: block;
4915
    color: #FF7F2A;
4916
    margin-bottom: 2px;
4917
}
4918

    
4919
.options-list li .option-action {
4920
    display: none;
4921
    position: absolute;
4922
    background-repeat: no-repeat;
4923
}
4924

    
4925
.options-list.five li.editing {
4926
    width: 40%;
4927
}
4928

    
4929
.options-list.five li.editing .value {
4930
    display: none;
4931
}
4932

    
4933
.options-list li .remove {
4934
    background-image: url("../images/option-action-remove.png");
4935
    width:10px;
4936
    height:10px;
4937
    right:5px;
4938
    top: 5px;
4939
}
4940

    
4941
.options-list li .edit {
4942
    background-image: url("../images/option-action-edit.png");
4943
    width:10px;
4944
    height:10px;
4945
    right:5px;
4946
    bottom: 8px;
4947
}
4948

    
4949
.options-list li:hover .option-action  {
4950
    display: block;
4951
}
4952

    
4953
.options-list li.options-object .value {
4954
    color: #4085A5;
4955
    margin-top: 5px;
4956
    display: block;
4957
}
4958

    
4959
.options-list li.selected.options-object .value {
4960
}
4961

    
4962
.options-list li .options-object-cont:hover {
4963
    background-color: #fff;
4964
}
4965

    
4966
.options-list li.selected .options-object-cont:hover {
4967
    background-color: #fff;
4968
}
4969

    
4970
.options-list li img {
4971
    float: left;
4972
    margin:2px;
4973
    margin-right: 10px;
4974
    padding-bottom:10px;
4975
}
4976

    
4977
#network-vms-select-content li.options-object .value {
4978
    margin-top: 10px;
4979
    margin-left: 30px;
4980
}
4981

    
4982
#network-vms-select-content li.options-object:hover .options-object-cont,
4983
#network-vms-select-content li.options-object .options-object-cont {
4984
    background-image: url("../images/option-action-add-dark.png");
4985
    background-repeat: no-repeat;
4986
    background-position: 160px 28px;
4987
}
4988

    
4989
#network-vms-select-content li.selected:hover .options-object-cont,
4990
#network-vms-select-content li.selected .options-object-cont {
4991
    background-image: url("../images/option-action-remove.png") !important;
4992
}
4993

    
4994
#metadata-overlay-content .view .value {
4995
    margin-top: 10px;
4996
}
4997

    
4998
#metadata-overlay-content {
4999
    position: relative;
5000
}
5001

    
5002
.vm-meta .editor .predefined .predefined-meta-key:hover {
5003
    background-color: #4e8eac;
5004
    color: #fff;
5005
}
5006

    
5007
.vm-meta .editor .predefined .predefined-meta-key {
5008
    float: left;
5009
    margin-right: 5px;
5010
    padding: 4px;
5011
    display: block;
5012
    cursor: pointer;
5013
}
5014

    
5015
.vm-meta .editor .predefined {
5016
    background-color: #A6D1E6;
5017
    font-size: 0.9em;
5018
    border-top: 1px solid #ddd;
5019
}
5020

    
5021
.vm-meta .editor input {
5022
}
5023
.vm-meta .editor {
5024
    margin-bottom: 10px;
5025
}
5026

    
5027
.vm-meta .editor .form-actions .form-action {
5028
    min-width: 50px;
5029
}
5030

    
5031
.vm-meta .editor .form-field input.meta-key {
5032
    width: 90px;
5033
}
5034

    
5035
.vm-meta .form-field {
5036
    float: left;
5037
}
5038

    
5039
.vm-meta .form-actions .form-action {
5040
    float: left;
5041
    margin-right: 10px;
5042
    height: 11px;
5043
}
5044

    
5045
.vm-meta .editor .form-actions .cancel {
5046
    margin-right: 0;
5047
}
5048

    
5049
.vm-meta .editor .form-actions {
5050
    float: right;
5051
    margin:0;
5052
    padding:0;
5053
    margin-left: 15px;
5054
    margin-top: 0px;
5055
}
5056

    
5057
.vm-meta .editor {
5058
    background-color: rgba(64, 133, 165, 0.898) !important;
5059
    background-color: #649DB8;
5060
    font-size:0.9em;
5061
}
5062

    
5063
.vm-meta .meta-key-title {
5064
    font-size: 1.3em;
5065
    color: #fff;
5066
    margin-bottom: 10px;
5067
    display: none;
5068
    float: left;
5069
}
5070

    
5071
.vm-meta .editor-content {
5072
    padding: 10px;
5073
}
5074

    
5075
.vm-meta .inner-mask {
5076
    background-color: #fff;
5077
    opacity:0.6;
5078
    position: absolute;
5079
    top:0;
5080
    left:0;
5081
}
5082

    
5083
.vm-meta .editor label {
5084
    float: left;
5085
    color: #fff;
5086
    margin-right: 2px;
5087
    padding-top:4px;
5088
    font-size: 0.9em;
5089
}
5090

    
5091
.vm-meta .editor input {
5092
    border: none;
5093
    width: 170px;
5094
    margin-left: 10px;
5095
    font-size: 0.9em;
5096
    padding: 4px;
5097
}
5098

    
5099
.vm-meta li.create .options-object-cont {
5100
    background-color: #B3C9AD ;
5101
    border-color: #788774;
5102
}
5103
.vm-meta li.create .options-object-cont .value,
5104
.vm-meta li.create .options-object-cont .title {
5105
    color: #fff;
5106
}
5107

    
5108
#createvm-overlay-content {
5109
    padding: 0;
5110
}
5111

    
5112
.overlay-createvm .container {
5113
    width: 584px !important;
5114
}
5115

    
5116
.create-vm .header-step.current {
5117
    font-weight: bold;
5118
}
5119

    
5120
.create-vm .create-step-cont {
5121
    min-height: 240px;
5122
}
5123
.create-vm .create-controls {
5124
    padding: 10px;
5125
}
5126

    
5127
.create-vm ul li {
5128
    cursor: pointer;
5129
    padding: 4px;
5130
}
5131

    
5132
.create-vm ul li.selected {
5133
    background-color: #aaa;
5134
}
5135

    
5136
.cont-toggler {
5137
    background-image: url("../images/down-arrow.png");
5138
    background-position: right;
5139
    background-repeat: no-repeat;
5140
    background-color: #A1C8DB;
5141
    display: inline-block;
5142
    border-right: 6px solid #A1C8DB;
5143
    padding:2px;
5144
    padding-right: 14px;
5145
    padding-left:0;
5146
    cursor: pointer;
5147
    color: #fff;
5148
    font-size: 0.9em;
5149
}
5150

    
5151
.cont-toggler .label {
5152
    background-color: #98BDCF;
5153
    padding: 2px;
5154
    padding-left: 5px;
5155
    padding-right: 5px;
5156
}
5157

    
5158
.cont-toggler.open {
5159
    background-color: #98BDCF;
5160
    border-color: #98BDCF;
5161
    background-image: url("../images/up-arrow.png");
5162
}
5163

    
5164
.cont-toggler.open .label {
5165
    background-color: #4085A5;
5166
}
5167

    
5168
.overlay .form label {
5169
    font-color: #444;
5170
    margin-right: 10px;
5171
}
5172

    
5173
.form-field.error label {
5174
    color: #ff0000;
5175
    text-decoration: underline;
5176
}
5177

    
5178
.form-field input {
5179
    border: 1px solid #aaa;
5180
    width: 200px;
5181
    padding: 3px;
5182
}
5183

    
5184
.form-actions {
5185
    margin-top: 5px;
5186
    padding-top:5px;
5187
    border-top: 1px solid #64a6c4;
5188
    font-size: 0.8em;
5189
}
5190

    
5191
.form-actions.plain {
5192
    margin-top: 0px;
5193
    padding-top:0px;
5194
    border-top: 0px;
5195
}
5196

    
5197
.form-action {
5198
    float: right;
5199
    min-width: 140px;
5200
    background-color: #FF7F2A;
5201
    border: 1px solid #FF7F2A;
5202
    text-align: center;
5203
    color: #FFFFFF;
5204
    cursor: pointer;
5205
    padding: 4px;
5206
}
5207

    
5208
.form-action:hover {
5209
    background-color: #FF9955;
5210
    color: #FFF;
5211
}
5212

    
5213
.form-action.prev,
5214
.form-action.cancel {
5215
    background-color: #800;
5216
    border: 1px solid #800;
5217
    float: left;
5218
}
5219

    
5220
.form-action.prev:hover,
5221
.form-action.cancel:hover {
5222
    background-color: #CC0000;
5223
    color: #fff;
5224
}
5225

    
5226
.form-action.next,
5227
.form-action.ok {
5228
    background-color: #080;
5229
    border: 1px solid #080;
5230
}
5231

    
5232
.form-action.next:hover,
5233
.form-action.ok:hover {
5234
    background-color: #00aa00;
5235
    color: #fff;
5236
}
5237

    
5238
.form-action .create,
5239
.form-action .submit {
5240

    
5241
}
5242

    
5243
.form-action.in-progress, button.in-progress {
5244
    background-image: url("../images/icons/indicators/medium/horizontal-progress.gif");
5245
    background-repeat: no-repeat;
5246
    background-position: center center;
5247
    color: transparent;
5248
}
5249

    
5250
#createvm-overlay-content {
5251
    padding: 0;
5252
}
5253

    
5254
.create-vm .image-details.selected .size {
5255

    
5256
}
5257

    
5258
.create-vm .image-details .show-details:hover {
5259
    color: #aaa !important; 
5260
}
5261
.create-vm .image-details.selected .show-details:hover {
5262
    color: #fff !important; 
5263
}
5264

    
5265
.create-vm .image-details.selected .show-details,
5266
.create-vm .image-details.selected .size {
5267
    color: #eee;
5268
}
5269

    
5270
.create-vm .image-details.selected span.owner {
5271
    color: #fff;
5272
}
5273

    
5274

    
5275
.create-vm .image-details p {
5276
    font-size: 0.8em;
5277
    padding-left: 27px;
5278
    display:block;
5279
}
5280

    
5281
.create-vm .image-details span.owner {
5282
    display: block;
5283
    font-size: 0.9em;
5284
    float: right;
5285
    color: #FF7F2A;
5286
    position: absolute;
5287
    top: 5px;
5288
    right: 5px;
5289
}
5290

    
5291
.create-vm .select-image .show-details {
5292
    display: none;
5293
    font-size: 0.8em;
5294
    text-decoration: underline;
5295
    color: #000;
5296
    position: absolute;
5297
    bottom: 5px;
5298
    right: 5px;
5299
}
5300

    
5301
.create-vm .image-details .size {
5302
    margin-top: 2px;
5303
    font-size: 0.8em;
5304
    color: #aaa;
5305
    margin-left: 10px;
5306
}
5307

    
5308
.create-vm .step-cont {
5309
    margin: 15px;
5310
}
5311

    
5312
.create-vm .create-step-cont {
5313
    min-height: 250px;
5314
    float: left;
5315
    width: 584px;
5316
}
5317

    
5318
.create-vm .create-controls {
5319
    padding: 10px;
5320
    border-top: 1px solid #ddd;
5321
}
5322

    
5323
.create-vm .empty {
5324
    font-size: 0.8em;
5325
    color: #444;
5326
}
5327

    
5328
.create-vm h4 {
5329
    color: #5CA1C0;
5330
    margin-bottom: 0.5em;
5331
    font-family: arial;
5332
}
5333
.create-vm ul li {
5334
    cursor: pointer;
5335
    padding: 4px;
5336
    font-size: 0.9em;
5337
}
5338

    
5339
.create-vm .create-step-cont li.ssh-key-option.selected,
5340
.create-vm ul li.selected {
5341
    background-color: #FF7F2A;
5342
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5343
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5344
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5345
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5346
    color: #fff;
5347
}
5348

    
5349
.create-vm .images-list-cont.loading .loading-indicator {
5350
    display: block !important;
5351
}
5352

    
5353
.create-vm .images-list-cont .loading-indicator {
5354
    display: none;
5355
    position: absolute;
5356
    right: -13px;
5357
    top: 2px;
5358
    width: 30px;
5359
    height: 10px;
5360
    background-repeat: no-repeat;
5361
    background-image: url("../images/icons/indicators/medium/progress.gif");
5362
}
5363

    
5364
.create-vm .images-list-cont h4 {
5365
    position: relative;
5366
}
5367

    
5368
.create-vm .images-list-cont {
5369
    width: 40%;
5370
    float: left;
5371
    padding-left: 3%;
5372
    padding-right: 3%;
5373
}
5374

    
5375
.create-vm li p.desc {
5376
    font-size: 0.9em;
5377
}
5378

    
5379
.create-vm p.desc.warning {
5380
    color: #880000;
5381
}
5382

    
5383
.create-vm p.desc.empty {
5384
    color: #000;
5385
}
5386

    
5387
.create-vm p.desc {
5388
    font-size: 0.8em;
5389
    color: #888;
5390
    margin-bottom: 10px;
5391
}
5392

    
5393
.create-vm li.role .values .val:hover {
5394
    background-color: #eee;
5395
}
5396
.create-vm li.role .values .val.selected,  .create-vm li.role .values .val.selected:hover {
5397
    color: #fff;
5398
    background-color: #FF9955;
5399
}
5400

    
5401
.create-vm .images-filter-cont, .create-vm .flavors-predefined-cont {
5402
    width: 18%;
5403
    padding-right: 4%;
5404
    float:left;
5405
    border-right: 1px solid #A1C8DB;
5406
    overflow: auto;
5407
}
5408

    
5409
.create-vm .flavor-options-cont {
5410
    width: 74%;
5411
    float: left;
5412
    margin-left: 20px;
5413
}
5414

    
5415
.create-vm .flavor-options-cont .flavor-options li:hover {
5416
    background-image:-webkit-linear-gradient(top, #E8F4FA, #D1E7F0);
5417
    background-image:-o-linear-gradient(top, #E8F4FA, #D1E7F0);
5418
    background-image:-moz-linear-gradient(top, #E8F4FA, #D1E7F0);
5419
    background-image:linear-gradient(top, #E8F4FA, #D1E7F0);
5420
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E8F4FA', endColorstr='#D1E7F0', GradientType=0);
5421
}
5422

    
5423
.create-vm .flavor-options-cont .flavor-options li.disabled * {
5424
    color: #eee !important;
5425
}
5426

    
5427
.create-vm .flavor-options-cont .flavor-options li.disabled {
5428
    background-image:linear-gradient(top, #aaa, #ddd);
5429
    background-image:-webkit-linear-gradient(top, #aaa, #ddd);
5430
    background-image:-o-linear-gradient(top, #aaa, #ddd);
5431
    background-image:-moz-linear-gradient(top, #aaa, #ddd);
5432
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#aaaaaa', endColorstr='#dddddd', GradientType=0);
5433
}
5434

    
5435
.create-vm .flavor-options-cont .flavor-options li.selected {
5436
    background-color: #FF9955;
5437
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5438
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5439
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5440
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5441
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF9955', endColorstr='#E88B4D', GradientType=0);
5442
    border: 1px solid #C97943;
5443
}
5444

    
5445
.create-vm .predefined-list li.disabled {
5446
    color: #ddd !important;
5447
}
5448

    
5449
.create-vm .flavor-options-cont .flavor-options li {
5450
    display: block;
5451
    float: left;
5452
    margin-right: 10px;
5453
    margin-bottom: 9px;
5454
    padding: 9px 14px;
5455
    border: 1px solid #aaa;
5456
    background-image:-webkit-linear-gradient(top, #D1E7F0, #E8F4FA);
5457
    background-image:-o-linear-gradient(top, #D1E7F0, #E8F4FA);
5458
    background-image:-moz-linear-gradient(top, #D1E7F0, #E8F4FA);
5459
    background-image:linear-gradient(top, #D1E7F0, #E8F4FA);
5460
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D1E7F0', endColorstr='#E8F4FA', GradientType=0);
5461
}
5462

    
5463
.create-vm .flavor-options-cont .flavor-options {
5464
    margin-bottom: 2px;
5465
}
5466

    
5467

    
5468
.create-vm .flavor-options .metric {
5469
    font-size: 0.8em;
5470
    margin-left: 2px;
5471
}
5472

    
5473
.create-vm .flavor-options span.title {
5474
    color: #444;
5475
}
5476

    
5477
.create-vm .flavor-options span.desc {
5478
    display: block;
5479
    color: #aaa;
5480
    font-weight: normal;
5481
    font-size: 0.8em;
5482
    float: right;
5483
    margin-top: 4px;
5484
}
5485

    
5486
.disktip {
5487
    padding: 4px;
5488
    top: 20px;
5489
}
5490

    
5491
.create-vm .flavor-options .flavors-disk-template-list {
5492
    position: relative;
5493
}
5494

    
5495
.create-vm .flavor-options .disk_template.option {
5496
    z-index: 10;
5497
    min-width: 50px;
5498
    text-align: center;
5499
}
5500

    
5501
/*0 position is -470px*/
5502
.create-vm .flavor-options .disk-template-description {
5503
    font-size: 0.8em;
5504
    color: #444;
5505
    background-image: url("../images/horizontal-pointer.png");
5506
    background-repeat: repeat-x;
5507
    background-position: -470px 0;
5508
    padding-top: 15px;
5509
    margin-top: -10px;
5510
    font-style: italic;
5511
    display:block;
5512
    overflow: auto;
5513
    padding-bottom: 0px;
5514
    margin-bottom: 7px;
5515
    width: 100%;
5516
}
5517

    
5518
.create-vm .flavor-options .disk_template.option .description {
5519
    display: none;
5520
    position: absolute;
5521
    bottom: -20px;
5522
    left:0;
5523
    color: #888;
5524
    font-style: italic;
5525
    display: block;
5526
    background-color: #fff;
5527
    width: 100%;
5528
    text-align: left;
5529
    z-index: 0;
5530
    border-top: 1px solid #ddd;
5531
    padding-top: 3px;
5532
    display: none;
5533
}
5534

    
5535
.create-vm .flavor-options .selected .value {
5536
    color: #FFF;
5537
}
5538

    
5539
.create-vm .flavor-options .value {
5540
    font-weight: bold;
5541
    color: #5CA1C0;
5542
}
5543

    
5544
.create-vm .flavor-options-cont h4 {
5545
    border-bottom: 1px solid #A1C8DB;
5546
    padding-bottom: 5px;
5547
}
5548

    
5549
.create-vm .images-info-cont {
5550
    width: 28%;
5551
    padding-left: 3%;
5552
    float: left;
5553
    border-left: 1px solid #A1C8DB;
5554
}
5555

    
5556
.create-vm .select-image.wide .show-details {
5557
    display: inline;
5558
}
5559

    
5560
.create-vm .select-image .images-info-cont .hide {
5561
    display: none;
5562
}
5563

    
5564
.create-vm .select-image.wide .images-info-cont .hide {
5565
    display: block;
5566
    float: right;
5567
    position: absolute;
5568
    right: 10px;
5569
    top: 10px;
5570
    font-size: 0.8em;
5571
    text-decoration: underline;
5572
    color: #5CA1C0;
5573
    cursor: pointer;
5574
}
5575

    
5576
.create-vm .select-image.wide .images-list-cont {
5577
    width: 74%;
5578
    padding-right: 0;
5579
}
5580

    
5581
.create-vm .select-image.wide .images-info-cont .description .title {
5582
    display: none;
5583
    float: none;
5584
}
5585

    
5586
.create-vm .select-image.wide .images-info-cont .description p {
5587
    background-color: #fff;
5588
    border: 1px solid #ddd;
5589
    padding: 10px;
5590
    float: none;
5591
}
5592

    
5593
.create-vm .select-image.wide .selected .size {
5594
    color: #FFF !important;
5595
}
5596

    
5597
.create-vm .select-image.wide .image-details .size {
5598
    color: #5CA1C0;
5599
    position: absolute;
5600
    top: 5px;
5601
}
5602

    
5603
.create-vm .select-image.wide .images-info-cont h3 {
5604
    color: #5CA1C0;
5605
    margin: 10px 0;
5606
    margin-top: 5px;
5607
    text-align: left;
5608
    font-size: 0.9em;
5609
}
5610

    
5611
.create-vm .select-image.wide .images-info-cont .description p {
5612
    height: 50px;
5613
}
5614

    
5615
.create-vm .select-image.wide .images-info-cont .description {
5616
    width: 100% !important;
5617
    float: none !important;
5618
    background-color: transparent !important;
5619
    padding: 0 !important;
5620
    font-size: 1.1em;
5621
}
5622
.create-vm .select-image.wide .images-info-cont .extra-details {
5623
    height: 160px;
5624
    overflow-y: scroll;
5625
    padding-right: 15px;
5626
}
5627

    
5628
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail.extra-meta .title .custom {
5629
    display: inline-block;
5630
}
5631

    
5632
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail.extra-meta .title {
5633
    background-color: #999 !important;
5634
    border-color: #888 !important;
5635
}
5636
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail .custom {
5637
    float: right;
5638
    display: none;
5639
    font-size: 0.8em;
5640
    margin-left: 10px;
5641
    color: #DDD;
5642
    margin-top: 2px;
5643
}
5644

    
5645
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail {
5646
    padding: 0px;
5647
    background-color: transparent;
5648
    margin-bottom: 4px;
5649
}
5650

    
5651
.create-vm .select-image.wide .images-info-cont .extra-details .title {
5652
    float: left;
5653
    display: block;
5654
    width: 39%;
5655
    padding: 1%;
5656
    background-color: #5CA1C0;
5657
    color: #fff;
5658
    border: 1px solid #4F8DAA;
5659
    font-size: 0.8em;
5660
}
5661

    
5662
.create-vm .select-image.wide .images-info-cont .extra-details .value {
5663
    float: right;
5664
    display: block;
5665
    width: 55%;
5666
    padding: 1%;
5667
    border: none;
5668
    background-color: #FFF;
5669
    color: #444;
5670
    border: 1px solid #ddd;
5671
    margin-bottom: 0px;
5672
    font-size: 0.8em;
5673
}
5674

    
5675
.create-vm .select-image.wide .images-info-cont .image-detail {
5676
}
5677

    
5678
.create-vm .select-image.wide ul.images-list {
5679
    height: 310px;
5680
    overflow-y: scroll;
5681
    padding-right: 3%;
5682
}
5683

    
5684
.create-vm .select-image.wide .images-info-cont {
5685
    position: absolute;
5686
    width: 88%;
5687
    background-color: #DAE9F0;
5688
    padding: 2%;
5689
    border-left: none;
5690
    height: 320px;
5691
    box-shadow: 0px 0px 2px #aaa;
5692
    -moz-box-shadow: 0px 0px 2px #aaa;
5693
    -webkit-box-shadow: 0px 0px 2px #aaa;
5694
    display: none;
5695
}
5696

    
5697

    
5698
.create-vm .images-info-cont h4, .create-vm .create-step-cont .param h4{
5699
    color: #FF9955;
5700
    margin-bottom: 1em;
5701
    font-size: 1.2em;
5702
}
5703

    
5704
.create-vm .images-info-cont span.title {
5705
    color: #4085A5;
5706
    display: block;
5707
    margin-bottom: 2px;
5708
    font-size: 0.8em;
5709
}
5710

    
5711
.create-vm .type-filter li {
5712
    font-size: 0.8em;
5713
    /*font-weight: bold;*/
5714
    padding: 4px;
5715
    margin-bottom: 0px;
5716
    color: #FF7F2A;
5717
}
5718

    
5719
.create-vm .images-list li {
5720
    min-height: 30px;
5721
}
5722
.create-vm .images-list .image-details:hover {
5723
    background-color: #eee;
5724
}
5725

    
5726
.create-vm .images-list .image-details.selected:hover {
5727
    background-color: #FF7F2A;
5728
}
5729

    
5730
.create-vm .images-list .image-details.selected {
5731
    /*font-weight: bold;*/
5732
}
5733

    
5734
.create-vm .images-list .image-details {
5735
    padding: 6px;
5736
    margin-bottom:1px;
5737
    position: relative;
5738
}
5739

    
5740
.create-vm .images-list .image-details img {
5741
    vertical-align: middle;
5742
    margin-right: 10px;
5743
}
5744

    
5745
.create-vm .images-info-cont .image-detail:last-child p {
5746
    border-bottom: none;
5747
}
5748

    
5749
.create-vm .images-info-cont h4 img {
5750
    vertical-align: middle;
5751
    margin-right: 7px;
5752
    margin-bottom: 5px;
5753
}
5754

    
5755
.create-vm .images-info-cont .description p {
5756
    font-size: 0.8em;
5757
}
5758

    
5759
.create-vm .images-info-cont p {
5760
    margin-bottom: 7px;
5761
    font-size: 0.9em;
5762
    border-bottom: 1px solid #A1C8DB;
5763
    padding-bottom: 7px;
5764
}
5765

    
5766
.create-vm .step-header {
5767
    padding-bottom:0;
5768
    position: relative;
5769
}
5770

    
5771
.create-vm .step-header .header-step .info span.subtitle {
5772
    font-size: 1.2em;
5773
    color: #fff;
5774
    font-weight: bold;
5775
}
5776

    
5777
.create-vm .step-header .header-step .info span {
5778
    float: none;
5779
    text-align: right;
5780
}
5781

    
5782
.create-vm .step-header .header-step .info {
5783
    position: absolute;
5784
    right: 15px;
5785
    top: 20px;
5786
    font-size: 0.8em;
5787
}
5788

    
5789
.create-vm .step-header .header-step span {
5790
    float: left;
5791
    display: block;
5792
}
5793

    
5794
.create-vm .steps-container {
5795
    width: 2000em;
5796
}
5797

    
5798
.create-vm .step-header .header-step .title {
5799
    margin-top: 20px;
5800
    font-size: 1em;
5801
    margin-left: 10px;
5802
}
5803

    
5804
#createvm-overlay-content {
5805
    width: 584px;
5806
    overflow: hidden;
5807
}
5808

    
5809
.create-vm .steps-history .steps-history-cont.current .title {
5810
    display: block;
5811
    top: 23px;
5812
    left: 43px;
5813
    font-size: 1.2em;
5814
    color: #ffffff;
5815
    font-weight: bold;
5816
    font-family: 'Ubuntu', sans-serif !important;
5817
}
5818

    
5819
.create-vm .steps-history .steps-history-cont.current .subnum {
5820
    display: none;
5821
    float: none;
5822
    font-size: 0.9em;
5823
    font-family: 'Ubuntu', sans-serif  !important;
5824
}
5825

    
5826
.create-vm .steps-history .steps-history-cont.current .subtitle,
5827
.create-vm .steps-history .steps-history-cont.current .description {
5828
    font-family: 'Ubuntu', sans-serif  !important;
5829
}
5830

    
5831
.create-vm .steps-history .steps-history-cont.current .info {
5832
    display: block;
5833
    font-family: 'Ubuntu', sans-serif !important;
5834
}
5835

    
5836
.create-vm .steps-history .steps-history-cont.completed .title,
5837
.create-vm .steps-history .steps-history-cont.completed .num {
5838
    color: #A1C8DB;
5839
}
5840

    
5841
.create-vm .steps-history .steps-history-cont.completed {
5842
    background-color: #4085A5;
5843
    color: #fff;
5844
    cursor: pointer;
5845
}
5846

    
5847
.create-vm .steps-history .steps-history-cont.completed .steps-history-step {
5848
    background-image: url("../images/check.png");
5849
}
5850

    
5851
.create-vm .steps-history .steps-history-cont.current .steps-history-step {
5852
    width: 320px;
5853
}
5854

    
5855
.create-vm .steps-history .steps-history-cont.current .num {
5856
    color: #fff;
5857
}
5858

    
5859
.create-vm .steps-history .steps-history-cont.current .info {
5860
    color: #4085A5;
5861
    font-size: 0.8em;
5862
}
5863

    
5864
.create-vm .steps-history .steps-history-cont.current {
5865
    background-color: #A1C8DB;
5866
    color: #fff;
5867
    width: 428px;
5868
}
5869

    
5870
.create-vm .steps-history-step {
5871
    padding: 4px;
5872
    padding-left: 7px;
5873
    font-size: 1em;
5874
    font-family: 'Ubuntu', sans-serif  !important;
5875
    margin-right: 5px;
5876
    padding-top: 12px;
5877
    background-position: right 30px;
5878
    background-image: none;
5879
    background-repeat: no-repeat;
5880
}
5881

    
5882
.create-vm .steps-history {
5883
    background-color: #4085A5;
5884
}
5885

    
5886
.create-vm .steps-history .steps-history-cont.last {
5887
    border-right: none;
5888
}
5889

    
5890
.create-vm .steps-history .steps-history-cont .num {
5891
    margin-left: 5px;
5892
    margin-top: -10px;
5893
    padding-bottom: 10px;
5894
}
5895

    
5896
.create-vm .steps-history .steps-history-cont .title {
5897
    display: none;
5898
    position: absolute;
5899
    bottom: 0px;
5900
    text-align: center;
5901
    padding-bottom: 2px;
5902
    left:0;
5903
    width: 55px;
5904
    margin-left:0;
5905
    margin-top:0;
5906
    font-size: 0.8em;
5907
}
5908

    
5909
.create-vm .steps-history .steps-history-cont .subnum,
5910
.create-vm .steps-history .steps-history-cont .info {
5911
    display: none;
5912
}
5913

    
5914
.create-vm .steps-history .steps-history-cont {
5915
    height: 70px;
5916
    width: 51px;
5917
    float: left;
5918
    color: #fff;
5919
    border-right: 1px solid #A1C8DB;
5920
    color: #A1C8DB;
5921
    background-color: #4085A5;
5922
    background-position: center right;
5923
    background-image: none;
5924
    background-repeat: no-repeat;
5925

    
5926
    -webkit-transition: background-color .15s ease-in;
5927
    -o-transition: background-color .15s ease-in;
5928
    -moz-transition: background-color .15s ease-in;
5929
    transition: background-color .15s ease-in;
5930

    
5931
    border-bottom: 1px solid #aaa;
5932
}
5933

    
5934
.create-vm .step-header .header-step .num {
5935
    color: #225871;
5936
    font-size: 4em;
5937
    margin-bottom: -5px;
5938
    font-family: 'Ubuntu', sans-serif;
5939
    font-weight: normal !important;
5940
}
5941

    
5942
.create-vm .step-header .header-step {
5943
    color: #;
5944
    margin-bottom: -6px;
5945
    width: 25%;
5946
    padding-left: 0%;
5947
    display: block;
5948
    float: left;
5949
}
5950

    
5951
.create-vm .step-header .header-step.current {
5952
    color: #387693;
5953
}
5954

    
5955
.create-vm .image-filters-title {
5956
    margin-top: 1em;
5957
    margin-bottom: 0.5em;
5958
}
5959

    
5960
.create-vm .create-step-cont span.clear {
5961
    font-size: 0.8em;
5962
    font-weight: bold;
5963
    color: #A1C8DB;
5964
    display: block;
5965
}
5966

    
5967
.create-vm .category-filters li {
5968
    float:left;
5969
    display: block;
5970
    padding: 4px;
5971
    background-color: #eee;
5972
    margin-right: 5px;
5973
    font-size: 0.9em;
5974
    margin-bottom: 5px;
5975
}
5976

    
5977
.create-vm .content-cont {
5978
    height: 340px;
5979
    overflow: auto;
5980
}
5981

    
5982
.create-vm .vm-confirm .confirm-params span.cval {
5983
    margin-left: 8px;
5984
    color: #444;
5985
}
5986

    
5987
.create-vm .vm-confirm .confirm-params span.ckey {
5988
    color: #4085A5;
5989
    font-weight: bold;
5990
}
5991

    
5992
.create-vm .vm-confirm .confirm-params {
5993
    margin-bottom: 15px;
5994
}
5995

    
5996
.create-vm .vm-confirm h3.vm-name {
5997
    background-repeat: no-repeat;
5998
    background-position: left center;
5999
    font-size: 1.4em;
6000
    padding-left: 1.45em;
6001
    color: #4085A5;
6002
}
6003

    
6004
.create-vm .images-list-cont h4 a {
6005
    margin-top: 3px;
6006
    margin-right: -2px !important;
6007
}
6008
.create-vm .images-list-cont h4 a,
6009
.create-vm .list-cont h4 a {
6010
    font-size: 0.8em;
6011
    font-weight: normal;
6012
    margin-right: 5px;
6013
    float: right;
6014
    color: #FF7F2A;
6015
}
6016

    
6017
.create-vm .confirm-params {
6018
    overflow: auto;
6019
}
6020

    
6021
.create-vm .vm-confirm .ssh.confirm-params {
6022
    max-height: 150px;
6023
}
6024

    
6025
.create-vm .personalize-cont .confirm-params {
6026
    max-height: 190px;
6027
}
6028

    
6029
.create-vm .personalize-cont,
6030
.create-vm .confirm-cont {
6031
    height: 250px;
6032
}
6033

    
6034
.create-vm .create-step-cont .rename input.rename-field {
6035
    font-size: 1.4em;
6036
    padding: 5px;
6037
    width: 93%;
6038
    padding-left: 30px;
6039
    background-position: 7px center;
6040
    background-repeat: no-repeat;
6041
}
6042

    
6043
.create-vm .create-step-cont .rename label {
6044
    display: block;
6045
}
6046

    
6047
.create-vm .create-step-cont .personalize-conts,
6048
.create-vm .create-step-cont .confirm-conts {
6049
    margin-top: 20px;
6050
}
6051

    
6052
.create-vm .create-step-cont .personalize-cont,
6053
.create-vm .create-step-cont .confirm-cont {
6054
    width: 30%;
6055
    margin-right: 2%;
6056
    border-right: 1px solid #A1C8DB;
6057
    float: left;
6058
}
6059

    
6060
.create-vm .create-step-cont .confirm-cont ul li .title {
6061
    width: 55px;
6062
    float: left;
6063
}
6064

    
6065
.create-vm .create-step-cont .list-cont ul li .value {
6066
    float: right;
6067
    padding-top: 2px;
6068
    display: block;
6069
    width: 90px;
6070
    text-align: right;
6071
}
6072

    
6073
.create-vm .create-step-cont .list-cont ul li.flavor-disktype .value {
6074
    width: 45px;
6075
}
6076

    
6077
.create-vm .create-step-cont .list-cont ul li.image-description .value,
6078
.create-vm .create-step-cont .list-cont ul li.image-name .value {
6079
    float: none;
6080
    width: auto;
6081
    text-align:left;
6082
    width: auto;
6083
}
6084

    
6085
.create-vm .create-step-cont .list-cont ul li {
6086
    padding:0;
6087
    margin:0;
6088
    margin-bottom: 5px;
6089
    border-bottom: 1px solid #EEE;
6090
    padding-bottom: 7px;
6091
    margin-right: 10px;
6092
}
6093

    
6094
.create-vm .create-step-cont li.ssh-key-option .check {
6095
    float: right;
6096
    margin-right: 5px;
6097
    margin-top: 0px;
6098
}
6099

    
6100
.create-vm .create-step-cont li.ssh-key-option.selected {
6101
}
6102
.create-vm .create-step-cont li.ssh-key-option.selected:hover {
6103
    background-color: #F95;
6104
}
6105

    
6106
.create-vm .create-step-cont li.ssh-key-option:hover {
6107
    background-color: #eee;
6108
}
6109

    
6110
.create-vm .create-step-cont li.ssh-key-option.selected {
6111
}
6112

    
6113
.create-vm .create-step-cont li.ssh-key-option {
6114
    padding: 6px !important;
6115
}
6116

    
6117
.create-vm .create-step-cont .list-cont.ssh {
6118
    width: 60%;
6119
}
6120

    
6121
.create-vm .create-step-cont .list-cont.meta h4 {
6122
    margin-right: 0;
6123
}
6124

    
6125
.create-vm .create-step-cont .list-cont.meta {
6126
    margin-right:0;
6127
    border-right: none;
6128
    width: 195px;
6129
}
6130

    
6131
.create-vm .list-cont > h4 {
6132
    font-size: 1.2em;
6133
    margin-right: 10px;
6134
    border-bottom: 1px solid #A1C8DB;
6135
    padding-bottom: 5px;
6136
    color: #387693;
6137
}
6138

    
6139
.create-vm .list-cont .param.image-name {
6140
    margin-bottom: 0 !important;
6141
    border-bottom: none !important;
6142
}
6143

    
6144
.create-vm .list-cont .param h4 {
6145
    margin-bottom: 0px !important;
6146
    font-size: 1.1em !important; 
6147
}
6148

    
6149
.create-vm .list-cont .param {
6150
    margin-bottom: 7px !important;
6151
}
6152

    
6153
.create-vm .list-cont .value {
6154
    font-weight: bold;
6155
}
6156

    
6157
.create-vm .list-cont .param .value {
6158
    font-size: 0.9em;
6159
}
6160

    
6161
.create-vm .list-cont .param .title {
6162
    color: #387693;
6163
}
6164

    
6165
.create-vm .list-cont .image-description {
6166
    margin-left:0;
6167
}
6168

    
6169
.create-vm .list-cont .image-description .value {
6170
    font-weight: normal;
6171
    margin-left: 0 !important;
6172
}
6173

    
6174
.create-vm .list-cont .image-description .title {
6175
    display: none;
6176
    font-size: 0.8em;
6177
}
6178

    
6179
.create-vm .list-cont.meta .values span {
6180
    display:block;
6181
    float: left;
6182
    margin-right: 4px;
6183
    border: 1px solid #eee;
6184
    padding:3px;
6185
    margin-bottom: 4px;
6186
    font-size: 0.9em;
6187
}
6188

    
6189
.create-vm .list-cont.meta .key {
6190
    font-weight: bold;
6191
    font-size: 0.9em;
6192
    display: block;
6193
    margin-bottom: 5px;
6194
}
6195

    
6196
.create-vm .meta input {
6197
    font-size: 0.8em;
6198
}
6199

    
6200
.vm-connect .connect-cont {
6201
    margin-bottom: 20px;
6202
    border-bottom: 1px solid #A1C8DB;
6203
    padding-bottom: 20px;
6204
}
6205

    
6206
.vm-connect .connection-info {
6207
    padding-bottom: 0px;
6208
    margin-bottom: 0;
6209
    border-bottom: none;
6210
}
6211

    
6212
.vm-connect .connection-info .connect a {
6213
    color: #fff;
6214
}
6215

    
6216
.vm-connect .connection-info .connect {
6217
    background-color: #387693;
6218
    color: #fff;
6219
    padding: 10px;
6220
    font-size: 1.2em;
6221
    text-align: center;
6222
}
6223

    
6224
.clip-copy {
6225
    display: block;
6226
    width: 20px;
6227
    height: 20px;
6228
    position: absolute;
6229
    border: 1px solid #387693;
6230
    background-image: url("../images/clipboard.png");
6231
    background-repeat: no-repeat;
6232
    background-position: center;
6233
    cursor: pointer;
6234
    background-color: #A1C8DB;
6235
}
6236

    
6237
.password-cont .clip-copy { right: 10px; top: 8px;}
6238

    
6239

    
6240
.overlay-invitations {
6241
    width: 680px;
6242
}
6243
.invitations-form .sending .sending-msg {
6244
    font-size: 0.8em;
6245
    display: block !important;
6246
    margin-bottom: 5px;
6247
    color: #008800;
6248
}
6249

    
6250
.invitations-form .send-error {
6251
    font-size: 0.8em;
6252
    margin-bottom: 5px;
6253
    margin-top: 5px;
6254
    color: #800;
6255
    padding: 3px;
6256
    padding-left: 0;
6257
    display: none;
6258
}
6259

    
6260
.invitations-form .error label {
6261
    color: #000 !important;
6262
}
6263

    
6264
.invitations-form .form-field {
6265
    width: 49%;
6266
    float: left;
6267
}
6268

    
6269
.invitations-view .left.none {
6270
    background-color: #880000;
6271
}
6272

    
6273
.invitations-form {
6274
    position: relative;
6275
}
6276

    
6277
.invitations-form h3 {
6278
    float: left;
6279
}
6280

    
6281
.invitations-form .add-new-invitation {
6282
    float:left;
6283
    top:2px;
6284
    right: 20px;
6285
    width: 16px;
6286
    height: 16px;
6287
    background-image: url("../images/option-action-add.png");
6288
    background-repeat: no-repeat;
6289
    background-position: center;
6290
    text-indent: -50000em;
6291
    background-color: #4085A5;
6292
    margin-left: 15px;
6293
    cursor: pointer;
6294
}
6295

    
6296
.invitations-view .left {
6297
    font-size: 1em;
6298
    color: #fff;
6299
    font-weight: bold;
6300
    background-color: #4085A5;
6301
    padding: 4px;
6302
}
6303

    
6304
input.has-errors {
6305
    border-color: #ff0000;
6306
}
6307

    
6308
.none-left .invitations-wrapper .invitations-list {
6309
    width: 100% !important;
6310
    border-left: none !important;
6311
    padding-left: 0;
6312
}
6313

    
6314
.invitations-wrapper .invitations-list {
6315
    width: 40%;
6316
    float: left;
6317
    padding-left: 10px;
6318
    border-left: 1px solid #4085A5;
6319
    margin-left: -1px
6320
}
6321

    
6322
.invitations-wrapper .invitations-form {
6323
    width: 57%;
6324
    float: left;
6325
    border-right: 1px solid #4085A5;
6326
}
6327

    
6328
.invitations-wrapper label span {
6329
    color: #aaa;
6330
    font-size: 0.8em;
6331
}
6332

    
6333
.invitations-wrapper label {
6334
    display: block;
6335
    font-size: 0.9em;
6336
    margin-bottom:10px;
6337
    font-weight: bold;
6338
}
6339

    
6340
.invitations-view .add-new-invitation {
6341
    cursor: pointer;
6342
}
6343

    
6344
.invitations-wrapper input.name {
6345
    width: 150px;
6346
}
6347

    
6348
.invitations-wrapper input {
6349
    font-size: 0.9em;
6350
    width: 155px;
6351
    padding:4px;
6352
}
6353

    
6354
.invitations-list .invitation-sent {
6355
    border-bottom: 1px solid #A1C8DB;
6356
    padding-bottom: 5px;
6357
    margin-bottom: 5px;
6358
    position: relative;
6359
}
6360

    
6361
.invitations-view h3 {
6362
    margin-bottom: 10px;
6363
    color: #4085A5;
6364
}
6365

    
6366
.invitations-list .invitation-sent.last,
6367
.invitations-list .invitation-sent:last-child {
6368
    border-bottom: none;
6369
}
6370

    
6371

    
6372
.invitations-list .invitation-sent .email {
6373
    color: #D98147;
6374
    font-size: 0.8em;
6375
    font-weight: bold;
6376
    margin-top: 2px;
6377
}
6378

    
6379
.invitations-list .pagination a,
6380
.invitations-list .pagination span {
6381
    padding: 0.2em 0.3em;
6382
}
6383

    
6384
.invitations-list .pagination {
6385
    font-size: 0.75em;
6386
}
6387

    
6388
.invitations-list .name {
6389
    color: #444;
6390
    font-size: 0.9em;
6391
}
6392

    
6393
.invitations-list .status.sending {
6394
    background-image: url("../images/icons/indicators/small/progress.gif");
6395
}
6396

    
6397
.invitations-list .status.sent {
6398
    background-image: url("../images/invitation_accepted.png");
6399
}
6400

    
6401
.invitations-list .status.resend {
6402
    background-image: url("../images/resend.png");
6403
}
6404

    
6405
.invitations-list .status.resend {
6406
    cursor: pointer;
6407
}
6408

    
6409
.invitations-list .status {
6410
    width: 20px;
6411
    height: 15px;
6412
    position: absolute;
6413
    top:5px;
6414
    right: 2px;
6415
    background-repeat: no-repeat;
6416
    background-position: center;
6417
}
6418

    
6419
.invitations-form .form-entry:last-child {
6420
    border-bottom: none;
6421
}
6422

    
6423
.invitations-form .form-entry {
6424
    position: relative;
6425
    margin-bottom: 10px;
6426
    padding-bottom: 10px;
6427
    border-bottom: 1px solid #ddd;
6428
    margin-right: 10px;
6429
}
6430

    
6431
.invitations-form .send-invitations {
6432
    float: left;
6433
    padding: 5px;
6434
    color: #fff;
6435
    margin-right: 10px;
6436
    margin-top: 10px;
6437
}
6438

    
6439
.invitations-form .form-entry.error {
6440
    padding-bottom: 0px;
6441
}
6442

    
6443
.invitations-form .form-entry.error .remove-invitation {
6444
    bottom: 32px;
6445
}
6446

    
6447
.invitations-form .remove-invitation {
6448
    padding: 5px;
6449
    background-image: url("../images/option-action-remove.png");
6450
    background-position: center;
6451
    background-repeat: no-repeat;
6452
    color: #fff;
6453
    width: 15px;
6454
    height: 15px;
6455
    cursor: pointer;
6456
    text-indent: -50000px;
6457
    position: absolute;
6458
    right: -10px;
6459
    bottom: 14px;
6460
}
6461

    
6462
.invitations-list .resent-info,
6463
.invitations-form .top-info {
6464
    font-size: 0.8em;
6465
    margin-bottom: 10px;
6466
}
6467

    
6468
.invitations-list .msg .email,
6469
.invitations-form .success .msg .email {
6470
    font-weight: bold;
6471
}
6472

    
6473
.invitations-list .msg.err-msg,
6474
.invitations-list .success.msg,
6475
.invitations-form .success .msg {
6476
    background-color: #080;
6477
    color: white;
6478
    padding: 5px;
6479
    margin-right: 10px;
6480
    margin-bottom: 5px;
6481
}
6482
.invitations-list .msg.err-msg,
6483
.invitations-list .success.msg {
6484
    margin-right: 0px;
6485
}
6486
.invitations-list .msg.err-msg {
6487
    background-color: #800;
6488
}
6489

    
6490
.overlay .models-view .previous-view-link {
6491
    margin: -10px;
6492
    margin-bottom:10px;
6493
    padding: 10px 5px;
6494
    background-image: url("../images/left-arrow.png");
6495
    background-repeat: no-repeat;
6496
    background-position: 10px center;
6497
    padding-left: 20px;
6498
    background-color: #93D070;
6499
    cursor: pointer;
6500
    border-bottom: 1px solid #eee;
6501
    text-decoration: underline;
6502
}
6503
.models-view .quick-add {
6504
    text-decoration: underline; 
6505
    color: #4085A5;
6506
    cursor: pointer;
6507
}
6508

    
6509
.empty .items-list {
6510
    margin-top: 0 !important;
6511
}
6512

    
6513
.models-view .items-empty-msg {
6514
    border-top: 1px solid #aaa;
6515
    padding-top: 10px;
6516
    font-size: 1em;
6517
    margin-top:0 !important;
6518
}
6519

    
6520
.models-view .items-empty-msg,
6521
.models-view .model-description {
6522
    color: #444;
6523
    margin: 10px 0;
6524
}
6525

    
6526
.models-view .model-list .collection-action.disabled {
6527
    background-color: #aaa;
6528
    border-color: #aaa;
6529
    cursor: default;
6530
}
6531
.models-view .model-list .collection-action.disabled:hover {
6532
    background-color: #aaa;
6533
    border-color: #aaa;
6534
}
6535

    
6536
.models-view .model-list .collection-action:hover {
6537
    background-color: #aaa;
6538
}
6539

    
6540
.models-view .model-list .collection-action:hover {
6541
    background-color: #F95;
6542
    border-color: #F95;
6543
}
6544

    
6545
.models-view .model-list .collection-action.in-progress {
6546
    background-color: #aaa;
6547
    color: #fff;
6548
    border-color: #aaa;
6549
    background-image: url("../images/icons/indicators/small/progress.gif") !important;
6550
}
6551

    
6552
.models-view .model-list .collection-action.add-generate {
6553
    background-image: url("../images/option-action-generate-ssh.png");
6554
}
6555

    
6556
.models-view .model-list .collection-action.add {
6557
    background-image: url("../images/option-action-add.png");
6558
    padding-right: 20px !important;
6559
}
6560

    
6561
.models-view .model-list .collection-action {
6562
    float: right;
6563
    background-color: #FF7F2A;
6564
    color: #fff;
6565
    padding: 6px 8px;
6566
    margin-left: 10px;
6567
    cursor: pointer;
6568
    padding-right: 30px;
6569
    background-position: right center;
6570
    background-repeat: no-repeat;
6571
    background-clip: border-box;
6572
    border-right: 5px solid #FF7F2A;
6573
}
6574

    
6575
.models-view .items-list {
6576
    margin-top: 10px;
6577
}
6578

    
6579
.models-view .model-list ul li.model-item:last-child {
6580
    margin-bottom: 0;
6581
}
6582

    
6583
.models-view .model-list ul li.model-item {
6584
    background-color: #D4E2E8;
6585
    margin-bottom: 5px;
6586
    position: relative;
6587
}
6588

    
6589
.models-view .model-list ul li.model-item .param {
6590
    float: left;
6591
    padding: 6px;
6592
}
6593

    
6594
.models-view .model-list ul li.model-item .item-action.confirm-remove {
6595
    margin-right: -15px !important;
6596
}
6597

    
6598
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover .cancel {
6599
    color: inherit !important;
6600
}
6601

    
6602
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover {
6603
    background-color: #F95;
6604
    color: inherit !important;
6605
}
6606

    
6607
.models-view .model-list ul li.model-item .item-action.confirm-remove span.cancel {
6608
    padding: 6px !important;
6609
}
6610

    
6611
.models-view .model-list ul li.model-item .item-action.confirm-remove span {
6612
    display: block;
6613
    float: left;
6614
    padding: 6px 15px;
6615
}
6616

    
6617
.models-view .model-list ul li.model-item .item-action .cancel-remove:hover {
6618
    color: #fff !important;
6619
}
6620

    
6621
.models-view .model-list ul li.model-item .item-action.confirm-remove,
6622
.models-view .model-list ul li.model-item .item-action .do-confirm,
6623
.models-view .model-list ul li.model-item .item-action .cancel-remove {
6624
    display:none !important;
6625
    background-color: #D95D0A;
6626
    padding:0;
6627
    margin:0;
6628
}
6629

    
6630
.models-view .model-list ul li.model-item.pending-delete .item-action.remove {
6631
    display: none;
6632
}
6633

    
6634
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel {
6635
    background-color: #F95;
6636
}
6637

    
6638
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm {
6639
    background-color: #FF7F2A;
6640
}
6641

    
6642
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove,
6643
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove .do-confirm,
6644
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel-remove {
6645
    display:block !important;
6646
}
6647

    
6648
.models-view .model-list ul li.model-item.pending-delete .item-action {
6649
    display: block;
6650
}
6651

    
6652
.models-view .model-list ul li.model-item.expanded .item-action,
6653
.models-view .model-list ul li.model-item:hover .item-action {
6654
    display: block;
6655
}
6656

    
6657
.models-view .model-list ul li.model-item .item-action.hide {
6658
    background-image: url("../images/minus-8.png");
6659
}
6660
.models-view .model-list ul li.model-item .item-action.show:hover {
6661
    background-image: url("../images/plus-8.png");
6662
}
6663

    
6664
.models-view .model-list ul li.model-item .item-action.show {
6665
    background-image: url("../images/plus-8-dark.png");
6666
}
6667

    
6668
.models-view .model-list ul li.model-item .item-action.remove {
6669
    background-image: url("../images/option-action-remove.png");
6670
}
6671

    
6672
.models-view .model-list ul li.model-item .item-action.edit:hover {
6673
    background-image: url("../images/option-action-edit-light.png");
6674
}
6675

    
6676
.models-view .model-list ul li.model-item .item-action.edit {
6677
    background-image: url("../images/option-action-edit.png");
6678
}
6679
.models-view .model-list ul li.model-item .item-action.remove:hover {
6680
    background-color: #880000 !important;
6681
    border-color: #800 !important;
6682
}
6683

    
6684
.models-view .model-list ul li.model-item.expanded .item-action.show,
6685
.models-view .model-list ul li.model-item.expanded .item-action.hide,
6686
.models-view .model-list ul li .item-actions .item-action:hover {
6687
    background-color: #4085A5;
6688
    color: #fff;
6689
    border-color: #4085A5;
6690
}
6691

    
6692
.models-view .model-list ul li .item-actions {
6693
    position: absolute;
6694
    right: -10px;
6695
    top: 0px;
6696
}
6697

    
6698
.models-view .model-list ul li .item-actions .item-action {
6699
    float: right;
6700
    padding: 6px;
6701
    margin-right: 10px;
6702
    display: none;
6703
    cursor: pointer;
6704
    padding-right: 20px;
6705
    background-repeat: no-repeat;
6706
    background-position: right center;
6707
    border-right: 5px solid transparent;
6708
}
6709

    
6710
.models-view .model-list h3 {
6711
    float: left;
6712
}
6713

    
6714
.models-view h3 {
6715
    font-size: 1.2em;
6716
    margin-bottom: 1em;
6717
    margin-top: 5px;
6718
    color: #4085A5;
6719
}
6720

    
6721
.models-view .form-actions {
6722
    font-size: 1.1em;
6723
}
6724

    
6725
.models-view .model-list ul li,
6726
.models-view .model-list ul {
6727
    list-style: none;
6728
}
6729

    
6730
.models-view .model-list ul li.header {
6731
    display: none;
6732
}
6733

    
6734
.models-view .model-form textarea {
6735
    width: 99%;
6736
    height: 100px;
6737
    border: 1px solid #aaa;
6738
}
6739

    
6740

    
6741
.models-view .model-form .form-field {
6742
    margin-bottom: 10px;
6743
}
6744

    
6745
.models-view .model-form label {
6746
    display: block;
6747
    color: #406A7D;
6748
    font-size: 1.1em;
6749
    margin: 0px 0 5px 0;
6750
}
6751

    
6752
.models-view .model-form .inline label {
6753
    float: left;
6754
    margin-right: 10px;
6755
    margin-top: 10px !important;
6756
}
6757

    
6758
.models-view .model-form input.long {
6759
    width: 400px;
6760
}
6761

    
6762
.models-view .model-form .inline input {
6763
    width: auto;
6764
    margin-top: 10px;
6765
}
6766

    
6767
.models-view .model-form .inline select {
6768
    width: auto;
6769
    margin-top: 7px;
6770
}
6771

    
6772
.models-view .model-form .inline .errors,
6773
.models-view .model-form .inline .field-desc {
6774
    clear: both;
6775
}
6776

    
6777
#user_public_keys .private-download {
6778
    margin: 5px 0;
6779
    margin-top: 6px;
6780
}
6781

    
6782
#user_public_keys .private-cont form {
6783
    float: left;
6784
    margin-left: 5px;
6785
}
6786

    
6787
#user_public_keys input.form-text:hover {
6788
    background: #F95;
6789
}
6790

    
6791
#user_public_keys input.form-text {
6792
    background: #FF7F2A;
6793
    color: #fff;
6794
    border: 1px solid #F95;
6795
    padding: 0 5px;
6796
    margin: 0 5px;
6797
    margin-top: -1px;
6798
    cursor: pointer;
6799
}
6800

    
6801
#user_public_keys .form-text {
6802
    float: left;
6803
}
6804

    
6805
#user_custom_images,
6806
#user_public_keys {
6807
    font-size: 0.7em;
6808
}
6809

    
6810
#user_public_keys .download-button {
6811
    width: 30px;
6812
    height: 30px;
6813
}
6814

    
6815

    
6816
#user_public_keys #model-item-tpl {
6817
    display: none;
6818
}
6819
#user_public_keys .model-item .name {
6820
    color: #4085A5;
6821
    font-size: 1.2em;
6822
}
6823

    
6824
#user_public_keys .model-item .fingerprint .flabel {
6825
    color: #888;
6826
    float: left;
6827
    margin-right: 5px;
6828
}
6829

    
6830
#user_public_keys .model-item .fingerprint {
6831
    float: none;
6832
    clear: both;
6833
    color: #444;
6834
    font-family: monospace;
6835
    letter-spacing: 1px;
6836
    padding: 4px;
6837
    font-size: 0.9em;
6838
    border-top: 1px solid #fff;
6839
}
6840

    
6841
#user_public_keys .model-item .publicid {
6842
    display: none;
6843
}
6844

    
6845
#user_public_keys .model-item.expanded .publicid .param-content {
6846
    padding: 5px 5px;
6847
    overflow: auto;
6848
    background-color: #FFF;
6849
    border: 1px solid #4085A5;
6850
    border-left: none;
6851
    border-right: none;
6852
    font-size: 1.1em;
6853
}
6854

    
6855
#user_public_keys .model-item.expanded .publicid .param-content textarea {
6856
    width: 100%;
6857
    height: 90px;
6858
    margin:0;
6859
    padding:0;
6860
    border:none;
6861
    overflow: auto;
6862
}
6863

    
6864
#user_public_keys .model-item.expanded .publicid {
6865
    display: block;
6866
    background-color: #fff;
6867
    width: 100%;
6868
    margin-top: 0px;
6869
    margin-left: 0px;
6870
    color: #fff;
6871
    padding:0 !important;
6872
}
6873

    
6874
.models-view .form-messages {
6875
    margin-bottom: 10px;
6876
}
6877

    
6878
.models-view .list-messages {
6879
    margin-top: 10px;
6880
}
6881

    
6882
.models-view .form-messages .error,
6883
.models-view .form-messages .success,
6884
.models-view .list-messages .error,
6885
.models-view .list-messages .success,
6886
#user_public_keys .private-cont {
6887
    background-color: #AADE87;
6888
    color: #447821;
6889
    padding: 5px;
6890
    border: 1px solid #447821;
6891
    font-size: 1.1em;
6892
    margin-top: 5px;
6893
}
6894

    
6895
.models-view .form-messages .error,
6896
.models-view .list-messages .error {
6897
    background-color: #DE8D87;
6898
    color:  #782421 !important;
6899
    border-color: #782421;
6900
}
6901

    
6902
#user_public_keys .limit-msg {
6903
    color: #800;
6904
    position: absolute;
6905
    right: 20px;
6906
    top: 25px;
6907
}
6908

    
6909
#user_public_keys .private-cont {
6910
    margin-top: 10px;
6911
}
6912

    
6913
#user_public_keys .private-cont .private-msg {
6914
    float: left;
6915
    padding:5px;
6916
    margin-top: 5px;
6917
}
6918

    
6919
#user_public_keys .private-cont textarea {
6920
    margin: 5px;
6921
    width: 97%;
6922
    height: 200px;
6923
}
6924

    
6925
#user_public_keys .private-cont .close-private:hover {
6926
    color: #Fff;
6927
}
6928

    
6929
#user_public_keys .private-cont .close-private {
6930
    float: right;
6931
    margin-right: 5px;
6932
    font-weight: bold;
6933
    cursor: pointer;
6934
    text-decoration: underline;
6935
}
6936

    
6937
#user_public_keys .model-item .key-type {
6938
    background-color: #72ADC8;
6939
    color: #fff;
6940
    text-align: center;
6941
    font-size: 0.9em;
6942
    padding:2px 10px;
6943
    margin: 4px 6px;
6944
    margin-top: 7px;
6945
    font-weight: bold;
6946
}
6947

    
6948
#user_public_keys .private-cont .down-button {
6949
}
6950

    
6951
.models-view .form-field .field-desc {
6952
    font-style: italic;
6953
    font-size: 1em;
6954
    color: #888;
6955
}
6956

    
6957
.models-view .form-field.error label {
6958
    font-weight: bold;
6959
    color: #800 !important;
6960
}
6961

    
6962
.models-view .form-field .errors {
6963
    margin: 5px 0;
6964
}
6965

    
6966
.models-view .form-field .errors .error {
6967
    background-color: transparent;
6968
    border: none;
6969
    color: #800;
6970
}
6971

    
6972
.single .suspended-notice {
6973
  right: 180px;
6974
  top: 0px;
6975
  padding: 7px;
6976
  padding-bottom: 6px;
6977
}
6978

    
6979
.icon .suspended-notice {
6980
  right: 192px;
6981
  top: 50px;
6982
}
6983

    
6984
.suspended-notice {
6985
  display: inline-block;
6986
  padding: 4px;
6987
  background-color: #8f1915;
6988
  cursor: pointer;
6989
  position: absolute;
6990
  color: #fff;
6991
  font-size: 0.6em;
6992
  display: none;
6993
}
6994

    
6995
.suspended .suspended-notice {
6996
  display: block;
6997
}
6998

    
6999
.suspended .action-indicator {
7000
  display: none !important;
7001
}