Statistics
| Branch: | Tag: | Revision:

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

History | View | Annotate | Download (128.7 kB)

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

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

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

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

    
35
h4.error .title {
36
  color: red !important;
37
}
38
#okeanos-image {
39
    position: absolute;
40
    bottom: -0px;
41
    right: 0;
42
    z-index:0;
43
}
44

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

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

    
63
#content {
64
    padding-bottom: 10px;
65
    width: 100%;
66
}
67

    
68
div#wrapper {
69
    width: 700px;
70
    margin: 0em auto;
71
    text-align: left;
72
}
73

    
74
#footer a {
75
    color: #fff;
76
}
77

    
78
#footer .software .version {
79
    font-weight: bold;
80
}
81

    
82
#footer .software {
83
    font-size: 0.6em;
84
    margin-top: 7px;
85
    color: #fff;
86
}
87

    
88
#footer {
89
    height: 80px;
90
    background-color: #4085A5;
91
    width:100%;
92
}
93

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

    
101
#footer div.grnet-sign {
102
    margin-top:10px;
103
}
104

    
105
#footer div.grnet-sign a{
106
    color: #72ADC8;
107
}
108

    
109
#footer div.grnet-sign a:hover {
110
    color: #FFFFFF;
111
}
112

    
113
ol, ul {
114
    list-style: none;
115
}
116

    
117
blockquote, q {
118
    quotes: none;
119
}
120

    
121
blockquote:before, blockquote:after,
122
q:before, q:after {
123
    content: '';
124
    content: none;
125
}
126

    
127
/* remember to define focus styles! */
128
:focus {
129
    outline: 1px dotted #87AADE;
130
}
131

    
132
/* remember to highlight inserts somehow! */
133
ins {
134
    text-decoration: none;
135
}
136

    
137
del {
138
    text-decoration: line-through;
139
}
140

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

    
147
h5 {
148
    font-weight: normal;
149
    margin-bottom:3px;
150
}
151

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

    
159
.create-container a {
160
    font-family: 'Open Sans', sans-serif;
161
}
162

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

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

    
183
ul.css-tabs {
184
    padding: 0;
185
    height:31px;
186
    background-color: #5CA1C0;
187
}
188

    
189
ul.css-tabs .secondary {
190
    position:relative;
191
}
192

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

    
200
ul.css-tabs .current {
201
    background: #4085A5;
202
}
203

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

    
216
ul.css-tabs a:hover {
217
    background: #74AEC9;
218
}
219

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

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

    
234
.css-panes > div.pane {
235
    display:none;
236
}
237

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

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

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

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

    
279
#beforecreate {
280
    background-color: #FF9955;
281
    height: 32px;
282
    width: 13px;
283
}
284

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

    
292
#machines-pane-top.empty {
293
    background: transparent;
294
}
295

    
296
#beforecreate {
297
    border-left: 16px solid #efefef;
298
    margin-left: -16px;
299
}
300

    
301
.create-container {
302
    line-height: 4em;
303
}
304

    
305
#createcontainer a {
306
}
307

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

    
316
#create:hover {
317
    background-color: #FF9955;
318
}
319

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

    
326
.header-logo {
327
    padding-top: 28px;
328
}
329

    
330
.header-logo img {
331
    max-width:100%;
332
    max-height:64px;
333
}
334

    
335
div#footer-text a {
336
    color: #FFFFFF;
337
    text-decoration: none;
338
}
339

    
340
div#footer-text{
341
    color: #FFFFFF;
342
    font-size: 75%;
343
    padding-top: 10px;
344
}
345

    
346
#footer-bg {
347
    background: url("../images/footer-bg.png") no-repeat scroll 0 0 #4085A5;
348
    background-position:right;
349
}
350

    
351
.modal {
352
    background-color:#fff;
353
    display:none;
354
    width:30em;
355
    padding:1em;
356
    text-align:left;
357
}
358

    
359
/* server wizard scrollable root element and network wizard */
360
#wizard, #networks-wizard {
361
    font-size:75%;
362
    height:425px;
363
    width:453px;
364
    overflow:hidden;
365
    position:absolute !important;
366
}
367

    
368
/* scrollable items */
369
#wizard .items {
370
    width:20000em;
371
    clear:both;
372
    position:absolute;
373
    display:block;
374
    padding: 0;
375
    margin: 0;
376
    border:none;
377
    background:none;
378
}
379

    
380
/* single item */
381
#wizard .page, #networks-wizard div.container {
382
    padding: 0px 40px 20px 15px;
383
    width:447px;
384
    float:left;
385
    display:block;
386
    border:none;
387
    background-color: transparent;
388
}
389

    
390
#networks-wizard div.container {
391
    background-color: #ECF4F8;
392
    width:400px;
393
    height: 180px;
394
    margin-bottom:50px;
395
}
396

    
397
/* title */
398
#wizard h2, #networks-wizard h2 {
399
    color: #FF7B24;
400
    font-size: 100%;
401
    font-style: italic;
402
    font-weight: bold;
403
    margin-left: 37px;
404
    margin-top: 17px;
405
}
406

    
407
#networks-wizard h2 {
408
    margin-top: 15px;
409
}
410

    
411
#wizard li {
412
    margin-bottom:1.2em;
413
}
414

    
415
#wizard .pane li {
416
    margin: 0;
417
}
418

    
419
#wizard label {
420
    font-size:120%;
421
    display:block;
422
    clear: both;
423
}
424

    
425
#wizard label strong {
426
    position:relative;
427
    top:-1px;
428
    font-size: 80%;
429
    font-weight: normal;
430
}
431

    
432
#wizard label em {
433
    font-size:75%;
434
    color:#666;
435
    font-style:normal;
436
}
437

    
438
#wizard .text {
439
    width: 270px;
440
    padding: 5px;
441
    margin-top: 10px;
442
    border: 1px solid #ccc;
443
    color: #456;
444
    letter-spacing: 1px;
445
}
446

    
447
#wizard select {
448
    border:1px solid #ccc;
449
    width:94%;
450
    padding:4px;
451
    display: none;
452
}
453

    
454
#wizard .double label {
455
    width:50%;
456
    float:left;
457
}
458

    
459
#wizard .double .text {
460
    width:93%;
461
}
462

    
463
#wizard .clearfix {
464
    clear:left;
465
    padding-top:10px;
466
}
467

    
468
#wizard .right {
469
    float:right;
470
}
471

    
472
#wizard .error {
473
    border:1px solid red;
474
}
475

    
476
#wizard a:hover div.image {
477
    background-color: #C5DEE9;
478
}
479

    
480
.selecteddiv {
481
    background-color: #C5DEE9 !important;
482
}
483

    
484
#wizard label a:hover strong {
485
    color: black;
486
}
487

    
488
#wizard div.image span.size {
489
    font-size: 75%;
490
    color: #666;
491
}
492

    
493
#wizard div.image .radio {
494
    float: left;
495
    margin-top: 10px;
496
}
497

    
498
#wizard div.image span.image-id, #wizard div.image span.description {
499
    font-size: 75%;
500
    color: #666;
501
    font-weight: normal;
502
    display:inline;
503
}
504

    
505
#wizard a:hover div.image span.image-id, #wizard a:hover div.image span.description, #wizard a:hover div.image span.size {
506
    color: black;
507
}
508

    
509
#wizard .cost {
510
    color: #79A4C1;
511
    margin-top: 40px;
512
    clear:both;
513
    margin-left: 15px;
514
    font-size: 95%;
515
}
516

    
517
#wizard #status {
518
    height: 50px;
519
    background-color: #4085A5;
520
}
521

    
522
#wizard .headernumber {
523
    font-size: 410%;
524
}
525

    
526
#wizard .headerbody {
527
    font-size: 120%;
528
    font-weight: normal;
529
    display: inline;
530
    top: -15px;
531
    position: relative;
532
}
533

    
534
#wizard .first {
535
    left: -10px;
536
}
537

    
538
#wizard .checked {
539
    color: #64a6c4 !important;
540
}
541

    
542
#wizard .li-2 {
543
    margin-top: -1px !important;
544
}
545

    
546
#wizard .img-check {
547
    margin-bottom: 8px;
548
    margin-left: -8px;
549
}
550

    
551
#wizard .li-1 .img-check {
552
    margin-left: 2px;
553
}
554

    
555
#wizard .topruler, #networks-wizard .topruler, #wizard .bottomruler, #networks-wizard .bottomruler {
556
    background-color: #CDE2EC;
557
    color: #CDE2EC;
558
    border: 0 none;
559
    height: 4px;
560
    margin-left: -1px;
561
    width: 447px;
562
    margin-bottom: 6px;
563
    margin-top: 4px;
564
}
565

    
566
#wizard .bottomruler, #networks-wizard .bottomruler {
567
    margin-top:6px;
568
}
569

    
570
#networks-wizard .topruler, #networks-wizard .bottomruler {
571
    width: 455px;
572
    float: left;
573
}
574

    
575
#wizard #cancel, #networks-wizard .cancel {
576
    background-color: #4085A5;
577
    border-color: #4085A5;
578
    text-align: center !important;
579
}
580

    
581
#wizard #cancel:hover, #networks-wizard .cancel:hover {
582
    background-color: #7DB4CD;
583
    border-color: #7DB4CD;
584
}
585

    
586
#wizard #start, #networks-wizard .create {
587
    text-align: center;
588
    background-color: #FF7F2A;
589
    border-color: #FF7F2A;
590
}
591

    
592
:focus {
593
    outline: none;
594
    -moz-outline-style: none;
595
}
596

    
597
#wizard .img-next {
598
    margin: 0 -4px -1px 8px;
599
}
600

    
601
#wizard .img-prev {
602
    margin: 0 8px -1px -4px;
603
}
604

    
605
#networks-wizard .create {
606
    float:right;
607
    width: 140px;
608
}
609

    
610
.overlay-networks-create .form-action {
611
  float: left;
612
}
613

    
614
.overlay-networks-create .fixpos {
615
  margin-top: 3px;
616
}
617

    
618
.overlay-networks-create .col-fields.bordered {
619
  border-bottom: 1px solid #CCC;
620
  margin-bottom: 10px;
621
  padding-bottom: 10px;
622
}
623

    
624
.overlay-networks-create .col-fields {
625
  margin-bottom: 10px;
626
}
627

    
628
form .fields-desc {
629
  font-size: 0.8em !important; 
630
  margin: 5px 0;
631
  padding-bottom: 0 !important;
632
}
633

    
634
.overlay-networks-create form select {
635
  padding: 1px;
636
}
637

    
638
.overlay-networks-create #network-create-subnet-custom {
639
  width: 125px;
640
}
641

    
642
.overlay-networks-create .col-fields .form-field {
643
  float: left;
644
  margin-right: 20px;
645
}
646

    
647
.overlay-networks-create .col-fields .right-field {
648
  float: right;
649
  width: 210px;
650
  margin-right: 0px;
651
}
652

    
653
.overlay-networks-create .use-dhcp {
654
  width: auto;
655
}
656

    
657
#wizard #start:hover, #networks-wizard .create:hover {
658
    background-color: #FF9651;
659
    border-color: #FF9651;
660
}
661

    
662
#wizard .separator-end {
663
    position: absolute;
664
    background-color: #387693;
665
    height: 5px;
666
    margin-left: -14px;
667
    margin-top: 382px;
668
    width: 550px;
669
}
670

    
671
.page ul {
672
    height: 270px;
673
    overflow: auto;
674
}
675

    
676
.panes ul.pane {
677
    height: 220px;
678
}
679

    
680
#wizard #tabscontainer {
681
    background-color: #CDE2EC;
682
    height: 20px;
683
    width: 448px;
684
}
685

    
686
.page ul.tabs {
687
    overflow: hidden;
688
    height: auto;
689
    margin-bottom: -1px;
690
    margin-top: -1px;
691
}
692

    
693
.page ul.tabs li {
694
    float: right;
695
    margin: 0 0.2em;
696
}
697

    
698
#status li {
699
    float: left;
700
    color: #387693;
701
    padding: 0 1px 0 37px;
702
    bottom: 0px;
703
}
704

    
705
#status li.active .headernumber {
706
    color: #FFFFFF;
707
}
708

    
709
#status li.active .headerbody {
710
    color: #FFFFFF;
711
}
712

    
713
div.image-container {
714
    border-bottom: 1px solid #CCCCCC;
715
    margin-left: 10px;
716
    margin-right: 10px;
717
}
718

    
719
#page2-container {
720
    background-color: #ECF4F8;
721
    height: 193px;
722
    margin-top: 3px;
723
    padding-top: 25px;
724
}
725

    
726
#page3-container {
727
    background-color: #ECF4F8;
728
    height: 245px;
729
    margin-bottom: 32px;
730
    padding-left: 50px;
731
}
732

    
733
/* slider root element */
734
.slider {
735
    border: 1px solid #666;
736
    cursor: pointer;
737
    display: inline !important;
738
    float: left;
739
    margin: 5px 0 20px 10px;
740
    position: relative;
741
    width: 250px;
742
}
743

    
744
.sliders {
745
    float:left;
746
    width: 40px;
747
    margin-left: 10px;
748
    margin-top: 3px;
749
}
750

    
751
.units {
752
    padding-left:10px;
753
}
754

    
755
.slider-container {
756
    padding-bottom: 15px;
757
    margin-left: 5px;
758
}
759

    
760
/* drag handle */
761
.handle {
762
    -moz-box-shadow: 0 0 2px #000000;
763
    background: url("../images/h30.png") repeat-x scroll 0 0 #FFFFFF;
764
    border: 1px solid #000000;
765
    cursor: move;
766
    display: block;
767
    height: 10px;
768
    margin-top: -8px;
769
    position: absolute;
770
    width: 8px;
771
}
772

    
773
/* progress bar (enabled with progress: true) */
774
.progress {
775
    height: 3px;
776
    background-color: #387693;
777
}
778

    
779
/* the input field */
780
.range {
781
    border: 1px solid #387693;
782
    float: left;
783
    font-size: 100%;
784
    margin: -3px 0 0 15px;
785
    padding: 2px 5px 2px 0;
786
    text-align: right;
787
    width: 50px;
788
}
789

    
790
.selectedrange {
791
    border-color: #5599FF;
792
}
793

    
794
#credits-indicator {
795
    background-color: #ECF4F8;
796
    float: none;
797
    margin: 0 0 0 10px;
798
    border: 1px solid #387693;
799
    color: #387693;
800
}
801

    
802
/* machines */
803
.machine-container {
804
    position:relative;
805
}
806

    
807
.icon .machine-container.last .machine-data-cont, .machine-container:last-child .machine-data-cont {
808
    margin-bottom:0;
809
    padding-bottom: 0;
810
    border-bottom: none;
811
}
812

    
813
.icon .machine-container.last .machine-data, .machine-container:last-child .machine-data {
814
    border-bottom: none;
815
}
816

    
817
.icon .machine-container .subtitle {
818
    font-size: 0.70em;
819
    color: #222;
820
    line-height: 23px;
821
    height: 23px;
822
    margin-top: -5px;
823
}
824

    
825
.icon .machine-container .subtitle {
826
    
827
}
828

    
829
.icon .machine-container .info {
830
    margin-top: 2px;
831
    height: 17px;
832
}
833

    
834
.icon .machine-container .building-progress {
835
    vertical-align: top;
836
}
837

    
838
.icon .build-progress {
839
    margin-left: -3px;
840
}
841

    
842
#machinesview .build-progress .message {
843
  padding: 3px;
844
}
845

    
846
#machinesview .build-progress .btn:hover {
847
  background-color: #387693;
848
}
849

    
850
#machinesview .column1 .build-progress .btn {
851
    margin-top: 5px;
852
    display: inline-block;
853
}
854

    
855
#machinesview .build-progress .btn {
856
    cursor: pointer;
857
    background-color: #5e1616;
858
    color: #FFF;
859
    padding: 3px;
860
}
861

    
862
.ip-version-label {
863
    font-size: 0.8em;
864
    padding: 0.3em;
865
    background-color: #C4DDE9;
866
    color: #000;
867
}
868

    
869
.icon .machine-data {
870
    width: 520px;
871
    float: left;
872
    background-color: transparent;
873
}
874

    
875
.icon .machine-info {
876
    padding: 10px 0;
877
}
878

    
879
.icon .machine-details .name {
880
    height: 24px;
881
}
882

    
883
.icon .machine-connect {
884
    width: 80px;
885
    float: left;
886
}
887

    
888
.icon .machine-details {
889
    width: 310px;
890
    float: left;
891
    margin-top: -5px;
892
}
893

    
894
.icon .state {
895
    font-size: 98%;
896
    width: 120px;
897
    margin-right: 10px;
898
    float: left;
899
    height: 55px;
900
    margin-top: -5px;
901
}
902

    
903
.vm-actions {
904
    position: relative;
905
}
906

    
907
.icon .vm-actions {
908
    /*display: none;*/
909
}
910

    
911
.icon .vm-actions, .network .vm-actions {
912
    width: 180px;
913
    height: 76px;
914
    float: left;
915
}
916

    
917
.network .vm-actions {
918
    width: 185px;
919
}
920

    
921
.icon .machine-container:hover .machine-data {
922
    background-color:#A1C8DB !important;
923
}
924

    
925
.icon .machine-container:hover .vm-actions {
926
    display: block;
927
}
928

    
929
.vm-actions {
930
    font-size: 75%;
931
}
932

    
933
.vm-actions a {
934
    color: black;
935
    height: 15px;
936
    margin: 0 0 1px 4px;
937
    padding: 1px;
938
    padding-left: 8px;
939
    display: block;
940
}
941

    
942
.vm-actions a:hover {
943
    background-color:#A1C8DB;
944
    color: #fff;
945
    border-left: 4px solid #7DB4CD;
946
    padding-left: 4px;
947
}
948

    
949
.vm-actions a.selected {
950
    color: #FF7F2A !important;
951
}
952

    
953
.vm-actions a.selected {
954
    background-color:transparent;
955
}
956

    
957
.vm-actions .action-container {
958
    position: relative;
959
}
960

    
961
.vm-actions .action-container .confirm_single {
962
    position: absolute;
963
    right: -20px;
964
    top: -2px;
965
}
966

    
967
div.list div.actions a.enabled.destroy {
968
}
969

    
970
.vm-actions .action-container.destroy {
971
    position: absolute;
972
    bottom: -1px;
973
    width: 100%;
974
    left: 0px;
975
    background: transparent;
976
}
977

    
978
.vm-actions .action-container.destroy a {
979
}
980

    
981
.icon .light-background .machine-data, div.network.light-background, div.network.expand {
982
    background-color:#aed2e3 !important;
983
}
984

    
985
.single .light-background {
986
    background-color:#aed2e3;
987
}
988

    
989
.icon .machine-data-cont {
990
    margin-bottom: 5px;
991
    padding-bottom: 5px;
992
    border-bottom: 1px solid #D1E7F0;
993
    width: 520px;
994
    float: left;
995
}
996
.icon .terminated .machine-data-cont {
997
    border-color: #B6CED6;
998
}
999

    
1000
.machine a {
1001
    font-weight: normal;
1002
    text-decoration: none;
1003
}
1004

    
1005
.machine span.name, .machine span.ip {
1006
    font-size: 75%;
1007
    color: black;
1008
    margin-top: 6px;
1009
}
1010

    
1011
.machine span.name {
1012
    font-weight: bold;
1013
}
1014

    
1015
.oldValue {
1016
    display:none;
1017
}
1018

    
1019
.state {
1020
}
1021

    
1022
.state div {
1023
    text-align: right;
1024
    margin-right: 3px;
1025
}
1026

    
1027
/* icon view actions */
1028
div.machine div.actions a.shutdown-padding {
1029
    margin-bottom: 22px;
1030
}
1031

    
1032
div.actions a.enabled:hover{
1033
    color: black !important;
1034
    text-decoration: underline;
1035
    display: block;
1036
}
1037

    
1038
div.machine:hover .actions a {
1039
    visibility: visible;
1040
}
1041

    
1042
div.machine div.display a{
1043
    visibility: visible;
1044
}
1045

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

    
1050
div.single-container div.vm-actions .disabled {
1051
    display: none;
1052
}
1053

    
1054
div.machine div.actions .disabled {
1055
    display: none;
1056
}
1057

    
1058
div.connect-arrow {
1059
    background: url("../images/connect-arrow.png") no-repeat;
1060
    height: 28px;
1061
    width:14px;
1062
    position: absolute;
1063
    display: none;
1064
}
1065

    
1066
.machine div.connect-arrow {
1067
    display: none;
1068
    left: -3px;
1069
    position: absolute;
1070
    top: 9px;
1071
}
1072

    
1073
div.connect-arrow:hover, div.connect-arrow.border-hover, div.connect-arrow-ie, div.connect-arrow.border-ie {
1074
    cursor: pointer;
1075
    background: url("../images/connect-arrow-hover.png") no-repeat;
1076
    height: 28px;
1077
    width:26px;
1078
}
1079

    
1080
div.connect-border {
1081
    opacity: 0.8;
1082
    filter: alpha(opacity = 80);
1083
    background-color:#4fe0c3;
1084
    height:28px;
1085
    width: 12px;
1086
    position: absolute;
1087
    display: none;
1088
}
1089

    
1090
div.connect-border:hover {
1091
    cursor: pointer;
1092
}
1093

    
1094
.machine div.connect-border {
1095
    display: none;
1096
    left: -15px;
1097
    position: absolute;
1098
    top: 9px;
1099
}
1100

    
1101
.standard .machine .logo {
1102
    float: left;
1103
    width: 50px;
1104
    height: 54px;
1105
    margin: 1px 14px 0;
1106
}
1107
.machine .logo {
1108
    background-image: url("../images/icons/machines/medium/unknown-sprite.png");
1109
    background-repeat: no-repeat;
1110
    cursor: pointer;
1111
}
1112

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

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

    
1121
.standard .machine .single-image-state4 {
1122
    background-position: -150px 0;
1123
}
1124

    
1125
.standard .machine .single-image-state2 {
1126
    background-position: -50px 0;
1127
}
1128

    
1129
.standard .running .machine .logo {
1130
   cursor: pointer;
1131
}
1132

    
1133
.list .machine img {
1134
    margin: 0;
1135
}
1136

    
1137
.icon div.ip, .icon div.ips {
1138
    font-size: 75%;
1139
}
1140

    
1141
.icon div.indicators {
1142
    float: right;
1143
}
1144

    
1145
div.indicators {
1146
    margin-right: 2px !important;
1147
    cursor: pointer;
1148
}
1149

    
1150
div.indicator1, div.indicator2, div.indicator3, div.indicator4 {
1151
    background-color: #63cf1c;
1152
    width:10px;
1153
    height:11px;
1154
    clear: none;
1155
    float:right;
1156
    -webkit-transition: background-color .75s ease-out;
1157
    -o-transition: background-color .75s ease-out;
1158
    -moz-transition: background-color .75s ease-out;
1159
    transition: background-color .75s ease-out;
1160
}
1161

    
1162
.view-separator {
1163
    color:#5F8DD3;
1164
}
1165

    
1166
.running.disabled {
1167
    background: transparent;
1168
}
1169

    
1170
.running-state .indicator1, .running-state .indicator2, .running-state .indicator3, .running-state .indicator4 {
1171
    background-color: #63cf1c;
1172
}
1173

    
1174
.rebooting-state .indicator1, .rebooting-state .indicator2, .rebooting-state .indicator3, .rebooting-state .indicator4 {
1175
    background-color: #d4aa00;
1176
}
1177

    
1178
.error-state .indicator1, .error-state .indicator2, .error-state .indicator3, .error-state .indicator4 {
1179
    background-color: #ff0000 !important;
1180
}
1181

    
1182
.terminated-state .indicator1, .terminated-state .indicator2, .terminated-state .indicator3, .terminated-state .indicator4 {
1183
    background-color: #5e1616;
1184
}
1185

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

    
1190
.destroying-state .indicator1, .destroying-state .indicator3, .destroying-state .indicator2, .destroying-state .indicator4 {
1191
    background-color: #4085a5 !important;
1192
}
1193

    
1194
.shutting-state .indicator1, .shutting-state .indicator3, .shutting-state .indicator2, .shutting-state .indicator4 {
1195
    background-color: #940606;
1196
}
1197

    
1198
.starting-state .indicator1, .starting-state .indicator2, .starting-state .indicator3, .starting-state .indicator4 {
1199
    background-color: #9ed976;
1200
}
1201

    
1202
.network-indicator .indicator1, .network-indicator .indicator2, .network-indicator .indicator3, .network-indicator .indicator4 {
1203
    background-color: #63cf1c;
1204
}
1205

    
1206
.network-indicator.in-progress .indicator1, .network-indicator.in-progress .indicator2, .network-indicator.in-progress .indicator3, .network-indicator.in-progress .indicator4 {
1207
    background-color: #FF7F2A;
1208
}
1209

    
1210
.running, .terminated {
1211
    background: #EFF7FA repeat scroll 0 0;
1212
    padding-bottom: 15px;
1213
}
1214

    
1215
.running, #machinesview-list, .single {
1216
}
1217

    
1218
.terminated {
1219
    background:#DCE5E8  repeat scroll 0 0;
1220
    padding-top: 15px;
1221
    margin-top: 15px;
1222
}
1223

    
1224
span.rename {
1225
    background-repeat: no-repeat;
1226
    color: transparent;
1227
    font-size: 75%;
1228
    font-weight: normal;
1229
    margin-left: 10px;
1230
    padding-left: 10px;
1231
    text-align: left;
1232
    cursor: pointer;
1233
}
1234

    
1235
div.name:hover span.rename, span.rename_hovered {
1236
    color: #3D3D3D;
1237
    margin-top: 0.4em;
1238
    background-image: url("../images/pencil.png");
1239
    background-position: 0 3px;
1240
}
1241

    
1242
.machine div.info {
1243
    font-size: 75%;
1244
}
1245

    
1246
div.machine:hover div.info-header, div.machine:hover div.toggler div.down {
1247
    background-color: #84b7d0;
1248
}
1249

    
1250
div.machine div.info-label.darker, .single div.tags-label.darker, div.network .darker {
1251
    background-color: #5CA1C0;
1252
}
1253

    
1254
.machine div.info div.info-label {
1255
    font-size: 75%;
1256
    height:16px;
1257
    width: 30px;
1258
    padding: 1px 0 0 5px;
1259
}
1260

    
1261
.machine div.info div.toggler, .single div.tags div.toggler, div.network div.toggler {
1262
    width:15px;
1263
    height:17px;
1264
    margin-top: -11px;
1265
    margin-left: 37px;
1266
}
1267

    
1268
div.network div.toggler {
1269
    margin-left: 90px;
1270
}
1271

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

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

    
1280
.network div.network-machines div.down {
1281
    background: url(../images/down-arrow.png) no-repeat scroll 2px 2px;
1282
}
1283

    
1284
.network div.network-machine div.firewall div.down {
1285
    background: url(../images/down-arrow.png) no-repeat scroll 2px 2px;
1286
}
1287

    
1288
.machine div.info div.up {
1289
    background: url(../images/up-arrow.png) no-repeat scroll 1px 0;
1290
}
1291

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

    
1296
.network div.network-machines div.up {
1297
    background: url(../images/up-arrow.png) no-repeat scroll 2px 2px;
1298
}
1299

    
1300
.network div.network-machine div.firewall div.up {
1301
    background: url(../images/up-arrow.png) no-repeat scroll 2px 2px;
1302
}
1303

    
1304
button {
1305
    background-color: #87AADE;
1306
    border: 1px solid #87AADE;
1307
    color: #FFFFFF;
1308
    cursor: pointer;
1309
    height: 23px;
1310
    width: 120px;
1311
}
1312

    
1313
button.next {
1314
    background-color: #4085A5;
1315
    border-color: #4085A5;
1316
    text-align: right;
1317
}
1318

    
1319
button.next:hover {
1320
    background-color: #7DB4CD;
1321
    border-color: #7DB4CD;
1322
}
1323

    
1324
button.prev {
1325
    background-color: #4085A5;
1326
    border-color: #4085A5;
1327
    margin-left: -1px;
1328
    text-align: left;
1329
}
1330

    
1331
button.prev:hover {
1332
    background-color: #7DB4CD;
1333
    border-color: #7DB4CD;
1334
}
1335

    
1336
.image-logo {
1337
    float: left;
1338
    margin-right: 1em;
1339
    margin-left: 1.5em;
1340
    margin-top: 4px;
1341
}
1342

    
1343
.icon div.image {
1344
    clear: both;
1345
    display: block;
1346
    margin-bottom: 3px;
1347
    margin-top: 3px;
1348
    padding: 5px;
1349
}
1350

    
1351
div#view-select {
1352
    clear: both;
