Statistics
| Branch: | Tag: | Revision:

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

History | View | Annotate | Download (123 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
}
25

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
301
#createcontainer a {
302
}
303

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
601
.overlay-networks-create .form-actions {
602
    float: right;
603
    margin-top: -26px !important;
604
}
605

    
606
#wizard #start:hover, #networks-wizard .create:hover {
607
    background-color: #FF9651;
608
    border-color: #FF9651;
609
}
610

    
611
#wizard .separator-end {
612
    position: absolute;
613
    background-color: #387693;
614
    height: 5px;
615
    margin-left: -14px;
616
    margin-top: 382px;
617
    width: 550px;
618
}
619

    
620
.page ul {
621
    height: 270px;
622
    overflow: auto;
623
}
624

    
625
.panes ul.pane {
626
    height: 220px;
627
}
628

    
629
#wizard #tabscontainer {
630
    background-color: #CDE2EC;
631
    height: 20px;
632
    width: 448px;
633
}
634

    
635
.page ul.tabs {
636
    overflow: hidden;
637
    height: auto;
638
    margin-bottom: -1px;
639
    margin-top: -1px;
640
}
641

    
642
.page ul.tabs li {
643
    float: right;
644
    margin: 0 0.2em;
645
}
646

    
647
#status li {
648
    float: left;
649
    color: #387693;
650
    padding: 0 1px 0 37px;
651
    bottom: 0px;
652
}
653

    
654
#status li.active .headernumber {
655
    color: #FFFFFF;
656
}
657

    
658
#status li.active .headerbody {
659
    color: #FFFFFF;
660
}
661

    
662
div.image-container {
663
    border-bottom: 1px solid #CCCCCC;
664
    margin-left: 10px;
665
    margin-right: 10px;
666
}
667

    
668
#page2-container {
669
    background-color: #ECF4F8;
670
    height: 193px;
671
    margin-top: 3px;
672
    padding-top: 25px;
673
}
674

    
675
#page3-container {
676
    background-color: #ECF4F8;
677
    height: 245px;
678
    margin-bottom: 32px;
679
    padding-left: 50px;
680
}
681

    
682
/* slider root element */
683
.slider {
684
    border: 1px solid #666;
685
    cursor: pointer;
686
    display: inline !important;
687
    float: left;
688
    margin: 5px 0 20px 10px;
689
    position: relative;
690
    width: 250px;
691
}
692

    
693
.sliders {
694
    float:left;
695
    width: 40px;
696
    margin-left: 10px;
697
    margin-top: 3px;
698
}
699

    
700
.units {
701
    padding-left:10px;
702
}
703

    
704
.slider-container {
705
    padding-bottom: 15px;
706
    margin-left: 5px;
707
}
708

    
709
/* drag handle */
710
.handle {
711
    -moz-box-shadow: 0 0 2px #000000;
712
    background: url("../images/h30.png") repeat-x scroll 0 0 #FFFFFF;
713
    border: 1px solid #000000;
714
    cursor: move;
715
    display: block;
716
    height: 10px;
717
    margin-top: -8px;
718
    position: absolute;
719
    width: 8px;
720
}
721

    
722
/* progress bar (enabled with progress: true) */
723
.progress {
724
    height: 3px;
725
    background-color: #387693;
726
}
727

    
728
/* the input field */
729
.range {
730
    border: 1px solid #387693;
731
    float: left;
732
    font-size: 100%;
733
    margin: -3px 0 0 15px;
734
    padding: 2px 5px 2px 0;
735
    text-align: right;
736
    width: 50px;
737
}
738

    
739
.selectedrange {
740
    border-color: #5599FF;
741
}
742

    
743
#credits-indicator {
744
    background-color: #ECF4F8;
745
    float: none;
746
    margin: 0 0 0 10px;
747
    border: 1px solid #387693;
748
    color: #387693;
749
}
750

    
751
/* machines */
752
.machine-container {
753
    position:relative;
754
}
755

    
756
.icon .machine-container.last .machine-data-cont, .machine-container:last-child .machine-data-cont {
757
    margin-bottom:0;
758
    padding-bottom: 0;
759
    border-bottom: none;
760
}
761

    
762
.icon .machine-container.last .machine-data, .machine-container:last-child .machine-data {
763
    border-bottom: none;
764
}
765

    
766
.icon .machine-container .subtitle {
767
    font-size: 0.70em;
768
    color: #222;
769
    line-height: 23px;
770
    height: 23px;
771
    margin-top: -5px;
772
}
773

    
774
.icon .machine-container .subtitle {
775
    
776
}
777

    
778
.icon .machine-container .info {
779
    margin-top: 2px;
780
    height: 17px;
781
}
782

    
783
.icon .machine-container .building-progress {
784
    vertical-align: top;
785
}
786

    
787
.ip-version-label {
788
    font-size: 0.8em;
789
    padding: 0.3em;
790
    background-color: #C4DDE9;
791
    color: #000;
792
}
793

    
794
.icon .machine-data {
795
    width: 520px;
796
    float: left;
797
    background-color: transparent;
798
}
799

    
800
.icon .machine-info {
801
    padding: 10px 0;
802
}
803

    
804
.icon .machine-details .name {
805
    height: 24px;
806
}
807

    
808
.icon .machine-connect {
809
    width: 80px;
810
    float: left;
811
}
812

    
813
.icon .machine-details {
814
    width: 310px;
815
    float: left;
816
    margin-top: -5px;
817
}
818

    
819
.icon .state {
820
    font-size: 98%;
821
    width: 120px;
822
    margin-right: 10px;
823
    float: left;
824
    height: 55px;
825
    margin-top: -5px;
826
}
827

    
828
.vm-actions {
829
    position: relative;
830
}
831

    
832
.icon .vm-actions {
833
    /*display: none;*/
834
}
835

    
836
.icon .vm-actions, .network .vm-actions {
837
    width: 180px;
838
    height: 76px;
839
    float: left;
840
}
841

    
842
.network .vm-actions {
843
    width: 185px;
844
}
845

    
846
.icon .machine-container:hover .machine-data {
847
    background-color:#A1C8DB !important;
848
}
849

    
850
.icon .machine-container:hover .vm-actions {
851
    display: block;
852
}
853

    
854
.vm-actions {
855
    font-size: 75%;
856
}
857

    
858
.vm-actions a {
859
    color: black;
860
    height: 15px;
861
    margin: 0 0 1px 4px;
862
    padding: 1px;
863
    padding-left: 8px;
864
    display: block;
865
}
866

    
867
.vm-actions a:hover {
868
    background-color:#A1C8DB;
869
    color: #fff;
870
    border-left: 4px solid #7DB4CD;
871
    padding-left: 4px;
872
}
873

    
874
.vm-actions a.selected {
875
    color: #FF7F2A !important;
876
}
877

    
878
.vm-actions a.selected {
879
    background-color:transparent;
880
}
881

    
882
.vm-actions .action-container {
883
    position: relative;
884
}
885

    
886
.vm-actions .action-container .confirm_single {
887
    position: absolute;
888
    right: -20px;
889
    top: -2px;
890
}
891

    
892
div.list div.actions a.enabled.destroy {
893
}
894

    
895
.vm-actions .action-container.destroy {
896
    position: absolute;
897
    bottom: -1px;
898
    width: 100%;
899
    left: 0px;
900
    background: transparent;
901
}
902

    
903
.vm-actions .action-container.destroy a {
904
}
905

    
906
.icon .light-background .machine-data, div.network.light-background, div.network.expand {
907
    background-color:#aed2e3 !important;
908
}
909

    
910
.single .light-background {
911
    background-color:#aed2e3;
912
}
913

    
914
.icon .machine-data-cont {
915
    margin-bottom: 5px;
916
    padding-bottom: 5px;
917
    border-bottom: 1px solid #D1E7F0;
918
    width: 520px;
919
    float: left;
920
}
921
.icon .terminated .machine-data-cont {
922
    border-color: #B6CED6;
923
}
924

    
925
.machine a {
926
    font-weight: normal;
927
    text-decoration: none;
928
}
929

    
930
.machine span.name, .machine span.ip {
931
    font-size: 75%;
932
    color: black;
933
    margin-top: 6px;
934
}
935

    
936
.machine span.name {
937
    font-weight: bold;
938
}
939

    
940
.oldValue {
941
    display:none;
942
}
943

    
944
.state {
945
}
946

    
947
.state div {
948
    text-align: right;
949
    margin-right: 3px;
950
}
951

    
952
/* icon view actions */
953
div.machine div.actions a.shutdown-padding {
954
    margin-bottom: 22px;
955
}
956

    
957
div.actions a.enabled:hover{
958
    color: black !important;
959
    text-decoration: underline;
960
    display: block;
961
}
962

    
963
div.machine:hover .actions a {
964
    visibility: visible;
965
}
966

    
967
div.machine div.display a{
968
    visibility: visible;
969
}
970

    
971
div.machine div.actions .disabled {
972
    display: none;
973
}
974

    
975
div.single-container div.vm-actions .disabled {
976
    display: none;
977
}
978

    
979
div.machine div.actions .disabled {
980
    display: none;
981
}
982

    
983
div.connect-arrow {
984
    background: url("../images/connect-arrow.png") no-repeat;
985
    height: 28px;
986
    width:14px;
987
    position: absolute;
988
    display: none;
989
}
990

    
991
.machine div.connect-arrow {
992
    display: none;
993
    left: -3px;
994
    position: absolute;
995
    top: 9px;
996
}
997

    
998
div.connect-arrow:hover, div.connect-arrow.border-hover, div.connect-arrow-ie, div.connect-arrow.border-ie {
999
    cursor: pointer;
1000
    background: url("../images/connect-arrow-hover.png") no-repeat;
1001
    height: 28px;
1002
    width:26px;
1003
}
1004

    
1005
div.connect-border {
1006
    opacity: 0.8;
1007
    filter: alpha(opacity = 80);
1008
    background-color:#4fe0c3;
1009
    height:28px;
1010
    width: 12px;
1011
    position: absolute;
1012
    display: none;
1013
}
1014

    
1015
div.connect-border:hover {
1016
    cursor: pointer;
1017
}
1018

    
1019
.machine div.connect-border {
1020
    display: none;
1021
    left: -15px;
1022
    position: absolute;
1023
    top: 9px;
1024
}
1025

    
1026
.standard .machine .logo {
1027
    float: left;
1028
    width: 50px;
1029
    height: 54px;
1030
    margin: 1px 14px 0;
1031
}
1032
.machine .logo {
1033
    background-image: url("../images/icons/machines/medium/unknown-sprite.png");
1034
    background-repeat: no-repeat;
1035
    cursor: pointer;
1036
}
1037

    
1038
.standard .machine .single-image-state1 {
1039
    background-position: 0px 0;
1040
}
1041

    
1042
.standard .machine .single-image-state3 {
1043
    background-position: -100px 0;
1044
}
1045

    
1046
.standard .machine .single-image-state4 {
1047
    background-position: -150px 0;
1048
}
1049

    
1050
.standard .machine .single-image-state2 {
1051
    background-position: -50px 0;
1052
}
1053

    
1054
.standard .running .machine .logo {
1055
   cursor: pointer;
1056
}
1057

    
1058
.list .machine img {
1059
    margin: 0;
1060
}
1061

    
1062
.icon div.ip, .icon div.ips {
1063
    font-size: 75%;
1064
}
1065

    
1066
div.indicators {
1067
    margin-right: 2px !important;
1068
}
1069
div.indicator1, div.indicator2, div.indicator3, div.indicator4 {
1070
    background-color: #63cf1c;
1071
    width:10px;
1072
    height:11px;
1073
    clear: none;
1074
    float:right;
1075
    -webkit-transition: background-color .75s ease-out;
1076
    -o-transition: background-color .75s ease-out;
1077
    -moz-transition: background-color .75s ease-out;
1078
    transition: background-color .75s ease-out;
1079
}
1080

    
1081
.view-separator {
1082
    color:#5F8DD3;
1083
}
1084

    
1085
.running.disabled {
1086
    background: transparent;
1087
}
1088

    
1089
.running-state .indicator1, .running-state .indicator2, .running-state .indicator3, .running-state .indicator4 {
1090
    background-color: #63cf1c;
1091
}
1092

    
1093
.rebooting-state .indicator1, .rebooting-state .indicator2, .rebooting-state .indicator3, .rebooting-state .indicator4 {
1094
    background-color: #d4aa00;
1095
}
1096

    
1097
.error-state .indicator1, .error-state .indicator2, .error-state .indicator3, .error-state .indicator4 {
1098
    background-color: #ff0000;
1099
}
1100

    
1101
.terminated-state .indicator1, .terminated-state .indicator2, .terminated-state .indicator3, .terminated-state .indicator4 {
1102
    background-color: #5e1616;
1103
}
1104

    
1105
.build-state .indicator1, .build-state .indicator2, .build-state .indicator3, .build-state .indicator4 {
1106
    background-color: #FF7F2A;
1107
}
1108

    
1109
.destroying-state .indicator1, .destroying-state .indicator3, .destroying-state .indicator2, .destroying-state .indicator4 {
1110
    background-color: #4085a5 !important;
1111
}
1112

    
1113
.shutting-state .indicator1, .shutting-state .indicator3, .shutting-state .indicator2, .shutting-state .indicator4 {
1114
    background-color: #940606;
1115
}
1116

    
1117
.starting-state .indicator1, .starting-state .indicator2, .starting-state .indicator3, .starting-state .indicator4 {
1118
    background-color: #9ed976;
1119
}
1120

    
1121
.network-indicator .indicator1, .network-indicator .indicator2, .network-indicator .indicator3, .network-indicator .indicator4 {
1122
    background-color: #63cf1c;
1123
}
1124

    
1125
.network-indicator.in-progress .indicator1, .network-indicator.in-progress .indicator2, .network-indicator.in-progress .indicator3, .network-indicator.in-progress .indicator4 {
1126
    background-color: #FF7F2A;
1127
}
1128

    
1129
.running, .terminated {
1130
    background: #EFF7FA repeat scroll 0 0;
1131
    padding-bottom: 15px;
1132
}
1133

    
1134
.running, #machinesview-list, .single {
1135
}
1136

    
1137
.terminated {
1138
    background:#DCE5E8  repeat scroll 0 0;
1139
    padding-top: 15px;
1140
    margin-top: 15px;
1141
}
1142

    
1143
span.rename {
1144
    background-repeat: no-repeat;
1145
    color: transparent;
1146
    font-size: 75%;
1147
    font-weight: normal;
1148
    margin-left: 10px;
1149
    padding-left: 10px;
1150
    text-align: left;
1151
    cursor: pointer;
1152
}
1153

    
1154
div.name:hover span.rename, span.rename_hovered {
1155
    color: #3D3D3D;
1156
    margin-top: 0.4em;
1157
    background-image: url("../images/pencil.png");
1158
    background-position: 0 3px;
1159
}
1160

    
1161
.machine div.info {
1162
    font-size: 75%;
1163
}
1164

    
1165
div.machine:hover div.info-header, div.machine:hover div.toggler div.down {
1166
    background-color: #84b7d0;
1167
}
1168

    
1169
div.machine div.info-label.darker, .single div.tags-label.darker, div.network .darker {
1170
    background-color: #5CA1C0;
1171
}
1172

    
1173
.machine div.info div.info-label {
1174
    font-size: 75%;
1175
    height:16px;
1176
    width: 30px;
1177
    padding: 1px 0 0 5px;
1178
}
1179

    
1180
.machine div.info div.toggler, .single div.tags div.toggler, div.network div.toggler {
1181
    width:15px;
1182
    height:17px;
1183
    margin-top: -11px;
1184
    margin-left: 37px;
1185
}
1186

    
1187
div.network div.toggler {
1188
    margin-left: 90px;
1189
}
1190

    
1191
.machine div.info div.down {
1192
    background: url(../images/down-arrow.png) no-repeat scroll 1px 1px;
1193
}
1194

    
1195
.single div.tags div.down {
1196
    background: url(../images/down-arrow.png) no-repeat scroll 2px 2px;
1197
}
1198

    
1199
.network div.network-machines div.down {
1200
    background: url(../images/down-arrow.png) no-repeat scroll 2px 2px;
1201
}
1202

    
1203
.network div.network-machine div.firewall div.down {
1204
    background: url(../images/down-arrow.png) no-repeat scroll 2px 2px;
1205
}
1206

    
1207
.machine div.info div.up {
1208
    background: url(../images/up-arrow.png) no-repeat scroll 1px 0;
1209
}
1210

    
1211
.single div.tags div.up {
1212
    background: url(../images/up-arrow.png) no-repeat scroll 2px 2px;
1213
}
1214

    
1215
.network div.network-machines div.up {
1216
    background: url(../images/up-arrow.png) no-repeat scroll 2px 2px;
1217
}
1218

    
1219
.network div.network-machine div.firewall div.up {
1220
    background: url(../images/up-arrow.png) no-repeat scroll 2px 2px;
1221
}
1222

    
1223
button {
1224
    background-color: #87AADE;
1225
    border: 1px solid #87AADE;
1226
    color: #FFFFFF;
1227
    cursor: pointer;
1228
    height: 23px;
1229
    width: 120px;
1230
}
1231

    
1232
button.next {
1233
    background-color: #4085A5;
1234
    border-color: #4085A5;
1235
    text-align: right;
1236
}
1237

    
1238
button.next:hover {
1239
    background-color: #7DB4CD;
1240
    border-color: #7DB4CD;
1241
}
1242

    
1243
button.prev {
1244
    background-color: #4085A5;
1245
    border-color: #4085A5;
1246
    margin-left: -1px;
1247
    text-align: left;
1248
}
1249

    
1250
button.prev:hover {
1251
    background-color: #7DB4CD;
1252
    border-color: #7DB4CD;
1253
}
1254

    
1255
.image-logo {
1256
    float: left;
1257
    margin-right: 1em;
1258
    margin-left: 1.5em;
1259
    margin-top: 4px;
1260
}
1261

    
1262
.icon div.image {
1263
    clear: both;
1264
    display: block;
1265
    margin-bottom: 3px;
1266
    margin-top: 3px;
1267
    padding: 5px;
1268
}
1269

    
1270
div#view-select {
1271
    clear: both;
1272
    color: white;
1273
    position: absolute;
1274
    right: 15px;
1275
    top: 15px;
1276
}
1277

    
1278
a.machines_view_link {
1279
    text-decoration: none;
1280
    font-size: 0.7em;
1281
    padding: 4px;
1282
    padding-right: 8px;
1283
    color: #5CA1C0;
1284
    margin-left: 5px;
1285
    background-repeat: no-repeat;
1286
    background-color: #C9DFEA;
1287
}
1288

    
1289
a.machines_view_link span {
1290
    float: left;
1291
}
1292

    
1293
a.machines_view_link span.ico {
1294
    width: 17px;
1295
    height: 15px;
1296
    margin-right: 10px;
1297
    background-position: -36px 0;
1298
}
1299

    
1300
a.machines_view_link:hover {
1301
    background-color: #A1C8DB;
1302
    color: #fff;
1303
}
1304
a.machines_view_link:hover span.ico {
1305
    background-position: -0px 0px;   
1306
}
1307

    
1308
a.machines_view_link.activelink span.ico {
1309
    background-position: -18px 0px;
1310
}
1311
a.machines_view_link.activelink {
1312
    color: #fff;
1313
    background-color: #5CA1C0;
1314
}
1315

    
1316
div#view-select a {
1317
    display: block;
1318
    float: left;
1319
}
1320

    
1321
a#list:hover {
1322
    background: #5f8dd3;
1323
}
1324

    
1325
a#machines_view_icon_link:active, a#machines_view_list_link:active {
1326
    color:white;
1327
}
1328

    
1329
a#machines_view_icon_link span.ico {
1330
    background-image: url("../images/icon-view.png");
1331
}
1332

    
1333
a#machines_view_list_link span.ico {
1334
    background-image: url("../images/list-view.png");
1335
}
1336

    
1337
a#machines_view_single_link span.ico {
1338
    background-image: url("../images/single-view.png");
1339
}
1340

    
1341
#machinetype {
1342
    background-color: #CDE2EC;
1343
    height: 25px;
1344
    margin-bottom: 0px !important;
1345
}
1346

    
1347
div.machine-type {
1348
    float: left;
1349
    margin: 4px 18px 20px;
1350
}
1351

    
1352
.machine-type .active {
1353
    color: #FFFFFF
1354
}
1355

    
1356
div.machine-type label.disabled {
1357
    color: #aaa !important;
1358
}
1359

    
1360
#machinesview {
1361
}
1362

    
1363
#machines-pane {
1364
}
1365

    
1366
.list#machinesview {
1367
    margin-left: -20px;
1368
    display:none;
1369
}
1370

    
1371
#machinesview-list.list {
1372
    background: #EFF7FA  repeat scroll 0 0;
1373
    padding-left: 15px;
1374
    padding-bottom: 15px;
1375
}
1376

    
1377
#machinesview_content {
1378
    display:none;
1379
}
1380

    
1381
.list-machines {
1382
    min-width: 515px;
1383
}
1384

    
1385
#emptymachineslist {
1386
    background-color: #6BA9C6;
1387
    color: #A0A0A0;
1388
    display: none;
1389
    padding: 65px 150px 35px;
