Statistics
| Branch: | Tag: | Revision:

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

History | View | Annotate | Download (123 kB)

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
301
#createcontainer a {
302
}
303

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
944
.state {
945
}
946

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
1360
#machinesview {
1361
}
1362

    
1363
#machines-pane {
1364
}
1365

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
1620

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
1729

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
1941
div.confirm_reboot_required {
1942
}
1943

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
2257

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
2496
#networkscreate {
2497
}
2498

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

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

    
2513
#createcontainer {
2514
}
2515

    
2516
#networks-container {
2517
}
2518

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
2666
.state {
2667
}
2668

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

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

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

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

    
2703

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
2835
.private-networks .state {
2836
}
2837

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
2944
.machine-name .name {
2945
}
2946

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
3217
.metadata-left {
3218
}
3219

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
3787
.last .firewall-content {
3788
}
3789

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
3977
.feedback-form .description {
3978
    margin-bottom: 25px;
3979
}
3980

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

    
3988
.feedback-form .form-actions {
3989
    border-top: none;
3990
}
3991

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

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

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

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

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

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

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

    
4026
#feedback-form .data-text {
4027
    display: none;
4028
}
4029

    
4030
#feedback-form .message {
4031
    display: none;
4032
}
4033

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

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

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

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

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

    
4064
#feedback-form .submit-data {
4065
    display: none;
4066
}
4067

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

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

    
4084

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

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

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

    
4099
.popup-body .loading {
4100
    color: #fff;
4101
}
4102

    
4103
.popup-body .success {
4104
    color: #1F921A;
4105
}
4106

    
4107
.popup-body .errormsg {
4108
    color: #E32424;
4109
}
4110

    
4111

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

    
4120

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

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

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

    
4138
/*404 and 500 pages*/
4139

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

    
4146
.error_page h1 {
4147
    font-weight: normal;
4148
}
4149

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

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

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

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

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

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

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

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

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

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

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

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

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

    
4225
.error_404 .http_error .code {
4226
    letter-spacing: -7px;
4227
}
4228

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

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

    
4240

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

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

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

    
4257
.running .scrollable, .terminated .scrollable {
4258
    height: 42px;
4259
}
4260

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

    
4269
.items .tag-item .value {
4270
    color: #444;
4271
}
4272

    
4273
#machinesview-list {
4274
    display: none;
4275
}
4276

    
4277
#machinesview-single {
4278
    position: relative;
4279
    display: none;
4280
}
4281

    
4282
#machinesview-icon {
4283
    display: none;
4284
}
4285

    
4286
#machinesview-icon, #machinesview-single, #machinesview-list {
4287
    
4288
}
4289

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

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

    
4307
.slider .slider-point-light {
4308
    background-color: transparent;
4309
}
4310

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

    
4323
.slider .handle {
4324
    z-index: 50;
4325
}
4326

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

    
4334
.api_overlay_template {
4335
    display: none;
4336
}
4337

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

    
4343
#disks-pane {
4344
    margin-top: 58px;
4345
}
4346

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

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

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

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

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

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

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

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

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

    
4409
.overlay {
4410
    display: none;
4411
}
4412

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

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

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

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

    
4439
.overlay a {
4440
    color: #387693;
4441
}
4442

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

    
4454
.overlay .overlay-content .important {
4455
    color: #800000;
4456
}
4457

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

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

    
4479
.overlay h3.overlay-header .title {
4480
    float: left;
4481
}
4482

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

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

    
4502
.overlay .message {
4503
}
4504

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

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

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

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

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

    
4540
.overlay-error .container {
4541
    padding-top: 1.9em;
4542
}
4543

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

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

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

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

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

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

    
4583
.overlay-error .nav-btn:hover {
4584
    
4585
}
4586

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

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

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

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

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

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

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

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

    
4639
.overlay-info .overlay-header .title {
4640
    color: #fff;
4641
}
4642

    
4643
.overlay-info .overlay-header .closeme {
4644
    color: #fff;
4645
}
4646

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

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

    
4659
#loading-view .info {
4660
    color: #ddd;
4661
}
4662

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

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

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

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

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

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

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

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

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

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

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

    
4729
.options-list li.selected .options-object-cont .title {
4730
}
4731

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

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

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

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

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

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

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

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

    
4778
.options-list li.selected.options-object .value {
4779
}
4780

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

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

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

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

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

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

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

    
4817
#metadata-overlay-content {
4818
    position: relative;
4819
}
4820

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

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

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

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

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

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

    
4854
.vm-meta .form-field {
4855
    float: left;
4856
}
4857

    
4858
.vm-meta .form-actions .form-action {
4859
    float: left;
4860
    margin-right: 10px;
4861
    height: 11px;
4862
}
4863

    
4864
.vm-meta .editor .form-actions .cancel {
4865
    margin-right: 0;
4866
}
4867

    
4868
.vm-meta .editor .form-actions {
4869
    float: right;
4870
    margin:0;
4871
    padding:0;
4872
    margin-left: 15px;
4873
    margin-top: 0px;
4874
}
4875

    
4876
.vm-meta .editor {
4877
    background-color: rgba(64, 133, 165, 0.898) !important;
4878
    background-color: #649DB8;
4879
    font-size:0.9em;
4880
}
4881

    
4882
.vm-meta .meta-key-title {
4883
    font-size: 1.3em;
4884
    color: #fff;
4885
    margin-bottom: 10px;
4886
    display: none;
4887
    float: left;
4888
}
4889

    
4890
.vm-meta .editor-content {
4891
    padding: 10px;
4892
}
4893

    
4894
.vm-meta .inner-mask {
4895
    background-color: #fff;
4896
    opacity:0.6;
4897
    position: absolute;
4898
    top:0;
4899
    left:0;
4900
}
4901

    
4902
.vm-meta .editor label {
4903
    float: left;
4904
    color: #fff;
4905
    margin-right: 2px;
4906
    padding-top:4px;
4907
    font-size: 0.9em;
4908
}
4909

    
4910
.vm-meta .editor input {
4911
    border: none;
4912
    width: 170px;
4913
    margin-left: 10px;
4914
    font-size: 0.9em;
4915
    padding: 4px;
4916
}
4917

    
4918
.vm-meta li.create .options-object-cont {
4919
    background-color: #B3C9AD ;
4920
    border-color: #788774;
4921
}
4922
.vm-meta li.create .options-object-cont .value,
4923
.vm-meta li.create .options-object-cont .title {
4924
    color: #fff;
4925
}
4926

    
4927
#createvm-overlay-content {
4928
    padding: 0;