1353
    color: white;
1354
    position: absolute;
1355
    right: 15px;
1356
    top: 15px;
1357
}
1358

    
1359
a.machines_view_link {
1360
    text-decoration: none;
1361
    font-size: 0.7em;
1362
    padding: 4px;
1363
    padding-right: 8px;
1364
    color: #5CA1C0;
1365
    margin-left: 5px;
1366
    background-repeat: no-repeat;
1367
    background-color: #C9DFEA;
1368
}
1369

    
1370
a.machines_view_link span {
1371
    float: left;
1372
}
1373

    
1374
a.machines_view_link span.ico {
1375
    width: 17px;
1376
    height: 15px;
1377
    margin-right: 10px;
1378
    background-position: -36px 0;
1379
}
1380

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

    
1389
a.machines_view_link.activelink span.ico {
1390
    background-position: -18px 0px;
1391
}
1392
a.machines_view_link.activelink {
1393
    color: #fff;
1394
    background-color: #5CA1C0;
1395
}
1396

    
1397
div#view-select a {
1398
    display: block;
1399
    float: left;
1400
}
1401

    
1402
a#list:hover {
1403
    background: #5f8dd3;
1404
}
1405

    
1406
a#machines_view_icon_link:active, a#machines_view_list_link:active {
1407
    color:white;
1408
}
1409

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

    
1414
a#machines_view_list_link span.ico {
1415
    background-image: url("../images/list-view.png");
1416
}
1417

    
1418
a#machines_view_single_link span.ico {
1419
    background-image: url("../images/single-view.png");
1420
}
1421

    
1422
#machinetype {
1423
    background-color: #CDE2EC;
1424
    height: 25px;
1425
    margin-bottom: 0px !important;
1426
}
1427

    
1428
div.machine-type {
1429
    float: left;
1430
    margin: 4px 18px 20px;
1431
}
1432

    
1433
.machine-type .active {
1434
    color: #FFFFFF
1435
}
1436

    
1437
div.machine-type label.disabled {
1438
    color: #aaa !important;
1439
}
1440

    
1441
#machinesview {
1442
}
1443

    
1444
#machines-pane {
1445
}
1446

    
1447
.list#machinesview {
1448
    margin-left: -20px;
1449
    display:none;
1450
}
1451

    
1452
#machinesview-list.list {
1453
    background: #EFF7FA  repeat scroll 0 0;
1454
    padding-left: 15px;
1455
    padding-bottom: 15px;
1456
}
1457

    
1458
#machinesview_content {
1459
    display:none;
1460
}
1461

    
1462
.list-machines {
1463
    min-width: 515px;
1464
}
1465

    
1466
#emptymachineslist {
1467
    background-color: #6BA9C6;
1468
    color: #A0A0A0;
1469
    display: none;
1470
    padding: 65px 150px 35px;
1471
    text-align: justify;
1472
    margin-top: -70px;
1473
}
1474

    
1475
#welcomeheader {
1476
    color:white;
1477
    text-align: center;
1478
}
1479

    
1480
.welcomebody {
1481
    color: white;
1482
    font-size:80%;
1483
}
1484

    
1485
.welcomebody a {
1486
    color: white;
1487
}
1488

    
1489
.welcomefooter {
1490
    color: white;
1491
    font-size:60%;
1492
}
1493

    
1494
.welcomefooter a {
1495
    color: white;
1496
}
1497

    
1498
.emptycreatecontainer {
1499
    margin-left: 430px !important;
1500
    position: absolute;
1501
    margin-top: 5px !important;
1502
    width: 180px;
1503
    background-color: #CCCCCC;
1504
    padding: 5px;
1505
    padding-left: 10px;
1506
}
1507

    
1508
.emptycreate {
1509
    margin: 20px 10px 5px 0 !important;
1510
}
1511

    
1512
#createbody {
1513
    display:none;
1514
    font-size: 80%;
1515
}
1516

    
1517
div.list label img {
1518
    margin: 5px 5px -3px 0;
1519
}
1520

    
1521
div.list label {
1522
    color: #3D3D3D;
1523
    font-size: 75%;
1524
}
1525

    
1526
div.list .state {
1527
    margin-top: 7px;
1528
    margin-right: 10px;
1529
}
1530

    
1531
div.list table tbody {
1532
    margin-top: 8px;
1533
}
1534

    
1535
div.list table tr.checked td {
1536
    background-color: #A1C8DB !important;
1537
}
1538

    
1539
div.list table tr:hover td,
1540
div.list table tr.inactive:hover td,
1541
div.list table tr.error:hover td {
1542
    background-color: #A1C8DB;
1543
    color: #fff;
1544
}
1545

    
1546
div.list table td.name {
1547
    min-width: 170px;
1548
}
1549

    
1550
div.list table td.status {
1551
    font-size: 0.9em !important; 
1552
    text-align: right;
1553
    min-width: 90px;
1554
    color: #000;
1555
}
1556

    
1557
div.list table td.flavor {
1558
    font-size: 0.8em;
1559
}
1560

    
1561
div.list table td {
1562
    border-bottom: 1px solid #DDD;
1563
}
1564

    
1565
div.list table tr.error td.status {
1566
    color: #800000 !important;
1567
    font-weight: bold;
1568
}
1569

    
1570
div.list table tr.error td {
1571
    background-color: #DCE5E8;
1572
}
1573

    
1574
div.list table tr.inactive td {
1575
    background-color: #DCE5E8;
1576
}
1577

    
1578
div.list .stopped {
1579
    margin-top: 8px;
1580
}
1581

    
1582
/* root element for tabs  */
1583
#wizard ul.tabs {
1584
    margin-right: -1px;
1585
    float: right;
1586
}
1587

    
1588
#wizard div.panes {
1589
    height: 247px;
1590
    clear:both;
1591
    margin-top: 3px;
1592
}
1593

    
1594
.typebody {
1595
    font-size: 80%;
1596
    font-weight: normal;
1597
    position: relative;
1598
    top: -3px;
1599
}
1600

    
1601
.typehover {
1602
    color: #FFFFFF;
1603
}
1604

    
1605
#label-name {
1606
    margin-top: 10px;
1607
}
1608

    
1609
/* single tab */
1610
#wizard ul.tabs li {
1611
    margin-bottom: 0;
1612
    list-style-type:none;
1613
    float: left;
1614
}
1615

    
1616
/* link inside the tab. uses a background image */
1617
#wizard ul.tabs a {
1618
    display:block;
1619
    padding: 0.2em 0.5em 0.1em 0.4em;
1620
    text-decoration:none;
1621
    color: #FFFFFF;
1622
    position:relative;
1623
    top:1px;
1624
    outline:0;
1625
    background-color: transparent;
1626
    text-align: center;
1627
    width: 100px;
1628
    white-space: nowrap;
1629
    height: 17px;
1630
}
1631

    
1632
#wizard ul.tabs a:hover {
1633
    color: #FFFFFF;
1634
    background-color:#4085A5;
1635
}
1636

    
1637
/* selected tab */
1638
#wizard ul.tabs a.current {
1639
    color: white;
1640
    background-color: #7DB4CD;
1641
    cursor: default;
1642
}
1643

    
1644
#wizard #standard-images {
1645
    background-color: #ECF4F8;
1646
}
1647

    
1648
div.list div.actions {
1649
    display: none;
1650
    clear: left;
1651
    float: right;
1652
    margin-right: 15px;
1653
    margin-top: 37px;
1654
    text-align: right;
1655
    width: 120px;
1656
}
1657

    
1658
div.list div.actions a {
1659
    clear: left;
1660
    color: #A1A1A1;
1661
    display: block;
1662
    font-size:75%;
1663
    margin-bottom: 2px;
1664
}
1665

    
1666
div.list div.actions a:hover {
1667
    background-color: transparent;
1668
}
1669

    
1670
div.list div.actions a.enabled {
1671
    color: #3D3D3D;
1672
}
1673

    
1674
div.list div.actions a.enabled:hover{
1675
    cursor: pointer;
1676
    color: black;
1677
    text-decoration: underline;
1678
}
1679

    
1680
div.list div.actions a.selected {
1681
    color: #FF7F2A !important;
1682
}
1683

    
1684
input.machine {
1685
    width: 13px;
1686
    height: 13px;
1687
    top: -1px;
1688
    overflow: hidden;
1689
}
1690

    
1691
.description-container {
1692
    display: inline-block;
1693
    position: relative;
1694
    width: 300px;
1695
}
1696

    
1697
#wizard .button-container {
1698
    height: 20px;
1699
}
1700

    
1701

    
1702
/* metadata dropdown combo */
1703
.meta-key {
1704
    margin-right: 18px;
1705
    float:left;
1706
}
1707

    
1708
/* notification box */
1709
#yes-no {
1710
    height: 150px;
1711
    z-index: 9999;
1712
    border-bottom: 5px solid #4085A5;
1713
}
1714

    
1715
#yes-no p, #yes-no button {
1716
    margin-top: 15px;
1717
}
1718

    
1719
#error-success, .notification-box {
1720
    z-index: 9999;
1721
    border-bottom: 5px solid #4085A5;
1722
    min-height: 150px;
1723
    top: 50px !important;
1724
    position: absolute;
1725
}
1726

    
1727
#error-success p, .notification-box p {
1728
    margin-top: 5px;
1729
}
1730

    
1731
.error-report {
1732
    display: none;
1733
}
1734

    
1735
#error-success .error-report {
1736
    position: absolute;
1737
    top: 140px;
1738
    right: 40px;
1739
}
1740

    
1741
.error .error-report {
1742
    display: block;
1743
}
1744

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

    
1749
#error-success .error-report .success {
1750
    display: none;
1751
}
1752

    
1753
#error-success .error-report .sending {
1754
    display: none;
1755
}
1756

    
1757
#error-success .error-report .send-btn {
1758
    color: #4085A5;
1759
    text-decoration: underline;
1760
    cursor: pointer;
1761
}
1762

    
1763
#error-success strong, .notification-box strong {
1764
    color: #F49C1A;
1765
}
1766

    
1767
#error-success .close, .notification-box .close {
1768
    background-image: url("../images/close-popup.png");
1769
    background-repeat: no-repeat;
1770
    cursor: pointer;
1771
    height: 13px;
1772
    position: absolute;
1773
    right: 7px;
1774
    top: 9px;
1775
    width: 13px;
1776
}
1777

    
1778
.popup-header-error {
1779
    background-color: #800000 !important;
1780
}
1781

    
1782
.popup-border-error {
1783
    border-color: #800000 !important;
1784
    width:auto;
1785
}
1786

    
1787
.popup-details-error {
1788
    border: none !important;
1789
}
1790

    
1791
.popup-separator-error {
1792
    margin-bottom: 5px !important;
1793
}
1794

    
1795
#error-success .popup-header, .notification-box .popup-header {
1796
    background-color: #4085A5;
1797
    color: white;
1798
    font-size: 95%;
1799
    font-weight: normal;
1800
    height: 20px;
1801
    margin-left: -16px;
1802
    margin-top: -16px;
1803
    padding-bottom: 2px;
1804
    padding-left: 30px;
1805
    padding-top: 10px;
1806
    width: 482px;
1807
    margin-right:-16px;
1808
}
1809

    
1810

    
1811
#error-success.success h3 span.header-box, .notification-box h3 span.header-box {
1812
    background-color: #71c837;
1813
    display: block;
1814
    background-image: url("../images/save-green.png");
1815
    background-position: right 0;
1816
    background-repeat: no-repeat;
1817
    width: 80px;
1818
    padding: 3px 3px 3px 8px;
1819
    margin-top: -6px;
1820
    font-size: 90% !important;
1821
    margin-left: -11px;
1822
}
1823

    
1824
#error-success .popup-body, .notification-box .popup-body {
1825
    background: url("../images/popup-bg.png") repeat-x scroll 0 0 transparent;
1826
    margin-left: -16px;
1827
    margin-right: -16px;
1828
    margin-top: 1px;
1829
    min-height: 142px;
1830
    padding-top: 10px;
1831
}
1832

    
1833
#error-success .popup-body-inner, .notification-box .popup-body-inner {
1834
    background: url("../images/popup-inner-bg.png") repeat-x scroll 0 0 transparent;
1835
    font-size: 80%;
1836
    min-height: 120px;
1837
    margin-left: 20px;
1838
    padding-left: 15px;
1839
    width: 460px;
1840
}
1841

    
1842
#error-success .popup-separator, .notification-box .popup-seperator {
1843
    background-color: #74AEC9;
1844
    height: 1px;
1845
    font-size:1%;
1846
    width: 442px;
1847
    margin-bottom: 30px;
1848
}
1849

    
1850
#error-success .machine-now-building {
1851
    font-size: 95%;
1852
    padding-bottom: 7px;
1853
    padding-top: 10px;
1854
}
1855

    
1856
#error-success.success .machine-now-building {
1857
    padding-bottom: 14px !important;
1858
}
1859

    
1860
#error-success .password-container, .notification-box .password-container {
1861
    width: 430px;
1862
    padding: 5px;
1863
    border: 2px solid #75b54a;
1864
    background-color: #aade87;
1865
}
1866

    
1867
#error-success .password-header, .notification-box .password-header {
1868
    margin-bottom: 5px;
1869
}
1870

    
1871
#error-success .password, .notification-box .password {
1872
    color: #447821;
1873
}
1874

    
1875
#error-success .popup-details, .notification-box .popup-details {
1876
    border: 2px solid #FF7F2A;
1877
    float: left;
1878
    margin-left: 10px;
1879
    padding: 2px;
1880
}
1881

    
1882
#error-success.success .popup-details, .notification-box .popup-details {
1883
    border: none !important;
1884
    float: none !important;
1885
    margin-left: none !important;
1886
    margin-top: 10px;
1887
}
1888

    
1889
#error-success.success .popup-separator, .notification-box .popup-seperator {
1890
    margin-bottom: 14px !important;
1891
}
1892

    
1893
#error-success .write-password, .notification-box .write-password {
1894
    margin-bottom: 5px;
1895
    padding-left: 30px;
1896
}
1897

    
1898
#error-success .write-password-password, .notification-box .write-password-password {
1899
    padding-left: 30px;
1900
    color: #447821;
1901
    display: inline;
1902
    font-size: 110%;
1903
    font-weight: bold;
1904
}
1905

    
1906
#error-success .write-password-details, .notification-box .write-password-details {
1907
    font-size: 75%;
1908
}
1909

    
1910
.more-details {
1911
    display: block;
1912
}
1913

    
1914
.notification-box h3 span.header-box {
1915
    background: transparent;
1916
}
1917

    
1918
.notification-box .machine-now-building {
1919
    padding: 20px 0;
1920
}
1921

    
1922
.notification-box .header-box {
1923
    width: auto !important;
1924
}
1925

    
1926
.notification-box .password {
1927
    text-align: center;
1928
}
1929
.notification-box .password a:hover {
1930
    background-color: #447821;
1931
    color: #fff;
1932
}
1933

    
1934
.notification-box .password a {
1935
    padding: 0.2em;
1936
    text-align: center;
1937
    color: #447821;
1938
    font-weight: bold;
1939
    font-size: 1.2em;
1940
    text-decoration: none;
1941
}
1942

    
1943
.popup-details a:link, .popup-details a:visited {
1944
    color: black;
1945
}
1946

    
1947
.destroy .confirm_single .yes {
1948
    background-color: #880000;
1949
    color: #fff;
1950
}
1951

    
1952
.destroy .confirm_single .no {
1953
    background-color: #CC0000;
1954
    color: #880000;
1955
}
1956

    
1957
.destroy .confirm_single .yes:hover {
1958
    background-color:#CC0000;
1959
}
1960

    
1961
div.list div.actions a.selected#action-destroy {
1962
    color: #880000 !important;
1963
}
1964

    
1965
.vm-actions .destroy a#action-destroy.selected {
1966
    color: #880000 !important;
1967
}
1968

    
1969
/* Confirmation boxes */
1970
div.confirm_single, div.confirm_multiple, div.action_error {
1971
    display: none;
1972
    color: black;
1973
}
1974

    
1975
div.confirm_single button, div.confirm_multiple button, div.action_error button {
1976
    font-size: 100%;
1977
    cursor: pointer;
1978
    color: black;
1979
    height: 20px !important;
1980
}
1981

    
1982
div.confirm_single button {
1983
    border: none;
1984
    font-family: Arial, Helvetica, sans-serif;
1985
    line-height: 1em;
1986
    vertical-align: middle;
1987
    padding: 2px 6px;
1988
    padding-bottom:4px;
1989
    height: 15px;
1990
}
1991

    
1992
div.confirm_single button.yes {
1993
    width: 90px;
1994
    background-color:#FF7F2A;
1995
}
1996

    
1997
div.confirm_single button.yes:hover {
1998
    background-color: #FF9955;
1999
}
2000

    
2001
div.confirm_single button.no {
2002
    width: 20px;
2003
    margin-left:-5px;
2004
    background-color: #FF9955;
2005
    color:#d95d0a;
2006
}
2007

    
2008
div.confirm_single button.no:hover {
2009
    color: white;
2010
}
2011

    
2012
div.confirm_multiple_cont {
2013
    background-color: #406A7D;
2014
    margin-top: 0px;
2015
    padding: 3px;
2016
    border-top: 1px solid #444;
2017
    border-bottom: 1px solid #444;
2018
    padding-top:0px;
2019
    margin-top: -1px;
2020
}
2021

    
2022
div.confirm_reboot_required {
2023
}
2024

    
2025
div.confirm_multiple {
2026
    font-size: 65%;
2027
    z-index: 8000;
2028
    /*height: 28px;*/
2029
    width: 700px;
2030
    margin-top: 15px;
2031
}
2032

    
2033
div.confirm_multiple p {
2034
    float: left;
2035
    color: #FFF;
2036
    font-weight: bold;
2037
    margin: 7px 0 0 10px;
2038
}
2039

    
2040
#networks-pane {
2041
    display: none;
