Statistics
| Branch: | Tag: | Revision:

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

History | View | Annotate | Download (122.9 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
    height: 20px;
2091
    background: url("../images/down-arrow-light.png") no-repeat right;
2092
    background-position: right 6px;
2093
    font-weight: normal;
2094
}
2095

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

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

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

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

    
2115
div#user .useractions {
2116
    display: none;
2117
}
2118

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

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

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

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

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

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

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

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

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

    
2183
#disks.separator {
2184
    background-color: #dea842;
2185
}
2186

    
2187
#networks.separator {
2188
    background-color: #6c535d;
2189
}
2190

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

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

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

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

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

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

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

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

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

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

    
2255

    
2256
.namecontainer .name {
2257
    position: relative;
2258
}
2259

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

    
2264
.icon .nametextbox {
2265
    width: 255px;
2266
}
2267

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

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

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

    
2291
.list .large-spinner {
2292
    margin-top:-30px;
2293
}
2294

    
2295
.single .large-spinner {
2296
    margin-top: 50px;
2297
}
2298

    
2299
div#networks-container {
2300
    display: none;
2301
}
2302

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

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

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

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

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

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

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

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

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

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

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

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

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

    
2388
ul.dropdown-selector li {
2389
    padding: 4px;
2390
}
2391

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

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

    
2401
div.list table span.imagetag {
2402
    display: none;
2403
}
2404

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

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

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

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

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

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

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

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

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

    
2449
.action-indicator {
2450
    margin-right: 18px;
2451
}
2452

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

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

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

    
2471
.hidden {
2472
    display:none;
2473
}
2474

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

    
2479
.action_error .message, .action_error .code {
2480
    display: none;
2481
}
2482

    
2483
.fixed {
2484
    bottom: 0;
2485
    position: fixed !important;
2486
}
2487

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

    
2494
#networkscreate {
2495
}
2496

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

    
2507
#networkscreate:hover {
2508
    background-color: #FF9955;
2509
}
2510

    
2511
#createcontainer {
2512
}
2513

    
2514
#networks-container {
2515
}
2516

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

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

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

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

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

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

    
2549
#public-template, #private-template, #public-machine-template, #private-machine-template {
2550
    display:none;
2551
}
2552

    
2553
div.network a.action-network-add {
2554
    display: none;
2555
}
2556

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

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

    
2570
#private-template {
2571
    margin: 2px 0 0 -30px;
2572
}
2573

    
2574
div.network-placeholder {
2575
    margin-left: 33px;
2576
}
2577

    
2578
div.private-networks div.network-placeholder {
2579
}
2580

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

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

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

    
2600
.last div.network-cable {
2601
    height:85px;
2602
}
2603

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

    
2612
.last div.firewall-cable {
2613
    display:none;
2614
}
2615

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

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

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

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

    
2636
div.firewall .firewall-options {
2637
    float: left;
2638
}
2639

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

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

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

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

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

    
2664
.state {
2665
}
2666

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

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

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

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

    
2701

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

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

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

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

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

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

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

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

    
2755
div.network div.display a {
2756
    visibility: visible;
2757
}
2758

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

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

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

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

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

    
2784
.network-logos:hover {
2785
    cursor: pointer;
2786
}
2787

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

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

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

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

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

    
2815
#private-networks {
2816
    margin-top: 20px;
2817
}
2818

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

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

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

    
2833
.private-networks .state {
2834
}
2835

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

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

    
2851
span.rename-network {
2852
    cursor: pointer;
2853
}
2854

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

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

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

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

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

    
2893
.network-machine .state div {
2894
    text-align: left;
2895
}
2896

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

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

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

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

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

    
2934
.network-machine .state {
2935
    margin-right: 18px;
2936
}
2937

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

    
2942
.machine-name .name {
2943
}
2944

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

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

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

    
2960
div.empty-network-slot {
2961
    height: 60px;
2962
}
2963

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

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

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

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

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

    
2995
.firewall-on {
2996
    color: #42E342;
2997
}
2998

    
2999
.firewall-off {
3000
    color: #F82E2E;
3001
}
3002

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

    
3010
.firewall-content .checkbox-legends {
3011
    cursor: pointer;
3012
}
3013

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

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

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

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

    
3033
.machine-connect span {
3034
    text-decoration: underline;
3035
}
3036

    
3037
h5.machine-connect span:hover {
3038
    cursor: pointer;
3039
}
3040

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
3165
.vm-stats div.stat-error {
3166
    display:none;
3167
}
3168

    
3169
div.stat-error {
3170
    color: #f00;
3171
}
3172

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

    
3178
.metadata-column {
3179
    margin-top: 4px;
3180
}
3181

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

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

    
3192
.vm-details .image-details {
3193
    margin-top: 8px;
3194
}
3195

    
3196
.vm-details .vm-detail {
3197
    display: block;
3198
}
3199

    
3200
.vm-details span.value {
3201
    color: #444;
3202
}
3203

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

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

    
3215
.metadata-left {
3216
}
3217

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
3300
.scrollable .items {
3301
    position:absolute;
3302
    height:20000em;
3303
}
3304

    
3305
/* single view */
3306
.single {
3307
    color: #383838;
3308
}
3309

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

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

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

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

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

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

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

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

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

    
3358
.single .vm-actions .action-container.destroy .confirm_single {
3359
}
3360

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

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

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

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

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

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

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

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

    
3399
.single .wave {
3400
    margin: 15px 53px 0 0px !important
3401
}
3402

    
3403
.icon div.action_error {
3404
    font-size: 100%;
3405
}
3406

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
3626
.single div.lower img.stats {
3627
    display: none;
3628
}
3629

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

    
3640
.single .single-image-state1 {
3641
    background-position: 0px 0;
3642
}
3643

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

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

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

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

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

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

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

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

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

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

    
3706
#wrapper.console {
3707
    width: auto;
3708
}
3709

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

    
3718
applet {
3719
    width:100%;
3720
    height:100%;
3721
}
3722

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

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

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

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

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

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

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

    
3765
.red {
3766
    color: red;
3767
}
3768

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

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

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

    
3785
.last .firewall-content {
3786
}
3787

    
3788
#pub .last .network-separator {
3789
    display:none;
3790
}
3791

    
3792
.public-networks .empty-network-slot {
3793
    display: none;
3794
}
3795

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

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

    
3812
* html .clearfix {
3813
    display: inline-block;
3814
}
3815

    
3816
.icon .cont-toggler {
3817
    margin-top: -1px;
3818
}
3819

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

    
3825
.icon .status {
3826
    margin-right: 3px;
3827
}
3828

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

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

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

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

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

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

    
3875
#add-name-container {
3876
    margin-bottom: 10px;   
3877
}
3878

    
3879
.remove-field-trigger, .add-field-trigger {
3880
    cursor: pointer;
3881
}
3882

    
3883
.add-field-trigger img {
3884
    vertical-align: middle;
3885
}
3886

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

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

    
3900
#notification-box a {
3901
    color: #4085A5;
3902
}
3903

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

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

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

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

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

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

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

    
3937
.machine-container .separator {
3938
    background-color: #B0D1E0;
3939
}
3940

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

    
3952
#creation-password-overlay {
3953
    position: relative;
3954
}
3955

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

    
3963
#creation-password-overlay .password-label {
3964
    float: left;
3965
}
3966

    
3967
#creation-password-overlay .password {
3968
    font-size: 1.3em;
3969
    font-weight: bold;
3970
    margin-right: 5em;
3971
    float: right;
3972
    margin-top: -4px;
3973
}
3974

    
3975
.feedback-form .description {
3976
    margin-bottom: 25px;
3977
}
3978

    
3979
.feedback-form label {
3980
    display: block;
3981
    font-weight: bold;
3982
    margin-bottom: 10px;
3983
    font-size: 0.8em;
3984
}
3985

    
3986
.feedback-form .form-actions {
3987
    border-top: none;
3988
}
3989

    
3990
.nospace {
3991
    padding-top: 0 !important;
3992
    padding-bottom: 0 !important;
3993
}
3994

    
3995
.noborder {
3996
    border-top: none !important;
3997
    border-bottom: none !important;
3998
}
3999

    
4000
.overlay .feedback-form .messages.description {
4001
    padding-bottom:0;
4002
    margin-bottom: 0;
4003
}
4004

    
4005
.feedback-form .messages .error-message {
4006
    color: #f00;
4007
}
4008

    
4009
.feedback-form .messages .success-message {
4010
    color: #8AA87F;
4011
}
4012

    
4013
.feedback-form .feedback-message {
4014
    width: 548px;
4015
    height: 200px;
4016
    border: 1px solid #ddd;
4017
    padding: 5px;
4018
}
4019

    
4020
#feedback-form .empty-error-msg {
4021
    display: none;
4022
}
4023

    
4024
#feedback-form .data-text {
4025
    display: none;
4026
}
4027

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

    
4032
#feedback-form label {
4033
    display: block;
4034
    font-size: 0.85em;
4035
    font-weight: bold;
4036
}
4037

    
4038
#feedback-form label.inline {
4039
    display: inline;
4040
    padding-left: 5px;
4041
}
4042

    
4043
#feedback-form p {
4044
    padding: 1em 0;
4045
    color: #444;
4046
    margin-bottom: 10px;
4047
}
4048

    
4049
#feedback-form .description {
4050
    font-style: italic;
4051
    font-size: 0.9em;
4052
    color: #888;
4053
}
4054

    
4055
#feedback-form .feedback-text {
4056
    width: 98%;
4057
    height: 100px;
4058
    margin-top: 10px;
4059
    margin-bottom: 10px;
4060
}
4061

    
4062
#feedback-form .submit-data {
4063
    display: none;
4064
}
4065

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

    
4076
#feedback .submit {
4077
    float: right;
4078
    right: 10px;
4079
    margin-top: 10px;
4080
}
4081

    
4082

    
4083
#feedback-form .submit:hover, #invform .submit:hover {
4084
    background-color: #549FC3;