4929
}
4930

    
4931
.overlay-createvm .container {
4932
    width: 584px !important;
4933
}
4934

    
4935
.create-vm .header-step.current {
4936
    font-weight: bold;
4937
}
4938

    
4939
.create-vm .create-step-cont {
4940
    min-height: 240px;
4941
}
4942
.create-vm .create-controls {
4943
    padding: 10px;
4944
}
4945

    
4946
.create-vm ul li {
4947
    cursor: pointer;
4948
    padding: 4px;
4949
}
4950

    
4951
.create-vm ul li.selected {
4952
    background-color: #aaa;
4953
}
4954

    
4955
.cont-toggler {
4956
    background-image: url("../images/down-arrow.png");
4957
    background-position: right;
4958
    background-repeat: no-repeat;
4959
    background-color: #A1C8DB;
4960
    display: inline-block;
4961
    border-right: 6px solid #A1C8DB;
4962
    padding:2px;
4963
    padding-right: 14px;
4964
    padding-left:0;
4965
    cursor: pointer;
4966
    color: #fff;
4967
    font-size: 0.9em;
4968
}
4969

    
4970
.cont-toggler .label {
4971
    background-color: #98BDCF;
4972
    padding: 2px;
4973
    padding-left: 5px;
4974
    padding-right: 5px;
4975
}
4976

    
4977
.cont-toggler.open {
4978
    background-color: #98BDCF;
4979
    border-color: #98BDCF;
4980
    background-image: url("../images/up-arrow.png");
4981
}
4982

    
4983
.cont-toggler.open .label {
4984
    background-color: #4085A5;
4985
}
4986

    
4987
.overlay .form label {
4988
    font-color: #444;
4989
    margin-right: 10px;
4990
}
4991

    
4992
.form-field.error label {
4993
    color: #ff0000;
4994
    text-decoration: underline;
4995
}
4996

    
4997
.form-field input {
4998
    border: 1px solid #aaa;
4999
    width: 200px;
5000
    padding: 3px;
5001
}
5002

    
5003
.form-actions {
5004
    margin-top: 5px;
5005
    padding-top:5px;
5006
    border-top: 1px solid #64a6c4;
5007
    font-size: 0.8em;
5008
}
5009

    
5010
.form-actions.plain {
5011
    margin-top: 0px;
5012
    padding-top:0px;
5013
    border-top: 0px;
5014
}
5015

    
5016
.form-action {
5017
    float: right;
5018
    min-width: 140px;
5019
    background-color: #FF7F2A;
5020
    border: 1px solid #FF7F2A;
5021
    text-align: center;
5022
    color: #FFFFFF;
5023
    cursor: pointer;
5024
    padding: 4px;
5025
}
5026

    
5027
.form-action:hover {
5028
    background-color: #FF9955;
5029
    color: #FFF;
5030
}
5031

    
5032
.form-action.prev,
5033
.form-action.cancel {
5034
    background-color: #800;
5035
    border: 1px solid #800;
5036
    float: left;
5037
}
5038

    
5039
.form-action.prev:hover,
5040
.form-action.cancel:hover {
5041
    background-color: #CC0000;
5042
    color: #fff;
5043
}
5044

    
5045
.form-action.next,
5046
.form-action.ok {
5047
    background-color: #080;
5048
    border: 1px solid #080;
5049
}
5050

    
5051
.form-action.next:hover,
5052
.form-action.ok:hover {
5053
    background-color: #00aa00;
5054
    color: #fff;
5055
}
5056

    
5057
.form-action .create,
5058
.form-action .submit {
5059

    
5060
}
5061

    
5062
.form-action.in-progress, button.in-progress {
5063
    background-image: url("../images/icons/indicators/medium/horizontal-progress.gif");
5064
    background-repeat: no-repeat;
5065
    background-position: center center;
5066
    color: transparent;
5067
}
5068

    
5069
#createvm-overlay-content {
5070
    padding: 0;