2042
}
2043

    
2044
#networks-pane div.confirm_multiple p {
2045
    margin: 7px 0 0 100px;
2046
}
2047

    
2048
div.confirm_multiple button {
2049
    float: right;
2050
    background-color: transparent;
2051
    border: 1px solid #5CA1C0;
2052
    margin: 4px 5px 0 0;
2053
}
2054

    
2055
div.confirm_multiple button.yes {
2056
    border-color: #FF7F2A;
2057
    padding: 0 12px;
2058
}
2059

    
2060
div.confirm_multiple button.yes:hover {
2061
    background-color: #FF7F2A;
2062
}
2063

    
2064
div.confirm_multiple button.no {
2065
    padding: 0px 16px;
2066
}
2067

    
2068
div.confirm_multiple button.no:hover {
2069
    background-color: #5CA1C0;
2070
}
2071

    
2072
div.action_error {
2073
    width: 120px;
2074
    margin: 14px 0 0 37px;
2075
    background-color: #981D1D;
2076
    font-size: 75%;
2077
    z-index:1;
2078
    color: #FFF;
2079
    position:absolute;
2080
    top: 0px;
2081
}
2082

    
2083
div.action_error .action-error-msg {
2084
    background-color: #fff;
2085
    color: #981D1D;
2086
    border: 1px solid #981D1D;
2087
    padding: 4px;
2088
}
2089
div.action_error .action-error-msg .action {
2090
    font-weight: bold;
2091
}
2092

    
2093
div.action_error .action-error-msg {
2094
    font-size: 0.8em;
2095
}
2096

    
2097
.action_error button {
2098
    width: 75px;
2099
    background-color: transparent;
2100
    border: 1px solid;
2101
    border-color: #981D1D;
2102
    color: #fff !important;
2103
    float: left;
2104
}
2105

    
2106
div.action_error button.details {
2107
    padding-right: 5px;
2108
    width: 100px;
2109
    border-bottom: 2px solid #981D1D;
2110
    border-right: 1px solid #981D1D;
2111
    border-left: 2px solid #981D1D;
2112
    background-color: #E24B4B;
2113
}
2114

    
2115
div.action_error button.close-action-error {
2116
    background-image: url("../images/option-action-remove.png");
2117
    background-color: #fff;
2118
    background-repeat: no-repeat;
2119
    background-position: center center;
2120
    width: 20px;
2121
    border-bottom: 2px solid #981D1D;
2122
    border-right: 2px solid #981D1D;
2123
    border-top: 1px solid #981D1D;
2124
}
2125

    
2126
div.action_error button.details:hover {
2127
    background-color: #FF7F2A;
2128
}
2129

    
2130
div#aboutuser{
2131
    float:right;
2132
    clear: both;
2133
    color: #FFFFFF;
2134
    font-size: 75%;
2135
    margin-top: -25px;
2136
}
2137

    
2138
div#user{
2139
    clear: both;
2140
    color: #FFFFFF;
2141
    font-size: 75%;
2142
    margin-top: 38px;
2143
    padding-bottom: 10px;
2144
    position: absolute;
2145
    right:0;
2146
}
2147

    
2148
div#user a{
2149
    color: #FFFFFF;
2150
    text-decoration: none;
2151
}
2152

    
2153
div#user a.current_lang {
2154
    color: #72ADC8;
2155
}
2156

    
2157
div#user .usermenu {
2158
    float: left;
2159
    cursor: pointer;
2160
    overflow: hidden;
2161
    padding-top: 5px;
2162
    margin-top: -6px;
2163
    position: relative;
2164
}
2165

    
2166
div#user .username {
2167
    display: block;
2168
    margin-right: 10px;
2169
    padding-right: 18px;
2170
    padding-left: 4em;
2171
    min-width: 70px;
2172
    text-align: right;
2173
    height: 20px;
2174
    background: url("../images/down-arrow-light.png") no-repeat right;
2175
    background-position: right 6px;
2176
    font-weight: normal;
2177
}
2178

    
2179
div#user .hovered {
2180
    background: #599EBD;
2181
    overflow: visible;
2182
    border-bottom: 1px solid #C7DFE9;
2183
}
2184

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

    
2189
div#user .active {
2190
    background-color: #BED5E0 !important;
2191
}
2192

    
2193
div#user .active .username {
2194
    color: #599EBD;
2195
    background-image: url("../images/down-arrow-lighter.png");
2196
}
2197

    
2198
div#user .useractions {
2199
    display: none;
2200
}
2201

    
2202
div#user .active .useractions {
2203
    display: block;
2204
    text-align: right;
2205
    color: #4085A5;
2206
    background-color: #D0E3ED;
2207
    margin-top:-1px;
2208
    border-top:1px solid #fff;
2209
    position: relative;
2210
    top: 1px;
2211
    box-shadow: 1px 1px 1px #aaa;
2212
    -moz-box-shadow: 1px 1px 1px #aaa;
2213
    -webkit-box-shadow: 1px 1px 1px #aaa;
2214
}
2215

    
2216
div#user .useractions li {
2217
    padding: 2px 10px;
2218
    border-bottom: 1px solid #efefef;
2219
    text-align: right;
2220
    display: block;
2221
    background-color: transparent;
2222
}
2223

    
2224
div#user .useractions li a {
2225
    color: #4085A5;
2226
    display: inline-block;
2227
    padding:5px 0;
2228
    padding-left: 30px;
2229
    padding-bottom: 6px;
2230
    background-repeat: no-repeat;
2231
    background-position: center left;
2232
}
2233

    
2234
div#user .useractions li.hovered {
2235
    background-color: #E1EFF6;
2236
}
2237

    
2238
div#user .useractions li.last {
2239
    border-bottom: none;
2240
}
2241

    
2242
div#user .useractions .logout a {
2243
    background-image: url("../images/icon-logout.png");
2244
}
2245

    
2246
div#user .langmenu {
2247
    float: left;
2248
    border-left: 1px solid #ffffff;
2249
    padding-left: 10px;
2250
    margin-left: -1px;
2251
}
2252

    
2253
div#user .langmenu .sep {
2254
    display: inline-block;
2255
    color: #72ADC8;
2256
}
2257

    
2258
.separator {
2259
    background-color: #74AEC9;
2260
    height: 10px;
2261
    width: 700px;
2262
    font-size: 1px;
2263
    line-height: 0px;
2264
}
2265

    
2266
#disks.separator {
2267
    background-color: #dea842;
2268
}
2269

    
2270
#networks.separator {
2271
    background-color: #6c535d;
2272
}
2273

    
2274
.network-machine h5 {
2275
    margin-bottom: 20px;
2276
    margin-top:0px;
2277
}
2278

    
2279
.machine-container .separator {
2280
    width: 508px;
2281
    height: 1px;
2282
    margin-top: 2px;
2283
    background-color: #5CA1C0;
2284
    margin-left: 13px;
2285
}
2286

    
2287
.editbuttons {
2288
    display: block;
2289
    clear: none;
2290
    width: 40px;
2291
    margin-right: 0px;
2292
    padding-top: 0px;
2293
    float: right;
2294
    cursor: pointer;
2295
    position: relative;
2296
    z-index: 1000;
2297
}
2298

    
2299
div.editbuttons div.save:hover, div.editbuttons div.cancel:hover {
2300
    background-color: #84b7d0;
2301
}
2302

    
2303
div.editbuttons div.cancel:hover {
2304
    background-image: url("../images/cancel-onhover.png");
2305
}
2306

    
2307
.editbuttons .cancel, .editbuttons .save {
2308
    background-repeat: no-repeat;
2309
    color: transparent;
2310
    height: 16px;
2311
    width: 16px;
2312
    float: left;
2313
}
2314

    
2315
.editbuttons .cancel {
2316
    background-image: url("../images/cancel.png");
2317
    margin-left: 3px;
2318
}
2319

    
2320
.editbuttons .save {
2321
    background-image: url("../images/save.png");
2322
    margin-left: 1px;
2323
}
2324

    
2325
.editbuttons img {
2326
    float:none !important;
2327
    margin: 0px !important;
2328
}
2329

    
2330
.network .namecontainer {
2331
    font-size: 1.1em;
2332
}
2333
.network .machine-name-div .namecontainer {
2334
    font-size: 1em;
2335
    font-weight: bold;
2336
}
2337

    
2338

    
2339
.namecontainer .name {
2340
    position: relative;
2341
}
2342

    
2343
.namecontainer .name .nametextbox, .network-rename-input {
2344
    z-index: 1000;
2345
}
2346

    
2347
.icon .nametextbox {
2348
    width: 255px;
2349
}
2350

    
2351
.nametextbox, .network-rename-input {
2352
    position: relative;
2353
    top: -3px;
2354
    font-size: 65%;
2355
    width: 240px;
2356
    border: 1px solid #aaaaaa;
2357
    padding: 2px;
2358
}
2359

    
2360
.large-spinner {
2361
    background: url("../images/icons/indicators/large/progress.gif");
2362
    margin-left: 298px;
2363
    margin-top: 0px;
2364
    height: 31px;
2365
    width: 49px;
2366
    position: absolute;
2367
    top: 200px;
2368
}
2369

    
2370
#machinesview-icon .large-spinner {
2371
    top: 170px;
2372
}
2373

    
2374
.list .large-spinner {
2375
    margin-top:-30px;
2376
}
2377

    
2378
.single .large-spinner {
2379
    margin-top: 50px;
2380
}
2381

    
2382
div#networks-container {
2383
    display: none;
2384
}
2385

    
2386
div#networks-container .large-spinner {
2387
    margin-top: 50px;
2388
}
2389

    
2390
/* tables in list view */
2391
div.list div.dataTables_filter {
2392
    font-size: 75%;
2393
    margin-bottom: 12px;
2394
}
2395

    
2396
div.list div.dataTables_filter input{
2397
    font-size: 100%;
2398
}
2399

    
2400
.dataTables_wrapper {
2401
    width: 515px;
2402
    padding-bottom: 40px;
2403
}
2404

    
2405
div.list table thead .sorting, div.list table thead .sorting_desc, div.list table thead .sorting_asc {
2406
    padding-right: 15px !important;
2407
}
2408

    
2409
div.list table {
2410
    width: 515px;
2411
    font-size: 75%;
2412
}
2413

    
2414
div.list table tbody td {
2415
    color: #3D3D3D;
2416
    padding:6px;
2417
    vertical-align: middle;
2418
    height: 20px;
2419
}
2420

    
2421
div.list table thead tr {
2422
    border-bottom: 1px solid #aaa;
2423
}
2424
div.list table thead tr th {
2425
    background-color: #CDE2EC;
2426
    background-image: url("../images/bg.gif");
2427
    background-repeat: no-repeat;
2428
    background-position: right 11px;
2429
    font-weight: normal;
2430
    border: 1px solid transparent;
2431
    border-bottom: none;
2432
    padding: 4px;
2433
    text-align: left;
2434
    vertical-align: middle;
2435
    cursor: pointer;
2436
}
2437

    
2438
div.list table thead .sorting_asc, div.list table thead .sorting_desc {
2439
    background-color: #5CA1C0;
2440
}
2441

    
2442
div.list table thead .sorting_asc {
2443
    background-image: url("../images/asc.gif");
2444
}
2445

    
2446
div.list table thead .sorting_desc {
2447
    background-image: url("../images/desc.gif");
2448
}
2449

    
2450
div.list table .selection div.expand-icon {
2451
    background-image: url("../images/asc.gif");
2452
    background-repeat: no-repeat;
2453
    position: relative;
2454
    cursor: pointer;
2455
    width: 15px;
2456
    height: 4px;
2457
    left: 19px;
2458
    top: -11px;
2459
}
2460

    
2461
ul.dropdown-selector {
2462
    background-color: #E6EEEE;
2463
    position: absolute;
2464
    margin-left: 1px;
2465
    display: block;
2466
    top: 255px;
2467
    font-size:75%;
2468
    width:40px;
2469
}
2470

    
2471
ul.dropdown-selector li {
2472
    padding: 4px;
2473
}
2474

    
2475
ul.dropdown-selector li:hover {
2476
    background-color: #5CA1C0;
2477
}
2478

    
2479
ul.dropdown-selector li a{
2480
    color: black;
2481
    text-decoration: none;
2482
}
2483

    
2484
div.list table span.imagetag {
2485
    display: none;
2486
}
2487

    
2488
div.list table thead .vmos {
2489
    width: 20px !important;
2490
    vertical-align:middle;
2491
}
2492

    
2493
div.list table .selection {
2494
    width: 20px !important;
2495
    text-align: left;
2496
    background-image: none;
2497
    padding-left: 6px;
2498
}
2499

    
2500
div.list table thead .vmflavor {
2501
    width: 100px !important;
2502
}
2503

    
2504
/* group column commented out for v0.5
2505
div.list table thead .vmgroup {
2506
    width: 40px !important;
2507
}
2508
*/
2509

    
2510
div.list table thead .vmstatus {
2511
    width: 50px !important;
2512
}
2513

    
2514
div.list table thead .vmname {
2515
    width: 110px !important;
2516
}
2517

    
2518
.spinner, .action-indicator {
2519
    clear: right;
2520
    float:right;
2521
    margin: 10px 6px 0 15px;
2522
}
2523

    
2524
.icon .spinner {
2525
    margin: 20px 4px 0 15px !important;
2526
}
2527

    
2528
.single .state .spinner {
2529
    margin: 20px 55px 0 15px !important;
2530
}
2531

    
2532
.action-indicator {
2533
    margin-right: 18px;
2534
}
2535

    
2536
.list span.action-indicator {
2537
    display: block;
2538
    width: 15px;
2539
    height: 20px;
2540
    margin: 0 !important;
2541
    float: none;
2542
}
2543

    
2544
.wave {
2545
    clear: right;
2546
    float:right !important;
2547
    margin: 10px 15px 0 15px !important;
2548
}
2549

    
2550
#networks-pane .spinner {
2551
    margin-top: 18px !important;
2552
}
2553

    
2554
.hidden {
2555
    display:none;
2556
}
2557

    
2558
div.actions a.selected, div.actions a.selected:hover, div.machine-actions a.selected, div.machine-actions a.selected:hover {
2559
    display:block !important;
2560
}
2561

    
2562
.action_error .message, .action_error .code {
2563
    display: none;
2564
}
2565

    
2566
.fixed {
2567
    bottom: 0;
2568
    position: fixed !important;
2569
}
2570

    
2571
/* Networks */
2572
#networks-pane {
2573
    background-color: transparent;
2574
    color: black;
2575
}
2576

    
2577
#networkscreate {
2578
}
2579

    
2580
.createbutton {
2581
    color: black;
2582
    background-color: #FF7F2A;
2583
    cursor: pointer;
2584
    padding: 7px 24px;
2585
    text-decoration: none;
2586
    border-left: 15px solid #FF9955;
2587
    margin-left: -15px;
2588
}
2589

    
2590
.createbutton.disabled, #networkscreate.disabled {
2591
  background-color: #888 !important;
2592
  border-left-color: #aaa !important;
2593
  cursor: help !important;
2594
  color: #ccc !important;
2595
}
2596

    
2597
#networkscreate:hover {
2598
    background-color: #FF9955;
2599
}
2600

    
2601
#createcontainer {
2602
}
2603

    
2604
#networks-container {
2605
}
2606

    
2607
#networks-pane .public-networks {
2608
    background: #EFF7FA repeat scroll 0 0;
2609
    margin: 0 0 0px;
2610
    padding: 0 0 15px 0px;
2611
}
2612

    
2613
#networks-pane .private-networks .network:last-child {
2614
    border-bottom: none;
2615
}
2616

    
2617
#networks-pane .private-networks {
2618
    background: #EFF7FA repeat scroll 0 0;
2619
    padding: 15px 20px 20px 0px;
2620
    margin-top: 18px;
2621
}
2622

    
2623
.private-networks .network-cont:last-child {
2624
    border-bottom: none;
2625
}
2626

    
2627
.private-networks .network-cont {
2628
    border-bottom: 1px solid #D1E7F0;
2629
    padding-bottom:5px;
2630
    margin-bottom: 5px;
2631
    width: 520px;
2632
}
2633

    
2634
.private-networks .network {
2635
    padding-top: 10px;
2636
    padding-bottom: 10px;
2637
}
2638

    
2639
#public-template, #private-template, #public-machine-template, #private-machine-template {
2640
    display:none;
2641
}
2642

    
2643
div.network-cont.disable-destroy .actions .destroy {
2644
    display: none !important;
2645
}
2646

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

    
2651
div.network-cont.in-error .actions .action-add {
2652
    display: none;
2653
}
2654

    
2655
div.network a.action-network-add {
2656
    display: none;
2657
}
2658

    
2659
div.network a.action-network-destroy {
2660
    margin-top: 32px !important;
2661
    width: 50px;
2662
    display: none;
2663
}
2664

    
2665
div.network {
2666
    clear: both;
2667
    padding: 5px 20px 5px 20px;
2668
    width: 480px;
2669
    position: relative;
2670
}
2671

    
2672
#private-template {
2673
    margin: 2px 0 0 -30px;
2674
}
2675

    
2676
div.network-placeholder {
2677
    margin-left: 33px;
2678
}
2679

    
2680
div.private-networks div.network-placeholder {
2681
}
2682

    
2683
div.network-cable {
2684
    border-left: 3px solid #FF7F2A;
2685
    float: left;
2686
    margin-left: -40px;
2687
    margin-top: -45px;
2688
    height: 185px;
2689
    overflow: hidden;
2690
}
2691

    
2692
.first div.network-cable {
2693
    height:143px;
2694
    margin-top:-6px;
2695
    position: relative;
2696
}
2697

    
2698
div.network-contents div.machines-list div.first {
2699
    margin-top:0;
2700
}
2701

    
2702
.last div.network-cable {
2703
    height:85px;
2704
}
2705

    
2706
div.firewall-cable {
2707
    border-left: 3px solid #FF7F2A;
2708
    float: left;
2709
    margin-left: -100px;
2710
    margin-top: -20px;
2711
    height: 110px;
2712
}
2713

    
2714
.last div.firewall-cable {
2715
    display:none;
2716
}
2717

    
2718
div.network a:hover {
2719
    text-decoration: underline;
2720
    cursor: pointer;
2721
}
2722

    
2723
#networks-container .name {
2724
    font-size: 75%;
2725
}
2726

    
2727
div.network-machines, div.firewall {
2728
    font-size: 75%;
2729
    margin-left: 70px;
2730
}
2731

    
2732
div.firewall {
2733
    margin-left: 60px;
2734
    margin-bottom: 3px;
2735
    margin-top: -3px;
2736
}
2737

    
2738
div.firewall .firewall-options {
2739
    float: left;
2740
}
2741

    
2742
div.machines-header, div.firewall-header {
2743
    background-color: #A1C8DB;
2744
    color: white;
2745
    cursor: pointer;
2746
    height: 17px;
2747
    width: 103px;
2748
}
2749

    
2750
 div.private-networks div.machines-header {
2751
    margin-top: -5px;
2752
}
2753

    
2754
div.network:hover div.machines-header, div.network:hover div.firewall-header {
2755
    background-color: #84b7d0;
2756
}
2757

    
2758
div.network-machine:hover div.firewall-header {
2759
    background-color: #5CA1C0;
2760
}
2761

    
2762
div.firewall-label.darker {
2763
    background-color: #4085a5;
2764
}
2765

    
2766
.state {
2767
}
2768

    
2769
.network .state {
2770
    font-size: 75%;
2771
    position: absolute;
2772
    right: 10px;
2773
    top: 5px;
2774
}
2775

    
2776
div.network div.actions {
2777
    float: right;
2778
    font-size: 75%;
2779
    font-weight: normal;
2780
    height: 70px;
2781
    width: 100px;
2782
    position: absolute;
2783
    right: -100px;
2784
    top: 0;
2785
}
2786

    
2787
div.network div.machine-actions {
2788
    text-decoration: none;
2789
    float: right;
2790
    margin: -17px -180px 0 0;
2791
    font-weight: normal;
2792
    font-size: 75%;
2793
}
2794

    
2795
div.network div.actions a, div.network div.machine-actions a {
2796
    text-decoration: none;
2797
    height: 15px;
2798
    color: black;
2799
    visibility: hidden;
2800
    display: block;
2801
}
2802

    
2803

    
2804
div.network div.machine-actions a {
2805
    margin: 8px 0 0 8px;
2806
}
2807
div.network div.net-actions a {
2808
    margin: 0 0 8px 8px;
2809
    width: 168px;
2810
}
2811
div.network div.action-container {
2812
    bottom: auto;
2813
}
2814

    
2815
div.network div.net-actions .confirm_single {
2816
    position: absolute;
2817
    left: 96px;
2818
    width: 150px;
2819
    margin: 0 0px -5px 0;
2820
    font-size: 100%;
2821
}
2822

    
2823
div.network div.actions a:hover, div.network div.machine-actions a:hover {
2824
    display: block;
2825
    background-color:#A1C8DB;
2826
    opacity: 0.8;
2827
    filter: alpha(opacity = 80);
2828
}
2829

    
2830
div.network.expand .net-actions a {
2831
    visibility: visible;
2832
}
2833

    
2834
div.network:hover div.actions a, div.network-machine:hover div.machine-actions a {
2835
    visibility: visible;
2836
}
2837

    
2838
div.network div.machine-actions a.action-destroy.selected {
2839
    color: #880000 !important;
2840
}
2841

    
2842
div.network div.actions a.visible,
2843
div.network div.net-vm-actions a.visible,
2844
div.network div.actions a.selected:hover, div.network div.machine-actions a.selected {
2845
    background-color: transparent !important;
2846
    visibility: visible!important;
2847
}
2848

    
2849
div.network .net-vm-actions .confirm_single {
2850
    font-size: 100% !important;
2851
    margin-right: -20px !important;
2852
    position: absolute !important;
2853
    top: 7px;
2854
    right:0;
2855
}
2856

    
2857
div.network .nic-ip {
2858
  font-size: 0.8em;
2859
}
2860

    
2861
div.network div.display a {
2862
    visibility: visible;
2863
}
2864

    
2865
div.network-machine div.machine-actions a.action-details {
2866
    margin-top: 7px;
2867
    width: 168px;
2868
}
2869

    
2870
div.network .net-actions {
2871
    margin-right:5px !important;
2872
    margin-top:0px !important;
2873
    height: 80px !important;
2874
}
2875

    
2876
div.network .net-actions .action-container.destroy {
2877
    position: relative;
2878
    bottom: auto;
2879
}
2880

    
2881
div.network:hover {
2882
    background-color: #A1C8DB !important;
2883
}
2884

    
2885
.network-logos {
2886
    float:left;
2887
    padding-right: 10px;
2888
}
2889

    
2890
.network-logos:hover {
2891
    cursor: pointer;
2892
}
2893

    
2894
.state div {
2895
    text-align: right;
2896
    margin: 4px 1px -4px;
2897
}
2898

    
2899
.public-networks .state div {
2900
    margin-top: 4px;
2901
}
2902

    
2903
.private-networks .state div {
2904
    margin-top: 9px;
2905
    margin-bottom: -12px;
2906
}
2907

    
2908
.network .name-div {
2909
    margin-bottom: 15px;
2910
    margin-top: 0px;
2911
}
2912

    
2913
div.indicator {
2914
    clear: none;
2915
    float: right;
2916
    height: 11px;
2917
    margin: 3px -1px;
2918
    width: 10px;
2919
}
2920

    
2921
#private-networks {
2922
    margin-top: 20px;