4085
}
4086

    
4087
.feedback-intro {
4088
    padding-right: 15px !important;
4089
    text-align: justify;
4090
}
4091

    
4092
.popup-body .message {
4093
    padding: 20px 5px;
4094
    display: none;
4095
}
4096

    
4097
.popup-body .loading {
4098
    color: #fff;
4099
}
4100

    
4101
.popup-body .success {
4102
    color: #1F921A;
4103
}
4104

    
4105
.popup-body .errormsg {
4106
    color: #E32424;
4107
}
4108

    
4109

    
4110
.close-msg-box {
4111
    display: block;
4112
    margin-top: 10px;
4113
    cursor: pointer;
4114
    color: #4085A5;
4115
    text-decoration: underline;
4116
}
4117

    
4118

    
4119
.console .ip-version-label {
4120
    margin: 0 5px;
4121
}
4122

    
4123
.ipv6-text, .ipv4-text {
4124
    font-size: 0.9em;
4125
}
4126

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

    
4136
/*404 and 500 pages*/
4137

    
4138
.error_page {
4139
    position: relative;
4140
    top: 40px;
4141
    padding-bottom: 140px !important;
4142
}
4143

    
4144
.error_page h1 {
4145
    font-weight: normal;
4146
}
4147

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

    
4158
.error_page p.error_desc {
4159
    color: #fff;
4160
    font-size: 0.8em;
4161
}
4162

    
4163
.error_page {
4164
    padding-right: 50px !important;
4165
    padding-left: 100px !important;
4166
}
4167

    
4168
.error_page .error_content {
4169
    padding-left: 150px;
4170
    padding-top: 97px;
4171
}
4172

    
4173
.error_page .error_content .links, .info_content .links {
4174
    margin-top: 10px;
4175
    margin-left: 20px;
4176
}
4177

    
4178
.error_page .http_error .code {
4179
    letter-spacing: -10px;
4180
    font-size: 9em;
4181
}
4182

    
4183
.error_page .http_error .msg {
4184
    letter-spacing: -1px;
4185
    font-size: 2em;
4186
}
4187

    
4188
.error_page .http_error {
4189
    position: absolute;
4190
    right: 0px;
4191
    bottom: 0px;
4192
    color: #75B3D0;
4193
    line-height: 1em;
4194
}
4195

    
4196
.error_page .error_content a, .info_content .links a {
4197
    color: #4085A5;
4198
    font-weight: bold;
4199
    margin-right: 10px;
4200
    font-size: 0.9em;
4201
}
4202

    
4203
.error_body #container, .info_body #container {
4204
    background-position: right 200px;
4205
}
4206

    
4207
.info_page h1 {
4208
    color: #4085A5;
4209
    font-size: 2em;
4210
    font-weight: normal;
4211
}
4212

    
4213
.info_page p {
4214
    color: #ffffff;
4215
    margin: 1em 0;
4216
}
4217

    
4218
.info_body p a, .error_body p a{
4219
    color: #4085A5;
4220
    text-decoration: underline;
4221
}
4222

    
4223
.error_404 .http_error .code {
4224
    letter-spacing: -7px;
4225
}
4226

    
4227
.network-progress-indicator {
4228
    position: relative;
4229
    display: none;
4230
}
4231

    
4232
.network-progress-indicator img {
4233
    position: absolute;
4234
    bottom: 44px;
4235
    left: 340px;
4236
}
4237

    
4238

    
4239
.single .progress-message {
4240
    margin-top: 90px;
4241
    font-size: 0.6em;
4242
    padding: 0 10px;
4243
    text-align: center;
4244
}
4245

    
4246
/*metadata keys/values*/
4247
.items .tag-item  {
4248
    display: block;
4249
}
4250

    
4251
.single .items .tag-item .key {
4252
    width: 60px;
4253
}
4254

    
4255
.running .scrollable, .terminated .scrollable {
4256
    height: 42px;
4257
}
4258

    
4259
.items .tag-item .key {
4260
    margin-right: 5px;
4261
    width: 30px;
4262
    display: block;
4263
    float: left;
4264
    color: #000;
4265
}
4266

    
4267
.items .tag-item .value {
4268
    color: #444;
4269
}
4270

    
4271
#machinesview-list {
4272
    display: none;
4273
}
4274

    
4275
#machinesview-single {
4276
    position: relative;
4277
    display: none;
4278
}
4279

    
4280
#machinesview-icon {
4281
    display: none;
4282
}
4283

    
4284
#machinesview-icon, #machinesview-single, #machinesview-list {
4285
    
4286
}
4287

    
4288
tbody.machines .spinner {
4289
    margin-top: 0!important;
4290
    margin: 0 !important;
4291
    float: none !important;
4292
}
4293

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

    
4305
.slider .slider-point-light {
4306
    background-color: transparent;
4307
}
4308

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

    
4321
.slider .handle {
4322
    z-index: 50;
4323
}
4324

    
4325
.modal p.desc {
4326
    margin: 5px 0;
4327
    margin-left: 37px;
4328
    font-size: 0.8em;
4329
    color: #888;
4330
}
4331

    
4332
.api_overlay_template {
4333
    display: none;
4334
}
4335

    
4336
.api_content .password-container .password {
4337
    color: #fff;
4338
    font-size: 1.1em;
4339
}
4340

    
4341
#disks-pane {
4342
    margin-top: 58px;
4343
}
4344

    
4345
span.resend-msg {
4346
    display: block;
4347
    margin-bottom: 5px;
4348
}
4349

    
4350
.success-msg {
4351
    background-color: #5CAD54;
4352
    color: #fff;
4353
    padding: 0.4em;
4354
    border: 1px solid #ddd;
4355
}
4356

    
4357
.error-msg {
4358
    background-color: #800000;
4359
    color: #fff;
4360
    padding: 0.4em;
4361
    border: 1px solid #ddd;
4362
}
4363

    
4364
.success-msg em, .error-msg em {
4365
    font-weight: bold;
4366
    font-style: normal;
4367
    font-size: 0.9em;
4368
}
4369

    
4370
.pagination {
4371
            font-size: 80%;
4372
        }
4373
        
4374
.pagination a {
4375
    text-decoration: none;
4376
        border: solid 1px #AAE;
4377
        color: #15B;
4378
}
4379

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

    
4390
.pagination .current {
4391
    background: #4085A5;
4392
    color: #fff;
4393
        border: solid 1px #AAE;
4394
}
4395

    
4396
.pagination .current.prev, .pagination .current.next{
4397
        color:#999;
4398
        border-color:#999;
4399
        background:#fff;
4400
}
4401

    
4402
table.list-machines .wave {
4403
    float: none !important;
4404
    margin: 0 !important;
4405
}
4406

    
4407
.overlay {
4408
    display: none;
4409
}
4410

    
4411
.overlay .copy-content .clip-copy  {
4412
    right: 10px;
4413
    top:8px;
4414
    border: 1px solid #fff;
4415
}
4416

    
4417
.overlay .copy-content {
4418
    background-color: #387693;
4419
    color: #fff;
4420
    padding: 10px;
4421
    font-size: 1.2em;
4422
    text-align: center;
4423
    position: relative;
4424
}
4425

    
4426
.overlay {
4427
    background-color: #fff;
4428
    border: 2px solid #444;
4429
    text-align: left;
4430

    
4431
    -moz-box-shadow: 0 0 90px 5px #000;
4432
    -webkit-box-shadow: 0 0 90px 5px #000;
4433
    box-shadow: 0 0 90px 5px #000;
4434
    width: 600px;
4435
}
4436

    
4437
.overlay a {
4438
    color: #387693;
4439
}
4440

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

    
4452
.overlay .overlay-content .important {
4453
    color: #800000;
4454
}
4455

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

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

    
4477
.overlay h3.overlay-header .title {
4478
    float: left;
4479
}
4480

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

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

    
4500
.overlay .message {
4501
}
4502

    
4503
.overlay .actions {
4504
    position: absolute;
4505
    right: 0.75em;
4506
    top: 0.6em;
4507
}
4508

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

    
4520
.overlay-error .error-more-details {
4521
    margin-top: 5px;
4522
    max-height: 210px;
4523
    overflow: auto;
4524
}
4525

    
4526
.overlay-error .key.details.expand {
4527
    background-image: url("../images/plus-8.png");
4528
}
4529

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

    
4538
.overlay-error .container {
4539
    padding-top: 1.9em;
4540
}
4541

    
4542
.overlay-error .error-details {
4543
    font-size: 0.8em;
4544
    margin-top: 10px;
4545
}
4546

    
4547
.overlay-error .error-details anonymous {
4548
    display: block;
4549
    margin-top: 10px;
4550
}
4551

    
4552
.overlay-error h3.overlay-header {
4553
    background-color: #800000;
4554
    color: #fff;
4555
}
4556

    
4557
.overlay-error.non-critical h3.overlay-header {
4558
    background-color: #987249;
4559
}
4560

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

    
4572
.overlay-error .indicator {
4573
    background-color: #880000;
4574
    color: #fff;
4575
    padding: 4px;
4576
    display: block;
4577
    float: left;
4578
    border: 1px solid #444;
4579
}
4580

    
4581
.overlay-error .nav-btn:hover {
4582
    
4583
}
4584

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

    
4595
.overlay-error .error-nav {
4596
    position: absolute;
4597
    right: 0px;
4598
    bottom: -25px;
4599
    font-size: 0.8em;
4600
}
4601

    
4602
.overlay-error span.value, .overlay-error div.value {
4603
    padding: 0.4em;
4604
    display: block;
4605
    margin-bottom: 0.3em;
4606
}
4607

    
4608
.overlay h3 .closeme {
4609
    float: right;
4610
    font-size: 0.7em;
4611
    margin-top: 0.2em;
4612
    cursor: pointer;
4613
}
4614

    
4615
.overlay .overlay-header .subtitle {
4616
    display: block;
4617
    font-size: 0.8em;
4618
    color: #ddd;
4619
}
4620

    
4621
.overlay .overlay-header .subtitle img {
4622
    vertical-align: middle;
4623
    margin-left: 10px;
4624
    margin-bottom: 2px;
4625
}
4626

    
4627
.overlay-info .content {
4628
    background-repeat: no-repeat;
4629
    background-position: 110% 110%;
4630
    background-color: rgba(255,255,255,0.6)
4631
}
4632

    
4633
.overlay-info .overlay-header {
4634
    background-color: #4085A5;
4635
}
4636

    
4637
.overlay-info .overlay-header .title {
4638
    color: #fff;
4639
}
4640

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

    
4645
#loading-view {
4646
    width: 600px;
4647
    margin: 0 auto;
4648
    padding: 20px 0;
4649
    font-size: 0.8em;
4650
}
4651

    
4652
#loading-view .header span {
4653
    font-weight: bold;
4654
    color: #4085A5;
4655
}
4656

    
4657
#loading-view .info {
4658
    color: #ddd;