5071
}
5072

    
5073
.create-vm .image-details.selected .size {
5074

    
5075
}
5076

    
5077
.create-vm .image-details .show-details:hover {
5078
    color: #aaa !important; 
5079
}
5080
.create-vm .image-details.selected .show-details:hover {
5081
    color: #fff !important; 
5082
}
5083

    
5084
.create-vm .image-details.selected .show-details,
5085
.create-vm .image-details.selected .size {
5086
    color: #eee;
5087
}
5088

    
5089
.create-vm .image-details.selected span.owner {
5090
    color: #fff;
5091
}
5092

    
5093

    
5094
.create-vm .image-details p {
5095
    font-size: 0.8em;
5096
    padding-left: 27px;
5097
    display:block;
5098
}
5099

    
5100
.create-vm .image-details span.owner {
5101
    display: block;
5102
    font-size: 0.9em;
5103
    float: right;
5104
    color: #FF7F2A;
5105
    position: absolute;
5106
    top: 5px;
5107
    right: 5px;
5108
}
5109

    
5110
.create-vm .select-image .show-details {
5111
    display: none;
5112
    font-size: 0.8em;
5113
    text-decoration: underline;
5114
    color: #000;
5115
    position: absolute;
5116
    bottom: 5px;
5117
    right: 5px;
5118
}
5119

    
5120
.create-vm .image-details .size {
5121
    margin-top: 2px;
5122
    font-size: 0.8em;
5123
    color: #aaa;
5124
    margin-left: 10px;
5125
}
5126

    
5127
.create-vm .step-cont {
5128
    margin: 15px;
5129
}
5130

    
5131
.create-vm .create-step-cont {
5132
    min-height: 250px;
5133
    float: left;
5134
    width: 584px;
5135
}
5136

    
5137
.create-vm .create-controls {
5138
    padding: 10px;
5139
    border-top: 1px solid #ddd;
5140
}
5141

    
5142
.create-vm .empty {
5143
    font-size: 0.8em;
5144
    color: #444;
5145
}
5146

    
5147
.create-vm h4 {
5148
    color: #5CA1C0;
5149
    margin-bottom: 0.5em;
5150
    font-family: arial;
5151
}
5152
.create-vm ul li {
5153
    cursor: pointer;
5154
    padding: 4px;
5155
    font-size: 0.9em;
5156
}
5157

    
5158
.create-vm .create-step-cont li.ssh-key-option.selected,
5159
.create-vm ul li.selected {
5160
    background-color: #FF7F2A;
5161
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5162
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5163
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5164
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5165
    color: #fff;
5166
}
5167

    
5168
.create-vm .images-list-cont.loading .loading-indicator {
5169
    display: block !important;
5170
}
5171

    
5172
.create-vm .images-list-cont .loading-indicator {
5173
    display: none;
5174
    position: absolute;
5175
    right: -13px;
5176
    top: 2px;
5177
    width: 30px;
5178
    height: 10px;
5179
    background-repeat: no-repeat;
5180
    background-image: url("../images/icons/indicators/medium/progress.gif");
5181
}
5182

    
5183
.create-vm .images-list-cont h4 {
5184
    position: relative;
5185
}
5186

    
5187
.create-vm .images-list-cont {
5188
    width: 40%;
5189
    float: left;
5190
    padding-left: 3%;
5191
    padding-right: 3%;
5192
}
5193

    
5194
.create-vm li p.desc {
5195
    font-size: 0.9em;
5196
}
5197

    
5198
.create-vm p.desc.warning {
5199
    color: #880000;
5200
}
5201

    
5202
.create-vm p.desc.empty {
5203
    color: #000;
5204
}
5205

    
5206
.create-vm p.desc {
5207
    font-size: 0.8em;
5208
    color: #888;
5209
    margin-bottom: 10px;
5210
}
5211

    
5212
.create-vm li.role .values .val:hover {
5213
    background-color: #eee;
5214
}
5215
.create-vm li.role .values .val.selected,  .create-vm li.role .values .val.selected:hover {
5216
    color: #fff;
5217
    background-color: #FF9955;
5218
}
5219

    
5220
.create-vm .images-filter-cont, .create-vm .flavors-predefined-cont {
5221
    width: 18%;
5222
    padding-right: 4%;
5223
    float:left;
5224
    border-right: 1px solid #A1C8DB;
5225
    overflow: auto;
5226
}
5227

    
5228
.create-vm .flavor-options-cont {
5229
    width: 74%;
5230
    float: left;
5231
    margin-left: 20px;
5232
}
5233

    
5234
.create-vm .flavor-options-cont .flavor-options li:hover {
5235
    background-image:-webkit-linear-gradient(top, #E8F4FA, #D1E7F0);
5236
    background-image:-o-linear-gradient(top, #E8F4FA, #D1E7F0);
5237
    background-image:-moz-linear-gradient(top, #E8F4FA, #D1E7F0);
5238
    background-image:linear-gradient(top, #E8F4FA, #D1E7F0);
5239
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E8F4FA', endColorstr='#D1E7F0', GradientType=0);
5240
}
5241

    
5242
.create-vm .flavor-options-cont .flavor-options li.disabled * {
5243
    color: #eee !important;
5244
}
5245

    
5246
.create-vm .flavor-options-cont .flavor-options li.disabled {
5247
    background-image:linear-gradient(top, #aaa, #ddd);
5248
    background-image:-webkit-linear-gradient(top, #aaa, #ddd);
5249
    background-image:-o-linear-gradient(top, #aaa, #ddd);
5250
    background-image:-moz-linear-gradient(top, #aaa, #ddd);
5251
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#aaaaaa', endColorstr='#dddddd', GradientType=0);
5252
}
5253

    
5254
.create-vm .flavor-options-cont .flavor-options li.selected {
5255
    background-color: #FF9955;
5256
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5257
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5258
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5259
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5260
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF9955', endColorstr='#E88B4D', GradientType=0);
5261
    border: 1px solid #C97943;
5262
}
5263

    
5264
.create-vm .predefined-list li.disabled {
5265
    color: #ddd !important;
5266
}
5267

    
5268
.create-vm .flavor-options-cont .flavor-options li {
5269
    display: block;
5270
    float: left;
5271
    margin-right: 10px;
5272
    margin-bottom: 9px;
5273
    padding: 9px 14px;
5274
    border: 1px solid #aaa;
5275
    background-image:-webkit-linear-gradient(top, #D1E7F0, #E8F4FA);
5276
    background-image:-o-linear-gradient(top, #D1E7F0, #E8F4FA);
5277
    background-image:-moz-linear-gradient(top, #D1E7F0, #E8F4FA);
5278
    background-image:linear-gradient(top, #D1E7F0, #E8F4FA);
5279
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D1E7F0', endColorstr='#E8F4FA', GradientType=0);
5280
}
5281

    
5282
.create-vm .flavor-options-cont .flavor-options {
5283
    margin-bottom: 2px;
5284
}
5285

    
5286

    
5287
.create-vm .flavor-options .metric {
5288
    font-size: 0.8em;
5289
    margin-left: 2px;
5290
}
5291

    
5292
.create-vm .flavor-options span.title {
5293
    color: #444;
5294
}
5295

    
5296
.create-vm .flavor-options span.desc {
5297
    display: block;
5298
    color: #aaa;
5299
    font-weight: normal;
5300
    font-size: 0.8em;
5301
    float: right;
5302
    margin-top: 4px;
5303
}
5304

    
5305
.disktip {
5306
    padding: 4px;
5307
    top: 20px;
5308
}
5309

    
5310
.create-vm .flavor-options .flavors-disk-template-list {
5311
    position: relative;
5312
}
5313

    
5314
.create-vm .flavor-options .disk_template.option {
5315
    z-index: 10;
5316
    min-width: 50px;
5317
    text-align: center;
5318
}
5319

    
5320
/*0 position is -470px*/
5321
.create-vm .flavor-options .disk-template-description {
5322
    font-size: 0.8em;
5323
    color: #444;
5324
    background-image: url("../images/horizontal-pointer.png");
5325
    background-repeat: repeat-x;
5326
    background-position: -470px 0;
5327
    padding-top: 15px;
5328
    margin-top: -10px;
5329
    font-style: italic;
5330
    display:block;
5331
    overflow: auto;
5332
    padding-bottom: 0px;
5333
    margin-bottom: 7px;
5334
    width: 100%;
5335
}
5336

    
5337
.create-vm .flavor-options .disk_template.option .description {
5338
    display: none;
5339
    position: absolute;
5340
    bottom: -20px;
5341
    left:0;
5342
    color: #888;
5343
    font-style: italic;
5344
    display: block;
5345
    background-color: #fff;
5346
    width: 100%;
5347
    text-align: left;
5348
    z-index: 0;
5349
    border-top: 1px solid #ddd;
5350
    padding-top: 3px;
5351
    display: none;
5352
}
5353

    
5354
.create-vm .flavor-options .selected .value {
5355
    color: #FFF;
5356
}
5357

    
5358
.create-vm .flavor-options .value {
5359
    font-weight: bold;
5360
    color: #5CA1C0;
5361
}
5362

    
5363
.create-vm .flavor-options-cont h4 {
5364
    border-bottom: 1px solid #A1C8DB;
5365
    padding-bottom: 5px;
5366
}
5367

    
5368
.create-vm .images-info-cont {
5369
    width: 28%;
5370
    padding-left: 3%;
5371
    float: left;
5372
    border-left: 1px solid #A1C8DB;
5373
}
5374

    
5375
.create-vm .select-image.wide .show-details {
5376
    display: inline;
5377
}
5378

    
5379
.create-vm .select-image .images-info-cont .hide {
5380
    display: none;
5381
}
5382

    
5383
.create-vm .select-image.wide .images-info-cont .hide {
5384
    display: block;
5385
    float: right;
5386
    position: absolute;
5387
    right: 10px;
5388
    top: 10px;
5389
    font-size: 0.8em;
5390
    text-decoration: underline;
5391
    color: #5CA1C0;
5392
    cursor: pointer;
5393
}
5394

    
5395
.create-vm .select-image.wide .images-list-cont {
5396
    width: 74%;
5397
    padding-right: 0;
5398
}
5399

    
5400
.create-vm .select-image.wide .images-info-cont .description .title {
5401
    display: none;
5402
    float: none;
5403
}
5404

    
5405
.create-vm .select-image.wide .images-info-cont .description p {
5406
    background-color: #fff;
5407
    border: 1px solid #ddd;
5408
    padding: 10px;
5409
    float: none;
5410
}
5411

    
5412
.create-vm .select-image.wide .selected .size {
5413
    color: #FFF !important;
5414
}
5415

    
5416
.create-vm .select-image.wide .image-details .size {
5417
    color: #5CA1C0;
5418
    position: absolute;
5419
    top: 5px;
5420
}
5421

    
5422
.create-vm .select-image.wide .images-info-cont h3 {
5423
    color: #5CA1C0;
5424
    margin: 10px 0;
5425
    margin-top: 5px;
5426
    text-align: left;
5427
    font-size: 0.9em;
5428
}
5429

    
5430
.create-vm .select-image.wide .images-info-cont .description p {
5431
    height: 50px;
5432
}
5433

    
5434
.create-vm .select-image.wide .images-info-cont .description {
5435
    width: 100% !important;
5436
    float: none !important;
5437
    background-color: transparent !important;
5438
    padding: 0 !important;
5439
    font-size: 1.1em;
5440
}
5441
.create-vm .select-image.wide .images-info-cont .extra-details {
5442
    height: 160px;
5443
    overflow-y: scroll;
5444
    padding-right: 15px;
5445
}
5446

    
5447
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail {
5448
    padding: 0px;
5449
    background-color: transparent;
5450
    margin-bottom: 4px;
5451
}
5452

    
5453
.create-vm .select-image.wide .images-info-cont .extra-details .title {
5454
    float: left;
5455
    display: block;
5456
    width: 39%;
5457
    padding: 1%;
5458
    background-color: #5CA1C0;
5459
    color: #fff;
5460
    border: 1px solid #4F8DAA;
5461
    font-size: 0.8em;
5462
}
5463

    
5464
.create-vm .select-image.wide .images-info-cont .extra-details .value {
5465
    float: right;
5466
    display: block;
5467
    width: 55%;
5468
    padding: 1%;
5469
    border: none;
5470
    background-color: #FFF;
5471
    color: #444;
5472
    border: 1px solid #ddd;
5473
    margin-bottom: 0px;
5474
    font-size: 0.8em;
5475
}
5476

    
5477
.create-vm .select-image.wide .images-info-cont .image-detail {
5478
}
5479

    
5480
.create-vm .select-image.wide ul.images-list {
5481
    height: 310px;
5482
    overflow-y: scroll;
5483
    padding-right: 3%;
5484
}
5485

    
5486
.create-vm .select-image.wide .images-info-cont {
5487
    position: absolute;
5488
    width: 88%;
5489
    background-color: #DAE9F0;
5490
    padding: 2%;
5491
    border-left: none;
5492
    height: 320px;
5493
    box-shadow: 0px 0px 2px #aaa;
5494
    -moz-box-shadow: 0px 0px 2px #aaa;
5495
    -webkit-box-shadow: 0px 0px 2px #aaa;
5496
    display: none;
5497
}
5498

    
5499

    
5500
.create-vm .images-info-cont h4, .create-vm .create-step-cont .param h4{
5501
    color: #FF9955;
5502
    margin-bottom: 1em;
5503
    font-size: 1.2em;
5504
}
5505

    
5506
.create-vm .images-info-cont span.title {
5507
    color: #4085A5;
5508
    display: block;
5509
    margin-bottom: 2px;
5510
    font-size: 0.8em;
5511
}
5512

    
5513
.create-vm .type-filter li {
5514
    font-size: 0.8em;
5515
    /*font-weight: bold;*/
5516
    padding: 4px;
5517
    margin-bottom: 0px;
5518
    color: #FF7F2A;
5519
}
5520

    
5521
.create-vm .images-list li {
5522
    min-height: 30px;
5523
}
5524
.create-vm .images-list .image-details:hover {
5525
    background-color: #eee;
5526
}
5527

    
5528
.create-vm .images-list .image-details.selected:hover {
5529
    background-color: #FF7F2A;
5530
}
5531

    
5532
.create-vm .images-list .image-details.selected {
5533
    /*font-weight: bold;*/
5534
}
5535

    
5536
.create-vm .images-list .image-details {
5537
    padding: 6px;
5538
    margin-bottom:1px;
5539
    position: relative;
5540
}
5541

    
5542
.create-vm .images-list .image-details img {
5543
    vertical-align: middle;
5544
    margin-right: 10px;
5545
}
5546

    
5547
.create-vm .images-info-cont .image-detail:last-child p {
5548
    border-bottom: none;
5549
}
5550

    
5551
.create-vm .images-info-cont h4 img {
5552
    vertical-align: middle;
5553
    margin-right: 7px;
5554
    margin-bottom: 5px;
5555
}
5556

    
5557
.create-vm .images-info-cont .description p {
5558
    font-size: 0.8em;
5559
}
5560

    
5561
.create-vm .images-info-cont p {
5562
    margin-bottom: 7px;
5563
    font-size: 0.9em;
5564
    border-bottom: 1px solid #A1C8DB;
5565
    padding-bottom: 7px;
5566
}
5567

    
5568
.create-vm .step-header {
5569
    padding-bottom:0;
5570
    position: relative;
5571
}
5572

    
5573
.create-vm .step-header .header-step .info span.subtitle {
5574
    font-size: 1.2em;
5575
    color: #fff;
5576
    font-weight: bold;
5577
}
5578

    
5579
.create-vm .step-header .header-step .info span {
5580
    float: none;
5581
    text-align: right;
5582
}
5583

    
5584
.create-vm .step-header .header-step .info {
5585
    position: absolute;
5586
    right: 15px;
5587
    top: 20px;
5588
    font-size: 0.8em;
5589
}
5590

    
5591
.create-vm .step-header .header-step span {
5592
    float: left;
5593
    display: block;
5594
}
5595

    
5596
.create-vm .steps-container {
5597
    width: 2000em;
5598
}
5599

    
5600
.create-vm .step-header .header-step .title {
5601
    margin-top: 20px;
5602
    font-size: 1em;
5603
    margin-left: 10px;
5604
}
5605

    
5606
#createvm-overlay-content {
5607
    width: 584px;
5608
    overflow: hidden;
5609
}
5610

    
5611
.create-vm .steps-history .steps-history-cont.current .title {
5612
    display: block;
5613
    top: 23px;
5614
    left: 43px;
5615
    font-size: 1.2em;
5616
    color: #ffffff;
5617
    font-weight: bold;
5618
    font-family: 'Ubuntu', sans-serif !important;
5619
}
5620

    
5621
.create-vm .steps-history .steps-history-cont.current .subnum {
5622
    display: none;
5623
    float: none;
5624
    font-size: 0.9em;
5625
    font-family: 'Ubuntu', sans-serif  !important;
5626
}
5627

    
5628
.create-vm .steps-history .steps-history-cont.current .subtitle,
5629
.create-vm .steps-history .steps-history-cont.current .description {
5630
    font-family: 'Ubuntu', sans-serif  !important;
5631
}
5632

    
5633
.create-vm .steps-history .steps-history-cont.current .info {
5634
    display: block;
5635
    font-family: 'Ubuntu', sans-serif !important;
5636
}
5637

    
5638
.create-vm .steps-history .steps-history-cont.completed .title,
5639
.create-vm .steps-history .steps-history-cont.completed .num {
5640
    color: #A1C8DB;
5641
}
5642

    
5643
.create-vm .steps-history .steps-history-cont.completed {
5644
    background-color: #4085A5;
5645
    color: #fff;
5646
    cursor: pointer;
5647
}
5648

    
5649
.create-vm .steps-history .steps-history-cont.completed .steps-history-step {
5650
    background-image: url("../images/check.png");
5651
}
5652

    
5653
.create-vm .steps-history .steps-history-cont.current .steps-history-step {
5654
    width: 320px;
5655
}
5656

    
5657
.create-vm .steps-history .steps-history-cont.current .num {
5658
    color: #fff;
5659
}
5660

    
5661
.create-vm .steps-history .steps-history-cont.current .info {
5662
    color: #4085A5;
5663
    font-size: 0.8em;
5664
}
5665

    
5666
.create-vm .steps-history .steps-history-cont.current {
5667
    background-color: #A1C8DB;
5668
    color: #fff;
5669
    width: 428px;
5670
}
5671

    
5672
.create-vm .steps-history-step {
5673
    padding: 4px;
5674
    padding-left: 7px;
5675
    font-size: 1em;
5676
    font-family: 'Ubuntu', sans-serif  !important;
5677
    margin-right: 5px;
5678
    padding-top: 12px;
5679
    background-position: right 30px;
5680
    background-image: none;
5681
    background-repeat: no-repeat;
5682
}
5683

    
5684
.create-vm .steps-history {
5685
    background-color: #4085A5;
5686
}
5687

    
5688
.create-vm .steps-history .steps-history-cont.last {
5689
    border-right: none;
5690
}
5691

    
5692
.create-vm .steps-history .steps-history-cont .num {
5693
    margin-left: 5px;
5694
    margin-top: -10px;
5695
    padding-bottom: 10px;
5696
}
5697

    
5698
.create-vm .steps-history .steps-history-cont .title {
5699
    display: none;
5700
    position: absolute;
5701
    bottom: 0px;
5702
    text-align: center;
5703
    padding-bottom: 2px;
5704
    left:0;
5705
    width: 55px;
5706
    margin-left:0;
5707
    margin-top:0;
5708
    font-size: 0.8em;
5709
}
5710

    
5711
.create-vm .steps-history .steps-history-cont .subnum,
5712
.create-vm .steps-history .steps-history-cont .info {
5713
    display: none;
5714
}
5715

    
5716
.create-vm .steps-history .steps-history-cont {
5717
    height: 70px;
5718
    width: 51px;
5719
    float: left;
5720
    color: #fff;
5721
    border-right: 1px solid #A1C8DB;
5722
    color: #A1C8DB;
5723
    background-color: #4085A5;
5724
    background-position: center right;
5725
    background-image: none;
5726
    background-repeat: no-repeat;
5727

    
5728
    -webkit-transition: background-color .15s ease-in;
5729
    -o-transition: background-color .15s ease-in;
5730
    -moz-transition: background-color .15s ease-in;
5731
    transition: background-color .15s ease-in;
5732

    
5733
    border-bottom: 1px solid #aaa;
5734
}
5735

    
5736
.create-vm .step-header .header-step .num {
5737
    color: #225871;
5738
    font-size: 4em;
5739
    margin-bottom: -5px;
5740
    font-family: 'Ubuntu', sans-serif;
5741
    font-weight: normal !important;
5742
}
5743

    
5744
.create-vm .step-header .header-step {
5745
    color: #;
5746
    margin-bottom: -6px;
5747
    width: 25%;
5748
    padding-left: 0%;
5749
    display: block;
5750
    float: left;
5751
}
5752

    
5753
.create-vm .step-header .header-step.current {
5754
    color: #387693;
5755
}
5756

    
5757
.create-vm .image-filters-title {
5758
    margin-top: 1em;
5759
    margin-bottom: 0.5em;
5760
}
5761

    
5762
.create-vm .create-step-cont span.clear {
5763
    font-size: 0.8em;
5764
    font-weight: bold;
5765
    color: #A1C8DB;
5766
    display: block;
5767
}
5768

    
5769
.create-vm .category-filters li {
5770
    float:left;
5771
    display: block;
5772
    padding: 4px;
5773
    background-color: #eee;
5774
    margin-right: 5px;
5775
    font-size: 0.9em;
5776
    margin-bottom: 5px;
5777
}
5778

    
5779
.create-vm .content-cont {
5780
    height: 340px;
5781
    overflow: auto;
5782
}
5783

    
5784
.create-vm .vm-confirm .confirm-params span.cval {
5785
    margin-left: 8px;
5786
    color: #444;
5787
}
5788

    
5789
.create-vm .vm-confirm .confirm-params span.ckey {
5790
    color: #4085A5;
5791
    font-weight: bold;
5792
}
5793

    
5794
.create-vm .vm-confirm .confirm-params {
5795
    margin-bottom: 15px;
5796
}
5797

    
5798
.create-vm .vm-confirm h3.vm-name {
5799
    background-repeat: no-repeat;
5800
    background-position: left center;
5801
    font-size: 1.4em;
5802
    padding-left: 1.45em;
5803
    color: #4085A5;
5804
}
5805

    
5806
.create-vm .images-list-cont h4 a {
5807
    margin-top: 3px;
5808
    margin-right: -2px !important;
5809
}
5810
.create-vm .images-list-cont h4 a,
5811
.create-vm .list-cont h4 a {
5812
    font-size: 0.8em;
5813
    font-weight: normal;
5814
    margin-right: 5px;
5815
    float: right;
5816
    color: #FF7F2A;
5817
}
5818

    
5819
.create-vm .confirm-params {
5820
    overflow: auto;
5821
}
5822

    
5823
.create-vm .vm-confirm .ssh.confirm-params {
5824
    max-height: 150px;
5825
}
5826

    
5827
.create-vm .personalize-cont .confirm-params {
5828
    max-height: 216px;
5829
}
5830

    
5831
.create-vm .personalize-cont,
5832
.create-vm .confirm-cont {
5833
    height: 250px;
5834
}
5835

    
5836
.create-vm .create-step-cont .rename input.rename-field {
5837
    font-size: 1.4em;
5838
    padding: 5px;
5839
    width: 93%;
5840
    padding-left: 30px;
5841
    background-position: 7px center;
5842
    background-repeat: no-repeat;
5843
}
5844

    
5845
.create-vm .create-step-cont .rename label {
5846
    display: block;
5847
}
5848

    
5849
.create-vm .create-step-cont .personalize-conts,
5850
.create-vm .create-step-cont .confirm-conts {
5851
    margin-top: 20px;
5852
}
5853

    
5854
.create-vm .create-step-cont .personalize-cont,
5855
.create-vm .create-step-cont .confirm-cont {
5856
    width: 30%;
5857
    margin-right: 2%;
5858
    border-right: 1px solid #A1C8DB;
5859
    float: left;
5860
}
5861

    
5862
.create-vm .create-step-cont .confirm-cont ul li .title {
5863
    width: 55px;
5864
    float: left;
5865
}
5866

    
5867
.create-vm .create-step-cont .list-cont ul li .value {
5868
    float: right;
5869
    padding-top: 2px;
5870
    display: block;
5871
    width: 90px;
5872
    text-align: right;
5873
}
5874

    
5875
.create-vm .create-step-cont .list-cont ul li.flavor-disktype .value {
5876
    width: 45px;
5877
}
5878

    
5879
.create-vm .create-step-cont .list-cont ul li.image-description .value,
5880
.create-vm .create-step-cont .list-cont ul li.image-name .value {
5881
    float: none;
5882
    width: auto;
5883
    text-align:left;
5884
    width: auto;
5885
}
5886

    
5887
.create-vm .create-step-cont .list-cont ul li {
5888
    padding:0;
5889
    margin:0;
5890
    margin-bottom: 5px;
5891
    border-bottom: 1px solid #EEE;
5892
    padding-bottom: 7px;
5893
    margin-right: 10px;
5894
}
5895

    
5896
.create-vm .create-step-cont li.ssh-key-option .check {
5897
    float: right;
5898
    margin-right: 5px;
5899
    margin-top: 0px;
5900
}
5901

    
5902
.create-vm .create-step-cont li.ssh-key-option.selected {
5903
}
5904
.create-vm .create-step-cont li.ssh-key-option.selected:hover {
5905
    background-color: #F95;
5906
}
5907

    
5908
.create-vm .create-step-cont li.ssh-key-option:hover {
5909
    background-color: #eee;
5910
}
5911

    
5912
.create-vm .create-step-cont li.ssh-key-option.selected {
5913
}
5914

    
5915
.create-vm .create-step-cont li.ssh-key-option {
5916
    padding: 6px !important;
5917
}
5918

    
5919
.create-vm .create-step-cont .list-cont.ssh {
5920
    width: 60%;
5921
}
5922

    
5923
.create-vm .create-step-cont .list-cont.meta h4 {
5924
    margin-right: 0;
5925
}
5926

    
5927
.create-vm .create-step-cont .list-cont.meta {
5928
    margin-right:0;
5929
    border-right: none;
5930
    width: 195px;
5931
}
5932

    
5933
.create-vm .list-cont > h4 {
5934
    font-size: 1.2em;
5935
    margin-right: 10px;
5936
    border-bottom: 1px solid #A1C8DB;
5937
    padding-bottom: 5px;
5938
    color: #387693;
5939
}
5940

    
5941
.create-vm .list-cont .param.image-name {
5942
    margin-bottom: 0 !important;
5943
    border-bottom: none !important;
5944
}
5945

    
5946
.create-vm .list-cont .param h4 {
5947
    margin-bottom: 0px !important;
5948
    font-size: 1.1em !important; 
5949
}
5950

    
5951
.create-vm .list-cont .param {
5952
    margin-bottom: 7px !important;
5953
}
5954

    
5955
.create-vm .list-cont .value {
5956
    font-weight: bold;
5957
}
5958

    
5959
.create-vm .list-cont .param .value {
5960
    font-size: 0.9em;
5961
}
5962

    
5963
.create-vm .list-cont .param .title {
5964
    color: #387693;
5965
}
5966

    
5967
.create-vm .list-cont .image-description {
5968
    margin-left:0;
5969
}
5970

    
5971
.create-vm .list-cont .image-description .value {
5972
    font-weight: normal;
5973
    margin-left: 0 !important;
5974
}
5975

    
5976
.create-vm .list-cont .image-description .title {
5977
    display: none;
5978
    font-size: 0.8em;
5979
}
5980

    
5981
.create-vm .list-cont.meta .values span {
5982
    display:block;
5983
    float: left;
5984
    margin-right: 4px;
5985
    border: 1px solid #eee;
5986
    padding:3px;
5987
    margin-bottom: 4px;
5988
    font-size: 0.9em;
5989
}
5990

    
5991
.create-vm .list-cont.meta .key {
5992
    font-weight: bold;
5993
    font-size: 0.9em;
5994
    display: block;
5995
    margin-bottom: 5px;
5996
}
5997

    
5998
.create-vm .meta input {
5999
    font-size: 0.8em;
6000
}
6001

    
6002
.vm-connect .connect-cont {
6003
    margin-bottom: 20px;
6004
    border-bottom: 1px solid #A1C8DB;
6005
    padding-bottom: 20px;
6006
}
6007

    
6008
.vm-connect .connection-info {
6009
    padding-bottom: 0px;
6010
    margin-bottom: 0;
6011
    border-bottom: none;
6012
}
6013

    
6014
.vm-connect .connection-info .connect a {
6015
    color: #fff;
6016
}
6017

    
6018
.vm-connect .connection-info .connect {
6019
    background-color: #387693;
6020
    color: #fff;
6021
    padding: 10px;
6022
    font-size: 1.2em;
6023
    text-align: center;
6024
}
6025

    
6026
.clip-copy {
6027
    display: block;
6028
    width: 20px;
6029
    height: 20px;
6030
    position: absolute;
6031
    border: 1px solid #387693;
6032
    background-image: url("../images/clipboard.png");
6033
    background-repeat: no-repeat;
6034
    background-position: center;
6035
    cursor: pointer;
6036
    background-color: #A1C8DB;
6037
}
6038

    
6039
.password-cont .clip-copy { right: 10px; top: 8px;}
6040

    
6041

    
6042
.overlay-invitations {
6043
    width: 680px;
6044
}
6045
.invitations-form .sending .sending-msg {
6046
    font-size: 0.8em;
6047
    display: block !important;
6048
    margin-bottom: 5px;
6049
    color: #008800;
6050
}
6051

    
6052
.invitations-form .send-error {
6053
    font-size: 0.8em;
6054
    margin-bottom: 5px;
6055
    margin-top: 5px;
6056
    color: #800;
6057
    padding: 3px;
6058
    padding-left: 0;
6059
    display: none;
6060
}
6061

    
6062
.invitations-form .error label {
6063
    color: #000 !important;
6064
}
6065

    
6066
.invitations-form .form-field {
6067
    width: 49%;
6068
    float: left;
6069
}
6070

    
6071
.invitations-view .left.none {
6072
    background-color: #880000;
6073
}
6074

    
6075
.invitations-form {
6076
    position: relative;
6077
}
6078

    
6079
.invitations-form h3 {
6080
    float: left;
6081
}
6082

    
6083
.invitations-form .add-new-invitation {
6084
    float:left;
6085
    top:2px;
6086
    right: 20px;
6087
    width: 16px;
6088
    height: 16px;
6089
    background-image: url("../images/option-action-add.png");
6090
    background-repeat: no-repeat;
6091
    background-position: center;
6092
    text-indent: -50000em;
6093
    background-color: #4085A5;
6094
    margin-left: 15px;
6095
    cursor: pointer;
6096
}
6097

    
6098
.invitations-view .left {
6099
    font-size: 1em;
6100
    color: #fff;
6101
    font-weight: bold;
6102
    background-color: #4085A5;
6103
    padding: 4px;
6104
}
6105

    
6106
input.has-errors {
6107
    border-color: #ff0000;
6108
}
6109

    
6110
.none-left .invitations-wrapper .invitations-list {
6111
    width: 100% !important;
6112
    border-left: none !important;
6113
    padding-left: 0;
6114
}
6115

    
6116
.invitations-wrapper .invitations-list {
6117
    width: 40%;
6118
    float: left;
6119
    padding-left: 10px;
6120
    border-left: 1px solid #4085A5;
6121
    margin-left: -1px
6122
}
6123

    
6124
.invitations-wrapper .invitations-form {
6125
    width: 57%;
6126
    float: left;
6127
    border-right: 1px solid #4085A5;
6128
}
6129

    
6130
.invitations-wrapper label span {
6131
    color: #aaa;
6132
    font-size: 0.8em;
6133
}
6134

    
6135
.invitations-wrapper label {
6136
    display: block;
6137
    font-size: 0.9em;
6138
    margin-bottom:10px;
6139
    font-weight: bold;
6140
}
6141

    
6142
.invitations-view .add-new-invitation {
6143
    cursor: pointer;
6144
}
6145

    
6146
.invitations-wrapper input.name {
6147
    width: 150px;
6148
}
6149

    
6150
.invitations-wrapper input {
6151
    font-size: 0.9em;
6152
    width: 155px;
6153
    padding:4px;
6154
}
6155

    
6156
.invitations-list .invitation-sent {
6157
    border-bottom: 1px solid #A1C8DB;
6158
    padding-bottom: 5px;
6159
    margin-bottom: 5px;
6160
    position: relative;
6161
}
6162

    
6163
.invitations-view h3 {
6164
    margin-bottom: 10px;
6165
    color: #4085A5;
6166
}
6167

    
6168
.invitations-list .invitation-sent.last,
6169
.invitations-list .invitation-sent:last-child {
6170
    border-bottom: none;
6171
}
6172

    
6173

    
6174
.invitations-list .invitation-sent .email {
6175
    color: #D98147;
6176
    font-size: 0.8em;
6177
    font-weight: bold;
6178
    margin-top: 2px;
6179
}
6180

    
6181
.invitations-list .pagination a,
6182
.invitations-list .pagination span {
6183
    padding: 0.2em 0.3em;
6184
}
6185

    
6186
.invitations-list .pagination {
6187
    font-size: 0.75em;
6188
}
6189

    
6190
.invitations-list .name {
6191
    color: #444;
6192
    font-size: 0.9em;
6193
}
6194

    
6195
.invitations-list .status.sending {
6196
    background-image: url("../images/icons/indicators/small/progress.gif");
6197
}
6198

    
6199
.invitations-list .status.sent {
6200
    background-image: url("../images/invitation_accepted.png");
6201
}
6202

    
6203
.invitations-list .status.resend {
6204
    background-image: url("../images/resend.png");
6205
}
6206

    
6207
.invitations-list .status.resend {
6208
    cursor: pointer;
6209
}
6210

    
6211
.invitations-list .status {
6212
    width: 20px;
6213
    height: 15px;
6214
    position: absolute;
6215
    top:5px;
6216
    right: 2px;
6217
    background-repeat: no-repeat;
6218
    background-position: center;
6219
}
6220

    
6221
.invitations-form .form-entry:last-child {
6222
    border-bottom: none;
6223
}
6224

    
6225
.invitations-form .form-entry {
6226
    position: relative;
6227
    margin-bottom: 10px;
6228
    padding-bottom: 10px;
6229
    border-bottom: 1px solid #ddd;
6230
    margin-right: 10px;
6231
}
6232

    
6233
.invitations-form .send-invitations {
6234
    float: left;
6235
    padding: 5px;
6236
    color: #fff;
6237
    margin-right: 10px;
6238
    margin-top: 10px;
6239
}
6240

    
6241
.invitations-form .form-entry.error {
6242
    padding-bottom: 0px;
6243
}
6244

    
6245
.invitations-form .form-entry.error .remove-invitation {
6246
    bottom: 32px;
6247
}
6248

    
6249
.invitations-form .remove-invitation {
6250
    padding: 5px;
6251
    background-image: url("../images/option-action-remove.png");
6252
    background-position: center;
6253
    background-repeat: no-repeat;
6254
    color: #fff;
6255
    width: 15px;
6256
    height: 15px;
6257
    cursor: pointer;
6258
    text-indent: -50000px;
6259
    position: absolute;
6260
    right: -10px;
6261
    bottom: 14px;
6262
}
6263

    
6264
.invitations-list .resent-info,
6265
.invitations-form .top-info {
6266
    font-size: 0.8em;
6267
    margin-bottom: 10px;
6268
}
6269

    
6270
.invitations-list .msg .email,
6271
.invitations-form .success .msg .email {
6272
    font-weight: bold;
6273
}
6274

    
6275
.invitations-list .msg.err-msg,
6276
.invitations-list .success.msg,
6277
.invitations-form .success .msg {
6278
    background-color: #080;
6279
    color: white;
6280
    padding: 5px;
6281
    margin-right: 10px;
6282
    margin-bottom: 5px;
6283
}
6284
.invitations-list .msg.err-msg,
6285
.invitations-list .success.msg {
6286
    margin-right: 0px;
6287
}
6288
.invitations-list .msg.err-msg {
6289
    background-color: #800;
6290
}
6291

    
6292
.overlay .models-view .previous-view-link {
6293
    margin: -10px;
6294
    margin-bottom:10px;
6295
    padding: 10px 5px;
6296
    background-image: url("../images/left-arrow.png");
6297
    background-repeat: no-repeat;
6298
    background-position: 10px center;
6299
    padding-left: 20px;
6300
    background-color: #93D070;
6301
    cursor: pointer;
6302
    border-bottom: 1px solid #eee;
6303
    text-decoration: underline;
6304
}
6305
.models-view .quick-add {
6306
    text-decoration: underline; 
6307
    color: #4085A5;
6308
    cursor: pointer;
6309
}
6310

    
6311
.empty .items-list {
6312
    margin-top: 0 !important;
6313
}
6314

    
6315
.models-view .items-empty-msg {
6316
    border-top: 1px solid #aaa;
6317
    padding-top: 10px;
6318
    font-size: 1em;
6319
    margin-top:0 !important;
6320
}
6321

    
6322
.models-view .items-empty-msg,
6323
.models-view .model-description {
6324
    color: #444;
6325
    margin: 10px 0;
6326
}
6327

    
6328
.models-view .model-list .collection-action.disabled {
6329
    background-color: #aaa;
6330
    border-color: #aaa;
6331
    cursor: default;
6332
}
6333
.models-view .model-list .collection-action.disabled:hover {
6334
    background-color: #aaa;
6335
    border-color: #aaa;
6336
}
6337

    
6338
.models-view .model-list .collection-action:hover {
6339
    background-color: #aaa;
6340
}
6341

    
6342
.models-view .model-list .collection-action:hover {
6343
    background-color: #F95;
6344
    border-color: #F95;
6345
}
6346

    
6347
.models-view .model-list .collection-action.in-progress {
6348
    background-color: #aaa;
6349
    color: #fff;
6350
    border-color: #aaa;
6351
    background-image: url("../images/icons/indicators/small/progress.gif") !important;
6352
}
6353

    
6354
.models-view .model-list .collection-action.add-generate {
6355
    background-image: url("../images/option-action-generate-ssh.png");
6356
}
6357

    
6358
.models-view .model-list .collection-action.add {
6359
    background-image: url("../images/option-action-add.png");
6360
    padding-right: 20px !important;
6361
}
6362

    
6363
.models-view .model-list .collection-action {
6364
    float: right;
6365
    background-color: #FF7F2A;
6366
    color: #fff;
6367
    padding: 6px 8px;
6368
    margin-left: 10px;
6369
    cursor: pointer;
6370
    padding-right: 30px;
6371
    background-position: right center;
6372
    background-repeat: no-repeat;
6373
    background-clip: border-box;
6374
    border-right: 5px solid #FF7F2A;
6375
}
6376

    
6377
.models-view .items-list {
6378
    margin-top: 10px;
6379
}
6380

    
6381
.models-view .model-list ul li.model-item:last-child {
6382
    margin-bottom: 0;
6383
}
6384

    
6385
.models-view .model-list ul li.model-item {
6386
    background-color: #D4E2E8;
6387
    margin-bottom: 5px;
6388
    position: relative;
6389
}
6390

    
6391
.models-view .model-list ul li.model-item .param {
6392
    float: left;
6393
    padding: 6px;
6394
}
6395

    
6396
.models-view .model-list ul li.model-item .item-action.confirm-remove {
6397
    margin-right: -15px !important;
6398
}
6399

    
6400
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover .cancel {
6401
    color: inherit !important;
6402
}
6403

    
6404
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover {
6405
    background-color: #F95;
6406
    color: inherit !important;
6407
}
6408

    
6409
.models-view .model-list ul li.model-item .item-action.confirm-remove span.cancel {
6410
    padding: 6px !important;
6411
}
6412

    
6413
.models-view .model-list ul li.model-item .item-action.confirm-remove span {
6414
    display: block;
6415
    float: left;
6416
    padding: 6px 15px;
6417
}
6418

    
6419
.models-view .model-list ul li.model-item .item-action .cancel-remove:hover {
6420
    color: #fff !important;
6421
}
6422

    
6423
.models-view .model-list ul li.model-item .item-action.confirm-remove,
6424
.models-view .model-list ul li.model-item .item-action .do-confirm,
6425
.models-view .model-list ul li.model-item .item-action .cancel-remove {
6426
    display:none !important;
6427
    background-color: #D95D0A;
6428
    padding:0;
6429
    margin:0;
6430
}
6431

    
6432
.models-view .model-list ul li.model-item.pending-delete .item-action.remove {
6433
    display: none;
6434
}
6435

    
6436
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel {
6437
    background-color: #F95;
6438
}
6439

    
6440
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm {
6441
    background-color: #FF7F2A;
6442
}
6443

    
6444
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove,
6445
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove .do-confirm,
6446
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel-remove {
6447
    display:block !important;
6448
}
6449

    
6450
.models-view .model-list ul li.model-item.pending-delete .item-action {
6451
    display: block;
6452
}
6453

    
6454
.models-view .model-list ul li.model-item.expanded .item-action,
6455
.models-view .model-list ul li.model-item:hover .item-action {
6456
    display: block;
6457
}
6458

    
6459
.models-view .model-list ul li.model-item .item-action.hide {
6460
    background-image: url("../images/minus-8.png");
6461
}
6462
.models-view .model-list ul li.model-item .item-action.show:hover {
6463
    background-image: url("../images/plus-8.png");
6464
}
6465

    
6466
.models-view .model-list ul li.model-item .item-action.show {
6467
    background-image: url("../images/plus-8-dark.png");
6468
}
6469

    
6470
.models-view .model-list ul li.model-item .item-action.remove {
6471
    background-image: url("../images/option-action-remove.png");
6472
}
6473

    
6474
.models-view .model-list ul li.model-item .item-action.edit:hover {
6475
    background-image: url("../images/option-action-edit-light.png");
6476
}
6477

    
6478
.models-view .model-list ul li.model-item .item-action.edit {
6479
    background-image: url("../images/option-action-edit.png");
6480
}
6481
.models-view .model-list ul li.model-item .item-action.remove:hover {
6482
    background-color: #880000 !important;
6483
    border-color: #800 !important;
6484
}
6485

    
6486
.models-view .model-list ul li.model-item.expanded .item-action.show,
6487
.models-view .model-list ul li.model-item.expanded .item-action.hide,
6488
.models-view .model-list ul li .item-actions .item-action:hover {
6489
    background-color: #4085A5;
6490
    color: #fff;
6491
    border-color: #4085A5;
6492
}
6493

    
6494
.models-view .model-list ul li .item-actions {
6495
    position: absolute;
6496
    right: -10px;
6497
    top: 0px;
6498
}
6499

    
6500
.models-view .model-list ul li .item-actions .item-action {
6501
    float: right;
6502
    padding: 6px;
6503
    margin-right: 10px;
6504
    display: none;
6505
    cursor: pointer;
6506
    padding-right: 20px;
6507
    background-repeat: no-repeat;
6508
    background-position: right center;
6509
    border-right: 5px solid transparent;
6510
}
6511

    
6512
.models-view .model-list h3 {
6513
    float: left;
6514
}
6515

    
6516
.models-view h3 {
6517
    font-size: 1.2em;
6518
    margin-bottom: 1em;
6519
    margin-top: 5px;
6520
    color: #4085A5;
6521
}
6522

    
6523
.models-view .form-actions {
6524
    font-size: 1.1em;
6525
}
6526

    
6527
.models-view .model-list ul li,
6528
.models-view .model-list ul {
6529
    list-style: none;
6530
}
6531

    
6532
.models-view .model-list ul li.header {
6533
    display: none;
6534
}
6535

    
6536
.models-view .model-form textarea {
6537
    width: 99%;
6538
    height: 100px;
6539
    border: 1px solid #aaa;
6540
}
6541

    
6542

    
6543
.models-view .model-form .form-field {
6544
    margin-bottom: 10px;
6545
}
6546

    
6547
.models-view .model-form label {
6548
    display: block;
6549
    color: #406A7D;
6550
    font-size: 1.1em;
6551
    margin: 0px 0 5px 0;
6552
}
6553

    
6554
.models-view .model-form .inline label {
6555
    float: left;
6556
    margin-right: 10px;
6557
    margin-top: 10px !important;
6558
}
6559

    
6560
.models-view .model-form input.long {
6561
    width: 400px;
6562
}
6563

    
6564
.models-view .model-form .inline input {
6565
    width: auto;
6566
    margin-top: 10px;
6567
}
6568

    
6569
.models-view .model-form .inline select {
6570
    width: auto;
6571
    margin-top: 7px;
6572
}
6573

    
6574
.models-view .model-form .inline .errors,
6575
.models-view .model-form .inline .field-desc {
6576
    clear: both;
6577
}
6578

    
6579
#user_public_keys .private-download {
6580
    margin: 5px 0;
6581
    margin-top: 6px;
6582
}
6583

    
6584
#user_public_keys .private-cont form {
6585
    float: left;
6586
    margin-left: 5px;
6587
}
6588

    
6589
#user_public_keys input.form-text:hover {
6590
    background: #F95;
6591
}
6592

    
6593
#user_public_keys input.form-text {
6594
    background: #FF7F2A;
6595
    color: #fff;
6596
    border: 1px solid #F95;
6597
    padding: 0 5px;
6598
    margin: 0 5px;
6599
    margin-top: -1px;
6600
    cursor: pointer;
6601
}
6602

    
6603
#user_public_keys .form-text {
6604
    float: left;
6605
}
6606

    
6607
#user_custom_images,
6608
#user_public_keys {
6609
    font-size: 0.7em;
6610
}
6611

    
6612
#user_public_keys .download-button {
6613
    width: 30px;
6614
    height: 30px;
6615
}
6616

    
6617

    
6618
#user_public_keys #model-item-tpl {
6619
    display: none;
6620
}
6621
#user_public_keys .model-item .name {
6622
    color: #4085A5;
6623
    font-size: 1.2em;
6624
}
6625

    
6626
#user_public_keys .model-item .fingerprint .flabel {
6627
    color: #888;
6628
    float: left;
6629
    margin-right: 5px;
6630
}
6631

    
6632
#user_public_keys .model-item .fingerprint {
6633
    float: none;
6634
    clear: both;
6635
    color: #444;
6636
    font-family: monospace;
6637
    letter-spacing: 1px;
6638
    padding: 4px;
6639
    font-size: 0.9em;
6640
    border-top: 1px solid #fff;
6641
}
6642

    
6643
#user_public_keys .model-item .publicid {
6644
    display: none;