2923
}
2924

    
2925
.private-networks .editbuttons {
2926
    margin-right: 117px;
2927
    margin-top: 1px;
2928
}
2929

    
2930
.private-networks div.confirm_single {
2931
    margin: 45px -219px -5px 0;
2932
    font-size: 80%;
2933
}
2934

    
2935
.private-networks .network-machine div.confirm_single {
2936
    margin: 0 -199px 0 0;
2937
}
2938

    
2939
.private-networks .state {
2940
}
2941

    
2942
.private-networks div.machines-list {
2943
    padding-top: 3px;
2944
}
2945

    
2946
span.rename-network, span.configure {
2947
    background-repeat: no-repeat;
2948
    color: transparent;
2949
    font-size: 75%;
2950
    font-weight: normal;
2951
    margin-left: 10px;
2952
    margin-right: 10px;
2953
    padding-left: 10px;
2954
    text-align: left;
2955
}
2956

    
2957
span.rename-network {
2958
    cursor: pointer;
2959
}
2960

    
2961
div.name-div:hover span.rename-network {
2962
    color: #3D3D3D;
2963
    margin-top: 0.4em;
2964
    background-image: url("../images/pencil.png");
2965
    background-position: 0 3px;
2966
}
2967

    
2968
div.network:hover a.rename {
2969
    color: #3d3d3d;
2970
}
2971

    
2972
.network-separator {
2973
    background-color: #5CA1C0;
2974
    height: 1px;
2975
    margin: 2px 0 0 -5px;
2976
    width: 480px;
2977
    font-size: 1%;
2978
    line-height: 1px;
2979
}
2980

    
2981
.network-contents {
2982
    margin-left: -4px;
2983
    width: 504px;
2984
    clear: both;
2985
    background: url("../images/orange-border.png") no-repeat;
2986
    background-position: 33px bottom;
2987
}
2988
.network-contents.last-expanded {
2989
    background-position-y: -2600px;
2990
}
2991

    
2992
.network-machine {
2993
    border-bottom: 1px solid #5CA1C0;
2994
}
2995
.network-machine:last-child {
2996
    border-bottom: none;
2997
}
2998

    
2999
.network-machine .state div {
3000
    text-align: left;
3001
}
3002

    
3003
.network-machine {
3004
    margin-left: 35px;
3005
    padding-bottom: 10px;
3006
    padding-left: 5px;
3007
    padding-top: 10px;
3008
    position: relative;
3009
}
3010

    
3011
.network-machine .ips {
3012
    position: absolute;
3013
    right:0;
3014
    top:40px;
3015
    text-align: right;
3016
    padding-right: 10px;
3017
    font-size: 70%;
3018
}
3019

    
3020
.network-machine .logo {
3021
    float:left;
3022
    padding-right: 10px;
3023
    position:relative;
3024
}
3025

    
3026
#networks-container .machine-name {
3027
    text-decoration: none !important;
3028
    margin-bottom: 10px;
3029
    color: #000000;
3030
    margin-top: -4px;
3031
}
3032

    
3033
.private-networks .separator {
3034
    background-color: #5CA1C0;
3035
    height: 1px;
3036
    margin: 3px 0 -2px -10px;
3037
    width: 485px;
3038
}
3039

    
3040
.network-machine .state {
3041
    margin-right: 18px;
3042
}
3043

    
3044
.network-machine .state .status {
3045
    margin-bottom: 4px;
3046
}
3047

    
3048
.machine-name .name {
3049
}
3050

    
3051
.machine-name .namecontainer {
3052
    line-height: 18px;
3053
    margin-bottom: 20px;
3054
}
3055

    
3056
div.network-machine:hover {
3057
    background-color: #84B7D0;
3058
}
3059

    
3060
.machines {
3061
    width: 416px;
3062
    margin-bottom: -8px;
3063
    margin-top: 10px;
3064
}
3065

    
3066
div.empty-network-slot {
3067
    height: 60px;
3068
}
3069

    
3070
div.network-remove-machine, div.network-add-machine {
3071
    background-color: #FB822F;
3072
    color: #bc4b00;
3073
    width:90px;
3074
    height:18px;
3075
    float:left;
3076
    margin:40px 0 0 -100px;
3077
}
3078

    
3079
span.remove-icon {
3080
    font-size: 80%;
3081
    margin-left: 15px;
3082
    position: relative;
3083
    bottom:1px;
3084
}
3085

    
3086
div.add-icon {
3087
    margin-left: 15px;
3088
    margin-top: -1px;
3089
    cursor: pointer;
3090
}
3091

    
3092
span.remove-icon:hover, span.add-icon:hover {
3093
    cursor:pointer;
3094
    color: #fff;
3095
}
3096

    
3097
div.network-add-machine {
3098
    margin:43px 0 0 0px;
3099
}
3100

    
3101
.firewall-on {
3102
    color: #42E342;
3103
}
3104

    
3105
.firewall-off {
3106
    color: #F82E2E;
3107
}
3108

    
3109
.firewall-content {
3110
    color: black;
3111
    font-size: 60%;
3112
    margin-left: 60px;
3113
    height: 55px;
3114
}
3115

    
3116
.firewall-content .checkbox-legends {
3117
    cursor: pointer;
3118
}
3119

    
3120
.firewall-content .checkbox-legends.current {
3121
    font-weight: bold;
3122
}
3123

    
3124
.firewall-content .checkbox-legends {
3125
    vertical-align: text-top;
3126
}
3127

    
3128
.checkbox-legends a {
3129
    color: black;
3130
    text-decoration: underline;
3131
    font-size: 100%;
3132
}
3133

    
3134
h5.machine-connect {
3135
    font-size: 75%;
3136
    margin-bottom: 3px;
3137
    height: 23px;
3138
}
3139

    
3140
.machine-connect span {
3141
    text-decoration: underline;
3142
}
3143

    
3144
h5.machine-connect span:hover {
3145
    cursor: pointer;
3146
}
3147

    
3148
.firewall-apply {
3149
    background-color: #4085a5;
3150
    border: medium none;
3151
    float: right;
3152
    font-size: 105%;
3153
    height: 18px;
3154
    margin-right: 5px;
3155
    margin-top: 3px;
3156
    width: 75px;
3157
    position: relative;
3158
    bottom:20px;
3159
}
3160

    
3161
.firewall-apply:hover {
3162
    background-color:#5CA1C0;
3163
}
3164

    
3165
.name-div {
3166
    margin: -9px 0 30px 70px;
3167
}
3168

    
3169
.machine-name-div {
3170
    margin-bottom: 20px;
3171
    margin-left: 60px;
3172
}
3173

    
3174
div.reboot-dialog {
3175
    display: none;
3176
    color: black;
3177
    background-color: #4085A5;
3178
    font-size: 75%;
3179
    margin-top: 15px;
3180
    width: 698px;
3181
    z-index: 1;
3182
}
3183

    
3184
div#reboot-machine-template, div.reboot-machine-entry {
3185
    display: none;
3186
    padding: 0 0 10px 35px;
3187
    width: 300px;
3188
}
3189

    
3190
div.reboot-dialog p {
3191
    color: #FFFFFF;
3192
    padding: 10px 0 10px 10px;
3193
}
3194

    
3195
div.reboot-dialog button {
3196
    float:right;
3197
    border: 1px solid #FF7F2A;
3198
    background-color: transparent;
3199
    font-size:100%;
3200
}
3201

    
3202
div.reboot-dialog button:hover {
3203
    background-color: #FF7F2A;
3204
}
3205

    
3206
div.reboot-dialog button.reboot-all {
3207
    margin: -30px 35px 0 0;
3208
}
3209

    
3210
div.reboot-dialog button.reboot-single {
3211
    color: black;
3212
    margin-top: -20px;
3213
}
3214

    
3215
div.reboot-dialog div.code, div.reboot-dialog div.action, div.reboot-dialog div.message, div.reboot-dialog button.details {
3216
    display:none;
3217
}
3218

    
3219
div.reboot-dialog button.details {
3220
    border-color: #800000;
3221
    margin-top: -20px;
3222
}
3223

    
3224
div.reboot-dialog button.details:hover {
3225
    background-color: #800000;
3226
}
3227

    
3228
/* Metadata */
3229
.machine .info-content {
3230
    display: none;
3231
}
3232

    
3233
.metadata-container {
3234
    line-height: 12px;
3235
    height: 85px;
3236
    background-color: #84b7d0;
3237
}
3238

    
3239
.metadata-column {
3240
    border-right: 1px solid #5CA1C0;
3241
    color: black;
3242
    float: left;
3243
    font-size: 60%;
3244
    margin-top: 3px;
3245
    height: 70px;
3246
    padding-bottom: 5px;
3247
}
3248

    
3249
.vm-stats {
3250
    padding-left: 10px;
3251
    padding-right: 5px;
3252
    width: 220px;
3253
}
3254

    
3255
.vm-stats div.stat-content {
3256
    height: 18px;
3257
}
3258

    
3259
.vm-stats div.stat-content img {
3260
    margin: 0;
3261
}
3262

    
3263
.vm-stats div img.stat-busy {
3264
    margin-top: -7px;
3265
    margin-left: 90px;
3266
}
3267

    
3268
.vm-stats div.stat-content img.busy {
3269
    margin-left: 95px;
3270
}
3271

    
3272
.vm-stats div.stat-error {
3273
    display:none;
3274
}
3275

    
3276
div.stat-error {
3277
    color: #f00;
3278
}
3279

    
3280
.single div.stat-error {
3281
    text-align: center;
3282
    font-size: 0.8em;
3283
}
3284

    
3285
.metadata-column {
3286
    margin-top: 4px;
3287
}
3288

    
3289
.vm-details {
3290
    width: 130px;
3291
    margin-left:17px;
3292
}
3293

    
3294
.vm-details.metadata-column {
3295
    padding-top: 5px;
3296
    height: 65px;
3297
}
3298

    
3299
.vm-details .image-details {
3300
    margin-top: 8px;
3301
}
3302

    
3303
.vm-details .vm-detail {
3304
    display: block;
3305
}
3306

    
3307
.vm-details span.value {
3308
    color: #444;
3309
}
3310

    
3311
.single-container .lower .stat-busy {
3312
    margin-top: 10px;
3313
    margin-left: 325px;
3314
}
3315

    
3316
.vm-metadata {
3317
    padding-left: 10px;
3318
    width: 100px;
3319
    border: none;
3320
}
3321

    
3322
.metadata-left {
3323
}
3324

    
3325
.metadata-right {
3326
    width: 73px;
3327
    float:left;
3328
    height: 35px;
3329
    padding-left: 5px;
3330
    position:relative;
3331
    overflow:hidden;
3332
}
3333

    
3334
.metadata-right .items {
3335
    position:absolute;
3336
    height:20000em;
3337
}
3338

    
3339
.metadata-keys-container {
3340
    height: 60px;
3341
    float: left;
3342
}
3343

    
3344
.single .metadata-keys-container {
3345
    float: none;
3346
    height: auto;
3347
    margin-bottom: 5px;
3348
}
3349

    
3350
.single a.manage-metadata {
3351
    font-size: 80%;
3352
    margin-left:4px;
3353
    color: #383838;
3354
}
3355

    
3356
a.manage-metadata, a.stats-report {
3357
    font-size: 100%;
3358
    color: black;
3359
    margin-left:17px;
3360
    text-decoration: underline;
3361
}
3362

    
3363
a.stats-report {
3364
    margin: 15px 0  0 80px;
3365
}
3366

    
3367
div.machine a.manage-metadata:hover {
3368
    background-color: transparent;
3369
}
3370

    
3371
.single .metadata-actions, .single .metadata-keys-container .items {
3372
    padding-left: 5px;
3373
}
3374
.metadata-actions, .metadata-keys-container .items{
3375
    margin-top: 5px;
3376
}
3377

    
3378
.singe .metadata-actions, .single .metadata-keys-container .items{
3379
    font-size: 80%;
3380
    line-height: 12px;
3381
    width: 300px;
3382
}
3383

    
3384
.metadata-actions .prev,  .metadata-actions .next{
3385
    float:left;
3386
    width:29px;
3387
    height:6px;
3388
    cursor: pointer;
3389
}
3390

    
3391
.metadata-actions .prev {
3392
    background: url("../images/roll-up.png") no-repeat scroll 0 0 transparent;
3393
}
3394

    
3395
.metadata-actions .next {
3396
    background: url("../images/roll-down.png") no-repeat scroll 0 0 transparent;
3397
}
3398

    
3399
.scrollable {
3400
    position:relative;
3401
    overflow:hidden;
3402
    height: 35px;
3403
    width: 120px;
3404
    margin-bottom:2px;
3405
}
3406

    
3407
.scrollable .items {
3408
    position:absolute;
3409
    height:20000em;
3410
}
3411

    
3412
/* single view */
3413
.single {
3414
    color: #383838;
3415
}
3416

    
3417
.single .column1 {
3418
    float: left;
3419
    margin: 1px 0 25px 17px;
3420
    width: 140px;
3421
}
3422

    
3423
.single .column1 .state {
3424
    float: left;
3425
    margin-left: 4px;
3426
    padding-bottom: 6px;
3427
    padding-top: 3px;
3428
    position: relative;
3429
    right: 0;
3430
    text-align: center;
3431
    width: 126px;
3432
}
3433

    
3434
.single .column1 .state-label {
3435
    padding-top: 5px;
3436
}
3437

    
3438
.single .column1 .indicators {
3439
    margin-right: 38px !important;
3440
}
3441

    
3442
.single div.connect-arrow {
3443
    margin-left: -17px;
3444
}
3445

    
3446
.single div.connect-border {
3447
    margin-left: -29px;
3448
}
3449

    
3450
.single .single-actions {
3451
    width: 150px;
3452
    height: 60px;
3453
    margin-bottom: 45px;
3454
    margin-left: -10px;
3455
}
3456

    
3457
.single .vm-actions .action-container {
3458
    margin-bottom: 1px;
3459
}
3460

    
3461
.single .vm-actions .action-container .confirm_single {
3462
    right: -45px;
3463
}
3464

    
3465
.single .vm-actions .action-container.destroy .confirm_single {
3466
}
3467

    
3468
.single .vm-actions .action-container.destroy {
3469
    bottom: -20px;
3470
}
3471

    
3472
.single a.single-action {
3473
    text-decoration: none;
3474
    cursor: pointer;
3475
    display: block;
3476
}
3477

    
3478
.single a.single-action:hover {
3479
    background-color:#A1C8DB;
3480
    width: 162px;
3481
    opacity: 0.8;
3482
    filter: alpha(opacity = 80);
3483
}
3484

    
3485
.single .destroy a.single-action.selected {
3486
    color: #880000 !important;
3487
}
3488

    
3489
.single a.single-action.selected {
3490
    color: #FF7F2A !important;
3491
    width: 50px !important;
3492
}
3493

    
3494
.single a.single-action.selected:hover {
3495
    background-color:transparent;
3496
}
3497

    
3498
.single .spinner, .single .action-indicator {
3499
    margin: 15px 45px 0 0px !important
3500
}
3501

    
3502
.single .action-indicator {
3503
    margin-right: 55px !important;
3504
}
3505

    
3506
.single .wave {
3507
    margin: 15px 53px 0 0px !important
3508
}
3509

    
3510
.icon div.action_error {
3511
    font-size: 100%;
3512
}
3513

    
3514
.single div.action_error {
3515
    position: absolute;
3516
    top: 29px;
3517
    right: 35px;
3518
}
3519

    
3520
.single .column2 {
3521
    background-color: #A1C8DB;
3522
    float: left;
3523
    font-size: 78%;
3524
    line-height: 17px;
3525
    margin: 0 0 10px 5px;
3526
    width: 358px;
3527
}
3528

    
3529
.single .column2 .machine-labels {
3530
    float: left;
3531
    font-size: 90%;
3532
    margin-left: 10px;
3533
    margin-top: 10px;
3534
    width: 125px;
3535
}
3536

    
3537
.single .machine-detail.title {
3538
    background-color: #74AEC9;
3539
    color: #fff;
3540
    padding: 4px 6px;
3541
    font-size: 0.8em;
3542
    width: 346px;
3543
    margin-left: 5px;
3544
    float: left;
3545
}
3546

    
3547
.single .column2 .machine-details {
3548
    float: right;
3549
    text-align: right;
3550
    font-size: 90%;
3551
    width: 210px;
3552
    margin-right: 10px;
3553
    margin-top: 10px;
3554
}
3555

    
3556
.single .column2 .name, .single .column2 .disk, .single .column2 .image-size, .single .column2 .ipv6 {
3557
    margin-bottom: 13px;
3558
}
3559

    
3560
.single .tags {
3561
    clear: both;
3562
    margin-bottom: 10px;
3563
    margin-left: 10px;
3564
}
3565

    
3566
.single .tags-label {
3567
    float: left;
3568
    padding: 0 5px;
3569
    width: 30px;
3570
}
3571

    
3572
.single .tags-down-arrow {
3573
    background: url("../images/tags-down-arrow.png") no-repeat scroll 1px 7px transparent;
3574
    float: left;
3575
    height: 16px;
3576
    width: 9px;
3577
}
3578

    
3579
.single .tags-header .info-header{
3580
    padding-top:0;
3581
    padding-bottom:0;
3582
}
3583

    
3584
.single .tags-header {
3585
    font-size: 0.62em;
3586
    cursor: pointer;
3587
    float: left;
3588
    margin-bottom:5px;
3589
}
3590

    
3591
.single .tags-header span.label {
3592
    font-size: 104%;
3593
}
3594

    
3595
.single .tags-content {
3596
    background-color: #84B7D0;
3597
    clear: both;
3598
    height: auto;
3599
    padding-bottom: 5px;
3600
    padding-top: 5px;
3601
    width: 300px;
3602
}
3603

    
3604
.single .column3 {
3605
    background-color: #A1C8DB;
3606
    width: 150px;
3607
    overflow: visible;
3608
    padding-bottom: 10px;
3609
    position: absolute;
3610
    right: 20px;
3611
    top: 130px;
3612
}
3613

    
3614
.single .col3 {
3615
    float: right;
3616
    width: 150px;
3617
    margin-right: 15px;
3618
    margin-bottom: 15px;
3619
}
3620

    
3621
.single .column3 .controls {
3622
    font-size: 80%;
3623
    height: 20px;
3624
    padding-left: 7px;
3625
    padding-right: 7px;
3626
    padding-top: 8px;
3627
    padding-bottom: 5px;
3628
    border-bottom: 1px solid #84B7D0;
3629
}
3630

    
3631
.single .column3 .vm-control:hover {
3632
    background-color: #5CA1C0;
3633
}
3634

    
3635
.single .column3 .previous {
3636
    float:left;
3637
    width: 72px;
3638
}
3639

    
3640
.single .column3 .next {
3641
    float: right;
3642
    text-align: center;
3643
    width: 60px;
3644
}
3645

    
3646
.single .column3 .next-label {
3647
    float: right;
3648
    margin-right: 3px;
3649
    margin-top: -2px;
3650
}
3651

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

    
3659
.single .column3 .prev-label {
3660
    float: left;
3661
    margin-left: 3px;
3662
    margin-top: -2px;
3663
}
3664

    
3665
.single .column3 .prev-arrow {
3666
    background: url("../images/left-arrow.png") no-repeat scroll 3px 2px transparent;
3667
    float: left;
3668
    height: 18px;
3669
    width: 10px;
3670
}
3671

    
3672
.single .column3 .separator {
3673
    width: 135px;
3674
    height: 1px;
3675
    background-color: #84B7D0;
3676
    margin: 0 0 0 7px;
3677
    clear: both;
3678
}
3679

    
3680
.single .column3 .servers {
3681
    font-size: 80%;
3682
    line-height: 15px;
3683
    padding-top: 10px;
3684
    text-align: right;
3685
    overflow: visible;
3686
    position: relative;
3687
}
3688

    
3689
.single .column3 .server-name {
3690
    margin-left: 10px;
3691
    padding-right: 5px;
3692
    cursor: pointer;
3693
    padding-bottom: 2px;
3694
}
3695
div.single div.column3 div.server-name:hover {
3696
    background-color: #5CA1C0;
3697
}
3698
.single .column3 .column3-selected {
3699
    background-color: #84B7D0;
3700
    color: white;
3701
    opacity: 0.8;
3702
    padding-left: 9px;
3703
    width: 160px;
3704
    filter: alpha(opacity = 80);
3705
    position: relative;
3706
    width: 126px;
3707
}
3708

    
3709
.single .toggler {
3710
    color: #FFFFFF;
3711
    float: right;
3712
    font-size: 140%;
3713
}
3714

    
3715
.single .cpu-usage, .single .network-usage {
3716
    text-align: center;
3717
    padding-top: 15px;
3718
    margin-bottom: 5px;
3719
    font-size: 90%;
3720
    font-weight: bold;
3721
}
3722

    
3723
.single .cpu-graph, .single .network-graph {
3724
    margin-left: 20px;
3725
    margin-bottom:30px;
3726
    width: 660px;
3727
}
3728

    
3729
.single div.lower .stats-select .stats-select-option.selected {
3730
    background-color: #4085A5;
3731
    color: #fff;
3732
}
3733

    
3734
.single div.lower .stats-select .stats-select-option {
3735
    cursor: pointer;
3736
    background-color: #DDF1FB;
3737
    color: #4085A5;
3738
    display: block;
3739
    float: left;
3740
    padding: 7px 10px;
3741
    font-size: 0.7em;
3742
}
3743

    
3744
.single div.lower img.stats {
3745
    margin-left: 82px;
3746
}
3747

    
3748
.single div.lower img.stats {
3749
    display: none;
3750
}
3751

    
3752
.single .single-image {
3753
    width: 126px;
3754
    height: 136px;
3755
    margin-bottom: 10px;
3756
    margin-left: 4px;
3757
    background-image: url("../images/icons/machines/large/unknown-sprite.png");
3758
    background-repeat: no-repeat;
3759
    cursor: pointer;
3760
}
3761

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

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

    
3770
.single .single-image-state4 {
3771
    background-position: -378px 0;
3772
}
3773

    
3774
.single .single-image-state2 {
3775
    background-position: -126px 0;
3776
}
3777

    
3778
.single .column3 .previous, .single .column3 .next {
3779
    cursor: pointer;
3780
    background-color: #84B7D0;
3781
    color: white;
3782
    font-size: 100%;
3783
    height: 15px;
3784
    padding-top: 2px;
3785
}
3786

    
3787
.single .column3 .disabled {
3788
    opacity: 0.5;
3789
    filter: alpha(opacity = 50);
3790
}
3791

    
3792
.single div.lower {
3793
    clear:both;
3794
    background: #EFF7FA repeat scroll 0 0;
3795
    width: 700px;
3796
    padding-bottom: 15px;
3797
}
3798

    
3799
.single div.upper {
3800
    background: transparent;
3801
    margin-bottom: 10px;
3802
    overflow: visible;
3803
    overflow: hidden;
3804
    width: 700px;
3805
    background: #EFF7FA repeat scroll 0 0;
3806
}
3807

    
3808
/* console css */
3809
.console-header-logo {
3810
    padding-top: 16px;
3811
    margin-left: 30px;
3812
    position: fixed;
3813
}
3814

    
3815
.console-header-logo img {
3816
    max-width:100%;
3817
    max-height:65px;
3818
}
3819

    
3820
#console-header div.help-text {
3821
    font-size: 70%;