4659
}
4660

    
4661
.options-list {
4662
    margin-top: 0.5em;
4663
    font-size: 0.8em;
4664
}
4665

    
4666
.options-list.five li {
4667
    float: left;
4668
    display: block;
4669
    width: 20%;
4670
    margin-bottom: 5px;
4671
}
4672

    
4673
.options-list.five li:nth-child(5n) .options-object-cont {
4674
    margin-right: 0;
4675
}
4676

    
4677
.options-object-cont input {
4678
    border: 1px solid #aaa;
4679
    width: 92px;
4680
    padding: 0;
4681
    margin: 0;
4682
    margin-top:3px;
4683
    padding: 2px;
4684
}
4685

    
4686
.options-list.three li {
4687
    float: left;
4688
    display: block;
4689
    width: 33%;
4690
    margin-bottom: 5px;
4691
}
4692

    
4693
.meta-list .options-list li.options-object.create .options-object-cont {
4694
    background-image: url("../images/option-action-add.png");
4695
    background-repeat: no-repeat;
4696
    background-position: 90px 5px;
4697
}
4698

    
4699
.meta-list .options-list li .options-object-cont .option-action,
4700
.meta-list .options-list li.options-object.create {
4701
    cursor: pointer !important;
4702
}
4703

    
4704
.meta-list .options-list li .options-object-cont {
4705
    cursor: inherit;
4706
}
4707

    
4708
.options-list li .options-object-cont {
4709
    padding: 5px;
4710
    margin-right: 4px;
4711
    border: 1px solid #A6D1E6;
4712
    cursor: pointer;
4713
    min-height: 35px;
4714
    position: relative;
4715
}
4716

    
4717
.options-list.three li:nth-child(3n) .options-object-cont {
4718
    margin-right: 0;
4719
}
4720

    
4721
.options-list li.selected .options-object-cont {
4722
    background-color: #efefef;
4723
    border: 2px solid #4085A5;
4724
    padding: 4px;
4725
}
4726

    
4727
.options-list li.selected .options-object-cont .title {
4728
}
4729

    
4730
.options-list li.options-object .title {
4731
    display: block;
4732
    color: #FF7F2A;
4733
    margin-bottom: 2px;
4734
}
4735

    
4736
.options-list li .option-action {
4737
    display: none;
4738
    position: absolute;
4739
    background-repeat: no-repeat;
4740
}
4741

    
4742
.options-list.five li.editing {
4743
    width: 40%;
4744
}
4745

    
4746
.options-list.five li.editing .value {
4747
    display: none;
4748
}
4749

    
4750
.options-list li .remove {
4751
    background-image: url("../images/option-action-remove.png");
4752
    width:10px;
4753
    height:10px;
4754
    right:5px;
4755
    top: 5px;
4756
}
4757

    
4758
.options-list li .edit {
4759
    background-image: url("../images/option-action-edit.png");
4760
    width:10px;
4761
    height:10px;
4762
    right:5px;
4763
    bottom: 8px;
4764
}
4765

    
4766
.options-list li:hover .option-action  {
4767
    display: block;
4768
}
4769

    
4770
.options-list li.options-object .value {
4771
    color: #4085A5;
4772
    margin-top: 5px;
4773
    display: block;
4774
}
4775

    
4776
.options-list li.selected.options-object .value {
4777
}
4778

    
4779
.options-list li .options-object-cont:hover {
4780
    background-color: #fff;
4781
}
4782

    
4783
.options-list li.selected .options-object-cont:hover {
4784
    background-color: #fff;
4785
}
4786

    
4787
.options-list li img {
4788
    float: left;
4789
    margin:2px;
4790
    margin-right: 10px;
4791
    padding-bottom:10px;
4792
}
4793

    
4794
#network-vms-select-content li.options-object .value {
4795
    margin-top: 10px;
4796
    margin-left: 30px;
4797
}
4798

    
4799
#network-vms-select-content li.options-object:hover .options-object-cont,
4800
#network-vms-select-content li.options-object .options-object-cont {
4801
    background-image: url("../images/option-action-add-dark.png");
4802
    background-repeat: no-repeat;
4803
    background-position: 160px 28px;
4804
}
4805

    
4806
#network-vms-select-content li.selected:hover .options-object-cont,
4807
#network-vms-select-content li.selected .options-object-cont {
4808
    background-image: url("../images/option-action-remove.png") !important;
4809
}
4810

    
4811
#metadata-overlay-content .view .value {
4812
    margin-top: 10px;
4813
}
4814

    
4815
#metadata-overlay-content {
4816
    position: relative;
4817
}
4818

    
4819
.vm-meta .editor .predefined .predefined-meta-key:hover {
4820
    background-color: #4e8eac;
4821
    color: #fff;
4822
}
4823

    
4824
.vm-meta .editor .predefined .predefined-meta-key {
4825
    float: left;
4826
    margin-right: 5px;
4827
    padding: 4px;
4828
    display: block;
4829
    cursor: pointer;
4830
}
4831

    
4832
.vm-meta .editor .predefined {
4833
    background-color: #A6D1E6;
4834
    font-size: 0.9em;
4835
    border-top: 1px solid #ddd;
4836
}
4837

    
4838
.vm-meta .editor input {
4839
}
4840
.vm-meta .editor {
4841
    margin-bottom: 10px;
4842
}
4843

    
4844
.vm-meta .editor .form-actions .form-action {
4845
    min-width: 50px;
4846
}
4847

    
4848
.vm-meta .editor .form-field input.meta-key {
4849
    width: 90px;
4850
}
4851

    
4852
.vm-meta .form-field {
4853
    float: left;
4854
}
4855

    
4856
.vm-meta .form-actions .form-action {
4857
    float: left;
4858
    margin-right: 10px;
4859
    height: 11px;
4860
}
4861

    
4862
.vm-meta .editor .form-actions .cancel {
4863
    margin-right: 0;
4864
}
4865

    
4866
.vm-meta .editor .form-actions {
4867
    float: right;
4868
    margin:0;
4869
    padding:0;
4870
    margin-left: 15px;
4871
    margin-top: 0px;
4872
}
4873

    
4874
.vm-meta .editor {
4875
    background-color: rgba(64, 133, 165, 0.898) !important;
4876
    background-color: #649DB8;
4877
    font-size:0.9em;
4878
}
4879

    
4880
.vm-meta .meta-key-title {
4881
    font-size: 1.3em;
4882
    color: #fff;
4883
    margin-bottom: 10px;
4884
    display: none;
4885
    float: left;
4886
}
4887

    
4888
.vm-meta .editor-content {
4889
    padding: 10px;
4890
}
4891

    
4892
.vm-meta .inner-mask {
4893
    background-color: #fff;
4894
    opacity:0.6;
4895
    position: absolute;
4896
    top:0;
4897
    left:0;
4898
}
4899

    
4900
.vm-meta .editor label {
4901
    float: left;
4902
    color: #fff;
4903
    margin-right: 2px;
4904
    padding-top:4px;
4905
    font-size: 0.9em;
4906
}
4907

    
4908
.vm-meta .editor input {
4909
    border: none;
4910
    width: 170px;
4911
    margin-left: 10px;
4912
    font-size: 0.9em;
4913
    padding: 4px;
4914
}
4915

    
4916
.vm-meta li.create .options-object-cont {
4917
    background-color: #B3C9AD ;
4918
    border-color: #788774;
4919
}
4920
.vm-meta li.create .options-object-cont .value,
4921
.vm-meta li.create .options-object-cont .title {
4922
    color: #fff;
4923
}
4924

    
4925
#createvm-overlay-content {
4926
    padding: 0;
4927
}
4928

    
4929
.overlay-createvm .container {
4930
    width: 584px !important;
4931
}
4932

    
4933
.create-vm .header-step.current {
4934
    font-weight: bold;
4935
}
4936

    
4937
.create-vm .create-step-cont {
4938
    min-height: 240px;
4939
}
4940
.create-vm .create-controls {
4941
    padding: 10px;
4942
}
4943

    
4944
.create-vm ul li {
4945
    cursor: pointer;
4946
    padding: 4px;
4947
}
4948

    
4949
.create-vm ul li.selected {
4950
    background-color: #aaa;
4951
}
4952

    
4953
.cont-toggler {
4954
    background-image: url("../images/down-arrow.png");
4955
    background-position: right;
4956
    background-repeat: no-repeat;
4957
    background-color: #A1C8DB;
4958
    display: inline-block;
4959
    border-right: 6px solid #A1C8DB;
4960
    padding:2px;
4961
    padding-right: 14px;
4962
    padding-left:0;
4963
    cursor: pointer;
4964
    color: #fff;
4965
    font-size: 0.9em;
4966
}
4967

    
4968
.cont-toggler .label {
4969
    background-color: #98BDCF;
4970
    padding: 2px;
4971
    padding-left: 5px;
4972
    padding-right: 5px;
4973
}
4974

    
4975
.cont-toggler.open {
4976
    background-color: #98BDCF;
4977
    border-color: #98BDCF;
4978
    background-image: url("../images/up-arrow.png");
4979
}
4980

    
4981
.cont-toggler.open .label {
4982
    background-color: #4085A5;
4983
}
4984

    
4985
.overlay .form label {
4986
    font-color: #444;
4987
    margin-right: 10px;
4988
}
4989

    
4990
.form-field.error label {
4991
    color: #ff0000;
4992
    text-decoration: underline;
4993
}
4994

    
4995
.form-field input {
4996
    border: 1px solid #aaa;
4997
    width: 200px;
4998
    padding: 3px;
4999
}
5000

    
5001
.form-actions {
5002
    margin-top: 5px;
5003
    padding-top:5px;
5004
    border-top: 1px solid #64a6c4;
5005
    font-size: 0.8em;
5006
}
5007

    
5008
.form-actions.plain {
5009
    margin-top: 0px;
5010
    padding-top:0px;
5011
    border-top: 0px;
5012
}
5013

    
5014
.form-action {
5015
    float: right;
5016
    min-width: 140px;
5017
    background-color: #FF7F2A;
5018
    border: 1px solid #FF7F2A;
5019
    text-align: center;
5020
    color: #FFFFFF;
5021
    cursor: pointer;
5022
    padding: 4px;
5023
}
5024

    
5025
.form-action:hover {
5026
    background-color: #FF9955;
5027
    color: #FFF;
5028
}
5029

    
5030
.form-action.prev,
5031
.form-action.cancel {
5032
    background-color: #800;
5033
    border: 1px solid #800;
5034
    float: left;
5035
}
5036

    
5037
.form-action.prev:hover,
5038
.form-action.cancel:hover {
5039
    background-color: #CC0000;
5040
    color: #fff;
5041
}
5042

    
5043
.form-action.next,
5044
.form-action.ok {
5045
    background-color: #080;
5046
    border: 1px solid #080;
5047
}
5048

    
5049
.form-action.next:hover,
5050
.form-action.ok:hover {
5051
    background-color: #00aa00;
5052
    color: #fff;
5053
}
5054

    
5055
.form-action .create,
5056
.form-action .submit {
5057

    
5058
}
5059

    
5060
.form-action.in-progress, button.in-progress {
5061
    background-image: url("../images/icons/indicators/medium/horizontal-progress.gif");
5062
    background-repeat: no-repeat;
5063
    background-position: center center;
5064
    color: transparent;
5065
}
5066

    
5067
#createvm-overlay-content {
5068
    padding: 0;
