Statistics
| Branch: | Tag: | Revision:

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

History | View | Annotate | Download (126.6 kB)

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
302
#createcontainer a {
303
}
304

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
1011
.state {
1012
}
1013

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
1433
#machinesview {
1434
}
1435

    
1436
#machines-pane {
1437
}
1438

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
1693

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
1802

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
2014
div.confirm_reboot_required {
2015
}
2016

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
2330

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
2569
#networkscreate {
2570
}
2571

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

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

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

    
2593
#createcontainer {
2594
}
2595

    
2596
#networks-container {
2597
}
2598

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
2758
.state {
2759
}
2760

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

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

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

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

    
2795

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
2931
.private-networks .state {
2932
}
2933

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
3040
.machine-name .name {
3041
}
3042

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
3314
.metadata-left {
3315
}
3316

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
3899
.last .firewall-content {
3900
}
3901

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
4198

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

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

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

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

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

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

    
4225

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

    
4234

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

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

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

    
4252
/*404 and 500 pages*/
4253

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
4354

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
4557
.overlay .diagnostics-list {
4558
    height: 400px;
4559
    overflow: scroll;
4560
    overflow-y: scroll;
4561
    overflow-x: hidden;
4562
}
4563
.overlay .overlay-content .description.subinfo {
4564
    margin-bottom:0;
4565
    border-bottom: none;
4566
    padding-bottom:0;
4567
    margin-top: 10px;
4568
    padding-top:10px;
4569
    border-top: 1px solid #64a6c4;
4570
    /*border-top: 1px solid #DBE6EB;*/
4571
    font-size: 0.8em;
4572
}
4573

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

    
4578
.overlay .overlay-content .description {
4579
    color: #444;
4580
    border-bottom: 1px solid #64a6c4;
4581
    margin-bottom: 10px;
4582
    padding-bottom: 10px;
4583
    font-size: 0.9em;
4584
    line-height: 1.6em;
4585
}
4586
.overlay .overlay-content .empty-message {
4587
    margin-bottom: 5px;
4588
}
4589

    
4590
.overlay h3.overlay-header {
4591
    font-size: 0.9em;
4592
    text-align: left;
4593
    padding: 0.8em;
4594
    padding-left: 1em;
4595
    font-weight: normal;
4596
    border-bottom: 1px solid #ddd;
4597
}
4598

    
4599
.overlay h3.overlay-header .title {
4600
    float: left;
4601
}
4602

    
4603
.overlay .container {
4604
    position: relative;
4605
    padding-top: 1em;
4606
    padding: 0.5em;
4607
    background-image: url("../images/popup-bg.png");
4608
    background-repeat: repeat-x;
4609
}
4610

    
4611
.overlay .content {
4612
    background-color: transparent;
4613
    background-image: url("../images/popup-inner-bg.png");
4614
    padding: 1em;
4615
    font-size: 0.8em;
4616
    background-repeat: repeat-x;
4617
    -moz-box-shadow: 0 0 1px 1px #888;
4618
    -webkit-box-shadow: 0 0 1px 1px #888;
4619
    box-shadow: 0 0 1px 1px #888;
4620
}
4621

    
4622
.overlay .message {
4623
}
4624

    
4625
.overlay .actions {
4626
    position: absolute;
4627
    right: 0.75em;
4628
    top: 0.6em;
4629
}
4630

    
4631
.overlay .actions span {
4632
    font-size: 0.8em;
4633
    color: #fff;
4634
    cursor: pointer;
4635
    margin-left: 10px;
4636
    display: block;
4637
    float: left;
4638
    background-color: #4085A5;
4639
    padding: 0.2em 0.4em;
4640
}
4641

    
4642
.overlay-error .error-more-details {
4643
    margin-top: 5px;
4644
    max-height: 210px;
4645
    overflow: auto;
4646
}
4647

    
4648
.overlay-error .key.details.expand {
4649
    background-image: url("../images/plus-8.png");
4650
}
4651

    
4652
.overlay-error .key.details {
4653
    background-color: #5189A3;
4654
    cursor: pointer;
4655
    background-image: url("../images/minus-8.png");
4656
    background-repeat: no-repeat;
4657
    background-position: 545px;
4658
}
4659

    
4660
.overlay-error .container {
4661
    padding-top: 1.9em;
4662
}
4663

    
4664
.overlay-error .error-details {
4665
    font-size: 0.8em;
4666
    margin-top: 10px;
4667
}
4668

    
4669
.overlay-error .error-details anonymous {
4670
    display: block;
4671
    margin-top: 10px;
4672
}
4673

    
4674
.overlay-error h3.overlay-header {
4675
    background-color: #800000;
4676
    color: #fff;
4677
}
4678

    
4679
.overlay-error.non-critical h3.overlay-header {
4680
    background-color: #987249;
4681
}
4682

    
4683
.overlay-error span.key {
4684
    font-weight: normal;
4685
    display: block;
4686
    margin-top: 0.5em;
4687
    background-color: #74AEC9;
4688
    color: #fff;
4689
    padding: 0.4em;
4690
    font-size: 0.8em;
4691
    font-weight: bold;
4692
}
4693

    
4694
.overlay-error .indicator {
4695
    background-color: #880000;
4696
    color: #fff;
4697
    padding: 4px;
4698
    display: block;
4699
    float: left;
4700
    border: 1px solid #444;
4701
}
4702

    
4703
.overlay-error .nav-btn:hover {
4704
    
4705
}
4706

    
4707
.overlay-error .nav-btn {
4708
    margin-left: 5px;
4709
    color: #fff;
4710
    display: block;
4711
    float: left;
4712
    padding: 4px;
4713
    background-color: #AAA;
4714
    border: 1px solid #444;
4715
}
4716

    
4717
.overlay-error .error-nav {
4718
    position: absolute;
4719
    right: 0px;
4720
    bottom: -25px;
4721
    font-size: 0.8em;
4722
}
4723

    
4724
.overlay-error span.value, .overlay-error div.value {
4725
    padding: 0.4em;
4726
    display: block;
4727
    margin-bottom: 0.3em;
4728
}
4729

    
4730
.overlay h3 .closeme {
4731
    float: right;
4732
    font-size: 0.7em;
4733
    margin-top: 0.2em;
4734
    cursor: pointer;
4735
}
4736

    
4737
.overlay .overlay-header .subtitle {
4738
    display: block;
4739
    font-size: 0.8em;
4740
    color: #ddd;
4741
}
4742

    
4743
.overlay .overlay-header .subtitle img {
4744
    vertical-align: middle;
4745
    margin-left: 10px;
4746
    margin-bottom: 2px;
4747
}
4748

    
4749
.overlay-info .msg-log-entry .src {
4750
    color: #4085A5;
4751
    float: right;
4752
    font-size: 0.9em;
4753
}
4754

    
4755
.overlay-info .msg-log-entry .date {
4756
    font-style: italic;
4757
}
4758

    
4759
.overlay-info .msg-log-entry pre {
4760
    color: #333;
4761
    width: 100%;
4762
    display: none;
4763
    margin: 10px 0;
4764
}
4765

    
4766
.msg-log-entry.warning {
4767
    color: #E57F01;
4768
}
4769

    
4770
.overlay-info .msg-log-entry.with-details .src {
4771
    margin-right: 15px;
4772
}
4773

    
4774
.overlay-info .msg-log-entry.with-details {
4775
    cursor: pointer;
4776
}
4777

    
4778
.overlay-info .msg-log-entry.with-details {
4779
    background-image: url("../images/plus-8-dark.png");
4780
    background-repeat: no-repeat;
4781
    background-position: 99% 9px;
4782
}
4783

    
4784
.overlay-info .msg-log-entry.with-details.expanded {
4785
    background-image: url("../images/minus-8-dark.png");
4786
}
4787

    
4788
.overlay-info .msg-log-entry .msg {
4789
    display: inline-block;
4790
    margin-left: 10px;
4791
}
4792

    
4793
.overlay-info .msg-log-entry {
4794
    border-bottom: 1px solid #aaa;
4795
    padding: 5px;
4796
}
4797

    
4798
.overlay-info .description.subinfo {
4799
    border: none !important;
4800
    padding-top: 0 !important;
4801
}
4802

    
4803
.overlay-info .content {
4804
    background-repeat: no-repeat;
4805
    background-position: 110% 110%;
4806
    background-color: rgba(255,255,255,0.6)
4807
}
4808

    
4809
.overlay-info .overlay-header {
4810
    background-color: #4085A5;
4811
}
4812

    
4813
.overlay-info .overlay-header .title {
4814
    color: #fff;
4815
}
4816

    
4817
.overlay-info .overlay-header .closeme {
4818
    color: #fff;
4819
}
4820

    
4821
#loading-view {
4822
    width: 600px;