3822
    font-weight:bold;
3823
    color:#FFFFFF;
3824
    position: absolute;
3825
    height: 20px;
3826
    top: 79px;
3827
}
3828

    
3829
div.console-container {
3830
    margin: 0 0em;
3831
    height: auto;
3832
}
3833

    
3834
#wrapper.console {
3835
    width: auto;
3836
}
3837

    
3838
.console-info {
3839
    font-size:80%;
3840
    color: white;
3841
    position:absolute;
3842
    margin: 15px 0 0 480px;
3843
}
3844

    
3845
applet {
3846
    width:100%;
3847
    height:100%;
3848
}
3849

    
3850
div.console-footer {
3851
    /* this is for version 0.5*/
3852
    display: none;
3853
}
3854

    
3855
.console-footer #footer-text{
3856
    float:left;
3857
    left: auto;
3858
    margin-left:30px;
3859
}
3860

    
3861
/* add network wizard (see also #wizard for shared classes) */
3862
#networks-wizard .header {
3863
    background-color: #4085A5;
3864
    height: 56px;
3865
}
3866

    
3867
#networks-wizard div.name-input {
3868
    margin: 75px 0 0 55px;
3869
}
3870

    
3871
#networks-wizard input {
3872
    border: 1px solid #CCCCCC;
3873
    color: #445566;
3874
    letter-spacing: 1px;
3875
    width: 170px;
3876
}
3877

    
3878
#networks-wizard span.help {
3879
    font-style: italic;
3880
    font-size: 80%;
3881
    margin-left: 10px;
3882
}
3883

    
3884
#networks-wizard .separator-end {
3885
    background-color: #387693;
3886
    height: 6px;
3887
    width: 479px;
3888
    margin-left: -13px;
3889
    margin-top: 19px;
3890
}
3891

    
3892
.red {
3893
    color: red;
3894
}
3895

    
3896
/* add server to network wizard (see also #metadata-wizard for shared classes) */
3897
#add-machines-wizard span.machine-name {
3898
    margin-left: 4px;
3899
    vertical-align: text-top;
3900
}
3901

    
3902
#add-machines-wizard img.list-logo {
3903
    margin: 2px 1px 1px;
3904
}
3905

    
3906
.css-panes {
3907
    clear: both;
3908
    position: relative;
3909
    z-index: 10;
3910
}
3911

    
3912
.last .firewall-content {
3913
}
3914

    
3915
#pub .last .network-separator {
3916
    display:none;
3917
}
3918

    
3919
.public-networks .empty-network-slot {
3920
    display: none;
3921
}
3922

    
3923
.clearfix {
3924
    display: block;
3925
    width: auto;
3926
    zoom: 1;
3927
}
3928

    
3929
/* float clearing for all browsers except the devil one */
3930
.clearfix:after{
3931
  clear: both;
3932
  content: ".";
3933
  display: block;
3934
  height: 0;
3935
  visibility: hidden;
3936
  font-size: 0;
3937
}
3938

    
3939
* html .clearfix {
3940
    display: inline-block;
3941
}
3942

    
3943
.icon .cont-toggler {
3944
    margin-top: -1px;
3945
}
3946

    
3947
.icon .wave {
3948
    margin-right: 4px !important;
3949
    margin-top: 15px !important;
3950
}
3951

    
3952
.icon .status {
3953
    margin-right: 3px;
3954
}
3955

    
3956
#machinesview .status, .single .state {
3957
    font-size: 75%;
3958
}
3959

    
3960
#machinesview-list div.action-indicator {
3961
    margin:0 !important;
3962
    float: none !important;
3963
}
3964

    
3965
.icon div.action-indicator {
3966
    margin-top: 14px;
3967
    margin-right: 4px;
3968
}
3969

    
3970
div.action-indicator {
3971
    width: 15px;
3972
    height: 20px;
3973
    background-repeat: no-repeat;
3974
    background-position: 0 0;
3975
}
3976

    
3977
tbody.machines div.action-indicator {
3978
    position: relative;
3979
    top: -2px;
3980
}
3981
div.state .destroy, tbody.machines .destroy {
3982
    background-image: url("../images/icons/actions/medium/destroy.png");
3983
}
3984
div.state .console, tbody.machines .console {
3985
    background-image: url("../images/icons/actions/medium/console.png");
3986
}
3987
div.state .start, tbody.machines .start {
3988
    background-image: url("../images/icons/actions/medium/start.png");
3989
}
3990
div.state .reboot, tbody.machines .reboot {
3991
    background-image: url("../images/icons/actions/medium/reboot.png");
3992
}
3993
div.state .shutdown, tbody.machines .shutdown {
3994
    background-image: url("../images/icons/actions/medium/shutdown.png");
3995
}
3996

    
3997
h3.overlay-inner-title {
3998
    color: #4085A5;
3999
    font-size: 2em;
4000
}
4001

    
4002
#add-name-container {
4003
    margin-bottom: 10px;   
4004
}
4005

    
4006
.remove-field-trigger, .add-field-trigger {
4007
    cursor: pointer;
4008
}
4009

    
4010
.add-field-trigger img {
4011
    vertical-align: middle;
4012
}
4013

    
4014
.machine-now-building {
4015
    padding-right: 15px !important;
4016
    text-align: justify;
4017
}
4018

    
4019
.sub-text {
4020
    padding-top: 15px;
4021
    padding-right: 15px;
4022
    text-align: justify;
4023
    font-style: italic;
4024
    font-size: 0.8em !important;
4025
}
4026

    
4027
#notification-box a {
4028
    color: #4085A5;
4029
}
4030

    
4031
#notification-box .machine-title img {
4032
    vertical-align: middle;
4033
}
4034

    
4035
#notifiaction-box .password-header {
4036
    margin-bottom: 0 !important;
4037
}
4038

    
4039
#notification-box .password-container a {
4040
    color: #fff;
4041
    text-decoration: underline;
4042
}
4043

    
4044
#notification-box .password-container a:hover {
4045
    background-color: #fff;
4046
    color: #4085A5;
4047
}
4048

    
4049
#notification-box .password-container {
4050
    background: #4085A5;
4051
    border: none;
4052
}
4053

    
4054
#notification-box .password-container .password a {
4055
    font-weight: normal !important;
4056
}
4057

    
4058
#notification-box .cmd {
4059
    color: #fff;
4060
    font-family: monospace;
4061
    font-size: 1.6em;
4062
}
4063

    
4064
.machine-container .separator {
4065
    background-color: #B0D1E0;
4066
}
4067

    
4068
#creation-password-overlay div.password-cont {
4069
    margin: 10px auto;
4070
    padding: 10px;
4071
    border: 2px solid #75B54A;
4072
    background-color: #AADE87;
4073
    color: #447821;
4074
    text-align: left;
4075
    padding-left: 5em;
4076
    position: relative;
4077
}
4078

    
4079
#creation-password-overlay {
4080
    position: relative;
4081
}
4082

    
4083
#creation-password-overlay .form-action {
4084
    position: absolute;
4085
    bottom: 15px;
4086
    right: 13px;
4087
    font-size: 0.8em;
4088
}
4089

    
4090
#creation-password-overlay .password-label {
4091
    float: left;
4092
}
4093

    
4094
#creation-password-overlay .password {
4095
    font-size: 1.5em;
4096
    font-weight: bold;
4097
    letter-spacing: 2px;
4098
    font-family: Georgia, Times, serif;
4099
    margin-right: 5em;
4100
    float: right;
4101
    margin-top: -4px;
4102
}
4103

    
4104
.feedback-form .description {
4105
    margin-bottom: 25px;
4106
}
4107

    
4108
.feedback-form label {
4109
    display: block;
4110
    font-weight: bold;
4111
    margin-bottom: 10px;
4112
    font-size: 0.8em;
4113
}
4114

    
4115
.feedback-form .form-actions {
4116
    border-top: none;
4117
}
4118

    
4119
.nospace {
4120
    padding-top: 0 !important;
4121
    padding-bottom: 0 !important;
4122
}
4123

    
4124
.noborder {
4125
    border-top: none !important;
4126
    border-bottom: none !important;
4127
}
4128

    
4129
.overlay .feedback-form .messages.description {
4130
    padding-bottom:0;
4131
    margin-bottom: 0;
4132
}
4133

    
4134
.feedback-form .messages .error-message {
4135
    color: #f00;
4136
}
4137

    
4138
.feedback-form .messages .success-message {
4139
    color: #8AA87F;
4140
}
4141

    
4142
.feedback-form .feedback-message {
4143
    width: 548px;
4144
    height: 200px;
4145
    border: 1px solid #ddd;
4146
    padding: 5px;
4147
}
4148

    
4149
#feedback-form .empty-error-msg {
4150
    display: none;
4151
}
4152

    
4153
#feedback-form .data-text {
4154
    display: none;
4155
}
4156

    
4157
#feedback-form .message {
4158
    display: none;
4159
}
4160

    
4161
#feedback-form label {
4162
    display: block;
4163
    font-size: 0.85em;
4164
    font-weight: bold;
4165
}
4166

    
4167
#feedback-form label.inline {
4168
    display: inline;
4169
    padding-left: 5px;
4170
}
4171

    
4172
#feedback-form p {
4173
    padding: 1em 0;
4174
    color: #444;
4175
    margin-bottom: 10px;
4176
}
4177

    
4178
#feedback-form .description {
4179
    font-style: italic;
4180
    font-size: 0.9em;
4181
    color: #888;
4182
}
4183

    
4184
#feedback-form .feedback-text {
4185
    width: 98%;
4186
    height: 100px;
4187
    margin-top: 10px;
4188
    margin-bottom: 10px;
4189
}
4190

    
4191
#feedback-form .submit-data {
4192
    display: none;
4193
}
4194

    
4195
#feedback-form .submit, #invform .submit {
4196
    background-color: #4085A5;
4197
    color: #fff;
4198
    border: none;
4199
    padding: 5px 16px;
4200
    cursor: pointer;
4201
    font-size: 1em;
4202
    position: relative;
4203
}
4204

    
4205
#feedback .submit {
4206
    float: right;
4207
    right: 10px;
4208
    margin-top: 10px;
4209
}
4210

    
4211

    
4212
#feedback-form .submit:hover, #invform .submit:hover {
4213
    background-color: #549FC3;
4214
}
4215

    
4216
.feedback-intro {
4217
    padding-right: 15px !important;
4218
    text-align: justify;
4219
}
4220

    
4221
.popup-body .message {
4222
    padding: 20px 5px;
4223
    display: none;
4224
}
4225

    
4226
.popup-body .loading {
4227
    color: #fff;
4228
}
4229

    
4230
.popup-body .success {
4231
    color: #1F921A;
4232
}
4233

    
4234
.popup-body .errormsg {
4235
    color: #E32424;
4236
}
4237

    
4238

    
4239
.close-msg-box {
4240
    display: block;
4241
    margin-top: 10px;
4242
    cursor: pointer;
4243
    color: #4085A5;
4244
    text-decoration: underline;
4245
}
4246

    
4247

    
4248
.console .ip-version-label {
4249
    margin: 0 5px;
4250
}
4251

    
4252
.ipv6-text, .ipv4-text {
4253
    font-size: 0.9em;
4254
}
4255

    
4256
.tooltip {
4257
    background-color: #C4DDE9;
4258
    color: #000;
4259
    font-size: 0.7em;
4260
    padding: 0.2em 0.5em;
4261
    border: 1px solid #888;
4262
    z-index: 50000;
4263
}
4264

    
4265
/*404 and 500 pages*/
4266

    
4267
.error_page {
4268
    position: relative;
4269
    top: 40px;
4270
    padding-bottom: 140px !important;
4271
}
4272

    
4273
.error_page h1 {
4274
    font-weight: normal;
4275
}
4276

    
4277
.error_page .msg_header {
4278
    margin: 0px;
4279
    font-size: 10em;
4280
    position: absolute;
4281
    left: -5px;
4282
    top: 0px;
4283
    color: #4085A5;
4284
    font-family: arial, verdana;
4285
}
4286

    
4287
.error_page p.error_desc {
4288
    color: #fff;
4289
    font-size: 0.8em;
4290
}
4291

    
4292
.error_page {
4293
    padding-right: 50px !important;
4294
    padding-left: 100px !important;
4295
}
4296

    
4297
.error_page .error_content {
4298
    padding-left: 150px;
4299
    padding-top: 97px;
4300
}
4301

    
4302
.error_page .error_content .links, .info_content .links {
4303
    margin-top: 10px;
4304
    margin-left: 20px;
4305
}
4306

    
4307
.error_page .http_error .code {
4308
    letter-spacing: -10px;
4309
    font-size: 9em;
4310
}
4311

    
4312
.error_page .http_error .msg {
4313
    letter-spacing: -1px;
4314
    font-size: 2em;
4315
}
4316

    
4317
.error_page .http_error {
4318
    position: absolute;
4319
    right: 0px;
4320
    bottom: 0px;
4321
    color: #75B3D0;
4322
    line-height: 1em;
4323
}
4324

    
4325
.error_page .error_content a, .info_content .links a {
4326
    color: #4085A5;
4327
    font-weight: bold;
4328
    margin-right: 10px;
4329
    font-size: 0.9em;
4330
}
4331

    
4332
.error_body #container, .info_body #container {
4333
    background-position: right 200px;
4334
}
4335

    
4336
.info_page h1 {
4337
    color: #4085A5;
4338
    font-size: 2em;
4339
    font-weight: normal;
4340
}
4341

    
4342
.info_page p {
4343
    color: #ffffff;
4344
    margin: 1em 0;
4345
}
4346

    
4347
.info_body p a, .error_body p a{
4348
    color: #4085A5;
4349
    text-decoration: underline;
4350
}
4351

    
4352
.error_404 .http_error .code {
4353
    letter-spacing: -7px;
4354
}
4355

    
4356
.network-progress-indicator {
4357
    position: relative;
4358
    display: none;
4359
}
4360

    
4361
.network-progress-indicator img {
4362
    position: absolute;
4363
    bottom: 44px;
4364
    left: 340px;
4365
}
4366

    
4367

    
4368
.single .progress-message {
4369
    margin-top: 90px;
4370
    font-size: 0.6em;
4371
    padding: 0 10px;
4372
    text-align: center;
4373
}
4374

    
4375
/*metadata keys/values*/
4376
.items .tag-item  {
4377
    display: block;
4378
}
4379

    
4380
.single .items .tag-item .key {
4381
    width: 60px;
4382
}
4383

    
4384
.running .scrollable, .terminated .scrollable {
4385
    height: 42px;
4386
}
4387

    
4388
.items .tag-item .key {
4389
    margin-right: 5px;
4390
    width: 30px;
4391
    display: block;
4392
    float: left;
4393
    color: #000;
4394
}
4395

    
4396
.items .tag-item .value {
4397
    color: #444;
4398
}
4399

    
4400
#machinesview-list {
4401
    display: none;
4402
}
4403

    
4404
#machinesview-single {
4405
    position: relative;
4406
    display: none;
4407
}
4408

    
4409
#machinesview-icon {
4410
    display: none;
4411
}
4412

    
4413
#machinesview-icon, #machinesview-single, #machinesview-list {
4414
    
4415
}
4416

    
4417
tbody.machines .spinner {
4418
    margin-top: 0!important;
4419
    margin: 0 !important;
4420
    float: none !important;
4421
}
4422

    
4423
.slider .slider-point {
4424
    width: 4px;
4425
    height: 3px;
4426
    margin-left: 1px;
4427
    background-color: transparent;
4428
    display: block;
4429
    position: absolute;
4430
    z-index: 10;
4431
    bottom: 0px;
4432
}
4433

    
4434
.slider .slider-point-light {
4435
    background-color: transparent;
4436
}
4437

    
4438
.slider-point-text {
4439
    font-size: 0.6em;
4440
    position: absolute;
4441
    top: 4px;
4442
    border-top: 5px solid #C5DEE9;
4443
    padding: 3px;
4444
    color: #4085A5;
4445
    display: block;
4446
    min-width: 6px;
4447
    text-align: middle;
4448
}
4449

    
4450
.slider .handle {
4451
    z-index: 50;
4452
}
4453

    
4454
.modal p.desc {
4455
    margin: 5px 0;
4456
    margin-left: 37px;
4457
    font-size: 0.8em;
4458
    color: #888;
4459
}
4460

    
4461
.api_overlay_template {
4462
    display: none;
4463
}
4464

    
4465
.api_content .password-container .password {
4466
    color: #fff;
4467
    font-size: 1.1em;
4468
}
4469

    
4470
#disks-pane {
4471
    margin-top: 58px;
4472
}
4473

    
4474
span.resend-msg {
4475
    display: block;
4476
    margin-bottom: 5px;
4477
}
4478

    
4479
.success-msg {
4480
    background-color: #5CAD54;
4481
    color: #fff;
4482
    padding: 0.4em;
4483
    border: 1px solid #ddd;
4484
}
4485

    
4486
.error-msg {
4487
    background-color: #800000;
4488
    color: #fff;
4489
    padding: 0.4em;
4490
    border: 1px solid #ddd;
4491
}
4492

    
4493
.success-msg em, .error-msg em {
4494
    font-weight: bold;
4495
    font-style: normal;
4496
    font-size: 0.9em;
4497
}
4498

    
4499
.pagination {
4500
            font-size: 80%;
4501
        }
4502
        
4503
.pagination a {
4504
    text-decoration: none;
4505
        border: solid 1px #AAE;
4506
        color: #15B;
4507
}
4508

    
4509
.pagination a, .pagination span {
4510
    display: block;
4511
    float: left;
4512
    padding: 0.3em 0.5em;
4513
    margin-right: 5px;
4514
        margin-bottom: 5px;
4515
        min-width:1em;
4516
        text-align:center;
4517
}
4518

    
4519
.pagination .current {
4520
    background: #4085A5;
4521
    color: #fff;
4522
        border: solid 1px #AAE;
4523
}
4524

    
4525
.pagination .current.prev, .pagination .current.next{
4526
        color:#999;
4527
        border-color:#999;
4528
        background:#fff;
4529
}
4530

    
4531
table.list-machines .wave {
4532
    float: none !important;
4533
    margin: 0 !important;
4534
}
4535

    
4536
.overlay {
4537
    display: none;
4538
}
4539

    
4540
.overlay .copy-content .clip-copy  {
4541
    right: 10px;
4542
    top:8px;
4543
    border: 1px solid #fff;
4544
}
4545

    
4546
.overlay .copy-content {
4547
    background-color: #387693;
4548
    color: #fff;
4549
    padding: 10px;
4550
    font-size: 1.2em;
4551
    text-align: center;
4552
    position: relative;
4553
}
4554

    
4555
.overlay {
4556
    background-color: #fff;
4557
    border: 2px solid #444;
4558
    text-align: left;
4559

    
4560
    -moz-box-shadow: 0 0 90px 5px #000;
4561
    -webkit-box-shadow: 0 0 90px 5px #000;
4562
    box-shadow: 0 0 90px 5px #000;
4563
    width: 600px;
4564
}
4565

    
4566
.overlay.overlay-createvm {
4567
    width: 640px;
4568
}
4569

    
4570
.overlay a {
4571
    color: #387693;
4572
}
4573

    
4574
.overlay .diagnostics-list {
4575
    height: 400px;
4576
    overflow: scroll;
4577
    overflow-y: scroll;
4578
    overflow-x: hidden;
4579
}
4580

    
4581
.overlay .overlay-content .description.subinfo, .overlay .extra-info {
4582
    margin-bottom:0;
4583
    border-bottom: none;
4584
    padding-bottom:0;
4585
    margin-top: 10px;
4586
    padding-top:10px;
4587
    border-top: 1px solid #64a6c4;
4588
    /*border-top: 1px solid #DBE6EB;*/
4589
    font-size: 0.8em;
4590
}
4591

    
4592
.overlay .overlay-content .important {
4593
    color: #800000;
4594
}
4595

    
4596
.overlay .overlay-content .description.noborder {
4597
  margin-bottom:0;
4598
  border:0;
4599
}
4600

    
4601
.overlay .overlay-content .description {
4602
    color: #444;
4603
    border-bottom: 1px solid #64a6c4;
4604
    margin-bottom: 10px;
4605
    padding-bottom: 10px;
4606
    font-size: 0.9em;
4607
    line-height: 1.6em;
4608
}
4609

    
4610
.overlay .overlay-content .empty-message {
4611
    margin-bottom: 5px;
4612
}
4613

    
4614
.overlay h3.overlay-header {
4615
    font-size: 0.9em;
4616
    text-align: left;
4617
    padding: 0.8em;
4618
    padding-left: 1em;
4619
    font-weight: normal;
4620
    border-bottom: 1px solid #ddd;
4621
}
4622

    
4623
.overlay h3.overlay-header .title {
4624
    float: left;
4625
}
4626

    
4627
.overlay .container {
4628
    position: relative;
4629
    padding-top: 1em;
4630
    padding: 0.5em;
4631
    background-image: url("../images/popup-bg.png");
4632
    background-repeat: repeat-x;
4633
}
4634

    
4635
.overlay .content {
4636
    background-color: transparent;
4637
    background-image: url("../images/popup-inner-bg.png");
4638
    padding: 1em;
4639
    font-size: 0.8em;
4640
    background-repeat: repeat-x;
4641
    -moz-box-shadow: 0 0 1px 1px #888;
4642
    -webkit-box-shadow: 0 0 1px 1px #888;
4643
    box-shadow: 0 0 1px 1px #888;
4644
}
4645

    
4646
.overlay .message {
4647
}
4648

    
4649
.overlay .actions {
4650
    position: absolute;
4651
    right: 0.75em;
4652
    top: 0.6em;
4653
}
4654

    
4655
.overlay .actions span {
4656
    font-size: 0.8em;
4657
    color: #fff;
4658
    cursor: pointer;
4659
    margin-left: 10px;
4660
    display: block;
4661
    float: left;
4662
    background-color: #4085A5;
4663
    padding: 0.2em 0.4em;
4664
}
4665

    
4666
.overlay-error .error-more-details {
4667
    margin-top: 5px;
4668
    max-height: 210px;
4669
    overflow: auto;
4670
}
4671

    
4672
.overlay-error .key.details.expand {
4673
    background-image: url("../images/plus-8.png");
4674
}
4675

    
4676
.overlay-error .key.details {
4677
    background-color: #5189A3;
4678
    cursor: pointer;
4679
    background-image: url("../images/minus-8.png");
4680
    background-repeat: no-repeat;
4681
    background-position: 545px;
4682
}
4683

    
4684
.overlay-error .container {
4685
    padding-top: 1.9em;
4686
}
4687

    
4688
.overlay-error .error-details {
4689
    font-size: 0.8em;
4690
    margin-top: 10px;
4691
}
4692

    
4693
.overlay-error .error-details anonymous {
4694
    display: block;
4695
    margin-top: 10px;
4696
}
4697

    
4698
.overlay-error h3.overlay-header {
4699
    background-color: #800000;
4700
    color: #fff;
4701
}
4702

    
4703
.overlay-error.non-critical h3.overlay-header {
4704
    background-color: #987249;
4705
}
4706

    
4707
.overlay-error span.key {
4708
    font-weight: normal;
4709
    display: block;
4710
    margin-top: 0.5em;
4711
    background-color: #74AEC9;
4712
    color: #fff;
4713
    padding: 0.4em;
4714
    font-size: 0.8em;
4715
    font-weight: bold;
4716
}
4717

    
4718
.overlay-error .indicator {
4719
    background-color: #880000;
4720
    color: #fff;
4721
    padding: 4px;
4722
    display: block;
4723
    float: left;
4724
    border: 1px solid #444;
4725
}
4726

    
4727
.overlay-error .nav-btn:hover {
4728
    
4729
}
4730

    
4731
.overlay-error .nav-btn {
4732
    margin-left: 5px;
4733
    color: #fff;
4734
    display: block;
4735
    float: left;
4736
    padding: 4px;
4737
    background-color: #AAA;
4738
    border: 1px solid #444;
4739
}
4740

    
4741
.overlay-error .error-nav {
4742
    position: absolute;
4743
    right: 0px;
4744
    bottom: -25px;
4745
    font-size: 0.8em;
4746
}
4747

    
4748
.overlay-error span.value, .overlay-error div.value {
4749
    padding: 0.4em;
4750
    display: block;
4751
    margin-bottom: 0.3em;
4752
}
4753

    
4754
.overlay h3 .closeme {
4755
    float: right;
4756
    font-size: 0.7em;
4757
    margin-top: 0.2em;
4758
    cursor: pointer;
4759
}
4760

    
4761
.overlay .overlay-header .subtitle {
4762
    display: block;
4763
    font-size: 0.8em;
4764
    color: #ddd;
4765
}
4766

    
4767
.overlay .overlay-header .subtitle img {
4768
    vertical-align: middle;
4769
    margin-left: 10px;
4770
    margin-bottom: 2px;
4771
}
4772

    
4773
.overlay-info .msg-log-entry .src {
4774
    color: #4085A5;
4775
    float: right;
4776
    font-size: 0.9em;
4777
}
4778

    
4779
.overlay-info .msg-log-entry .date {
4780
    font-style: italic;
4781
}
4782

    
4783
.overlay-info .msg-log-entry pre {
4784
    color: #333;
4785
    width: 100%;
4786
    display: none;
4787
    margin: 10px 0;
4788
}
4789

    
4790
.msg-log-entry.warning {
4791
    color: #E57F01;
4792
}
4793

    
4794
.overlay-info .msg-log-entry.with-details .src {
4795
    margin-right: 15px;
4796
}
4797

    
4798
.overlay-info .msg-log-entry.with-details {
4799
    cursor: pointer;
4800
}
4801

    
4802
.overlay-info .msg-log-entry.with-details {
4803
    background-image: url("../images/plus-8-dark.png");
4804
    background-repeat: no-repeat;
4805
    background-position: 99% 9px;
4806
}
4807

    
4808
.overlay-info .msg-log-entry.with-details.expanded {
4809
    background-image: url("../images/minus-8-dark.png");
4810
}
4811

    
4812
.overlay-info .msg-log-entry .msg {
4813
    display: inline-block;
4814
    margin-left: 10px;
4815
}
4816

    
4817
.overlay-info .msg-log-entry {
4818
    border-bottom: 1px solid #aaa;
4819
    padding: 5px;
4820
}
4821

    
4822
.overlay-info .description.subinfo {
4823
    border: none !important;
4824
    padding-top: 0 !important;
4825
}
4826

    
4827
.overlay-info .content {
4828
    background-repeat: no-repeat;
4829
    background-position: 110% 110%;
4830
    background-color: rgba(255,255,255,0.6)
4831
}
4832

    
4833
.overlay-info .overlay-header {
4834
    background-color: #4085A5;
4835
}
4836

    
4837
.overlay-info .overlay-header .title {
4838
    color: #fff;
4839
}
4840

    
4841
.overlay-info .overlay-header .closeme {
4842
    color: #fff;
4843
}
4844

    
4845
#loading-view {
4846
    width: 400px;