1390
    text-align: justify;
1391
    margin-top: -70px;
1392
}
1393

    
1394
#welcomeheader {
1395
    color:white;
1396
    text-align: center;
1397
}
1398

    
1399
.welcomebody {
1400
    color: white;
1401
    font-size:80%;
1402
}
1403

    
1404
.welcomebody a {
1405
    color: white;
1406
}
1407

    
1408
.welcomefooter {
1409
    color: white;
1410
    font-size:60%;
1411
}
1412

    
1413
.welcomefooter a {
1414
    color: white;
1415
}
1416

    
1417
.emptycreatecontainer {
1418
    margin-left: 430px !important;
1419
    position: absolute;
1420
    margin-top: 5px !important;
1421
    width: 180px;
1422
    background-color: #CCCCCC;
1423
    padding: 5px;
1424
    padding-left: 10px;
1425
}
1426

    
1427
.emptycreate {
1428
    margin: 20px 10px 5px 0 !important;
1429
}
1430

    
1431
#createbody {
1432
    display:none;
1433
    font-size: 80%;
1434
}
1435

    
1436
div.list label img {
1437
    margin: 5px 5px -3px 0;
1438
}
1439

    
1440
div.list label {
1441
    color: #3D3D3D;
1442
    font-size: 75%;
1443
}
1444

    
1445
div.list .state {
1446
    margin-top: 7px;
1447
    margin-right: 10px;
1448
}
1449

    
1450
div.list table tbody {
1451
    margin-top: 8px;
1452
}
1453

    
1454
div.list table tr.checked td {
1455
    background-color: #A1C8DB !important;
1456
}
1457

    
1458
div.list table tr:hover td,
1459
div.list table tr.inactive:hover td,
1460
div.list table tr.error:hover td {
1461
    background-color: #A1C8DB;
1462
    color: #fff;
1463
}
1464

    
1465
div.list table td.name {
1466
    min-width: 170px;
1467
}
1468

    
1469
div.list table td.status {
1470
    font-size: 0.9em !important; 
1471
    text-align: right;
1472
    min-width: 90px;
1473
    color: #000;
1474
}
1475

    
1476
div.list table td.flavor {
1477
    font-size: 0.8em;
1478
}
1479

    
1480
div.list table td {
1481
    border-bottom: 1px solid #DDD;
1482
}
1483

    
1484
div.list table tr.error td.status {
1485
    color: #800000 !important;
1486
    font-weight: bold;
1487
}
1488

    
1489
div.list table tr.error td {
1490
    background-color: #DCE5E8;
1491
}
1492

    
1493
div.list table tr.inactive td {
1494
    background-color: #DCE5E8;
1495
}
1496

    
1497
div.list .stopped {
1498
    margin-top: 8px;
1499
}
1500

    
1501
/* root element for tabs  */
1502
#wizard ul.tabs {
1503
    margin-right: -1px;
1504
    float: right;
1505
}
1506

    
1507
#wizard div.panes {
1508
    height: 247px;
1509
    clear:both;
1510
    margin-top: 3px;
1511
}
1512

    
1513
.typebody {
1514
    font-size: 80%;
1515
    font-weight: normal;
1516
    position: relative;
1517
    top: -3px;
1518
}
1519

    
1520
.typehover {
1521
    color: #FFFFFF;
1522
}
1523

    
1524
#label-name {
1525
    margin-top: 10px;
1526
}
1527

    
1528
/* single tab */
1529
#wizard ul.tabs li {
1530
    margin-bottom: 0;
1531
    list-style-type:none;
1532
    float: left;
1533
}
1534

    
1535
/* link inside the tab. uses a background image */
1536
#wizard ul.tabs a {
1537
    display:block;
1538
    padding: 0.2em 0.5em 0.1em 0.4em;
1539
    text-decoration:none;
1540
    color: #FFFFFF;
1541
    position:relative;
1542
    top:1px;
1543
    outline:0;
1544
    background-color: transparent;
1545
    text-align: center;
1546
    width: 100px;
1547
    white-space: nowrap;
1548
    height: 17px;
1549
}
1550

    
1551
#wizard ul.tabs a:hover {
1552
    color: #FFFFFF;
1553
    background-color:#4085A5;
1554
}
1555

    
1556
/* selected tab */
1557
#wizard ul.tabs a.current {
1558
    color: white;
1559
    background-color: #7DB4CD;
1560
    cursor: default;
1561
}
1562

    
1563
#wizard #standard-images {
1564
    background-color: #ECF4F8;
1565
}
1566

    
1567
div.list div.actions {
1568
    display: none;
1569
    clear: left;
1570
    float: right;
1571
    margin-right: 15px;
1572
    margin-top: 37px;
1573
    text-align: right;
1574
    width: 120px;
1575
}
1576

    
1577
div.list div.actions a {
1578
    clear: left;
1579
    color: #A1A1A1;
1580
    display: block;
1581
    font-size:75%;
1582
    margin-bottom: 2px;
1583
}
1584

    
1585
div.list div.actions a:hover {
1586
    background-color: transparent;
1587
}
1588

    
1589
div.list div.actions a.enabled {
1590
    color: #3D3D3D;
1591
}
1592

    
1593
div.list div.actions a.enabled:hover{
1594
    cursor: pointer;
1595
    color: black;
1596
    text-decoration: underline;
1597
}
1598

    
1599
div.list div.actions a.selected {
1600
    color: #FF7F2A !important;
1601
}
1602

    
1603
input.machine {
1604
    width: 13px;
1605
    height: 13px;
1606
    top: -1px;
1607
    overflow: hidden;
1608
}
1609

    
1610
.description-container {
1611
    display: inline-block;
1612
    position: relative;
1613
    width: 300px;
1614
}
1615

    
1616
#wizard .button-container {
1617
    height: 20px;
1618
}
1619

    
1620

    
1621
/* metadata dropdown combo */
1622
.meta-key {
1623
    margin-right: 18px;
1624
    float:left;
1625
}
1626

    
1627
/* notification box */
1628
#yes-no {
1629
    height: 150px;
1630
    z-index: 9999;
1631
    border-bottom: 5px solid #4085A5;
1632
}
1633

    
1634
#yes-no p, #yes-no button {
1635
    margin-top: 15px;
1636
}
1637

    
1638
#error-success, .notification-box {
1639
    z-index: 9999;
1640
    border-bottom: 5px solid #4085A5;
1641
    min-height: 150px;
1642
    top: 50px !important;
1643
    position: absolute;
1644
}
1645

    
1646
#error-success p, .notification-box p {
1647
    margin-top: 5px;
1648
}
1649

    
1650
.error-report {
1651
    display: none;
1652
}
1653

    
1654
#error-success .error-report {
1655
    position: absolute;
1656
    top: 140px;
1657
    right: 40px;
1658
}
1659

    
1660
.error .error-report {
1661
    display: block;
1662
}
1663

    
1664
#error-success .error-report .errormsg {
1665
    display: none;
1666
}
1667

    
1668
#error-success .error-report .success {
1669
    display: none;
1670
}
1671

    
1672
#error-success .error-report .sending {
1673
    display: none;
1674
}
1675

    
1676
#error-success .error-report .send-btn {
1677
    color: #4085A5;
1678
    text-decoration: underline;
1679
    cursor: pointer;
1680
}
1681

    
1682
#error-success strong, .notification-box strong {
1683
    color: #F49C1A;
1684
}
1685

    
1686
#error-success .close, .notification-box .close {
1687
    background-image: url("../images/close-popup.png");
1688
    background-repeat: no-repeat;
1689
    cursor: pointer;
1690
    height: 13px;
1691
    position: absolute;
1692
    right: 7px;
1693
    top: 9px;
1694
    width: 13px;
1695
}
1696

    
1697
.popup-header-error {
1698
    background-color: #800000 !important;
1699
}
1700

    
1701
.popup-border-error {
1702
    border-color: #800000 !important;
1703
    width:auto;
1704
}
1705

    
1706
.popup-details-error {
1707
    border: none !important;
1708
}
1709

    
1710
.popup-separator-error {
1711
    margin-bottom: 5px !important;
1712
}
1713

    
1714
#error-success .popup-header, .notification-box .popup-header {
1715
    background-color: #4085A5;
1716
    color: white;
1717
    font-size: 95%;
1718
    font-weight: normal;
1719
    height: 20px;
1720
    margin-left: -16px;
1721
    margin-top: -16px;
1722
    padding-bottom: 2px;
1723
    padding-left: 30px;
1724
    padding-top: 10px;
1725
    width: 482px;
1726
    margin-right:-16px;
1727
}
1728

    
1729

    
1730
#error-success.success h3 span.header-box, .notification-box h3 span.header-box {
1731
    background-color: #71c837;
1732
    display: block;
1733
    background-image: url("../images/save-green.png");
1734
    background-position: right 0;
1735
    background-repeat: no-repeat;
1736
    width: 80px;
1737
    padding: 3px 3px 3px 8px;
1738
    margin-top: -6px;
1739
    font-size: 90% !important;
1740
    margin-left: -11px;
1741
}
1742

    
1743
#error-success .popup-body, .notification-box .popup-body {
1744
    background: url("../images/popup-bg.png") repeat-x scroll 0 0 transparent;
1745
    margin-left: -16px;
1746
    margin-right: -16px;
1747
    margin-top: 1px;
1748
    min-height: 142px;
1749
    padding-top: 10px;
1750
}
1751

    
1752
#error-success .popup-body-inner, .notification-box .popup-body-inner {
1753
    background: url("../images/popup-inner-bg.png") repeat-x scroll 0 0 transparent;
1754
    font-size: 80%;
1755
    min-height: 120px;
1756
    margin-left: 20px;
1757
    padding-left: 15px;
1758
    width: 460px;
1759
}
1760

    
1761
#error-success .popup-separator, .notification-box .popup-seperator {
1762
    background-color: #74AEC9;
1763
    height: 1px;
1764
    font-size:1%;
1765
    width: 442px;
1766
    margin-bottom: 30px;
1767
}
1768

    
1769
#error-success .machine-now-building {
1770
    font-size: 95%;
1771
    padding-bottom: 7px;
1772
    padding-top: 10px;
1773
}
1774

    
1775
#error-success.success .machine-now-building {
1776
    padding-bottom: 14px !important;
1777
}
1778

    
1779
#error-success .password-container, .notification-box .password-container {
1780
    width: 430px;
1781
    padding: 5px;
1782
    border: 2px solid #75b54a;
1783
    background-color: #aade87;
1784
}
1785

    
1786
#error-success .password-header, .notification-box .password-header {
1787
    margin-bottom: 5px;
1788
}
1789

    
1790
#error-success .password, .notification-box .password {
1791
    color: #447821;
1792
}
1793

    
1794
#error-success .popup-details, .notification-box .popup-details {
1795
    border: 2px solid #FF7F2A;
1796
    float: left;
1797
    margin-left: 10px;
1798
    padding: 2px;
1799
}
1800

    
1801
#error-success.success .popup-details, .notification-box .popup-details {
1802
    border: none !important;
1803
    float: none !important;
1804
    margin-left: none !important;
1805
    margin-top: 10px;
1806
}
1807

    
1808
#error-success.success .popup-separator, .notification-box .popup-seperator {
1809
    margin-bottom: 14px !important;
1810
}
1811

    
1812
#error-success .write-password, .notification-box .write-password {
1813
    margin-bottom: 5px;
1814
    padding-left: 30px;
1815
}
1816

    
1817
#error-success .write-password-password, .notification-box .write-password-password {
1818
    padding-left: 30px;
1819
    color: #447821;
1820
    display: inline;
1821
    font-size: 110%;
1822
    font-weight: bold;
1823
}
1824

    
1825
#error-success .write-password-details, .notification-box .write-password-details {
1826
    font-size: 75%;
1827
}
1828

    
1829
.more-details {
1830
    display: block;
1831
}
1832

    
1833
.notification-box h3 span.header-box {
1834
    background: transparent;
1835
}
1836

    
1837
.notification-box .machine-now-building {
1838
    padding: 20px 0;
1839
}
1840

    
1841
.notification-box .header-box {
1842
    width: auto !important;
1843
}
1844

    
1845
.notification-box .password {
1846
    text-align: center;
1847
}
1848
.notification-box .password a:hover {
1849
    background-color: #447821;
1850
    color: #fff;
1851
}
1852

    
1853
.notification-box .password a {
1854
    padding: 0.2em;
1855
    text-align: center;
1856
    color: #447821;
1857
    font-weight: bold;
1858
    font-size: 1.2em;
1859
    text-decoration: none;
1860
}
1861

    
1862
.popup-details a:link, .popup-details a:visited {
1863
    color: black;
1864
}
1865

    
1866
.destroy .confirm_single .yes {
1867
    background-color: #880000;
1868
    color: #fff;
1869
}
1870

    
1871
.destroy .confirm_single .no {
1872
    background-color: #CC0000;
1873
    color: #880000;
1874
}
1875

    
1876
.destroy .confirm_single .yes:hover {
1877
    background-color:#CC0000;
1878
}
1879

    
1880
div.list div.actions a.selected#action-destroy {
1881
    color: #880000 !important;
1882
}
1883

    
1884
.vm-actions .destroy a#action-destroy.selected {
1885
    color: #880000 !important;
1886
}
1887

    
1888
/* Confirmation boxes */
1889
div.confirm_single, div.confirm_multiple, div.action_error {
1890
    display: none;
1891
    color: black;
1892
}
1893

    
1894
div.confirm_single button, div.confirm_multiple button, div.action_error button {
1895
    font-size: 100%;
1896
    cursor: pointer;
1897
    color: black;
1898
    height: 20px !important;
1899
}
1900

    
1901
div.confirm_single button {
1902
    border: none;
1903
    font-family: Arial, Helvetica, sans-serif;
1904
    line-height: 1em;
1905
    vertical-align: middle;
1906
    padding: 2px 6px;
1907
    padding-bottom:4px;
1908
    height: 15px;
1909
}
1910

    
1911
div.confirm_single button.yes {
1912
    width: 90px;
1913
    background-color:#FF7F2A;
1914
}
1915

    
1916
div.confirm_single button.yes:hover {
1917
    background-color: #FF9955;
1918
}
1919

    
1920
div.confirm_single button.no {
1921
    width: 20px;
1922
    margin-left:-5px;
1923
    background-color: #FF9955;
1924
    color:#d95d0a;
1925
}
1926

    
1927
div.confirm_single button.no:hover {
1928
    color: white;
1929
}
1930

    
1931
div.confirm_multiple_cont {
1932
    background-color: #406A7D;
1933
    margin-top: 0px;
1934
    padding: 3px;
1935
    border-top: 1px solid #444;
1936
    border-bottom: 1px solid #444;
1937
    padding-top:0px;
1938
    margin-top: -1px;
1939
}
1940

    
1941
div.confirm_reboot_required {
1942
}
1943

    
1944
div.confirm_multiple {
1945
    font-size: 65%;
1946
    z-index: 8000;
1947
    /*height: 28px;*/
1948
    width: 700px;
1949
    margin-top: 15px;
1950
}
1951

    
1952
div.confirm_multiple p {
1953
    float: left;
1954
    color: #FFF;
1955
    font-weight: bold;
1956
    margin: 7px 0 0 10px;
1957
}
1958

    
1959
#networks-pane {
1960
    display: none;
1961
}
1962

    
1963
#networks-pane div.confirm_multiple p {
1964
    margin: 7px 0 0 100px;
1965
}
1966

    
1967
div.confirm_multiple button {
1968
    float: right;
1969
    background-color: transparent;
1970
    border: 1px solid #5CA1C0;
1971
    margin: 4px 5px 0 0;
1972
}
1973

    
1974
div.confirm_multiple button.yes {
1975
    border-color: #FF7F2A;
1976
    padding: 0 12px;
1977
}
1978

    
1979
div.confirm_multiple button.yes:hover {
1980
    background-color: #FF7F2A;
1981
}
1982

    
1983
div.confirm_multiple button.no {
1984
    padding: 0px 16px;
1985
}
1986

    
1987
div.confirm_multiple button.no:hover {
1988
    background-color: #5CA1C0;
1989
}
1990

    
1991
div.action_error {
1992
    width: 120px;
1993
    margin: 14px 0 0 37px;
1994
    background-color: #981D1D;
1995
    font-size: 75%;
1996
    z-index:1;
1997
    color: #FFF;
1998
    position:absolute;
1999
    top: 0px;
2000
}
2001

    
2002
div.action_error .action-error-msg {
2003
    background-color: #fff;
2004
    color: #981D1D;
2005
    border: 1px solid #981D1D;
2006
    padding: 4px;
2007
}
2008
div.action_error .action-error-msg .action {
2009
    font-weight: bold;
2010
}
2011

    
2012
div.action_error .action-error-msg {
2013
    font-size: 0.8em;
2014
}
2015

    
2016
.action_error button {
2017
    width: 75px;
2018
    background-color: transparent;
2019
    border: 1px solid;
2020
    border-color: #981D1D;
2021
    color: #fff !important;
2022
    float: left;
2023
}
2024

    
2025
div.action_error button.details {
2026
    padding-right: 5px;
2027
    width: 100px;
2028
    border-bottom: 2px solid #981D1D;
2029
    border-right: 1px solid #981D1D;
2030
    border-left: 2px solid #981D1D;
2031
    background-color: #E24B4B;
2032
}
2033

    
2034
div.action_error button.close-action-error {
2035
    background-image: url("../images/option-action-remove.png");
2036
    background-color: #fff;
2037
    background-repeat: no-repeat;
2038
    background-position: center center;
2039
    width: 20px;
2040
    border-bottom: 2px solid #981D1D;
2041
    border-right: 2px solid #981D1D;
2042
    border-top: 1px solid #981D1D;
2043
}
2044

    
2045
div.action_error button.details:hover {
2046
    background-color: #FF7F2A;
2047
}
2048

    
2049
div#aboutuser{
2050
    float:right;
2051
    clear: both;
2052
    color: #FFFFFF;
2053
    font-size: 75%;
2054
    margin-top: -25px;
2055
}
2056

    
2057
div#user{
2058
    clear: both;
2059
    color: #FFFFFF;
2060
    font-size: 75%;
2061
    margin-top: 38px;
2062
    padding-bottom: 10px;
2063
    position: absolute;
2064
    right:0;
2065
}
2066

    
2067
div#user a{
2068
    color: #FFFFFF;
2069
    text-decoration: none;
2070
}
2071

    
2072
div#user a.current_lang {
2073
    color: #72ADC8;
2074
}
2075

    
2076
div#user .usermenu {
2077
    float: left;
2078
    cursor: pointer;
2079
    overflow: hidden;
2080
    padding-top: 5px;
2081
    margin-top: -6px;
2082
    position: relative;
2083
}
2084

    
2085
div#user .username {
2086
    display: block;
2087
    margin-right: 10px;
2088
    padding-right: 18px;
2089
    padding-left: 4em;
2090
    min-width: 70px;
2091
    text-align: right;
2092
    height: 20px;
2093
    background: url("../images/down-arrow-light.png") no-repeat right;
2094
    background-position: right 6px;
2095
    font-weight: normal;
2096
}
2097

    
2098
div#user .hovered {
2099
    background: #599EBD;
2100
    overflow: visible;
2101
    border-bottom: 1px solid #C7DFE9;
2102
}
2103

    
2104
div#user .hovered .username {
2105
    background-image: url("../images/down-arrow-lighter.png");
2106
}
2107

    
2108
div#user .active {
2109
    background-color: #BED5E0 !important;
2110
}
2111

    
2112
div#user .active .username {
2113
    color: #599EBD;
2114
    background-image: url("../images/down-arrow-lighter.png");
2115
}
2116

    
2117
div#user .useractions {
2118
    display: none;
2119
}
2120

    
2121
div#user .active .useractions {
2122
    display: block;
2123
    text-align: right;
2124
    color: #4085A5;
2125
    background-color: #D0E3ED;
2126
    margin-top:-1px;
2127
    border-top:1px solid #fff;
2128
    position: relative;
2129
    top: 1px;
2130
    box-shadow: 1px 1px 1px #aaa;
2131
    -moz-box-shadow: 1px 1px 1px #aaa;
2132
    -webkit-box-shadow: 1px 1px 1px #aaa;
2133
}
2134

    
2135
div#user .useractions li {
2136
    padding: 2px 10px;
2137
    border-bottom: 1px solid #efefef;
2138
    text-align: right;
2139
    display: block;
2140
    background-color: transparent;
2141
}
2142

    
2143
div#user .useractions li a {
2144
    color: #4085A5;
2145
    display: inline-block;
2146
    padding:5px 0;
2147
    padding-left: 30px;
2148
    padding-bottom: 6px;
2149
    background-repeat: no-repeat;
2150
    background-position: center left;
2151
}
2152

    
2153
div#user .useractions li.hovered {
2154
    background-color: #E1EFF6;
2155
}
2156

    
2157
div#user .useractions li.last {
2158
    border-bottom: none;
2159
}
2160

    
2161
div#user .useractions .logout a {
2162
    background-image: url("../images/icon-logout.png");
2163
}
2164

    
2165
div#user .langmenu {
2166
    float: left;
2167
    border-left: 1px solid #ffffff;
2168
    padding-left: 10px;
2169
    margin-left: -1px;