5069
}
5070

    
5071
.create-vm .image-details.selected .size {
5072

    
5073
}
5074

    
5075
.create-vm .image-details .show-details:hover {
5076
    color: #aaa !important; 
5077
}
5078
.create-vm .image-details.selected .show-details:hover {
5079
    color: #fff !important; 
5080
}
5081

    
5082
.create-vm .image-details.selected .show-details,
5083
.create-vm .image-details.selected .size {
5084
    color: #eee;
5085
}
5086

    
5087
.create-vm .image-details.selected span.owner {
5088
    color: #fff;
5089
}
5090

    
5091

    
5092
.create-vm .image-details p {
5093
    font-size: 0.8em;
5094
    padding-left: 27px;
5095
    display:block;
5096
}
5097

    
5098
.create-vm .image-details span.owner {
5099
    display: block;
5100
    font-size: 0.9em;
5101
    float: right;
5102
    color: #FF7F2A;
5103
    position: absolute;
5104
    top: 5px;
5105
    right: 5px;
5106
}
5107

    
5108
.create-vm .select-image .show-details {
5109
    display: none;
5110
    font-size: 0.8em;
5111
    text-decoration: underline;
5112
    color: #000;
5113
    position: absolute;
5114
    bottom: 5px;
5115
    right: 5px;
5116
}
5117

    
5118
.create-vm .image-details .size {
5119
    margin-top: 2px;
5120
    font-size: 0.8em;
5121
    color: #aaa;
5122
    margin-left: 10px;
5123
}
5124

    
5125
.create-vm .step-cont {
5126
    margin: 15px;
5127
}
5128

    
5129
.create-vm .create-step-cont {
5130
    min-height: 250px;
5131
    float: left;
5132
    width: 584px;
5133
}
5134

    
5135
.create-vm .create-controls {
5136
    padding: 10px;
5137
    border-top: 1px solid #ddd;
5138
}
5139

    
5140
.create-vm .empty {
5141
    font-size: 0.8em;
5142
    color: #444;
5143
}
5144

    
5145
.create-vm h4 {
5146
    color: #5CA1C0;
5147
    margin-bottom: 0.5em;
5148
    font-family: arial;
5149
}
5150
.create-vm ul li {
5151
    cursor: pointer;
5152
    padding: 4px;
5153
    font-size: 0.9em;
5154
}
5155

    
5156
.create-vm .create-step-cont li.ssh-key-option.selected,
5157
.create-vm ul li.selected {
5158
    background-color: #FF7F2A;
5159
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5160
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5161
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5162
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5163
    color: #fff;
5164
}
5165

    
5166
.create-vm .images-list-cont.loading .loading-indicator {
5167
    display: block !important;
5168
}
5169

    
5170
.create-vm .images-list-cont .loading-indicator {
5171
    display: none;
5172
    position: absolute;
5173
    right: -13px;
5174
    top: 2px;
5175
    width: 30px;
5176
    height: 10px;
5177
    background-repeat: no-repeat;
5178
    background-image: url("../images/icons/indicators/medium/progress.gif");
5179
}
5180

    
5181
.create-vm .images-list-cont h4 {
5182
    position: relative;
5183
}
5184

    
5185
.create-vm .images-list-cont {
5186
    width: 40%;
5187
    float: left;
5188
    padding-left: 3%;
5189
    padding-right: 3%;
5190
}
5191

    
5192
.create-vm li p.desc {
5193
    font-size: 0.9em;
5194
}
5195

    
5196
.create-vm p.desc.warning {
5197
    color: #880000;
5198
}
5199

    
5200
.create-vm p.desc.empty {
5201
    color: #000;
5202
}
5203

    
5204
.create-vm p.desc {
5205
    font-size: 0.8em;
5206
    color: #888;
5207
    margin-bottom: 10px;
5208
}
5209

    
5210
.create-vm li.role .values .val:hover {
5211
    background-color: #eee;
5212
}
5213
.create-vm li.role .values .val.selected,  .create-vm li.role .values .val.selected:hover {
5214
    color: #fff;
5215
    background-color: #FF9955;
5216
}
5217

    
5218
.create-vm .images-filter-cont, .create-vm .flavors-predefined-cont {
5219
    width: 18%;
5220
    padding-right: 4%;
5221
    float:left;
5222
    border-right: 1px solid #A1C8DB;
5223
    overflow: auto;
5224
}
5225

    
5226
.create-vm .flavor-options-cont {
5227
    width: 74%;
5228
    float: left;
5229
    margin-left: 20px;
5230
}
5231

    
5232
.create-vm .flavor-options-cont .flavor-options li:hover {
5233
    background-image:-webkit-linear-gradient(top, #E8F4FA, #D1E7F0);
5234
    background-image:-o-linear-gradient(top, #E8F4FA, #D1E7F0);
5235
    background-image:-moz-linear-gradient(top, #E8F4FA, #D1E7F0);
5236
    background-image:linear-gradient(top, #E8F4FA, #D1E7F0);
5237
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E8F4FA', endColorstr='#D1E7F0', GradientType=0);
5238
}
5239

    
5240
.create-vm .flavor-options-cont .flavor-options li.disabled * {
5241
    color: #eee !important;
5242
}
5243

    
5244
.create-vm .flavor-options-cont .flavor-options li.disabled {
5245
    background-image:linear-gradient(top, #aaa, #ddd);
5246
    background-image:-webkit-linear-gradient(top, #aaa, #ddd);
5247
    background-image:-o-linear-gradient(top, #aaa, #ddd);
5248
    background-image:-moz-linear-gradient(top, #aaa, #ddd);
5249
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#aaaaaa', endColorstr='#dddddd', GradientType=0);
5250
}
5251

    
5252
.create-vm .flavor-options-cont .flavor-options li.selected {
5253
    background-color: #FF9955;
5254
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5255
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5256
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5257
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5258
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF9955', endColorstr='#E88B4D', GradientType=0);
5259
    border: 1px solid #C97943;
5260
}
5261

    
5262
.create-vm .predefined-list li.disabled {
5263
    color: #ddd !important;
5264
}
5265

    
5266
.create-vm .flavor-options-cont .flavor-options li {
5267
    display: block;
5268
    float: left;
5269
    margin-right: 10px;
5270
    margin-bottom: 9px;
5271
    padding: 9px 14px;
5272
    border: 1px solid #aaa;
5273
    background-image:-webkit-linear-gradient(top, #D1E7F0, #E8F4FA);
5274
    background-image:-o-linear-gradient(top, #D1E7F0, #E8F4FA);
5275
    background-image:-moz-linear-gradient(top, #D1E7F0, #E8F4FA);
5276
    background-image:linear-gradient(top, #D1E7F0, #E8F4FA);
5277
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D1E7F0', endColorstr='#E8F4FA', GradientType=0);
5278
}
5279

    
5280
.create-vm .flavor-options-cont .flavor-options {
5281
    margin-bottom: 2px;
5282
}
5283

    
5284

    
5285
.create-vm .flavor-options .metric {
5286
    font-size: 0.8em;
5287
    margin-left: 2px;
5288
}
5289

    
5290
.create-vm .flavor-options span.title {
5291
    color: #444;
5292
}
5293

    
5294
.create-vm .flavor-options span.desc {
5295
    display: block;
5296
    color: #aaa;
5297
    font-weight: normal;
5298
    font-size: 0.8em;
5299
    float: right;
5300
    margin-top: 4px;
5301
}
5302

    
5303
.disktip {
5304
    padding: 4px;
5305
    top: 20px;
5306
}
5307

    
5308
.create-vm .flavor-options .flavors-disk-template-list {
5309
    position: relative;
5310
}
5311

    
5312
.create-vm .flavor-options .disk_template.option {
5313
    z-index: 10;
5314
    min-width: 50px;
5315
    text-align: center;
5316
}
5317

    
5318
/*0 position is -470px*/
5319
.create-vm .flavor-options .disk-template-description {
5320
    font-size: 0.8em;
5321
    color: #444;
5322
    background-image: url("../images/horizontal-pointer.png");
5323
    background-repeat: repeat-x;
5324
    background-position: -470px 0;
5325
    padding-top: 15px;
5326
    margin-top: -10px;
5327
    font-style: italic;
5328
    display:block;
5329
    overflow: auto;
5330
    padding-bottom: 0px;
5331
    margin-bottom: 7px;
5332
    width: 100%;
5333
}
5334

    
5335
.create-vm .flavor-options .disk_template.option .description {
5336
    display: none;
5337
    position: absolute;
5338
    bottom: -20px;
5339
    left:0;
5340
    color: #888;
5341
    font-style: italic;
5342
    display: block;
5343
    background-color: #fff;
5344
    width: 100%;
5345
    text-align: left;
5346
    z-index: 0;
5347
    border-top: 1px solid #ddd;
5348
    padding-top: 3px;
5349
    display: none;
5350
}
5351

    
5352
.create-vm .flavor-options .selected .value {
5353
    color: #FFF;
5354
}
5355

    
5356
.create-vm .flavor-options .value {
5357
    font-weight: bold;
5358
    color: #5CA1C0;
5359
}
5360

    
5361
.create-vm .flavor-options-cont h4 {
5362
    border-bottom: 1px solid #A1C8DB;
5363
    padding-bottom: 5px;
5364
}
5365

    
5366
.create-vm .images-info-cont {
5367
    width: 28%;
5368
    padding-left: 3%;
5369
    float: left;
5370
    border-left: 1px solid #A1C8DB;
5371
}
5372

    
5373
.create-vm .select-image.wide .show-details {
5374
    display: inline;
5375
}
5376

    
5377
.create-vm .select-image .images-info-cont .hide {
5378
    display: none;
5379
}
5380

    
5381
.create-vm .select-image.wide .images-info-cont .hide {
5382
    display: block;
5383
    float: right;
5384
    position: absolute;
5385
    right: 10px;
5386
    top: 10px;
5387
    font-size: 0.8em;
5388
    text-decoration: underline;
5389
    color: #5CA1C0;
5390
    cursor: pointer;
5391
}
5392

    
5393
.create-vm .select-image.wide .images-list-cont {
5394
    width: 74%;
5395
    padding-right: 0;
5396
}
5397

    
5398
.create-vm .select-image.wide .images-info-cont .description .title {
5399
    display: none;
5400
    float: none;
5401
}
5402

    
5403
.create-vm .select-image.wide .images-info-cont .description p {
5404
    background-color: #fff;
5405
    border: 1px solid #ddd;
5406
    padding: 10px;
5407
    float: none;
5408
}
5409

    
5410
.create-vm .select-image.wide .selected .size {
5411
    color: #FFF !important;
5412
}
5413

    
5414
.create-vm .select-image.wide .image-details .size {
5415
    color: #5CA1C0;
5416
    position: absolute;
5417
    top: 5px;
5418
}
5419

    
5420
.create-vm .select-image.wide .images-info-cont h3 {
5421
    color: #5CA1C0;
5422
    margin: 10px 0;
5423
    margin-top: 5px;
5424
    text-align: left;
5425
    font-size: 0.9em;
5426
}
5427

    
5428
.create-vm .select-image.wide .images-info-cont .description p {
5429
    height: 50px;
5430
}
5431

    
5432
.create-vm .select-image.wide .images-info-cont .description {
5433
    width: 100% !important;
5434
    float: none !important;
5435
    background-color: transparent !important;
5436
    padding: 0 !important;
5437
    font-size: 1.1em;
5438
}
5439
.create-vm .select-image.wide .images-info-cont .extra-details {
5440
    height: 160px;
5441
    overflow-y: scroll;
5442
    padding-right: 15px;
5443
}
5444

    
5445
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail {
5446
    padding: 0px;
5447
    background-color: transparent;
5448
    margin-bottom: 4px;
5449
}
5450

    
5451
.create-vm .select-image.wide .images-info-cont .extra-details .title {
5452
    float: left;
5453
    display: block;
5454
    width: 39%;
5455
    padding: 1%;
5456
    background-color: #5CA1C0;
5457
    color: #fff;
5458
    border: 1px solid #4F8DAA;
5459
    font-size: 0.8em;
5460
}
5461

    
5462
.create-vm .select-image.wide .images-info-cont .extra-details .value {
5463
    float: right;
5464
    display: block;
5465
    width: 55%;
5466
    padding: 1%;
5467
    border: none;
5468
    background-color: #FFF;
5469
    color: #444;
5470
    border: 1px solid #ddd;
5471
    margin-bottom: 0px;
5472
    font-size: 0.8em;
5473
}
5474

    
5475
.create-vm .select-image.wide .images-info-cont .image-detail {
5476
}
5477

    
5478
.create-vm .select-image.wide ul.images-list {
5479
    height: 310px;
5480
    overflow-y: scroll;
5481
    padding-right: 3%;
5482
}
5483

    
5484
.create-vm .select-image.wide .images-info-cont {
5485
    position: absolute;
5486
    width: 88%;
5487
    background-color: #DAE9F0;
5488
    padding: 2%;
5489
    border-left: none;
5490
    height: 320px;
5491
    box-shadow: 0px 0px 2px #aaa;
5492
    -moz-box-shadow: 0px 0px 2px #aaa;
5493
    -webkit-box-shadow: 0px 0px 2px #aaa;
5494
    display: none;
5495
}
5496

    
5497

    
5498
.create-vm .images-info-cont h4, .create-vm .create-step-cont .param h4{
5499
    color: #FF9955;
5500
    margin-bottom: 1em;
5501
    font-size: 1.2em;
5502
}
5503

    
5504
.create-vm .images-info-cont span.title {
5505
    color: #4085A5;
5506
    display: block;
5507
    margin-bottom: 2px;
5508
    font-size: 0.8em;
5509
}
5510

    
5511
.create-vm .type-filter li {
5512
    font-size: 0.8em;
5513
    /*font-weight: bold;*/
5514
    padding: 4px;
5515
    margin-bottom: 0px;
5516
    color: #FF7F2A;
5517
}
5518

    
5519
.create-vm .images-list li {
5520
    min-height: 30px;
5521
}
5522
.create-vm .images-list .image-details:hover {
5523
    background-color: #eee;
5524
}
5525

    
5526
.create-vm .images-list .image-details.selected:hover {
5527
    background-color: #FF7F2A;
5528
}
5529

    
5530
.create-vm .images-list .image-details.selected {
5531
    /*font-weight: bold;*/
5532
}
5533

    
5534
.create-vm .images-list .image-details {
5535
    padding: 6px;
5536
    margin-bottom:1px;
5537
    position: relative;
5538
}
5539

    
5540
.create-vm .images-list .image-details img {
5541
    vertical-align: middle;
5542
    margin-right: 10px;
5543
}
5544

    
5545
.create-vm .images-info-cont .image-detail:last-child p {
5546
    border-bottom: none;
5547
}
5548

    
5549
.create-vm .images-info-cont h4 img {
5550
    vertical-align: middle;
5551
    margin-right: 7px;
5552
    margin-bottom: 5px;
5553
}
5554

    
5555
.create-vm .images-info-cont .description p {
5556
    font-size: 0.8em;
5557
}
5558

    
5559
.create-vm .images-info-cont p {
5560
    margin-bottom: 7px;
5561
    font-size: 0.9em;
5562
    border-bottom: 1px solid #A1C8DB;
5563
    padding-bottom: 7px;
5564
}
5565

    
5566
.create-vm .step-header {
5567
    padding-bottom:0;
5568
    position: relative;
5569
}
5570

    
5571
.create-vm .step-header .header-step .info span.subtitle {
5572
    font-size: 1.2em;
5573
    color: #fff;
5574
    font-weight: bold;
5575
}
5576

    
5577
.create-vm .step-header .header-step .info span {
5578
    float: none;
5579
    text-align: right;
5580
}
5581

    
5582
.create-vm .step-header .header-step .info {
5583
    position: absolute;
5584
    right: 15px;
5585
    top: 20px;
5586
    font-size: 0.8em;
5587
}
5588

    
5589
.create-vm .step-header .header-step span {
5590
    float: left;
5591
    display: block;
5592
}
5593

    
5594
.create-vm .steps-container {
5595
    width: 2000em;
5596
}
5597

    
5598
.create-vm .step-header .header-step .title {
5599
    margin-top: 20px;
5600
    font-size: 1em;
5601
    margin-left: 10px;
5602
}
5603

    
5604
#createvm-overlay-content {
5605
    width: 584px;
5606
    overflow: hidden;
5607
}
5608

    
5609
.create-vm .steps-history .steps-history-cont.current .title {
5610
    display: block;
5611
    top: 23px;
5612
    left: 43px;
5613
    font-size: 1.2em;
5614
    color: #ffffff;
5615
    font-weight: bold;
5616
    font-family: 'Ubuntu', sans-serif !important;
5617
}
5618

    
5619
.create-vm .steps-history .steps-history-cont.current .subnum {
5620
    display: none;
5621
    float: none;
5622
    font-size: 0.9em;
5623
    font-family: 'Ubuntu', sans-serif  !important;
5624
}
5625

    
5626
.create-vm .steps-history .steps-history-cont.current .subtitle,
5627
.create-vm .steps-history .steps-history-cont.current .description {
5628
    font-family: 'Ubuntu', sans-serif  !important;
5629
}
5630

    
5631
.create-vm .steps-history .steps-history-cont.current .info {
5632
    display: block;
5633
    font-family: 'Ubuntu', sans-serif !important;
5634
}
5635

    
5636
.create-vm .steps-history .steps-history-cont.completed .title,
5637
.create-vm .steps-history .steps-history-cont.completed .num {
5638
    color: #A1C8DB;
5639
}
5640

    
5641
.create-vm .steps-history .steps-history-cont.completed {
5642
    background-color: #4085A5;
5643
    color: #fff;
5644
    cursor: pointer;
5645
}
5646

    
5647
.create-vm .steps-history .steps-history-cont.completed .steps-history-step {
5648
    background-image: url("../images/check.png");
5649
}
5650

    
5651
.create-vm .steps-history .steps-history-cont.current .steps-history-step {
5652
    width: 320px;
5653
}
5654

    
5655
.create-vm .steps-history .steps-history-cont.current .num {
5656
    color: #fff;
5657
}
5658

    
5659
.create-vm .steps-history .steps-history-cont.current .info {
5660
    color: #4085A5;
5661
    font-size: 0.8em;
5662
}
5663

    
5664
.create-vm .steps-history .steps-history-cont.current {
5665
    background-color: #A1C8DB;
5666
    color: #fff;
5667
    width: 428px;
5668
}
5669

    
5670
.create-vm .steps-history-step {
5671
    padding: 4px;
5672
    padding-left: 7px;
5673
    font-size: 1em;
5674
    font-family: 'Ubuntu', sans-serif  !important;
5675
    margin-right: 5px;
5676
    padding-top: 12px;
5677
    background-position: right 30px;
5678
    background-image: none;
5679
    background-repeat: no-repeat;
5680
}
5681

    
5682
.create-vm .steps-history {
5683
    background-color: #4085A5;
5684
}
5685

    
5686
.create-vm .steps-history .steps-history-cont.last {
5687
    border-right: none;
5688
}
5689

    
5690
.create-vm .steps-history .steps-history-cont .num {
5691
    margin-left: 5px;
5692
    margin-top: -10px;
5693
    padding-bottom: 10px;
5694
}
5695

    
5696
.create-vm .steps-history .steps-history-cont .title {
5697
    display: none;
5698
    position: absolute;
5699
    bottom: 0px;
5700
    text-align: center;
5701
    padding-bottom: 2px;
5702
    left:0;
5703
    width: 55px;
5704
    margin-left:0;
5705
    margin-top:0;
5706
    font-size: 0.8em;
5707
}
5708

    
5709
.create-vm .steps-history .steps-history-cont .subnum,
5710
.create-vm .steps-history .steps-history-cont .info {
5711
    display: none;
5712
}
5713

    
5714
.create-vm .steps-history .steps-history-cont {
5715
    height: 70px;
5716
    width: 51px;
5717
    float: left;
5718
    color: #fff;
5719
    border-right: 1px solid #A1C8DB;
5720
    color: #A1C8DB;
5721
    background-color: #4085A5;
5722
    background-position: center right;
5723
    background-image: none;
5724
    background-repeat: no-repeat;
5725

    
5726
    -webkit-transition: background-color .15s ease-in;
5727
    -o-transition: background-color .15s ease-in;
5728
    -moz-transition: background-color .15s ease-in;
5729
    transition: background-color .15s ease-in;
5730

    
5731
    border-bottom: 1px solid #aaa;
5732
}
5733

    
5734
.create-vm .step-header .header-step .num {
5735
    color: #225871;
5736
    font-size: 4em;
5737
    margin-bottom: -5px;
5738
    font-family: 'Ubuntu', sans-serif;
5739
    font-weight: normal !important;
5740
}
5741

    
5742
.create-vm .step-header .header-step {
5743
    color: #;
5744
    margin-bottom: -6px;
5745
    width: 25%;
5746
    padding-left: 0%;
5747
    display: block;
5748
    float: left;
5749
}
5750

    
5751
.create-vm .step-header .header-step.current {
5752
    color: #387693;
5753
}
5754

    
5755
.create-vm .image-filters-title {
5756
    margin-top: 1em;
5757
    margin-bottom: 0.5em;
5758
}
5759

    
5760
.create-vm .create-step-cont span.clear {
5761
    font-size: 0.8em;
5762
    font-weight: bold;
5763
    color: #A1C8DB;
5764
    display: block;
5765
}
5766

    
5767
.create-vm .category-filters li {
5768
    float:left;
5769
    display: block;
5770
    padding: 4px;
5771
    background-color: #eee;
5772
    margin-right: 5px;
5773
    font-size: 0.9em;
5774
    margin-bottom: 5px;
5775
}
5776

    
5777
.create-vm .content-cont {
5778
    height: 340px;
5779
    overflow: auto;
5780
}
5781

    
5782
.create-vm .vm-confirm .confirm-params span.cval {
5783
    margin-left: 8px;
5784
    color: #444;
5785
}
5786

    
5787
.create-vm .vm-confirm .confirm-params span.ckey {
5788
    color: #4085A5;
5789
    font-weight: bold;
5790
}
5791

    
5792
.create-vm .vm-confirm .confirm-params {
5793
    margin-bottom: 15px;
5794
}
5795

    
5796
.create-vm .vm-confirm h3.vm-name {
5797
    background-repeat: no-repeat;
5798
    background-position: left center;
5799
    font-size: 1.4em;
5800
    padding-left: 1.45em;
5801
    color: #4085A5;
5802
}
5803

    
5804
.create-vm .images-list-cont h4 a {
5805
    margin-top: 3px;
5806
    margin-right: -2px !important;
5807
}
5808
.create-vm .images-list-cont h4 a,
5809
.create-vm .list-cont h4 a {
5810
    font-size: 0.8em;
5811
    font-weight: normal;
5812
    margin-right: 5px;
5813
    float: right;
5814
    color: #FF7F2A;
5815
}
5816

    
5817
.create-vm .confirm-params {
5818
    overflow: auto;
5819
}
5820

    
5821
.create-vm .vm-confirm .ssh.confirm-params {
5822
    max-height: 150px;
5823
}
5824

    
5825
.create-vm .personalize-cont .confirm-params {
5826
    max-height: 216px;
5827
}
5828

    
5829
.create-vm .personalize-cont,
5830
.create-vm .confirm-cont {
5831
    height: 250px;
5832
}
5833

    
5834
.create-vm .create-step-cont .rename input.rename-field {
5835
    font-size: 1.4em;
5836
    padding: 5px;
5837
    width: 93%;
5838
    padding-left: 30px;
5839
    background-position: 7px center;
5840
    background-repeat: no-repeat;
5841
}
5842

    
5843
.create-vm .create-step-cont .rename label {
5844
    display: block;
5845
}
5846

    
5847
.create-vm .create-step-cont .personalize-conts,
5848
.create-vm .create-step-cont .confirm-conts {
5849
    margin-top: 20px;
5850
}
5851

    
5852
.create-vm .create-step-cont .personalize-cont,
5853
.create-vm .create-step-cont .confirm-cont {
5854
    width: 30%;
5855
    margin-right: 2%;
5856
    border-right: 1px solid #A1C8DB;
5857
    float: left;
5858
}
5859

    
5860
.create-vm .create-step-cont .confirm-cont ul li .title {
5861
    width: 55px;
5862
    float: left;
5863
}
5864

    
5865
.create-vm .create-step-cont .list-cont ul li .value {
5866
    float: right;
5867
    padding-top: 2px;
5868
    display: block;
5869
    width: 90px;
5870
    text-align: right;
5871
}
5872

    
5873
.create-vm .create-step-cont .list-cont ul li.flavor-disktype .value {
5874
    width: 45px;
5875
}
5876

    
5877
.create-vm .create-step-cont .list-cont ul li.image-description .value,
5878
.create-vm .create-step-cont .list-cont ul li.image-name .value {
5879
    float: none;
5880
    width: auto;
5881
    text-align:left;
5882
    width: auto;
5883
}
5884

    
5885
.create-vm .create-step-cont .list-cont ul li {
5886
    padding:0;
5887
    margin:0;
5888
    margin-bottom: 5px;
5889
    border-bottom: 1px solid #EEE;
5890
    padding-bottom: 7px;
5891
    margin-right: 10px;
5892
}
5893

    
5894
.create-vm .create-step-cont li.ssh-key-option .check {
5895
    float: right;
5896
    margin-right: 5px;
5897
    margin-top: 0px;
5898
}
5899

    
5900
.create-vm .create-step-cont li.ssh-key-option.selected {
5901
}
5902
.create-vm .create-step-cont li.ssh-key-option.selected:hover {
5903
    background-color: #F95;
5904
}
5905

    
5906
.create-vm .create-step-cont li.ssh-key-option:hover {
5907
    background-color: #eee;
5908
}
5909

    
5910
.create-vm .create-step-cont li.ssh-key-option.selected {
5911
}
5912

    
5913
.create-vm .create-step-cont li.ssh-key-option {
5914
    padding: 6px !important;
5915
}
5916

    
5917
.create-vm .create-step-cont .list-cont.ssh {
5918
    width: 60%;
5919
}
5920

    
5921
.create-vm .create-step-cont .list-cont.meta h4 {
5922
    margin-right: 0;
5923
}
5924

    
5925
.create-vm .create-step-cont .list-cont.meta {
5926
    margin-right:0;
5927
    border-right: none;
5928
    width: 195px;
5929
}
5930

    
5931
.create-vm .list-cont > h4 {
5932
    font-size: 1.2em;
5933
    margin-right: 10px;
5934
    border-bottom: 1px solid #A1C8DB;
5935
    padding-bottom: 5px;
5936
    color: #387693;
5937
}
5938

    
5939
.create-vm .list-cont .param.image-name {
5940
    margin-bottom: 0 !important;
5941
    border-bottom: none !important;
5942
}
5943

    
5944
.create-vm .list-cont .param h4 {
5945
    margin-bottom: 0px !important;
5946
    font-size: 1.1em !important; 
5947
}
5948

    
5949
.create-vm .list-cont .param {
5950
    margin-bottom: 7px !important;
5951
}
5952

    
5953
.create-vm .list-cont .value {
5954
    font-weight: bold;
5955
}
5956

    
5957
.create-vm .list-cont .param .value {
5958
    font-size: 0.9em;
5959
}
5960

    
5961
.create-vm .list-cont .param .title {
5962
    color: #387693;
5963
}
5964

    
5965
.create-vm .list-cont .image-description {
5966
    margin-left:0;
5967
}
5968

    
5969
.create-vm .list-cont .image-description .value {
5970
    font-weight: normal;
5971
    margin-left: 0 !important;
5972
}
5973

    
5974
.create-vm .list-cont .image-description .title {
5975
    display: none;
5976
    font-size: 0.8em;
5977
}
5978

    
5979
.create-vm .list-cont.meta .values span {
5980
    display:block;
5981
    float: left;
5982
    margin-right: 4px;
5983
    border: 1px solid #eee;
5984
    padding:3px;
5985
    margin-bottom: 4px;
5986
    font-size: 0.9em;
5987
}
5988

    
5989
.create-vm .list-cont.meta .key {
5990
    font-weight: bold;
5991
    font-size: 0.9em;
5992
    display: block;
5993
    margin-bottom: 5px;
5994
}
5995

    
5996
.create-vm .meta input {
5997
    font-size: 0.8em;
5998
}
5999

    
6000
.vm-connect .connect-cont {
6001
    margin-bottom: 20px;
6002
    border-bottom: 1px solid #A1C8DB;
6003
    padding-bottom: 20px;
6004
}
6005

    
6006
.vm-connect .connection-info {
6007
    padding-bottom: 0px;
6008
    margin-bottom: 0;
6009
    border-bottom: none;
6010
}
6011

    
6012
.vm-connect .connection-info .connect a {
6013
    color: #fff;
6014
}
6015

    
6016
.vm-connect .connection-info .connect {
6017
    background-color: #387693;
6018
    color: #fff;
6019
    padding: 10px;
6020
    font-size: 1.2em;
6021
    text-align: center;
6022
}
6023

    
6024
.clip-copy {
6025
    display: block;
6026
    width: 20px;
6027
    height: 20px;
6028
    position: absolute;
6029
    border: 1px solid #387693;
6030
    background-image: url("../images/clipboard.png");
6031
    background-repeat: no-repeat;
6032
    background-position: center;
6033
    cursor: pointer;
6034
    background-color: #A1C8DB;
6035
}
6036

    
6037
.password-cont .clip-copy { right: 10px; top: 8px;}
6038

    
6039

    
6040
.overlay-invitations {
6041
    width: 680px;
6042
}
6043
.invitations-form .sending .sending-msg {
6044
    font-size: 0.8em;
6045
    display: block !important;
6046
    margin-bottom: 5px;
6047
    color: #008800;
6048
}
6049

    
6050
.invitations-form .send-error {
6051
    font-size: 0.8em;
6052
    margin-bottom: 5px;
6053
    margin-top: 5px;
6054
    color: #800;
6055
    padding: 3px;
6056
    padding-left: 0;
6057
    display: none;
6058
}
6059

    
6060
.invitations-form .error label {
6061
    color: #000 !important;
6062
}
6063

    
6064
.invitations-form .form-field {
6065
    width: 49%;
6066
    float: left;
6067
}
6068

    
6069
.invitations-view .left.none {
6070
    background-color: #880000;
6071
}
6072

    
6073
.invitations-form {
6074
    position: relative;
6075
}
6076

    
6077
.invitations-form h3 {
6078
    float: left;
6079
}
6080

    
6081
.invitations-form .add-new-invitation {
6082
    float:left;
6083
    top:2px;
6084
    right: 20px;
6085
    width: 16px;
6086
    height: 16px;
6087
    background-image: url("../images/option-action-add.png");
6088
    background-repeat: no-repeat;
6089
    background-position: center;
6090
    text-indent: -50000em;
6091
    background-color: #4085A5;
6092
    margin-left: 15px;
6093
    cursor: pointer;
6094
}
6095

    
6096
.invitations-view .left {
6097
    font-size: 1em;
6098
    color: #fff;
6099
    font-weight: bold;
6100
    background-color: #4085A5;
6101
    padding: 4px;
6102
}
6103

    
6104
input.has-errors {
6105
    border-color: #ff0000;
6106
}
6107

    
6108
.none-left .invitations-wrapper .invitations-list {
6109
    width: 100% !important;
6110
    border-left: none !important;
6111
    padding-left: 0;
6112
}
6113

    
6114
.invitations-wrapper .invitations-list {
6115
    width: 40%;
6116
    float: left;
6117
    padding-left: 10px;
6118
    border-left: 1px solid #4085A5;
6119
    margin-left: -1px
6120
}
6121

    
6122
.invitations-wrapper .invitations-form {
6123
    width: 57%;
6124
    float: left;
6125
    border-right: 1px solid #4085A5;
6126
}
6127

    
6128
.invitations-wrapper label span {
6129
    color: #aaa;
6130
    font-size: 0.8em;
6131
}
6132

    
6133
.invitations-wrapper label {
6134
    display: block;
6135
    font-size: 0.9em;
6136
    margin-bottom:10px;
6137
    font-weight: bold;
6138
}
6139

    
6140
.invitations-view .add-new-invitation {
6141
    cursor: pointer;
6142
}
6143

    
6144
.invitations-wrapper input.name {
6145
    width: 150px;
6146
}
6147

    
6148
.invitations-wrapper input {
6149
    font-size: 0.9em;
6150
    width: 155px;
6151
    padding:4px;
6152
}
6153

    
6154
.invitations-list .invitation-sent {
6155
    border-bottom: 1px solid #A1C8DB;
6156
    padding-bottom: 5px;
6157
    margin-bottom: 5px;
6158
    position: relative;
6159
}
6160

    
6161
.invitations-view h3 {
6162
    margin-bottom: 10px;
6163
    color: #4085A5;
6164
}
6165

    
6166
.invitations-list .invitation-sent.last,
6167
.invitations-list .invitation-sent:last-child {
6168
    border-bottom: none;
6169
}
6170

    
6171

    
6172
.invitations-list .invitation-sent .email {
6173
    color: #D98147;
6174
    font-size: 0.8em;
6175
    font-weight: bold;
6176
    margin-top: 2px;
6177
}
6178

    
6179
.invitations-list .pagination a,
6180
.invitations-list .pagination span {
6181
    padding: 0.2em 0.3em;
6182
}
6183

    
6184
.invitations-list .pagination {
6185
    font-size: 0.75em;
6186
}
6187

    
6188
.invitations-list .name {
6189
    color: #444;
6190
    font-size: 0.9em;
6191
}
6192

    
6193
.invitations-list .status.sending {
6194
    background-image: url("../images/icons/indicators/small/progress.gif");
6195
}
6196

    
6197
.invitations-list .status.sent {
6198
    background-image: url("../images/invitation_accepted.png");
6199
}
6200

    
6201
.invitations-list .status.resend {
6202
    background-image: url("../images/resend.png");
6203
}
6204

    
6205
.invitations-list .status.resend {
6206
    cursor: pointer;
6207
}
6208

    
6209
.invitations-list .status {
6210
    width: 20px;
6211
    height: 15px;
6212
    position: absolute;
6213
    top:5px;
6214
    right: 2px;
6215
    background-repeat: no-repeat;
6216
    background-position: center;
6217
}
6218

    
6219
.invitations-form .form-entry:last-child {
6220
    border-bottom: none;
6221
}
6222

    
6223
.invitations-form .form-entry {
6224
    position: relative;
6225
    margin-bottom: 10px;
6226
    padding-bottom: 10px;
6227
    border-bottom: 1px solid #ddd;
6228
    margin-right: 10px;
6229
}
6230

    
6231
.invitations-form .send-invitations {
6232
    float: left;
6233
    padding: 5px;
6234
    color: #fff;
6235
    margin-right: 10px;
6236
    margin-top: 10px;
6237
}
6238

    
6239
.invitations-form .form-entry.error {
6240
    padding-bottom: 0px;
6241
}
6242

    
6243
.invitations-form .form-entry.error .remove-invitation {
6244
    bottom: 32px;
6245
}
6246

    
6247
.invitations-form .remove-invitation {
6248
    padding: 5px;
6249
    background-image: url("../images/option-action-remove.png");
6250
    background-position: center;
6251
    background-repeat: no-repeat;
6252
    color: #fff;
6253
    width: 15px;
6254
    height: 15px;
6255
    cursor: pointer;
6256
    text-indent: -50000px;
6257
    position: absolute;
6258
    right: -10px;
6259
    bottom: 14px;
6260
}
6261

    
6262
.invitations-list .resent-info,
6263
.invitations-form .top-info {
6264
    font-size: 0.8em;
6265
    margin-bottom: 10px;
6266
}
6267

    
6268
.invitations-list .msg .email,
6269
.invitations-form .success .msg .email {
6270
    font-weight: bold;
6271
}
6272

    
6273
.invitations-list .msg.err-msg,
6274
.invitations-list .success.msg,
6275
.invitations-form .success .msg {
6276
    background-color: #080;
6277
    color: white;
6278
    padding: 5px;
6279
    margin-right: 10px;
6280
    margin-bottom: 5px;
6281
}
6282
.invitations-list .msg.err-msg,
6283
.invitations-list .success.msg {
6284
    margin-right: 0px;
6285
}
6286
.invitations-list .msg.err-msg {
6287
    background-color: #800;
6288
}
6289

    
6290
.overlay .models-view .previous-view-link {
6291
    margin: -10px;
6292
    margin-bottom:10px;
6293
    padding: 10px 5px;
6294
    background-image: url("../images/left-arrow.png");
6295
    background-repeat: no-repeat;
6296
    background-position: 10px center;
6297
    padding-left: 20px;
6298
    background-color: #93D070;
6299
    cursor: pointer;
6300
    border-bottom: 1px solid #eee;
6301
    text-decoration: underline;
6302
}
6303
.models-view .quick-add {
6304
    text-decoration: underline; 
6305
    color: #4085A5;
6306
    cursor: pointer;
6307
}
6308

    
6309
.empty .items-list {
6310
    margin-top: 0 !important;
6311
}
6312

    
6313
.models-view .items-empty-msg {
6314
    border-top: 1px solid #aaa;
6315
    padding-top: 10px;
6316
    font-size: 1em;
6317
    margin-top:0 !important;
6318
}
6319

    
6320
.models-view .items-empty-msg,
6321
.models-view .model-description {
6322
    color: #444;
6323
    margin: 10px 0;
6324
}
6325

    
6326
.models-view .model-list .collection-action.disabled {
6327
    background-color: #aaa;
6328
    border-color: #aaa;
6329
    cursor: default;
6330
}
6331
.models-view .model-list .collection-action.disabled:hover {
6332
    background-color: #aaa;
6333
    border-color: #aaa;
6334
}
6335

    
6336
.models-view .model-list .collection-action:hover {
6337
    background-color: #aaa;
6338
}
6339

    
6340
.models-view .model-list .collection-action:hover {
6341
    background-color: #F95;
6342
    border-color: #F95;
6343
}
6344

    
6345
.models-view .model-list .collection-action.in-progress {
6346
    background-color: #aaa;
6347
    color: #fff;
6348
    border-color: #aaa;
6349
    background-image: url("../images/icons/indicators/small/progress.gif") !important;
6350
}
6351

    
6352
.models-view .model-list .collection-action.add-generate {
6353
    background-image: url("../images/option-action-generate-ssh.png");
6354
}
6355

    
6356
.models-view .model-list .collection-action.add {
6357
    background-image: url("../images/option-action-add.png");
6358
    padding-right: 20px !important;
6359
}
6360

    
6361
.models-view .model-list .collection-action {
6362
    float: right;
6363
    background-color: #FF7F2A;
6364
    color: #fff;
6365
    padding: 6px 8px;
6366
    margin-left: 10px;
6367
    cursor: pointer;
6368
    padding-right: 30px;
6369
    background-position: right center;
6370
    background-repeat: no-repeat;
6371
    background-clip: border-box;
6372
    border-right: 5px solid #FF7F2A;
6373
}
6374

    
6375
.models-view .items-list {
6376
    margin-top: 10px;
6377
}
6378

    
6379
.models-view .model-list ul li.model-item:last-child {
6380
    margin-bottom: 0;
6381
}
6382

    
6383
.models-view .model-list ul li.model-item {
6384
    background-color: #D4E2E8;
6385
    margin-bottom: 5px;
6386
    position: relative;
6387
}
6388

    
6389
.models-view .model-list ul li.model-item .param {
6390
    float: left;
6391
    padding: 6px;
6392
}
6393

    
6394
.models-view .model-list ul li.model-item .item-action.confirm-remove {
6395
    margin-right: -15px !important;
6396
}
6397

    
6398
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover .cancel {
6399
    color: inherit !important;
6400
}
6401

    
6402
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover {
6403
    background-color: #F95;
6404
    color: inherit !important;
6405
}
6406

    
6407
.models-view .model-list ul li.model-item .item-action.confirm-remove span.cancel {
6408
    padding: 6px !important;
6409
}
6410

    
6411
.models-view .model-list ul li.model-item .item-action.confirm-remove span {
6412
    display: block;
6413
    float: left;
6414
    padding: 6px 15px;
6415
}
6416

    
6417
.models-view .model-list ul li.model-item .item-action .cancel-remove:hover {
6418
    color: #fff !important;
6419
}
6420

    
6421
.models-view .model-list ul li.model-item .item-action.confirm-remove,
6422
.models-view .model-list ul li.model-item .item-action .do-confirm,
6423
.models-view .model-list ul li.model-item .item-action .cancel-remove {
6424
    display:none !important;
6425
    background-color: #D95D0A;
6426
    padding:0;
6427
    margin:0;
6428
}
6429

    
6430
.models-view .model-list ul li.model-item.pending-delete .item-action.remove {
6431
    display: none;
6432
}
6433

    
6434
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel {
6435
    background-color: #F95;
6436
}
6437

    
6438
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm {
6439
    background-color: #FF7F2A;
6440
}
6441

    
6442
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove,
6443
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove .do-confirm,
6444
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel-remove {
6445
    display:block !important;
6446
}
6447

    
6448
.models-view .model-list ul li.model-item.pending-delete .item-action {
6449
    display: block;
6450
}
6451

    
6452
.models-view .model-list ul li.model-item.expanded .item-action,
6453
.models-view .model-list ul li.model-item:hover .item-action {
6454
    display: block;
6455
}
6456

    
6457
.models-view .model-list ul li.model-item .item-action.hide {
6458
    background-image: url("../images/minus-8.png");
6459
}
6460
.models-view .model-list ul li.model-item .item-action.show:hover {
6461
    background-image: url("../images/plus-8.png");
6462
}
6463

    
6464
.models-view .model-list ul li.model-item .item-action.show {
6465
    background-image: url("../images/plus-8-dark.png");
6466
}
6467

    
6468
.models-view .model-list ul li.model-item .item-action.remove {
6469
    background-image: url("../images/option-action-remove.png");
6470
}
6471

    
6472
.models-view .model-list ul li.model-item .item-action.edit:hover {
6473
    background-image: url("../images/option-action-edit-light.png");
6474
}
6475

    
6476
.models-view .model-list ul li.model-item .item-action.edit {
6477
    background-image: url("../images/option-action-edit.png");
6478
}
6479
.models-view .model-list ul li.model-item .item-action.remove:hover {
6480
    background-color: #880000 !important;
6481
    border-color: #800 !important;
6482
}
6483

    
6484
.models-view .model-list ul li.model-item.expanded .item-action.show,
6485
.models-view .model-list ul li.model-item.expanded .item-action.hide,
6486
.models-view .model-list ul li .item-actions .item-action:hover {
6487
    background-color: #4085A5;
6488
    color: #fff;
6489
    border-color: #4085A5;
6490
}
6491

    
6492
.models-view .model-list ul li .item-actions {
6493
    position: absolute;
6494
    right: -10px;
6495
    top: 0px;
6496
}
6497

    
6498
.models-view .model-list ul li .item-actions .item-action {
6499
    float: right;
6500
    padding: 6px;
6501
    margin-right: 10px;
6502
    display: none;
6503
    cursor: pointer;
6504
    padding-right: 20px;
6505
    background-repeat: no-repeat;
6506
    background-position: right center;
6507
    border-right: 5px solid transparent;
6508
}
6509

    
6510
.models-view .model-list h3 {
6511
    float: left;
6512
}
6513

    
6514
.models-view h3 {
6515
    font-size: 1.2em;
6516
    margin-bottom: 1em;
6517
    margin-top: 5px;
6518
    color: #4085A5;
6519
}
6520

    
6521
.models-view .form-actions {
6522
    font-size: 1.1em;
6523
}
6524

    
6525
.models-view .model-list ul li,
6526
.models-view .model-list ul {
6527
    list-style: none;
6528
}
6529

    
6530
.models-view .model-list ul li.header {
6531
    display: none;
6532
}
6533

    
6534
.models-view .model-form textarea {
6535
    width: 99%;
6536
    height: 100px;
6537
    border: 1px solid #aaa;
6538
}
6539

    
6540

    
6541
.models-view .model-form .form-field {
6542
    margin-bottom: 10px;
6543
}
6544

    
6545
.models-view .model-form label {
6546
    display: block;
6547
    color: #406A7D;
6548
    font-size: 1.1em;
6549
    margin: 0px 0 5px 0;
6550
}
6551

    
6552
.models-view .model-form .inline label {
6553
    float: left;
6554
    margin-right: 10px;
6555
    margin-top: 10px !important;
6556
}
6557

    
6558
.models-view .model-form input.long {
6559
    width: 400px;
6560
}
6561

    
6562
.models-view .model-form .inline input {
6563
    width: auto;
6564
    margin-top: 10px;
6565
}
6566

    
6567
.models-view .model-form .inline select {
6568
    width: auto;
6569
    margin-top: 7px;
6570
}
6571

    
6572
.models-view .model-form .inline .errors,
6573
.models-view .model-form .inline .field-desc {
6574
    clear: both;
6575
}
6576

    
6577
#user_public_keys .private-download {
6578
    margin: 5px 0;
6579
    margin-top: 6px;
6580
}
6581

    
6582
#user_public_keys .private-cont form {
6583
    float: left;
6584
    margin-left: 5px;
6585
}
6586

    
6587
#user_public_keys input.form-text:hover {
6588
    background: #F95;
6589
}
6590

    
6591
#user_public_keys input.form-text {
6592
    background: #FF7F2A;
6593
    color: #fff;
6594
    border: 1px solid #F95;
6595
    padding: 0 5px;
6596
    margin: 0 5px;
6597
    margin-top: -1px;
6598
    cursor: pointer;
6599
}
6600

    
6601
#user_public_keys .form-text {
6602
    float: left;
6603
}
6604

    
6605
#user_custom_images,
6606
#user_public_keys {
6607
    font-size: 0.7em;
6608
}
6609

    
6610
#user_public_keys .download-button {
6611
    width: 30px;
6612
    height: 30px;
6613
}
6614

    
6615

    
6616
#user_public_keys #model-item-tpl {
6617
    display: none;
6618
}
6619
#user_public_keys .model-item .name {
6620
    color: #4085A5;
6621
    font-size: 1.2em;
6622
}
6623

    
6624
#user_public_keys .model-item .fingerprint .flabel {
6625
    color: #888;
6626
    float: left;
6627
    margin-right: 5px;
6628
}
6629

    
6630
#user_public_keys .model-item .fingerprint {
6631
    float: none;
6632
    clear: both;
6633
    color: #444;
6634
    font-family: monospace;
6635
    letter-spacing: 1px;
6636
    padding: 4px;
6637
    font-size: 0.9em;
6638
    border-top: 1px solid #fff;
6639
}
6640

    
6641
#user_public_keys .model-item .publicid {
6642
    display: none;