4823
    margin: 0 auto;
4824
    padding: 20px 0;
4825
    font-size: 0.8em;
4826
}
4827

    
4828
#loading-view .header span {
4829
    font-weight: bold;
4830
    color: #4085A5;
4831
}
4832

    
4833
#loading-view .info {
4834
    color: #ddd;
4835
}
4836

    
4837
.options-list {
4838
    margin-top: 0.5em;
4839
    font-size: 0.8em;
4840
}
4841

    
4842
.options-list.five li {
4843
    float: left;
4844
    display: block;
4845
    width: 20%;
4846
    margin-bottom: 5px;
4847
}
4848

    
4849
.options-list.five li:nth-child(5n) .options-object-cont {
4850
    margin-right: 0;
4851
}
4852

    
4853
.options-object-cont input {
4854
    border: 1px solid #aaa;
4855
    width: 92px;
4856
    padding: 0;
4857
    margin: 0;
4858
    margin-top:3px;
4859
    padding: 2px;
4860
}
4861

    
4862
.options-list.three li {
4863
    float: left;
4864
    display: block;
4865
    width: 33%;
4866
    margin-bottom: 5px;
4867
}
4868

    
4869
.meta-list .options-list li.options-object.create .options-object-cont {
4870
    background-image: url("../images/option-action-add.png");
4871
    background-repeat: no-repeat;
4872
    background-position: 90px 5px;
4873
}
4874

    
4875
.meta-list .options-list li .options-object-cont .option-action,
4876
.meta-list .options-list li.options-object.create {
4877
    cursor: pointer !important;
4878
}
4879

    
4880
.meta-list .options-list li .options-object-cont {
4881
    cursor: inherit;
4882
}
4883

    
4884
.options-list li .options-object-cont {
4885
    padding: 5px;
4886
    margin-right: 4px;
4887
    border: 1px solid #A6D1E6;
4888
    cursor: pointer;
4889
    min-height: 35px;
4890
    position: relative;
4891
}
4892

    
4893
.options-list.three li:nth-child(3n) .options-object-cont {
4894
    margin-right: 0;
4895
}
4896

    
4897
.options-list li.selected .options-object-cont {
4898
    background-color: #efefef;
4899
    border: 2px solid #4085A5;
4900
    padding: 4px;
4901
}
4902

    
4903
.options-list li.selected .options-object-cont .title {
4904
}
4905

    
4906
.options-list li.options-object .title {
4907
    display: block;
4908
    color: #FF7F2A;
4909
    margin-bottom: 2px;
4910
}
4911

    
4912
.options-list li .option-action {
4913
    display: none;
4914
    position: absolute;
4915
    background-repeat: no-repeat;
4916
}
4917

    
4918
.options-list.five li.editing {
4919
    width: 40%;
4920
}
4921

    
4922
.options-list.five li.editing .value {
4923
    display: none;
4924
}
4925

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

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

    
4942
.options-list li:hover .option-action  {
4943
    display: block;
4944
}
4945

    
4946
.options-list li.options-object .value {
4947
    color: #4085A5;
4948
    margin-top: 5px;
4949
    display: block;
4950
}
4951

    
4952
.options-list li.selected.options-object .value {
4953
}
4954

    
4955
.options-list li .options-object-cont:hover {
4956
    background-color: #fff;
4957
}
4958

    
4959
.options-list li.selected .options-object-cont:hover {
4960
    background-color: #fff;
4961
}
4962

    
4963
.options-list li img {
4964
    float: left;
4965
    margin:2px;
4966
    margin-right: 10px;
4967
    padding-bottom:10px;
4968
}
4969

    
4970
#network-vms-select-content li.options-object .value {
4971
    margin-top: 10px;
4972
    margin-left: 30px;
4973
}
4974

    
4975
#network-vms-select-content li.options-object:hover .options-object-cont,
4976
#network-vms-select-content li.options-object .options-object-cont {
4977
    background-image: url("../images/option-action-add-dark.png");
4978
    background-repeat: no-repeat;
4979
    background-position: 160px 28px;
4980
}
4981

    
4982
#network-vms-select-content li.selected:hover .options-object-cont,
4983
#network-vms-select-content li.selected .options-object-cont {
4984
    background-image: url("../images/option-action-remove.png") !important;
4985
}
4986

    
4987
#metadata-overlay-content .view .value {
4988
    margin-top: 10px;
4989
}
4990

    
4991
#metadata-overlay-content {
4992
    position: relative;
4993
}
4994

    
4995
.vm-meta .editor .predefined .predefined-meta-key:hover {
4996
    background-color: #4e8eac;
4997
    color: #fff;
4998
}
4999

    
5000
.vm-meta .editor .predefined .predefined-meta-key {
5001
    float: left;
5002
    margin-right: 5px;
5003
    padding: 4px;
5004
    display: block;
5005
    cursor: pointer;
5006
}
5007

    
5008
.vm-meta .editor .predefined {
5009
    background-color: #A6D1E6;
5010
    font-size: 0.9em;
5011
    border-top: 1px solid #ddd;
5012
}
5013

    
5014
.vm-meta .editor input {
5015
}
5016
.vm-meta .editor {
5017
    margin-bottom: 10px;
5018
}
5019

    
5020
.vm-meta .editor .form-actions .form-action {
5021
    min-width: 50px;
5022
}
5023

    
5024
.vm-meta .editor .form-field input.meta-key {
5025
    width: 90px;
5026
}
5027

    
5028
.vm-meta .form-field {
5029
    float: left;
5030
}
5031

    
5032
.vm-meta .form-actions .form-action {
5033
    float: left;
5034
    margin-right: 10px;
5035
    height: 11px;
5036
}
5037

    
5038
.vm-meta .editor .form-actions .cancel {
5039
    margin-right: 0;
5040
}
5041

    
5042
.vm-meta .editor .form-actions {
5043
    float: right;
5044
    margin:0;
5045
    padding:0;
5046
    margin-left: 15px;
5047
    margin-top: 0px;
5048
}
5049

    
5050
.vm-meta .editor {
5051
    background-color: rgba(64, 133, 165, 0.898) !important;
5052
    background-color: #649DB8;
5053
    font-size:0.9em;
5054
}
5055

    
5056
.vm-meta .meta-key-title {
5057
    font-size: 1.3em;
5058
    color: #fff;
5059
    margin-bottom: 10px;
5060
    display: none;
5061
    float: left;
5062
}
5063

    
5064
.vm-meta .editor-content {
5065
    padding: 10px;
5066
}
5067

    
5068
.vm-meta .inner-mask {
5069
    background-color: #fff;
5070
    opacity:0.6;
5071
    position: absolute;
5072
    top:0;
5073
    left:0;
5074
}
5075

    
5076
.vm-meta .editor label {
5077
    float: left;
5078
    color: #fff;
5079
    margin-right: 2px;
5080
    padding-top:4px;
5081
    font-size: 0.9em;
5082
}
5083

    
5084
.vm-meta .editor input {
5085
    border: none;
5086
    width: 170px;
5087
    margin-left: 10px;
5088
    font-size: 0.9em;
5089
    padding: 4px;
5090
}
5091

    
5092
.vm-meta li.create .options-object-cont {
5093
    background-color: #B3C9AD ;
5094
    border-color: #788774;
5095
}
5096
.vm-meta li.create .options-object-cont .value,
5097
.vm-meta li.create .options-object-cont .title {
5098
    color: #fff;
5099
}
5100

    
5101
#createvm-overlay-content {
5102
    padding: 0;