4847
    margin: 0 auto;
4848
    padding: 20px 0;
4849
    font-size: 0.8em;
4850
}
4851

    
4852
#loading-view .header.off {
4853
    color: #829096;
4854
}
4855

    
4856
#loading-view .header.on {
4857
    color: #fff;
4858
    background-image: url("../images/icons/indicators/small/progress.gif");
4859
}
4860

    
4861
#loading-view .header.done {
4862
    color: #2B6681;
4863
    background-image: url("../images/check.png");
4864
}
4865

    
4866
#loading-view .header {
4867
    font-size: 0.9em;
4868
    text-align: left;
4869
    border-bottom: 1px solid #578BA3;
4870
    margin-bottom: 10px;
4871
    padding-bottom: 6px;
4872
    background-repeat: no-repeat;
4873
    background-position: 380px 0px;
4874
}
4875

    
4876
#loading-view .header span {
4877
    font-weight: bold;
4878
    color: #4085A5;
4879
}
4880

    
4881
#loading-view .info {
4882
    color: #ddd;
4883
}
4884

    
4885
.options-list {
4886
    margin-top: 0.5em;
4887
    font-size: 0.8em;
4888
}
4889

    
4890
.options-list.five li {
4891
    float: left;
4892
    display: block;
4893
    width: 20%;
4894
    margin-bottom: 5px;
4895
}
4896

    
4897
.options-list.five li:nth-child(5n) .options-object-cont {
4898
    margin-right: 0;
4899
}
4900

    
4901
.options-object-cont input {
4902
    border: 1px solid #aaa;
4903
    width: 92px;
4904
    padding: 0;
4905
    margin: 0;
4906
    margin-top:3px;
4907
    padding: 2px;
4908
}
4909

    
4910
.options-list.three li {
4911
    float: left;
4912
    display: block;
4913
    width: 33%;
4914
    margin-bottom: 5px;
4915
}
4916

    
4917
.meta-list .options-list li.options-object.create .options-object-cont {
4918
    background-image: url("../images/option-action-add.png");
4919
    background-repeat: no-repeat;
4920
    background-position: 90px 5px;
4921
}
4922

    
4923
.meta-list .options-list li .options-object-cont .option-action,
4924
.meta-list .options-list li.options-object.create {
4925
    cursor: pointer !important;
4926
}
4927

    
4928
.meta-list .options-list li .options-object-cont {
4929
    cursor: inherit;
4930
}
4931

    
4932
.options-list li .options-object-cont {
4933
    padding: 5px;
4934
    margin-right: 4px;
4935
    border: 1px solid #A6D1E6;
4936
    cursor: pointer;
4937
    min-height: 35px;
4938
    position: relative;
4939
}
4940

    
4941
.options-list.three li:nth-child(3n) .options-object-cont {
4942
    margin-right: 0;
4943
}
4944

    
4945
.options-list li.selected .options-object-cont {
4946
    background-color: #efefef;
4947
    border: 2px solid #4085A5;
4948
    padding: 4px;
4949
}
4950

    
4951
.options-list li.selected .options-object-cont .title {
4952
}
4953

    
4954
.options-list li.options-object .title {
4955
    display: block;
4956
    color: #FF7F2A;
4957
    margin-bottom: 2px;
4958
}
4959

    
4960
.options-list li .option-action {
4961
    display: none;
4962
    position: absolute;
4963
    background-repeat: no-repeat;
4964
}
4965

    
4966
.options-list.five li.editing {
4967
    width: 40%;
4968
}
4969

    
4970
.options-list.five li.editing .value {
4971
    display: none;
4972
}
4973

    
4974
.options-list li .remove {
4975
    background-image: url("../images/option-action-remove.png");
4976
    width:10px;
4977
    height:10px;
4978
    right:5px;
4979
    top: 5px;
4980
}
4981

    
4982
.options-list li .edit {
4983
    background-image: url("../images/option-action-edit.png");
4984
    width:10px;
4985
    height:10px;
4986
    right:5px;
4987
    bottom: 8px;
4988
}
4989

    
4990
.options-list li:hover .option-action  {
4991
    display: block;
4992
}
4993

    
4994
.options-list li.options-object .value {
4995
    color: #4085A5;
4996
    margin-top: 5px;
4997
    display: block;
4998
}
4999

    
5000
.options-list li.selected.options-object .value {
5001
}
5002

    
5003
.options-list li .options-object-cont:hover {
5004
    background-color: #fff;
5005
}
5006

    
5007
.options-list li.selected .options-object-cont:hover {
5008
    background-color: #fff;
5009
}
5010

    
5011
.options-list li img {
5012
    float: left;
5013
    margin:2px;
5014
    margin-right: 10px;
5015
    padding-bottom:10px;
5016
}
5017

    
5018
#network-vms-select-content li.options-object .value {
5019
    margin-top: 10px;
5020
    margin-left: 30px;
5021
}
5022

    
5023
#network-vms-select-content li.options-object:hover .options-object-cont,
5024
#network-vms-select-content li.options-object .options-object-cont {
5025
    background-image: url("../images/option-action-add-dark.png");
5026
    background-repeat: no-repeat;
5027
    background-position: 160px 28px;
5028
}
5029

    
5030
#network-vms-select-content li.selected:hover .options-object-cont,
5031
#network-vms-select-content li.selected .options-object-cont {
5032
    background-image: url("../images/option-action-remove.png") !important;
5033
}
5034

    
5035
#metadata-overlay-content .view .value {
5036
    margin-top: 10px;
5037
}
5038

    
5039
#metadata-overlay-content {
5040
    position: relative;
5041
}
5042

    
5043
.vm-meta .editor .predefined .predefined-meta-key:hover {
5044
    background-color: #4e8eac;
5045
    color: #fff;
5046
}
5047

    
5048
.vm-meta .editor .predefined .predefined-meta-key {
5049
    float: left;
5050
    margin-right: 5px;
5051
    padding: 4px;
5052
    display: block;
5053
    cursor: pointer;
5054
}
5055

    
5056
.vm-meta .editor .predefined {
5057
    background-color: #A6D1E6;
5058
    font-size: 0.9em;
5059
    border-top: 1px solid #ddd;
5060
}
5061

    
5062
.vm-meta .editor input {
5063
}
5064
.vm-meta .editor {
5065
    margin-bottom: 10px;
5066
}
5067

    
5068
.vm-meta .editor .form-actions .form-action {
5069
    min-width: 50px;
5070
}
5071

    
5072
.vm-meta .editor .form-field input.meta-key {
5073
    width: 90px;
5074
}
5075

    
5076
.vm-meta .form-field {
5077
    float: left;
5078
}
5079

    
5080
.vm-meta .form-actions .form-action {
5081
    float: left;
5082
    margin-right: 10px;
5083
    height: 11px;
5084
}
5085

    
5086
.vm-meta .editor .form-actions .cancel {
5087
    margin-right: 0;
5088
}
5089

    
5090
.vm-meta .editor .form-actions {
5091
    float: right;
5092
    margin:0;
5093
    padding:0;
5094
    margin-left: 15px;
5095
    margin-top: 0px;
5096
}
5097

    
5098
.vm-meta .editor {
5099
    background-color: rgba(64, 133, 165, 0.898) !important;
5100
    background-color: #649DB8;
5101
    font-size:0.9em;
5102
}
5103

    
5104
.vm-meta .meta-key-title {
5105
    font-size: 1.3em;
5106
    color: #fff;
5107
    margin-bottom: 10px;
5108
    display: none;
5109
    float: left;
5110
}
5111

    
5112
.vm-meta .editor-content {
5113
    padding: 10px;
5114
}
5115

    
5116
.vm-meta .inner-mask {
5117
    background-color: #fff;
5118
    opacity:0.6;
5119
    position: absolute;
5120
    top:0;
5121
    left:0;
5122
}
5123

    
5124
.vm-meta .editor label {
5125
    float: left;
5126
    color: #fff;
5127
    margin-right: 2px;
5128
    padding-top:4px;
5129
    font-size: 0.9em;
5130
}
5131

    
5132
.vm-meta .editor input {
5133
    border: none;
5134
    width: 170px;
5135
    margin-left: 10px;
5136
    font-size: 0.9em;
5137
    padding: 4px;
5138
}
5139

    
5140
.vm-meta li.create .options-object-cont {
5141
    background-color: #B3C9AD ;
5142
    border-color: #788774;
5143
}
5144
.vm-meta li.create .options-object-cont .value,
5145
.vm-meta li.create .options-object-cont .title {
5146
    color: #fff;
5147
}
5148

    
5149
#createvm-overlay-content {
5150
    padding: 0;
5151
}
5152

    
5153
.overlay-createvm .container {
5154
    width: 624px !important;
5155
}
5156

    
5157
.create-vm .header-step.current {
5158
    font-weight: bold;
5159
}
5160

    
5161
.create-vm .create-step-cont {
5162
    min-height: 240px;
5163
}
5164
.create-vm .create-controls {
5165
    padding: 10px;
5166
}
5167

    
5168
.create-vm ul li {
5169
    cursor: pointer;
5170
    padding: 4px;
5171
}
5172

    
5173
.create-vm ul li.selected {
5174
    background-color: #aaa;
5175
}
5176

    
5177
.cont-toggler {
5178
    background-image: url("../images/down-arrow.png");
5179
    background-position: right;
5180
    background-repeat: no-repeat;
5181
    background-color: #A1C8DB;
5182
    display: inline-block;
5183
    border-right: 6px solid #A1C8DB;
5184
    padding:2px;
5185
    padding-right: 14px;
5186
    padding-left:0;
5187
    cursor: pointer;
5188
    color: #fff;
5189
    font-size: 0.9em;
5190
}
5191

    
5192
.cont-toggler .label {
5193
    background-color: #98BDCF;
5194
    padding: 2px;
5195
    padding-left: 5px;
5196
    padding-right: 5px;
5197
}
5198

    
5199
.cont-toggler.open {
5200
    background-color: #98BDCF;
5201
    border-color: #98BDCF;
5202
    background-image: url("../images/up-arrow.png");
5203
}
5204

    
5205
.cont-toggler.open .label {
5206
    background-color: #4085A5;
5207
}
5208

    
5209
.overlay .form label {
5210
    font-color: #444;
5211
    margin-right: 10px;
5212
}
5213

    
5214
.form-field.error label {
5215
    color: #ff0000;
5216
    text-decoration: underline;
5217
}
5218

    
5219
.form-field input {
5220
    border: 1px solid #aaa;
5221
    width: 200px;
5222
    padding: 3px;
5223
}
5224

    
5225
.form-actions {
5226
    margin-top: 5px;
5227
    padding-top:5px;
5228
    border-top: 1px solid #64a6c4;
5229
    font-size: 0.8em;
5230
}
5231

    
5232
.form-actions.plain {
5233
    margin-top: 0px;
5234
    padding-top:0px;
5235
    border-top: 0px;
5236
}
5237

    
5238
.form-action {
5239
    float: right;
5240
    min-width: 140px;
5241
    background-color: #FF7F2A;
5242
    border: 1px solid #FF7F2A;
5243
    text-align: center;
5244
    color: #FFFFFF;
5245
    cursor: pointer;
5246
    padding: 4px;
5247
}
5248

    
5249
.form-action:hover {
5250
    background-color: #FF9955;
5251
    color: #FFF;
5252
}
5253

    
5254
.form-action.prev,
5255
.form-action.cancel {
5256
    background-color: #800;
5257
    border: 1px solid #800;
5258
    float: left;
5259
}
5260

    
5261
.form-action.prev:hover,
5262
.form-action.cancel:hover {
5263
    background-color: #CC0000;
5264
    color: #fff;
5265
}
5266

    
5267
.form-action.next,
5268
.form-action.ok {
5269
    background-color: #080;
5270
    border: 1px solid #080;
5271
}
5272

    
5273
.form-action.next:hover,
5274
.form-action.ok:hover {
5275
    background-color: #00aa00;
5276
    color: #fff;
5277
}
5278

    
5279
.form-action .create,
5280
.form-action .submit {
5281

    
5282
}
5283

    
5284
.form-action.in-progress, button.in-progress {
5285
    background-image: url("../images/icons/indicators/medium/horizontal-progress.gif");
5286
    background-repeat: no-repeat;
5287
    background-position: center center;
5288
    color: transparent;
5289
}
5290

    
5291
#createvm-overlay-content {
5292
    padding: 0;