6643
}
6644

    
6645
#user_public_keys .model-item.expanded .publicid .param-content {
6646
    padding: 5px 5px;
6647
    overflow: auto;
6648
    background-color: #FFF;
6649
    border: 1px solid #4085A5;
6650
    border-left: none;
6651
    border-right: none;
6652
    font-size: 1.1em;
6653
}
6654

    
6655
#user_public_keys .model-item.expanded .publicid .param-content textarea {
6656
    width: 100%;
6657
    height: 90px;
6658
    margin:0;
6659
    padding:0;
6660
    border:none;
6661
    overflow: auto;
6662
}
6663

    
6664
#user_public_keys .model-item.expanded .publicid {
6665
    display: block;
6666
    background-color: #fff;
6667
    width: 100%;
6668
    margin-top: 0px;
6669
    margin-left: 0px;
6670
    color: #fff;
6671
    padding:0 !important;
6672
}
6673

    
6674
.models-view .form-messages {
6675
    margin-bottom: 10px;
6676
}
6677

    
6678
.models-view .list-messages {
6679
    margin-top: 10px;
6680
}
6681

    
6682
.models-view .form-messages .error,
6683
.models-view .form-messages .success,
6684
.models-view .list-messages .error,
6685
.models-view .list-messages .success,
6686
#user_public_keys .private-cont {
6687
    background-color: #AADE87;