5103
}
5104

    
5105
.overlay-createvm .container {
5106
    width: 584px !important;
5107
}
5108

    
5109
.create-vm .header-step.current {
5110
    font-weight: bold;
5111
}
5112

    
5113
.create-vm .create-step-cont {
5114
    min-height: 240px;
5115
}
5116
.create-vm .create-controls {
5117
    padding: 10px;
5118
}
5119

    
5120
.create-vm ul li {
5121
    cursor: pointer;
5122
    padding: 4px;
5123
}
5124

    
5125
.create-vm ul li.selected {
5126
    background-color: #aaa;
5127
}
5128

    
5129
.cont-toggler {
5130
    background-image: url("../images/down-arrow.png");
5131
    background-position: right;
5132
    background-repeat: no-repeat;
5133
    background-color: #A1C8DB;
5134
    display: inline-block;
5135
    border-right: 6px solid #A1C8DB;
5136
    padding:2px;
5137
    padding-right: 14px;
5138
    padding-left:0;
5139
    cursor: pointer;
5140
    color: #fff;
5141
    font-size: 0.9em;
5142
}
5143

    
5144
.cont-toggler .label {
5145
    background-color: #98BDCF;
5146
    padding: 2px;
5147
    padding-left: 5px;
5148
    padding-right: 5px;
5149
}
5150

    
5151
.cont-toggler.open {
5152
    background-color: #98BDCF;
5153
    border-color: #98BDCF;
5154
    background-image: url("../images/up-arrow.png");
5155
}
5156

    
5157
.cont-toggler.open .label {
5158
    background-color: #4085A5;
5159
}
5160

    
5161
.overlay .form label {
5162
    font-color: #444;
5163
    margin-right: 10px;
5164
}
5165

    
5166
.form-field.error label {
5167
    color: #ff0000;
5168
    text-decoration: underline;
5169
}
5170

    
5171
.form-field input {
5172
    border: 1px solid #aaa;
5173
    width: 200px;
5174
    padding: 3px;
5175
}
5176

    
5177
.form-actions {
5178
    margin-top: 5px;
5179
    padding-top:5px;
5180
    border-top: 1px solid #64a6c4;
5181
    font-size: 0.8em;
5182
}
5183

    
5184
.form-actions.plain {
5185
    margin-top: 0px;
5186
    padding-top:0px;
5187
    border-top: 0px;
5188
}
5189

    
5190
.form-action {
5191
    float: right;
5192
    min-width: 140px;
5193
    background-color: #FF7F2A;
5194
    border: 1px solid #FF7F2A;
5195
    text-align: center;
5196
    color: #FFFFFF;
5197
    cursor: pointer;
5198
    padding: 4px;
5199
}
5200

    
5201
.form-action:hover {
5202
    background-color: #FF9955;
5203
    color: #FFF;
5204
}
5205

    
5206
.form-action.prev,
5207
.form-action.cancel {
5208
    background-color: #800;
5209
    border: 1px solid #800;
5210
    float: left;
5211
}
5212

    
5213
.form-action.prev:hover,
5214
.form-action.cancel:hover {
5215
    background-color: #CC0000;
5216
    color: #fff;
5217
}
5218

    
5219
.form-action.next,
5220
.form-action.ok {
5221
    background-color: #080;
5222
    border: 1px solid #080;
5223
}
5224

    
5225
.form-action.next:hover,
5226
.form-action.ok:hover {
5227
    background-color: #00aa00;
5228
    color: #fff;
5229
}
5230

    
5231
.form-action .create,
5232
.form-action .submit {
5233

    
5234
}
5235

    
5236
.form-action.in-progress, button.in-progress {
5237
    background-image: url("../images/icons/indicators/medium/horizontal-progress.gif");
5238
    background-repeat: no-repeat;
5239
    background-position: center center;
5240
    color: transparent;
5241
}
5242

    
5243
#createvm-overlay-content {
5244
    padding: 0;