2170
}
2171

    
2172
div#user .langmenu .sep {
2173
    display: inline-block;
2174
    color: #72ADC8;
2175
}
2176

    
2177
.separator {
2178
    background-color: #74AEC9;
2179
    height: 10px;
2180
    width: 700px;
2181
    font-size: 1px;
2182
    line-height: 0px;
2183
}
2184

    
2185
#disks.separator {
2186
    background-color: #dea842;
2187
}
2188

    
2189
#networks.separator {
2190
    background-color: #6c535d;
2191
}
2192

    
2193
.network-machine h5 {
2194
    margin-bottom: 26px;
2195
    margin-top:0px;
2196
}
2197

    
2198
.machine-container .separator {
2199
    width: 508px;
2200
    height: 1px;
2201
    margin-top: 2px;
2202
    background-color: #5CA1C0;
2203
    margin-left: 13px;
2204
}
2205

    
2206
.editbuttons {
2207
    display: block;
2208
    clear: none;
2209
    width: 40px;
2210
    margin-right: 0px;
2211
    padding-top: 0px;
2212
    float: right;
2213
    cursor: pointer;
2214
    position: relative;
2215
    z-index: 1000;
2216
}
2217

    
2218
div.editbuttons div.save:hover, div.editbuttons div.cancel:hover {
2219
    background-color: #84b7d0;
2220
}
2221

    
2222
div.editbuttons div.cancel:hover {
2223
    background-image: url("../images/cancel-onhover.png");
2224
}
2225

    
2226
.editbuttons .cancel, .editbuttons .save {
2227
    background-repeat: no-repeat;
2228
    color: transparent;
2229
    height: 16px;
2230
    width: 16px;
2231
    float: left;
2232
}
2233

    
2234
.editbuttons .cancel {
2235
    background-image: url("../images/cancel.png");
2236
    margin-left: 3px;
2237
}
2238

    
2239
.editbuttons .save {
2240
    background-image: url("../images/save.png");
2241
    margin-left: 1px;
2242
}
2243

    
2244
.editbuttons img {
2245
    float:none !important;
2246
    margin: 0px !important;
2247
}
2248

    
2249
.network .namecontainer {
2250
    font-size: 1.1em;
2251
}
2252
.network .machine-name-div .namecontainer {
2253
    font-size: 1em;
2254
    font-weight: bold;
2255
}
2256

    
2257

    
2258
.namecontainer .name {
2259
    position: relative;
2260
}
2261

    
2262
.namecontainer .name .nametextbox, .network-rename-input {
2263
    z-index: 1000;
2264
}
2265

    
2266
.icon .nametextbox {
2267
    width: 255px;
2268
}
2269

    
2270
.nametextbox, .network-rename-input {
2271
    position: relative;
2272
    top: -3px;
2273
    font-size: 65%;
2274
    width: 240px;
2275
    border: 1px solid #aaaaaa;
2276
    padding: 2px;
2277
}
2278

    
2279
.large-spinner {
2280
    background: url("../images/icons/indicators/large/progress.gif");
2281
    margin-left: 298px;
2282
    margin-top: 0px;
2283
    height: 31px;
2284
    width: 49px;
2285
    position: absolute;
2286
    top: 200px;
2287
}
2288

    
2289
#machinesview-icon .large-spinner {
2290
    top: 170px;
2291
}
2292

    
2293
.list .large-spinner {
2294
    margin-top:-30px;
2295
}
2296

    
2297
.single .large-spinner {
2298
    margin-top: 50px;
2299
}
2300

    
2301
div#networks-container {
2302
    display: none;
2303
}
2304

    
2305
div#networks-container .large-spinner {
2306
    margin-top: 50px;
2307
}
2308

    
2309
/* tables in list view */
2310
div.list div.dataTables_filter {
2311
    font-size: 75%;
2312
    margin-bottom: 12px;
2313
}
2314

    
2315
div.list div.dataTables_filter input{
2316
    font-size: 100%;
2317
}
2318

    
2319
.dataTables_wrapper {
2320
    width: 515px;
2321
    padding-bottom: 40px;
2322
}
2323

    
2324
div.list table thead .sorting, div.list table thead .sorting_desc, div.list table thead .sorting_asc {
2325
    padding-right: 15px !important;
2326
}
2327

    
2328
div.list table {
2329
    width: 515px;
2330
    font-size: 75%;
2331
}
2332

    
2333
div.list table tbody td {
2334
    color: #3D3D3D;
2335
    padding:6px;
2336
    vertical-align: middle;
2337
    height: 20px;
2338
}
2339

    
2340
div.list table thead tr {
2341
    border-bottom: 1px solid #aaa;
2342
}
2343
div.list table thead tr th {
2344
    background-color: #CDE2EC;
2345
    background-image: url("../images/bg.gif");
2346
    background-repeat: no-repeat;
2347
    background-position: right 11px;
2348
    font-weight: normal;
2349
    border: 1px solid transparent;
2350
    border-bottom: none;
2351
    padding: 4px;
2352
    text-align: left;
2353
    vertical-align: middle;
2354
    cursor: pointer;
2355
}
2356

    
2357
div.list table thead .sorting_asc, div.list table thead .sorting_desc {
2358
    background-color: #5CA1C0;
2359
}
2360

    
2361
div.list table thead .sorting_asc {
2362
    background-image: url("../images/asc.gif");
2363
}
2364

    
2365
div.list table thead .sorting_desc {
2366
    background-image: url("../images/desc.gif");
2367
}
2368

    
2369
div.list table .selection div.expand-icon {
2370
    background-image: url("../images/asc.gif");
2371
    background-repeat: no-repeat;
2372
    position: relative;
2373
    cursor: pointer;
2374
    width: 15px;
2375
    height: 4px;
2376
    left: 19px;
2377
    top: -11px;
2378
}
2379

    
2380
ul.dropdown-selector {
2381
    background-color: #E6EEEE;
2382
    position: absolute;
2383
    margin-left: 1px;
2384
    display: block;
2385
    top: 255px;
2386
    font-size:75%;
2387
    width:40px;
2388
}
2389

    
2390
ul.dropdown-selector li {
2391
    padding: 4px;
2392
}
2393

    
2394
ul.dropdown-selector li:hover {
2395
    background-color: #5CA1C0;
2396
}
2397

    
2398
ul.dropdown-selector li a{
2399
    color: black;
2400
    text-decoration: none;
2401
}
2402

    
2403
div.list table span.imagetag {
2404
    display: none;
2405
}
2406

    
2407
div.list table thead .vmos {
2408
    width: 20px !important;
2409
    vertical-align:middle;
2410
}
2411

    
2412
div.list table .selection {
2413
    width: 20px !important;
2414
    text-align: left;
2415
    background-image: none;
2416
    padding-left: 6px;
2417
}
2418

    
2419
div.list table thead .vmflavor {
2420
    width: 100px !important;
2421
}
2422

    
2423
/* group column commented out for v0.5
2424
div.list table thead .vmgroup {
2425
    width: 40px !important;
2426
}
2427
*/
2428

    
2429
div.list table thead .vmstatus {
2430
    width: 50px !important;
2431
}
2432

    
2433
div.list table thead .vmname {
2434
    width: 110px !important;
2435
}
2436

    
2437
.spinner, .action-indicator {
2438
    clear: right;
2439
    float:right;
2440
    margin: 10px 6px 0 15px;
2441
}
2442

    
2443
.icon .spinner {
2444
    margin: 20px 4px 0 15px !important;
2445
}
2446

    
2447
.single .state .spinner {
2448
    margin: 20px 55px 0 15px !important;
2449
}
2450

    
2451
.action-indicator {
2452
    margin-right: 18px;
2453
}
2454

    
2455
.list span.action-indicator {
2456
    display: block;
2457
    width: 15px;
2458
    height: 20px;
2459
    margin: 0 !important;
2460
    float: none;
2461
}
2462

    
2463
.wave {
2464
    clear: right;
2465
    float:right !important;
2466
    margin: 10px 15px 0 15px !important;
2467
}
2468

    
2469
#networks-pane .spinner {
2470
    margin-top: 18px !important;
2471
}
2472

    
2473
.hidden {
2474
    display:none;
2475
}
2476

    
2477
div.actions a.selected, div.actions a.selected:hover, div.machine-actions a.selected, div.machine-actions a.selected:hover {
2478
    display:block !important;
2479
}
2480

    
2481
.action_error .message, .action_error .code {
2482
    display: none;
2483
}
2484

    
2485
.fixed {
2486
    bottom: 0;
2487
    position: fixed !important;
2488
}
2489

    
2490
/* Networks */
2491
#networks-pane {
2492
    background-color: transparent;
2493
    color: black;
2494
}
2495

    
2496
#networkscreate {
2497
}
2498

    
2499
.createbutton {
2500
    color: black;
2501
    background-color: #FF7F2A;
2502
    cursor: pointer;
2503
    padding: 7px 24px;
2504
    text-decoration: none;
2505
    border-left: 15px solid #FF9955;
2506
    margin-left: -15px;
2507
}
2508

    
2509
#networkscreate:hover {
2510
    background-color: #FF9955;
2511
}
2512

    
2513
#createcontainer {
2514
}
2515

    
2516
#networks-container {
2517
}
2518

    
2519
#networks-pane .public-networks {
2520
    background: #EFF7FA repeat scroll 0 0;
2521
    margin: 0 0 0px;
2522
    padding: 0 0 15px 0px;
2523
}
2524

    
2525
#networks-pane .private-networks .network:last-child {
2526
    border-bottom: none;
2527
}
2528

    
2529
#networks-pane .private-networks {
2530
    background: #EFF7FA repeat scroll 0 0;
2531
    padding: 15px 20px 20px 0px;
2532
    margin-top: 18px;
2533
}
2534

    
2535
.private-networks .network-cont:last-child {
2536
    border-bottom: none;
2537
}
2538

    
2539
.private-networks .network-cont {
2540
    border-bottom: 1px solid #D1E7F0;
2541
    padding-bottom:5px;
2542
    margin-bottom: 5px;
2543
    width: 520px;
2544
}
2545

    
2546
.private-networks .network {
2547
    padding-top: 10px;
2548
    padding-bottom: 10px;
2549
}
2550

    
2551
#public-template, #private-template, #public-machine-template, #private-machine-template {
2552
    display:none;
2553
}
2554

    
2555
div.network a.action-network-add {
2556
    display: none;
2557
}
2558

    
2559
div.network a.action-network-destroy {
2560
    margin-top: 32px !important;
2561
    width: 50px;
2562
    display: none;
2563
}
2564

    
2565
div.network {
2566
    clear: both;
2567
    padding: 5px 20px 5px 20px;
2568
    width: 480px;
2569
    position: relative;
2570
}
2571

    
2572
#private-template {
2573
    margin: 2px 0 0 -30px;
2574
}
2575

    
2576
div.network-placeholder {
2577
    margin-left: 33px;
2578
}
2579

    
2580
div.private-networks div.network-placeholder {
2581
}
2582

    
2583
div.network-cable {
2584
    border-left: 3px solid #FF7F2A;
2585
    float: left;
2586
    margin-left: -40px;
2587
    margin-top: -45px;
2588
    height: 185px;
2589
    overflow: hidden;
2590
}
2591

    
2592
.first div.network-cable {
2593
    height:143px;
2594
    margin-top:-6px;
2595
    position: relative;
2596
}
2597

    
2598
div.network-contents div.machines-list div.first {
2599
    margin-top:0;
2600
}
2601

    
2602
.last div.network-cable {
2603
    height:85px;
2604
}
2605

    
2606
div.firewall-cable {
2607
    border-left: 3px solid #FF7F2A;
2608
    float: left;
2609
    margin-left: -100px;
2610
    margin-top: -20px;
2611
    height: 110px;
2612
}
2613

    
2614
.last div.firewall-cable {
2615
    display:none;
2616
}
2617

    
2618
div.network a:hover {
2619
    text-decoration: underline;
2620
    cursor: pointer;
2621
}
2622

    
2623
#networks-container .name {
2624
    font-size: 75%;
2625
}
2626

    
2627
div.network-machines, div.firewall {
2628
    font-size: 75%;
2629
    margin-left: 70px;
2630
}
2631

    
2632
div.firewall {
2633
    margin-left: 60px;
2634
    margin-bottom: 3px;
2635
    margin-top: -3px;
2636
}
2637

    
2638
div.firewall .firewall-options {
2639
    float: left;
2640
}
2641

    
2642
div.machines-header, div.firewall-header {
2643
    background-color: #A1C8DB;
2644
    color: white;
2645
    cursor: pointer;
2646
    height: 17px;
2647
    width: 103px;
2648
}
2649

    
2650
 div.private-networks div.machines-header {
2651
    margin-top: -5px;
2652
}
2653

    
2654
div.network:hover div.machines-header, div.network:hover div.firewall-header {
2655
    background-color: #84b7d0;
2656
}
2657

    
2658
div.network-machine:hover div.firewall-header {
2659
    background-color: #5CA1C0;
2660
}
2661

    
2662
div.firewall-label.darker {
2663
    background-color: #4085a5;
2664
}
2665

    
2666
.state {
2667
}
2668

    
2669
.network .state {
2670
    font-size: 75%;
2671
    position: absolute;
2672
    right: 10px;
2673
    top: 5px;
2674
}
2675

    
2676
div.network div.actions {
2677
    float: right;
2678
    font-size: 75%;
2679
    font-weight: normal;
2680
    height: 70px;
2681
    width: 100px;
2682
    position: absolute;
2683
    right: -100px;
2684
    top: 0;
2685
}
2686

    
2687
div.network div.machine-actions {
2688
    text-decoration: none;
2689
    float: right;
2690
    margin: -17px -180px 0 0;
2691
    font-weight: normal;
2692
    font-size: 75%;
2693
}
2694

    
2695
div.network div.actions a, div.network div.machine-actions a {
2696
    text-decoration: none;
2697
    height: 15px;
2698
    color: black;
2699
    visibility: hidden;
2700
    display: block;
2701
}
2702

    
2703

    
2704
div.network div.machine-actions a {
2705
    margin: 8px 0 0 8px;
2706
}
2707
div.network div.net-actions a {
2708
    margin: 0 0 8px 8px;
2709
    width: 168px;
2710
}
2711
div.network div.action-container {
2712
    bottom: auto;
2713
}
2714

    
2715
div.network div.net-actions .confirm_single {
2716
    position: absolute;
2717
    left: 96px;
2718
    width: 150px;
2719
    margin: 0 0px -5px 0;
2720
    font-size: 100%;
2721
}
2722

    
2723
div.network div.actions a:hover, div.network div.machine-actions a:hover {
2724
    display: block;
2725
    background-color:#A1C8DB;
2726
    opacity: 0.8;
2727
    filter: alpha(opacity = 80);
2728
}
2729

    
2730
div.network.expand .net-actions a {
2731
    visibility: visible;
2732
}
2733

    
2734
div.network:hover div.actions a, div.network-machine:hover div.machine-actions a {
2735
    visibility: visible;
2736
}
2737

    
2738
div.network div.machine-actions a.action-destroy.selected {
2739
    color: #880000 !important;
2740
}
2741

    
2742
div.network div.actions a.visible,
2743
div.network div.net-vm-actions a.visible,
2744
div.network div.actions a.selected:hover, div.network div.machine-actions a.selected {
2745
    background-color: transparent !important;
2746
    visibility: visible!important;
2747
}
2748

    
2749
div.network .net-vm-actions .confirm_single {
2750
    font-size: 100% !important;
2751
    margin-right: -20px !important;
2752
    position: absolute !important;
2753
    top: 7px;
2754
    right:0;
2755
}
2756

    
2757
div.network div.display a {
2758
    visibility: visible;
2759
}
2760

    
2761
div.network-machine div.machine-actions a.action-details {
2762
    margin-top: 7px;
2763
    width: 168px;
2764
}
2765

    
2766
div.network .net-actions {
2767
    margin-right:5px !important;
2768
    margin-top:0px !important;
2769
    height: 80px !important;
2770
}
2771

    
2772
div.network .net-actions .action-container.destroy {
2773
    position: relative;
2774
    bottom: auto;
2775
}
2776

    
2777
div.network:hover {
2778
    background-color: #A1C8DB !important;
2779
}
2780

    
2781
.network-logos {
2782
    float:left;
2783
    padding-right: 10px;
2784
}
2785

    
2786
.network-logos:hover {
2787
    cursor: pointer;
2788
}
2789

    
2790
.state div {
2791
    text-align: right;
2792
    margin: 4px 1px -4px;
2793
}
2794

    
2795
.public-networks .state div {
2796
    margin-top: 4px;
2797
}
2798

    
2799
.private-networks .state div {
2800
    margin-top: 9px;
2801
    margin-bottom: -12px;
2802
}
2803

    
2804
.network .name-div {
2805
    margin-bottom: 15px;
2806
    margin-top: 0px;
2807
}
2808

    
2809
div.indicator {
2810
    clear: none;
2811
    float: right;
2812
    height: 11px;
2813
    margin: 3px -1px;
2814
    width: 10px;
2815
}
2816

    
2817
#private-networks {
2818
    margin-top: 20px;
2819
}
2820

    
2821
.private-networks .editbuttons {
2822
    margin-right: 117px;
2823
    margin-top: 1px;
2824
}
2825

    
2826
.private-networks div.confirm_single {
2827
    margin: 45px -219px -5px 0;
2828
    font-size: 80%;
2829
}
2830

    
2831
.private-networks .network-machine div.confirm_single {
2832
    margin: 0 -199px 0 0;
2833
}
2834

    
2835
.private-networks .state {
2836
}
2837

    
2838
.private-networks div.machines-list {
2839
    padding-top: 3px;
2840
}
2841

    
2842
span.rename-network, span.configure {
2843
    background-repeat: no-repeat;
2844
    color: transparent;
2845
    font-size: 75%;
2846
    font-weight: normal;
2847
    margin-left: 10px;
2848
    margin-right: 10px;
2849
    padding-left: 10px;
2850
    text-align: left;
2851
}
2852

    
2853
span.rename-network {
2854
    cursor: pointer;
2855
}
2856

    
2857
div.name-div:hover span.rename-network {
2858
    color: #3D3D3D;
2859
    margin-top: 0.4em;
2860
    background-image: url("../images/pencil.png");
2861
    background-position: 0 3px;
2862
}
2863

    
2864
div.network:hover a.rename {
2865
    color: #3d3d3d;
2866
}
2867

    
2868
.network-separator {
2869
    background-color: #5CA1C0;
2870
    height: 1px;
2871
    margin: 2px 0 0 -5px;
2872
    width: 480px;
2873
    font-size: 1%;
2874
    line-height: 1px;
2875
}
2876

    
2877
.network-contents {
2878
    margin-left: -4px;
2879
    width: 504px;
2880
    clear: both;
2881
    background: url("../images/orange-border.png") no-repeat;
2882
    background-position: 33px bottom;
2883
}
2884
.network-contents.last-expanded {
2885
    background-position-y: -2600px;
2886
}
2887

    
2888
.network-machine {
2889
    border-bottom: 1px solid #5CA1C0;
2890
}
2891
.network-machine:last-child {
2892
    border-bottom: none;
2893
}
2894

    
2895
.network-machine .state div {
2896
    text-align: left;
2897
}
2898

    
2899
.network-machine {
2900
    margin-left: 35px;
2901
    padding-bottom: 10px;
2902
    padding-left: 5px;
2903
    padding-top: 10px;
2904
    position: relative;
2905
}
2906

    
2907
.network-machine .ips {
2908
    position: absolute;
2909
    right:0;
2910
    top:40px;
2911
    text-align: right;
2912
    padding-right: 10px;
2913
    font-size: 70%;
2914
}
2915

    
2916
.network-machine .logo {
2917
    float:left;
2918
    padding-right: 10px;
2919
    position:relative;
2920
}
2921

    
2922
#networks-container .machine-name {
2923
    text-decoration: none !important;
2924
    margin-bottom: 10px;
2925
    color: #000000;
2926
    margin-top: -4px;