6688
    color: #447821;
6689
    padding: 5px;
6690
    border: 1px solid #447821;
6691
    font-size: 1.1em;
6692
    margin-top: 5px;
6693
}
6694

    
6695
.models-view .form-messages .error,
6696
.models-view .list-messages .error {
6697
    background-color: #DE8D87;
6698
    color:  #782421 !important;
6699
    border-color: #782421;
6700
}
6701

    
6702
#user_public_keys .limit-msg {
6703
    color: #800;
6704
    position: absolute;
6705
    right: 20px;
6706
    top: 25px;
6707
}
6708

    
6709
#user_public_keys .private-cont {
6710
    margin-top: 10px;
6711
}
6712

    
6713
#user_public_keys .private-cont .private-msg {
6714
    float: left;
6715
    padding:5px;
6716
    margin-top: 5px;
6717
}
6718

    
6719
#user_public_keys .private-cont textarea {
6720
    margin: 5px;
6721
    width: 97%;
6722
    height: 200px;
6723
}
6724

    
6725
#user_public_keys .private-cont .close-private:hover {
6726
    color: #Fff;
6727
}
6728

    
6729
#user_public_keys .private-cont .close-private {
6730
    float: right;
6731
    margin-right: 5px;
6732
    font-weight: bold;
6733
    cursor: pointer;
6734
    text-decoration: underline;
6735
}
6736

    
6737
#user_public_keys .model-item .key-type {
6738
    background-color: #72ADC8;
6739
    color: #fff;
6740
    text-align: center;
6741
    font-size: 0.9em;
6742
    padding:2px 10px;
6743
    margin: 4px 6px;
6744
    margin-top: 7px;
6745
    font-weight: bold;
6746
}
6747

    
6748
#user_public_keys .private-cont .down-button {
6749
}
6750

    
6751
.models-view .form-field .field-desc {
6752
    font-style: italic;
6753
    font-size: 1em;
6754
    color: #888;
6755
}
6756

    
6757
.models-view .form-field.error label {
6758
    font-weight: bold;
6759
    color: #800 !important;
6760
}
6761

    
6762
.models-view .form-field .errors {
6763
    margin: 5px 0;
6764
}
6765

    
6766
.models-view .form-field .errors .error {
6767
    background-color: transparent;
6768
    border: none;
6769
    color: #800;
6770
}