6645
}
6646

    
6647
#user_public_keys .model-item.expanded .publicid .param-content {
6648
    padding: 5px 5px;
6649
    overflow: auto;
6650
    background-color: #FFF;
6651
    border: 1px solid #4085A5;
6652
    border-left: none;
6653
    border-right: none;
6654
    font-size: 1.1em;
6655
}
6656

    
6657
#user_public_keys .model-item.expanded .publicid .param-content textarea {
6658
    width: 100%;
6659
    height: 90px;
6660
    margin:0;
6661
    padding:0;
6662
    border:none;
6663
    overflow: auto;
6664
}
6665

    
6666
#user_public_keys .model-item.expanded .publicid {
6667
    display: block;
6668
    background-color: #fff;
6669
    width: 100%;
6670
    margin-top: 0px;
6671
    margin-left: 0px;
6672
    color: #fff;
6673
    padding:0 !important;
6674
}
6675

    
6676
.models-view .form-messages {
6677
    margin-bottom: 10px;
6678
}
6679

    
6680
.models-view .list-messages {
6681
    margin-top: 10px;
6682
}
6683

    
6684
.models-view .form-messages .error,
6685
.models-view .form-messages .success,
6686
.models-view .list-messages .error,
6687
.models-view .list-messages .success,
6688
#user_public_keys .private-cont {
6689
    background-color: #AADE87;