2927
}
2928

    
2929
.private-networks .separator {
2930
    background-color: #5CA1C0;
2931
    height: 1px;
2932
    margin: 3px 0 -2px -10px;
2933
    width: 485px;
2934
}
2935

    
2936
.network-machine .state {
2937
    margin-right: 18px;
2938
}
2939

    
2940
.network-machine .state .status {
2941
    margin-bottom: 4px;
2942
}
2943

    
2944
.machine-name .name {
2945
}
2946

    
2947
.machine-name .namecontainer {
2948
    line-height: 18px;
2949
    margin-bottom: 20px;
2950
}
2951

    
2952
div.network-machine:hover {
2953
    background-color: #84B7D0;
2954
}
2955

    
2956
.machines {
2957
    width: 416px;
2958
    margin-bottom: -8px;
2959
    margin-top: 10px;
2960
}
2961

    
2962
div.empty-network-slot {
2963
    height: 60px;
2964
}
2965

    
2966
div.network-remove-machine, div.network-add-machine {
2967
    background-color: #FB822F;
2968
    color: #bc4b00;
2969
    width:90px;
2970
    height:18px;
2971
    float:left;
2972
    margin:40px 0 0 -100px;
2973
}
2974

    
2975
span.remove-icon {
2976
    font-size: 80%;
2977
    margin-left: 15px;
2978
    position: relative;
2979
    bottom:1px;
2980
}
2981

    
2982
div.add-icon {
2983
    margin-left: 15px;
2984
    margin-top: -1px;
2985
    cursor: pointer;
2986
}
2987

    
2988
span.remove-icon:hover, span.add-icon:hover {
2989
    cursor:pointer;
2990
    color: #fff;
2991
}
2992

    
2993
div.network-add-machine {
2994
    margin:43px 0 0 0px;
2995
}
2996

    
2997
.firewall-on {
2998
    color: #42E342;
2999
}
3000

    
3001
.firewall-off {
3002
    color: #F82E2E;
3003
}
3004

    
3005
.firewall-content {
3006
    color: black;
3007
    font-size: 60%;
3008
    margin-left: 60px;
3009
    height: 55px;
3010
}
3011

    
3012
.firewall-content .checkbox-legends {
3013
    cursor: pointer;
3014
}
3015

    
3016
.firewall-content .checkbox-legends.current {
3017
    font-weight: bold;
3018
}
3019

    
3020
.firewall-content .checkbox-legends {
3021
    vertical-align: text-top;
3022
}
3023

    
3024
.checkbox-legends a {
3025
    color: black;
3026
    text-decoration: underline;
3027
    font-size: 100%;
3028
}
3029

    
3030
h5.machine-connect {
3031
    font-size: 75%;
3032
    margin-bottom: 3px;
3033
}
3034

    
3035
.machine-connect span {
3036
    text-decoration: underline;
3037
}
3038

    
3039
h5.machine-connect span:hover {
3040
    cursor: pointer;
3041
}
3042

    
3043
.firewall-apply {
3044
    background-color: #4085a5;
3045
    border: medium none;
3046
    float: right;
3047
    font-size: 105%;
3048
    height: 18px;
3049
    margin-right: 5px;
3050
    margin-top: 3px;
3051
    width: 75px;
3052
    position: relative;
3053
    bottom:20px;
3054
}
3055

    
3056
.firewall-apply:hover {
3057
    background-color:#5CA1C0;
3058
}
3059

    
3060
.name-div {
3061
    margin: -9px 0 30px 70px;
3062
}
3063

    
3064
.machine-name-div {
3065
    margin-bottom: 20px;
3066
    margin-left: 60px;
3067
}
3068

    
3069
div.reboot-dialog {
3070
    display: none;
3071
    color: black;
3072
    background-color: #4085A5;
3073
    font-size: 75%;
3074
    margin-top: 15px;
3075
    width: 698px;
3076
    z-index: 1;
3077
}
3078

    
3079
div#reboot-machine-template, div.reboot-machine-entry {
3080
    display: none;
3081
    padding: 0 0 10px 35px;
3082
    width: 300px;
3083
}
3084

    
3085
div.reboot-dialog p {
3086
    color: #FFFFFF;
3087
    padding: 10px 0 10px 10px;
3088
}
3089

    
3090
div.reboot-dialog button {
3091
    float:right;
3092
    border: 1px solid #FF7F2A;
3093
    background-color: transparent;
3094
    font-size:100%;
3095
}
3096

    
3097
div.reboot-dialog button:hover {
3098
    background-color: #FF7F2A;
3099
}
3100

    
3101
div.reboot-dialog button.reboot-all {
3102
    margin: -30px 35px 0 0;
3103
}
3104

    
3105
div.reboot-dialog button.reboot-single {
3106
    color: black;
3107
    margin-top: -20px;
3108
}
3109

    
3110
div.reboot-dialog div.code, div.reboot-dialog div.action, div.reboot-dialog div.message, div.reboot-dialog button.details {
3111
    display:none;
3112
}
3113

    
3114
div.reboot-dialog button.details {
3115
    border-color: #800000;
3116
    margin-top: -20px;
3117
}
3118

    
3119
div.reboot-dialog button.details:hover {
3120
    background-color: #800000;
3121
}
3122

    
3123
/* Metadata */
3124
.machine .info-content {
3125
    display: none;
3126
}
3127

    
3128
.metadata-container {
3129
    line-height: 12px;
3130
    height: 85px;
3131
    background-color: #84b7d0;
3132
}
3133

    
3134
.metadata-column {
3135
    border-right: 1px solid #5CA1C0;
3136
    color: black;
3137
    float: left;
3138
    font-size: 60%;
3139
    margin-top: 3px;
3140
    height: 70px;
3141
    padding-bottom: 5px;
3142
}
3143

    
3144
.vm-stats {
3145
    padding-left: 10px;
3146
    padding-right: 5px;
3147
    width: 220px;
3148
}
3149

    
3150
.vm-stats div.stat-content {
3151
    height: 18px;
3152
}
3153

    
3154
.vm-stats div.stat-content img {
3155
    margin: 0;
3156
}
3157

    
3158
.vm-stats div img.stat-busy {
3159
    margin-top: -7px;
3160
    margin-left: 90px;
3161
}
3162

    
3163
.vm-stats div.stat-content img.busy {
3164
    margin-left: 95px;
3165
}
3166

    
3167
.vm-stats div.stat-error {
3168
    display:none;
3169
}
3170

    
3171
div.stat-error {
3172
    color: #f00;
3173
}
3174

    
3175
.single div.stat-error {
3176
    text-align: center;
3177
    font-size: 0.8em;
3178
}
3179

    
3180
.metadata-column {
3181
    margin-top: 4px;
3182
}
3183

    
3184
.vm-details {
3185
    width: 130px;
3186
    margin-left:17px;
3187
}
3188

    
3189
.vm-details.metadata-column {
3190
    padding-top: 5px;
3191
    height: 65px;
3192
}
3193

    
3194
.vm-details .image-details {
3195
    margin-top: 8px;
3196
}
3197

    
3198
.vm-details .vm-detail {
3199
    display: block;
3200
}
3201

    
3202
.vm-details span.value {
3203
    color: #444;
3204
}
3205

    
3206
.single-container .lower .stat-busy {
3207
    margin-top: 10px;
3208
    margin-left: 325px;
3209
}
3210

    
3211
.vm-metadata {
3212
    padding-left: 10px;
3213
    width: 100px;
3214
    border: none;
3215
}
3216

    
3217
.metadata-left {
3218
}
3219

    
3220
.metadata-right {
3221
    width: 73px;
3222
    float:left;
3223
    height: 35px;
3224
    padding-left: 5px;
3225
    position:relative;
3226
    overflow:hidden;
3227
}
3228

    
3229
.metadata-right .items {
3230
    position:absolute;
3231
    height:20000em;
3232
}
3233

    
3234
.metadata-keys-container {
3235
    height: 60px;
3236
    float: left;
3237
}
3238

    
3239
.single .metadata-keys-container {
3240
    float: none;
3241
    height: auto;
3242
    margin-bottom: 5px;
3243
}
3244

    
3245
.single a.manage-metadata {
3246
    font-size: 80%;
3247
    margin-left:4px;
3248
    color: #383838;
3249
}
3250

    
3251
a.manage-metadata, a.stats-report {
3252
    font-size: 100%;
3253
    color: black;
3254
    margin-left:17px;
3255
    text-decoration: underline;
3256
}
3257

    
3258
a.stats-report {
3259
    margin: 15px 0  0 80px;
3260
}
3261

    
3262
div.machine a.manage-metadata:hover {
3263
    background-color: transparent;
3264
}
3265

    
3266
.single .metadata-actions, .single .metadata-keys-container .items {
3267
    padding-left: 5px;
3268
}
3269
.metadata-actions, .metadata-keys-container .items{
3270
    margin-top: 5px;
3271
}
3272

    
3273
.singe .metadata-actions, .single .metadata-keys-container .items{
3274
    font-size: 80%;
3275
    line-height: 12px;
3276
    width: 300px;
3277
}
3278

    
3279
.metadata-actions .prev,  .metadata-actions .next{
3280
    float:left;
3281
    width:29px;
3282
    height:6px;
3283
    cursor: pointer;
3284
}
3285

    
3286
.metadata-actions .prev {
3287
    background: url("../images/roll-up.png") no-repeat scroll 0 0 transparent;
3288
}
3289

    
3290
.metadata-actions .next {
3291
    background: url("../images/roll-down.png") no-repeat scroll 0 0 transparent;
3292
}
3293

    
3294
.scrollable {
3295
    position:relative;
3296
    overflow:hidden;
3297
    height: 35px;
3298
    width: 120px;
3299
    margin-bottom:2px;
3300
}
3301

    
3302
.scrollable .items {
3303
    position:absolute;
3304
    height:20000em;
3305
}
3306

    
3307
/* single view */
3308
.single {
3309
    color: #383838;
3310
}
3311

    
3312
.single .column1 {
3313
    float: left;
3314
    margin: 1px 0 25px 17px;
3315
    width: 140px;
3316
}
3317

    
3318
.single .column1 .state {
3319
    float: left;
3320
    margin-left: 4px;
3321
    padding-bottom: 6px;
3322
    padding-top: 3px;
3323
    position: relative;
3324
    right: 0;
3325
    text-align: center;
3326
    width: 126px;
3327
}
3328

    
3329
.single .column1 .state-label {
3330
    padding-top: 5px;
3331
}
3332

    
3333
.single .column1 .indicators {
3334
    margin-right: 38px !important;
3335
}
3336

    
3337
.single div.connect-arrow {
3338
    margin-left: -17px;
3339
}
3340

    
3341
.single div.connect-border {
3342
    margin-left: -29px;
3343
}
3344

    
3345
.single .single-actions {
3346
    width: 150px;
3347
    height: 60px;
3348
    margin-bottom: 45px;
3349
    margin-left: -10px;
3350
}
3351

    
3352
.single .vm-actions .action-container {
3353
    margin-bottom: 1px;
3354
}
3355

    
3356
.single .vm-actions .action-container .confirm_single {
3357
    right: -45px;
3358
}
3359

    
3360
.single .vm-actions .action-container.destroy .confirm_single {
3361
}
3362

    
3363
.single .vm-actions .action-container.destroy {
3364
    bottom: -20px;
3365
}
3366

    
3367
.single a.single-action {
3368
    text-decoration: none;
3369
    cursor: pointer;
3370
    display: block;
3371
}
3372

    
3373
.single a.single-action:hover {
3374
    background-color:#A1C8DB;
3375
    width: 162px;
3376
    opacity: 0.8;
3377
    filter: alpha(opacity = 80);
3378
}
3379

    
3380
.single .destroy a.single-action.selected {
3381
    color: #880000 !important;
3382
}
3383

    
3384
.single a.single-action.selected {
3385
    color: #FF7F2A !important;
3386
    width: 50px !important;
3387
}
3388

    
3389
.single a.single-action.selected:hover {
3390
    background-color:transparent;
3391
}
3392

    
3393
.single .spinner, .single .action-indicator {
3394
    margin: 15px 45px 0 0px !important
3395
}
3396

    
3397
.single .action-indicator {
3398
    margin-right: 55px !important;
3399
}
3400

    
3401
.single .wave {
3402
    margin: 15px 53px 0 0px !important
3403
}
3404

    
3405
.icon div.action_error {
3406
    font-size: 100%;
3407
}
3408

    
3409
.single div.action_error {
3410
    position: absolute;
3411
    top: 29px;
3412
    right: 35px;
3413
}
3414

    
3415
.single .column2 {
3416
    background-color: #A1C8DB;
3417
    float: left;
3418
    font-size: 78%;
3419
    line-height: 17px;
3420
    margin: 0 0 10px 5px;
3421
    width: 358px;
3422
}
3423

    
3424
.single .column2 .machine-labels {
3425
    float: left;
3426
    font-size: 90%;
3427
    margin-left: 10px;
3428
    margin-top: 10px;
3429
    width: 125px;
3430
}
3431

    
3432
.single .machine-detail.title {
3433
    background-color: #74AEC9;
3434
    color: #fff;
3435
    padding: 4px 6px;
3436
    font-size: 0.8em;
3437
    width: 346px;
3438
    margin-left: 5px;
3439
    float: left;
3440
}
3441

    
3442
.single .column2 .machine-details {
3443
    float: right;
3444
    text-align: right;
3445
    font-size: 90%;
3446
    width: 210px;
3447
    margin-right: 10px;
3448
    margin-top: 10px;
3449
}
3450

    
3451
.single .column2 .name, .single .column2 .disk, .single .column2 .image-size, .single .column2 .ipv6 {
3452
    margin-bottom: 13px;
3453
}
3454

    
3455
.single .tags {
3456
    clear: both;
3457
    margin-bottom: 10px;
3458
    margin-left: 10px;
3459
}
3460

    
3461
.single .tags-label {
3462
    float: left;
3463
    padding: 0 5px;
3464
    width: 30px;
3465
}
3466

    
3467
.single .tags-down-arrow {
3468
    background: url("../images/tags-down-arrow.png") no-repeat scroll 1px 7px transparent;
3469
    float: left;
3470
    height: 16px;
3471
    width: 9px;
3472
}
3473

    
3474
.single .tags-header .info-header{
3475
    padding-top:0;
3476
    padding-bottom:0;
3477
}
3478

    
3479
.single .tags-header {
3480
    font-size: 0.62em;
3481
    cursor: pointer;
3482
    float: left;
3483
    margin-bottom:5px;
3484
}
3485

    
3486
.single .tags-header span.label {
3487
    font-size: 104%;
3488
}
3489

    
3490
.single .tags-content {
3491
    background-color: #84B7D0;
3492
    clear: both;
3493
    height: auto;
3494
    padding-bottom: 5px;
3495
    padding-top: 5px;
3496
    width: 300px;
3497
}
3498

    
3499
.single .column3 {
3500
    background-color: #A1C8DB;
3501
    width: 150px;
3502
    overflow: visible;
3503
    padding-bottom: 10px;
3504
    position: absolute;
3505
    right: 20px;
3506
    top: 130px;
3507
}
3508

    
3509
.single .col3 {
3510
    float: right;
3511
    width: 150px;
3512
    margin-right: 15px;
3513
    margin-bottom: 15px;
3514
}
3515

    
3516
.single .column3 .controls {
3517
    font-size: 80%;
3518
    height: 20px;
3519
    padding-left: 7px;
3520
    padding-right: 7px;
3521
    padding-top: 8px;
3522
    padding-bottom: 5px;
3523
    border-bottom: 1px solid #84B7D0;
3524
}
3525

    
3526
.single .column3 .vm-control:hover {
3527
    background-color: #5CA1C0;
3528
}
3529

    
3530
.single .column3 .previous {
3531
    float:left;
3532
    width: 72px;
3533
}
3534

    
3535
.single .column3 .next {
3536
    float: right;
3537
    text-align: center;
3538
    width: 60px;
3539
}
3540

    
3541
.single .column3 .next-label {
3542
    float: right;
3543
    margin-right: 3px;
3544
    margin-top: -2px;
3545
}
3546

    
3547
.single .column3 .next-arrow {
3548
    float: right;
3549
    height: 18px;
3550
    width: 10px;
3551
    background: url("../images/right-arrow.png") no-repeat scroll 3px 2px transparent;
3552
}
3553

    
3554
.single .column3 .prev-label {
3555
    float: left;
3556
    margin-left: 3px;
3557
    margin-top: -2px;
3558
}
3559

    
3560
.single .column3 .prev-arrow {
3561
    background: url("../images/left-arrow.png") no-repeat scroll 3px 2px transparent;
3562
    float: left;
3563
    height: 18px;
3564
    width: 10px;
3565
}
3566

    
3567
.single .column3 .separator {
3568
    width: 135px;
3569
    height: 1px;
3570
    background-color: #84B7D0;
3571
    margin: 0 0 0 7px;
3572
    clear: both;
3573
}
3574

    
3575
.single .column3 .servers {
3576
    font-size: 80%;
3577
    line-height: 15px;
3578
    padding-top: 10px;
3579
    text-align: right;
3580
    overflow: visible;
3581
    position: relative;
3582
}
3583

    
3584
.single .column3 .server-name {
3585
    margin-left: 10px;
3586
    padding-right: 5px;
3587
    cursor: pointer;
3588
    padding-bottom: 2px;
3589
}
3590
div.single div.column3 div.server-name:hover {
3591
    background-color: #5CA1C0;
3592
}
3593
.single .column3 .column3-selected {
3594
    background-color: #84B7D0;
3595
    color: white;
3596
    opacity: 0.8;
3597
    padding-left: 9px;
3598
    width: 160px;
3599
    filter: alpha(opacity = 80);
3600
    position: relative;
3601
    width: 126px;
3602
}
3603

    
3604
.single .toggler {
3605
    color: #FFFFFF;
3606
    float: right;
3607
    font-size: 140%;
3608
}
3609

    
3610
.single .cpu-usage, .single .network-usage {
3611
    text-align: center;
3612
    padding-top: 15px;
3613
    margin-bottom: 5px;
3614
    font-size: 90%;
3615
    font-weight: bold;
3616
}
3617

    
3618
.single .cpu-graph, .single .network-graph {
3619
    margin-left: 20px;
3620
    margin-bottom:30px;
3621
    width: 660px;
3622
}
3623

    
3624
.single div.lower img.stats {
3625
    margin-left: 82px;
3626
}
3627

    
3628
.single div.lower img.stats {
3629
    display: none;
3630
}
3631

    
3632
.single .single-image {
3633
    width: 126px;
3634
    height: 136px;
3635
    margin-bottom: 10px;
3636
    margin-left: 4px;
3637
    background-image: url("../images/icons/machines/large/unknown-sprite.png");
3638
    background-repeat: no-repeat;
3639
    cursor: pointer;
3640
}
3641

    
3642
.single .single-image-state1 {
3643
    background-position: 0px 0;
3644
}
3645

    
3646
.single .single-image-state3 {
3647
    background-position: -252px 0;
3648
}
3649

    
3650
.single .single-image-state4 {
3651
    background-position: -378px 0;
3652
}
3653

    
3654
.single .single-image-state2 {
3655
    background-position: -126px 0;
3656
}
3657

    
3658
.single .column3 .previous, .single .column3 .next {
3659
    cursor: pointer;
3660
    background-color: #84B7D0;
3661
    color: white;
3662
    font-size: 100%;
3663
    height: 15px;
3664
    padding-top: 2px;
3665
}
3666

    
3667
.single .column3 .disabled {
3668
    opacity: 0.5;
3669
    filter: alpha(opacity = 50);
3670
}
3671

    
3672
.single div.lower {
3673
    clear:both;
3674
    background: #EFF7FA repeat scroll 0 0;
3675
    width: 700px;
3676
    padding-bottom: 15px;
3677
}
3678

    
3679
.single div.upper {
3680
    background: transparent;
3681
    margin-bottom: 10px;
3682
    overflow: visible;
3683
    width: 700px;
3684
    background: #EFF7FA repeat scroll 0 0;
3685
}
3686

    
3687
/* console css */
3688
.console-header-logo {
3689
    padding-top: 17px;
3690
    margin-left: 30px;
3691
    position: fixed;
3692
}
3693

    
3694
#console-header div.help-text {
3695
    font-size: 75%;
3696
    font-weight:bold;
3697
    color:#FFFFFF;
3698
    float:left;
3699
    position: absolute;
3700
    margin: 45px 0 0 2px;
3701
}
3702

    
3703
div.console-container {
3704
    margin: 0 0em;
3705
    height: auto;
3706
}
3707

    
3708
#wrapper.console {
3709
    width: auto;
3710
}
3711

    
3712
.console-info {
3713
    font-size:80%;
3714
    color: white;
3715
    float:left;
3716
    position:relative;
3717
    margin: 15px 0 0 480px;
3718
}
3719

    
3720
applet {
3721
    width:100%;
3722
    height:100%;
3723
}
3724

    
3725
div.console-footer {
3726
    /* this is for version 0.5*/
3727
    display: none;
3728
}
3729

    
3730
.console-footer #footer-text{
3731
    float:left;
3732
    left: auto;
3733
    margin-left:30px;
3734
}
3735

    
3736
/* add network wizard (see also #wizard for shared classes) */
3737
#networks-wizard .header {
3738
    background-color: #4085A5;
3739
    height: 56px;
3740
}
3741

    
3742
#networks-wizard div.name-input {
3743
    margin: 75px 0 0 55px;
3744
}
3745

    
3746
#networks-wizard input {
3747
    border: 1px solid #CCCCCC;
3748
    color: #445566;
3749
    letter-spacing: 1px;
3750
    width: 170px;
3751
}
3752

    
3753
#networks-wizard span.help {
3754
    font-style: italic;
3755
    font-size: 80%;
3756
    margin-left: 10px;
3757
}
3758

    
3759
#networks-wizard .separator-end {
3760
    background-color: #387693;
3761
    height: 6px;
3762
    width: 479px;
3763
    margin-left: -13px;
3764
    margin-top: 19px;
3765
}
3766

    
3767
.red {
3768
    color: red;
3769
}
3770

    
3771
/* add server to network wizard (see also #metadata-wizard for shared classes) */
3772
#add-machines-wizard span.machine-name {
3773
    margin-left: 4px;
3774
    vertical-align: text-top;
3775
}
3776

    
3777
#add-machines-wizard img.list-logo {
3778
    margin: 2px 1px 1px;