5245
}
5246

    
5247
.create-vm .image-details.selected .size {
5248

    
5249
}
5250

    
5251
.create-vm .image-details .show-details:hover {
5252
    color: #aaa !important; 
5253
}
5254
.create-vm .image-details.selected .show-details:hover {
5255
    color: #fff !important; 
5256
}
5257

    
5258
.create-vm .image-details.selected .show-details,
5259
.create-vm .image-details.selected .size {
5260
    color: #eee;
5261
}
5262

    
5263
.create-vm .image-details.selected span.owner {
5264
    color: #fff;
5265
}
5266

    
5267

    
5268
.create-vm .image-details p {
5269
    font-size: 0.8em;
5270
    padding-left: 27px;
5271
    display:block;
5272
}
5273

    
5274
.create-vm .image-details span.owner {
5275
    display: block;
5276
    font-size: 0.9em;
5277
    float: right;
5278
    color: #FF7F2A;
5279
    position: absolute;
5280
    top: 5px;
5281
    right: 5px;
5282
}
5283

    
5284
.create-vm .select-image .show-details {
5285
    display: none;
5286
    font-size: 0.8em;
5287
    text-decoration: underline;
5288
    color: #000;
5289
    position: absolute;
5290
    bottom: 5px;
5291
    right: 5px;
5292
}
5293

    
5294
.create-vm .image-details .size {
5295
    margin-top: 2px;
5296
    font-size: 0.8em;
5297
    color: #aaa;
5298
    margin-left: 10px;
5299
}
5300

    
5301
.create-vm .step-cont {
5302
    margin: 15px;
5303
}
5304

    
5305
.create-vm .create-step-cont {
5306
    min-height: 250px;
5307
    float: left;
5308
    width: 584px;
5309
}
5310

    
5311
.create-vm .create-controls {
5312
    padding: 10px;
5313
    border-top: 1px solid #ddd;
5314
}
5315

    
5316
.create-vm .empty {
5317
    font-size: 0.8em;
5318
    color: #444;
5319
}
5320

    
5321
.create-vm h4 {
5322
    color: #5CA1C0;
5323
    margin-bottom: 0.5em;
5324
    font-family: arial;
5325
}
5326
.create-vm ul li {
5327
    cursor: pointer;
5328
    padding: 4px;
5329
    font-size: 0.9em;
5330
}
5331

    
5332
.create-vm .create-step-cont li.ssh-key-option.selected,
5333
.create-vm ul li.selected {
5334
    background-color: #FF7F2A;
5335
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5336
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5337
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5338
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5339
    color: #fff;
5340
}
5341

    
5342
.create-vm .images-list-cont.loading .loading-indicator {
5343
    display: block !important;
5344
}
5345

    
5346
.create-vm .images-list-cont .loading-indicator {
5347
    display: none;
5348
    position: absolute;
5349
    right: -13px;
5350
    top: 2px;
5351
    width: 30px;
5352
    height: 10px;
5353
    background-repeat: no-repeat;
5354
    background-image: url("../images/icons/indicators/medium/progress.gif");
5355
}
5356

    
5357
.create-vm .images-list-cont h4 {
5358
    position: relative;
5359
}
5360

    
5361
.create-vm .images-list-cont {
5362
    width: 40%;
5363
    float: left;
5364
    padding-left: 3%;
5365
    padding-right: 3%;
5366
}
5367

    
5368
.create-vm li p.desc {
5369
    font-size: 0.9em;
5370
}
5371

    
5372
.create-vm p.desc.warning {
5373
    color: #880000;
5374
}
5375

    
5376
.create-vm p.desc.empty {
5377
    color: #000;
5378
}
5379

    
5380
.create-vm p.desc {
5381
    font-size: 0.8em;
5382
    color: #888;
5383
    margin-bottom: 10px;
5384
}
5385

    
5386
.create-vm li.role .values .val:hover {
5387
    background-color: #eee;
5388
}
5389
.create-vm li.role .values .val.selected,  .create-vm li.role .values .val.selected:hover {
5390
    color: #fff;
5391
    background-color: #FF9955;
5392
}
5393

    
5394
.create-vm .images-filter-cont, .create-vm .flavors-predefined-cont {
5395
    width: 18%;
5396
    padding-right: 4%;
5397
    float:left;
5398
    border-right: 1px solid #A1C8DB;
5399
    overflow: auto;
5400
}
5401

    
5402
.create-vm .flavor-options-cont {
5403
    width: 74%;
5404
    float: left;
5405
    margin-left: 20px;
5406
}
5407

    
5408
.create-vm .flavor-options-cont .flavor-options li:hover {
5409
    background-image:-webkit-linear-gradient(top, #E8F4FA, #D1E7F0);
5410
    background-image:-o-linear-gradient(top, #E8F4FA, #D1E7F0);
5411
    background-image:-moz-linear-gradient(top, #E8F4FA, #D1E7F0);
5412
    background-image:linear-gradient(top, #E8F4FA, #D1E7F0);
5413
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E8F4FA', endColorstr='#D1E7F0', GradientType=0);
5414
}
5415

    
5416
.create-vm .flavor-options-cont .flavor-options li.disabled * {
5417
    color: #eee !important;
5418
}
5419

    
5420
.create-vm .flavor-options-cont .flavor-options li.disabled {
5421
    background-image:linear-gradient(top, #aaa, #ddd);
5422
    background-image:-webkit-linear-gradient(top, #aaa, #ddd);
5423
    background-image:-o-linear-gradient(top, #aaa, #ddd);
5424
    background-image:-moz-linear-gradient(top, #aaa, #ddd);
5425
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#aaaaaa', endColorstr='#dddddd', GradientType=0);
5426
}
5427

    
5428
.create-vm .flavor-options-cont .flavor-options li.selected {
5429
    background-color: #FF9955;
5430
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5431
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5432
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5433
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5434
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF9955', endColorstr='#E88B4D', GradientType=0);
5435
    border: 1px solid #C97943;
5436
}
5437

    
5438
.create-vm .predefined-list li.disabled {
5439
    color: #ddd !important;
5440
}
5441

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

    
5456
.create-vm .flavor-options-cont .flavor-options {
5457
    margin-bottom: 2px;
5458
}
5459

    
5460

    
5461
.create-vm .flavor-options .metric {
5462
    font-size: 0.8em;
5463
    margin-left: 2px;
5464
}
5465

    
5466
.create-vm .flavor-options span.title {
5467
    color: #444;
5468
}
5469

    
5470
.create-vm .flavor-options span.desc {
5471
    display: block;
5472
    color: #aaa;
5473
    font-weight: normal;
5474
    font-size: 0.8em;
5475
    float: right;
5476
    margin-top: 4px;
5477
}
5478

    
5479
.disktip {
5480
    padding: 4px;
5481
    top: 20px;
5482
}
5483

    
5484
.create-vm .flavor-options .flavors-disk-template-list {
5485
    position: relative;
5486
}
5487

    
5488
.create-vm .flavor-options .disk_template.option {
5489
    z-index: 10;
5490
    min-width: 50px;
5491
    text-align: center;
5492
}
5493

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

    
5511
.create-vm .flavor-options .disk_template.option .description {
5512
    display: none;
5513
    position: absolute;
5514
    bottom: -20px;
5515
    left:0;
5516
    color: #888;
5517
    font-style: italic;
5518
    display: block;
5519
    background-color: #fff;
5520
    width: 100%;
5521
    text-align: left;
5522
    z-index: 0;
5523
    border-top: 1px solid #ddd;
5524
    padding-top: 3px;
5525
    display: none;
5526
}
5527

    
5528
.create-vm .flavor-options .selected .value {
5529
    color: #FFF;
5530
}
5531

    
5532
.create-vm .flavor-options .value {
5533
    font-weight: bold;
5534
    color: #5CA1C0;
5535
}
5536

    
5537
.create-vm .flavor-options-cont h4 {
5538
    border-bottom: 1px solid #A1C8DB;
5539
    padding-bottom: 5px;
5540
}
5541

    
5542
.create-vm .images-info-cont {
5543
    width: 28%;
5544
    padding-left: 3%;
5545
    float: left;
5546
    border-left: 1px solid #A1C8DB;
5547
}
5548

    
5549
.create-vm .select-image.wide .show-details {
5550
    display: inline;
5551
}
5552

    
5553
.create-vm .select-image .images-info-cont .hide {
5554
    display: none;
5555
}
5556

    
5557
.create-vm .select-image.wide .images-info-cont .hide {
5558
    display: block;
5559
    float: right;
5560
    position: absolute;
5561
    right: 10px;
5562
    top: 10px;
5563
    font-size: 0.8em;
5564
    text-decoration: underline;
5565
    color: #5CA1C0;
5566
    cursor: pointer;
5567
}
5568

    
5569
.create-vm .select-image.wide .images-list-cont {
5570
    width: 74%;
5571
    padding-right: 0;
5572
}
5573

    
5574
.create-vm .select-image.wide .images-info-cont .description .title {
5575
    display: none;
5576
    float: none;
5577
}
5578

    
5579
.create-vm .select-image.wide .images-info-cont .description p {
5580
    background-color: #fff;
5581
    border: 1px solid #ddd;
5582
    padding: 10px;
5583
    float: none;
5584
}
5585

    
5586
.create-vm .select-image.wide .selected .size {
5587
    color: #FFF !important;
5588
}
5589

    
5590
.create-vm .select-image.wide .image-details .size {
5591
    color: #5CA1C0;
5592
    position: absolute;
5593
    top: 5px;
5594
}
5595

    
5596
.create-vm .select-image.wide .images-info-cont h3 {
5597
    color: #5CA1C0;
5598
    margin: 10px 0;
5599
    margin-top: 5px;
5600
    text-align: left;
5601
    font-size: 0.9em;
5602
}
5603

    
5604
.create-vm .select-image.wide .images-info-cont .description p {
5605
    height: 50px;
5606
}
5607

    
5608
.create-vm .select-image.wide .images-info-cont .description {
5609
    width: 100% !important;
5610
    float: none !important;
5611
    background-color: transparent !important;
5612
    padding: 0 !important;
5613
    font-size: 1.1em;
5614
}
5615
.create-vm .select-image.wide .images-info-cont .extra-details {
5616
    height: 160px;
5617
    overflow-y: scroll;
5618
    padding-right: 15px;
5619
}
5620

    
5621
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail.extra-meta .title .custom {
5622
    display: inline-block;
5623
}
5624

    
5625
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail.extra-meta .title {
5626
    background-color: #999 !important;
5627
    border-color: #888 !important;
5628
}
5629
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail .custom {
5630
    float: right;
5631
    display: none;
5632
    font-size: 0.8em;
5633
    margin-left: 10px;
5634
    color: #DDD;
5635
    margin-top: 2px;
5636
}
5637

    
5638
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail {
5639
    padding: 0px;
5640
    background-color: transparent;
5641
    margin-bottom: 4px;
5642
}
5643

    
5644
.create-vm .select-image.wide .images-info-cont .extra-details .title {
5645
    float: left;
5646
    display: block;
5647
    width: 39%;
5648
    padding: 1%;
5649
    background-color: #5CA1C0;
5650
    color: #fff;
5651
    border: 1px solid #4F8DAA;
5652
    font-size: 0.8em;
5653
}
5654

    
5655
.create-vm .select-image.wide .images-info-cont .extra-details .value {
5656
    float: right;
5657
    display: block;
5658
    width: 55%;
5659
    padding: 1%;
5660
    border: none;
5661
    background-color: #FFF;
5662
    color: #444;
5663
    border: 1px solid #ddd;
5664
    margin-bottom: 0px;
5665
    font-size: 0.8em;
5666
}
5667

    
5668
.create-vm .select-image.wide .images-info-cont .image-detail {
5669
}
5670

    
5671
.create-vm .select-image.wide ul.images-list {
5672
    height: 310px;
5673
    overflow-y: scroll;
5674
    padding-right: 3%;
5675
}
5676

    
5677
.create-vm .select-image.wide .images-info-cont {
5678
    position: absolute;
5679
    width: 88%;
5680
    background-color: #DAE9F0;
5681
    padding: 2%;
5682
    border-left: none;
5683
    height: 320px;
5684
    box-shadow: 0px 0px 2px #aaa;
5685
    -moz-box-shadow: 0px 0px 2px #aaa;
5686
    -webkit-box-shadow: 0px 0px 2px #aaa;
5687
    display: none;
5688
}
5689

    
5690

    
5691
.create-vm .images-info-cont h4, .create-vm .create-step-cont .param h4{
5692
    color: #FF9955;
5693
    margin-bottom: 1em;
5694
    font-size: 1.2em;
5695
}
5696

    
5697
.create-vm .images-info-cont span.title {
5698
    color: #4085A5;
5699
    display: block;
5700
    margin-bottom: 2px;
5701
    font-size: 0.8em;
5702
}
5703

    
5704
.create-vm .type-filter li {
5705
    font-size: 0.8em;
5706
    /*font-weight: bold;*/
5707
    padding: 4px;
5708
    margin-bottom: 0px;
5709
    color: #FF7F2A;
5710
}
5711

    
5712
.create-vm .images-list li {
5713
    min-height: 30px;
5714
}
5715
.create-vm .images-list .image-details:hover {
5716
    background-color: #eee;
5717
}
5718

    
5719
.create-vm .images-list .image-details.selected:hover {
5720
    background-color: #FF7F2A;
5721
}
5722

    
5723
.create-vm .images-list .image-details.selected {
5724
    /*font-weight: bold;*/
5725
}
5726

    
5727
.create-vm .images-list .image-details {
5728
    padding: 6px;
5729
    margin-bottom:1px;
5730
    position: relative;
5731
}
5732

    
5733
.create-vm .images-list .image-details img {
5734
    vertical-align: middle;
5735
    margin-right: 10px;
5736
}
5737

    
5738
.create-vm .images-info-cont .image-detail:last-child p {
5739
    border-bottom: none;
5740
}
5741

    
5742
.create-vm .images-info-cont h4 img {
5743
    vertical-align: middle;
5744
    margin-right: 7px;
5745
    margin-bottom: 5px;
5746
}
5747

    
5748
.create-vm .images-info-cont .description p {
5749
    font-size: 0.8em;
5750
}
5751

    
5752
.create-vm .images-info-cont p {
5753
    margin-bottom: 7px;
5754
    font-size: 0.9em;
5755
    border-bottom: 1px solid #A1C8DB;
5756
    padding-bottom: 7px;
5757
}
5758

    
5759
.create-vm .step-header {
5760
    padding-bottom:0;
5761
    position: relative;
5762
}
5763

    
5764
.create-vm .step-header .header-step .info span.subtitle {
5765
    font-size: 1.2em;
5766
    color: #fff;
5767
    font-weight: bold;
5768
}
5769

    
5770
.create-vm .step-header .header-step .info span {
5771
    float: none;
5772
    text-align: right;
5773
}
5774

    
5775
.create-vm .step-header .header-step .info {
5776
    position: absolute;
5777
    right: 15px;
5778
    top: 20px;
5779
    font-size: 0.8em;
5780
}
5781

    
5782
.create-vm .step-header .header-step span {
5783
    float: left;
5784
    display: block;
5785
}
5786

    
5787
.create-vm .steps-container {
5788
    width: 2000em;
5789
}
5790

    
5791
.create-vm .step-header .header-step .title {
5792
    margin-top: 20px;
5793
    font-size: 1em;
5794
    margin-left: 10px;
5795
}
5796

    
5797
#createvm-overlay-content {
5798
    width: 584px;
5799
    overflow: hidden;
5800
}
5801

    
5802
.create-vm .steps-history .steps-history-cont.current .title {
5803
    display: block;
5804
    top: 23px;
5805
    left: 43px;
5806
    font-size: 1.2em;
5807
    color: #ffffff;
5808
    font-weight: bold;
5809
    font-family: 'Ubuntu', sans-serif !important;
5810
}
5811

    
5812
.create-vm .steps-history .steps-history-cont.current .subnum {
5813
    display: none;
5814
    float: none;
5815
    font-size: 0.9em;
5816
    font-family: 'Ubuntu', sans-serif  !important;
5817
}
5818

    
5819
.create-vm .steps-history .steps-history-cont.current .subtitle,
5820
.create-vm .steps-history .steps-history-cont.current .description {
5821
    font-family: 'Ubuntu', sans-serif  !important;
5822
}
5823

    
5824
.create-vm .steps-history .steps-history-cont.current .info {
5825
    display: block;
5826
    font-family: 'Ubuntu', sans-serif !important;
5827
}
5828

    
5829
.create-vm .steps-history .steps-history-cont.completed .title,
5830
.create-vm .steps-history .steps-history-cont.completed .num {
5831
    color: #A1C8DB;
5832
}
5833

    
5834
.create-vm .steps-history .steps-history-cont.completed {
5835
    background-color: #4085A5;
5836
    color: #fff;
5837
    cursor: pointer;
5838
}
5839

    
5840
.create-vm .steps-history .steps-history-cont.completed .steps-history-step {
5841
    background-image: url("../images/check.png");
5842
}
5843

    
5844
.create-vm .steps-history .steps-history-cont.current .steps-history-step {
5845
    width: 320px;
5846
}
5847

    
5848
.create-vm .steps-history .steps-history-cont.current .num {
5849
    color: #fff;
5850
}
5851

    
5852
.create-vm .steps-history .steps-history-cont.current .info {
5853
    color: #4085A5;
5854
    font-size: 0.8em;
5855
}
5856

    
5857
.create-vm .steps-history .steps-history-cont.current {
5858
    background-color: #A1C8DB;
5859
    color: #fff;
5860
    width: 428px;
5861
}
5862

    
5863
.create-vm .steps-history-step {
5864
    padding: 4px;
5865
    padding-left: 7px;
5866
    font-size: 1em;
5867
    font-family: 'Ubuntu', sans-serif  !important;
5868
    margin-right: 5px;
5869
    padding-top: 12px;
5870
    background-position: right 30px;
5871
    background-image: none;
5872
    background-repeat: no-repeat;
5873
}
5874

    
5875
.create-vm .steps-history {
5876
    background-color: #4085A5;
5877
}
5878

    
5879
.create-vm .steps-history .steps-history-cont.last {
5880
    border-right: none;
5881
}
5882

    
5883
.create-vm .steps-history .steps-history-cont .num {
5884
    margin-left: 5px;
5885
    margin-top: -10px;
5886
    padding-bottom: 10px;
5887
}
5888

    
5889
.create-vm .steps-history .steps-history-cont .title {
5890
    display: none;
5891
    position: absolute;
5892
    bottom: 0px;
5893
    text-align: center;
5894
    padding-bottom: 2px;
5895
    left:0;
5896
    width: 55px;
5897
    margin-left:0;
5898
    margin-top:0;
5899
    font-size: 0.8em;
5900
}
5901

    
5902
.create-vm .steps-history .steps-history-cont .subnum,
5903
.create-vm .steps-history .steps-history-cont .info {
5904
    display: none;
5905
}
5906

    
5907
.create-vm .steps-history .steps-history-cont {
5908
    height: 70px;
5909
    width: 51px;
5910
    float: left;
5911
    color: #fff;
5912
    border-right: 1px solid #A1C8DB;
5913
    color: #A1C8DB;
5914
    background-color: #4085A5;
5915
    background-position: center right;
5916
    background-image: none;
5917
    background-repeat: no-repeat;
5918

    
5919
    -webkit-transition: background-color .15s ease-in;
5920
    -o-transition: background-color .15s ease-in;
5921
    -moz-transition: background-color .15s ease-in;
5922
    transition: background-color .15s ease-in;
5923

    
5924
    border-bottom: 1px solid #aaa;
5925
}
5926

    
5927
.create-vm .step-header .header-step .num {
5928
    color: #225871;
5929
    font-size: 4em;
5930
    margin-bottom: -5px;
5931
    font-family: 'Ubuntu', sans-serif;
5932
    font-weight: normal !important;
5933
}
5934

    
5935
.create-vm .step-header .header-step {
5936
    color: #;
5937
    margin-bottom: -6px;
5938
    width: 25%;
5939
    padding-left: 0%;
5940
    display: block;
5941
    float: left;
5942
}
5943

    
5944
.create-vm .step-header .header-step.current {
5945
    color: #387693;
5946
}
5947

    
5948
.create-vm .image-filters-title {
5949
    margin-top: 1em;
5950
    margin-bottom: 0.5em;
5951
}
5952

    
5953
.create-vm .create-step-cont span.clear {
5954
    font-size: 0.8em;
5955
    font-weight: bold;
5956
    color: #A1C8DB;
5957
    display: block;
5958
}
5959

    
5960
.create-vm .category-filters li {
5961
    float:left;
5962
    display: block;
5963
    padding: 4px;
5964
    background-color: #eee;
5965
    margin-right: 5px;
5966
    font-size: 0.9em;
5967
    margin-bottom: 5px;
5968
}
5969

    
5970
.create-vm .content-cont {
5971
    height: 340px;
5972
    overflow: auto;
5973
}
5974

    
5975
.create-vm .vm-confirm .confirm-params span.cval {
5976
    margin-left: 8px;
5977
    color: #444;
5978
}
5979

    
5980
.create-vm .vm-confirm .confirm-params span.ckey {
5981
    color: #4085A5;
5982
    font-weight: bold;
5983
}
5984

    
5985
.create-vm .vm-confirm .confirm-params {
5986
    margin-bottom: 15px;
5987
}
5988

    
5989
.create-vm .vm-confirm h3.vm-name {
5990
    background-repeat: no-repeat;
5991
    background-position: left center;
5992
    font-size: 1.4em;
5993
    padding-left: 1.45em;
5994
    color: #4085A5;
5995
}
5996

    
5997
.create-vm .images-list-cont h4 a {
5998
    margin-top: 3px;
5999
    margin-right: -2px !important;
6000
}
6001
.create-vm .images-list-cont h4 a,
6002
.create-vm .list-cont h4 a {
6003
    font-size: 0.8em;
6004
    font-weight: normal;
6005
    margin-right: 5px;
6006
    float: right;
6007
    color: #FF7F2A;
6008
}
6009

    
6010
.create-vm .confirm-params {
6011
    overflow: auto;
6012
}
6013

    
6014
.create-vm .vm-confirm .ssh.confirm-params {
6015
    max-height: 150px;
6016
}
6017

    
6018
.create-vm .personalize-cont .confirm-params {
6019
    max-height: 190px;
6020
}
6021

    
6022
.create-vm .personalize-cont,
6023
.create-vm .confirm-cont {
6024
    height: 250px;
6025
}
6026

    
6027
.create-vm .create-step-cont .rename input.rename-field {
6028
    font-size: 1.4em;
6029
    padding: 5px;
6030
    width: 93%;
6031
    padding-left: 30px;
6032
    background-position: 7px center;
6033
    background-repeat: no-repeat;
6034
}
6035

    
6036
.create-vm .create-step-cont .rename label {
6037
    display: block;
6038
}
6039

    
6040
.create-vm .create-step-cont .personalize-conts,
6041
.create-vm .create-step-cont .confirm-conts {
6042
    margin-top: 20px;
6043
}
6044

    
6045
.create-vm .create-step-cont .personalize-cont,
6046
.create-vm .create-step-cont .confirm-cont {
6047
    width: 30%;
6048
    margin-right: 2%;
6049
    border-right: 1px solid #A1C8DB;
6050
    float: left;
6051
}
6052

    
6053
.create-vm .create-step-cont .confirm-cont ul li .title {
6054
    width: 55px;
6055
    float: left;
6056
}
6057

    
6058
.create-vm .create-step-cont .list-cont ul li .value {
6059
    float: right;
6060
    padding-top: 2px;
6061
    display: block;
6062
    width: 90px;
6063
    text-align: right;
6064
}
6065

    
6066
.create-vm .create-step-cont .list-cont ul li.flavor-disktype .value {
6067
    width: 45px;
6068
}
6069

    
6070
.create-vm .create-step-cont .list-cont ul li.image-description .value,
6071
.create-vm .create-step-cont .list-cont ul li.image-name .value {
6072
    float: none;
6073
    width: auto;
6074
    text-align:left;
6075
    width: auto;
6076
}
6077

    
6078
.create-vm .create-step-cont .list-cont ul li {
6079
    padding:0;
6080
    margin:0;
6081
    margin-bottom: 5px;
6082
    border-bottom: 1px solid #EEE;
6083
    padding-bottom: 7px;
6084
    margin-right: 10px;
6085
}
6086

    
6087
.create-vm .create-step-cont li.ssh-key-option .check {
6088
    float: right;
6089
    margin-right: 5px;
6090
    margin-top: 0px;
6091
}
6092

    
6093
.create-vm .create-step-cont li.ssh-key-option.selected {
6094
}
6095
.create-vm .create-step-cont li.ssh-key-option.selected:hover {
6096
    background-color: #F95;
6097
}
6098

    
6099
.create-vm .create-step-cont li.ssh-key-option:hover {
6100
    background-color: #eee;
6101
}
6102

    
6103
.create-vm .create-step-cont li.ssh-key-option.selected {
6104
}
6105

    
6106
.create-vm .create-step-cont li.ssh-key-option {
6107
    padding: 6px !important;
6108
}
6109

    
6110
.create-vm .create-step-cont .list-cont.ssh {
6111
    width: 60%;
6112
}
6113

    
6114
.create-vm .create-step-cont .list-cont.meta h4 {
6115
    margin-right: 0;
6116
}
6117

    
6118
.create-vm .create-step-cont .list-cont.meta {
6119
    margin-right:0;
6120
    border-right: none;
6121
    width: 195px;
6122
}
6123

    
6124
.create-vm .list-cont > h4 {
6125
    font-size: 1.2em;
6126
    margin-right: 10px;
6127
    border-bottom: 1px solid #A1C8DB;
6128
    padding-bottom: 5px;
6129
    color: #387693;
6130
}
6131

    
6132
.create-vm .list-cont .param.image-name {
6133
    margin-bottom: 0 !important;
6134
    border-bottom: none !important;
6135
}
6136

    
6137
.create-vm .list-cont .param h4 {
6138
    margin-bottom: 0px !important;
6139
    font-size: 1.1em !important; 
6140
}
6141

    
6142
.create-vm .list-cont .param {
6143
    margin-bottom: 7px !important;
6144
}
6145

    
6146
.create-vm .list-cont .value {
6147
    font-weight: bold;
6148
}
6149

    
6150
.create-vm .list-cont .param .value {
6151
    font-size: 0.9em;
6152
}
6153

    
6154
.create-vm .list-cont .param .title {
6155
    color: #387693;
6156
}
6157

    
6158
.create-vm .list-cont .image-description {
6159
    margin-left:0;
6160
}
6161

    
6162
.create-vm .list-cont .image-description .value {
6163
    font-weight: normal;
6164
    margin-left: 0 !important;
6165
}
6166

    
6167
.create-vm .list-cont .image-description .title {
6168
    display: none;
6169
    font-size: 0.8em;
6170
}
6171

    
6172
.create-vm .list-cont.meta .values span {
6173
    display:block;
6174
    float: left;
6175
    margin-right: 4px;
6176
    border: 1px solid #eee;
6177
    padding:3px;
6178
    margin-bottom: 4px;
6179
    font-size: 0.9em;
6180
}
6181

    
6182
.create-vm .list-cont.meta .key {
6183
    font-weight: bold;
6184
    font-size: 0.9em;
6185
    display: block;
6186
    margin-bottom: 5px;
6187
}
6188

    
6189
.create-vm .meta input {
6190
    font-size: 0.8em;
6191
}
6192

    
6193
.vm-connect .connect-cont {
6194
    margin-bottom: 20px;
6195
    border-bottom: 1px solid #A1C8DB;
6196
    padding-bottom: 20px;
6197
}
6198

    
6199
.vm-connect .connection-info {
6200
    padding-bottom: 0px;
6201
    margin-bottom: 0;
6202
    border-bottom: none;
6203
}
6204

    
6205
.vm-connect .connection-info .connect a {
6206
    color: #fff;
6207
}
6208

    
6209
.vm-connect .connection-info .connect {
6210
    background-color: #387693;
6211
    color: #fff;
6212
    padding: 10px;
6213
    font-size: 1.2em;
6214
    text-align: center;
6215
}
6216

    
6217
.clip-copy {
6218
    display: block;
6219
    width: 20px;
6220
    height: 20px;
6221
    position: absolute;
6222
    border: 1px solid #387693;
6223
    background-image: url("../images/clipboard.png");
6224
    background-repeat: no-repeat;
6225
    background-position: center;
6226
    cursor: pointer;
6227
    background-color: #A1C8DB;
6228
}
6229

    
6230
.password-cont .clip-copy { right: 10px; top: 8px;}
6231

    
6232

    
6233
.overlay-invitations {
6234
    width: 680px;
6235
}
6236
.invitations-form .sending .sending-msg {
6237
    font-size: 0.8em;
6238
    display: block !important;
6239
    margin-bottom: 5px;
6240
    color: #008800;
6241
}
6242

    
6243
.invitations-form .send-error {
6244
    font-size: 0.8em;
6245
    margin-bottom: 5px;
6246
    margin-top: 5px;
6247
    color: #800;
6248
    padding: 3px;
6249
    padding-left: 0;
6250
    display: none;
6251
}
6252

    
6253
.invitations-form .error label {
6254
    color: #000 !important;
6255
}
6256

    
6257
.invitations-form .form-field {
6258
    width: 49%;
6259
    float: left;
6260
}
6261

    
6262
.invitations-view .left.none {
6263
    background-color: #880000;
6264
}
6265

    
6266
.invitations-form {
6267
    position: relative;
6268
}
6269

    
6270
.invitations-form h3 {
6271
    float: left;
6272
}
6273

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

    
6289
.invitations-view .left {
6290
    font-size: 1em;
6291
    color: #fff;
6292
    font-weight: bold;
6293
    background-color: #4085A5;
6294
    padding: 4px;
6295
}
6296

    
6297
input.has-errors {
6298
    border-color: #ff0000;
6299
}
6300

    
6301
.none-left .invitations-wrapper .invitations-list {
6302
    width: 100% !important;
6303
    border-left: none !important;
6304
    padding-left: 0;
6305
}
6306

    
6307
.invitations-wrapper .invitations-list {
6308
    width: 40%;
6309
    float: left;
6310
    padding-left: 10px;
6311
    border-left: 1px solid #4085A5;
6312
    margin-left: -1px
6313
}
6314

    
6315
.invitations-wrapper .invitations-form {
6316
    width: 57%;
6317
    float: left;
6318
    border-right: 1px solid #4085A5;
6319
}
6320

    
6321
.invitations-wrapper label span {
6322
    color: #aaa;
6323
    font-size: 0.8em;
6324
}
6325

    
6326
.invitations-wrapper label {
6327
    display: block;
6328
    font-size: 0.9em;
6329
    margin-bottom:10px;
6330
    font-weight: bold;
6331
}
6332

    
6333
.invitations-view .add-new-invitation {
6334
    cursor: pointer;
6335
}
6336

    
6337
.invitations-wrapper input.name {
6338
    width: 150px;
6339
}
6340

    
6341
.invitations-wrapper input {
6342
    font-size: 0.9em;
6343
    width: 155px;
6344
    padding:4px;
6345
}
6346

    
6347
.invitations-list .invitation-sent {
6348
    border-bottom: 1px solid #A1C8DB;
6349
    padding-bottom: 5px;
6350
    margin-bottom: 5px;
6351
    position: relative;
6352
}
6353

    
6354
.invitations-view h3 {
6355
    margin-bottom: 10px;
6356
    color: #4085A5;
6357
}
6358

    
6359
.invitations-list .invitation-sent.last,
6360
.invitations-list .invitation-sent:last-child {
6361
    border-bottom: none;
6362
}
6363

    
6364

    
6365
.invitations-list .invitation-sent .email {
6366
    color: #D98147;
6367
    font-size: 0.8em;
6368
    font-weight: bold;
6369
    margin-top: 2px;
6370
}
6371

    
6372
.invitations-list .pagination a,
6373
.invitations-list .pagination span {
6374
    padding: 0.2em 0.3em;
6375
}
6376

    
6377
.invitations-list .pagination {
6378
    font-size: 0.75em;
6379
}
6380

    
6381
.invitations-list .name {
6382
    color: #444;
6383
    font-size: 0.9em;
6384
}
6385

    
6386
.invitations-list .status.sending {
6387
    background-image: url("../images/icons/indicators/small/progress.gif");
6388
}
6389

    
6390
.invitations-list .status.sent {
6391
    background-image: url("../images/invitation_accepted.png");
6392
}
6393

    
6394
.invitations-list .status.resend {
6395
    background-image: url("../images/resend.png");
6396
}
6397

    
6398
.invitations-list .status.resend {
6399
    cursor: pointer;
6400
}
6401

    
6402
.invitations-list .status {
6403
    width: 20px;
6404
    height: 15px;
6405
    position: absolute;
6406
    top:5px;
6407
    right: 2px;
6408
    background-repeat: no-repeat;
6409
    background-position: center;
6410
}
6411

    
6412
.invitations-form .form-entry:last-child {
6413
    border-bottom: none;
6414
}
6415

    
6416
.invitations-form .form-entry {
6417
    position: relative;
6418
    margin-bottom: 10px;
6419
    padding-bottom: 10px;
6420
    border-bottom: 1px solid #ddd;
6421
    margin-right: 10px;
6422
}
6423

    
6424
.invitations-form .send-invitations {
6425
    float: left;
6426
    padding: 5px;
6427
    color: #fff;
6428
    margin-right: 10px;
6429
    margin-top: 10px;
6430
}
6431

    
6432
.invitations-form .form-entry.error {
6433
    padding-bottom: 0px;
6434
}
6435

    
6436
.invitations-form .form-entry.error .remove-invitation {
6437
    bottom: 32px;
6438
}
6439

    
6440
.invitations-form .remove-invitation {
6441
    padding: 5px;
6442
    background-image: url("../images/option-action-remove.png");
6443
    background-position: center;
6444
    background-repeat: no-repeat;
6445
    color: #fff;
6446
    width: 15px;
6447
    height: 15px;
6448
    cursor: pointer;
6449
    text-indent: -50000px;
6450
    position: absolute;
6451
    right: -10px;
6452
    bottom: 14px;
6453
}
6454

    
6455
.invitations-list .resent-info,
6456
.invitations-form .top-info {
6457
    font-size: 0.8em;
6458
    margin-bottom: 10px;
6459
}
6460

    
6461
.invitations-list .msg .email,
6462
.invitations-form .success .msg .email {
6463
    font-weight: bold;
6464
}
6465

    
6466
.invitations-list .msg.err-msg,
6467
.invitations-list .success.msg,
6468
.invitations-form .success .msg {
6469
    background-color: #080;
6470
    color: white;
6471
    padding: 5px;
6472
    margin-right: 10px;
6473
    margin-bottom: 5px;
6474
}
6475
.invitations-list .msg.err-msg,
6476
.invitations-list .success.msg {
6477
    margin-right: 0px;
6478
}
6479
.invitations-list .msg.err-msg {
6480
    background-color: #800;
6481
}
6482

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

    
6502
.empty .items-list {
6503
    margin-top: 0 !important;
6504
}
6505

    
6506
.models-view .items-empty-msg {
6507
    border-top: 1px solid #aaa;
6508
    padding-top: 10px;
6509
    font-size: 1em;
6510
    margin-top:0 !important;
6511
}
6512

    
6513
.models-view .items-empty-msg,
6514
.models-view .model-description {
6515
    color: #444;
6516
    margin: 10px 0;
6517
}
6518

    
6519
.models-view .model-list .collection-action.disabled {
6520
    background-color: #aaa;
6521
    border-color: #aaa;
6522
    cursor: default;
6523
}
6524
.models-view .model-list .collection-action.disabled:hover {
6525
    background-color: #aaa;
6526
    border-color: #aaa;
6527
}
6528

    
6529
.models-view .model-list .collection-action:hover {
6530
    background-color: #aaa;
6531
}
6532

    
6533
.models-view .model-list .collection-action:hover {
6534
    background-color: #F95;
6535
    border-color: #F95;
6536
}
6537

    
6538
.models-view .model-list .collection-action.in-progress {
6539
    background-color: #aaa;
6540
    color: #fff;
6541
    border-color: #aaa;
6542
    background-image: url("../images/icons/indicators/small/progress.gif") !important;
6543
}
6544

    
6545
.models-view .model-list .collection-action.add-generate {
6546
    background-image: url("../images/option-action-generate-ssh.png");
6547
}
6548

    
6549
.models-view .model-list .collection-action.add {
6550
    background-image: url("../images/option-action-add.png");
6551
    padding-right: 20px !important;
6552
}
6553

    
6554
.models-view .model-list .collection-action {
6555
    float: right;
6556
    background-color: #FF7F2A;
6557
    color: #fff;
6558
    padding: 6px 8px;
6559
    margin-left: 10px;
6560
    cursor: pointer;
6561
    padding-right: 30px;
6562
    background-position: right center;
6563
    background-repeat: no-repeat;
6564
    background-clip: border-box;
6565
    border-right: 5px solid #FF7F2A;
6566
}
6567

    
6568
.models-view .items-list {
6569
    margin-top: 10px;
6570
}
6571

    
6572
.models-view .model-list ul li.model-item:last-child {
6573
    margin-bottom: 0;
6574
}
6575

    
6576
.models-view .model-list ul li.model-item {
6577
    background-color: #D4E2E8;
6578
    margin-bottom: 5px;
6579
    position: relative;
6580
}
6581

    
6582
.models-view .model-list ul li.model-item .param {
6583
    float: left;
6584
    padding: 6px;
6585
}
6586

    
6587
.models-view .model-list ul li.model-item .item-action.confirm-remove {
6588
    margin-right: -15px !important;
6589
}
6590

    
6591
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover .cancel {
6592
    color: inherit !important;
6593
}
6594

    
6595
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover {
6596
    background-color: #F95;
6597
    color: inherit !important;
6598
}
6599

    
6600
.models-view .model-list ul li.model-item .item-action.confirm-remove span.cancel {
6601
    padding: 6px !important;
6602
}
6603

    
6604
.models-view .model-list ul li.model-item .item-action.confirm-remove span {
6605
    display: block;
6606
    float: left;
6607
    padding: 6px 15px;
6608
}
6609

    
6610
.models-view .model-list ul li.model-item .item-action .cancel-remove:hover {
6611
    color: #fff !important;
6612
}
6613

    
6614
.models-view .model-list ul li.model-item .item-action.confirm-remove,
6615
.models-view .model-list ul li.model-item .item-action .do-confirm,
6616
.models-view .model-list ul li.model-item .item-action .cancel-remove {
6617
    display:none !important;
6618
    background-color: #D95D0A;
6619
    padding:0;
6620
    margin:0;
6621
}
6622

    
6623
.models-view .model-list ul li.model-item.pending-delete .item-action.remove {
6624
    display: none;
6625
}
6626

    
6627
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel {
6628
    background-color: #F95;
6629
}
6630

    
6631
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm {
6632
    background-color: #FF7F2A;
6633
}
6634

    
6635
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove,
6636
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove .do-confirm,
6637
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel-remove {
6638
    display:block !important;
6639
}
6640

    
6641
.models-view .model-list ul li.model-item.pending-delete .item-action {
6642
    display: block;
6643
}
6644

    
6645
.models-view .model-list ul li.model-item.expanded .item-action,
6646
.models-view .model-list ul li.model-item:hover .item-action {
6647
    display: block;
6648
}
6649

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

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

    
6661
.models-view .model-list ul li.model-item .item-action.remove {
6662
    background-image: url("../images/option-action-remove.png");
6663
}
6664

    
6665
.models-view .model-list ul li.model-item .item-action.edit:hover {
6666
    background-image: url("../images/option-action-edit-light.png");
6667
}
6668

    
6669
.models-view .model-list ul li.model-item .item-action.edit {
6670
    background-image: url("../images/option-action-edit.png");
6671
}
6672
.models-view .model-list ul li.model-item .item-action.remove:hover {
6673
    background-color: #880000 !important;
6674
    border-color: #800 !important;
6675
}
6676

    
6677
.models-view .model-list ul li.model-item.expanded .item-action.show,
6678
.models-view .model-list ul li.model-item.expanded .item-action.hide,
6679
.models-view .model-list ul li .item-actions .item-action:hover {
6680
    background-color: #4085A5;
6681
    color: #fff;
6682
    border-color: #4085A5;
6683
}
6684

    
6685
.models-view .model-list ul li .item-actions {
6686
    position: absolute;
6687
    right: -10px;
6688
    top: 0px;
6689
}
6690

    
6691
.models-view .model-list ul li .item-actions .item-action {
6692
    float: right;
6693
    padding: 6px;
6694
    margin-right: 10px;
6695
    display: none;
6696
    cursor: pointer;
6697
    padding-right: 20px;
6698
    background-repeat: no-repeat;
6699
    background-position: right center;
6700
    border-right: 5px solid transparent;
6701
}
6702

    
6703
.models-view .model-list h3 {
6704
    float: left;
6705
}
6706

    
6707
.models-view h3 {
6708
    font-size: 1.2em;
6709
    margin-bottom: 1em;
6710
    margin-top: 5px;
6711
    color: #4085A5;
6712
}
6713

    
6714
.models-view .form-actions {
6715
    font-size: 1.1em;
6716
}
6717

    
6718
.models-view .model-list ul li,
6719
.models-view .model-list ul {
6720
    list-style: none;
6721
}
6722

    
6723
.models-view .model-list ul li.header {
6724
    display: none;
6725
}
6726

    
6727
.models-view .model-form textarea {
6728
    width: 99%;
6729
    height: 100px;
6730
    border: 1px solid #aaa;
6731
}
6732

    
6733

    
6734
.models-view .model-form .form-field {
6735
    margin-bottom: 10px;
6736
}
6737

    
6738
.models-view .model-form label {
6739
    display: block;
6740
    color: #406A7D;
6741
    font-size: 1.1em;
6742
    margin: 0px 0 5px 0;
6743
}
6744

    
6745
.models-view .model-form .inline label {
6746
    float: left;
6747
    margin-right: 10px;
6748
    margin-top: 10px !important;
6749
}
6750

    
6751
.models-view .model-form input.long {
6752
    width: 400px;
6753
}
6754

    
6755
.models-view .model-form .inline input {
6756
    width: auto;
6757
    margin-top: 10px;
6758
}
6759

    
6760
.models-view .model-form .inline select {
6761
    width: auto;
6762
    margin-top: 7px;
6763
}
6764

    
6765
.models-view .model-form .inline .errors,
6766
.models-view .model-form .inline .field-desc {
6767
    clear: both;
6768
}
6769

    
6770
#user_public_keys .private-download {
6771
    margin: 5px 0;
6772
    margin-top: 6px;
6773
}
6774

    
6775
#user_public_keys .private-cont form {
6776
    float: left;
6777
    margin-left: 5px;
6778
}
6779

    
6780
#user_public_keys input.form-text:hover {
6781
    background: #F95;
6782
}
6783

    
6784
#user_public_keys input.form-text {
6785
    background: #FF7F2A;
6786
    color: #fff;
6787
    border: 1px solid #F95;
6788
    padding: 0 5px;
6789
    margin: 0 5px;
6790
    margin-top: -1px;
6791
    cursor: pointer;
6792
}
6793

    
6794
#user_public_keys .form-text {
6795
    float: left;
6796
}
6797

    
6798
#user_custom_images,
6799
#user_public_keys {
6800
    font-size: 0.7em;
6801
}
6802

    
6803
#user_public_keys .download-button {
6804
    width: 30px;
6805
    height: 30px;
6806
}
6807

    
6808

    
6809
#user_public_keys #model-item-tpl {
6810
    display: none;