5293
}
5294

    
5295
.create-vm .image-details.selected .size {
5296

    
5297
}
5298

    
5299
.create-vm .image-details .show-details:hover {
5300
    color: #aaa !important; 
5301
}
5302
.create-vm .image-details.selected .show-details:hover {
5303
    color: #fff !important; 
5304
}
5305

    
5306
.create-vm .image-details.selected .show-details,
5307
.create-vm .image-details.selected .size {
5308
    color: #eee;
5309
}
5310

    
5311
.create-vm .image-details.selected span.owner {
5312
    color: #fff;
5313
}
5314

    
5315

    
5316
.create-vm .image-details p {
5317
    font-size: 0.8em;
5318
    padding-left: 27px;
5319
    display:block;
5320
}
5321

    
5322
.create-vm .image-details span.owner {
5323
    display: block;
5324
    font-size: 0.9em;
5325
    float: right;
5326
    color: #FF7F2A;
5327
    position: absolute;
5328
    top: 5px;
5329
    right: 5px;
5330
}
5331

    
5332
.create-vm .select-image .show-details {
5333
    display: none;
5334
    font-size: 0.8em;
5335
    text-decoration: underline;
5336
    color: #000;
5337
    position: absolute;
5338
    bottom: 5px;
5339
    right: 5px;
5340
}
5341

    
5342
.create-vm .image-details .size {
5343
    margin-top: 2px;
5344
    font-size: 0.8em;
5345
    color: #aaa;
5346
    margin-left: 10px;
5347
}
5348

    
5349
.create-vm .step-cont {
5350
    margin: 15px;
5351
}
5352

    
5353
.create-vm .create-step-cont {
5354
    min-height: 250px;
5355
    float: left;
5356
    width: 624px;
5357
}
5358

    
5359
.create-vm .create-controls {
5360
    padding: 10px;
5361
    border-top: 1px solid #ddd;
5362
}
5363

    
5364
.create-vm .empty {
5365
    font-size: 0.8em;
5366
    color: #444;
5367
}
5368

    
5369
.create-vm h4 {
5370
    color: #5CA1C0;
5371
    margin-bottom: 0.5em;
5372
    font-family: arial;
5373
}
5374
.create-vm ul li {
5375
    cursor: pointer;
5376
    padding: 4px;
5377
    font-size: 0.9em;
5378
}
5379

    
5380
.create-vm .create-step-cont li.ssh-key-option.selected,
5381
.create-vm ul li.selected {
5382
    background-color: #FF7F2A;
5383
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5384
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5385
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5386
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5387
    color: #fff;
5388
}
5389

    
5390
.create-vm .images-list-cont.loading .loading-indicator {
5391
    display: block !important;
5392
}
5393

    
5394
.create-vm .images-list-cont .loading-indicator {
5395
    display: none;
5396
    position: absolute;
5397
    right: -13px;
5398
    top: 2px;
5399
    width: 30px;
5400
    height: 10px;
5401
    background-repeat: no-repeat;
5402
    background-image: url("../images/icons/indicators/medium/progress.gif");
5403
}
5404

    
5405
.create-vm .images-list-cont h4 {
5406
    position: relative;
5407
}
5408

    
5409
.create-vm .images-list-cont {
5410
    width: 40%;
5411
    float: left;
5412
    padding-left: 3%;
5413
    padding-right: 3%;
5414
}
5415

    
5416
.create-vm li p.desc {
5417
    font-size: 0.9em;
5418
}
5419

    
5420
.create-vm p.desc.warning {
5421
    color: #880000;
5422
}
5423

    
5424
.create-vm p.desc.empty {
5425
    color: #000;
5426
}
5427

    
5428
.create-vm p.desc {
5429
    font-size: 0.8em;
5430
    color: #888;
5431
    margin-bottom: 10px;
5432
}
5433

    
5434
.create-vm li.role .values .val:hover {
5435
    background-color: #eee;
5436
}
5437
.create-vm li.role .values .val.selected,  .create-vm li.role .values .val.selected:hover {
5438
    color: #fff;
5439
    background-color: #FF9955;
5440
}
5441

    
5442
.create-vm .images-filter-cont, .create-vm .flavors-predefined-cont {
5443
    width: 18%;
5444
    padding-right: 4%;
5445
    float:left;
5446
    border-right: 1px solid #A1C8DB;
5447
    overflow: auto;
5448
}
5449

    
5450
.create-vm .flavor-options-cont {
5451
    width: 74%;
5452
    float: left;
5453
    margin-left: 20px;
5454
}
5455

    
5456
.create-vm .flavor-options-cont .flavor-options li:hover {
5457
    background-image:-webkit-linear-gradient(top, #E8F4FA, #D1E7F0);
5458
    background-image:-o-linear-gradient(top, #E8F4FA, #D1E7F0);
5459
    background-image:-moz-linear-gradient(top, #E8F4FA, #D1E7F0);
5460
    background-image:linear-gradient(top, #E8F4FA, #D1E7F0);
5461
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E8F4FA', endColorstr='#D1E7F0', GradientType=0);
5462
}
5463

    
5464
.create-vm .flavor-options-cont .flavor-options li.disabled * {
5465
    color: #eee !important;
5466
}
5467

    
5468
.create-vm .flavor-options-cont .flavor-options li.disabled {
5469
    background-image:linear-gradient(top, #aaa, #ddd);
5470
    background-image:-webkit-linear-gradient(top, #aaa, #ddd);
5471
    background-image:-o-linear-gradient(top, #aaa, #ddd);
5472
    background-image:-moz-linear-gradient(top, #aaa, #ddd);
5473
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#aaaaaa', endColorstr='#dddddd', GradientType=0);
5474
}
5475

    
5476
.create-vm .flavor-options-cont .flavor-options li.selected {
5477
    background-color: #FF9955;
5478
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5479
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5480
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5481
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5482
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF9955', endColorstr='#E88B4D', GradientType=0);
5483
    border: 1px solid #C97943;
5484
}
5485

    
5486
.create-vm .predefined-list li.disabled {
5487
    color: #ddd !important;
5488
}
5489

    
5490
.create-vm .flavor-options-cont .flavor-options li {
5491
    display: block;
5492
    float: left;
5493
    margin-right: 10px;
5494
    margin-bottom: 9px;
5495
    padding: 9px 14px;
5496
    border: 1px solid #aaa;
5497
    background-image:-webkit-linear-gradient(top, #D1E7F0, #E8F4FA);
5498
    background-image:-o-linear-gradient(top, #D1E7F0, #E8F4FA);
5499
    background-image:-moz-linear-gradient(top, #D1E7F0, #E8F4FA);
5500
    background-image:linear-gradient(top, #D1E7F0, #E8F4FA);
5501
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D1E7F0', endColorstr='#E8F4FA', GradientType=0);
5502
}
5503

    
5504
.create-vm .flavor-opts-list.compact li {
5505
    padding: 7px 9px;
5506
    margin-right: 7px;
5507
}
5508

    
5509
.create-vm .flavor-options-cont .flavor-options {
5510
    margin-bottom: 2px;
5511
}
5512

    
5513

    
5514
.create-vm .flavor-options .metric {
5515
    font-size: 0.8em;
5516
    margin-left: 2px;
5517
}
5518

    
5519
.create-vm .flavor-options span.available {
5520
  font-size: 0.8em;
5521
  font-weight: normal;
5522
  margin-left: 5px;
5523
}
5524

    
5525
.create-vm .flavor-options span.title {
5526
    color: #444;
5527
}
5528

    
5529
.create-vm .flavor-options span.desc {
5530
    display: block;
5531
    color: #aaa;
5532
    font-weight: normal;
5533
    font-size: 0.8em;
5534
    float: right;
5535
    margin-top: 4px;
5536
}
5537

    
5538
.disktip {
5539
    padding: 4px;
5540
    top: 20px;
5541
}
5542

    
5543
.create-vm .flavor-options .flavors-disk-template-list {
5544
    position: relative;
5545
}
5546

    
5547
.create-vm .flavor-options .disk_template.option {
5548
    z-index: 10;
5549
    min-width: 50px;
5550
    text-align: center;
5551
}
5552

    
5553
/*0 position is -470px*/
5554
.create-vm .flavor-options .disk-template-description {
5555
    font-size: 0.8em;
5556
    color: #444;
5557
    background-image: url("../images/horizontal-pointer.png");
5558
    background-repeat: repeat-x;
5559
    background-position: -470px 0;
5560
    padding-top: 15px;
5561
    margin-top: -10px;
5562
    font-style: italic;
5563
    display:block;
5564
    overflow: auto;
5565
    padding-bottom: 0px;
5566
    margin-bottom: 7px;
5567
    width: 100%;
5568
}
5569

    
5570
.create-vm .flavor-options .disk_template.option .description {
5571
    display: none;
5572
    position: absolute;
5573
    bottom: -20px;
5574
    left:0;
5575
    color: #888;
5576
    font-style: italic;
5577
    display: block;
5578
    background-color: #fff;
5579
    width: 100%;
5580
    text-align: left;
5581
    z-index: 0;
5582
    border-top: 1px solid #ddd;
5583
    padding-top: 3px;
5584
    display: none;
5585
}
5586

    
5587
.create-vm .flavor-options .selected .value {
5588
    color: #FFF;
5589
}
5590

    
5591
.create-vm .flavor-options .value {
5592
    font-weight: bold;
5593
    color: #5CA1C0;
5594
}
5595

    
5596
.create-vm .flavor-options-cont h4 {
5597
    border-bottom: 1px solid #A1C8DB;
5598
    padding-bottom: 5px;
5599
}
5600

    
5601
.create-vm .images-info-cont {
5602
    width: 28%;
5603
    padding-left: 3%;
5604
    float: left;
5605
    border-left: 1px solid #A1C8DB;
5606
}
5607

    
5608
.create-vm .select-image.wide .show-details {
5609
    display: inline;
5610
}
5611

    
5612
.create-vm .select-image .images-info-cont .hide {
5613
    display: none;
5614
}
5615

    
5616
.create-vm .select-image.wide .images-info-cont .hide {
5617
    display: block;
5618
    float: right;
5619
    position: absolute;
5620
    right: 10px;
5621
    top: 10px;
5622
    font-size: 0.8em;
5623
    text-decoration: underline;
5624
    color: #5CA1C0;
5625
    cursor: pointer;
5626
}
5627

    
5628
.create-vm .select-image.wide .images-list-cont {
5629
    width: 74%;
5630
    padding-right: 0;
5631
}
5632

    
5633
.create-vm .select-image.wide .images-info-cont .description .title {
5634
    display: none;
5635
    float: none;
5636
}
5637

    
5638
.create-vm .select-image.wide .images-info-cont .description p {
5639
    background-color: #fff;
5640
    border: 1px solid #ddd;
5641
    padding: 10px;
5642
    float: none;
5643
}
5644

    
5645
.create-vm .select-image.wide .selected .size {
5646
    color: #FFF !important;
5647
}
5648

    
5649
.create-vm .select-image.wide .image-details .size {
5650
    color: #5CA1C0;
5651
    position: absolute;
5652
    top: 5px;
5653
}
5654

    
5655
.create-vm .select-image.wide .images-info-cont h3 {
5656
    color: #5CA1C0;
5657
    margin: 10px 0;
5658
    margin-top: 5px;
5659
    text-align: left;
5660
    font-size: 0.9em;
5661
}
5662

    
5663
.create-vm .select-image.wide .images-info-cont .description p {
5664
    height: 50px;
5665
}
5666

    
5667
.create-vm .select-image.wide .images-info-cont .description {
5668
    width: 100% !important;
5669
    float: none !important;
5670
    background-color: transparent !important;
5671
    padding: 0 !important;
5672
    font-size: 1.1em;
5673
}
5674
.create-vm .select-image.wide .images-info-cont .extra-details {
5675
    height: 160px;
5676
    overflow-y: scroll;
5677
    padding-right: 15px;
5678
}
5679

    
5680
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail.extra-meta .title .custom {
5681
    display: inline-block;
5682
}
5683

    
5684
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail.extra-meta .title {
5685
    background-color: #999 !important;
5686
    border-color: #888 !important;
5687
}
5688
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail .custom {
5689
    float: right;
5690
    display: none;
5691
    font-size: 0.8em;
5692
    margin-left: 10px;
5693
    color: #DDD;
5694
    margin-top: 2px;
5695
}
5696

    
5697
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail {
5698
    padding: 0px;
5699
    background-color: transparent;
5700
    margin-bottom: 4px;
5701
}
5702

    
5703
.create-vm .select-image.wide .images-info-cont .extra-details .title {
5704
    float: left;
5705
    display: block;
5706
    width: 39%;
5707
    padding: 1%;
5708
    background-color: #5CA1C0;
5709
    color: #fff;
5710
    border: 1px solid #4F8DAA;
5711
    font-size: 0.8em;
5712
}
5713

    
5714
.create-vm .select-image.wide .images-info-cont .extra-details .value {
5715
    float: right;
5716
    display: block;
5717
    width: 55%;
5718
    padding: 1%;
5719
    border: none;
5720
    background-color: #FFF;
5721
    color: #444;
5722
    border: 1px solid #ddd;
5723
    margin-bottom: 0px;
5724
    font-size: 0.8em;
5725
}
5726

    
5727

    
5728
.create-vm .select-image.wide .images-info-cont .image-detail {
5729
}
5730

    
5731
.create-vm .select-image.wide ul.images-list {
5732
    height: 310px;
5733
    overflow-y: scroll;
5734
    padding-right: 3%;
5735
}
5736

    
5737
.flavors-predefined-cont {
5738

    
5739
}
5740

    
5741
.flavor-options-cont {
5742
}
5743

    
5744
.create-vm .select-image.wide .images-info-cont {
5745
    position: absolute;
5746
    width: 88%;
5747
    background-color: #DAE9F0;
5748
    padding: 2%;
5749
    border-left: none;
5750
    height: 320px;
5751
    box-shadow: 0px 0px 2px #aaa;
5752
    -moz-box-shadow: 0px 0px 2px #aaa;
5753
    -webkit-box-shadow: 0px 0px 2px #aaa;
5754
    display: none;
5755
}
5756

    
5757

    
5758
.create-vm .images-info-cont h4, .create-vm .create-step-cont .param h4{
5759
    color: #FF9955;
5760
    margin-bottom: 1em;
5761
    font-size: 1.2em;
5762
}
5763

    
5764
.create-vm .images-info-cont span.title {
5765
    color: #4085A5;
5766
    display: block;
5767
    margin-bottom: 2px;
5768
    font-size: 0.8em;
5769
}
5770

    
5771
.create-vm .type-filter li {
5772
    font-size: 0.8em;
5773
    /*font-weight: bold;*/
5774
    padding: 4px;
5775
    margin-bottom: 0px;
5776
    color: #FF7F2A;
5777
}
5778

    
5779
.create-vm .images-list li {
5780
    min-height: 30px;
5781
}
5782
.create-vm .images-list .image-details:hover {
5783
    background-color: #eee;
5784
}
5785

    
5786
.create-vm .images-list .image-details.selected:hover {
5787
    background-color: #FF7F2A;
5788
}
5789

    
5790
.create-vm .images-list .image-details.selected {
5791
    /*font-weight: bold;*/
5792
}
5793

    
5794
.create-vm .images-list .image-details {
5795
    padding: 6px;
5796
    margin-bottom:1px;
5797
    position: relative;
5798
}
5799

    
5800
.create-vm .images-list .image-details img {
5801
    vertical-align: middle;
5802
    margin-right: 10px;
5803
}
5804

    
5805
.create-vm .images-info-cont .image-detail:last-child p {
5806
    border-bottom: none;
5807
}
5808

    
5809
.create-vm .images-info-cont h4 img {
5810
    vertical-align: middle;
5811
    margin-right: 7px;
5812
    margin-bottom: 5px;
5813
}
5814

    
5815
.create-vm .images-info-cont .description p {
5816
    font-size: 0.8em;
5817
}
5818

    
5819
.create-vm .images-info-cont p {
5820
    margin-bottom: 7px;
5821
    font-size: 0.9em;
5822
    border-bottom: 1px solid #A1C8DB;
5823
    padding-bottom: 7px;
5824
}
5825

    
5826
.create-vm .step-header {
5827
    padding-bottom:0;
5828
    position: relative;
5829
}
5830

    
5831
.create-vm .step-header .header-step .info span.subtitle {
5832
    font-size: 1.2em;
5833
    color: #fff;
5834
    font-weight: bold;
5835
}
5836

    
5837
.create-vm .step-header .header-step .info span {
5838
    float: none;
5839
    text-align: right;
5840
}
5841

    
5842
.create-vm .step-header .header-step .info {
5843
    position: absolute;
5844
    right: 15px;
5845
    top: 20px;
5846
    font-size: 0.8em;
5847
}
5848

    
5849
.create-vm .step-header .header-step span {
5850
    float: left;
5851
    display: block;
5852
}
5853

    
5854
.create-vm .steps-container {
5855
    width: 2000em;
5856
}
5857

    
5858
.create-vm .step-header .header-step .title {
5859
    margin-top: 20px;
5860
    font-size: 1em;
5861
    margin-left: 10px;
5862
}
5863

    
5864
#createvm-overlay-content {
5865
    width: 624px;
5866
    overflow: hidden;
5867
}
5868

    
5869
.create-vm .steps-history .steps-history-cont.current .title {
5870
    display: block;
5871
    top: 23px;
5872
    left: 43px;
5873
    font-size: 1.2em;
5874
    color: #ffffff;
5875
    font-weight: bold;
5876
    font-family: 'Ubuntu', sans-serif !important;
5877
}
5878

    
5879
.create-vm .steps-history .steps-history-cont.current .subnum {
5880
    display: none;
5881
    float: none;
5882
    font-size: 0.9em;
5883
    font-family: 'Ubuntu', sans-serif  !important;
5884
}
5885

    
5886
.create-vm .steps-history .steps-history-cont.current .subtitle,
5887
.create-vm .steps-history .steps-history-cont.current .description {
5888
    font-family: 'Ubuntu', sans-serif  !important;
5889
}
5890

    
5891
.create-vm .steps-history .steps-history-cont.current .info {
5892
    display: block;
5893
    font-family: 'Ubuntu', sans-serif !important;
5894
}
5895

    
5896
.create-vm .steps-history .steps-history-cont.completed .title,
5897
.create-vm .steps-history .steps-history-cont.completed .num {
5898
    color: #A1C8DB;
5899
}
5900

    
5901
.create-vm .steps-history .steps-history-cont.completed {
5902
    background-color: #4085A5;
5903
    color: #fff;
5904
    cursor: pointer;
5905
}
5906

    
5907
.create-vm .steps-history .steps-history-cont.completed .steps-history-step {
5908
    background-image: url("../images/check.png");
5909
}
5910

    
5911
.create-vm .steps-history .steps-history-cont.current .steps-history-step {
5912
    width: 320px;
5913
}
5914

    
5915
.create-vm .steps-history .steps-history-cont.current .num {
5916
    color: #fff;
5917
}
5918

    
5919
.create-vm .steps-history .steps-history-cont.current .info {
5920
    color: #4085A5;
5921
    font-size: 0.8em;
5922
}
5923

    
5924
.create-vm .steps-history .steps-history-cont.current {
5925
    background-color: #A1C8DB;
5926
    color: #fff;
5927
    width: 468px;
5928
}
5929

    
5930
.create-vm .steps-history-step {
5931
    padding: 4px;
5932
    padding-left: 7px;
5933
    font-size: 1em;
5934
    font-family: 'Ubuntu', sans-serif  !important;
5935
    margin-right: 5px;
5936
    padding-top: 12px;
5937
    background-position: right 30px;
5938
    background-image: none;
5939
    background-repeat: no-repeat;
5940
}
5941

    
5942
.create-vm .steps-history {
5943
    background-color: #4085A5;
5944
}
5945

    
5946
.create-vm .steps-history .steps-history-cont.last {
5947
    border-right: none;
5948
}
5949

    
5950
.create-vm .steps-history .steps-history-cont .num {
5951
    margin-left: 5px;
5952
    margin-top: -10px;
5953
    padding-bottom: 10px;
5954
}
5955

    
5956
.create-vm .steps-history .steps-history-cont .title {
5957
    display: none;
5958
    position: absolute;
5959
    bottom: 0px;
5960
    text-align: center;
5961
    padding-bottom: 2px;
5962
    left:0;
5963
    width: 55px;
5964
    margin-left:0;
5965
    margin-top:0;
5966
    font-size: 0.8em;
5967
}
5968

    
5969
.create-vm .steps-history .steps-history-cont .subnum,
5970
.create-vm .steps-history .steps-history-cont .info {
5971
    display: none;
5972
}
5973

    
5974
.create-vm .steps-history .steps-history-cont {
5975
    height: 70px;
5976
    width: 51px;
5977
    float: left;
5978
    color: #fff;
5979
    border-right: 1px solid #A1C8DB;
5980
    color: #A1C8DB;
5981
    background-color: #4085A5;
5982
    background-position: center right;
5983
    background-image: none;
5984
    background-repeat: no-repeat;
5985

    
5986
    -webkit-transition: background-color .15s ease-in;
5987
    -o-transition: background-color .15s ease-in;
5988
    -moz-transition: background-color .15s ease-in;
5989
    transition: background-color .15s ease-in;
5990

    
5991
    border-bottom: 1px solid #aaa;
5992
}
5993

    
5994
.create-vm .step-header .header-step .num {
5995
    color: #225871;
5996
    font-size: 4em;
5997
    margin-bottom: -5px;
5998
    font-family: 'Ubuntu', sans-serif;
5999
    font-weight: normal !important;
6000
}
6001

    
6002
.create-vm .step-header .header-step {
6003
    color: #;
6004
    margin-bottom: -6px;
6005
    width: 25%;
6006
    padding-left: 0%;
6007
    display: block;
6008
    float: left;
6009
}
6010

    
6011
.create-vm .step-header .header-step.current {
6012
    color: #387693;
6013
}
6014

    
6015
.create-vm .image-filters-title {
6016
    margin-top: 1em;
6017
    margin-bottom: 0.5em;
6018
}
6019

    
6020
.create-vm .create-step-cont span.clear {
6021
    font-size: 0.8em;
6022
    font-weight: bold;
6023
    color: #A1C8DB;
6024
    display: block;
6025
}
6026

    
6027
.create-vm .category-filters li {
6028
    float:left;
6029
    display: block;
6030
    padding: 4px;
6031
    background-color: #eee;
6032
    margin-right: 5px;
6033
    font-size: 0.9em;
6034
    margin-bottom: 5px;
6035
}
6036

    
6037
.create-vm .content-cont {
6038
    height: 340px;
6039
    overflow: auto;
6040
}
6041

    
6042
.create-vm .vm-confirm .confirm-params span.cval {
6043
    margin-left: 8px;
6044
    color: #444;
6045
}
6046

    
6047
.create-vm .vm-confirm .confirm-params span.ckey {
6048
    color: #4085A5;
6049
    font-weight: bold;
6050
}
6051

    
6052
.create-vm .vm-confirm .confirm-params {
6053
    margin-bottom: 15px;
6054
}
6055

    
6056
.create-vm .vm-confirm h3.vm-name {
6057
    background-repeat: no-repeat;
6058
    background-position: left center;
6059
    font-size: 1.4em;
6060
    padding-left: 1.45em;
6061
    color: #4085A5;
6062
}
6063

    
6064
.create-vm .images-list-cont h4 a {
6065
    margin-top: 3px;
6066
    margin-right: -2px !important;
6067
}
6068
.create-vm .images-list-cont h4 a,
6069
.create-vm .list-cont h4 a {
6070
    font-size: 0.8em;
6071
    font-weight: normal;
6072
    margin-right: 5px;
6073
    float: right;
6074
    color: #FF7F2A;
6075
}
6076

    
6077
.create-vm .confirm-params {
6078
    overflow: auto;
6079
}
6080

    
6081
.create-vm .vm-confirm .ssh.confirm-params {
6082
    max-height: 150px;
6083
}
6084

    
6085
.create-vm .personalize-cont .confirm-params {
6086
    max-height: 160px;
6087
    margin-right: 10px;
6088
}
6089

    
6090
.create-vm .personalize-cont,
6091
.create-vm .confirm-cont {
6092
    height: 250px;
6093
}
6094

    
6095
.create-vm .image-warning p {
6096
  width: 80%;
6097
  float: left;
6098
}
6099

    
6100
.create-vm .image-warning .untrusted-image-confirm:hover {
6101
  background-color: #7D674E;
6102
}
6103

    
6104
.create-vm .image-warning .untrusted-image-confirm {
6105
  display: inline-block;
6106
  padding: 5px;
6107
  background-color: #5C4D39;
6108
  color: #FFF;
6109
  width: 10%;
6110
  float: right;
6111
  margin-top: 4px;
6112
  margin-right: 2px;
6113
  cursor: pointer;
6114
  text-align: center;
6115
}
6116

    
6117
.create-vm .image-warning {
6118
  display: none;
6119
  background-color: #987249;
6120
  color: #fff;
6121
  padding: 10px 15px;
6122
  font-size: 0.9em;
6123
  border-top: 1px solid #AAA;
6124
}
6125

    
6126
.create-vm .create-step-cont .rename input.rename-field {
6127
    font-size: 1.4em;
6128
    padding: 5px;
6129
    width: 93%;
6130
    padding-left: 30px;
6131
    background-position: 7px center;
6132
    background-repeat: no-repeat;
6133
}
6134

    
6135
.create-vm .create-step-cont .rename label {
6136
    display: block;
6137
}
6138

    
6139
.create-vm .create-step-cont .personalize-conts,
6140
.create-vm .create-step-cont .confirm-conts {
6141
    margin-top: 20px;
6142
}
6143

    
6144
.create-vm .create-step-cont .personalize-cont,
6145
.create-vm .create-step-cont .confirm-cont {
6146
    width: 30%;
6147
    margin-right: 2%;
6148
    border-right: 1px solid #A1C8DB;
6149
    float: left;
6150
}
6151

    
6152
.create-vm .create-step-cont .confirm-cont ul li .title {
6153
    width: 55px;
6154
    float: left;
6155
}
6156

    
6157
.create-vm .create-step-cont .list-cont ul li .value {
6158
    float: right;
6159
    padding-top: 2px;
6160
    display: block;
6161
    width: 90px;
6162
    text-align: right;
6163
}
6164

    
6165
.create-vm .create-step-cont .list-cont ul li.flavor-disktype .value {
6166
    width: 45px;
6167
}
6168

    
6169
.create-vm .create-step-cont .list-cont ul li.image-description .value,
6170
.create-vm .create-step-cont .list-cont ul li.image-name .value {
6171
    float: none;
6172
    width: auto;
6173
    text-align:left;
6174
    width: auto;
6175
}
6176

    
6177
.create-vm .create-step-cont .list-cont ul li {
6178
    padding:0;
6179
    margin:0;
6180
    margin-bottom: 5px;
6181
    border-bottom: 1px solid #EEE;
6182
    padding-bottom: 7px;
6183
    margin-right: 10px;
6184
}
6185

    
6186
.create-vm .create-step-cont li.ssh-key-option .check {
6187
    float: right;
6188
    margin-right: 5px;
6189
    margin-top: 0px;
6190
}
6191

    
6192
.create-vm .create-step-cont li.ssh-key-option.selected {
6193
}
6194
.create-vm .create-step-cont li.ssh-key-option.selected:hover {
6195
    background-color: #F95;
6196
}
6197

    
6198
.create-vm .create-step-cont li.ssh-key-option:hover {
6199
    background-color: #eee;
6200
}
6201

    
6202
.create-vm .create-step-cont li.ssh-key-option.selected {
6203
}
6204

    
6205
.create-vm .create-step-cont li.ssh-key-option {
6206
    padding: 6px !important;
6207
}
6208

    
6209
.create-vm .create-step-cont .list-cont.ssh {
6210
    width: 60%;
6211
}
6212

    
6213
.create-vm .create-step-cont .list-cont.meta h4 {
6214
    margin-right: 0;
6215
}
6216

    
6217
.create-vm .create-step-cont .list-cont.meta {
6218
    margin-right:0;
6219
    border-right: none;
6220
    width: 195px;
6221
}
6222

    
6223
.create-vm .list-cont > h4 {
6224
    font-size: 1.2em;
6225
    margin-right: 10px;
6226
    border-bottom: 1px solid #A1C8DB;
6227
    padding-bottom: 5px;
6228
    color: #387693;
6229
}
6230

    
6231
.create-vm .list-cont .param.image-name {
6232
    margin-bottom: 0 !important;
6233
    border-bottom: none !important;
6234
}
6235

    
6236
.create-vm .list-cont .param h4 {
6237
    margin-bottom: 0px !important;
6238
    font-size: 1.1em !important; 
6239
}
6240

    
6241
.create-vm .list-cont .param {
6242
    margin-bottom: 7px !important;
6243
}
6244

    
6245
.create-vm .list-cont .value {
6246
    font-weight: bold;
6247
}
6248

    
6249
.create-vm .list-cont .param .value {
6250
    font-size: 0.9em;
6251
}
6252

    
6253
.create-vm .list-cont .param .title {
6254
    color: #387693;
6255
}
6256

    
6257
.create-vm .list-cont .image-description {
6258
    margin-left:0;
6259
}
6260

    
6261
.create-vm .list-cont .image-description .value {
6262
    font-weight: normal;
6263
    margin-left: 0 !important;
6264
}
6265

    
6266
.create-vm .list-cont .image-description .title {
6267
    display: none;
6268
    font-size: 0.8em;
6269
}
6270

    
6271
.create-vm .list-cont.meta .values span {
6272
    display:block;
6273
    float: left;
6274
    margin-right: 4px;
6275
    border: 1px solid #eee;
6276
    padding:3px;
6277
    margin-bottom: 4px;
6278
    font-size: 0.9em;
6279
}
6280

    
6281
.create-vm .list-cont.meta .key {
6282
    font-weight: bold;
6283
    font-size: 0.9em;
6284
    display: block;
6285
    margin-bottom: 5px;
6286
}
6287

    
6288
.create-vm .meta input {
6289
    font-size: 0.8em;
6290
}
6291

    
6292
.vm-connect .connect-cont {
6293
    margin-bottom: 20px;
6294
    border-bottom: 1px solid #A1C8DB;
6295
    padding-bottom: 20px;
6296
}
6297

    
6298
.vm-connect .connection-info {
6299
    padding-bottom: 0px;
6300
    margin-bottom: 0;
6301
    border-bottom: none;
6302
}
6303

    
6304
.vm-connect .connection-info .connect a {
6305
    color: #fff;
6306
}
6307

    
6308
.vm-connect .connection-info .connect {
6309
    background-color: #387693;
6310
    color: #fff;
6311
    padding: 10px;
6312
    font-size: 1.2em;
6313
    text-align: center;
6314
}
6315

    
6316
.clip-copy {
6317
    display: block;
6318
    width: 20px;
6319
    height: 20px;
6320
    position: absolute;
6321
    border: 1px solid #387693;
6322
    background-image: url("../images/clipboard.png");
6323
    background-repeat: no-repeat;
6324
    background-position: center;
6325
    cursor: pointer;
6326
    background-color: #A1C8DB;
6327
}
6328

    
6329
.password-cont .clip-copy { right: 10px; top: 8px;}
6330

    
6331

    
6332
.overlay-invitations {
6333
    width: 680px;
6334
}
6335
.invitations-form .sending .sending-msg {
6336
    font-size: 0.8em;
6337
    display: block !important;
6338
    margin-bottom: 5px;
6339
    color: #008800;
6340
}
6341

    
6342
.invitations-form .send-error {
6343
    font-size: 0.8em;
6344
    margin-bottom: 5px;
6345
    margin-top: 5px;
6346
    color: #800;
6347
    padding: 3px;
6348
    padding-left: 0;
6349
    display: none;
6350
}
6351

    
6352
.invitations-form .error label {
6353
    color: #000 !important;
6354
}
6355

    
6356
.invitations-form .form-field {
6357
    width: 49%;
6358
    float: left;
6359
}
6360

    
6361
.invitations-view .left.none {
6362
    background-color: #880000;
6363
}
6364

    
6365
.invitations-form {
6366
    position: relative;
6367
}
6368

    
6369
.invitations-form h3 {
6370
    float: left;
6371
}
6372

    
6373
.invitations-form .add-new-invitation {
6374
    float:left;
6375
    top:2px;
6376
    right: 20px;
6377
    width: 16px;
6378
    height: 16px;
6379
    background-image: url("../images/option-action-add.png");
6380
    background-repeat: no-repeat;
6381
    background-position: center;
6382
    text-indent: -50000em;
6383
    background-color: #4085A5;
6384
    margin-left: 15px;
6385
    cursor: pointer;
6386
}
6387

    
6388
.invitations-view .left {
6389
    font-size: 1em;
6390
    color: #fff;
6391
    font-weight: bold;
6392
    background-color: #4085A5;
6393
    padding: 4px;
6394
}
6395

    
6396
input.has-errors {
6397
    border-color: #ff0000;
6398
}
6399

    
6400
.none-left .invitations-wrapper .invitations-list {
6401
    width: 100% !important;
6402
    border-left: none !important;
6403
    padding-left: 0;
6404
}
6405

    
6406
.invitations-wrapper .invitations-list {
6407
    width: 40%;
6408
    float: left;
6409
    padding-left: 10px;
6410
    border-left: 1px solid #4085A5;
6411
    margin-left: -1px
6412
}
6413

    
6414
.invitations-wrapper .invitations-form {
6415
    width: 57%;
6416
    float: left;
6417
    border-right: 1px solid #4085A5;
6418
}
6419

    
6420
.invitations-wrapper label span {
6421
    color: #aaa;
6422
    font-size: 0.8em;
6423
}
6424

    
6425
.invitations-wrapper label {
6426
    display: block;
6427
    font-size: 0.9em;
6428
    margin-bottom:10px;
6429
    font-weight: bold;
6430
}
6431

    
6432
.invitations-view .add-new-invitation {
6433
    cursor: pointer;
6434
}
6435

    
6436
.invitations-wrapper input.name {
6437
    width: 150px;
6438
}
6439

    
6440
.invitations-wrapper input {
6441
    font-size: 0.9em;
6442
    width: 155px;
6443
    padding:4px;
6444
}
6445

    
6446
.invitations-list .invitation-sent {
6447
    border-bottom: 1px solid #A1C8DB;
6448
    padding-bottom: 5px;
6449
    margin-bottom: 5px;
6450
    position: relative;
6451
}
6452

    
6453
.invitations-view h3 {
6454
    margin-bottom: 10px;
6455
    color: #4085A5;
6456
}
6457

    
6458
.invitations-list .invitation-sent.last,
6459
.invitations-list .invitation-sent:last-child {
6460
    border-bottom: none;
6461
}
6462

    
6463

    
6464
.invitations-list .invitation-sent .email {
6465
    color: #D98147;
6466
    font-size: 0.8em;
6467
    font-weight: bold;
6468
    margin-top: 2px;
6469
}
6470

    
6471
.invitations-list .pagination a,
6472
.invitations-list .pagination span {
6473
    padding: 0.2em 0.3em;
6474
}
6475

    
6476
.invitations-list .pagination {
6477
    font-size: 0.75em;
6478
}
6479

    
6480
.invitations-list .name {
6481
    color: #444;
6482
    font-size: 0.9em;
6483
}
6484

    
6485
.invitations-list .status.sending {
6486
    background-image: url("../images/icons/indicators/small/progress.gif");
6487
}
6488

    
6489
.invitations-list .status.sent {
6490
    background-image: url("../images/invitation_accepted.png");
6491
}
6492

    
6493
.invitations-list .status.resend {
6494
    background-image: url("../images/resend.png");
6495
}
6496

    
6497
.invitations-list .status.resend {
6498
    cursor: pointer;
6499
}
6500

    
6501
.invitations-list .status {
6502
    width: 20px;
6503
    height: 15px;
6504
    position: absolute;
6505
    top:5px;
6506
    right: 2px;
6507
    background-repeat: no-repeat;
6508
    background-position: center;
6509
}
6510

    
6511
.invitations-form .form-entry:last-child {
6512
    border-bottom: none;
6513
}
6514

    
6515
.invitations-form .form-entry {
6516
    position: relative;
6517
    margin-bottom: 10px;
6518
    padding-bottom: 10px;
6519
    border-bottom: 1px solid #ddd;
6520
    margin-right: 10px;
6521
}
6522

    
6523
.invitations-form .send-invitations {
6524
    float: left;
6525
    padding: 5px;
6526
    color: #fff;
6527
    margin-right: 10px;
6528
    margin-top: 10px;
6529
}
6530

    
6531
.invitations-form .form-entry.error {
6532
    padding-bottom: 0px;
6533
}
6534

    
6535
.invitations-form .form-entry.error .remove-invitation {
6536
    bottom: 32px;
6537
}
6538

    
6539
.invitations-form .remove-invitation {
6540
    padding: 5px;
6541
    background-image: url("../images/option-action-remove.png");
6542
    background-position: center;
6543
    background-repeat: no-repeat;
6544
    color: #fff;
6545
    width: 15px;
6546
    height: 15px;
6547
    cursor: pointer;
6548
    text-indent: -50000px;
6549
    position: absolute;
6550
    right: -10px;
6551
    bottom: 14px;
6552
}
6553

    
6554
.invitations-list .resent-info,
6555
.invitations-form .top-info {
6556
    font-size: 0.8em;
6557
    margin-bottom: 10px;
6558
}
6559

    
6560
.invitations-list .msg .email,
6561
.invitations-form .success .msg .email {
6562
    font-weight: bold;
6563
}
6564

    
6565
.invitations-list .msg.err-msg,
6566
.invitations-list .success.msg,
6567
.invitations-form .success .msg {
6568
    background-color: #080;
6569
    color: white;
6570
    padding: 5px;
6571
    margin-right: 10px;
6572
    margin-bottom: 5px;
6573
}
6574
.invitations-list .msg.err-msg,
6575
.invitations-list .success.msg {
6576
    margin-right: 0px;
6577
}
6578
.invitations-list .msg.err-msg {
6579
    background-color: #800;
6580
}
6581

    
6582
.overlay .models-view .previous-view-link {
6583
    margin: -10px;
6584
    margin-bottom:10px;
6585
    padding: 10px 5px;
6586
    background-image: url("../images/left-arrow.png");
6587
    background-repeat: no-repeat;
6588
    background-position: 10px center;
6589
    padding-left: 20px;
6590
    background-color: #93D070;
6591
    cursor: pointer;
6592
    border-bottom: 1px solid #eee;
6593
    text-decoration: underline;
6594
}
6595
.models-view .quick-add {
6596
    text-decoration: underline; 
6597
    color: #4085A5;
6598
    cursor: pointer;
6599
}
6600

    
6601
.empty .items-list {
6602
    margin-top: 0 !important;
6603
}
6604

    
6605
.models-view .items-empty-msg {
6606
    border-top: 1px solid #aaa;
6607
    padding-top: 10px;
6608
    font-size: 1em;
6609
    margin-top:0 !important;
6610
}
6611

    
6612
.models-view .items-empty-msg,
6613
.models-view .model-description {
6614
    color: #444;
6615
    margin: 10px 0;
6616
}
6617

    
6618
.models-view .model-list .collection-action.disabled {
6619
    background-color: #aaa;
6620
    border-color: #aaa;
6621
    cursor: default;
6622
}
6623
.models-view .model-list .collection-action.disabled:hover {
6624
    background-color: #aaa;
6625
    border-color: #aaa;
6626
}
6627

    
6628
.models-view .model-list .collection-action:hover {
6629
    background-color: #aaa;
6630
}
6631

    
6632
.models-view .model-list .collection-action:hover {
6633
    background-color: #F95;
6634
    border-color: #F95;
6635
}
6636

    
6637
.models-view .model-list .collection-action.in-progress {
6638
    background-color: #aaa;
6639
    color: #fff;
6640
    border-color: #aaa;
6641
    background-image: url("../images/icons/indicators/small/progress.gif") !important;
6642
}
6643

    
6644
.models-view .model-list .collection-action.add-generate {
6645
    background-image: url("../images/option-action-generate-ssh.png");
6646
}
6647

    
6648
.models-view .model-list .collection-action.add {
6649
    background-image: url("../images/option-action-add.png");
6650
    padding-right: 20px !important;
6651
}
6652

    
6653
.models-view .model-list .collection-action {
6654
    float: right;
6655
    background-color: #FF7F2A;
6656
    color: #fff;
6657
    padding: 6px 8px;
6658
    margin-left: 10px;
6659
    cursor: pointer;
6660
    padding-right: 30px;
6661
    background-position: right center;
6662
    background-repeat: no-repeat;
6663
    background-clip: border-box;
6664
    border-right: 5px solid #FF7F2A;
6665
}
6666

    
6667
.models-view .items-list {
6668
    margin-top: 10px;
6669
}
6670

    
6671
.models-view .model-list ul li.model-item:last-child {
6672
    margin-bottom: 0;
6673
}
6674

    
6675
.models-view .model-list ul li.model-item {
6676
    background-color: #D4E2E8;
6677
    margin-bottom: 5px;
6678
    position: relative;
6679
}
6680

    
6681
.models-view .model-list ul li.model-item .param {
6682
    float: left;
6683
    padding: 6px;
6684
}
6685

    
6686
.models-view .model-list ul li.model-item .item-action.confirm-remove {
6687
    margin-right: -15px !important;
6688
}
6689

    
6690
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover .cancel {
6691
    color: inherit !important;
6692
}
6693

    
6694
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover {
6695
    background-color: #F95;
6696
    color: inherit !important;
6697
}
6698

    
6699
.models-view .model-list ul li.model-item .item-action.confirm-remove span.cancel {
6700
    padding: 6px !important;
6701
}
6702

    
6703
.models-view .model-list ul li.model-item .item-action.confirm-remove span {
6704
    display: block;
6705
    float: left;
6706
    padding: 6px 15px;
6707
}
6708

    
6709
.models-view .model-list ul li.model-item .item-action .cancel-remove:hover {
6710
    color: #fff !important;
6711
}
6712

    
6713
.models-view .model-list ul li.model-item .item-action.confirm-remove,
6714
.models-view .model-list ul li.model-item .item-action .do-confirm,
6715
.models-view .model-list ul li.model-item .item-action .cancel-remove {
6716
    display:none !important;
6717
    background-color: #D95D0A;
6718
    padding:0;
6719
    margin:0;
6720
}
6721

    
6722
.models-view .model-list ul li.model-item.pending-delete .item-action.remove {
6723
    display: none;
6724
}
6725

    
6726
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel {
6727
    background-color: #F95;
6728
}
6729

    
6730
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm {
6731
    background-color: #FF7F2A;
6732
}
6733

    
6734
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove,
6735
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove .do-confirm,
6736
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel-remove {
6737
    display:block !important;
6738
}
6739

    
6740
.models-view .model-list ul li.model-item.pending-delete .item-action {
6741
    display: block;
6742
}
6743

    
6744
.models-view .model-list ul li.model-item.expanded .item-action,
6745
.models-view .model-list ul li.model-item:hover .item-action {
6746
    display: block;
6747
}
6748

    
6749
.models-view .model-list ul li.model-item .item-action.hide {
6750
    background-image: url("../images/minus-8.png");
6751
}
6752
.models-view .model-list ul li.model-item .item-action.show:hover {
6753
    background-image: url("../images/plus-8.png");
6754
}
6755

    
6756
.models-view .model-list ul li.model-item .item-action.show {
6757
    background-image: url("../images/plus-8-dark.png");
6758
}
6759

    
6760
.models-view .model-list ul li.model-item .item-action.remove {
6761
    background-image: url("../images/option-action-remove.png");
6762
}
6763

    
6764
.models-view .model-list ul li.model-item .item-action.edit:hover {
6765
    background-image: url("../images/option-action-edit-light.png");
6766
}
6767

    
6768
.models-view .model-list ul li.model-item .item-action.edit {
6769
    background-image: url("../images/option-action-edit.png");
6770
}
6771
.models-view .model-list ul li.model-item .item-action.remove:hover {
6772
    background-color: #880000 !important;
6773
    border-color: #800 !important;
6774
}
6775

    
6776
.models-view .model-list ul li.model-item.expanded .item-action.show,
6777
.models-view .model-list ul li.model-item.expanded .item-action.hide,
6778
.models-view .model-list ul li .item-actions .item-action:hover {
6779
    background-color: #4085A5;
6780
    color: #fff;
6781
    border-color: #4085A5;
6782
}
6783

    
6784
.models-view .model-list ul li .item-actions {
6785
    position: absolute;
6786
    right: -10px;
6787
    top: 0px;
6788
}
6789

    
6790
.models-view .model-list ul li .item-actions .item-action {
6791
    float: right;
6792
    padding: 6px;
6793
    margin-right: 10px;
6794
    display: none;
6795
    cursor: pointer;
6796
    padding-right: 20px;
6797
    background-repeat: no-repeat;
6798
    background-position: right center;
6799
    border-right: 5px solid transparent;
6800
}
6801

    
6802
.models-view .model-list h3 {
6803
    float: left;
6804
}
6805

    
6806
.models-view h3 {
6807
    font-size: 1.2em;
6808
    margin-bottom: 1em;
6809
    margin-top: 5px;
6810
    color: #4085A5;
6811
}
6812

    
6813
.models-view .form-actions {
6814
    font-size: 1.1em;
6815
}
6816

    
6817
.models-view .model-list ul li,
6818
.models-view .model-list ul {
6819
    list-style: none;
6820
}
6821

    
6822
.models-view .model-list ul li.header {
6823
    display: none;
6824
}
6825

    
6826
.models-view .model-form textarea {
6827
    width: 99%;
6828
    height: 100px;
6829
    border: 1px solid #aaa;
6830
}
6831

    
6832

    
6833
.models-view .model-form .form-field {
6834
    margin-bottom: 10px;
6835
}
6836

    
6837
.models-view .model-form label {
6838
    display: block;
6839
    color: #406A7D;
6840
    font-size: 1.1em;
6841
    margin: 0px 0 5px 0;
6842
}
6843

    
6844
.models-view .model-form .inline label {
6845
    float: left;
6846
    margin-right: 10px;
6847
    margin-top: 10px !important;
6848
}
6849

    
6850
.models-view .model-form input.long {
6851
    width: 400px;
6852
}
6853

    
6854
.models-view .model-form .inline input {
6855
    width: auto;
6856
    margin-top: 10px;
6857
}
6858

    
6859
.models-view .model-form .inline select {
6860
    width: auto;
6861
    margin-top: 7px;
6862
}
6863

    
6864
.models-view .model-form .inline .errors,
6865
.models-view .model-form .inline .field-desc {
6866
    clear: both;
6867
}
6868

    
6869
#user_public_keys .private-download {
6870
    margin: 5px 0;
6871
    margin-top: 6px;
6872
}
6873

    
6874
#user_public_keys .private-cont form {
6875
    float: left;
6876
    margin-left: 5px;
6877
}
6878

    
6879
#user_public_keys input.form-text:hover {
6880
    background: #F95;
6881
}
6882

    
6883
#user_public_keys input.form-text {
6884
    background: #FF7F2A;
6885
    color: #fff;
6886
    border: 1px solid #F95;
6887
    padding: 0 5px;
6888
    margin: 0 5px;
6889
    margin-top: -1px;
6890
    cursor: pointer;
6891
}
6892

    
6893
#user_public_keys .form-text {
6894
    float: left;
6895
}
6896

    
6897
#user_custom_images,
6898
#user_public_keys {
6899
    font-size: 0.7em;
6900
}
6901

    
6902
#user_public_keys .download-button {
6903
    width: 30px;
6904
    height: 30px;
6905
}
6906

    
6907

    
6908
#user_public_keys #model-item-tpl {
6909
    display: none;
6910
}
6911
#user_public_keys .model-item .name {
6912
    color: #4085A5;
6913
    font-size: 1.2em;
6914
}
6915

    
6916
#user_public_keys .model-item .fingerprint .flabel {
6917
    color: #888;
6918
    float: left;
6919
    margin-right: 5px;
6920
}
6921

    
6922
#user_public_keys .model-item .fingerprint {
6923
    float: none;
6924
    clear: both;
6925
    color: #444;
6926
    font-family: monospace;
6927
    letter-spacing: 1px;
6928
    padding: 4px;
6929
    font-size: 0.9em;
6930
    border-top: 1px solid #fff;
6931
}
6932

    
6933
#user_public_keys .model-item .publicid {
6934
    display: none;