3779
}
3780

    
3781
.css-panes {
3782
    clear: both;
3783
    position: relative;
3784
    z-index: 10;
3785
}
3786

    
3787
.last .firewall-content {
3788
}
3789

    
3790
#pub .last .network-separator {
3791
    display:none;
3792
}
3793

    
3794
.public-networks .empty-network-slot {
3795
    display: none;
3796
}
3797

    
3798
.clearfix {
3799
    display: block;
3800
    width: auto;
3801
    zoom: 1;
3802
}
3803

    
3804
/* float clearing for all browsers except the devil one */
3805
.clearfix:after{
3806
  clear: both;
3807
  content: ".";
3808
  display: block;
3809
  height: 0;
3810
  visibility: hidden;
3811
  font-size: 0;
3812
}
3813

    
3814
* html .clearfix {
3815
    display: inline-block;
3816
}
3817

    
3818
.icon .cont-toggler {
3819
    margin-top: -1px;
3820
}
3821

    
3822
.icon .wave {
3823
    margin-right: 4px !important;
3824
    margin-top: 15px !important;
3825
}
3826

    
3827
.icon .status {
3828
    margin-right: 3px;
3829
}
3830

    
3831
#machinesview .status, .single .state {
3832
    font-size: 75%;
3833
}
3834

    
3835
#machinesview-list div.action-indicator {
3836
    margin:0 !important;
3837
    float: none !important;
3838
}
3839

    
3840
.icon div.action-indicator {
3841
    margin-top: 14px;
3842
    margin-right: 4px;
3843
}
3844

    
3845
div.action-indicator {
3846
    width: 15px;
3847
    height: 20px;
3848
    background-repeat: no-repeat;
3849
    background-position: 0 0;
3850
}
3851

    
3852
tbody.machines div.action-indicator {
3853
    position: relative;
3854
    top: -2px;
3855
}
3856
div.state .destroy, tbody.machines .destroy {
3857
    background-image: url("../images/icons/actions/medium/destroy.png");
3858
}
3859
div.state .console, tbody.machines .console {
3860
    background-image: url("../images/icons/actions/medium/console.png");
3861
}
3862
div.state .start, tbody.machines .start {
3863
    background-image: url("../images/icons/actions/medium/start.png");
3864
}
3865
div.state .reboot, tbody.machines .reboot {
3866
    background-image: url("../images/icons/actions/medium/reboot.png");
3867
}
3868
div.state .shutdown, tbody.machines .shutdown {
3869
    background-image: url("../images/icons/actions/medium/shutdown.png");
3870
}
3871

    
3872
h3.overlay-inner-title {
3873
    color: #4085A5;
3874
    font-size: 2em;
3875
}
3876

    
3877
#add-name-container {
3878
    margin-bottom: 10px;   
3879
}
3880

    
3881
.remove-field-trigger, .add-field-trigger {
3882
    cursor: pointer;
3883
}
3884

    
3885
.add-field-trigger img {
3886
    vertical-align: middle;
3887
}
3888

    
3889
.machine-now-building {
3890
    padding-right: 15px !important;
3891
    text-align: justify;
3892
}
3893

    
3894
.sub-text {
3895
    padding-top: 15px;
3896
    padding-right: 15px;
3897
    text-align: justify;
3898
    font-style: italic;
3899
    font-size: 0.8em !important;
3900
}
3901

    
3902
#notification-box a {
3903
    color: #4085A5;
3904
}
3905

    
3906
#notification-box .machine-title img {
3907
    vertical-align: middle;
3908
}
3909

    
3910
#notifiaction-box .password-header {
3911
    margin-bottom: 0 !important;
3912
}
3913

    
3914
#notification-box .password-container a {
3915
    color: #fff;
3916
    text-decoration: underline;
3917
}
3918

    
3919
#notification-box .password-container a:hover {
3920
    background-color: #fff;
3921
    color: #4085A5;
3922
}
3923

    
3924
#notification-box .password-container {
3925
    background: #4085A5;
3926
    border: none;
3927
}
3928

    
3929
#notification-box .password-container .password a {
3930
    font-weight: normal !important;
3931
}
3932

    
3933
#notification-box .cmd {
3934
    color: #fff;
3935
    font-family: monospace;
3936
    font-size: 1.6em;
3937
}
3938

    
3939
.machine-container .separator {
3940
    background-color: #B0D1E0;
3941
}
3942

    
3943
#creation-password-overlay div.password-cont {
3944
    margin: 10px auto;
3945
    padding: 10px;
3946
    border: 2px solid #75B54A;
3947
    background-color: #AADE87;
3948
    color: #447821;
3949
    text-align: left;
3950
    padding-left: 5em;
3951
    position: relative;
3952
}
3953

    
3954
#creation-password-overlay {
3955
    position: relative;
3956
}
3957

    
3958
#creation-password-overlay .form-action {
3959
    position: absolute;
3960
    bottom: 15px;
3961
    right: 13px;
3962
    font-size: 0.8em;
3963
}
3964

    
3965
#creation-password-overlay .password-label {
3966
    float: left;
3967
}
3968

    
3969
#creation-password-overlay .password {
3970
    font-size: 1.5em;
3971
    font-weight: bold;
3972
    letter-spacing: 2px;
3973
    font-family: Georgia, Times, serif;
3974
    margin-right: 5em;
3975
    float: right;
3976
    margin-top: -4px;
3977
}
3978

    
3979
.feedback-form .description {
3980
    margin-bottom: 25px;
3981
}
3982

    
3983
.feedback-form label {
3984
    display: block;
3985
    font-weight: bold;
3986
    margin-bottom: 10px;
3987
    font-size: 0.8em;
3988
}
3989

    
3990
.feedback-form .form-actions {
3991
    border-top: none;
3992
}
3993

    
3994
.nospace {
3995
    padding-top: 0 !important;
3996
    padding-bottom: 0 !important;
3997
}
3998

    
3999
.noborder {
4000
    border-top: none !important;
4001
    border-bottom: none !important;
4002
}
4003

    
4004
.overlay .feedback-form .messages.description {
4005
    padding-bottom:0;
4006
    margin-bottom: 0;
4007
}
4008

    
4009
.feedback-form .messages .error-message {
4010
    color: #f00;
4011
}
4012

    
4013
.feedback-form .messages .success-message {
4014
    color: #8AA87F;
4015
}
4016

    
4017
.feedback-form .feedback-message {
4018
    width: 548px;
4019
    height: 200px;
4020
    border: 1px solid #ddd;
4021
    padding: 5px;
4022
}
4023

    
4024
#feedback-form .empty-error-msg {
4025
    display: none;
4026
}
4027

    
4028
#feedback-form .data-text {
4029
    display: none;
4030
}
4031

    
4032
#feedback-form .message {
4033
    display: none;
4034
}
4035

    
4036
#feedback-form label {
4037
    display: block;
4038
    font-size: 0.85em;
4039
    font-weight: bold;
4040
}
4041

    
4042
#feedback-form label.inline {
4043
    display: inline;
4044
    padding-left: 5px;
4045
}
4046

    
4047
#feedback-form p {
4048
    padding: 1em 0;
4049
    color: #444;
4050
    margin-bottom: 10px;
4051
}
4052

    
4053
#feedback-form .description {
4054
    font-style: italic;
4055
    font-size: 0.9em;
4056
    color: #888;
4057
}
4058

    
4059
#feedback-form .feedback-text {
4060
    width: 98%;
4061
    height: 100px;
4062
    margin-top: 10px;
4063
    margin-bottom: 10px;
4064
}
4065

    
4066
#feedback-form .submit-data {
4067
    display: none;
4068
}
4069

    
4070
#feedback-form .submit, #invform .submit {
4071
    background-color: #4085A5;
4072
    color: #fff;
4073
    border: none;
4074
    padding: 5px 16px;
4075
    cursor: pointer;
4076
    font-size: 1em;
4077
    position: relative;
4078
}
4079

    
4080
#feedback .submit {
4081
    float: right;
4082
    right: 10px;
4083
    margin-top: 10px;
4084
}
4085

    
4086

    
4087
#feedback-form .submit:hover, #invform .submit:hover {
4088
    background-color: #549FC3;
4089
}
4090

    
4091
.feedback-intro {
4092
    padding-right: 15px !important;
4093
    text-align: justify;
4094
}
4095

    
4096
.popup-body .message {
4097
    padding: 20px 5px;
4098
    display: none;
4099
}
4100

    
4101
.popup-body .loading {
4102
    color: #fff;
4103
}
4104

    
4105
.popup-body .success {
4106
    color: #1F921A;
4107
}
4108

    
4109
.popup-body .errormsg {
4110
    color: #E32424;
4111
}
4112

    
4113

    
4114
.close-msg-box {
4115
    display: block;
4116
    margin-top: 10px;
4117
    cursor: pointer;
4118
    color: #4085A5;
4119
    text-decoration: underline;
4120
}
4121

    
4122

    
4123
.console .ip-version-label {
4124
    margin: 0 5px;
4125
}
4126

    
4127
.ipv6-text, .ipv4-text {
4128
    font-size: 0.9em;
4129
}
4130

    
4131
.tooltip {
4132
    background-color: #C4DDE9;
4133
    color: #000;
4134
    font-size: 0.7em;
4135
    padding: 0.2em 0.5em;
4136
    border: 1px solid #888;
4137
    z-index: 50000;
4138
}
4139

    
4140
/*404 and 500 pages*/
4141

    
4142
.error_page {
4143
    position: relative;
4144
    top: 40px;
4145
    padding-bottom: 140px !important;
4146
}
4147

    
4148
.error_page h1 {
4149
    font-weight: normal;
4150
}
4151

    
4152
.error_page .msg_header {
4153
    margin: 0px;
4154
    font-size: 10em;
4155
    position: absolute;
4156
    left: -5px;
4157
    top: 0px;
4158
    color: #4085A5;
4159
    font-family: arial, verdana;
4160
}
4161

    
4162
.error_page p.error_desc {
4163
    color: #fff;
4164
    font-size: 0.8em;
4165
}
4166

    
4167
.error_page {
4168
    padding-right: 50px !important;
4169
    padding-left: 100px !important;
4170
}
4171

    
4172
.error_page .error_content {
4173
    padding-left: 150px;
4174
    padding-top: 97px;
4175
}
4176

    
4177
.error_page .error_content .links, .info_content .links {
4178
    margin-top: 10px;
4179
    margin-left: 20px;
4180
}
4181

    
4182
.error_page .http_error .code {
4183
    letter-spacing: -10px;
4184
    font-size: 9em;
4185
}
4186

    
4187
.error_page .http_error .msg {
4188
    letter-spacing: -1px;
4189
    font-size: 2em;
4190
}
4191

    
4192
.error_page .http_error {
4193
    position: absolute;
4194
    right: 0px;
4195
    bottom: 0px;
4196
    color: #75B3D0;
4197
    line-height: 1em;
4198
}
4199

    
4200
.error_page .error_content a, .info_content .links a {
4201
    color: #4085A5;
4202
    font-weight: bold;
4203
    margin-right: 10px;
4204
    font-size: 0.9em;
4205
}
4206

    
4207
.error_body #container, .info_body #container {
4208
    background-position: right 200px;
4209
}
4210

    
4211
.info_page h1 {
4212
    color: #4085A5;
4213
    font-size: 2em;
4214
    font-weight: normal;
4215
}
4216

    
4217
.info_page p {
4218
    color: #ffffff;
4219
    margin: 1em 0;
4220
}
4221

    
4222
.info_body p a, .error_body p a{
4223
    color: #4085A5;
4224
    text-decoration: underline;
4225
}
4226

    
4227
.error_404 .http_error .code {
4228
    letter-spacing: -7px;
4229
}
4230

    
4231
.network-progress-indicator {
4232
    position: relative;
4233
    display: none;
4234
}
4235

    
4236
.network-progress-indicator img {
4237
    position: absolute;
4238
    bottom: 44px;
4239
    left: 340px;
4240
}
4241

    
4242

    
4243
.single .progress-message {
4244
    margin-top: 90px;
4245
    font-size: 0.6em;
4246
    padding: 0 10px;
4247
    text-align: center;
4248
}
4249

    
4250
/*metadata keys/values*/
4251
.items .tag-item  {
4252
    display: block;
4253
}
4254

    
4255
.single .items .tag-item .key {
4256
    width: 60px;
4257
}
4258

    
4259
.running .scrollable, .terminated .scrollable {
4260
    height: 42px;
4261
}
4262

    
4263
.items .tag-item .key {
4264
    margin-right: 5px;
4265
    width: 30px;
4266
    display: block;
4267
    float: left;
4268
    color: #000;
4269
}
4270

    
4271
.items .tag-item .value {
4272
    color: #444;
4273
}
4274

    
4275
#machinesview-list {
4276
    display: none;
4277
}
4278

    
4279
#machinesview-single {
4280
    position: relative;
4281
    display: none;
4282
}
4283

    
4284
#machinesview-icon {
4285
    display: none;
4286
}
4287

    
4288
#machinesview-icon, #machinesview-single, #machinesview-list {
4289
    
4290
}
4291

    
4292
tbody.machines .spinner {
4293
    margin-top: 0!important;
4294
    margin: 0 !important;
4295
    float: none !important;
4296
}
4297

    
4298
.slider .slider-point {
4299
    width: 4px;
4300
    height: 3px;
4301
    margin-left: 1px;
4302
    background-color: transparent;
4303
    display: block;
4304
    position: absolute;
4305
    z-index: 10;
4306
    bottom: 0px;
4307
}
4308

    
4309
.slider .slider-point-light {
4310
    background-color: transparent;
4311
}
4312

    
4313
.slider-point-text {
4314
    font-size: 0.6em;
4315
    position: absolute;
4316
    top: 4px;
4317
    border-top: 5px solid #C5DEE9;
4318
    padding: 3px;
4319
    color: #4085A5;
4320
    display: block;
4321
    min-width: 6px;
4322
    text-align: middle;
4323
}
4324

    
4325
.slider .handle {
4326
    z-index: 50;
4327
}
4328

    
4329
.modal p.desc {
4330
    margin: 5px 0;
4331
    margin-left: 37px;
4332
    font-size: 0.8em;
4333
    color: #888;
4334
}
4335

    
4336
.api_overlay_template {
4337
    display: none;
4338
}
4339

    
4340
.api_content .password-container .password {
4341
    color: #fff;
4342
    font-size: 1.1em;
4343
}
4344

    
4345
#disks-pane {
4346
    margin-top: 58px;
4347
}
4348

    
4349
span.resend-msg {
4350
    display: block;
4351
    margin-bottom: 5px;
4352
}
4353

    
4354
.success-msg {
4355
    background-color: #5CAD54;
4356
    color: #fff;
4357
    padding: 0.4em;
4358
    border: 1px solid #ddd;
4359
}
4360

    
4361
.error-msg {
4362
    background-color: #800000;
4363
    color: #fff;
4364
    padding: 0.4em;
4365
    border: 1px solid #ddd;
4366
}
4367

    
4368
.success-msg em, .error-msg em {
4369
    font-weight: bold;
4370
    font-style: normal;
4371
    font-size: 0.9em;
4372
}
4373

    
4374
.pagination {
4375
            font-size: 80%;
4376
        }
4377
        
4378
.pagination a {
4379
    text-decoration: none;
4380
        border: solid 1px #AAE;
4381
        color: #15B;
4382
}
4383

    
4384
.pagination a, .pagination span {
4385
    display: block;
4386
    float: left;
4387
    padding: 0.3em 0.5em;
4388
    margin-right: 5px;
4389
        margin-bottom: 5px;
4390
        min-width:1em;
4391
        text-align:center;
4392
}
4393

    
4394
.pagination .current {
4395
    background: #4085A5;
4396
    color: #fff;
4397
        border: solid 1px #AAE;
4398
}
4399

    
4400
.pagination .current.prev, .pagination .current.next{
4401
        color:#999;
4402
        border-color:#999;
4403
        background:#fff;
4404
}
4405

    
4406
table.list-machines .wave {
4407
    float: none !important;
4408
    margin: 0 !important;
4409
}
4410

    
4411
.overlay {
4412
    display: none;
4413
}
4414

    
4415
.overlay .copy-content .clip-copy  {
4416
    right: 10px;
4417
    top:8px;
4418
    border: 1px solid #fff;
4419
}
4420

    
4421
.overlay .copy-content {
4422
    background-color: #387693;
4423
    color: #fff;
4424
    padding: 10px;
4425
    font-size: 1.2em;
4426
    text-align: center;
4427
    position: relative;
4428
}
4429

    
4430
.overlay {
4431
    background-color: #fff;
4432
    border: 2px solid #444;
4433
    text-align: left;
4434

    
4435
    -moz-box-shadow: 0 0 90px 5px #000;
4436
    -webkit-box-shadow: 0 0 90px 5px #000;
4437
    box-shadow: 0 0 90px 5px #000;
4438
    width: 600px;
4439
}
4440

    
4441
.overlay a {
4442
    color: #387693;
4443
}
4444

    
4445
.overlay .overlay-content .description.subinfo {
4446
    margin-bottom:0;
4447
    border-bottom: none;
4448
    padding-bottom:0;
4449
    margin-top: 10px;
4450
    padding-top:10px;
4451
    border-top: 1px solid #64a6c4;
4452
    /*border-top: 1px solid #DBE6EB;*/
4453
    font-size: 0.8em;
4454
}
4455

    
4456
.overlay .overlay-content .important {
4457
    color: #800000;
4458
}
4459

    
4460
.overlay .overlay-content .description {
4461
    color: #444;
4462
    border-bottom: 1px solid #64a6c4;
4463
    margin-bottom: 10px;
4464
    padding-bottom: 10px;
4465
    font-size: 0.9em;
4466
    line-height: 1.6em;
4467
}
4468
.overlay .overlay-content .empty-message {
4469
    margin-bottom: 5px;
4470
}
4471

    
4472
.overlay h3.overlay-header {
4473
    font-size: 0.9em;
4474
    text-align: left;
4475
    padding: 0.8em;
4476
    padding-left: 1em;
4477
    font-weight: normal;
4478
    border-bottom: 1px solid #ddd;
4479
}
4480

    
4481
.overlay h3.overlay-header .title {
4482
    float: left;
4483
}
4484

    
4485
.overlay .container {
4486
    position: relative;
4487
    padding-top: 1em;
4488
    padding: 0.5em;
4489
    background-image: url("../images/popup-bg.png");
4490
    background-repeat: repeat-x;
4491
}
4492

    
4493
.overlay .content {
4494
    background-color: transparent;
4495
    background-image: url("../images/popup-inner-bg.png");
4496
    padding: 1em;
4497
    font-size: 0.8em;
4498
    background-repeat: repeat-x;
4499
    -moz-box-shadow: 0 0 1px 1px #888;
4500
    -webkit-box-shadow: 0 0 1px 1px #888;
4501
    box-shadow: 0 0 1px 1px #888;
4502
}
4503

    
4504
.overlay .message {
4505
}
4506

    
4507
.overlay .actions {
4508
    position: absolute;
4509
    right: 0.75em;
4510
    top: 0.6em;
4511
}
4512

    
4513
.overlay .actions span {
4514
    font-size: 0.8em;
4515
    color: #fff;
4516
    cursor: pointer;
4517
    margin-left: 10px;
4518
    display: block;
4519
    float: left;
4520
    background-color: #4085A5;
4521
    padding: 0.2em 0.4em;
4522
}
4523

    
4524
.overlay-error .error-more-details {
4525
    margin-top: 5px;
4526
    max-height: 210px;
4527
    overflow: auto;
4528
}
4529

    
4530
.overlay-error .key.details.expand {
4531
    background-image: url("../images/plus-8.png");
4532
}
4533

    
4534
.overlay-error .key.details {
4535
    background-color: #5189A3;
4536
    cursor: pointer;
4537
    background-image: url("../images/minus-8.png");
4538
    background-repeat: no-repeat;
4539
    background-position: 545px;
4540
}
4541

    
4542
.overlay-error .container {
4543
    padding-top: 1.9em;
4544
}
4545

    
4546
.overlay-error .error-details {
4547
    font-size: 0.8em;
4548
    margin-top: 10px;
4549
}
4550

    
4551
.overlay-error .error-details anonymous {
4552
    display: block;
4553
    margin-top: 10px;
4554
}
4555

    
4556
.overlay-error h3.overlay-header {
4557
    background-color: #800000;
4558
    color: #fff;
4559
}
4560

    
4561
.overlay-error.non-critical h3.overlay-header {
4562
    background-color: #987249;
4563
}
4564

    
4565
.overlay-error span.key {
4566
    font-weight: normal;
4567
    display: block;
4568
    margin-top: 0.5em;
4569
    background-color: #74AEC9;
4570
    color: #fff;
4571
    padding: 0.4em;
4572
    font-size: 0.8em;
4573
    font-weight: bold;
4574
}
4575

    
4576
.overlay-error .indicator {
4577
    background-color: #880000;
4578
    color: #fff;
4579
    padding: 4px;
4580
    display: block;
4581
    float: left;
4582
    border: 1px solid #444;
4583
}
4584

    
4585
.overlay-error .nav-btn:hover {
4586
    
4587
}
4588

    
4589
.overlay-error .nav-btn {
4590
    margin-left: 5px;
4591
    color: #fff;
4592
    display: block;
4593
    float: left;
4594
    padding: 4px;
4595
    background-color: #AAA;
4596
    border: 1px solid #444;
4597
}
4598

    
4599
.overlay-error .error-nav {
4600
    position: absolute;
4601
    right: 0px;
4602
    bottom: -25px;
4603
    font-size: 0.8em;
4604
}
4605

    
4606
.overlay-error span.value, .overlay-error div.value {
4607
    padding: 0.4em;
4608
    display: block;
4609
    margin-bottom: 0.3em;
4610
}
4611

    
4612
.overlay h3 .closeme {
4613
    float: right;
4614
    font-size: 0.7em;
4615
    margin-top: 0.2em;
4616
    cursor: pointer;
4617
}
4618

    
4619
.overlay .overlay-header .subtitle {
4620
    display: block;
4621
    font-size: 0.8em;
4622
    color: #ddd;
4623
}
4624

    
4625
.overlay .overlay-header .subtitle img {
4626
    vertical-align: middle;
4627
    margin-left: 10px;
4628
    margin-bottom: 2px;
4629
}
4630

    
4631
.overlay-info .content {
4632
    background-repeat: no-repeat;
4633
    background-position: 110% 110%;
4634
    background-color: rgba(255,255,255,0.6)
4635
}
4636

    
4637
.overlay-info .overlay-header {
4638
    background-color: #4085A5;
4639
}
4640

    
4641
.overlay-info .overlay-header .title {
4642
    color: #fff;
4643
}
4644

    
4645
.overlay-info .overlay-header .closeme {
4646
    color: #fff;
4647
}
4648

    
4649
#loading-view {
4650
    width: 600px;