6690
    color: #447821;
6691
    padding: 5px;
6692
    border: 1px solid #447821;
6693
    font-size: 1.1em;
6694
    margin-top: 5px;
6695
}
6696

    
6697
.models-view .form-messages .error,
6698
.models-view .list-messages .error {
6699
    background-color: #DE8D87;
6700
    color:  #782421 !important;
6701
    border-color: #782421;
6702
}
6703

    
6704
#user_public_keys .limit-msg {
6705
    color: #800;
6706
    position: absolute;
6707
    right: 20px;
6708
    top: 25px;
6709
}
6710

    
6711
#user_public_keys .private-cont {
6712
    margin-top: 10px;
6713
}
6714

    
6715
#user_public_keys .private-cont .private-msg {
6716
    float: left;
6717
    padding:5px;
6718
    margin-top: 5px;
6719
}
6720

    
6721
#user_public_keys .private-cont textarea {
6722
    margin: 5px;
6723
    width: 97%;
6724
    height: 200px;
6725
}
6726

    
6727
#user_public_keys .private-cont .close-private:hover {
6728
    color: #Fff;
6729
}
6730

    
6731
#user_public_keys .private-cont .close-private {
6732
    float: right;
6733
    margin-right: 5px;
6734
    font-weight: bold;
6735
    cursor: pointer;
6736
    text-decoration: underline;
6737
}
6738

    
6739
#user_public_keys .model-item .key-type {
6740
    background-color: #72ADC8;
6741
    color: #fff;
6742
    text-align: center;
6743
    font-size: 0.9em;
6744
    padding:2px 10px;
6745
    margin: 4px 6px;
6746
    margin-top: 7px;
6747
    font-weight: bold;
6748
}
6749

    
6750
#user_public_keys .private-cont .down-button {
6751
}
6752

    
6753
.models-view .form-field .field-desc {
6754
    font-style: italic;
6755
    font-size: 1em;
6756
    color: #888;
6757
}
6758

    
6759
.models-view .form-field.error label {
6760
    font-weight: bold;
6761
    color: #800 !important;
6762
}
6763

    
6764
.models-view .form-field .errors {
6765
    margin: 5px 0;
6766
}
6767

    
6768
.models-view .form-field .errors .error {
6769
    background-color: transparent;
6770
    border: none;
6771
    color: #800;
6772
}