6935
}
6936

    
6937
#user_public_keys .model-item.expanded .publicid .param-content {
6938
    padding: 5px 5px;
6939
    overflow: auto;
6940
    background-color: #FFF;
6941
    border: 1px solid #4085A5;
6942
    border-left: none;
6943
    border-right: none;
6944
    font-size: 1.1em;
6945
}
6946

    
6947
#user_public_keys .model-item.expanded .publicid .param-content textarea {
6948
    width: 100%;
6949
    height: 90px;
6950
    margin:0;
6951
    padding:0;
6952
    border:none;
6953
    overflow: auto;
6954
}
6955

    
6956
#user_public_keys .model-item.expanded .publicid {
6957
    display: block;
6958
    background-color: #fff;
6959
    width: 100%;
6960
    margin-top: 0px;
6961
    margin-left: 0px;
6962
    color: #fff;
6963
    padding:0 !important;
6964
}
6965

    
6966
.models-view .form-messages {
6967
    margin-bottom: 10px;
6968
}
6969

    
6970
.models-view .list-messages {
6971
    margin-top: 10px;
6972
}
6973

    
6974
.models-view .form-messages .error,
6975
.models-view .form-messages .success,
6976
.models-view .list-messages .error,
6977
.models-view .list-messages .success,
6978
#user_public_keys .private-cont {
6979
    background-color: #AADE87;
6980
    color: #447821;
6981
    padding: 5px;
6982
    border: 1px solid #447821;
6983
    font-size: 1.1em;
6984
    margin-top: 5px;
6985
}
6986

    
6987
.models-view .form-messages .error,
6988
.models-view .list-messages .error {
6989
    background-color: #DE8D87;
6990
    color:  #782421 !important;
6991
    border-color: #782421;
6992
}
6993

    
6994
#user_public_keys .limit-msg {
6995
    color: #800;
6996
    position: absolute;
6997
    right: 20px;
6998
    top: 25px;
6999
}
7000

    
7001
#user_public_keys .private-cont {
7002
    margin-top: 10px;
7003
}
7004

    
7005
#user_public_keys .private-cont .private-msg {
7006
    float: left;
7007
    padding:5px;
7008
    margin-top: 5px;
7009
}
7010

    
7011
#user_public_keys .private-cont textarea {
7012
    margin: 5px;
7013
    width: 97%;
7014
    height: 200px;
7015
}
7016

    
7017
#user_public_keys .private-cont .close-private:hover {
7018
    color: #Fff;
7019
}
7020

    
7021
#user_public_keys .private-cont .close-private {
7022
    float: right;
7023
    margin-right: 5px;
7024
    font-weight: bold;
7025
    cursor: pointer;
7026
    text-decoration: underline;
7027
}
7028

    
7029
#user_public_keys .model-item .key-type {
7030
    background-color: #72ADC8;
7031
    color: #fff;
7032
    text-align: center;
7033
    font-size: 0.9em;
7034
    padding:2px 10px;
7035
    margin: 4px 6px;
7036
    margin-top: 7px;
7037
    font-weight: bold;
7038
}
7039

    
7040
#user_public_keys .private-cont .down-button {
7041
}
7042

    
7043
.models-view .form-field .field-desc {
7044
    font-style: italic;
7045
    font-size: 1em;
7046
    color: #888;
7047
}
7048

    
7049
.models-view .form-field.error label {
7050
    font-weight: bold;
7051
    color: #800 !important;
7052
}
7053

    
7054
.models-view .form-field .errors {
7055
    margin: 5px 0;
7056
}
7057

    
7058
.models-view .form-field .errors .error {
7059
    background-color: transparent;
7060
    border: none;
7061
    color: #800;
7062
}
7063

    
7064
.single .suspended-notice {
7065
  right: 180px;
7066
  top: 0px;
7067
  padding: 7px;
7068
  padding-bottom: 6px;
7069
}
7070

    
7071
.icon .suspended-notice {
7072
  right: 192px;
7073
  top: 50px;
7074
}
7075

    
7076
.suspended-notice {
7077
  display: inline-block;
7078
  padding: 4px;
7079
  background-color: #8f1915;
7080
  cursor: pointer;
7081
  position: absolute;
7082
  color: #fff;
7083
  font-size: 0.6em;
7084
  display: none;
7085
}
7086

    
7087
.suspended .suspended-notice {
7088
  display: block;
7089
}
7090

    
7091
.suspended .action-indicator {
7092
  display: none !important;
7093
}