4651
    margin: 0 auto;
4652
    padding: 20px 0;
4653
    font-size: 0.8em;
4654
}
4655

    
4656
#loading-view .header span {
4657
    font-weight: bold;
4658
    color: #4085A5;
4659
}
4660

    
4661
#loading-view .info {
4662
    color: #ddd;
4663
}
4664

    
4665
.options-list {
4666
    margin-top: 0.5em;
4667
    font-size: 0.8em;
4668
}
4669

    
4670
.options-list.five li {
4671
    float: left;
4672
    display: block;
4673
    width: 20%;
4674
    margin-bottom: 5px;
4675
}
4676

    
4677
.options-list.five li:nth-child(5n) .options-object-cont {
4678
    margin-right: 0;
4679
}
4680

    
4681
.options-object-cont input {
4682
    border: 1px solid #aaa;
4683
    width: 92px;
4684
    padding: 0;
4685
    margin: 0;
4686
    margin-top:3px;
4687
    padding: 2px;
4688
}
4689

    
4690
.options-list.three li {
4691
    float: left;
4692
    display: block;
4693
    width: 33%;
4694
    margin-bottom: 5px;
4695
}
4696

    
4697
.meta-list .options-list li.options-object.create .options-object-cont {
4698
    background-image: url("../images/option-action-add.png");
4699
    background-repeat: no-repeat;
4700
    background-position: 90px 5px;
4701
}
4702

    
4703
.meta-list .options-list li .options-object-cont .option-action,
4704
.meta-list .options-list li.options-object.create {
4705
    cursor: pointer !important;
4706
}
4707

    
4708
.meta-list .options-list li .options-object-cont {
4709
    cursor: inherit;
4710
}
4711

    
4712
.options-list li .options-object-cont {
4713
    padding: 5px;
4714
    margin-right: 4px;
4715
    border: 1px solid #A6D1E6;
4716
    cursor: pointer;
4717
    min-height: 35px;
4718
    position: relative;
4719
}
4720

    
4721
.options-list.three li:nth-child(3n) .options-object-cont {
4722
    margin-right: 0;
4723
}
4724

    
4725
.options-list li.selected .options-object-cont {
4726
    background-color: #efefef;
4727
    border: 2px solid #4085A5;
4728
    padding: 4px;
4729
}
4730

    
4731
.options-list li.selected .options-object-cont .title {
4732
}
4733

    
4734
.options-list li.options-object .title {
4735
    display: block;
4736
    color: #FF7F2A;
4737
    margin-bottom: 2px;
4738
}
4739

    
4740
.options-list li .option-action {
4741
    display: none;
4742
    position: absolute;
4743
    background-repeat: no-repeat;
4744
}
4745

    
4746
.options-list.five li.editing {
4747
    width: 40%;
4748
}
4749

    
4750
.options-list.five li.editing .value {
4751
    display: none;
4752
}
4753

    
4754
.options-list li .remove {
4755
    background-image: url("../images/option-action-remove.png");
4756
    width:10px;
4757
    height:10px;
4758
    right:5px;
4759
    top: 5px;
4760
}
4761

    
4762
.options-list li .edit {
4763
    background-image: url("../images/option-action-edit.png");
4764
    width:10px;
4765
    height:10px;
4766
    right:5px;
4767
    bottom: 8px;
4768
}
4769

    
4770
.options-list li:hover .option-action  {
4771
    display: block;
4772
}
4773

    
4774
.options-list li.options-object .value {
4775
    color: #4085A5;
4776
    margin-top: 5px;
4777
    display: block;
4778
}
4779

    
4780
.options-list li.selected.options-object .value {
4781
}
4782

    
4783
.options-list li .options-object-cont:hover {
4784
    background-color: #fff;
4785
}
4786

    
4787
.options-list li.selected .options-object-cont:hover {
4788
    background-color: #fff;
4789
}
4790

    
4791
.options-list li img {
4792
    float: left;
4793
    margin:2px;
4794
    margin-right: 10px;
4795
    padding-bottom:10px;
4796
}
4797

    
4798
#network-vms-select-content li.options-object .value {
4799
    margin-top: 10px;
4800
    margin-left: 30px;
4801
}
4802

    
4803
#network-vms-select-content li.options-object:hover .options-object-cont,
4804
#network-vms-select-content li.options-object .options-object-cont {
4805
    background-image: url("../images/option-action-add-dark.png");
4806
    background-repeat: no-repeat;
4807
    background-position: 160px 28px;
4808
}
4809

    
4810
#network-vms-select-content li.selected:hover .options-object-cont,
4811
#network-vms-select-content li.selected .options-object-cont {
4812
    background-image: url("../images/option-action-remove.png") !important;
4813
}
4814

    
4815
#metadata-overlay-content .view .value {
4816
    margin-top: 10px;
4817
}
4818

    
4819
#metadata-overlay-content {
4820
    position: relative;
4821
}
4822

    
4823
.vm-meta .editor .predefined .predefined-meta-key:hover {
4824
    background-color: #4e8eac;
4825
    color: #fff;
4826
}
4827

    
4828
.vm-meta .editor .predefined .predefined-meta-key {
4829
    float: left;
4830
    margin-right: 5px;
4831
    padding: 4px;
4832
    display: block;
4833
    cursor: pointer;
4834
}
4835

    
4836
.vm-meta .editor .predefined {
4837
    background-color: #A6D1E6;
4838
    font-size: 0.9em;
4839
    border-top: 1px solid #ddd;
4840
}
4841

    
4842
.vm-meta .editor input {
4843
}
4844
.vm-meta .editor {
4845
    margin-bottom: 10px;
4846
}
4847

    
4848
.vm-meta .editor .form-actions .form-action {
4849
    min-width: 50px;
4850
}
4851

    
4852
.vm-meta .editor .form-field input.meta-key {
4853
    width: 90px;
4854
}
4855

    
4856
.vm-meta .form-field {
4857
    float: left;
4858
}
4859

    
4860
.vm-meta .form-actions .form-action {
4861
    float: left;
4862
    margin-right: 10px;
4863
    height: 11px;
4864
}
4865

    
4866
.vm-meta .editor .form-actions .cancel {
4867
    margin-right: 0;
4868
}
4869

    
4870
.vm-meta .editor .form-actions {
4871
    float: right;
4872
    margin:0;
4873
    padding:0;
4874
    margin-left: 15px;
4875
    margin-top: 0px;
4876
}
4877

    
4878
.vm-meta .editor {
4879
    background-color: rgba(64, 133, 165, 0.898) !important;
4880
    background-color: #649DB8;
4881
    font-size:0.9em;
4882
}
4883

    
4884
.vm-meta .meta-key-title {
4885
    font-size: 1.3em;
4886
    color: #fff;
4887
    margin-bottom: 10px;
4888
    display: none;
4889
    float: left;
4890
}
4891

    
4892
.vm-meta .editor-content {
4893
    padding: 10px;
4894
}
4895

    
4896
.vm-meta .inner-mask {
4897
    background-color: #fff;
4898
    opacity:0.6;
4899
    position: absolute;
4900
    top:0;
4901
    left:0;
4902
}
4903

    
4904
.vm-meta .editor label {
4905
    float: left;
4906
    color: #fff;
4907
    margin-right: 2px;
4908
    padding-top:4px;
4909
    font-size: 0.9em;
4910
}
4911

    
4912
.vm-meta .editor input {
4913
    border: none;
4914
    width: 170px;
4915
    margin-left: 10px;
4916
    font-size: 0.9em;
4917
    padding: 4px;
4918
}
4919

    
4920
.vm-meta li.create .options-object-cont {
4921
    background-color: #B3C9AD ;
4922
    border-color: #788774;
4923
}
4924
.vm-meta li.create .options-object-cont .value,
4925
.vm-meta li.create .options-object-cont .title {
4926
    color: #fff;
4927
}
4928

    
4929
#createvm-overlay-content {
4930
    padding: 0;
4931
}
4932

    
4933
.overlay-createvm .container {
4934
    width: 584px !important;
4935
}
4936

    
4937
.create-vm .header-step.current {
4938
    font-weight: bold;
4939
}
4940

    
4941
.create-vm .create-step-cont {
4942
    min-height: 240px;
4943
}
4944
.create-vm .create-controls {
4945
    padding: 10px;
4946
}
4947

    
4948
.create-vm ul li {
4949
    cursor: pointer;
4950
    padding: 4px;
4951
}
4952

    
4953
.create-vm ul li.selected {
4954
    background-color: #aaa;
4955
}
4956

    
4957
.cont-toggler {
4958
    background-image: url("../images/down-arrow.png");
4959
    background-position: right;
4960
    background-repeat: no-repeat;
4961
    background-color: #A1C8DB;
4962
    display: inline-block;
4963
    border-right: 6px solid #A1C8DB;
4964
    padding:2px;
4965
    padding-right: 14px;
4966
    padding-left:0;
4967
    cursor: pointer;
4968
    color: #fff;
4969
    font-size: 0.9em;
4970
}
4971

    
4972
.cont-toggler .label {
4973
    background-color: #98BDCF;
4974
    padding: 2px;
4975
    padding-left: 5px;
4976
    padding-right: 5px;
4977
}
4978

    
4979
.cont-toggler.open {
4980
    background-color: #98BDCF;
4981
    border-color: #98BDCF;
4982
    background-image: url("../images/up-arrow.png");
4983
}
4984

    
4985
.cont-toggler.open .label {
4986
    background-color: #4085A5;
4987
}
4988

    
4989
.overlay .form label {
4990
    font-color: #444;
4991
    margin-right: 10px;
4992
}
4993

    
4994
.form-field.error label {
4995
    color: #ff0000;
4996
    text-decoration: underline;
4997
}
4998

    
4999
.form-field input {
5000
    border: 1px solid #aaa;
5001
    width: 200px;
5002
    padding: 3px;
5003
}
5004

    
5005
.form-actions {
5006
    margin-top: 5px;
5007
    padding-top:5px;
5008
    border-top: 1px solid #64a6c4;
5009
    font-size: 0.8em;
5010
}
5011

    
5012
.form-actions.plain {
5013
    margin-top: 0px;
5014
    padding-top:0px;
5015
    border-top: 0px;
5016
}
5017

    
5018
.form-action {
5019
    float: right;
5020
    min-width: 140px;
5021
    background-color: #FF7F2A;
5022
    border: 1px solid #FF7F2A;
5023
    text-align: center;
5024
    color: #FFFFFF;
5025
    cursor: pointer;
5026
    padding: 4px;
5027
}
5028

    
5029
.form-action:hover {
5030
    background-color: #FF9955;
5031
    color: #FFF;
5032
}
5033

    
5034
.form-action.prev,
5035
.form-action.cancel {
5036
    background-color: #800;
5037
    border: 1px solid #800;
5038
    float: left;
5039
}
5040

    
5041
.form-action.prev:hover,
5042
.form-action.cancel:hover {
5043
    background-color: #CC0000;
5044
    color: #fff;
5045
}
5046

    
5047
.form-action.next,
5048
.form-action.ok {
5049
    background-color: #080;
5050
    border: 1px solid #080;
5051
}
5052

    
5053
.form-action.next:hover,
5054
.form-action.ok:hover {
5055
    background-color: #00aa00;
5056
    color: #fff;
5057
}
5058

    
5059
.form-action .create,
5060
.form-action .submit {
5061

    
5062
}
5063

    
5064
.form-action.in-progress, button.in-progress {
5065
    background-image: url("../images/icons/indicators/medium/horizontal-progress.gif");
5066
    background-repeat: no-repeat;
5067
    background-position: center center;
5068
    color: transparent;
5069
}
5070

    
5071
#createvm-overlay-content {
5072
    padding: 0;