6811
}
6812
#user_public_keys .model-item .name {
6813
    color: #4085A5;
6814
    font-size: 1.2em;
6815
}
6816

    
6817
#user_public_keys .model-item .fingerprint .flabel {
6818
    color: #888;
6819
    float: left;
6820
    margin-right: 5px;
6821
}
6822

    
6823
#user_public_keys .model-item .fingerprint {
6824
    float: none;
6825
    clear: both;
6826
    color: #444;
6827
    font-family: monospace;
6828
    letter-spacing: 1px;
6829
    padding: 4px;
6830
    font-size: 0.9em;
6831
    border-top: 1px solid #fff;
6832
}
6833

    
6834
#user_public_keys .model-item .publicid {
6835
    display: none;
6836
}
6837

    
6838
#user_public_keys .model-item.expanded .publicid .param-content {
6839
    padding: 5px 5px;
6840
    overflow: auto;
6841
    background-color: #FFF;
6842
    border: 1px solid #4085A5;
6843
    border-left: none;
6844
    border-right: none;
6845
    font-size: 1.1em;
6846
}
6847

    
6848
#user_public_keys .model-item.expanded .publicid .param-content textarea {
6849
    width: 100%;
6850
    height: 90px;
6851
    margin:0;
6852
    padding:0;
6853
    border:none;