5073
}
5074

    
5075
.create-vm .image-details.selected .size {
5076

    
5077
}
5078

    
5079
.create-vm .image-details .show-details:hover {
5080
    color: #aaa !important; 
5081
}
5082
.create-vm .image-details.selected .show-details:hover {
5083
    color: #fff !important; 
5084
}
5085

    
5086
.create-vm .image-details.selected .show-details,
5087
.create-vm .image-details.selected .size {
5088
    color: #eee;
5089
}
5090

    
5091
.create-vm .image-details.selected span.owner {
5092
    color: #fff;
5093
}
5094

    
5095

    
5096
.create-vm .image-details p {
5097
    font-size: 0.8em;
5098
    padding-left: 27px;
5099
    display:block;
5100
}
5101

    
5102
.create-vm .image-details span.owner {
5103
    display: block;
5104
    font-size: 0.9em;
5105
    float: right;
5106
    color: #FF7F2A;
5107
    position: absolute;
5108
    top: 5px;
5109
    right: 5px;
5110
}
5111

    
5112
.create-vm .select-image .show-details {
5113
    display: none;
5114
    font-size: 0.8em;
5115
    text-decoration: underline;
5116
    color: #000;
5117
    position: absolute;
5118
    bottom: 5px;
5119
    right: 5px;
5120
}
5121

    
5122
.create-vm .image-details .size {
5123
    margin-top: 2px;
5124
    font-size: 0.8em;
5125
    color: #aaa;
5126
    margin-left: 10px;
5127
}
5128

    
5129
.create-vm .step-cont {
5130
    margin: 15px;
5131
}
5132

    
5133
.create-vm .create-step-cont {
5134
    min-height: 250px;
5135
    float: left;
5136
    width: 584px;
5137
}
5138

    
5139
.create-vm .create-controls {
5140
    padding: 10px;
5141
    border-top: 1px solid #ddd;
5142
}
5143

    
5144
.create-vm .empty {
5145
    font-size: 0.8em;
5146
    color: #444;
5147
}
5148

    
5149
.create-vm h4 {
5150
    color: #5CA1C0;
5151
    margin-bottom: 0.5em;
5152
    font-family: arial;
5153
}
5154
.create-vm ul li {
5155
    cursor: pointer;
5156
    padding: 4px;
5157
    font-size: 0.9em;
5158
}
5159

    
5160
.create-vm .create-step-cont li.ssh-key-option.selected,
5161
.create-vm ul li.selected {
5162
    background-color: #FF7F2A;
5163
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5164
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5165
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5166
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5167
    color: #fff;
5168
}
5169

    
5170
.create-vm .images-list-cont.loading .loading-indicator {
5171
    display: block !important;
5172
}
5173

    
5174
.create-vm .images-list-cont .loading-indicator {
5175
    display: none;
5176
    position: absolute;
5177
    right: -13px;
5178
    top: 2px;
5179
    width: 30px;
5180
    height: 10px;
5181
    background-repeat: no-repeat;
5182
    background-image: url("../images/icons/indicators/medium/progress.gif");
5183
}
5184

    
5185
.create-vm .images-list-cont h4 {
5186
    position: relative;
5187
}
5188

    
5189
.create-vm .images-list-cont {
5190
    width: 40%;
5191
    float: left;
5192
    padding-left: 3%;
5193
    padding-right: 3%;
5194
}
5195

    
5196
.create-vm li p.desc {
5197
    font-size: 0.9em;
5198
}
5199

    
5200
.create-vm p.desc.warning {
5201
    color: #880000;
5202
}
5203

    
5204
.create-vm p.desc.empty {
5205
    color: #000;
5206
}
5207

    
5208
.create-vm p.desc {
5209
    font-size: 0.8em;
5210
    color: #888;
5211
    margin-bottom: 10px;
5212
}
5213

    
5214
.create-vm li.role .values .val:hover {
5215
    background-color: #eee;
5216
}
5217
.create-vm li.role .values .val.selected,  .create-vm li.role .values .val.selected:hover {
5218
    color: #fff;
5219
    background-color: #FF9955;
5220
}
5221

    
5222
.create-vm .images-filter-cont, .create-vm .flavors-predefined-cont {
5223
    width: 18%;
5224
    padding-right: 4%;
5225
    float:left;
5226
    border-right: 1px solid #A1C8DB;
5227
    overflow: auto;
5228
}
5229

    
5230
.create-vm .flavor-options-cont {
5231
    width: 74%;
5232
    float: left;
5233
    margin-left: 20px;
5234
}
5235

    
5236
.create-vm .flavor-options-cont .flavor-options li:hover {
5237
    background-image:-webkit-linear-gradient(top, #E8F4FA, #D1E7F0);
5238
    background-image:-o-linear-gradient(top, #E8F4FA, #D1E7F0);
5239
    background-image:-moz-linear-gradient(top, #E8F4FA, #D1E7F0);
5240
    background-image:linear-gradient(top, #E8F4FA, #D1E7F0);
5241
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E8F4FA', endColorstr='#D1E7F0', GradientType=0);
5242
}
5243

    
5244
.create-vm .flavor-options-cont .flavor-options li.disabled * {
5245
    color: #eee !important;
5246
}
5247

    
5248
.create-vm .flavor-options-cont .flavor-options li.disabled {
5249
    background-image:linear-gradient(top, #aaa, #ddd);
5250
    background-image:-webkit-linear-gradient(top, #aaa, #ddd);
5251
    background-image:-o-linear-gradient(top, #aaa, #ddd);
5252
    background-image:-moz-linear-gradient(top, #aaa, #ddd);
5253
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#aaaaaa', endColorstr='#dddddd', GradientType=0);
5254
}
5255

    
5256
.create-vm .flavor-options-cont .flavor-options li.selected {
5257
    background-color: #FF9955;
5258
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5259
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5260
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5261
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5262
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF9955', endColorstr='#E88B4D', GradientType=0);
5263
    border: 1px solid #C97943;
5264
}
5265

    
5266
.create-vm .predefined-list li.disabled {
5267
    color: #ddd !important;
5268
}
5269

    
5270
.create-vm .flavor-options-cont .flavor-options li {
5271
    display: block;
5272
    float: left;
5273
    margin-right: 10px;
5274
    margin-bottom: 9px;
5275
    padding: 9px 14px;
5276
    border: 1px solid #aaa;
5277
    background-image:-webkit-linear-gradient(top, #D1E7F0, #E8F4FA);
5278
    background-image:-o-linear-gradient(top, #D1E7F0, #E8F4FA);
5279
    background-image:-moz-linear-gradient(top, #D1E7F0, #E8F4FA);
5280
    background-image:linear-gradient(top, #D1E7F0, #E8F4FA);
5281
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D1E7F0', endColorstr='#E8F4FA', GradientType=0);
5282
}
5283

    
5284
.create-vm .flavor-options-cont .flavor-options {
5285
    margin-bottom: 2px;
5286
}
5287

    
5288

    
5289
.create-vm .flavor-options .metric {
5290
    font-size: 0.8em;
5291
    margin-left: 2px;
5292
}
5293

    
5294
.create-vm .flavor-options span.title {
5295
    color: #444;
5296
}
5297

    
5298
.create-vm .flavor-options span.desc {
5299
    display: block;
5300
    color: #aaa;
5301
    font-weight: normal;
5302
    font-size: 0.8em;
5303
    float: right;
5304
    margin-top: 4px;
5305
}
5306

    
5307
.disktip {
5308
    padding: 4px;
5309
    top: 20px;
5310
}
5311

    
5312
.create-vm .flavor-options .flavors-disk-template-list {
5313
    position: relative;
5314
}
5315

    
5316
.create-vm .flavor-options .disk_template.option {
5317
    z-index: 10;
5318
    min-width: 50px;
5319
    text-align: center;
5320
}
5321

    
5322
/*0 position is -470px*/
5323
.create-vm .flavor-options .disk-template-description {
5324
    font-size: 0.8em;
5325
    color: #444;
5326
    background-image: url("../images/horizontal-pointer.png");
5327
    background-repeat: repeat-x;
5328
    background-position: -470px 0;
5329
    padding-top: 15px;
5330
    margin-top: -10px;
5331
    font-style: italic;
5332
    display:block;
5333
    overflow: auto;
5334
    padding-bottom: 0px;
5335
    margin-bottom: 7px;
5336
    width: 100%;
5337
}
5338

    
5339
.create-vm .flavor-options .disk_template.option .description {
5340
    display: none;
5341
    position: absolute;
5342
    bottom: -20px;
5343
    left:0;
5344
    color: #888;
5345
    font-style: italic;
5346
    display: block;
5347
    background-color: #fff;
5348
    width: 100%;
5349
    text-align: left;
5350
    z-index: 0;
5351
    border-top: 1px solid #ddd;
5352
    padding-top: 3px;
5353
    display: none;
5354
}
5355

    
5356
.create-vm .flavor-options .selected .value {
5357
    color: #FFF;
5358
}
5359

    
5360
.create-vm .flavor-options .value {
5361
    font-weight: bold;
5362
    color: #5CA1C0;
5363
}
5364

    
5365
.create-vm .flavor-options-cont h4 {
5366
    border-bottom: 1px solid #A1C8DB;
5367
    padding-bottom: 5px;
5368
}
5369

    
5370
.create-vm .images-info-cont {
5371
    width: 28%;
5372
    padding-left: 3%;
5373
    float: left;
5374
    border-left: 1px solid #A1C8DB;
5375
}
5376

    
5377
.create-vm .select-image.wide .show-details {
5378
    display: inline;
5379
}
5380

    
5381
.create-vm .select-image .images-info-cont .hide {
5382
    display: none;
5383
}
5384

    
5385
.create-vm .select-image.wide .images-info-cont .hide {
5386
    display: block;
5387
    float: right;
5388
    position: absolute;
5389
    right: 10px;
5390
    top: 10px;
5391
    font-size: 0.8em;
5392
    text-decoration: underline;
5393
    color: #5CA1C0;
5394
    cursor: pointer;
5395
}
5396

    
5397
.create-vm .select-image.wide .images-list-cont {
5398
    width: 74%;
5399
    padding-right: 0;
5400
}
5401

    
5402
.create-vm .select-image.wide .images-info-cont .description .title {
5403
    display: none;
5404
    float: none;
5405
}
5406

    
5407
.create-vm .select-image.wide .images-info-cont .description p {
5408
    background-color: #fff;
5409
    border: 1px solid #ddd;
5410
    padding: 10px;
5411
    float: none;
5412
}
5413

    
5414
.create-vm .select-image.wide .selected .size {
5415
    color: #FFF !important;
5416
}
5417

    
5418
.create-vm .select-image.wide .image-details .size {
5419
    color: #5CA1C0;
5420
    position: absolute;
5421
    top: 5px;
5422
}
5423

    
5424
.create-vm .select-image.wide .images-info-cont h3 {
5425
    color: #5CA1C0;
5426
    margin: 10px 0;
5427
    margin-top: 5px;
5428
    text-align: left;
5429
    font-size: 0.9em;
5430
}
5431

    
5432
.create-vm .select-image.wide .images-info-cont .description p {
5433
    height: 50px;
5434
}
5435

    
5436
.create-vm .select-image.wide .images-info-cont .description {
5437
    width: 100% !important;
5438
    float: none !important;
5439
    background-color: transparent !important;
5440
    padding: 0 !important;
5441
    font-size: 1.1em;
5442
}
5443
.create-vm .select-image.wide .images-info-cont .extra-details {
5444
    height: 160px;
5445
    overflow-y: scroll;
5446
    padding-right: 15px;
5447
}
5448

    
5449
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail {
5450
    padding: 0px;
5451
    background-color: transparent;
5452
    margin-bottom: 4px;
5453
}
5454

    
5455
.create-vm .select-image.wide .images-info-cont .extra-details .title {
5456
    float: left;
5457
    display: block;
5458
    width: 39%;
5459
    padding: 1%;
5460
    background-color: #5CA1C0;
5461
    color: #fff;
5462
    border: 1px solid #4F8DAA;
5463
    font-size: 0.8em;
5464
}
5465

    
5466
.create-vm .select-image.wide .images-info-cont .extra-details .value {
5467
    float: right;
5468
    display: block;
5469
    width: 55%;
5470
    padding: 1%;
5471
    border: none;
5472
    background-color: #FFF;
5473
    color: #444;
5474
    border: 1px solid #ddd;
5475
    margin-bottom: 0px;
5476
    font-size: 0.8em;
5477
}
5478

    
5479
.create-vm .select-image.wide .images-info-cont .image-detail {
5480
}
5481

    
5482
.create-vm .select-image.wide ul.images-list {
5483
    height: 310px;
5484
    overflow-y: scroll;
5485
    padding-right: 3%;
5486
}
5487

    
5488
.create-vm .select-image.wide .images-info-cont {
5489
    position: absolute;
5490
    width: 88%;
5491
    background-color: #DAE9F0;
5492
    padding: 2%;
5493
    border-left: none;
5494
    height: 320px;
5495
    box-shadow: 0px 0px 2px #aaa;
5496
    -moz-box-shadow: 0px 0px 2px #aaa;
5497
    -webkit-box-shadow: 0px 0px 2px #aaa;
5498
    display: none;
5499
}
5500

    
5501

    
5502
.create-vm .images-info-cont h4, .create-vm .create-step-cont .param h4{
5503
    color: #FF9955;
5504
    margin-bottom: 1em;
5505
    font-size: 1.2em;
5506
}
5507

    
5508
.create-vm .images-info-cont span.title {
5509
    color: #4085A5;
5510
    display: block;
5511
    margin-bottom: 2px;
5512
    font-size: 0.8em;
5513
}
5514

    
5515
.create-vm .type-filter li {
5516
    font-size: 0.8em;
5517
    /*font-weight: bold;*/
5518
    padding: 4px;
5519
    margin-bottom: 0px;
5520
    color: #FF7F2A;
5521
}
5522

    
5523
.create-vm .images-list li {
5524
    min-height: 30px;
5525
}
5526
.create-vm .images-list .image-details:hover {
5527
    background-color: #eee;
5528
}
5529

    
5530
.create-vm .images-list .image-details.selected:hover {
5531
    background-color: #FF7F2A;
5532
}
5533

    
5534
.create-vm .images-list .image-details.selected {
5535
    /*font-weight: bold;*/
5536
}
5537

    
5538
.create-vm .images-list .image-details {
5539
    padding: 6px;
5540
    margin-bottom:1px;
5541
    position: relative;
5542
}
5543

    
5544
.create-vm .images-list .image-details img {
5545
    vertical-align: middle;
5546
    margin-right: 10px;
5547
}
5548

    
5549
.create-vm .images-info-cont .image-detail:last-child p {
5550
    border-bottom: none;
5551
}
5552

    
5553
.create-vm .images-info-cont h4 img {
5554
    vertical-align: middle;
5555
    margin-right: 7px;
5556
    margin-bottom: 5px;
5557
}
5558

    
5559
.create-vm .images-info-cont .description p {
5560
    font-size: 0.8em;
5561
}
5562

    
5563
.create-vm .images-info-cont p {
5564
    margin-bottom: 7px;
5565
    font-size: 0.9em;
5566
    border-bottom: 1px solid #A1C8DB;
5567
    padding-bottom: 7px;
5568
}
5569

    
5570
.create-vm .step-header {
5571
    padding-bottom:0;
5572
    position: relative;
5573
}
5574

    
5575
.create-vm .step-header .header-step .info span.subtitle {
5576
    font-size: 1.2em;
5577
    color: #fff;
5578
    font-weight: bold;
5579
}
5580

    
5581
.create-vm .step-header .header-step .info span {
5582
    float: none;
5583
    text-align: right;
5584
}
5585

    
5586
.create-vm .step-header .header-step .info {
5587
    position: absolute;
5588
    right: 15px;
5589
    top: 20px;
5590
    font-size: 0.8em;
5591
}
5592

    
5593
.create-vm .step-header .header-step span {
5594
    float: left;
5595
    display: block;
5596
}
5597

    
5598
.create-vm .steps-container {
5599
    width: 2000em;
5600
}
5601

    
5602
.create-vm .step-header .header-step .title {
5603
    margin-top: 20px;
5604
    font-size: 1em;
5605
    margin-left: 10px;
5606
}
5607

    
5608
#createvm-overlay-content {
5609
    width: 584px;
5610
    overflow: hidden;
5611
}
5612

    
5613
.create-vm .steps-history .steps-history-cont.current .title {
5614
    display: block;
5615
    top: 23px;
5616
    left: 43px;
5617
    font-size: 1.2em;
5618
    color: #ffffff;
5619
    font-weight: bold;
5620
    font-family: 'Ubuntu', sans-serif !important;
5621
}
5622

    
5623
.create-vm .steps-history .steps-history-cont.current .subnum {
5624
    display: none;
5625
    float: none;
5626
    font-size: 0.9em;
5627
    font-family: 'Ubuntu', sans-serif  !important;
5628
}
5629

    
5630
.create-vm .steps-history .steps-history-cont.current .subtitle,
5631
.create-vm .steps-history .steps-history-cont.current .description {
5632
    font-family: 'Ubuntu', sans-serif  !important;
5633
}
5634

    
5635
.create-vm .steps-history .steps-history-cont.current .info {
5636
    display: block;
5637
    font-family: 'Ubuntu', sans-serif !important;
5638
}
5639

    
5640
.create-vm .steps-history .steps-history-cont.completed .title,
5641
.create-vm .steps-history .steps-history-cont.completed .num {
5642
    color: #A1C8DB;
5643
}
5644

    
5645
.create-vm .steps-history .steps-history-cont.completed {
5646
    background-color: #4085A5;
5647
    color: #fff;
5648
    cursor: pointer;
5649
}
5650

    
5651
.create-vm .steps-history .steps-history-cont.completed .steps-history-step {
5652
    background-image: url("../images/check.png");
5653
}
5654

    
5655
.create-vm .steps-history .steps-history-cont.current .steps-history-step {
5656
    width: 320px;
5657
}
5658

    
5659
.create-vm .steps-history .steps-history-cont.current .num {
5660
    color: #fff;
5661
}
5662

    
5663
.create-vm .steps-history .steps-history-cont.current .info {
5664
    color: #4085A5;
5665
    font-size: 0.8em;
5666
}
5667

    
5668
.create-vm .steps-history .steps-history-cont.current {
5669
    background-color: #A1C8DB;
5670
    color: #fff;
5671
    width: 428px;
5672
}
5673

    
5674
.create-vm .steps-history-step {
5675
    padding: 4px;
5676
    padding-left: 7px;
5677
    font-size: 1em;
5678
    font-family: 'Ubuntu', sans-serif  !important;
5679
    margin-right: 5px;
5680
    padding-top: 12px;
5681
    background-position: right 30px;
5682
    background-image: none;
5683
    background-repeat: no-repeat;
5684
}
5685

    
5686
.create-vm .steps-history {
5687
    background-color: #4085A5;
5688
}
5689

    
5690
.create-vm .steps-history .steps-history-cont.last {
5691
    border-right: none;
5692
}
5693

    
5694
.create-vm .steps-history .steps-history-cont .num {
5695
    margin-left: 5px;
5696
    margin-top: -10px;
5697
    padding-bottom: 10px;
5698
}
5699

    
5700
.create-vm .steps-history .steps-history-cont .title {
5701
    display: none;
5702
    position: absolute;
5703
    bottom: 0px;
5704
    text-align: center;
5705
    padding-bottom: 2px;
5706
    left:0;
5707
    width: 55px;
5708
    margin-left:0;
5709
    margin-top:0;
5710
    font-size: 0.8em;
5711
}
5712

    
5713
.create-vm .steps-history .steps-history-cont .subnum,
5714
.create-vm .steps-history .steps-history-cont .info {
5715
    display: none;
5716
}
5717

    
5718
.create-vm .steps-history .steps-history-cont {
5719
    height: 70px;
5720
    width: 51px;
5721
    float: left;
5722
    color: #fff;
5723
    border-right: 1px solid #A1C8DB;
5724
    color: #A1C8DB;
5725
    background-color: #4085A5;
5726
    background-position: center right;
5727
    background-image: none;
5728
    background-repeat: no-repeat;
5729

    
5730
    -webkit-transition: background-color .15s ease-in;
5731
    -o-transition: background-color .15s ease-in;
5732
    -moz-transition: background-color .15s ease-in;
5733
    transition: background-color .15s ease-in;
5734

    
5735
    border-bottom: 1px solid #aaa;
5736
}
5737

    
5738
.create-vm .step-header .header-step .num {
5739
    color: #225871;
5740
    font-size: 4em;
5741
    margin-bottom: -5px;
5742
    font-family: 'Ubuntu', sans-serif;
5743
    font-weight: normal !important;
5744
}
5745

    
5746
.create-vm .step-header .header-step {
5747
    color: #;
5748
    margin-bottom: -6px;
5749
    width: 25%;
5750
    padding-left: 0%;
5751
    display: block;
5752
    float: left;
5753
}
5754

    
5755
.create-vm .step-header .header-step.current {
5756
    color: #387693;
5757
}
5758

    
5759
.create-vm .image-filters-title {
5760
    margin-top: 1em;
5761
    margin-bottom: 0.5em;
5762
}
5763

    
5764
.create-vm .create-step-cont span.clear {
5765
    font-size: 0.8em;
5766
    font-weight: bold;
5767
    color: #A1C8DB;
5768
    display: block;
5769
}
5770

    
5771
.create-vm .category-filters li {
5772
    float:left;
5773
    display: block;
5774
    padding: 4px;
5775
    background-color: #eee;
5776
    margin-right: 5px;
5777
    font-size: 0.9em;
5778
    margin-bottom: 5px;
5779
}
5780

    
5781
.create-vm .content-cont {
5782
    height: 340px;
5783
    overflow: auto;
5784
}
5785

    
5786
.create-vm .vm-confirm .confirm-params span.cval {
5787
    margin-left: 8px;
5788
    color: #444;
5789
}
5790

    
5791
.create-vm .vm-confirm .confirm-params span.ckey {
5792
    color: #4085A5;
5793
    font-weight: bold;
5794
}
5795

    
5796
.create-vm .vm-confirm .confirm-params {
5797
    margin-bottom: 15px;
5798
}
5799

    
5800
.create-vm .vm-confirm h3.vm-name {
5801
    background-repeat: no-repeat;
5802
    background-position: left center;
5803
    font-size: 1.4em;
5804
    padding-left: 1.45em;
5805
    color: #4085A5;
5806
}
5807

    
5808
.create-vm .images-list-cont h4 a {
5809
    margin-top: 3px;
5810
    margin-right: -2px !important;
5811
}
5812
.create-vm .images-list-cont h4 a,
5813
.create-vm .list-cont h4 a {
5814
    font-size: 0.8em;
5815
    font-weight: normal;
5816
    margin-right: 5px;
5817
    float: right;
5818
    color: #FF7F2A;
5819
}
5820

    
5821
.create-vm .confirm-params {
5822
    overflow: auto;
5823
}
5824

    
5825
.create-vm .vm-confirm .ssh.confirm-params {
5826
    max-height: 150px;
5827
}
5828

    
5829
.create-vm .personalize-cont .confirm-params {
5830
    max-height: 216px;
5831
}
5832

    
5833
.create-vm .personalize-cont,
5834
.create-vm .confirm-cont {
5835
    height: 250px;
5836
}
5837

    
5838
.create-vm .create-step-cont .rename input.rename-field {
5839
    font-size: 1.4em;
5840
    padding: 5px;
5841
    width: 93%;
5842
    padding-left: 30px;
5843
    background-position: 7px center;
5844
    background-repeat: no-repeat;
5845
}
5846

    
5847
.create-vm .create-step-cont .rename label {
5848
    display: block;
5849
}
5850

    
5851
.create-vm .create-step-cont .personalize-conts,
5852
.create-vm .create-step-cont .confirm-conts {
5853
    margin-top: 20px;
5854
}
5855

    
5856
.create-vm .create-step-cont .personalize-cont,
5857
.create-vm .create-step-cont .confirm-cont {
5858
    width: 30%;
5859
    margin-right: 2%;
5860
    border-right: 1px solid #A1C8DB;
5861
    float: left;
5862
}
5863

    
5864
.create-vm .create-step-cont .confirm-cont ul li .title {
5865
    width: 55px;
5866
    float: left;
5867
}
5868

    
5869
.create-vm .create-step-cont .list-cont ul li .value {
5870
    float: right;
5871
    padding-top: 2px;
5872
    display: block;
5873
    width: 90px;
5874
    text-align: right;
5875
}
5876

    
5877
.create-vm .create-step-cont .list-cont ul li.flavor-disktype .value {
5878
    width: 45px;
5879
}
5880

    
5881
.create-vm .create-step-cont .list-cont ul li.image-description .value,
5882
.create-vm .create-step-cont .list-cont ul li.image-name .value {
5883
    float: none;
5884
    width: auto;
5885
    text-align:left;
5886
    width: auto;
5887
}
5888

    
5889
.create-vm .create-step-cont .list-cont ul li {
5890
    padding:0;
5891
    margin:0;
5892
    margin-bottom: 5px;
5893
    border-bottom: 1px solid #EEE;
5894
    padding-bottom: 7px;
5895
    margin-right: 10px;
5896
}
5897

    
5898
.create-vm .create-step-cont li.ssh-key-option .check {
5899
    float: right;
5900
    margin-right: 5px;
5901
    margin-top: 0px;
5902
}
5903

    
5904
.create-vm .create-step-cont li.ssh-key-option.selected {
5905
}
5906
.create-vm .create-step-cont li.ssh-key-option.selected:hover {
5907
    background-color: #F95;
5908
}
5909

    
5910
.create-vm .create-step-cont li.ssh-key-option:hover {
5911
    background-color: #eee;
5912
}
5913

    
5914
.create-vm .create-step-cont li.ssh-key-option.selected {
5915
}
5916

    
5917
.create-vm .create-step-cont li.ssh-key-option {
5918
    padding: 6px !important;
5919
}
5920

    
5921
.create-vm .create-step-cont .list-cont.ssh {
5922
    width: 60%;
5923
}
5924

    
5925
.create-vm .create-step-cont .list-cont.meta h4 {
5926
    margin-right: 0;
5927
}
5928

    
5929
.create-vm .create-step-cont .list-cont.meta {
5930
    margin-right:0;
5931
    border-right: none;
5932
    width: 195px;
5933
}
5934

    
5935
.create-vm .list-cont > h4 {
5936
    font-size: 1.2em;
5937
    margin-right: 10px;
5938
    border-bottom: 1px solid #A1C8DB;
5939
    padding-bottom: 5px;
5940
    color: #387693;
5941
}
5942

    
5943
.create-vm .list-cont .param.image-name {
5944
    margin-bottom: 0 !important;
5945
    border-bottom: none !important;
5946
}
5947

    
5948
.create-vm .list-cont .param h4 {
5949
    margin-bottom: 0px !important;
5950
    font-size: 1.1em !important; 
5951
}
5952

    
5953
.create-vm .list-cont .param {
5954
    margin-bottom: 7px !important;
5955
}
5956

    
5957
.create-vm .list-cont .value {
5958
    font-weight: bold;
5959
}
5960

    
5961
.create-vm .list-cont .param .value {
5962
    font-size: 0.9em;
5963
}
5964

    
5965
.create-vm .list-cont .param .title {
5966
    color: #387693;
5967
}
5968

    
5969
.create-vm .list-cont .image-description {
5970
    margin-left:0;
5971
}
5972

    
5973
.create-vm .list-cont .image-description .value {
5974
    font-weight: normal;
5975
    margin-left: 0 !important;
5976
}
5977

    
5978
.create-vm .list-cont .image-description .title {
5979
    display: none;
5980
    font-size: 0.8em;
5981
}
5982

    
5983
.create-vm .list-cont.meta .values span {
5984
    display:block;
5985
    float: left;
5986
    margin-right: 4px;
5987
    border: 1px solid #eee;
5988
    padding:3px;
5989
    margin-bottom: 4px;
5990
    font-size: 0.9em;
5991
}
5992

    
5993
.create-vm .list-cont.meta .key {
5994
    font-weight: bold;
5995
    font-size: 0.9em;
5996
    display: block;
5997
    margin-bottom: 5px;
5998
}
5999

    
6000
.create-vm .meta input {
6001
    font-size: 0.8em;
6002
}
6003

    
6004
.vm-connect .connect-cont {
6005
    margin-bottom: 20px;
6006
    border-bottom: 1px solid #A1C8DB;
6007
    padding-bottom: 20px;
6008
}
6009

    
6010
.vm-connect .connection-info {
6011
    padding-bottom: 0px;
6012
    margin-bottom: 0;
6013
    border-bottom: none;
6014
}
6015

    
6016
.vm-connect .connection-info .connect a {
6017
    color: #fff;
6018
}
6019

    
6020
.vm-connect .connection-info .connect {
6021
    background-color: #387693;
6022
    color: #fff;
6023
    padding: 10px;
6024
    font-size: 1.2em;
6025
    text-align: center;
6026
}
6027

    
6028
.clip-copy {
6029
    display: block;
6030
    width: 20px;
6031
    height: 20px;
6032
    position: absolute;
6033
    border: 1px solid #387693;
6034
    background-image: url("../images/clipboard.png");
6035
    background-repeat: no-repeat;
6036
    background-position: center;
6037
    cursor: pointer;
6038
    background-color: #A1C8DB;
6039
}
6040

    
6041
.password-cont .clip-copy { right: 10px; top: 8px;}
6042

    
6043

    
6044
.overlay-invitations {
6045
    width: 680px;
6046
}
6047
.invitations-form .sending .sending-msg {
6048
    font-size: 0.8em;
6049
    display: block !important;
6050
    margin-bottom: 5px;
6051
    color: #008800;
6052
}
6053

    
6054
.invitations-form .send-error {
6055
    font-size: 0.8em;
6056
    margin-bottom: 5px;
6057
    margin-top: 5px;
6058
    color: #800;
6059
    padding: 3px;
6060
    padding-left: 0;
6061
    display: none;
6062
}
6063

    
6064
.invitations-form .error label {
6065
    color: #000 !important;
6066
}
6067

    
6068
.invitations-form .form-field {
6069
    width: 49%;
6070
    float: left;
6071
}
6072

    
6073
.invitations-view .left.none {
6074
    background-color: #880000;
6075
}
6076

    
6077
.invitations-form {
6078
    position: relative;
6079
}
6080

    
6081
.invitations-form h3 {
6082
    float: left;
6083
}
6084

    
6085
.invitations-form .add-new-invitation {
6086
    float:left;
6087
    top:2px;
6088
    right: 20px;
6089
    width: 16px;
6090
    height: 16px;
6091
    background-image: url("../images/option-action-add.png");
6092
    background-repeat: no-repeat;
6093
    background-position: center;
6094
    text-indent: -50000em;
6095
    background-color: #4085A5;
6096
    margin-left: 15px;
6097
    cursor: pointer;
6098
}
6099

    
6100
.invitations-view .left {
6101
    font-size: 1em;
6102
    color: #fff;
6103
    font-weight: bold;
6104
    background-color: #4085A5;
6105
    padding: 4px;
6106
}
6107

    
6108
input.has-errors {
6109
    border-color: #ff0000;
6110
}
6111

    
6112
.none-left .invitations-wrapper .invitations-list {
6113
    width: 100% !important;
6114
    border-left: none !important;
6115
    padding-left: 0;
6116
}
6117

    
6118
.invitations-wrapper .invitations-list {
6119
    width: 40%;
6120
    float: left;
6121
    padding-left: 10px;
6122
    border-left: 1px solid #4085A5;
6123
    margin-left: -1px
6124
}
6125

    
6126
.invitations-wrapper .invitations-form {
6127
    width: 57%;
6128
    float: left;
6129
    border-right: 1px solid #4085A5;
6130
}
6131

    
6132
.invitations-wrapper label span {
6133
    color: #aaa;
6134
    font-size: 0.8em;
6135
}
6136

    
6137
.invitations-wrapper label {
6138
    display: block;
6139
    font-size: 0.9em;
6140
    margin-bottom:10px;
6141
    font-weight: bold;
6142
}
6143

    
6144
.invitations-view .add-new-invitation {
6145
    cursor: pointer;
6146
}
6147

    
6148
.invitations-wrapper input.name {
6149
    width: 150px;
6150
}
6151

    
6152
.invitations-wrapper input {
6153
    font-size: 0.9em;
6154
    width: 155px;
6155
    padding:4px;
6156
}
6157

    
6158
.invitations-list .invitation-sent {
6159
    border-bottom: 1px solid #A1C8DB;
6160
    padding-bottom: 5px;
6161
    margin-bottom: 5px;
6162
    position: relative;
6163
}
6164

    
6165
.invitations-view h3 {
6166
    margin-bottom: 10px;
6167
    color: #4085A5;
6168
}
6169

    
6170
.invitations-list .invitation-sent.last,
6171
.invitations-list .invitation-sent:last-child {
6172
    border-bottom: none;
6173
}
6174

    
6175

    
6176
.invitations-list .invitation-sent .email {
6177
    color: #D98147;
6178
    font-size: 0.8em;
6179
    font-weight: bold;
6180
    margin-top: 2px;
6181
}
6182

    
6183
.invitations-list .pagination a,
6184
.invitations-list .pagination span {
6185
    padding: 0.2em 0.3em;
6186
}
6187

    
6188
.invitations-list .pagination {
6189
    font-size: 0.75em;
6190
}
6191

    
6192
.invitations-list .name {
6193
    color: #444;
6194
    font-size: 0.9em;
6195
}
6196

    
6197
.invitations-list .status.sending {
6198
    background-image: url("../images/icons/indicators/small/progress.gif");
6199
}
6200

    
6201
.invitations-list .status.sent {
6202
    background-image: url("../images/invitation_accepted.png");
6203
}
6204

    
6205
.invitations-list .status.resend {
6206
    background-image: url("../images/resend.png");
6207
}
6208

    
6209
.invitations-list .status.resend {
6210
    cursor: pointer;
6211
}
6212

    
6213
.invitations-list .status {
6214
    width: 20px;
6215
    height: 15px;
6216
    position: absolute;
6217
    top:5px;
6218
    right: 2px;
6219
    background-repeat: no-repeat;
6220
    background-position: center;
6221
}
6222

    
6223
.invitations-form .form-entry:last-child {
6224
    border-bottom: none;
6225
}
6226

    
6227
.invitations-form .form-entry {
6228
    position: relative;
6229
    margin-bottom: 10px;
6230
    padding-bottom: 10px;
6231
    border-bottom: 1px solid #ddd;
6232
    margin-right: 10px;
6233
}
6234

    
6235
.invitations-form .send-invitations {
6236
    float: left;
6237
    padding: 5px;
6238
    color: #fff;
6239
    margin-right: 10px;
6240
    margin-top: 10px;
6241
}
6242

    
6243
.invitations-form .form-entry.error {
6244
    padding-bottom: 0px;
6245
}
6246

    
6247
.invitations-form .form-entry.error .remove-invitation {
6248
    bottom: 32px;
6249
}
6250

    
6251
.invitations-form .remove-invitation {
6252
    padding: 5px;
6253
    background-image: url("../images/option-action-remove.png");
6254
    background-position: center;
6255
    background-repeat: no-repeat;
6256
    color: #fff;
6257
    width: 15px;
6258
    height: 15px;
6259
    cursor: pointer;
6260
    text-indent: -50000px;
6261
    position: absolute;
6262
    right: -10px;
6263
    bottom: 14px;
6264
}
6265

    
6266
.invitations-list .resent-info,
6267
.invitations-form .top-info {
6268
    font-size: 0.8em;
6269
    margin-bottom: 10px;
6270
}
6271

    
6272
.invitations-list .msg .email,
6273
.invitations-form .success .msg .email {
6274
    font-weight: bold;
6275
}
6276

    
6277
.invitations-list .msg.err-msg,
6278
.invitations-list .success.msg,
6279
.invitations-form .success .msg {
6280
    background-color: #080;
6281
    color: white;
6282
    padding: 5px;
6283
    margin-right: 10px;
6284
    margin-bottom: 5px;
6285
}
6286
.invitations-list .msg.err-msg,
6287
.invitations-list .success.msg {
6288
    margin-right: 0px;
6289
}
6290
.invitations-list .msg.err-msg {
6291
    background-color: #800;
6292
}
6293

    
6294
.overlay .models-view .previous-view-link {
6295
    margin: -10px;
6296
    margin-bottom:10px;
6297
    padding: 10px 5px;
6298
    background-image: url("../images/left-arrow.png");
6299
    background-repeat: no-repeat;
6300
    background-position: 10px center;
6301
    padding-left: 20px;
6302
    background-color: #93D070;
6303
    cursor: pointer;
6304
    border-bottom: 1px solid #eee;
6305
    text-decoration: underline;
6306
}
6307
.models-view .quick-add {
6308
    text-decoration: underline; 
6309
    color: #4085A5;
6310
    cursor: pointer;
6311
}
6312

    
6313
.empty .items-list {
6314
    margin-top: 0 !important;
6315
}
6316

    
6317
.models-view .items-empty-msg {
6318
    border-top: 1px solid #aaa;
6319
    padding-top: 10px;
6320
    font-size: 1em;
6321
    margin-top:0 !important;
6322
}
6323

    
6324
.models-view .items-empty-msg,
6325
.models-view .model-description {
6326
    color: #444;
6327
    margin: 10px 0;
6328
}
6329

    
6330
.models-view .model-list .collection-action.disabled {
6331
    background-color: #aaa;
6332
    border-color: #aaa;
6333
    cursor: default;
6334
}
6335
.models-view .model-list .collection-action.disabled:hover {
6336
    background-color: #aaa;
6337
    border-color: #aaa;
6338
}
6339

    
6340
.models-view .model-list .collection-action:hover {
6341
    background-color: #aaa;
6342
}
6343

    
6344
.models-view .model-list .collection-action:hover {
6345
    background-color: #F95;
6346
    border-color: #F95;
6347
}
6348

    
6349
.models-view .model-list .collection-action.in-progress {
6350
    background-color: #aaa;
6351
    color: #fff;
6352
    border-color: #aaa;
6353
    background-image: url("../images/icons/indicators/small/progress.gif") !important;
6354
}
6355

    
6356
.models-view .model-list .collection-action.add-generate {
6357
    background-image: url("../images/option-action-generate-ssh.png");
6358
}
6359

    
6360
.models-view .model-list .collection-action.add {
6361
    background-image: url("../images/option-action-add.png");
6362
    padding-right: 20px !important;
6363
}
6364

    
6365
.models-view .model-list .collection-action {
6366
    float: right;
6367
    background-color: #FF7F2A;
6368
    color: #fff;
6369
    padding: 6px 8px;
6370
    margin-left: 10px;
6371
    cursor: pointer;
6372
    padding-right: 30px;
6373
    background-position: right center;
6374
    background-repeat: no-repeat;
6375
    background-clip: border-box;
6376
    border-right: 5px solid #FF7F2A;
6377
}
6378

    
6379
.models-view .items-list {
6380
    margin-top: 10px;
6381
}
6382

    
6383
.models-view .model-list ul li.model-item:last-child {
6384
    margin-bottom: 0;
6385
}
6386

    
6387
.models-view .model-list ul li.model-item {
6388
    background-color: #D4E2E8;
6389
    margin-bottom: 5px;
6390
    position: relative;
6391
}
6392

    
6393
.models-view .model-list ul li.model-item .param {
6394
    float: left;
6395
    padding: 6px;
6396
}
6397

    
6398
.models-view .model-list ul li.model-item .item-action.confirm-remove {
6399
    margin-right: -15px !important;
6400
}
6401

    
6402
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover .cancel {
6403
    color: inherit !important;
6404
}
6405

    
6406
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover {
6407
    background-color: #F95;
6408
    color: inherit !important;
6409
}
6410

    
6411
.models-view .model-list ul li.model-item .item-action.confirm-remove span.cancel {
6412
    padding: 6px !important;
6413
}
6414

    
6415
.models-view .model-list ul li.model-item .item-action.confirm-remove span {
6416
    display: block;
6417
    float: left;
6418
    padding: 6px 15px;
6419
}
6420

    
6421
.models-view .model-list ul li.model-item .item-action .cancel-remove:hover {
6422
    color: #fff !important;
6423
}
6424

    
6425
.models-view .model-list ul li.model-item .item-action.confirm-remove,
6426
.models-view .model-list ul li.model-item .item-action .do-confirm,
6427
.models-view .model-list ul li.model-item .item-action .cancel-remove {
6428
    display:none !important;
6429
    background-color: #D95D0A;
6430
    padding:0;
6431
    margin:0;
6432
}
6433

    
6434
.models-view .model-list ul li.model-item.pending-delete .item-action.remove {
6435
    display: none;
6436
}
6437

    
6438
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel {
6439
    background-color: #F95;
6440
}
6441

    
6442
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm {
6443
    background-color: #FF7F2A;
6444
}
6445

    
6446
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove,
6447
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove .do-confirm,
6448
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel-remove {
6449
    display:block !important;
6450
}
6451

    
6452
.models-view .model-list ul li.model-item.pending-delete .item-action {
6453
    display: block;
6454
}
6455

    
6456
.models-view .model-list ul li.model-item.expanded .item-action,
6457
.models-view .model-list ul li.model-item:hover .item-action {
6458
    display: block;
6459
}
6460

    
6461
.models-view .model-list ul li.model-item .item-action.hide {
6462
    background-image: url("../images/minus-8.png");
6463
}
6464
.models-view .model-list ul li.model-item .item-action.show:hover {
6465
    background-image: url("../images/plus-8.png");
6466
}
6467

    
6468
.models-view .model-list ul li.model-item .item-action.show {
6469
    background-image: url("../images/plus-8-dark.png");
6470
}
6471

    
6472
.models-view .model-list ul li.model-item .item-action.remove {
6473
    background-image: url("../images/option-action-remove.png");
6474
}
6475

    
6476
.models-view .model-list ul li.model-item .item-action.edit:hover {
6477
    background-image: url("../images/option-action-edit-light.png");
6478
}
6479

    
6480
.models-view .model-list ul li.model-item .item-action.edit {
6481
    background-image: url("../images/option-action-edit.png");
6482
}
6483
.models-view .model-list ul li.model-item .item-action.remove:hover {
6484
    background-color: #880000 !important;
6485
    border-color: #800 !important;
6486
}
6487

    
6488
.models-view .model-list ul li.model-item.expanded .item-action.show,
6489
.models-view .model-list ul li.model-item.expanded .item-action.hide,
6490
.models-view .model-list ul li .item-actions .item-action:hover {
6491
    background-color: #4085A5;
6492
    color: #fff;
6493
    border-color: #4085A5;
6494
}
6495

    
6496
.models-view .model-list ul li .item-actions {
6497
    position: absolute;
6498
    right: -10px;
6499
    top: 0px;
6500
}
6501

    
6502
.models-view .model-list ul li .item-actions .item-action {
6503
    float: right;
6504
    padding: 6px;
6505
    margin-right: 10px;
6506
    display: none;
6507
    cursor: pointer;
6508
    padding-right: 20px;
6509
    background-repeat: no-repeat;
6510
    background-position: right center;
6511
    border-right: 5px solid transparent;
6512
}
6513

    
6514
.models-view .model-list h3 {
6515
    float: left;
6516
}
6517

    
6518
.models-view h3 {
6519
    font-size: 1.2em;
6520
    margin-bottom: 1em;
6521
    margin-top: 5px;
6522
    color: #4085A5;
6523
}
6524

    
6525
.models-view .form-actions {
6526
    font-size: 1.1em;
6527
}
6528

    
6529
.models-view .model-list ul li,
6530
.models-view .model-list ul {
6531
    list-style: none;
6532
}
6533

    
6534
.models-view .model-list ul li.header {
6535
    display: none;
6536
}
6537

    
6538
.models-view .model-form textarea {
6539
    width: 99%;
6540
    height: 100px;
6541
    border: 1px solid #aaa;
6542
}
6543

    
6544

    
6545
.models-view .model-form .form-field {
6546
    margin-bottom: 10px;
6547
}
6548

    
6549
.models-view .model-form label {
6550
    display: block;
6551
    color: #406A7D;
6552
    font-size: 1.1em;
6553
    margin: 0px 0 5px 0;
6554
}
6555

    
6556
.models-view .model-form .inline label {
6557
    float: left;
6558
    margin-right: 10px;
6559
    margin-top: 10px !important;
6560
}
6561

    
6562
.models-view .model-form input.long {
6563
    width: 400px;
6564
}
6565

    
6566
.models-view .model-form .inline input {
6567
    width: auto;
6568
    margin-top: 10px;
6569
}
6570

    
6571
.models-view .model-form .inline select {
6572
    width: auto;
6573
    margin-top: 7px;
6574
}
6575

    
6576
.models-view .model-form .inline .errors,
6577
.models-view .model-form .inline .field-desc {
6578
    clear: both;
6579
}
6580

    
6581
#user_public_keys .private-download {
6582
    margin: 5px 0;
6583
    margin-top: 6px;
6584
}
6585

    
6586
#user_public_keys .private-cont form {
6587
    float: left;
6588
    margin-left: 5px;
6589
}
6590

    
6591
#user_public_keys input.form-text:hover {
6592
    background: #F95;
6593
}
6594

    
6595
#user_public_keys input.form-text {
6596
    background: #FF7F2A;
6597
    color: #fff;
6598
    border: 1px solid #F95;
6599
    padding: 0 5px;
6600
    margin: 0 5px;
6601
    margin-top: -1px;
6602
    cursor: pointer;
6603
}
6604

    
6605
#user_public_keys .form-text {
6606
    float: left;
6607
}
6608

    
6609
#user_custom_images,
6610
#user_public_keys {
6611
    font-size: 0.7em;
6612
}
6613

    
6614
#user_public_keys .download-button {
6615
    width: 30px;
6616
    height: 30px;
6617
}
6618

    
6619

    
6620
#user_public_keys #model-item-tpl {
6621
    display: none;
6622
}
6623
#user_public_keys .model-item .name {
6624
    color: #4085A5;
6625
    font-size: 1.2em;
6626
}
6627

    
6628
#user_public_keys .model-item .fingerprint .flabel {
6629
    color: #888;
6630
    float: left;
6631
    margin-right: 5px;
6632
}
6633

    
6634
#user_public_keys .model-item .fingerprint {
6635
    float: none;
6636
    clear: both;
6637
    color: #444;
6638
    font-family: monospace;
6639
    letter-spacing: 1px;
6640
    padding: 4px;
6641
    font-size: 0.9em;
6642
    border-top: 1px solid #fff;
6643
}
6644

    
6645
#user_public_keys .model-item .publicid {
6646
    display: none;
6647
}
6648

    
6649
#user_public_keys .model-item.expanded .publicid .param-content {
6650
    padding: 5px 5px;
6651
    overflow: auto;
6652
    background-color: #FFF;
6653
    border: 1px solid #4085A5;
6654
    border-left: none;
6655
    border-right: none;
6656
    font-size: 1.1em;
6657
}
6658

    
6659
#user_public_keys .model-item.expanded .publicid .param-content textarea {
6660
    width: 100%;
6661
    height: 90px;
6662
    margin:0;
6663
    padding:0;
6664
    border:none;
6665
    overflow: auto;
6666
}
6667

    
6668
#user_public_keys .model-item.expanded .publicid {
6669
    display: block;
6670
    background-color: #fff;
6671
    width: 100%;
6672
    margin-top: 0px;
6673
    margin-left: 0px;
6674
    color: #fff;
6675
    padding:0 !important;
6676
}
6677

    
6678
.models-view .form-messages {
6679
    margin-bottom: 10px;
6680
}
6681

    
6682
.models-view .list-messages {
6683
    margin-top: 10px;
6684
}
6685

    
6686
.models-view .form-messages .error,
6687
.models-view .form-messages .success,
6688
.models-view .list-messages .error,
6689
.models-view .list-messages .success,
6690
#user_public_keys .private-cont {
6691
    background-color: #AADE87;
6692
    color: #447821;
6693
    padding: 5px;
6694
    border: 1px solid #447821;
6695
    font-size: 1.1em;
6696
    margin-top: 5px;
6697
}
6698

    
6699
.models-view .form-messages .error,
6700
.models-view .list-messages .error {
6701
    background-color: #DE8D87;
6702
    color:  #782421 !important;
6703
    border-color: #782421;
6704
}
6705

    
6706
#user_public_keys .limit-msg {
6707
    color: #800;
6708
    position: absolute;
6709
    right: 20px;
6710
    top: 25px;
6711
}
6712

    
6713
#user_public_keys .private-cont {
6714
    margin-top: 10px;
6715
}
6716

    
6717
#user_public_keys .private-cont .private-msg {
6718
    float: left;
6719
    padding:5px;
6720
    margin-top: 5px;
6721
}
6722

    
6723
#user_public_keys .private-cont textarea {
6724
    margin: 5px;
6725
    width: 97%;
6726
    height: 200px;
6727
}
6728

    
6729
#user_public_keys .private-cont .close-private:hover {
6730
    color: #Fff;
6731
}
6732

    
6733
#user_public_keys .private-cont .close-private {
6734
    float: right;
6735
    margin-right: 5px;
6736
    font-weight: bold;
6737
    cursor: pointer;
6738
    text-decoration: underline;
6739
}
6740

    
6741
#user_public_keys .model-item .key-type {
6742
    background-color: #72ADC8;
6743
    color: #fff;
6744
    text-align: center;
6745
    font-size: 0.9em;
6746
    padding:2px 10px;
6747
    margin: 4px 6px;
6748
    margin-top: 7px;
6749
    font-weight: bold;
6750
}
6751

    
6752
#user_public_keys .private-cont .down-button {
6753
}
6754

    
6755
.models-view .form-field .field-desc {
6756
    font-style: italic;
6757
    font-size: 1em;
6758
    color: #888;
6759
}
6760

    
6761
.models-view .form-field.error label {
6762
    font-weight: bold;
6763
    color: #800 !important;
6764
}
6765

    
6766
.models-view .form-field .errors {
6767
    margin: 5px 0;
6768
}
6769

    
6770
.models-view .form-field .errors .error {
6771
    background-color: transparent;
6772
    border: none;
6773
    color: #800;
6774
}