6854
    overflow: auto;
6855
}
6856

    
6857
#user_public_keys .model-item.expanded .publicid {
6858
    display: block;
6859
    background-color: #fff;
6860
    width: 100%;
6861
    margin-top: 0px;
6862
    margin-left: 0px;
6863
    color: #fff;
6864
    padding:0 !important;
6865
}
6866

    
6867
.models-view .form-messages {
6868
    margin-bottom: 10px;
6869
}
6870

    
6871
.models-view .list-messages {
6872
    margin-top: 10px;
6873
}
6874

    
6875
.models-view .form-messages .error,
6876
.models-view .form-messages .success,
6877
.models-view .list-messages .error,
6878
.models-view .list-messages .success,
6879
#user_public_keys .private-cont {
6880
    background-color: #AADE87;
6881
    color: #447821;
6882
    padding: 5px;
6883
    border: 1px solid #447821;
6884
    font-size: 1.1em;
6885
    margin-top: 5px;
6886
}
6887

    
6888
.models-view .form-messages .error,
6889
.models-view .list-messages .error {
6890
    background-color: #DE8D87;
6891
    color:  #782421 !important;
6892
    border-color: #782421;
6893
}
6894

    
6895
#user_public_keys .limit-msg {
6896
    color: #800;
6897
    position: absolute;
6898
    right: 20px;
6899
    top: 25px;
6900
}
6901

    
6902
#user_public_keys .private-cont {
6903
    margin-top: 10px;
6904
}
6905

    
6906
#user_public_keys .private-cont .private-msg {
6907
    float: left;
6908
    padding:5px;
6909
    margin-top: 5px;
6910
}
6911

    
6912
#user_public_keys .private-cont textarea {
6913
    margin: 5px;
6914
    width: 97%;
6915
    height: 200px;
6916
}
6917

    
6918
#user_public_keys .private-cont .close-private:hover {
6919
    color: #Fff;
6920
}
6921

    
6922
#user_public_keys .private-cont .close-private {
6923
    float: right;
6924
    margin-right: 5px;
6925
    font-weight: bold;
6926
    cursor: pointer;
6927
    text-decoration: underline;
6928
}
6929

    
6930
#user_public_keys .model-item .key-type {
6931
    background-color: #72ADC8;
6932
    color: #fff;
6933
    text-align: center;
6934
    font-size: 0.9em;
6935
    padding:2px 10px;
6936
    margin: 4px 6px;
6937
    margin-top: 7px;
6938
    font-weight: bold;
6939
}
6940

    
6941
#user_public_keys .private-cont .down-button {
6942
}
6943

    
6944
.models-view .form-field .field-desc {
6945
    font-style: italic;
6946
    font-size: 1em;
6947
    color: #888;
6948
}
6949

    
6950
.models-view .form-field.error label {
6951
    font-weight: bold;
6952
    color: #800 !important;
6953
}
6954

    
6955
.models-view .form-field .errors {
6956
    margin: 5px 0;
6957
}
6958

    
6959
.models-view .form-field .errors .error {
6960
    background-color: transparent;
6961
    border: none;
6962
    color: #800;
6963
}