Statistics
| Branch: | Tag: | Revision:

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

History | View | Annotate | Download (133.7 kB)

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

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

    
26
body#app {
27
    background-position: 0px 34px; 
28
}
29

    
30
a, a:hover, a:active, a:focus, div:focus, span:focus, li:focus {
31
    outline: none;
32
}
33

    
34
pre {
35
    font-family: monospace;
36
}
37

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

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

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

    
66
#content {
67
    padding-bottom: 10px;
68
    width: 100%;
69
}
70

    
71
div#wrapper {
72
    width: 700px;
73
    margin: 0em auto;
74
    text-align: left;
75
}
76

    
77
#footer a {
78
    color: #fff;
79
}
80

    
81
#footer .software .version {
82
    font-weight: bold;
83
}
84

    
85
#footer .software {
86
    font-size: 0.6em;
87
    margin-top: 7px;
88
    color: #fff;
89
}
90

    
91
#footer {
92
    height: 80px;
93
    background-color: #4085A5;
94
    width:100%;
95
}
96

    
97
#footer-container {
98
    height: 80px;
99
    width: 100%;
100
    left:0;
101
    z-index:10;
102
}
103

    
104
#footer div.grnet-sign {
105
    margin-top:10px;
106
}
107

    
108
#footer div.grnet-sign a{
109
    color: #72ADC8;
110
}
111

    
112
#footer div.grnet-sign a:hover {
113
    color: #FFFFFF;
114
}
115

    
116
ol, ul {
117
    list-style: none;
118
}
119

    
120
blockquote, q {
121
    quotes: none;
122
}
123

    
124
blockquote:before, blockquote:after,
125
q:before, q:after {
126
    content: '';
127
    content: none;
128
}
129

    
130
/* remember to define focus styles! */
131
:focus {
132
    outline: 1px dotted #87AADE;
133
}
134

    
135
/* remember to highlight inserts somehow! */
136
ins {
137
    text-decoration: none;
138
}
139

    
140
del {
141
    text-decoration: line-through;
142
}
143

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

    
150
h5 {
151
    font-weight: normal;
152
    margin-bottom:3px;
153
}
154

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

    
162
.create-container a {
163
    font-family: 'Open Sans', sans-serif;
164
}
165

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

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

    
186
ul.css-tabs {
187
    padding: 0;
188
    height:31px;
189
    background-color: #5CA1C0;
190
}
191

    
192
ul.css-tabs .secondary {
193
    position:relative;
194
}
195

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

    
203
ul.css-tabs .current {
204
    background: #4085A5;
205
}
206

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

    
219
ul.css-tabs a:hover {
220
    background: #74AEC9;
221
}
222

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

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

    
237
.css-panes > div.pane {
238
    display:none;
239
}
240

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

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

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

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

    
282
#beforecreate {
283
    background-color: #FF9955;
284
    height: 32px;
285
    width: 13px;
286
}
287

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

    
295
#machines-pane-top.empty {
296
    background: transparent;
297
}
298

    
299
#beforecreate {
300
    border-left: 16px solid #efefef;
301
    margin-left: -16px;
302
}
303

    
304
.create-container {
305
    line-height: 4em;
306
}
307

    
308
#createcontainer a {
309
}
310

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

    
319
#create:hover {
320
    background-color: #FF9955;
321
}
322

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

    
329
.header-logo {
330
    padding-top: 28px;
331
}
332

    
333
.header-logo img {
334
    max-width:100%;
335
    max-height:64px;
336
}
337

    
338
div#footer-text a {
339
    color: #FFFFFF;
340
    text-decoration: none;
341
}
342

    
343
div#footer-text{
344
    color: #FFFFFF;
345
    font-size: 75%;
346
    padding-top: 10px;
347
}
348

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

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

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

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

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

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

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

    
410
#networks-wizard h2 {
411
    margin-top: 15px;
412
}
413

    
414
#wizard li {
415
    margin-bottom:1.2em;
416
}
417

    
418
#wizard .pane li {
419
    margin: 0;
420
}
421

    
422
#wizard label {
423
    font-size:120%;
424
    display:block;
425
    clear: both;
426
}
427

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

    
435
#wizard label em {
436
    font-size:75%;
437
    color:#666;
438
    font-style:normal;
439
}
440

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

    
450
#wizard select {
451
    border:1px solid #ccc;
452
    width:94%;
453
    padding:4px;
454
    display: none;
455
}
456

    
457
#wizard .double label {
458
    width:50%;
459
    float:left;
460
}
461

    
462
#wizard .double .text {
463
    width:93%;
464
}
465

    
466
#wizard .clearfix {
467
    clear:left;
468
    padding-top:10px;
469
}
470

    
471
#wizard .right {
472
    float:right;
473
}
474

    
475
#wizard .error {
476
    border:1px solid red;
477
}
478

    
479
#wizard a:hover div.image {
480
    background-color: #C5DEE9;
481
}
482

    
483
.selecteddiv {
484
    background-color: #C5DEE9 !important;
485
}
486

    
487
#wizard label a:hover strong {
488
    color: black;
489
}
490

    
491
#wizard div.image span.size {
492
    font-size: 75%;
493
    color: #666;
494
}
495

    
496
#wizard div.image .radio {
497
    float: left;
498
    margin-top: 10px;
499
}
500

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

    
508
#wizard a:hover div.image span.image-id, #wizard a:hover div.image span.description, #wizard a:hover div.image span.size {
509
    color: black;
510
}
511

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

    
520
#wizard #status {
521
    height: 50px;
522
    background-color: #4085A5;
523
}
524

    
525
#wizard .headernumber {
526
    font-size: 410%;
527
}
528

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

    
537
#wizard .first {
538
    left: -10px;
539
}
540

    
541
#wizard .checked {
542
    color: #64a6c4 !important;
543
}
544

    
545
#wizard .li-2 {
546
    margin-top: -1px !important;
547
}
548

    
549
#wizard .img-check {
550
    margin-bottom: 8px;
551
    margin-left: -8px;
552
}
553

    
554
#wizard .li-1 .img-check {
555
    margin-left: 2px;
556
}
557

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

    
569
#wizard .bottomruler, #networks-wizard .bottomruler {
570
    margin-top:6px;
571
}
572

    
573
#networks-wizard .topruler, #networks-wizard .bottomruler {
574
    width: 455px;
575
    float: left;
576
}
577

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

    
584
#wizard #cancel:hover, #networks-wizard .cancel:hover {
585
    background-color: #7DB4CD;
586
    border-color: #7DB4CD;
587
}
588

    
589
#wizard #start, #networks-wizard .create {
590
    text-align: center;
591
    background-color: #FF7F2A;
592
    border-color: #FF7F2A;
593
}
594

    
595
:focus {
596
    outline: none;
597
    -moz-outline-style: none;
598
}
599

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

    
604
#wizard .img-prev {
605
    margin: 0 8px -1px -4px;
606
}
607

    
608
#networks-wizard .create {
609
    float:right;
610
    width: 140px;
611
}
612

    
613
.overlay-networks-create .form-action {
614
  float: left;
615
}
616

    
617
.overlay-networks-create .fixpos {
618
  margin-top: 3px;
619
}
620

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

    
627
.overlay-networks-create .col-fields {
628
  margin-bottom: 10px;
629
}
630

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

    
637
.overlay-networks-create form select {
638
  padding: 1px;
639
}
640

    
641
.overlay-networks-create #network-create-subnet-custom {
642
  width: 125px;
643
}
644

    
645
.overlay-networks-create .col-fields .form-field {
646
  float: left;
647
  margin-right: 20px;
648
}
649

    
650
.overlay-networks-create .col-fields .right-field {
651
  float: right;
652
  width: 210px;
653
  margin-right: 0px;
654
}
655

    
656
.overlay-networks-create .use-dhcp {
657
  width: auto;
658
}
659

    
660
#wizard #start:hover, #networks-wizard .create:hover {
661
    background-color: #FF9651;
662
    border-color: #FF9651;
663
}
664

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

    
674
.page ul {
675
    height: 270px;
676
    overflow: auto;
677
}
678

    
679
.panes ul.pane {
680
    height: 220px;
681
}
682

    
683
#wizard #tabscontainer {
684
    background-color: #CDE2EC;
685
    height: 20px;
686
    width: 448px;
687
}
688

    
689
.page ul.tabs {
690
    overflow: hidden;
691
    height: auto;
692
    margin-bottom: -1px;
693
    margin-top: -1px;
694
}
695

    
696
.page ul.tabs li {
697
    float: right;
698
    margin: 0 0.2em;
699
}
700

    
701
#status li {
702
    float: left;
703
    color: #387693;
704
    padding: 0 1px 0 37px;
705
    bottom: 0px;
706
}
707

    
708
#status li.active .headernumber {
709
    color: #FFFFFF;
710
}
711

    
712
#status li.active .headerbody {
713
    color: #FFFFFF;
714
}
715

    
716
div.image-container {
717
    border-bottom: 1px solid #CCCCCC;
718
    margin-left: 10px;
719
    margin-right: 10px;
720
}
721

    
722
#page2-container {
723
    background-color: #ECF4F8;
724
    height: 193px;
725
    margin-top: 3px;
726
    padding-top: 25px;
727
}
728

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

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

    
747
.sliders {
748
    float:left;
749
    width: 40px;
750
    margin-left: 10px;
751
    margin-top: 3px;
752
}
753

    
754
.units {
755
    padding-left:10px;
756
}
757

    
758
.slider-container {
759
    padding-bottom: 15px;
760
    margin-left: 5px;
761
}
762

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

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

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

    
793
.selectedrange {
794
    border-color: #5599FF;
795
}
796

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

    
805
/* machines */
806
.machine-container {
807
    position:relative;
808
}
809

    
810
.icon .machine-container.last .machine-data-cont, .machine-container:last-child .machine-data-cont {
811
    margin-bottom:0;
812
    padding-bottom: 0;
813
    border-bottom: none;
814
}
815

    
816
.icon .machine-container.last .machine-data, .machine-container:last-child .machine-data {
817
    border-bottom: none;
818
}
819

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

    
828
.icon .machine-container .subtitle {
829
    
830
}
831

    
832
.icon .machine-container .info {
833
    margin-top: 2px;
834
    height: 17px;
835
}
836

    
837
.icon .machine-container .building-progress {
838
    vertical-align: top;
839
}
840

    
841
.icon .build-progress {
842
    margin-left: -3px;
843
}
844

    
845
#machinesview .build-progress .message {
846
  padding: 3px;
847
}
848

    
849
#machinesview .build-progress .btn:hover {
850
  background-color: #387693;
851
}
852

    
853
#machinesview .column1 .build-progress .btn {
854
    margin-top: 5px;
855
    display: inline-block;
856
}
857

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

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

    
872
.icon .machine-data {
873
    width: 520px;
874
    float: left;
875
    background-color: transparent;
876
}
877

    
878
.icon .machine-info {
879
    padding: 20px 0;
880
}
881

    
882
.icon .machine-details .name {
883
    height: 24px;
884
}
885

    
886
.icon .machine-connect {
887
    width: 80px;
888
    float: left;
889
}
890

    
891
.icon .machine-details {
892
    width: 310px;
893
    float: left;
894
    margin-top: -5px;
895
}
896

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

    
906
.vm-actions {
907
    position: relative;
908
}
909

    
910
.icon .vm-actions {
911
    /*display: none;*/
912
}
913

    
914
.icon .vm-actions, .network .vm-actions {
915
    width: 180px;
916
    height: 96px;
917
    float: left;
918
}
919

    
920
.network .vm-actions {
921
    width: 185px;
922
}
923

    
924
.icon .machine-container:hover .machine-data {
925
    background-color:#A1C8DB !important;
926
}
927

    
928
.icon .machine-container:hover .vm-actions {
929
    display: block;
930
}
931

    
932
.vm-actions {
933
    font-size: 75%;
934
}
935

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

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

    
952
.vm-actions a.selected {
953
    color: #FF7F2A !important;
954
}
955

    
956
.vm-actions a.selected {
957
    background-color:transparent;
958
}
959

    
960
.vm-actions .action-container {
961
    position: relative;
962
}
963

    
964
.vm-actions .action-container .confirm_single {
965
    position: absolute;
966
    right: -20px;
967
    top: -2px;
968
}
969

    
970
div.list div.actions a.enabled.destroy {
971
}
972

    
973
.vm-actions .action-container.inactive a {
974
  color: #aaa;
975
}
976

    
977
.vm-actions .action-container.inactive a:hover{
978
  background-color: transparent !important;
979
  border: none !important;
980
  padding-left: 8px;
981
}
982

    
983
.vm-actions .action-container.destroy {
984
    position: absolute;
985
    bottom: -1px;
986
    width: 100%;
987
    left: 0px;
988
    background: transparent;
989
}
990

    
991
.vm-actions .action-container.destroy a {
992
}
993

    
994
.icon .light-background .machine-data, div.network.light-background, div.network.expand {
995
    background-color:#aed2e3 !important;
996
}
997

    
998
.single .light-background {
999
    background-color:#aed2e3;
1000
}
1001

    
1002
.icon .machine-data-cont {
1003
    margin-bottom: 5px;
1004
    padding-bottom: 5px;
1005
    border-bottom: 1px solid #D1E7F0;
1006
    width: 520px;
1007
    float: left;
1008
}
1009
.icon .terminated .machine-data-cont {
1010
    border-color: #B6CED6;
1011
}
1012

    
1013
.machine a {
1014
    font-weight: normal;
1015
    text-decoration: none;
1016
}
1017

    
1018
.machine span.name, .machine span.ip {
1019
    font-size: 75%;
1020
    color: black;
1021
    margin-top: 6px;
1022
}
1023

    
1024
.machine span.name {
1025
    font-weight: bold;
1026
}
1027

    
1028
.oldValue {
1029
    display:none;
1030
}
1031

    
1032
.state {
1033
}
1034

    
1035
.state div {
1036
    text-align: right;
1037
    margin-right: 3px;
1038
}
1039

    
1040
/* icon view actions */
1041
div.machine div.actions a.shutdown-padding {
1042
    margin-bottom: 22px;
1043
}
1044

    
1045
div.actions a.enabled:hover{
1046
    color: black !important;
1047
    text-decoration: underline;
1048
    display: block;
1049
}
1050

    
1051
div.machine:hover .actions a {
1052
    visibility: visible;
1053
}
1054

    
1055
div.machine div.display a{
1056
    visibility: visible;
1057
}
1058

    
1059
div.machine div.actions .disabled {
1060
    display: none;
1061
}
1062

    
1063
div.single-container div.vm-actions .disabled {
1064
    display: none;
1065
}
1066

    
1067
div.machine div.actions .disabled {
1068
    display: none;
1069
}
1070

    
1071
div.connect-arrow {
1072
    background: url("../images/connect-arrow.png") no-repeat;
1073
    height: 28px;
1074
    width:14px;
1075
    position: absolute;
1076
    display: none;
1077
}
1078

    
1079
.machine div.connect-arrow {
1080
    display: none;
1081
    left: -3px;
1082
    position: absolute;
1083
    top: 22px;
1084
}
1085

    
1086
div.connect-arrow:hover, div.connect-arrow.border-hover, div.connect-arrow-ie, div.connect-arrow.border-ie {
1087
    cursor: pointer;
1088
    background: url("../images/connect-arrow-hover.png") no-repeat;
1089
    height: 28px;
1090
    width:26px;
1091
}
1092

    
1093
div.connect-border {
1094
    opacity: 0.8;
1095
    filter: alpha(opacity = 80);
1096
    background-color:#4fe0c3;
1097
    height:28px;
1098
    width: 12px;
1099
    position: absolute;
1100
    display: none;
1101
}
1102

    
1103
div.connect-border:hover {
1104
    cursor: pointer;
1105
}
1106

    
1107
.machine div.connect-border {
1108
    display: none;
1109
    left: -15px;
1110
    position: absolute;
1111
    top: 22px;
1112
}
1113

    
1114
.standard .machine .logo {
1115
    float: left;
1116
    width: 50px;
1117
    height: 54px;
1118
    margin: 1px 14px 0;
1119
}
1120
.machine .logo {
1121
    background-image: url("../images/icons/machines/medium/unknown-sprite.png");
1122
    background-repeat: no-repeat;
1123
    cursor: pointer;
1124
}
1125

    
1126
.standard .machine .single-image-state1 {
1127
    background-position: 0px 0;
1128
}
1129

    
1130
.standard .machine .single-image-state3 {
1131
    background-position: -100px 0;
1132
}
1133

    
1134
.standard .machine .single-image-state4 {
1135
    background-position: -150px 0;
1136
}
1137

    
1138
.standard .machine .single-image-state2 {
1139
    background-position: -50px 0;
1140
}
1141

    
1142
.standard .running .machine .logo {
1143
   cursor: pointer;
1144
}
1145

    
1146
.list .machine img {
1147
    margin: 0;
1148
}
1149

    
1150
.icon div.cont-toggler-wrapper.ips {
1151
    font-size: 75%;
1152
}
1153

    
1154
.icon div.indicators {
1155
    float: right;
1156
}
1157

    
1158
div.indicators {
1159
    margin-right: 2px !important;
1160
    cursor: pointer;
1161
}
1162

    
1163
div.indicator1, div.indicator2, div.indicator3, div.indicator4 {
1164
    background-color: #63cf1c;
1165
    width:10px;
1166
    height:11px;
1167
    clear: none;
1168
    float:right;
1169
    -webkit-transition: background-color .75s ease-out;
1170
    -o-transition: background-color .75s ease-out;
1171
    -moz-transition: background-color .75s ease-out;
1172
    transition: background-color .75s ease-out;
1173
}
1174

    
1175
.view-separator {
1176
    color:#5F8DD3;
1177
}
1178

    
1179
.running.disabled {
1180
    background: transparent;
1181
}
1182

    
1183
.running-state .indicator1, .running-state .indicator2, .running-state .indicator3, .running-state .indicator4 {
1184
    background-color: #63cf1c;
1185
}
1186

    
1187
.rebooting-state .indicator1, .rebooting-state .indicator2, .rebooting-state .indicator3, .rebooting-state .indicator4 {
1188
    background-color: #d4aa00;
1189
}
1190

    
1191
.error-state .indicator1, .error-state .indicator2, .error-state .indicator3, .error-state .indicator4 {
1192
    background-color: #ff0000 !important;
1193
}
1194

    
1195
.terminated-state .indicator1, .terminated-state .indicator2, .terminated-state .indicator3, .terminated-state .indicator4 {
1196
    background-color: #5e1616;
1197
}
1198

    
1199
.build-state .indicator1, .build-state .indicator2, .build-state .indicator3, .build-state .indicator4 {
1200
    background-color: #FF7F2A;
1201
}
1202

    
1203
.destroying-state .indicator1, .destroying-state .indicator3, .destroying-state .indicator2, .destroying-state .indicator4 {
1204
    background-color: #4085a5 !important;
1205
}
1206

    
1207
.shutting-state .indicator1, .shutting-state .indicator3, .shutting-state .indicator2, .shutting-state .indicator4 {
1208
    background-color: #940606;
1209
}
1210

    
1211
.starting-state .indicator1, .starting-state .indicator2, .starting-state .indicator3, .starting-state .indicator4 {
1212
    background-color: #9ed976;
1213
}
1214

    
1215
.network-indicator .indicator1, .network-indicator .indicator2, .network-indicator .indicator3, .network-indicator .indicator4 {
1216
    background-color: #63cf1c;
1217
}
1218

    
1219
.network-indicator.in-progress .indicator1, .network-indicator.in-progress .indicator2, .network-indicator.in-progress .indicator3, .network-indicator.in-progress .indicator4 {
1220
    background-color: #FF7F2A;
1221
}
1222

    
1223
.running, .terminated {
1224
    background: #EFF7FA repeat scroll 0 0;
1225
    padding-bottom: 15px;
1226
}
1227

    
1228
.running, #machinesview-list, .single {
1229
}
1230

    
1231
.terminated {
1232
    background:#DCE5E8  repeat scroll 0 0;
1233
    padding-top: 15px;
1234
    margin-top: 15px;
1235
}
1236

    
1237
span.rename {
1238
    background-repeat: no-repeat;
1239
    color: transparent;
1240
    font-size: 75%;
1241
    font-weight: normal;
1242
    margin-left: 10px;
1243
    padding-left: 10px;
1244
    text-align: left;
1245
    cursor: pointer;
1246
}
1247

    
1248
div.name:hover span.rename, span.rename_hovered {
1249
    color: #3D3D3D;
1250
    margin-top: 0.4em;
1251
    background-image: url("../images/pencil.png");
1252
    background-position: 0 3px;
1253
}
1254

    
1255
.machine div.info {
1256
    font-size: 75%;
1257
}
1258

    
1259
div.machine:hover div.info-header, div.machine:hover div.toggler div.down {
1260
    background-color: #84b7d0;
1261
}
1262

    
1263
div.machine div.info-label.darker, .single div.tags-label.darker, div.network .darker {
1264
    background-color: #5CA1C0;
1265
}
1266

    
1267
.machine div.info div.info-label {
1268
    font-size: 75%;
1269
    height:16px;
1270
    width: 30px;
1271
    padding: 1px 0 0 5px;
1272
}
1273

    
1274
.machine div.info div.toggler, .single div.tags div.toggler, div.network div.toggler {
1275
    width:15px;
1276
    height:17px;
1277
    margin-top: -11px;
1278
    margin-left: 37px;
1279
}
1280

    
1281
div.network div.toggler {
1282
    margin-left: 90px;
1283
}
1284

    
1285
.machine div.info div.down {
1286
    background: url(../images/down-arrow.png) no-repeat scroll 1px 1px;
1287
}
1288

    
1289
.single div.tags div.down {
1290
    background: url(../images/down-arrow.png) no-repeat scroll 2px 2px;
1291
}
1292

    
1293
.network div.network-machines div.down {
1294
    background: url(../images/down-arrow.png) no-repeat scroll 2px 2px;
1295
}
1296

    
1297
.network div.network-machine div.firewall div.down {
1298
    background: url(../images/down-arrow.png) no-repeat scroll 2px 2px;
1299
}
1300

    
1301
.machine div.info div.up {
1302
    background: url(../images/up-arrow.png) no-repeat scroll 1px 0;
1303
}
1304

    
1305
.single div.tags div.up {
1306
    background: url(../images/up-arrow.png) no-repeat scroll 2px 2px;
1307
}
1308

    
1309
.network div.network-machines div.up {
1310
    background: url(../images/up-arrow.png) no-repeat scroll 2px 2px;
1311
}
1312

    
1313
.network div.network-machine div.firewall div.up {
1314
    background: url(../images/up-arrow.png) no-repeat scroll 2px 2px;
1315
}
1316

    
1317
button {
1318
    background-color: #87AADE;
1319
    border: 1px solid #87AADE;
1320
    color: #FFFFFF;
1321
    cursor: pointer;
1322
    height: 23px;
1323
    width: 120px;
1324
}
1325

    
1326
button.next {
1327
    background-color: #4085A5;
1328
    border-color: #4085A5;
1329
    text-align: right;
1330
}
1331

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

    
1337
button.prev {
1338
    background-color: #4085A5;
1339
    border-color: #4085A5;
1340
    margin-left: -1px;
1341
    text-align: left;
1342
}
1343

    
1344
button.prev:hover {
1345
    background-color: #7DB4CD;
1346
    border-color: #7DB4CD;
1347
}
1348

    
1349
.image-logo {
1350
    float: left;
1351
    margin-right: 1em;
1352
    margin-left: 1.5em;
1353
    margin-top: 4px;
1354
}
1355

    
1356
.icon div.image {
1357
    clear: both;
1358
    display: block;
1359
    margin-bottom: 3px;
1360
    margin-top: 3px;
1361
    padding: 5px;
1362
}
1363

    
1364
div#view-select {
1365
    clear: both;
1366
    color: white;
1367
    position: absolute;
1368
    right: 15px;
1369
    top: 15px;
1370
}
1371

    
1372
a.machines_view_link {
1373
    text-decoration: none;
1374
    font-size: 0.7em;
1375
    padding: 4px;
1376
    padding-right: 8px;
1377
    color: #5CA1C0;
1378
    margin-left: 5px;
1379
    background-repeat: no-repeat;
1380
    background-color: #C9DFEA;
1381
}
1382

    
1383
a.machines_view_link span {
1384
    float: left;
1385
}
1386

    
1387
a.machines_view_link span.ico {
1388
    width: 17px;
1389
    height: 15px;
1390
    margin-right: 10px;
1391
    background-position: -36px 0;
1392
}
1393

    
1394
a.machines_view_link:hover {
1395
    background-color: #A1C8DB;
1396
    color: #fff;
1397
}
1398
a.machines_view_link:hover span.ico {
1399
    background-position: -0px 0px;   
1400
}
1401

    
1402
a.machines_view_link.activelink span.ico {
1403
    background-position: -18px 0px;
1404
}
1405
a.machines_view_link.activelink {
1406
    color: #fff;
1407
    background-color: #5CA1C0;
1408
}
1409

    
1410
div#view-select a {
1411
    display: block;
1412
    float: left;
1413
}
1414

    
1415
a#list:hover {
1416
    background: #5f8dd3;
1417
}
1418

    
1419
a#machines_view_icon_link:active, a#machines_view_list_link:active {
1420
    color:white;
1421
}
1422

    
1423
a#machines_view_icon_link span.ico {
1424
    background-image: url("../images/icon-view.png");
1425
}
1426

    
1427
a#machines_view_list_link span.ico {
1428
    background-image: url("../images/list-view.png");
1429
}
1430

    
1431
a#machines_view_single_link span.ico {
1432
    background-image: url("../images/single-view.png");
1433
}
1434

    
1435
#machinetype {
1436
    background-color: #CDE2EC;
1437
    height: 25px;
1438
    margin-bottom: 0px !important;
1439
}
1440

    
1441
div.machine-type {
1442
    float: left;
1443
    margin: 4px 18px 20px;
1444
}
1445

    
1446
.machine-type .active {
1447
    color: #FFFFFF
1448
}
1449

    
1450
div.machine-type label.disabled {
1451
    color: #aaa !important;
1452
}
1453

    
1454
#machinesview {
1455
}
1456

    
1457
#machines-pane {
1458
}
1459

    
1460
.list#machinesview {
1461
    margin-left: -20px;
1462
    display:none;
1463
}
1464

    
1465
#machinesview-list.list {
1466
    background: #EFF7FA  repeat scroll 0 0;
1467
    padding-left: 15px;
1468
    padding-bottom: 15px;
1469
}
1470

    
1471
#machinesview_content {
1472
    display:none;
1473
}
1474

    
1475
.list-machines {
1476
    min-width: 515px;
1477
}
1478

    
1479
#emptymachineslist {
1480
    background-color: #6BA9C6;
1481
    color: #A0A0A0;
1482
    display: none;
1483
    padding: 65px 150px 35px;
1484
    text-align: justify;
1485
    margin-top: -70px;
1486
}
1487

    
1488
#welcomeheader {
1489
    color:white;
1490
    text-align: center;
1491
}
1492

    
1493
.welcomebody {
1494
    color: white;
1495
    font-size:80%;
1496
}
1497

    
1498
.welcomebody a {
1499
    color: white;
1500
}
1501

    
1502
.welcomefooter {
1503
    color: white;
1504
    font-size:60%;
1505
}
1506

    
1507
.welcomefooter a {
1508
    color: white;
1509
}
1510

    
1511
.emptycreatecontainer {
1512
    margin-left: 430px !important;
1513
    position: absolute;
1514
    margin-top: 5px !important;
1515
    width: 180px;
1516
    background-color: #CCCCCC;
1517
    padding: 5px;
1518
    padding-left: 10px;
1519
}
1520

    
1521
.emptycreate {
1522
    margin: 20px 10px 5px 0 !important;
1523
}
1524

    
1525
#createbody {
1526
    display:none;
1527
    font-size: 80%;
1528
}
1529

    
1530
div.list label img {
1531
    margin: 5px 5px -3px 0;
1532
}
1533

    
1534
div.list label {
1535
    color: #3D3D3D;
1536
    font-size: 75%;
1537
}
1538

    
1539
div.list .state {
1540
    margin-top: 7px;
1541
    margin-right: 10px;
1542
}
1543

    
1544
div.list table tbody {
1545
    margin-top: 8px;
1546
}
1547

    
1548
div.list table tr.checked td {
1549
    background-color: #A1C8DB !important;
1550
}
1551

    
1552
div.list table tr:hover td,
1553
div.list table tr.inactive:hover td,
1554
div.list table tr.error:hover td {
1555
    background-color: #A1C8DB;
1556
    color: #fff;
1557
}
1558

    
1559
div.list table td.name {
1560
    min-width: 170px;
1561
}
1562

    
1563
div.list table td.status {
1564
    font-size: 0.9em !important; 
1565
    text-align: right;
1566
    min-width: 90px;
1567
    color: #000;
1568
}
1569

    
1570
div.list table td.flavor {
1571
    font-size: 0.8em;
1572
}
1573

    
1574
div.list table td {
1575
    border-bottom: 1px solid #DDD;
1576
}
1577

    
1578
div.list table tr.error td.status {
1579
    color: #800000 !important;
1580
    font-weight: bold;
1581
}
1582

    
1583
div.list table tr.error td {
1584
    background-color: #DCE5E8;
1585
}
1586

    
1587
div.list table tr.inactive td {
1588
    background-color: #DCE5E8;
1589
}
1590

    
1591
div.list .stopped {
1592
    margin-top: 8px;
1593
}
1594

    
1595
/* root element for tabs  */
1596
#wizard ul.tabs {
1597
    margin-right: -1px;
1598
    float: right;
1599
}
1600

    
1601
#wizard div.panes {
1602
    height: 247px;
1603
    clear:both;
1604
    margin-top: 3px;
1605
}
1606

    
1607
.typebody {
1608
    font-size: 80%;
1609
    font-weight: normal;
1610
    position: relative;
1611
    top: -3px;
1612
}
1613

    
1614
.typehover {
1615
    color: #FFFFFF;
1616
}
1617

    
1618
#label-name {
1619
    margin-top: 10px;
1620
}
1621

    
1622
/* single tab */
1623
#wizard ul.tabs li {
1624
    margin-bottom: 0;
1625
    list-style-type:none;
1626
    float: left;
1627
}
1628

    
1629
/* link inside the tab. uses a background image */
1630
#wizard ul.tabs a {
1631
    display:block;
1632
    padding: 0.2em 0.5em 0.1em 0.4em;
1633
    text-decoration:none;
1634
    color: #FFFFFF;
1635
    position:relative;
1636
    top:1px;
1637
    outline:0;
1638
    background-color: transparent;
1639
    text-align: center;
1640
    width: 100px;
1641
    white-space: nowrap;
1642
    height: 17px;
1643
}
1644

    
1645
#wizard ul.tabs a:hover {
1646
    color: #FFFFFF;
1647
    background-color:#4085A5;
1648
}
1649

    
1650
/* selected tab */
1651
#wizard ul.tabs a.current {
1652
    color: white;
1653
    background-color: #7DB4CD;
1654
    cursor: default;
1655
}
1656

    
1657
#wizard #standard-images {
1658
    background-color: #ECF4F8;
1659
}
1660

    
1661
div.list div.actions {
1662
    display: none;
1663
    clear: left;
1664
    float: right;
1665
    margin-right: 15px;
1666
    margin-top: 37px;
1667
    text-align: right;
1668
    width: 120px;
1669
}
1670

    
1671
div.list div.actions a {
1672
    clear: left;
1673
    color: #A1A1A1;
1674
    display: block;
1675
    font-size:75%;
1676
    margin-bottom: 2px;
1677
}
1678

    
1679
div.list div.actions a:hover {
1680
    background-color: transparent;
1681
}
1682

    
1683
div.list div.actions a.enabled {
1684
    color: #3D3D3D;
1685
}
1686

    
1687
div.list div.actions a.enabled:hover{
1688
    cursor: pointer;
1689
    color: black;
1690
    text-decoration: underline;
1691
}
1692

    
1693
div.list div.actions a.selected {
1694
    color: #FF7F2A !important;
1695
}
1696

    
1697
input.machine {
1698
    width: 13px;
1699
    height: 13px;
1700
    top: -1px;
1701
    overflow: hidden;
1702
}
1703

    
1704
.description-container {
1705
    display: inline-block;
1706
    position: relative;
1707
    width: 300px;
1708
}
1709

    
1710
#wizard .button-container {
1711
    height: 20px;
1712
}
1713

    
1714

    
1715
/* metadata dropdown combo */
1716
.meta-key {
1717
    margin-right: 18px;
1718
    float:left;
1719
}
1720

    
1721
/* notification box */
1722
#yes-no {
1723
    height: 150px;
1724
    z-index: 9999;
1725
    border-bottom: 5px solid #4085A5;
1726
}
1727

    
1728
#yes-no p, #yes-no button {
1729
    margin-top: 15px;
1730
}
1731

    
1732
#error-success, .notification-box {
1733
    z-index: 9999;
1734
    border-bottom: 5px solid #4085A5;
1735
    min-height: 150px;
1736
    top: 50px !important;
1737
    position: absolute;
1738
}
1739

    
1740
#error-success p, .notification-box p {
1741
    margin-top: 5px;
1742
}
1743

    
1744
.error-report {
1745
    display: none;
1746
}
1747

    
1748
#error-success .error-report {
1749
    position: absolute;
1750
    top: 140px;
1751
    right: 40px;
1752
}
1753

    
1754
.error .error-report {
1755
    display: block;
1756
}
1757

    
1758
#error-success .error-report .errormsg {
1759
    display: none;
1760
}
1761

    
1762
#error-success .error-report .success {
1763
    display: none;
1764
}
1765

    
1766
#error-success .error-report .sending {
1767
    display: none;
1768
}
1769

    
1770
#error-success .error-report .send-btn {
1771
    color: #4085A5;
1772
    text-decoration: underline;
1773
    cursor: pointer;
1774
}
1775

    
1776
#error-success strong, .notification-box strong {
1777
    color: #F49C1A;
1778
}
1779

    
1780
#error-success .close, .notification-box .close {
1781
    background-image: url("../images/close-popup.png");
1782
    background-repeat: no-repeat;
1783
    cursor: pointer;
1784
    height: 13px;
1785
    position: absolute;
1786
    right: 7px;
1787
    top: 9px;
1788
    width: 13px;
1789
}
1790

    
1791
.popup-header-error {
1792
    background-color: #800000 !important;
1793
}
1794

    
1795
.popup-border-error {
1796
    border-color: #800000 !important;
1797
    width:auto;
1798
}
1799

    
1800
.popup-details-error {
1801
    border: none !important;
1802
}
1803

    
1804
.popup-separator-error {
1805
    margin-bottom: 5px !important;
1806
}
1807

    
1808
#error-success .popup-header, .notification-box .popup-header {
1809
    background-color: #4085A5;
1810
    color: white;
1811
    font-size: 95%;
1812
    font-weight: normal;
1813
    height: 20px;
1814
    margin-left: -16px;
1815
    margin-top: -16px;
1816
    padding-bottom: 2px;
1817
    padding-left: 30px;
1818
    padding-top: 10px;
1819
    width: 482px;
1820
    margin-right:-16px;
1821
}
1822

    
1823

    
1824
#error-success.success h3 span.header-box, .notification-box h3 span.header-box {
1825
    background-color: #71c837;
1826
    display: block;
1827
    background-image: url("../images/save-green.png");
1828
    background-position: right 0;
1829
    background-repeat: no-repeat;
1830
    width: 80px;
1831
    padding: 3px 3px 3px 8px;
1832
    margin-top: -6px;
1833
    font-size: 90% !important;
1834
    margin-left: -11px;
1835
}
1836

    
1837
#error-success .popup-body, .notification-box .popup-body {
1838
    background: url("../images/popup-bg.png") repeat-x scroll 0 0 transparent;
1839
    margin-left: -16px;
1840
    margin-right: -16px;
1841
    margin-top: 1px;
1842
    min-height: 142px;
1843
    padding-top: 10px;
1844
}
1845

    
1846
#error-success .popup-body-inner, .notification-box .popup-body-inner {
1847
    background: url("../images/popup-inner-bg.png") repeat-x scroll 0 0 transparent;
1848
    font-size: 80%;
1849
    min-height: 120px;
1850
    margin-left: 20px;
1851
    padding-left: 15px;
1852
    width: 460px;
1853
}
1854

    
1855
#error-success .popup-separator, .notification-box .popup-seperator {
1856
    background-color: #74AEC9;
1857
    height: 1px;
1858
    font-size:1%;
1859
    width: 442px;
1860
    margin-bottom: 30px;
1861
}
1862

    
1863
#error-success .machine-now-building {
1864
    font-size: 95%;
1865
    padding-bottom: 7px;
1866
    padding-top: 10px;
1867
}
1868

    
1869
#error-success.success .machine-now-building {
1870
    padding-bottom: 14px !important;
1871
}
1872

    
1873
#error-success .password-container, .notification-box .password-container {
1874
    width: 430px;
1875
    padding: 5px;
1876
    border: 2px solid #75b54a;
1877
    background-color: #aade87;
1878
}
1879

    
1880
#error-success .password-header, .notification-box .password-header {
1881
    margin-bottom: 5px;
1882
}
1883

    
1884
#error-success .password, .notification-box .password {
1885
    color: #447821;
1886
}
1887

    
1888
#error-success .popup-details, .notification-box .popup-details {
1889
    border: 2px solid #FF7F2A;
1890
    float: left;
1891
    margin-left: 10px;
1892
    padding: 2px;
1893
}
1894

    
1895
#error-success.success .popup-details, .notification-box .popup-details {
1896
    border: none !important;
1897
    float: none !important;
1898
    margin-left: none !important;
1899
    margin-top: 10px;
1900
}
1901

    
1902
#error-success.success .popup-separator, .notification-box .popup-seperator {
1903
    margin-bottom: 14px !important;
1904
}
1905

    
1906
#error-success .write-password, .notification-box .write-password {
1907
    margin-bottom: 5px;
1908
    padding-left: 30px;
1909
}
1910

    
1911
#error-success .write-password-password, .notification-box .write-password-password {
1912
    padding-left: 30px;
1913
    color: #447821;
1914
    display: inline;
1915
    font-size: 110%;
1916
    font-weight: bold;
1917
}
1918

    
1919
#error-success .write-password-details, .notification-box .write-password-details {
1920
    font-size: 75%;
1921
}
1922

    
1923
.more-details {
1924
    display: block;
1925
}
1926

    
1927
.notification-box h3 span.header-box {
1928
    background: transparent;
1929
}
1930

    
1931
.notification-box .machine-now-building {
1932
    padding: 20px 0;
1933
}
1934

    
1935
.notification-box .header-box {
1936
    width: auto !important;
1937
}
1938

    
1939
.notification-box .password {
1940
    text-align: center;
1941
}
1942
.notification-box .password a:hover {
1943
    background-color: #447821;
1944
    color: #fff;
1945
}
1946

    
1947
.notification-box .password a {
1948
    padding: 0.2em;
1949
    text-align: center;
1950
    color: #447821;
1951
    font-weight: bold;
1952
    font-size: 1.2em;
1953
    text-decoration: none;
1954
}
1955

    
1956
.popup-details a:link, .popup-details a:visited {
1957
    color: black;
1958
}
1959

    
1960
.destroy .confirm_single .yes {
1961
    background-color: #880000;
1962
    color: #fff;
1963
}
1964

    
1965
.destroy .confirm_single .no {
1966
    background-color: #CC0000;
1967
    color: #880000;
1968
}
1969

    
1970
.destroy .confirm_single .yes:hover {
1971
    background-color:#CC0000;
1972
}
1973

    
1974
div.list div.actions a.selected#action-destroy {
1975
    color: #880000 !important;
1976
}
1977

    
1978
.vm-actions .destroy a#action-destroy.selected {
1979
    color: #880000 !important;
1980
}
1981

    
1982
/* Confirmation boxes */
1983
div.confirm_single, div.confirm_multiple, div.action_error {
1984
    display: none;
1985
    color: black;
1986
}
1987

    
1988
div.confirm_single button, div.confirm_multiple button, div.action_error button {
1989
    font-size: 100%;
1990
    cursor: pointer;
1991
    color: black;
1992
    height: 20px !important;
1993
}
1994

    
1995
div.confirm_single button {
1996
    border: none;
1997
    font-family: Arial, Helvetica, sans-serif;
1998
    line-height: 1em;
1999
    vertical-align: middle;
2000
    padding: 2px 6px;
2001
    padding-bottom:4px;
2002
    height: 15px;
2003
}
2004

    
2005
div.confirm_single button.yes {
2006
    width: 90px;
2007
    background-color:#FF7F2A;
2008
}
2009

    
2010
div.confirm_single button.yes:hover {
2011
    background-color: #FF9955;
2012
}
2013

    
2014
div.confirm_single button.no {
2015
    width: 20px;
2016
    margin-left:-5px;
2017
    background-color: #FF9955;
2018
    color:#d95d0a;
2019
}
2020

    
2021
div.confirm_single button.no:hover {
2022
    color: white;
2023
}
2024

    
2025
div.confirm_multiple_cont {
2026
    background-color: #406A7D;
2027
    margin-top: 0px;
2028
    padding: 3px;
2029
    border-top: 1px solid #444;
2030
    border-bottom: 1px solid #444;
2031
    padding-top:0px;
2032
    margin-top: -1px;
2033
}
2034

    
2035
div.confirm_reboot_required {
2036
}
2037

    
2038
div.confirm_multiple {
2039
    font-size: 65%;
2040
    z-index: 8000;
2041
    /*height: 28px;*/
2042
    width: 700px;
2043
    margin-top: 15px;
2044
}
2045

    
2046
div.confirm_multiple p {
2047
    float: left;
2048
    color: #FFF;
2049
    font-weight: bold;
2050
    margin: 7px 0 0 10px;
2051
}
2052

    
2053
#networks-pane {
2054
    display: none;
2055
}
2056

    
2057
div.confirm_multiple button {
2058
    float: right;
2059
    background-color: transparent;
2060
    border: 1px solid #5CA1C0;
2061
    margin: 4px 5px 0 0;
2062
}
2063

    
2064
div.confirm_multiple button.yes {
2065
    border-color: #FF7F2A;
2066
    padding: 0 12px;
2067
}
2068

    
2069
div.confirm_multiple button.yes:hover {
2070
    background-color: #FF7F2A;
2071
}
2072

    
2073
div.confirm_multiple button.no {
2074
    padding: 0px 16px;
2075
}
2076

    
2077
div.confirm_multiple button.no:hover {
2078
    background-color: #5CA1C0;
2079
}
2080

    
2081
div.action_error {
2082
    width: 120px;
2083
    margin: 14px 0 0 37px;
2084
    background-color: #981D1D;
2085
    font-size: 75%;
2086
    z-index:1;
2087
    color: #FFF;
2088
    position:absolute;
2089
    top: 0px;
2090
}
2091

    
2092
div.action_error .action-error-msg {
2093
    background-color: #fff;
2094
    color: #981D1D;
2095
    border: 1px solid #981D1D;
2096
    padding: 4px;
2097
}
2098
div.action_error .action-error-msg .action {
2099
    font-weight: bold;
2100
}
2101

    
2102
div.action_error .action-error-msg {
2103
    font-size: 0.8em;
2104
}
2105

    
2106
.action_error button {
2107
    width: 75px;
2108
    background-color: transparent;
2109
    border: 1px solid;
2110
    border-color: #981D1D;
2111
    color: #fff !important;
2112
    float: left;
2113
}
2114

    
2115
div.action_error button.details {
2116
    padding-right: 5px;
2117
    width: 100px;
2118
    border-bottom: 2px solid #981D1D;
2119
    border-right: 1px solid #981D1D;
2120
    border-left: 2px solid #981D1D;
2121
    background-color: #E24B4B;
2122
}
2123

    
2124
div.action_error button.close-action-error {
2125
    background-image: url("../images/option-action-remove.png");
2126
    background-color: #fff;
2127
    background-repeat: no-repeat;
2128
    background-position: center center;
2129
    width: 20px;
2130
    border-bottom: 2px solid #981D1D;
2131
    border-right: 2px solid #981D1D;
2132
    border-top: 1px solid #981D1D;
2133
}
2134

    
2135
div.action_error button.details:hover {
2136
    background-color: #FF7F2A;
2137
}
2138

    
2139
div#aboutuser{
2140
    float:right;
2141
    clear: both;
2142
    color: #FFFFFF;
2143
    font-size: 75%;
2144
    margin-top: -25px;
2145
}
2146

    
2147
div#user{
2148
    clear: both;
2149
    color: #FFFFFF;
2150
    font-size: 75%;
2151
    margin-top: 38px;
2152
    padding-bottom: 10px;
2153
    position: absolute;
2154
    right:0;
2155
}
2156

    
2157
div#user a{
2158
    color: #FFFFFF;
2159
    text-decoration: none;
2160
}
2161

    
2162
div#user a.current_lang {
2163
    color: #72ADC8;
2164
}
2165

    
2166
div#user .usermenu {
2167
    float: left;
2168
    cursor: pointer;
2169
    overflow: hidden;
2170
    padding-top: 5px;
2171
    margin-top: -6px;
2172
    position: relative;
2173
}
2174

    
2175
div#user .username {
2176
    display: block;
2177
    margin-right: 10px;
2178
    padding-right: 18px;
2179
    padding-left: 4em;
2180
    min-width: 70px;
2181
    text-align: right;
2182
    height: 20px;
2183
    background: url("../images/down-arrow-light.png") no-repeat right;
2184
    background-position: right 6px;
2185
    font-weight: normal;
2186
}
2187

    
2188
div#user .hovered {
2189
    background: #599EBD;
2190
    overflow: visible;
2191
    border-bottom: 1px solid #C7DFE9;
2192
}
2193

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

    
2198
div#user .active {
2199
    background-color: #BED5E0 !important;
2200
}
2201

    
2202
div#user .active .username {
2203
    color: #599EBD;
2204
    background-image: url("../images/down-arrow-lighter.png");
2205
}
2206

    
2207
div#user .useractions {
2208
    display: none;
2209
}
2210

    
2211
div#user .active .useractions {
2212
    display: block;
2213
    text-align: right;
2214
    color: #4085A5;
2215
    background-color: #D0E3ED;
2216
    margin-top:-1px;
2217
    border-top:1px solid #fff;
2218
    position: relative;
2219
    top: 1px;
2220
    box-shadow: 1px 1px 1px #aaa;
2221
    -moz-box-shadow: 1px 1px 1px #aaa;
2222
    -webkit-box-shadow: 1px 1px 1px #aaa;
2223
}
2224

    
2225
div#user .useractions li {
2226
    padding: 2px 10px;
2227
    border-bottom: 1px solid #efefef;
2228
    text-align: right;
2229
    display: block;
2230
    background-color: transparent;
2231
}
2232

    
2233
div#user .useractions li a {
2234
    color: #4085A5;
2235
    display: inline-block;
2236
    padding:5px 0;
2237
    padding-left: 30px;
2238
    padding-bottom: 6px;
2239
    background-repeat: no-repeat;
2240
    background-position: center left;
2241
}
2242

    
2243
div#user .useractions li.hovered {
2244
    background-color: #E1EFF6;
2245
}
2246

    
2247
div#user .useractions li.last {
2248
    border-bottom: none;
2249
}
2250

    
2251
div#user .useractions .logout a {
2252
    background-image: url("../images/icon-logout.png");
2253
}
2254

    
2255
div#user .langmenu {
2256
    float: left;
2257
    border-left: 1px solid #ffffff;
2258
    padding-left: 10px;
2259
    margin-left: -1px;
2260
}
2261

    
2262
div#user .langmenu .sep {
2263
    display: inline-block;
2264
    color: #72ADC8;
2265
}
2266

    
2267
.separator {
2268
    background-color: #74AEC9;
2269
    height: 10px;
2270
    width: 700px;
2271
    font-size: 1px;
2272
    line-height: 0px;
2273
}
2274

    
2275
#disks.separator {
2276
    background-color: #dea842;
2277
}
2278

    
2279
#networks.separator {
2280
    background-color: #6c535d;
2281
}
2282

    
2283
.network-machine h5 {
2284
    margin-bottom: 20px;
2285
    margin-top:0px;
2286
}
2287

    
2288
.machine-container .separator {
2289
    width: 508px;
2290
    height: 1px;
2291
    margin-top: 2px;
2292
    background-color: #5CA1C0;
2293
    margin-left: 13px;
2294
}
2295

    
2296
.editbuttons {
2297
    display: block;
2298
    clear: none;
2299
    width: 40px;
2300
    margin-right: 0px;
2301
    padding-top: 0px;
2302
    float: right;
2303
    cursor: pointer;
2304
    position: relative;
2305
    z-index: 1000;
2306
}
2307

    
2308
div.editbuttons div.save:hover, div.editbuttons div.cancel:hover {
2309
    background-color: #84b7d0;
2310
}
2311

    
2312
div.editbuttons div.cancel:hover {
2313
    background-image: url("../images/cancel-onhover.png");
2314
}
2315

    
2316
.editbuttons .cancel, .editbuttons .save {
2317
    background-repeat: no-repeat;
2318
    color: transparent;
2319
    height: 16px;
2320
    width: 16px;
2321
    float: left;
2322
}
2323

    
2324
.editbuttons .cancel {
2325
    background-image: url("../images/cancel.png");
2326
    margin-left: 3px;
2327
}
2328

    
2329
.editbuttons .save {
2330
    background-image: url("../images/save.png");
2331
    margin-left: 1px;
2332
}
2333

    
2334
.editbuttons img {
2335
    float:none !important;
2336
    margin: 0px !important;
2337
}
2338

    
2339
.network .namecontainer {
2340
    font-size: 1.1em;
2341
}
2342
.network .machine-name-div .namecontainer {
2343
    font-size: 1em;
2344
    font-weight: bold;
2345
}
2346

    
2347

    
2348
.namecontainer .name {
2349
    position: relative;
2350
}
2351

    
2352
.namecontainer .name .nametextbox, .network-rename-input {
2353
    z-index: 1000;
2354
}
2355

    
2356
.icon .nametextbox {
2357
    width: 255px;
2358
}
2359

    
2360
.nametextbox, .network-rename-input {
2361
    position: relative;
2362
    top: -3px;
2363
    font-size: 65%;
2364
    width: 240px;
2365
    border: 1px solid #aaaaaa;
2366
    padding: 2px;
2367
}
2368

    
2369
.large-spinner {
2370
    background: url("../images/icons/indicators/large/progress.gif");
2371
    margin-left: 298px;
2372
    margin-top: 0px;
2373
    height: 31px;
2374
    width: 49px;
2375
    position: absolute;
2376
    top: 200px;
2377
}
2378

    
2379
#machinesview-icon .large-spinner {
2380
    top: 170px;
2381
}
2382

    
2383
.list .large-spinner {
2384
    margin-top:-30px;
2385
}
2386

    
2387
.single .large-spinner {
2388
    margin-top: 50px;
2389
}
2390

    
2391
div#networks-container {
2392
    display: none;
2393
}
2394

    
2395
div#networks-container .large-spinner {
2396
    margin-top: 50px;
2397
}
2398

    
2399
/* tables in list view */
2400
div.list div.dataTables_filter {
2401
    font-size: 75%;
2402
    margin-bottom: 12px;
2403
}
2404

    
2405
div.list div.dataTables_filter input{
2406
    font-size: 100%;
2407
}
2408

    
2409
.dataTables_wrapper {
2410
    width: 515px;
2411
    padding-bottom: 40px;
2412
}
2413

    
2414
div.list table thead .sorting, div.list table thead .sorting_desc, div.list table thead .sorting_asc {
2415
    padding-right: 15px !important;
2416
}
2417

    
2418
div.list table {
2419
    width: 515px;
2420
    font-size: 75%;
2421
}
2422

    
2423
div.list table tbody td {
2424
    color: #3D3D3D;
2425
    padding:6px;
2426
    vertical-align: middle;
2427
    height: 20px;
2428
}
2429

    
2430
div.list table thead tr {
2431
    border-bottom: 1px solid #aaa;
2432
}
2433
div.list table thead tr th {
2434
    background-color: #CDE2EC;
2435
    background-image: url("../images/bg.gif");
2436
    background-repeat: no-repeat;
2437
    background-position: right 11px;
2438
    font-weight: normal;
2439
    border: 1px solid transparent;
2440
    border-bottom: none;
2441
    padding: 4px;
2442
    text-align: left;
2443
    vertical-align: middle;
2444
    cursor: pointer;
2445
}
2446

    
2447
div.list table thead .sorting_asc, div.list table thead .sorting_desc {
2448
    background-color: #5CA1C0;
2449
}
2450

    
2451
div.list table thead .sorting_asc {
2452
    background-image: url("../images/asc.gif");
2453
}
2454

    
2455
div.list table thead .sorting_desc {
2456
    background-image: url("../images/desc.gif");
2457
}
2458

    
2459
div.list table .selection div.expand-icon {
2460
    background-image: url("../images/asc.gif");
2461
    background-repeat: no-repeat;
2462
    position: relative;
2463
    cursor: pointer;
2464
    width: 15px;
2465
    height: 4px;
2466
    left: 19px;
2467
    top: -11px;
2468
}
2469

    
2470
ul.dropdown-selector {
2471
    background-color: #E6EEEE;
2472
    position: absolute;
2473
    margin-left: 1px;
2474
    display: block;
2475
    top: 255px;
2476
    font-size:75%;
2477
    width:40px;
2478
}
2479

    
2480
ul.dropdown-selector li {
2481
    padding: 4px;
2482
}
2483

    
2484
ul.dropdown-selector li:hover {
2485
    background-color: #5CA1C0;
2486
}
2487

    
2488
ul.dropdown-selector li a{
2489
    color: black;
2490
    text-decoration: none;
2491
}
2492

    
2493
div.list table span.imagetag {
2494
    display: none;
2495
}
2496

    
2497
div.list table thead .vmos {
2498
    width: 20px !important;
2499
    vertical-align:middle;
2500
}
2501

    
2502
div.list table .selection {
2503
    width: 20px !important;
2504
    text-align: left;
2505
    background-image: none;
2506
    padding-left: 6px;
2507
}
2508

    
2509
div.list table thead .vmflavor {
2510
    width: 100px !important;
2511
}
2512

    
2513
/* group column commented out for v0.5
2514
div.list table thead .vmgroup {
2515
    width: 40px !important;
2516
}
2517
*/
2518

    
2519
div.list table thead .vmstatus {
2520
    width: 50px !important;
2521
}
2522

    
2523
div.list table thead .vmname {
2524
    width: 110px !important;
2525
}
2526

    
2527
.spinner, .action-indicator {
2528
    clear: right;
2529
    float:right;
2530
    margin: 10px 6px 0 15px;
2531
}
2532

    
2533
.icon .spinner {
2534
    margin: 20px 4px 0 15px !important;
2535
}
2536

    
2537
.single .state .spinner {
2538
    margin: 20px 55px 0 15px !important;
2539
}
2540

    
2541
.action-indicator {
2542
    margin-right: 18px;
2543
}
2544

    
2545
.list span.action-indicator {
2546
    display: block;
2547
    width: 15px;
2548
    height: 20px;
2549
    margin: 0 !important;
2550
    float: none;
2551
}
2552

    
2553
.wave {
2554
    clear: right;
2555
    float:right !important;
2556
    margin: 10px 15px 0 15px !important;
2557
}
2558

    
2559
.hidden {
2560
    display:none; 
2561
}
2562

    
2563
div.actions a.selected, div.actions a.selected:hover, div.machine-actions a.selected, div.machine-actions a.selected:hover {
2564
    display:block !important;
2565
}
2566

    
2567
.action_error .message, .action_error .code {
2568
    display: none;
2569
}
2570

    
2571
.fixed {
2572
    bottom: 0;
2573
    position: fixed !important;
2574
}
2575

    
2576
/* Networks */
2577
#networkscreate {
2578
}
2579

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

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

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

    
2601
#createcontainer {
2602
}
2603

    
2604
#networks-container {
2605
}
2606

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
2727
div.network-machines, div.firewall {
2728
    margin-left: 70px;
2729
}
2730

    
2731
div.firewall {
2732
    margin-left: 70px;
2733
    margin-bottom: 3px;
2734
    margin-top: -15px;
2735
}
2736

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

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

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

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

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

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

    
2765
.state {
2766
}
2767

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

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

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

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

    
2802

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
2938
.private-networks .state {
2939
}
2940

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

    
3047
.machine-name .name {
3048
}
3049

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

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

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

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

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

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

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

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

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

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

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

    
3108
.firewall .progress-indicator {
3109
  position: absolute;
3110
  right: 10px;
3111
  top: 11px;
3112
}
3113

    
3114
.firewall-content {
3115
    color: black;
3116
    font-size: 0.8em;
3117
    height: 55px;
3118
    padding-top: 10px;
3119
}
3120

    
3121
.firewall-content input {
3122
  cursor: pointer;
3123
}
3124

    
3125
.firewall-content .checkbox-legends {
3126
    cursor: pointer;
3127
}
3128

    
3129
.firewall-content .checkbox-legends.current {
3130
    font-weight: bold;
3131
}
3132

    
3133
.firewall-content .checkbox-legends {
3134
    vertical-align: text-top;
3135
}
3136

    
3137
.checkbox-legends a {
3138
    color: black;
3139
    text-decoration: underline;
3140
    font-size: 100%;
3141
}
3142

    
3143
h5.machine-connect {
3144
    font-size: 75%;
3145
    margin-bottom: 3px;
3146
    height: 23px;
3147
}
3148

    
3149
.machine-connect span {
3150
    text-decoration: underline;
3151
}
3152

    
3153
h5.machine-connect span:hover {
3154
    cursor: pointer;
3155
}
3156

    
3157
.firewall-apply {
3158
    position: absolute;
3159
    background-color: #4085a5;
3160
    border: none;
3161
    font-size: 105%;
3162
    height: 18px;
3163
    width: 75px;
3164
    bottom: 13px;
3165
    right: 10px;
3166
}
3167

    
3168
.firewall-apply:hover {
3169
    background-color:#5CA1C0;
3170
}
3171

    
3172
.name-div {
3173
    margin: -9px 0 30px 70px;
3174
}
3175

    
3176
.machine-name-div {
3177
    margin-bottom: 20px;
3178
    margin-left: 60px;
3179
}
3180

    
3181
div.reboot-dialog {
3182
    display: none;
3183
    color: black;
3184
    background-color: #4085A5;
3185
    font-size: 75%;
3186
    margin-top: 15px;
3187
    width: 698px;
3188
    z-index: 1;
3189
}
3190

    
3191
div#reboot-machine-template, div.reboot-machine-entry {
3192
    display: none;
3193
    padding: 0 0 10px 35px;
3194
    width: 300px;
3195
}
3196

    
3197
div.reboot-dialog p {
3198
    color: #FFFFFF;
3199
    padding: 10px 0 10px 10px;
3200
}
3201

    
3202
div.reboot-dialog button {
3203
    float:right;
3204
    border: 1px solid #FF7F2A;
3205
    background-color: transparent;
3206
    font-size:100%;
3207
}
3208

    
3209
div.reboot-dialog button:hover {
3210
    background-color: #FF7F2A;
3211
}
3212

    
3213
div.reboot-dialog button.reboot-all {
3214
    margin: -30px 35px 0 0;
3215
}
3216

    
3217
div.reboot-dialog button.reboot-single {
3218
    color: black;
3219
    margin-top: -20px;
3220
}
3221

    
3222
div.reboot-dialog div.code, div.reboot-dialog div.action, div.reboot-dialog div.message, div.reboot-dialog button.details {
3223
    display:none;
3224
}
3225

    
3226
div.reboot-dialog button.details {
3227
    border-color: #800000;
3228
    margin-top: -20px;
3229
}
3230

    
3231
div.reboot-dialog button.details:hover {
3232
    background-color: #800000;
3233
}
3234

    
3235
/* Metadata */
3236
.machine .info-content {
3237
    display: none;
3238
}
3239

    
3240
.machine .info-content.ips .collection {
3241
  padding: 0;
3242
}
3243

    
3244
.machine .info-content.ips .ips .model-item .subnet {
3245
  padding-top: 2px;
3246
  width: 35%;
3247
  float: left;
3248
}
3249

    
3250
.machine .info-content.ips .ips .port-ip-item:last-child {
3251
  margin-bottom: 0;
3252
}
3253

    
3254
.machine .info-content.ips .ips .port-ip-item:hover {
3255
  background-color: #75A7BF;
3256
}
3257

    
3258
.machine .info-content.ips .ips .port-ip-item {
3259
  padding: 6px;
3260
  margin-bottom: 2px;
3261
}
3262

    
3263
.machine .info-content.ips .ips .model-item .ip {
3264
  padding-top: 2px;
3265
  width: 55%;
3266
  float: left;
3267
}
3268

    
3269
.machine .info-content.ips .ips .model-item .type {
3270
  float: left;
3271
  margin-right: 10px;
3272
  vertical-align: middle;
3273
  color: #fff;
3274
  background-color: #4085A5;
3275
  padding: 3px;
3276
}
3277

    
3278
.single .machine .info-content.ips .ips .model-item .ip {
3279
  width: 85%;
3280
}
3281

    
3282
.single .machine .info-content.ips .ips .model-item .cidr {
3283
  padding-left: 27px;
3284
}
3285

    
3286
.single .machine .info-content.ips .ips .model-item .type {
3287
  font-size: 0.9em;
3288
  padding: 1px 4px;
3289
  margin-top: 4px;
3290
}
3291

    
3292
.machine .info-content.ips .port {
3293
  width: 77%;
3294
  float: left;
3295
  margin-top: 9px;
3296
}
3297

    
3298
.machine .info-content.ips .ips {
3299
  width: 80%;
3300
  float: right;
3301
}
3302

    
3303
.machine .info-content.ips .port-item:last-child {
3304
  border-bottom: none;
3305
  padding-bottom: 0;
3306
  margin-bottom: 0;
3307
}
3308

    
3309
.machine .info-content.ips .port-item {
3310
  border-bottom: 1px solid #75A9C1;
3311
}
3312

    
3313
.machine .info-content.ips .port-item img {
3314
  float: left;
3315
  position: relative;
3316
  left: 4px;
3317
  margin-top: 10px;
3318
  margin-right: 10px;
3319
}
3320

    
3321
.single .machine .info-content.ips .port-item img {
3322
  margin-top: 13px;
3323
}
3324

    
3325
.machine .info-content.ips .port-item .network-header {
3326
  width: 18%;
3327
  float: left;
3328
}
3329

    
3330
.single .machine .info-content.ips .port-item .network-header {
3331
  width: 100%;
3332
  float: none;
3333
}
3334

    
3335
.single .machine .info-content.ips .ips {
3336
  width: 100%;
3337
}
3338

    
3339
.machine .info-content.ips .port-item .port {
3340
  font-weight: bold;
3341
}
3342

    
3343
.single .machine .info-content.ips {
3344
  font-size: 0.8em;
3345
  color: #222;
3346
}
3347

    
3348
.machine .info-content.ips {
3349
    background-color: #84B7D0;
3350
    padding: 0px 0px;
3351
    padding-left: 5px;
3352
    font-size: 0.6em;
3353
}
3354

    
3355
.metadata-container {
3356
    line-height: 12px;
3357
    height: 85px;
3358
    background-color: #84b7d0;
3359
}
3360

    
3361
.metadata-column {
3362
    border-right: 1px solid #5CA1C0;
3363
    color: black;
3364
    float: left;
3365
    font-size: 60%;
3366
    margin-top: 3px;
3367
    height: 70px;
3368
    padding-bottom: 5px;
3369
}
3370

    
3371
.vm-stats {
3372
    padding-left: 10px;
3373
    padding-right: 5px;
3374
    width: 220px;
3375
}
3376

    
3377
.vm-stats div.stat-content {
3378
    height: 18px;
3379
}
3380

    
3381
.vm-stats div.stat-content img {
3382
    margin: 0;
3383
}
3384

    
3385
.vm-stats div img.stat-busy {
3386
    margin-top: -7px;
3387
    margin-left: 90px;
3388
}
3389

    
3390
.vm-stats div.stat-content img.busy {
3391
    margin-left: 95px;
3392
}
3393

    
3394
.vm-stats div.stat-error {
3395
    display:none;
3396
}
3397

    
3398
div.stat-error {
3399
    color: #f00;
3400
}
3401

    
3402
.single div.stat-error {
3403
    text-align: center;
3404
    font-size: 0.8em;
3405
}
3406

    
3407
.metadata-column {
3408
    margin-top: 4px;
3409
}
3410

    
3411
.vm-details {
3412
    width: 130px;
3413
    margin-left:17px;
3414
}
3415

    
3416
.vm-details.metadata-column {
3417
    padding-top: 5px;
3418
    height: 65px;
3419
}
3420

    
3421
.vm-details .image-details {
3422
    margin-top: 8px;
3423
}
3424

    
3425
.vm-details .vm-detail {
3426
    display: block;
3427
}
3428

    
3429
.vm-details span.value {
3430
    color: #444;
3431
}
3432

    
3433
.single-container .lower .stat-busy {
3434
    margin-top: 10px;
3435
    margin-left: 325px;
3436
}
3437

    
3438
.vm-metadata {
3439
    padding-left: 10px;
3440
    width: 100px;
3441
    border: none;
3442
}
3443

    
3444
.metadata-left {
3445
}
3446

    
3447
.metadata-right {
3448
    width: 73px;
3449
    float:left;
3450
    height: 35px;
3451
    padding-left: 5px;
3452
    position:relative;
3453
    overflow:hidden;
3454
}
3455

    
3456
.metadata-right .items {
3457
    position:absolute;
3458
    height:20000em;
3459
}
3460

    
3461
.metadata-keys-container {
3462
    height: 60px;
3463
    float: left;
3464
}
3465

    
3466
.single .metadata-keys-container {
3467
    float: none;
3468
    height: auto;
3469
    margin-bottom: 5px;
3470
}
3471

    
3472
.single a.manage-metadata {
3473
    font-size: 80%;
3474
    margin-left:4px;
3475
    color: #383838;
3476
}
3477

    
3478
a.manage-metadata, a.stats-report {
3479
    font-size: 100%;
3480
    color: black;
3481
    margin-left:17px;
3482
    text-decoration: underline;
3483
}
3484

    
3485
a.stats-report {
3486
    margin: 15px 0  0 80px;
3487
}
3488

    
3489
div.machine a.manage-metadata:hover {
3490
    background-color: transparent;
3491
}
3492

    
3493
.single .metadata-actions, .single .metadata-keys-container .items {
3494
    padding-left: 5px;
3495
}
3496
.metadata-actions, .metadata-keys-container .items{
3497
    margin-top: 5px;
3498
}
3499

    
3500
.singe .metadata-actions, .single .metadata-keys-container .items{
3501
    font-size: 80%;
3502
    line-height: 12px;
3503
    width: 300px;
3504
}
3505

    
3506
.metadata-actions .prev,  .metadata-actions .next{
3507
    float:left;
3508
    width:29px;
3509
    height:6px;
3510
    cursor: pointer;
3511
}
3512

    
3513
.metadata-actions .prev {
3514
    background: url("../images/roll-up.png") no-repeat scroll 0 0 transparent;
3515
}
3516

    
3517
.metadata-actions .next {
3518
    background: url("../images/roll-down.png") no-repeat scroll 0 0 transparent;
3519
}
3520

    
3521
.scrollable {
3522
    position:relative;
3523
    overflow:hidden;
3524
    height: 35px;
3525
    width: 120px;
3526
    margin-bottom:2px;
3527
}
3528

    
3529
.scrollable .items {
3530
    position:absolute;
3531
    height:20000em;
3532
}
3533

    
3534
/* single view */
3535
.single {
3536
    color: #383838;
3537
}
3538

    
3539
.single .column1 {
3540
    float: left;
3541
    margin: 1px 0 25px 17px;
3542
    width: 140px;
3543
}
3544

    
3545
.single .column1 .state {
3546
    float: left;
3547
    margin-left: 4px;
3548
    padding-bottom: 6px;
3549
    padding-top: 3px;
3550
    position: relative;
3551
    right: 0;
3552
    text-align: center;
3553
    width: 126px;
3554
}
3555

    
3556
.single .column1 .state-label {
3557
    padding-top: 5px;
3558
}
3559

    
3560
.single .column1 .indicators {
3561
    margin-right: 38px !important;
3562
}
3563

    
3564
.single div.connect-arrow {
3565
    margin-left: -17px;
3566
}
3567

    
3568
.single div.connect-border {
3569
    margin-left: -29px;
3570
}
3571

    
3572
.single .single-actions {
3573
    width: 150px;
3574
    height: 77px;
3575
    margin-bottom: 45px;
3576
    margin-left: -10px;
3577
}
3578

    
3579
.single .vm-actions .action-container {
3580
    margin-bottom: 1px;
3581
}
3582

    
3583
.single .vm-actions .action-container .confirm_single {
3584
    right: -45px;
3585
}
3586

    
3587
.single .vm-actions .action-container.destroy .confirm_single {
3588
}
3589

    
3590
.single .vm-actions .action-container.destroy {
3591
    bottom: -20px;
3592
}
3593

    
3594
.single a.single-action {
3595
    text-decoration: none;
3596
    cursor: pointer;
3597
    display: block;
3598
}
3599

    
3600
.single a.single-action:hover {
3601
    background-color:#A1C8DB;
3602
    width: 162px;
3603
    opacity: 0.8;
3604
    filter: alpha(opacity = 80);
3605
}
3606

    
3607
.single .destroy a.single-action.selected {
3608
    color: #880000 !important;
3609
}
3610

    
3611
.single a.single-action.selected {
3612
    color: #FF7F2A !important;
3613
    width: 50px !important;
3614
}
3615

    
3616
.single a.single-action.selected:hover {
3617
    background-color:transparent;
3618
}
3619

    
3620
.single .spinner, .single .action-indicator {
3621
    margin: 15px 45px 0 0px !important
3622
}
3623

    
3624
.single .action-indicator {
3625
    margin-right: 55px !important;
3626
}
3627

    
3628
.single .wave {
3629
    margin: 15px 53px 0 0px !important
3630
}
3631

    
3632
.icon div.action_error {
3633
    font-size: 100%;
3634
}
3635

    
3636
.single div.action_error {
3637
    position: absolute;
3638
    top: 29px;
3639
    right: 35px;
3640
}
3641

    
3642
.single .column2 {
3643
    background-color: #A1C8DB;
3644
    float: left;
3645
    font-size: 78%;
3646
    line-height: 17px;
3647
    margin: 0 0 10px 5px;
3648
    width: 358px;
3649
}
3650

    
3651
.single .column2 .machine-labels {
3652
    float: left;
3653
    font-size: 90%;
3654
    margin-left: 10px;
3655
    margin-top: 10px;
3656
    width: 125px;
3657
}
3658

    
3659
.single .machine-detail.title {
3660
    background-color: #74AEC9;
3661
    color: #fff;
3662
    padding: 4px 10px;
3663
    font-size: 0.8em;
3664
    width: 338px;
3665
    margin-left: 5px;
3666
    float: left;
3667
}
3668

    
3669
.single .column2 .machine-details {
3670
    float: right;
3671
    text-align: right;
3672
    font-size: 90%;
3673
    width: 210px;
3674
    margin-right: 10px;
3675
    margin-top: 10px;
3676
}
3677

    
3678
.single .column2 .name, .single .column2 .disk, .single .column2 .image-size, .single .column2 .ipv6 {
3679
    margin-bottom: 13px;
3680
}
3681

    
3682
.single .tags {
3683
    clear: both;
3684
    margin-bottom: 10px;
3685
    margin-left: 10px;
3686
}
3687

    
3688
.single .tags-label {
3689
    float: left;
3690
    padding: 0 5px;
3691
    width: 30px;
3692
}
3693

    
3694
.single .tags-down-arrow {
3695
    background: url("../images/tags-down-arrow.png") no-repeat scroll 1px 7px transparent;
3696
    float: left;
3697
    height: 16px;
3698
    width: 9px;
3699
}
3700

    
3701
.single .toggler-header .info-header{
3702
    padding-top:0;
3703
    padding-bottom:0;
3704
}
3705

    
3706
.single .toggler-header {
3707
    font-size: 0.62em;
3708
    cursor: pointer;
3709
    float: left;
3710
    margin-bottom:5px;
3711
}
3712

    
3713
.single .toggler-header span.label {
3714
    font-size: 104%;
3715
}
3716

    
3717
.single .toggler-content {
3718
    background-color: #84B7D0;
3719
    clear: both;
3720
    height: auto;
3721
    padding-bottom: 5px;
3722
    padding-top: 5px;
3723
    width: 339px;
3724
}
3725

    
3726
.single .column3 {
3727
    background-color: #A1C8DB;
3728
    width: 150px;
3729
    overflow: visible;
3730
    padding-bottom: 10px;
3731
    position: absolute;
3732
    right: 20px;
3733
    top: 130px;
3734
}
3735

    
3736
.single .col3 {
3737
    float: right;
3738
    width: 150px;
3739
    margin-right: 15px;
3740
    margin-bottom: 15px;
3741
}
3742

    
3743
.single .column3 .controls {
3744
    font-size: 80%;
3745
    height: 20px;
3746
    padding-left: 7px;
3747
    padding-right: 7px;
3748
    padding-top: 8px;
3749
    padding-bottom: 5px;
3750
    border-bottom: 1px solid #84B7D0;
3751
}
3752

    
3753
.single .column3 .vm-control:hover {
3754
    background-color: #5CA1C0;
3755
}
3756

    
3757
.single .column3 .previous {
3758
    float:left;
3759
    width: 72px;
3760
}
3761

    
3762
.single .column3 .next {
3763
    float: right;
3764
    text-align: center;
3765
    width: 60px;
3766
}
3767

    
3768
.single .column3 .next-label {
3769
    float: right;
3770
    margin-right: 3px;
3771
    margin-top: -2px;
3772
}
3773

    
3774
.single .column3 .next-arrow {
3775
    float: right;
3776
    height: 18px;
3777
    width: 10px;
3778
    background: url("../images/right-arrow.png") no-repeat scroll 3px 2px transparent;
3779
}
3780

    
3781
.single .column3 .prev-label {
3782
    float: left;
3783
    margin-left: 3px;
3784
    margin-top: -2px;
3785
}
3786

    
3787
.single .column3 .prev-arrow {
3788
    background: url("../images/left-arrow.png") no-repeat scroll 3px 2px transparent;
3789
    float: left;
3790
    height: 18px;
3791
    width: 10px;
3792
}
3793

    
3794
.single .column3 .separator {
3795
    width: 135px;
3796
    height: 1px;
3797
    background-color: #84B7D0;
3798
    margin: 0 0 0 7px;
3799
    clear: both;
3800
}
3801

    
3802
.single .column3 .servers {
3803
    font-size: 80%;
3804
    line-height: 15px;
3805
    padding-top: 10px;
3806
    text-align: right;
3807
    overflow: visible;
3808
    position: relative;
3809
}
3810

    
3811
.single .column3 .server-name {
3812
    margin-left: 10px;
3813
    padding-right: 5px;
3814
    cursor: pointer;
3815
    padding-bottom: 2px;
3816
}
3817
div.single div.column3 div.server-name:hover {
3818
    background-color: #5CA1C0;
3819
}
3820
.single .column3 .column3-selected {
3821
    background-color: #84B7D0;
3822
    color: white;
3823
    opacity: 0.8;
3824
    padding-left: 9px;
3825
    width: 160px;
3826
    filter: alpha(opacity = 80);
3827
    position: relative;
3828
    width: 126px;
3829
}
3830

    
3831
.single .toggler {
3832
    color: #FFFFFF;
3833
    float: right;
3834
    font-size: 140%;
3835
}
3836

    
3837
.single .cpu-usage, .single .network-usage {
3838
    text-align: center;
3839
    padding-top: 15px;
3840
    margin-bottom: 5px;
3841
    font-size: 90%;
3842
    font-weight: bold;
3843
}
3844

    
3845
.single .cpu-graph, .single .network-graph {
3846
    margin-left: 20px;
3847
    margin-bottom:30px;
3848
    width: 660px;
3849
}
3850

    
3851
.single div.lower .stats-select .stats-select-option.selected {
3852
    background-color: #4085A5;
3853
    color: #fff;
3854
}
3855

    
3856
.single div.lower .stats-select .stats-select-option {
3857
    cursor: pointer;
3858
    background-color: #DDF1FB;
3859
    color: #4085A5;
3860
    display: block;
3861
    float: left;
3862
    padding: 7px 10px;
3863
    font-size: 0.7em;
3864
}
3865

    
3866
.single div.lower img.stats {
3867
    margin-left: 82px;
3868
}
3869

    
3870
.single div.lower img.stats {
3871
    display: none;
3872
}
3873

    
3874
.single .single-image {
3875
    width: 126px;
3876
    height: 136px;
3877
    margin-bottom: 10px;
3878
    margin-left: 4px;
3879
    background-image: url("../images/icons/machines/large/unknown-sprite.png");
3880
    background-repeat: no-repeat;
3881
    cursor: pointer;
3882
}
3883

    
3884
.single .single-image-state1 {
3885
    background-position: 0px 0;
3886
}
3887

    
3888
.single .single-image-state3 {
3889
    background-position: -252px 0;
3890
}
3891

    
3892
.single .single-image-state4 {
3893
    background-position: -378px 0;
3894
}
3895

    
3896
.single .single-image-state2 {
3897
    background-position: -126px 0;
3898
}
3899

    
3900
.single .column3 .previous, .single .column3 .next {
3901
    cursor: pointer;
3902
    background-color: #84B7D0;
3903
    color: white;
3904
    font-size: 100%;
3905
    height: 15px;
3906
    padding-top: 2px;
3907
}
3908

    
3909
.single .column3 .disabled {
3910
    opacity: 0.5;
3911
    filter: alpha(opacity = 50);
3912
}
3913

    
3914
.single div.lower {
3915
    clear:both;
3916
    background: #EFF7FA repeat scroll 0 0;
3917
    width: 700px;
3918
    padding-bottom: 15px;
3919
}
3920

    
3921
.single div.upper {
3922
    background: transparent;
3923
    margin-bottom: 10px;
3924
    overflow: visible;
3925
    overflow: hidden;
3926
    width: 700px;
3927
    background: #EFF7FA repeat scroll 0 0;
3928
}
3929

    
3930
/* console css */
3931
.console-header-logo {
3932
    padding-top: 16px;
3933
    margin-left: 30px;
3934
    position: fixed;
3935
}
3936

    
3937
.console-header-logo img {
3938
    max-width:100%;
3939
    max-height:65px;
3940
}
3941

    
3942
#console-header div.help-text {
3943
    font-size: 70%;
3944
    font-weight:bold;
3945
    color:#FFFFFF;
3946
    position: absolute;
3947
    height: 20px;
3948
    top: 79px;
3949
}
3950

    
3951
div.console-container {
3952
    margin: 0 0em;
3953
    height: auto;
3954
}
3955

    
3956
#wrapper.console {
3957
    width: auto;
3958
}
3959

    
3960
.console-info {
3961
    font-size:80%;
3962
    color: white;
3963
    position:absolute;
3964
    margin: 15px 0 0 480px;
3965
}
3966

    
3967
applet {
3968
    width:100%;
3969
    height:100%;
3970
}
3971

    
3972
div.console-footer {
3973
    /* this is for version 0.5*/
3974
    display: none;
3975
}
3976

    
3977
.console-footer #footer-text{
3978
    float:left;
3979
    left: auto;
3980
    margin-left:30px;
3981
}
3982

    
3983
/* add network wizard (see also #wizard for shared classes) */
3984
#networks-wizard .header {
3985
    background-color: #4085A5;
3986
    height: 56px;
3987
}
3988

    
3989
#networks-wizard div.name-input {
3990
    margin: 75px 0 0 55px;
3991
}
3992

    
3993
#networks-wizard input {
3994
    border: 1px solid #CCCCCC;
3995
    color: #445566;
3996
    letter-spacing: 1px;
3997
    width: 170px;
3998
}
3999

    
4000
#networks-wizard span.help {
4001
    font-style: italic;
4002
    font-size: 80%;
4003
    margin-left: 10px;
4004
}
4005

    
4006
#networks-wizard .separator-end {
4007
    background-color: #387693;
4008
    height: 6px;
4009
    width: 479px;
4010
    margin-left: -13px;
4011
    margin-top: 19px;
4012
}
4013

    
4014
.red {
4015
    color: red;
4016
}
4017

    
4018
/* add server to network wizard (see also #metadata-wizard for shared classes) */
4019
#add-machines-wizard span.machine-name {
4020
    margin-left: 4px;
4021
    vertical-align: text-top;
4022
}
4023

    
4024
#add-machines-wizard img.list-logo {
4025
    margin: 2px 1px 1px;
4026
}
4027

    
4028
.css-panes {
4029
    clear: both;
4030
    position: relative;
4031
    z-index: 10;
4032
}
4033

    
4034
.last .firewall-content {
4035
}
4036

    
4037
#pub .last .network-separator {
4038
    display:none;
4039
}
4040

    
4041
.public-networks .empty-network-slot {
4042
    display: none;
4043
}
4044

    
4045
.clearfix {
4046
    display: block;
4047
    width: auto;
4048
    zoom: 1;
4049
}
4050

    
4051
/* float clearing for all browsers except the devil one */
4052
.clearfix:after{
4053
  clear: both;
4054
  content: ".";
4055
  display: block;
4056
  height: 0;
4057
  visibility: hidden;
4058
  font-size: 0;
4059
}
4060

    
4061
* html .clearfix {
4062
    display: inline-block;
4063
}
4064

    
4065
.icon .cont-toggler {
4066
    margin-top: -1px;
4067
}
4068

    
4069
.icon .wave {
4070
    margin-right: 4px !important;
4071
    margin-top: 15px !important;
4072
}
4073

    
4074
.icon .status {
4075
    margin-right: 3px;
4076
}
4077

    
4078
#machinesview .status, .single .state {
4079
    font-size: 75%;
4080
}
4081

    
4082
#machinesview-list div.action-indicator {
4083
    margin:0 !important;
4084
    float: none !important;
4085
}
4086

    
4087
.icon div.action-indicator {
4088
    margin-top: 14px;
4089
    margin-right: 4px;
4090
}
4091

    
4092
div.action-indicator {
4093
    width: 15px;
4094
    height: 20px;
4095
    background-repeat: no-repeat;
4096
    background-position: 0 0;
4097
}
4098

    
4099
tbody.machines div.action-indicator {
4100
    position: relative;
4101
    top: -2px;
4102
}
4103
div.state .destroy, tbody.machines .destroy {
4104
    background-image: url("../images/icons/actions/medium/destroy.png");
4105
}
4106
div.state .console, tbody.machines .console {
4107
    background-image: url("../images/icons/actions/medium/console.png");
4108
}
4109
div.state .start, tbody.machines .start {
4110
    background-image: url("../images/icons/actions/medium/start.png");
4111
}
4112
div.state .resize, tbody.machines .resize {
4113
    background-image: url("../images/icons/actions/medium/resize.png");
4114
}
4115
div.state .reboot, tbody.machines .reboot {
4116
    background-image: url("../images/icons/actions/medium/reboot.png");
4117
}
4118
div.state .shutdown, tbody.machines .shutdown {
4119
    background-image: url("../images/icons/actions/medium/shutdown.png");
4120
}
4121

    
4122
h3.overlay-inner-title {
4123
    color: #4085A5;
4124
    font-size: 2em;
4125
}
4126

    
4127
#add-name-container {
4128
    margin-bottom: 10px;   
4129
}
4130

    
4131
.remove-field-trigger, .add-field-trigger {
4132
    cursor: pointer;
4133
}
4134

    
4135
.add-field-trigger img {
4136
    vertical-align: middle;
4137
}
4138

    
4139
.machine-now-building {
4140
    padding-right: 15px !important;
4141
    text-align: justify;
4142
}
4143

    
4144
.sub-text {
4145
    padding-top: 15px;
4146
    padding-right: 15px;
4147
    text-align: justify;
4148
    font-style: italic;
4149
    font-size: 0.8em !important;
4150
}
4151

    
4152
#notification-box a {
4153
    color: #4085A5;
4154
}
4155

    
4156
#notification-box .machine-title img {
4157
    vertical-align: middle;
4158
}
4159

    
4160
#notifiaction-box .password-header {
4161
    margin-bottom: 0 !important;
4162
}
4163

    
4164
#notification-box .password-container a {
4165
    color: #fff;
4166
    text-decoration: underline;
4167
}
4168

    
4169
#notification-box .password-container a:hover {
4170
    background-color: #fff;
4171
    color: #4085A5;
4172
}
4173

    
4174
#notification-box .password-container {
4175
    background: #4085A5;
4176
    border: none;
4177
}
4178

    
4179
#notification-box .password-container .password a {
4180
    font-weight: normal !important;
4181
}
4182

    
4183
#notification-box .cmd {
4184
    color: #fff;
4185
    font-family: monospace;
4186
    font-size: 1.6em;
4187
}
4188

    
4189
.machine-container .separator {
4190
    background-color: #B0D1E0;
4191
}
4192

    
4193
#creation-password-overlay div.password-cont {
4194
    margin: 10px auto;
4195
    padding: 10px;
4196
    border: 2px solid #75B54A;
4197
    background-color: #AADE87;
4198
    color: #447821;
4199
    text-align: left;
4200
    padding-left: 5em;
4201
    position: relative;
4202
}
4203

    
4204
#creation-password-overlay {
4205
    position: relative;
4206
}
4207

    
4208
#creation-password-overlay .form-action {
4209
    position: absolute;
4210
    bottom: 15px;
4211
    right: 13px;
4212
    font-size: 0.8em;
4213
}
4214

    
4215
#creation-password-overlay .password-label {
4216
    float: left;
4217
}
4218

    
4219
#creation-password-overlay .password {
4220
    font-size: 1.5em;
4221
    font-weight: bold;
4222
    letter-spacing: 2px;
4223
    font-family: Georgia, Times, serif;
4224
    margin-right: 5em;
4225
    float: right;
4226
    margin-top: -4px;
4227
}
4228

    
4229
.feedback-form .description {
4230
    margin-bottom: 25px;
4231
}
4232

    
4233
.feedback-form label {
4234
    display: block;
4235
    font-weight: bold;
4236
    margin-bottom: 10px;
4237
    font-size: 0.8em;
4238
}
4239

    
4240
.feedback-form .form-actions {
4241
    border-top: none;
4242
}
4243

    
4244
.nospace {
4245
    padding-top: 0 !important;
4246
    padding-bottom: 0 !important;
4247
}
4248

    
4249
.noborder {
4250
    border-top: none !important;
4251
    border-bottom: none !important;
4252
}
4253

    
4254
.overlay .feedback-form .messages.description {
4255
    padding-bottom:0;
4256
    margin-bottom: 0;
4257
}
4258

    
4259
.feedback-form .messages .error-message {
4260
    color: #f00;
4261
}
4262

    
4263
.feedback-form .messages .success-message {
4264
    color: #8AA87F;
4265
}
4266

    
4267
.feedback-form .feedback-message {
4268
    width: 548px;
4269
    height: 200px;
4270
    border: 1px solid #ddd;
4271
    padding: 5px;
4272
}
4273

    
4274
#feedback-form .empty-error-msg {
4275
    display: none;
4276
}
4277

    
4278
#feedback-form .data-text {
4279
    display: none;
4280
}
4281

    
4282
#feedback-form .message {
4283
    display: none;
4284
}
4285

    
4286
#feedback-form label {
4287
    display: block;
4288
    font-size: 0.85em;
4289
    font-weight: bold;
4290
}
4291

    
4292
#feedback-form label.inline {
4293
    display: inline;
4294
    padding-left: 5px;
4295
}
4296

    
4297
#feedback-form p {
4298
    padding: 1em 0;
4299
    color: #444;
4300
    margin-bottom: 10px;
4301
}
4302

    
4303
#feedback-form .description {
4304
    font-style: italic;
4305
    font-size: 0.9em;
4306
    color: #888;
4307
}
4308

    
4309
#feedback-form .feedback-text {
4310
    width: 98%;
4311
    height: 100px;
4312
    margin-top: 10px;
4313
    margin-bottom: 10px;
4314
}
4315

    
4316
#feedback-form .submit-data {
4317
    display: none;
4318
}
4319

    
4320
#feedback-form .submit, #invform .submit {
4321
    background-color: #4085A5;
4322
    color: #fff;
4323
    border: none;
4324
    padding: 5px 16px;
4325
    cursor: pointer;
4326
    font-size: 1em;
4327
    position: relative;
4328
}
4329

    
4330
#feedback .submit {
4331
    float: right;
4332
    right: 10px;
4333
    margin-top: 10px;
4334
}
4335

    
4336

    
4337
#feedback-form .submit:hover, #invform .submit:hover {
4338
    background-color: #549FC3;
4339
}
4340

    
4341
.feedback-intro {
4342
    padding-right: 15px !important;
4343
    text-align: justify;
4344
}
4345

    
4346
.popup-body .message {
4347
    padding: 20px 5px;
4348
    display: none;
4349
}
4350

    
4351
.popup-body .loading {
4352
    color: #fff;
4353
}
4354

    
4355
.popup-body .success {
4356
    color: #1F921A;
4357
}
4358

    
4359
.popup-body .errormsg {
4360
    color: #E32424;
4361
}
4362

    
4363

    
4364
.close-msg-box {
4365
    display: block;
4366
    margin-top: 10px;
4367
    cursor: pointer;
4368
    color: #4085A5;
4369
    text-decoration: underline;
4370
}
4371

    
4372

    
4373
.console .ip-version-label {
4374
    margin: 0 5px;
4375
}
4376

    
4377
.ipv6-text, .ipv4-text {
4378
    font-size: 0.9em;
4379
}
4380

    
4381
.fqdn {
4382
}
4383

    
4384
.column2 .fqdn {
4385
  padding: 3px 10px;
4386
}
4387

    
4388
.tooltip {
4389
    background-color: #C4DDE9;
4390
    color: #000;
4391
    font-size: 0.7em;
4392
    padding: 0.2em 0.5em;
4393
    border: 1px solid #888;
4394
    z-index: 50000;
4395
}
4396

    
4397
/*404 and 500 pages*/
4398

    
4399
.error_page {
4400
    position: relative;
4401
    top: 40px;
4402
    padding-bottom: 140px !important;
4403
}
4404

    
4405
.error_page h1 {
4406
    font-weight: normal;
4407
}
4408

    
4409
.error_page .msg_header {
4410
    margin: 0px;
4411
    font-size: 10em;
4412
    position: absolute;
4413
    left: -5px;
4414
    top: 0px;
4415
    color: #4085A5;
4416
    font-family: arial, verdana;
4417
}
4418

    
4419
.error_page p.error_desc {
4420
    color: #fff;
4421
    font-size: 0.8em;
4422
}
4423

    
4424
.error_page {
4425
    padding-right: 50px !important;
4426
    padding-left: 100px !important;
4427
}
4428

    
4429
.error_page .error_content {
4430
    padding-left: 150px;
4431
    padding-top: 97px;
4432
}
4433

    
4434
.error_page .error_content .links, .info_content .links {
4435
    margin-top: 10px;
4436
    margin-left: 20px;
4437
}
4438

    
4439
.error_page .http_error .code {
4440
    letter-spacing: -10px;
4441
    font-size: 9em;
4442
}
4443

    
4444
.error_page .http_error .msg {
4445
    letter-spacing: -1px;
4446
    font-size: 2em;
4447
}
4448

    
4449
.error_page .http_error {
4450
    position: absolute;
4451
    right: 0px;
4452
    bottom: 0px;
4453
    color: #75B3D0;
4454
    line-height: 1em;
4455
}
4456

    
4457
.error_page .error_content a, .info_content .links a {
4458
    color: #4085A5;
4459
    font-weight: bold;
4460
    margin-right: 10px;
4461
    font-size: 0.9em;
4462
}
4463

    
4464
.error_body #container, .info_body #container {
4465
    background-position: right 200px;
4466
}
4467

    
4468
.info_page h1 {
4469
    color: #4085A5;
4470
    font-size: 2em;
4471
    font-weight: normal;
4472
}
4473

    
4474
.info_page p {
4475
    color: #ffffff;
4476
    margin: 1em 0;
4477
}
4478

    
4479
.info_body p a, .error_body p a{
4480
    color: #4085A5;
4481
    text-decoration: underline;
4482
}
4483

    
4484
.error_404 .http_error .code {
4485
    letter-spacing: -7px;
4486
}
4487

    
4488
.network-progress-indicator {
4489
    position: relative;
4490
    display: none;
4491
}
4492

    
4493
.network-progress-indicator img {
4494
    position: absolute;
4495
    bottom: 44px;
4496
    left: 340px;
4497
}
4498

    
4499

    
4500
.single .progress-message {
4501
    margin-top: 90px;
4502
    font-size: 0.6em;
4503
    padding: 0 10px;
4504
    text-align: center;
4505
}
4506

    
4507
/*metadata keys/values*/
4508
.items .tag-item  {
4509
    display: block;
4510
}
4511

    
4512
.single .items .tag-item .key {
4513
    width: 60px;
4514
}
4515

    
4516
.running .scrollable, .terminated .scrollable {
4517
    height: 42px;
4518
}
4519

    
4520
.items .tag-item .key {
4521
    margin-right: 5px;
4522
    width: 30px;
4523
    display: block;
4524
    float: left;
4525
    color: #000;
4526
}
4527

    
4528
.items .tag-item .value {
4529
    color: #444;
4530
}
4531

    
4532
#machinesview-list {
4533
    display: none;
4534
}
4535

    
4536
#machinesview-single {
4537
    position: relative;
4538
    display: none;
4539
}
4540

    
4541
#machinesview-icon {
4542
    display: none;
4543
}
4544

    
4545
#machinesview-icon, #machinesview-single, #machinesview-list {
4546
    
4547
}
4548

    
4549
tbody.machines .spinner {
4550
    margin-top: 0!important;
4551
    margin: 0 !important;
4552
    float: none !important;
4553
}
4554

    
4555
.slider .slider-point {
4556
    width: 4px;
4557
    height: 3px;
4558
    margin-left: 1px;
4559
    background-color: transparent;
4560
    display: block;
4561
    position: absolute;
4562
    z-index: 10;
4563
    bottom: 0px;
4564
}
4565

    
4566
.slider .slider-point-light {
4567
    background-color: transparent;
4568
}
4569

    
4570
.slider-point-text {
4571
    font-size: 0.6em;
4572
    position: absolute;
4573
    top: 4px;
4574
    border-top: 5px solid #C5DEE9;
4575
    padding: 3px;
4576
    color: #4085A5;
4577
    display: block;
4578
    min-width: 6px;
4579
    text-align: middle;
4580
}
4581

    
4582
.slider .handle {
4583
    z-index: 50;
4584
}
4585

    
4586
.modal p.desc {
4587
    margin: 5px 0;
4588
    margin-left: 37px;
4589
    font-size: 0.8em;
4590
    color: #888;
4591
}
4592

    
4593
.api_overlay_template {
4594
    display: none;
4595
}
4596

    
4597
.api_content .password-container .password {
4598
    color: #fff;
4599
    font-size: 1.1em;
4600
}
4601

    
4602
#disks-pane {
4603
    margin-top: 58px;
4604
}
4605

    
4606
span.resend-msg {
4607
    display: block;
4608
    margin-bottom: 5px;
4609
}
4610

    
4611
.success-msg {
4612
    background-color: #5CAD54;
4613
    color: #fff;
4614
    padding: 0.4em;
4615
    border: 1px solid #ddd;
4616
}
4617

    
4618
.error-msg {
4619
    background-color: #800000;
4620
    color: #fff;
4621
    padding: 0.4em;
4622
    border: 1px solid #ddd;
4623
}
4624

    
4625
.success-msg em, .error-msg em {
4626
    font-weight: bold;
4627
    font-style: normal;
4628
    font-size: 0.9em;
4629
}
4630

    
4631
.pagination {
4632
            font-size: 80%;
4633
        }
4634
        
4635
.pagination a {
4636
    text-decoration: none;
4637
        border: solid 1px #AAE;
4638
        color: #15B;
4639
}
4640

    
4641
.pagination a, .pagination span {
4642
    display: block;
4643
    float: left;
4644
    padding: 0.3em 0.5em;
4645
    margin-right: 5px;
4646
        margin-bottom: 5px;
4647
        min-width:1em;
4648
        text-align:center;
4649
}
4650

    
4651
.pagination .current {
4652
    background: #4085A5;
4653
    color: #fff;
4654
        border: solid 1px #AAE;
4655
}
4656

    
4657
.pagination .current.prev, .pagination .current.next{
4658
        color:#999;
4659
        border-color:#999;
4660
        background:#fff;
4661
}
4662

    
4663
table.list-machines .wave {
4664
    float: none !important;
4665
    margin: 0 !important;
4666
}
4667

    
4668
.overlay {
4669
    display: none;
4670
}
4671

    
4672
.overlay .copy-content .clip-copy  {
4673
    right: 10px;
4674
    top:8px;
4675
    border: 1px solid #fff;
4676
}
4677

    
4678
.overlay .copy-content {
4679
    background-color: #387693;
4680
    color: #fff;
4681
    padding: 10px;
4682
    font-size: 1.2em;
4683
    text-align: center;
4684
    position: relative;
4685
}
4686

    
4687
.overlay {
4688
    background-color: #fff;
4689
    border: 2px solid #444;
4690
    text-align: left;
4691

    
4692
    -moz-box-shadow: 0 0 90px 5px #000;
4693
    -webkit-box-shadow: 0 0 90px 5px #000;
4694
    box-shadow: 0 0 90px 5px #000;
4695
    width: 600px;
4696
}
4697

    
4698
.overlay.overlay-createvm {
4699
    width: 640px;
4700
}
4701

    
4702
.overlay a {
4703
    color: #387693;
4704
}
4705

    
4706
.overlay .diagnostics-list {
4707
    height: 400px;
4708
    overflow: scroll;
4709
    overflow-y: scroll;
4710
    overflow-x: hidden;
4711
}
4712

    
4713
.overlay .overlay-content .description.subinfo, .overlay .extra-info {
4714
    margin-bottom:0;
4715
    border-bottom: none;
4716
    padding-bottom:0;
4717
    margin-top: 10px;
4718
    padding-top:10px;
4719
    border-top: 1px solid #64a6c4;
4720
    /*border-top: 1px solid #DBE6EB;*/
4721
    font-size: 0.8em;
4722
}
4723

    
4724
.overlay .overlay-content .important {
4725
    color: #800000;
4726
}
4727

    
4728
.overlay .overlay-content .description.noborder {
4729
  margin-bottom:0;
4730
  border:0;
4731
}
4732

    
4733
.overlay .overlay-content .description {
4734
    color: #444;
4735
    border-bottom: 1px solid #64a6c4;
4736
    margin-bottom: 10px;
4737
    padding-bottom: 10px;
4738
    font-size: 0.9em;
4739
    line-height: 1.6em;
4740
}
4741

    
4742
.overlay .overlay-content .empty-message {
4743
    margin-bottom: 10px;
4744
}
4745

    
4746
.overlay h3.overlay-header {
4747
    font-size: 0.9em;
4748
    text-align: left;
4749
    padding: 0.8em;
4750
    padding-left: 1em;
4751
    font-weight: normal;
4752
    border-bottom: 1px solid #ddd;
4753
}
4754

    
4755
.overlay h3.overlay-header .title {
4756
    float: left;
4757
}
4758

    
4759
.overlay .container {
4760
    position: relative;
4761
    padding-top: 1em;
4762
    padding: 0.5em;
4763
    background-image: url("../images/popup-bg.png");
4764
    background-repeat: repeat-x;
4765
}
4766

    
4767
.overlay .content {
4768
    background-color: transparent;
4769
    background-image: url("../images/popup-inner-bg.png");
4770
    padding: 1em;
4771
    font-size: 0.8em;
4772
    background-repeat: repeat-x;
4773
    -moz-box-shadow: 0 0 1px 1px #888;
4774
    -webkit-box-shadow: 0 0 1px 1px #888;
4775
    box-shadow: 0 0 1px 1px #888;
4776
}
4777

    
4778
.overlay .message {
4779
}
4780

    
4781
.overlay .actions {
4782
    position: absolute;
4783
    right: 0.75em;
4784
    top: 0.6em;
4785
}
4786

    
4787
.overlay .actions span {
4788
    font-size: 0.8em;
4789
    color: #fff;
4790
    cursor: pointer;
4791
    margin-left: 10px;
4792
    display: block;
4793
    float: left;
4794
    background-color: #4085A5;
4795
    padding: 0.2em 0.4em;
4796
}
4797

    
4798
.overlay-error .error-more-details {
4799
    margin-top: 5px;
4800
    max-height: 210px;
4801
    overflow: auto;
4802
}
4803

    
4804
.overlay-error .key.details.expand {
4805
    background-image: url("../images/plus-8.png");
4806
}
4807

    
4808
.overlay-error .key.details {
4809
    background-color: #5189A3;
4810
    cursor: pointer;
4811
    background-image: url("../images/minus-8.png");
4812
    background-repeat: no-repeat;
4813
    background-position: 545px;
4814
}
4815

    
4816
.overlay-error .container {
4817
    padding-top: 1.9em;
4818
}
4819

    
4820
.overlay-error .error-details {
4821
    font-size: 0.8em;
4822
    margin-top: 10px;
4823
}
4824

    
4825
.overlay-error .error-details anonymous {
4826
    display: block;
4827
    margin-top: 10px;
4828
}
4829

    
4830
.overlay-error h3.overlay-header {
4831
    background-color: #800000;
4832
    color: #fff;
4833
}
4834

    
4835
.overlay-error.non-critical h3.overlay-header {
4836
    background-color: #987249;
4837
}
4838

    
4839
.overlay-error span.key {
4840
    font-weight: normal;
4841
    display: block;
4842
    margin-top: 0.5em;
4843
    background-color: #74AEC9;
4844
    color: #fff;
4845
    padding: 0.4em;
4846
    font-size: 0.8em;
4847
    font-weight: bold;
4848
}
4849

    
4850
.overlay-error .indicator {
4851
    background-color: #880000;
4852
    color: #fff;
4853
    padding: 4px;
4854
    display: block;
4855
    float: left;
4856
    border: 1px solid #444;
4857
}
4858

    
4859
.overlay-error .nav-btn:hover {
4860
    
4861
}
4862

    
4863
.overlay-error .nav-btn {
4864
    margin-left: 5px;
4865
    color: #fff;
4866
    display: block;
4867
    float: left;
4868
    padding: 4px;
4869
    background-color: #AAA;
4870
    border: 1px solid #444;
4871
}
4872

    
4873
.overlay-error .error-nav {
4874
    position: absolute;
4875
    right: 0px;
4876
    bottom: -25px;
4877
    font-size: 0.8em;
4878
}
4879

    
4880
.overlay-error span.value, .overlay-error div.value {
4881
    padding: 0.4em;
4882
    display: block;
4883
    margin-bottom: 0.3em;
4884
}
4885

    
4886
.overlay h3 .closeme {
4887
    float: right;
4888
    font-size: 0.7em;
4889
    margin-top: 0.2em;
4890
    cursor: pointer;
4891
}
4892

    
4893
.overlay .overlay-header .subtitle {
4894
    display: block;
4895
    font-size: 0.8em;
4896
    color: #ddd;
4897
}
4898

    
4899
.overlay .overlay-header .subtitle img {
4900
    vertical-align: middle;
4901
    margin-left: 10px;
4902
    margin-bottom: 2px;
4903
}
4904

    
4905
.overlay-info .msg-log-entry .src {
4906
    color: #4085A5;
4907
    float: right;
4908
    font-size: 0.9em;
4909
}
4910

    
4911
.overlay-info .msg-log-entry .date {
4912
    font-style: italic;
4913
}
4914

    
4915
.overlay-info .msg-log-entry pre {
4916
    color: #333;
4917
    width: 100%;
4918
    display: none;
4919
    margin: 10px 0;
4920
}
4921

    
4922
.msg-log-entry.warning {
4923
    color: #E57F01;
4924
}
4925

    
4926
.overlay-info .msg-log-entry.with-details .src {
4927
    margin-right: 15px;
4928
}
4929

    
4930
.overlay-info .msg-log-entry.with-details {
4931
    cursor: pointer;
4932
}
4933

    
4934
.overlay-info .msg-log-entry.with-details {
4935
    background-image: url("../images/plus-8-dark.png");
4936
    background-repeat: no-repeat;
4937
    background-position: 99% 9px;
4938
}
4939

    
4940
.overlay-info .msg-log-entry.with-details.expanded {
4941
    background-image: url("../images/minus-8-dark.png");
4942
}
4943

    
4944
.overlay-info .msg-log-entry .msg {
4945
    display: inline-block;
4946
    margin-left: 10px;
4947
}
4948

    
4949
.overlay-info .msg-log-entry {
4950
    border-bottom: 1px solid #aaa;
4951
    padding: 5px;
4952
}
4953

    
4954
.overlay-info .description.subinfo {
4955
    border: none !important;
4956
    padding-top: 0 !important;
4957
}
4958

    
4959
.overlay-info .content {
4960
    background-repeat: no-repeat;
4961
    background-position: 110% 110%;
4962
    background-color: rgba(255,255,255,0.6)
4963
}
4964

    
4965
.overlay-info .overlay-header {
4966
    background-color: #4085A5;
4967
}
4968

    
4969
.overlay-info .overlay-header .title {
4970
    color: #fff;
4971
}
4972

    
4973
.overlay-info .overlay-header .closeme {
4974
    color: #fff;
4975
}
4976

    
4977
#loading-view {
4978
    width: 400px;
4979
    margin: 0 auto;
4980
    padding: 20px 0;
4981
    font-size: 0.8em;
4982
}
4983

    
4984
#loading-view .header.off {
4985
    color: #829096;
4986
}
4987

    
4988
#loading-view .header.on {
4989
    color: #fff;
4990
    background-image: url("../images/icons/indicators/small/progress.gif");
4991
}
4992

    
4993
#loading-view .header.done {
4994
    color: #2B6681;
4995
    background-image: url("../images/check.png");
4996
}
4997

    
4998
#loading-view .header {
4999
    font-size: 0.9em;
5000
    text-align: left;
5001
    border-bottom: 1px solid #578BA3;
5002
    margin-bottom: 10px;
5003
    padding-bottom: 6px;
5004
    background-repeat: no-repeat;
5005
    background-position: 380px 0px;
5006
}
5007

    
5008
#loading-view .header span {
5009
    font-weight: bold;
5010
    color: #4085A5;
5011
}
5012

    
5013
#loading-view .info {
5014
    color: #ddd;
5015
}
5016

    
5017
.options-list {
5018
    margin-top: 0.5em;
5019
    font-size: 0.8em;
5020
}
5021

    
5022
.options-list.four li {
5023
    float: left;
5024
    display: block;
5025
    width: 25%;
5026
    margin-bottom: 5px;
5027
}
5028

    
5029
.options-list.five li:nth-child(4n) .options-object-cont {
5030
    margin-right: 0;
5031
}
5032

    
5033
.options-list.five li {
5034
    float: left;
5035
    display: block;
5036
    width: 20%;
5037
    margin-bottom: 5px;
5038
}
5039

    
5040
.options-list.five li:nth-child(5n) .options-object-cont {
5041
    margin-right: 0;
5042
}
5043

    
5044
.options-object-cont input {
5045
    border: 1px solid #aaa;
5046
    width: 92px;
5047
    padding: 0;
5048
    margin: 0;
5049
    margin-top:3px;
5050
    padding: 2px;
5051
}
5052

    
5053
.options-list.three li {
5054
    float: left;
5055
    display: block;
5056
    width: 33%;
5057
    margin-bottom: 5px;
5058
}
5059

    
5060
.meta-list .options-list.three li.options-object.create .options-object-cont {
5061
  background-position: 95% 5px;
5062
}
5063

    
5064
.meta-list .options-list.four li.options-object.create .options-object-cont {
5065
  background-position: 97% 5px;
5066
}
5067

    
5068
.meta-list .options-list li.options-object.create .options-object-cont {
5069
    background-image: url("../images/option-action-add.png");
5070
    background-repeat: no-repeat;
5071
    background-position: 90px 5px;
5072
}
5073

    
5074
.meta-list .options-list li .options-object-cont .option-action,
5075
.meta-list .options-list li.options-object.create {
5076
    cursor: pointer !important;
5077
}
5078

    
5079
.meta-list .options-list li .options-object-cont {
5080
    cursor: inherit;
5081
}
5082

    
5083
.options-list li .options-object-cont {
5084
    padding: 5px;
5085
    margin-right: 4px;
5086
    border: 1px solid #A6D1E6;
5087
    cursor: pointer;
5088
    min-height: 35px;
5089
    position: relative;
5090
}
5091

    
5092
.options-list.three li:nth-child(3n) .options-object-cont {
5093
    margin-right: 0;
5094
}
5095

    
5096
.options-list li.selected .options-object-cont {
5097
    background-color: #efefef;
5098
    border: 2px solid #4085A5;
5099
    padding: 4px;
5100
}
5101

    
5102
.options-list li.selected .options-object-cont .title {
5103
}
5104

    
5105
.options-list li.options-object .title {
5106
    display: block;
5107
    color: #FF7F2A;
5108
    margin-bottom: 2px;
5109
}
5110

    
5111
.options-list li .option-action {
5112
    display: none;
5113
    position: absolute;
5114
    background-repeat: no-repeat;
5115
}
5116

    
5117
.options-list.five li.editing {
5118
    width: 40%;
5119
}
5120

    
5121
.options-list.five li.editing .value {
5122
    display: none;
5123
}
5124

    
5125
.options-list li .remove {
5126
    background-image: url("../images/option-action-remove.png");
5127
    width:10px;
5128
    height:10px;
5129
    right:5px;
5130
    top: 5px;
5131
}
5132

    
5133
.options-list li .edit {
5134
    background-image: url("../images/option-action-edit.png");
5135
    width:10px;
5136
    height:10px;
5137
    right:5px;
5138
    bottom: 8px;
5139
}
5140

    
5141
.options-list li:hover .option-action  {
5142
    display: block;
5143
}
5144

    
5145
.options-list li.options-object .value {
5146
    color: #4085A5;
5147
    margin-top: 5px;
5148
    display: block;
5149
}
5150

    
5151
.options-list li.selected.options-object .value {
5152
}
5153

    
5154
.options-list li .options-object-cont:hover {
5155
    background-color: #fff;
5156
}
5157

    
5158
.options-list li.selected .options-object-cont:hover {
5159
    background-color: #fff;
5160
}
5161

    
5162
.options-list li img {
5163
    float: left;
5164
    margin:2px;
5165
    margin-right: 10px;
5166
    padding-bottom:10px;
5167
}
5168

    
5169
#network-vms-select-content li.options-object .value {
5170
    margin-top: 10px;
5171
    margin-left: 30px;
5172
}
5173

    
5174
#network-vms-select-content li.options-object:hover .options-object-cont,
5175
#network-vms-select-content li.options-object .options-object-cont {
5176
    background-image: url("../images/option-action-add-dark.png");
5177
    background-repeat: no-repeat;
5178
    background-position: 160px 28px;
5179
}
5180

    
5181
#network-vms-select-content li.selected:hover .options-object-cont,
5182
#network-vms-select-content li.selected .options-object-cont {
5183
    background-image: url("../images/option-action-remove.png") !important;
5184
}
5185

    
5186
#metadata-overlay-content .view .value {
5187
    margin-top: 10px;
5188
}
5189

    
5190
#metadata-overlay-content {
5191
    position: relative;
5192
}
5193

    
5194
.vm-meta .editor .predefined .predefined-meta-key:hover {
5195
    background-color: #4e8eac;
5196
    color: #fff;
5197
}
5198

    
5199
.vm-meta .editor .predefined .predefined-meta-key {
5200
    float: left;
5201
    margin-right: 5px;
5202
    padding: 4px;
5203
    display: block;
5204
    cursor: pointer;
5205
}
5206

    
5207
.vm-meta .editor .predefined {
5208
    background-color: #A6D1E6;
5209
    font-size: 0.9em;
5210
    border-top: 1px solid #ddd;
5211
}
5212

    
5213
.vm-meta .editor input {
5214
}
5215
.vm-meta .editor {
5216
    margin-bottom: 10px;
5217
}
5218

    
5219
.vm-meta .editor .form-actions .form-action {
5220
    min-width: 50px;
5221
}
5222

    
5223
.vm-meta .editor .form-field input.meta-key {
5224
    width: 90px;
5225
}
5226

    
5227
.vm-meta .form-field {
5228
    float: left;
5229
}
5230

    
5231
.vm-meta .form-actions .form-action {
5232
    float: left;
5233
    margin-right: 10px;
5234
    height: 11px;
5235
}
5236

    
5237
.vm-meta .editor .form-actions .cancel {
5238
    margin-right: 0;
5239
}
5240

    
5241
.vm-meta .editor .form-actions {
5242
    float: right;
5243
    margin:0;
5244
    padding:0;
5245
    margin-left: 15px;
5246
    margin-top: 0px;
5247
}
5248

    
5249
.vm-meta .editor {
5250
    background-color: rgba(64, 133, 165, 0.898) !important;
5251
    background-color: #649DB8;
5252
    font-size:0.9em;
5253
}
5254

    
5255
.vm-meta .meta-key-title {
5256
    font-size: 1.3em;
5257
    color: #fff;
5258
    margin-bottom: 10px;
5259
    display: none;
5260
    float: left;
5261
}
5262

    
5263
.vm-meta .editor-content {
5264
    padding: 10px;
5265
}
5266

    
5267
.vm-meta .inner-mask {
5268
    background-color: #fff;
5269
    opacity:0.6;
5270
    position: absolute;
5271
    top:0;
5272
    left:0;
5273
}
5274

    
5275
.vm-meta .editor label {
5276
    float: left;
5277
    color: #fff;
5278
    margin-right: 2px;
5279
    padding-top:4px;
5280
    font-size: 0.9em;
5281
}
5282

    
5283
.vm-meta .editor input {
5284
    border: none;
5285
    width: 170px;
5286
    margin-left: 10px;
5287
    font-size: 0.9em;
5288
    padding: 4px;
5289
}
5290

    
5291
.vm-meta li.create .options-object-cont {
5292
    background-color: #B3C9AD ;
5293
    border-color: #788774;
5294
}
5295
.vm-meta li.create .options-object-cont .value,
5296
.vm-meta li.create .options-object-cont .title {
5297
    color: #fff;
5298
}
5299

    
5300
#createvm-overlay-content {
5301
    padding: 0;
5302
}
5303

    
5304
.overlay-createvm .container {
5305
    width: 624px !important;
5306
}
5307

    
5308
.create-vm .vm-network .list-cont.personalize-cont:last-child .confirm-params {
5309
  margin-right: 0!important;
5310
}
5311

    
5312
.create-vm .vm-network .list-cont.personalize-cont:last-child {
5313
  border-right: none;
5314
  margin-right: 0;
5315
  width: 298px;
5316
}
5317

    
5318
.create-vm .vm-network .list-cont.personalize-cont .confirm-params {
5319
  max-height: 240px;
5320
}
5321

    
5322
.create-vm .vm-network .list-cont.personalize-cont {
5323
  height: 330px;
5324
}
5325

    
5326
.create-vm .vm-network .list-cont.personalize-cont {
5327
    width: 47%;
5328
}
5329

    
5330
.create-vm .header-step.current {
5331
    font-weight: bold;
5332
}
5333

    
5334
.create-vm .create-step-cont {
5335
    min-height: 240px;
5336
}
5337
.create-vm .create-controls {
5338
    padding: 10px;
5339
}
5340

    
5341
.create-vm ul li {
5342
    cursor: pointer;
5343
    padding: 4px;
5344
}
5345

    
5346
.create-vm ul li.selected {
5347
    background-color: #aaa;
5348
}
5349

    
5350
.cont-toggler-wrapper {
5351
  float: left;
5352
  margin-right: 5px;
5353
}
5354

    
5355
.cont-toggler {
5356
    background-image: url("../images/down-arrow.png");
5357
    background-position: right;
5358
    background-repeat: no-repeat;
5359
    background-color: #A1C8DB;
5360
    display: inline-block;
5361
    border-right: 6px solid #A1C8DB;
5362
    padding:2px;
5363
    padding-right: 14px;
5364
    padding-left:0;
5365
    cursor: pointer;
5366
    color: #fff;
5367
    font-size: 0.9em;
5368
    float: left;
5369
    margin-right: 5px;
5370
}
5371

    
5372
.cont-toggler .label {
5373
    background-color: #98BDCF;
5374
    padding: 2px;
5375
    padding-left: 5px;
5376
    padding-right: 5px;
5377
}
5378

    
5379
.cont-toggler.open {
5380
    background-color: #98BDCF;
5381
    border-color: #98BDCF;
5382
    background-image: url("../images/up-arrow.png");
5383
}
5384

    
5385
.cont-toggler.open .label {
5386
    background-color: #4085A5;
5387
}
5388

    
5389
.overlay .form label {
5390
    font-color: #444;
5391
    margin-right: 10px;
5392
}
5393

    
5394
.form-field.error label {
5395
    color: #ff0000;
5396
    text-decoration: underline;
5397
}
5398

    
5399
.form-field input {
5400
    border: 1px solid #aaa;
5401
    width: 200px;
5402
    padding: 3px;
5403
}
5404

    
5405
.form-actions {
5406
    margin-top: 5px;
5407
    padding-top:5px;
5408
    border-top: 1px solid #64a6c4;
5409
    font-size: 0.8em;
5410
}
5411

    
5412
.form-actions.plain {
5413
    margin-top: 0px;
5414
    padding-top:0px;
5415
    border-top: 0px;
5416
}
5417

    
5418
.form-action {
5419
    float: right;
5420
    min-width: 140px;
5421
    background-color: #FF7F2A;
5422
    border: 1px solid #FF7F2A;
5423
    text-align: center;
5424
    color: #FFFFFF;
5425
    cursor: pointer;
5426
    padding: 4px;
5427
}
5428

    
5429
.form-action:hover {
5430
    background-color: #FF9955;
5431
    color: #FFF;
5432
}
5433

    
5434
.form-action.prev,
5435
.form-action.cancel {
5436
    background-color: #800;
5437
    border: 1px solid #800;
5438
    float: left;
5439
}
5440

    
5441
.form-action.prev:hover,
5442
.form-action.cancel:hover {
5443
    background-color: #CC0000;
5444
    color: #fff;
5445
}
5446

    
5447
.form-action.next,
5448
.form-action.ok {
5449
    background-color: #080;
5450
    border: 1px solid #080;
5451
}
5452

    
5453
.form-action.next:hover,
5454
.form-action.ok:hover {
5455
    background-color: #00aa00;
5456
    color: #fff;
5457
}
5458

    
5459
.form-action .create,
5460
.form-action .submit {
5461

    
5462
}
5463

    
5464
.form-action.in-progress, button.in-progress {
5465
    background-image: url("../images/icons/indicators/medium/horizontal-progress.gif");
5466
    background-repeat: no-repeat;
5467
    background-position: center center;
5468
    color: transparent;
5469
}
5470

    
5471
#createvm-overlay-content {
5472
    padding: 0;
5473
}
5474

    
5475
.create-vm .image-details.selected .size {
5476

    
5477
}
5478

    
5479
.create-vm .image-details .show-details:hover {
5480
    color: #aaa !important; 
5481
}
5482
.create-vm .image-details.selected .show-details:hover {
5483
    color: #fff !important; 
5484
}
5485

    
5486
.create-vm .image-details.selected .show-details,
5487
.create-vm .image-details.selected .size {
5488
    color: #eee;
5489
}
5490

    
5491
.create-vm .image-details.selected span.owner {
5492
    color: #fff;
5493
}
5494

    
5495

    
5496
.create-vm .image-details p {
5497
    font-size: 0.8em;
5498
    padding-left: 27px;
5499
    display:block;
5500
}
5501

    
5502
.create-vm .image-details span.owner {
5503
    display: block;
5504
    font-size: 0.9em;
5505
    float: right;
5506
    color: #FF7F2A;
5507
    position: absolute;
5508
    top: 5px;
5509
    right: 5px;
5510
}
5511

    
5512
.create-vm .select-image .show-details {
5513
    display: none;
5514
    font-size: 0.8em;
5515
    text-decoration: underline;
5516
    color: #000;
5517
    position: absolute;
5518
    bottom: 5px;
5519
    right: 5px;
5520
}
5521

    
5522
.create-vm .image-details .size {
5523
    margin-top: 2px;
5524
    font-size: 0.8em;
5525
    color: #aaa;
5526
    margin-left: 10px;
5527
}
5528

    
5529
.create-vm .step-cont {
5530
    margin: 15px;
5531
}
5532

    
5533
.create-vm .create-step-cont {
5534
    min-height: 250px;
5535
    float: left;
5536
    width: 624px;
5537
}
5538

    
5539
.create-vm .create-controls {
5540
    padding: 10px;
5541
    border-top: 1px solid #ddd;
5542
}
5543

    
5544
.create-vm .empty {
5545
    font-size: 0.8em;
5546
    color: #444;
5547
}
5548

    
5549
.create-vm h4 {
5550
    color: #5CA1C0;
5551
    margin-bottom: 0.5em;
5552
    font-family: arial;
5553
}
5554
.create-vm ul li {
5555
    cursor: pointer;
5556
    padding: 4px;
5557
    font-size: 0.9em;
5558
}
5559

    
5560
.create-vm .create-step-cont li.ssh-key-option.selected,
5561
.create-vm .create-step-cont li.list-item-option.selected,
5562
.create-vm ul li.selected {
5563
    background-color: #FF7F2A;
5564
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5565
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5566
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5567
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5568
    color: #fff;
5569
}
5570

    
5571
.create-vm .images-list-cont.loading .loading-indicator {
5572
    display: block !important;
5573
}
5574

    
5575
.create-vm .images-list-cont .loading-indicator {
5576
    display: none;
5577
    position: absolute;
5578
    right: -13px;
5579
    top: 2px;
5580
    width: 30px;
5581
    height: 10px;
5582
    background-repeat: no-repeat;
5583
    background-image: url("../images/icons/indicators/medium/progress.gif");
5584
}
5585

    
5586
.create-vm .images-list-cont h4 {
5587
    position: relative;
5588
}
5589

    
5590
.create-vm .images-list-cont {
5591
    width: 40%;
5592
    float: left;
5593
    padding-left: 3%;
5594
    padding-right: 3%;
5595
}
5596

    
5597
.create-vm li p.desc {
5598
    font-size: 0.9em;
5599
}
5600

    
5601
.create-vm p.desc.warning {
5602
    color: #880000;
5603
}
5604

    
5605
.create-vm p.desc.empty {
5606
    color: #000;
5607
}
5608

    
5609
.create-vm p.desc {
5610
    font-size: 0.8em;
5611
    color: #888;
5612
    margin-bottom: 10px;
5613
}
5614

    
5615
.create-vm li.role .values .val:hover {
5616
    background-color: #eee;
5617
}
5618
.create-vm li.role .values .val.selected,  .create-vm li.role .values .val.selected:hover {
5619
    color: #fff;
5620
    background-color: #FF9955;
5621
}
5622

    
5623
.create-vm .images-filter-cont, .create-vm .flavors-predefined-cont {
5624
    width: 18%;
5625
    padding-right: 4%;
5626
    float:left;
5627
    border-right: 1px solid #A1C8DB;
5628
    overflow: auto;
5629
}
5630

    
5631
.create-vm .flavor-options-cont {
5632
    width: 74%;
5633
    float: left;
5634
    margin-left: 20px;
5635
}
5636

    
5637
.create-vm .flavor-options-cont .flavor-options li:hover {
5638
    background-image:-webkit-linear-gradient(top, #E8F4FA, #D1E7F0);
5639
    background-image:-o-linear-gradient(top, #E8F4FA, #D1E7F0);
5640
    background-image:-moz-linear-gradient(top, #E8F4FA, #D1E7F0);
5641
    background-image:linear-gradient(top, #E8F4FA, #D1E7F0);
5642
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E8F4FA', endColorstr='#D1E7F0', GradientType=0);
5643
}
5644

    
5645
.create-vm .flavor-options-cont .flavor-options li.disabled * {
5646
    color: #eee !important;
5647
}
5648

    
5649
.create-vm .flavor-options-cont .flavor-options li.disabled {
5650
    background-image:linear-gradient(top, #aaa, #ddd);
5651
    background-image:-webkit-linear-gradient(top, #aaa, #ddd);
5652
    background-image:-o-linear-gradient(top, #aaa, #ddd);
5653
    background-image:-moz-linear-gradient(top, #aaa, #ddd);
5654
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#aaaaaa', endColorstr='#dddddd', GradientType=0);
5655
}
5656

    
5657
.create-vm .flavor-options-cont .flavor-options li.selected {
5658
    background-color: #FF9955;
5659
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5660
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5661
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5662
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5663
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF9955', endColorstr='#E88B4D', GradientType=0);
5664
    border: 1px solid #C97943;
5665
}
5666

    
5667
.create-vm .predefined-list li.disabled {
5668
    color: #ddd !important;
5669
}
5670

    
5671
.create-vm .flavor-options-cont .flavor-options li {
5672
    display: block;
5673
    float: left;
5674
    margin-right: 10px;
5675
    margin-bottom: 9px;
5676
    padding: 9px 14px;
5677
    border: 1px solid #aaa;
5678
    background-image:-webkit-linear-gradient(top, #D1E7F0, #E8F4FA);
5679
    background-image:-o-linear-gradient(top, #D1E7F0, #E8F4FA);
5680
    background-image:-moz-linear-gradient(top, #D1E7F0, #E8F4FA);
5681
    background-image:linear-gradient(top, #D1E7F0, #E8F4FA);
5682
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D1E7F0', endColorstr='#E8F4FA', GradientType=0);
5683
}
5684

    
5685
.create-vm .flavor-opts-list.compact li {
5686
    padding: 7px 9px;
5687
    margin-right: 7px;
5688
}
5689

    
5690
.create-vm .flavor-options-cont .flavor-options {
5691
    margin-bottom: 2px;
5692
}
5693

    
5694

    
5695
.create-vm .flavor-options .metric {
5696
    font-size: 0.8em;
5697
    margin-left: 2px;
5698
}
5699

    
5700
.create-vm .flavor-options span.available {
5701
  font-size: 0.8em;
5702
  font-weight: normal;
5703
  margin-left: 5px;
5704
}
5705

    
5706
.create-vm .flavor-options span.title {
5707
    color: #444;
5708
}
5709

    
5710
.create-vm .flavor-options span.desc {
5711
    display: block;
5712
    color: #aaa;
5713
    font-weight: normal;
5714
    font-size: 0.8em;
5715
    float: right;
5716
    margin-top: 4px;
5717
}
5718

    
5719
.disktip {
5720
    padding: 4px;
5721
    top: 20px;
5722
}
5723

    
5724
.create-vm .flavor-options .flavors-disk-template-list {
5725
    position: relative;
5726
}
5727

    
5728
.create-vm .flavor-options .disk_template.option {
5729
    z-index: 10;
5730
    min-width: 50px;
5731
    text-align: center;
5732
}
5733

    
5734
/*0 position is -470px*/
5735
.create-vm .flavor-options .disk-template-description {
5736
    font-size: 0.8em;
5737
    color: #444;
5738
    background-image: url("../images/horizontal-pointer.png");
5739
    background-repeat: repeat-x;
5740
    background-position: -470px 0;
5741
    padding-top: 15px;
5742
    margin-top: -10px;
5743
    font-style: italic;
5744
    display:block;
5745
    overflow: auto;
5746
    padding-bottom: 0px;
5747
    margin-bottom: 7px;
5748
    width: 100%;
5749
}
5750

    
5751
.create-vm .flavor-options .disk_template.option .description {
5752
    display: none;
5753
    position: absolute;
5754
    bottom: -20px;
5755
    left:0;
5756
    color: #888;
5757
    font-style: italic;
5758
    display: block;
5759
    background-color: #fff;
5760
    width: 100%;
5761
    text-align: left;
5762
    z-index: 0;
5763
    border-top: 1px solid #ddd;
5764
    padding-top: 3px;
5765
    display: none;
5766
}
5767

    
5768
.create-vm .flavor-options .selected .value {
5769
    color: #FFF;
5770
}
5771

    
5772
.create-vm .flavor-options .value {
5773
    font-weight: bold;
5774
    color: #5CA1C0;
5775
}
5776

    
5777
.create-vm .flavor-options-cont h4 {
5778
    border-bottom: 1px solid #A1C8DB;
5779
    padding-bottom: 5px;
5780
}
5781

    
5782
.create-vm .images-info-cont {
5783
    width: 28%;
5784
    padding-left: 3%;
5785
    float: left;
5786
    border-left: 1px solid #A1C8DB;
5787
}
5788

    
5789
.create-vm .select-image.wide .show-details {
5790
    display: inline;
5791
}
5792

    
5793
.create-vm .select-image .images-info-cont .hide {
5794
    display: none;
5795
}
5796

    
5797
.create-vm .select-image.wide .images-info-cont .hide {
5798
    display: block;
5799
    float: right;
5800
    position: absolute;
5801
    right: 10px;
5802
    top: 10px;
5803
    font-size: 0.8em;
5804
    text-decoration: underline;
5805
    color: #5CA1C0;
5806
    cursor: pointer;
5807
}
5808

    
5809
.create-vm .select-image.wide .images-list-cont {
5810
    width: 74%;
5811
    padding-right: 0;
5812
}
5813

    
5814
.create-vm .select-image.wide .images-info-cont .description .title {
5815
    display: none;
5816
    float: none;
5817
}
5818

    
5819
.create-vm .select-image.wide .images-info-cont .description p {
5820
    background-color: #fff;
5821
    border: 1px solid #ddd;
5822
    padding: 10px;
5823
    float: none;
5824
}
5825

    
5826
.create-vm .select-image.wide .selected .size {
5827
    color: #FFF !important;
5828
}
5829

    
5830
.create-vm .select-image.wide .image-details .size {
5831
    color: #5CA1C0;
5832
    position: absolute;
5833
    top: 5px;
5834
}
5835

    
5836
.create-vm .select-image.wide .images-info-cont h3 {
5837
    color: #5CA1C0;
5838
    margin: 10px 0;
5839
    margin-top: 5px;
5840
    text-align: left;
5841
    font-size: 0.9em;
5842
}
5843

    
5844
.create-vm .select-image.wide .images-info-cont .description p {
5845
    height: 50px;
5846
}
5847

    
5848
.create-vm .select-image.wide .images-info-cont .description {
5849
    width: 100% !important;
5850
    float: none !important;
5851
    background-color: transparent !important;
5852
    padding: 0 !important;
5853
    font-size: 1.1em;
5854
}
5855
.create-vm .select-image.wide .images-info-cont .extra-details {
5856
    height: 160px;
5857
    overflow-y: scroll;
5858
    padding-right: 15px;
5859
}
5860

    
5861
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail.extra-meta .title .custom {
5862
    display: inline-block;
5863
}
5864

    
5865
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail.extra-meta .title {
5866
    background-color: #999 !important;
5867
    border-color: #888 !important;
5868
}
5869
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail .custom {
5870
    float: right;
5871
    display: none;
5872
    font-size: 0.8em;
5873
    margin-left: 10px;
5874
    color: #DDD;
5875
    margin-top: 2px;
5876
}
5877

    
5878
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail {
5879
    padding: 0px;
5880
    background-color: transparent;
5881
    margin-bottom: 4px;
5882
}
5883

    
5884
.create-vm .select-image.wide .images-info-cont .extra-details .title {
5885
    float: left;
5886
    display: block;
5887
    width: 39%;
5888
    padding: 1%;
5889
    background-color: #5CA1C0;
5890
    color: #fff;
5891
    border: 1px solid #4F8DAA;
5892
    font-size: 0.8em;
5893
}
5894

    
5895
.create-vm .select-image.wide .images-info-cont .extra-details .value {
5896
    float: right;
5897
    display: block;
5898
    width: 55%;
5899
    padding: 1%;
5900
    border: none;
5901
    background-color: #FFF;
5902
    color: #444;
5903
    border: 1px solid #ddd;
5904
    margin-bottom: 0px;
5905
    font-size: 0.8em;
5906
}
5907

    
5908

    
5909
.create-vm .select-image.wide .images-info-cont .image-detail {
5910
}
5911

    
5912
.create-vm .select-image.wide ul.images-list {
5913
    height: 310px;
5914
    overflow-y: scroll;
5915
    padding-right: 3%;
5916
}
5917

    
5918
.flavors-predefined-cont {
5919

    
5920
}
5921

    
5922
.flavor-options-cont {
5923
}
5924

    
5925
.create-vm .select-image.wide .images-info-cont {
5926
    position: absolute;
5927
    width: 88%;
5928
    background-color: #DAE9F0;
5929
    padding: 2%;
5930
    border-left: none;
5931
    height: 320px;
5932
    box-shadow: 0px 0px 2px #aaa;
5933
    -moz-box-shadow: 0px 0px 2px #aaa;
5934
    -webkit-box-shadow: 0px 0px 2px #aaa;
5935
    display: none;
5936
}
5937

    
5938

    
5939
.create-vm .images-info-cont h4, .create-vm .create-step-cont .param h4{
5940
    color: #FF9955;
5941
    margin-bottom: 1em;
5942
    font-size: 1.2em;
5943
}
5944

    
5945
.create-vm .images-info-cont span.title {
5946
    color: #4085A5;
5947
    display: block;
5948
    margin-bottom: 2px;
5949
    font-size: 0.8em;
5950
}
5951

    
5952
.create-vm .type-filter li {
5953
    font-size: 0.8em;
5954
    /*font-weight: bold;*/
5955
    padding: 4px;
5956
    margin-bottom: 0px;
5957
    color: #FF7F2A;
5958
}
5959

    
5960
.create-vm .images-list li {
5961
    min-height: 30px;
5962
}
5963
.create-vm .images-list .image-details:hover {
5964
    background-color: #eee;
5965
}
5966

    
5967
.create-vm .images-list .image-details.selected:hover {
5968
    background-color: #FF7F2A;
5969
}
5970

    
5971
.create-vm .images-list .image-details.selected {
5972
    /*font-weight: bold;*/
5973
}
5974

    
5975
.create-vm .images-list .image-details {
5976
    padding: 6px;
5977
    margin-bottom:1px;
5978
    position: relative;
5979
}
5980

    
5981
.create-vm .images-list .image-details img {
5982
    vertical-align: middle;
5983
    margin-right: 10px;
5984
}
5985

    
5986
.create-vm .images-info-cont .image-detail:last-child p {
5987
    border-bottom: none;
5988
}
5989

    
5990
.create-vm .images-info-cont h4 img {
5991
    vertical-align: middle;
5992
    margin-right: 7px;
5993
    margin-bottom: 5px;
5994
}
5995

    
5996
.create-vm .images-info-cont .description p {
5997
    font-size: 0.8em;
5998
}
5999

    
6000
.create-vm .images-info-cont p {
6001
    margin-bottom: 7px;
6002
    font-size: 0.9em;
6003
    border-bottom: 1px solid #A1C8DB;
6004
    padding-bottom: 7px;
6005
}
6006

    
6007
.create-vm .step-header {
6008
    padding-bottom:0;
6009
    position: relative;
6010
}
6011

    
6012
.create-vm .step-header .header-step .info span.subtitle {
6013
    font-size: 1.2em;
6014
    color: #fff;
6015
    font-weight: bold;
6016
}
6017

    
6018
.create-vm .step-header .header-step .info span {
6019
    float: none;
6020
    text-align: right;
6021
}
6022

    
6023
.create-vm .step-header .header-step .info {
6024
    position: absolute;
6025
    right: 15px;
6026
    top: 20px;
6027
    font-size: 0.8em;
6028
}
6029

    
6030
.create-vm .step-header .header-step span {
6031
    float: left;
6032
    display: block;
6033
}
6034

    
6035
.create-vm .steps-container {
6036
    width: 2000em;
6037
}
6038

    
6039
.create-vm .step-header .header-step .title {
6040
    margin-top: 20px;
6041
    font-size: 1em;
6042
    margin-left: 10px;
6043
}
6044

    
6045
#createvm-overlay-content {
6046
    width: 624px;
6047
    overflow: hidden;
6048
}
6049

    
6050
.create-vm .steps-history .steps-history-cont.current .title {
6051
    display: block;
6052
    top: 23px;
6053
    left: 43px;
6054
    font-size: 1.2em;
6055
    color: #ffffff;
6056
    font-weight: bold;
6057
    font-family: 'Ubuntu', sans-serif !important;
6058
}
6059

    
6060
.create-vm .steps-history .steps-history-cont.current .subnum {
6061
    display: none;
6062
    float: none;
6063
    font-size: 0.9em;
6064
    font-family: 'Ubuntu', sans-serif  !important;
6065
}
6066

    
6067
.create-vm .steps-history .steps-history-cont.current .subtitle,
6068
.create-vm .steps-history .steps-history-cont.current .description {
6069
    font-family: 'Ubuntu', sans-serif  !important;
6070
}
6071

    
6072
.create-vm .steps-history .steps-history-cont.current .info {
6073
    display: block;
6074
    font-family: 'Ubuntu', sans-serif !important;
6075
}
6076

    
6077
.create-vm .steps-history .steps-history-cont.completed .title,
6078
.create-vm .steps-history .steps-history-cont.completed .num {
6079
    color: #A1C8DB;
6080
}
6081

    
6082
.create-vm .steps-history .steps-history-cont.completed {
6083
    background-color: #4085A5;
6084
    color: #fff;
6085
    cursor: pointer;
6086
}
6087

    
6088
.create-vm .steps-history .steps-history-cont.completed .steps-history-step {
6089
    background-image: url("../images/check.png");
6090
}
6091

    
6092
.create-vm .steps-history .steps-history-cont.current .steps-history-step {
6093
    width: 320px;
6094
}
6095

    
6096
.create-vm .steps-history .steps-history-cont.current .num {
6097
    color: #fff;
6098
}
6099

    
6100
.create-vm .steps-history .steps-history-cont.current .info {
6101
    color: #4085A5;
6102
    font-size: 0.8em;
6103
}
6104

    
6105
.create-vm .steps-history .steps-history-cont.current {
6106
    background-color: #A1C8DB;
6107
    color: #fff;
6108
    width: 416px;
6109
}
6110

    
6111
.create-vm .steps-history-step {
6112
    padding: 4px;
6113
    padding-left: 7px;
6114
    font-size: 1em;
6115
    font-family: 'Ubuntu', sans-serif  !important;
6116
    margin-right: 5px;
6117
    padding-top: 12px;
6118
    background-position: right 30px;
6119
    background-image: none;
6120
    background-repeat: no-repeat;
6121
}
6122

    
6123
.create-vm .steps-history {
6124
    background-color: #4085A5;
6125
}
6126

    
6127
.create-vm .steps-history .steps-history-cont.last {
6128
    border-right: none;
6129
}
6130

    
6131
.create-vm .steps-history .steps-history-cont .num {
6132
    margin-left: 5px;
6133
    margin-top: -10px;
6134
    padding-bottom: 10px;
6135
}
6136

    
6137
.create-vm .steps-history .steps-history-cont .title {
6138
    display: none;
6139
    position: absolute;
6140
    bottom: 0px;
6141
    text-align: center;
6142
    padding-bottom: 2px;
6143
    left:0;
6144
    width: 55px;
6145
    margin-left:0;
6146
    margin-top:0;
6147
    font-size: 0.8em;
6148
}
6149

    
6150
.create-vm .steps-history .steps-history-cont .subnum,
6151
.create-vm .steps-history .steps-history-cont .info {
6152
    display: none;
6153
}
6154

    
6155
.create-vm .steps-history .steps-history-cont {
6156
    height: 70px;
6157
    width: 51px;
6158
    float: left;
6159
    color: #fff;
6160
    border-right: 1px solid #A1C8DB;
6161
    color: #A1C8DB;
6162
    background-color: #4085A5;
6163
    background-position: center right;
6164
    background-image: none;
6165
    background-repeat: no-repeat;
6166

    
6167
    -webkit-transition: background-color .15s ease-in;
6168
    -o-transition: background-color .15s ease-in;
6169
    -moz-transition: background-color .15s ease-in;
6170
    transition: background-color .15s ease-in;
6171

    
6172
    border-bottom: 1px solid #aaa;
6173
}
6174

    
6175
.create-vm .step-header .header-step .num {
6176
    color: #225871;
6177
    font-size: 4em;
6178
    margin-bottom: -5px;
6179
    font-family: 'Ubuntu', sans-serif;
6180
    font-weight: normal !important;
6181
}
6182

    
6183
.create-vm .step-header .header-step {
6184
    color: #;
6185
    margin-bottom: -6px;
6186
    width: 25%;
6187
    padding-left: 0%;
6188
    display: block;
6189
    float: left;
6190
}
6191

    
6192
.create-vm .step-header .header-step.current {
6193
    color: #387693;
6194
}
6195

    
6196
.create-vm .image-filters-title {
6197
    margin-top: 1em;
6198
    margin-bottom: 0.5em;
6199
}
6200

    
6201
.create-vm .create-step-cont span.clear {
6202
    font-size: 0.8em;
6203
    font-weight: bold;
6204
    color: #A1C8DB;
6205
    display: block;
6206
}
6207

    
6208
.create-vm .category-filters li {
6209
    float:left;
6210
    display: block;
6211
    padding: 4px;
6212
    background-color: #eee;
6213
    margin-right: 5px;
6214
    font-size: 0.9em;
6215
    margin-bottom: 5px;
6216
}
6217

    
6218
.create-vm .content-cont {
6219
    height: 340px;
6220
    overflow: auto;
6221
}
6222

    
6223
.create-vm .vm-confirm .confirm-params span.cval {
6224
    margin-left: 8px;
6225
    color: #444;
6226
}
6227

    
6228
.create-vm .vm-confirm .confirm-params span.ckey {
6229
    color: #4085A5;
6230
    font-weight: bold;
6231
}
6232

    
6233
.create-vm .vm-confirm .confirm-params {
6234
    margin-bottom: 15px;
6235
}
6236

    
6237
.create-vm .vm-confirm h3.vm-name {
6238
    background-repeat: no-repeat;
6239
    background-position: left center;
6240
    font-size: 1.4em;
6241
    padding-left: 1.45em;
6242
    color: #4085A5;
6243
}
6244

    
6245
.create-vm .images-list-cont h4 a {
6246
    margin-top: 3px;
6247
    margin-right: -2px !important;
6248
}
6249
.create-vm .images-list-cont h4 a,
6250
.create-vm .list-cont h4 a {
6251
    font-size: 0.8em;
6252
    font-weight: normal;
6253
    margin-right: 5px;
6254
    float: right;
6255
    color: #FF7F2A;
6256
}
6257

    
6258
.create-vm .confirm-params {
6259
    overflow: auto;
6260
}
6261

    
6262
.create-vm .vm-confirm .ssh.confirm-params {
6263
    max-height: 150px;
6264
}
6265

    
6266
.create-vm .personalize-cont .confirm-params {
6267
    max-height: 160px;
6268
    margin-right: 10px;
6269
}
6270

    
6271
.create-vm .personalize-cont,
6272
.create-vm .confirm-cont {
6273
    height: 250px;
6274
}
6275

    
6276
.create-vm .image-warning p {
6277
  width: 80%;
6278
  float: left;
6279
}
6280

    
6281
.create-vm .image-warning .untrusted-image-confirm:hover {
6282
  background-color: #7D674E;
6283
}
6284

    
6285
.create-vm .image-warning .untrusted-image-confirm {
6286
  display: inline-block;
6287
  padding: 5px;
6288
  background-color: #5C4D39;
6289
  color: #FFF;
6290
  width: 10%;
6291
  float: right;
6292
  margin-top: 4px;
6293
  margin-right: 2px;
6294
  cursor: pointer;
6295
  text-align: center;
6296
}
6297

    
6298
.create-vm .image-warning {
6299
  display: none;
6300
  background-color: #987249;
6301
  color: #fff;
6302
  padding: 10px 15px;
6303
  font-size: 0.9em;
6304
  border-top: 1px solid #AAA;
6305
}
6306

    
6307
.create-vm .create-step-cont .rename input.rename-field {
6308
    font-size: 1.4em;
6309
    padding: 5px;
6310
    width: 93%;
6311
    padding-left: 30px;
6312
    background-position: 7px center;
6313
    background-repeat: no-repeat;
6314
}
6315

    
6316
.create-vm .create-step-cont .rename label {
6317
    display: block;
6318
}
6319

    
6320
.create-vm .create-step-cont .personalize-conts,
6321
.create-vm .create-step-cont .confirm-conts {
6322
    margin-top: 20px;
6323
}
6324

    
6325
.create-vm .create-step-cont .personalize-cont,
6326
.create-vm .create-step-cont .confirm-cont {
6327
    width: 30%;
6328
    margin-right: 2%;
6329
    border-right: 1px solid #A1C8DB;
6330
    float: left;
6331
}
6332

    
6333
.create-vm .create-step-cont .confirm-cont ul li .title {
6334
    width: 55px;
6335
    float: left;
6336
}
6337

    
6338
.create-vm .create-step-cont .list-cont ul li .value {
6339
    float: right;
6340
    padding-top: 2px;
6341
    display: block;
6342
    width: 90px;
6343
    text-align: right;
6344
}
6345

    
6346
.create-vm .create-step-cont .list-cont ul li.flavor-disktype .value {
6347
    width: 45px;
6348
}
6349

    
6350
.create-vm .create-step-cont .list-cont ul li.image-description .value,
6351
.create-vm .create-step-cont .list-cont ul li.image-name .value {
6352
    float: none;
6353
    width: auto;
6354
    text-align:left;
6355
    width: auto;
6356
}
6357

    
6358
.create-vm .create-step-cont .list-cont ul li {
6359
    padding:0;
6360
    margin:0;
6361
    margin-bottom: 5px;
6362
    border-bottom: 1px solid #EEE;
6363
    padding-bottom: 7px;
6364
    margin-right: 10px;
6365
}
6366

    
6367
.create-vm .create-step-cont li.ssh-key-option .check,
6368
.create-vm .create-step-cont li.list-item-option .check {
6369
    float: right;
6370
    margin-right: 5px;
6371
    margin-top: 0px;
6372
}
6373

    
6374
.create-vm .create-step-cont li.ssh-key-option.selected {
6375
}
6376
.create-vm .create-step-cont li.ssh-key-option.selected:hover,
6377
.create-vm .create-step-cont li.list-item-option.selected:hover {
6378
    background-color: #F95;
6379
}
6380

    
6381
.create-vm .create-step-cont li.ssh-key-option:hover,
6382
.create-vm .create-step-cont li.list-item-option:hover {
6383
    background-color: #eee;
6384
}
6385

    
6386
.create-vm .create-step-cont li.ssh-key-option.selected {
6387
}
6388

    
6389
.create-vm .create-step-cont li.ssh-key-option,
6390
.create-vm .create-step-cont li.list-item-option {
6391
    padding: 6px !important;
6392
}
6393

    
6394
.create-vm .create-step-cont .list-cont.ssh {
6395
    width: 60%;
6396
}
6397

    
6398
.create-vm .create-step-cont .list-cont.meta h4 {
6399
    margin-right: 0;
6400
}
6401

    
6402
.create-vm .create-step-cont .list-cont.meta {
6403
    margin-right:0;
6404
    border-right: none;
6405
    width: 195px;
6406
}
6407

    
6408
.create-vm .list-cont > h4 {
6409
    font-size: 1.2em;
6410
    margin-right: 10px;
6411
    border-bottom: 1px solid #A1C8DB;
6412
    padding-bottom: 5px;
6413
    color: #387693;
6414
}
6415

    
6416
.create-vm .list-cont .param.image-name {
6417
    margin-bottom: 0 !important;
6418
    border-bottom: none !important;
6419
}
6420

    
6421
.create-vm .list-cont .param h4 {
6422
    margin-bottom: 0px !important;
6423
    font-size: 1.1em !important; 
6424
}
6425

    
6426
.create-vm .list-cont .param {
6427
    margin-bottom: 7px !important;
6428
}
6429

    
6430
.create-vm .list-cont .value {
6431
    font-weight: bold;
6432
}
6433

    
6434
.create-vm .list-cont .param .value {
6435
    font-size: 0.9em;
6436
}
6437

    
6438
.create-vm .list-cont .param .title {
6439
    color: #387693;
6440
}
6441

    
6442
.create-vm .list-cont .image-description {
6443
    margin-left:0;
6444
}
6445

    
6446
.create-vm .list-cont .image-description .value {
6447
    font-weight: normal;
6448
    margin-left: 0 !important;
6449
}
6450

    
6451
.create-vm .list-cont .image-description .title {
6452
    display: none;
6453
    font-size: 0.8em;
6454
}
6455

    
6456
.create-vm .list-cont.meta .values span {
6457
    display:block;
6458
    float: left;
6459
    margin-right: 4px;
6460
    border: 1px solid #eee;
6461
    padding:3px;
6462
    margin-bottom: 4px;
6463
    font-size: 0.9em;
6464
}
6465

    
6466
.create-vm .list-cont.meta .key {
6467
    font-weight: bold;
6468
    font-size: 0.9em;
6469
    display: block;
6470
    margin-bottom: 5px;
6471
}
6472

    
6473
.create-vm .meta input {
6474
    font-size: 0.8em;
6475
}
6476

    
6477
.vm-connect .connect-cont {
6478
    margin-bottom: 20px;
6479
    border-bottom: 1px solid #A1C8DB;
6480
    padding-bottom: 20px;
6481
}
6482

    
6483
.vm-connect .connection-info {
6484
    padding-bottom: 0px;
6485
    margin-bottom: 0;
6486
    border-bottom: none;
6487
}
6488

    
6489
.vm-connect .connection-info .connect a {
6490
    color: #fff;
6491
}
6492

    
6493
.vm-connect .connection-info .connect {
6494
    background-color: #387693;
6495
    color: #fff;
6496
    padding: 10px;
6497
    font-size: 1.2em;
6498
    text-align: center;
6499
}
6500

    
6501
.clip-copy {
6502
    display: block;
6503
    width: 20px;
6504
    height: 20px;
6505
    position: absolute;
6506
    border: 1px solid #387693;
6507
    background-image: url("../images/clipboard.png");
6508
    background-repeat: no-repeat;
6509
    background-position: center;
6510
    cursor: pointer;
6511
    background-color: #A1C8DB;
6512
}
6513

    
6514
.password-cont .clip-copy { right: 10px; top: 8px;}
6515

    
6516

    
6517
input.has-errors {
6518
    border-color: #ff0000;
6519
}
6520

    
6521
.overlay .models-view .previous-view-link {
6522
    margin: -10px;
6523
    margin-bottom:10px;
6524
    padding: 10px 5px;
6525
    background-image: url("../images/left-arrow.png");
6526
    background-repeat: no-repeat;
6527
    background-position: 10px center;
6528
    padding-left: 20px;
6529
    background-color: #93D070;
6530
    cursor: pointer;
6531
    border-bottom: 1px solid #eee;
6532
    text-decoration: underline;
6533
}
6534

    
6535
.icon .suspended-notice {
6536
  right: 192px;
6537
  top: 50px;
6538
}
6539

    
6540
.suspended-notice {
6541
  display: inline-block;
6542
  padding: 4px;
6543
  background-color: #8f1915;
6544
  cursor: pointer;
6545
  position: absolute;
6546
  color: #fff;
6547
  font-size: 0.6em;
6548
  display: none;
6549
}
6550

    
6551
.suspended .suspended-notice {
6552
  display: block;
6553
}
6554

    
6555
.suspended .action-indicator {
6556
  display: none !important;
6557
}
6558

    
6559
.trigger-resize {
6560
    background-image: url("../images/pencil-disabled.png");
6561
    background-position: right 2px;
6562
    background-repeat: no-repeat;
6563
    padding-right: 15px !important;
6564
    cursor: pointer;
6565
}
6566

    
6567
.can-resize .trigger-resize:hover {
6568
    text-decoration: underline;
6569
}
6570

    
6571
.can-resize .trigger-resize {
6572
    font-weight: bold;
6573
    background-image: url("../images/pencil.png");
6574
}
6575

    
6576
.vm-resize .flavor-options-cont {
6577
  float: none;
6578
  width: 100%;
6579
  margin: 0;
6580
  height: auto;
6581
}
6582

    
6583
.form-action.disabled {
6584
  background-color: #ddd;
6585
  color: #aaa;
6586
  border-color: #999;
6587
}
6588

    
6589
.overlay .form-actions .assign {
6590
  display: none;
6591
}
6592

    
6593

    
6594
.connect-ip #network-vms-select-content li.selected .options-object-cont {
6595
  background-image: none !important;
6596
}
6597

    
6598
.overlay.connect-ip .form-actions .assign {
6599
  display: block;
6600
}
6601

    
6602
.overlay.connect-ip .form-actions .create {
6603
  display: none;
6604
}
6605

    
6606
.overlay.connect-ip li.options-object .options-object-cont {
6607
  background-image: none !important; 
6608
}
6609

    
6610
.overlay-public-key-create .container {
6611
  font-size: 0.9em;
6612
}
6613

    
6614
/* Additional styles for views.ext module */
6615
.pane-view {
6616
  background-color: #EFF7FA;
6617
}
6618

    
6619
.collection-list-view .collection {
6620
  padding-top: 14px;
6621
}
6622

    
6623
.collection-list-view .collection .create-button {
6624
  margin-bottom: 15px;
6625
}
6626

    
6627
.collection-list-view .collection .create-button a {
6628
  display: inline-block;
6629
  color: black;
6630
  background-color: #FF7F2A;
6631
  cursor: pointer;
6632
  padding: 7px 24px;
6633
  text-decoration: none;
6634
  border-left: 15px solid #FF9955;
6635
  margin-left: -15px;
6636
  font-family: 'Open Sans', sans-serif;
6637
}
6638

    
6639
.pane-view .collection-list-view .model-view {
6640
  width: 100%;
6641
  background-color: transparent;
6642
  font-size: 75%;
6643
}
6644

    
6645
.pane-view .collection-list-view .model-view.actionpending .main-content-inner,
6646
.pane-view .collection-list-view .model-view.subactionpending .main-content-inner,
6647
.pane-view .collection-list-view .model-view.hovered .main-content-inner,
6648
.pane-view .collection-list-view .model-view:hover .main-content-inner {
6649
  background-color: #A1C8DB;
6650
}
6651

    
6652
.pane-view .collection-list-view .model-view .main-content .title {
6653
  font-weight: normal;
6654
}
6655

    
6656
.pane-view .collection-list-view .model-view .main-content {
6657
}
6658

    
6659
.pane-view .collection-list-view .model-view:last-child .main-content {
6660
  border-bottom: none;
6661
}
6662

    
6663
.pane-view .collection-list-view .model-view .main-content {
6664
  width: 520px;
6665
  padding-bottom: 5px;
6666
  margin-bottom: 5px;
6667
  float: left;
6668
  border-bottom: 1px solid #D1E7F0;
6669
}
6670

    
6671
.pane-view .collection-list-view .model-view .main-content-inner {
6672
  padding: 10px 20px;
6673
  padding-right: 10px;
6674
  /*overflow: hidden;*/
6675
}
6676

    
6677
.pane-view .collection-list-view .model-view .main-content .logo {
6678
  float: left;
6679
}
6680

    
6681
.pane-view .collection-list-view .model-view .main-content .entry {
6682
  width: 290px;
6683
  padding-top: 5px;
6684
  margin-left: 10px;
6685
  float: left;
6686
  position: relative;
6687
}
6688

    
6689
.pane-view .collection-list-view .model-view .main-content .actions-content {
6690
  width: 80px;
6691
  float: left;
6692
}
6693

    
6694
.pane-view .collection-list-view .model-item .link {
6695
  color: #4085A5;
6696
}
6697

    
6698
.collection .no-available a {
6699
  color: #aaa;
6700
}
6701

    
6702
.collection .select-item span.available {
6703
  font-size: 0.9em;
6704
  float: right;
6705
}
6706

    
6707
.collection span.no-available {
6708
}
6709

    
6710
.collection .no-available {
6711
  font-size: 0.8em;
6712
  color: #f00;
6713
}
6714

    
6715
.collection .empty-list {
6716
  padding: 10px;
6717
  font-size: 0.8em;
6718
  color: #333;
6719
}
6720

    
6721
.collection-list-view .items-sublist:first-child {
6722
  padding-top: 0;
6723
}
6724

    
6725
.collection-list-view .items-sublist {
6726
  padding-top: 10px;
6727
}
6728

    
6729
.collection-list-view .items-sublist:last-child {
6730
  margin-top: 20px;
6731
  border-top: 10px solid #DCEBF2;
6732
  margin-bottom: 0;
6733
}
6734

    
6735
.model-item .status-title {
6736
  text-align: right;
6737
  margin-right: 4px;
6738
  margin-top: 5px;
6739
}
6740

    
6741
.model-item .status-indicator {
6742
}
6743

    
6744
.model-item .actions-content {
6745
  width: 180px;
6746
  float: left;
6747
}
6748

    
6749
.model-item .actions-content .action-container .confirm-single .no,
6750
.model-item .actions-content .action-container .confirm-single .yes {
6751
  font-family: Arial, Helvetica, sans-serif;
6752
  width: 20px;
6753
  height: 16px;
6754
  padding: 2px 0;
6755
  float: left;
6756
  border: none;
6757
  margin: 0;
6758
  padding: 2px 0;
6759
  text-align: center;
6760
  font-size: inherit;
6761
}
6762

    
6763
.model-item .actions-content .action-container .confirm-single .no {
6764
  background-color: #FF9955;
6765
}
6766

    
6767
.model-item .actions-content .action-container .confirm-single .yes {
6768
  background-color: #FF7F2A;
6769
  width: 80px;
6770
}
6771

    
6772
.model-item .actions-content .action-container.warn .confirm-single .no:hover {
6773
  color: #fff;
6774
}
6775

    
6776
.model-item .actions-content .action-container.warn .confirm-single .no {
6777
  background-color: #CC0000;
6778
}
6779

    
6780
.model-item .actions-content .action-container.warn .confirm-single .yes {
6781
  background-color: #880000;
6782
  color: #fff;
6783
}
6784

    
6785
.model-item .actions-content .action-container.warn .confirm-single .yes:hover {
6786
  background-color: #CC0000;
6787
}
6788

    
6789
.model-item .actions-content .action-container .confirm-single {
6790
  display: none;
6791
  width: 100px;
6792
  float: right;
6793
  margin-right: -22px;
6794
  margin-top: -4px;
6795
}
6796

    
6797
.model-item .actions-content .action-container.selected .confirm-single {
6798
  display: block !important;
6799
}
6800

    
6801
.model-item.actionpending .actions-content .action-container.isactive,
6802
.model-item:hover .actions-content .action-container.isactive,
6803
/*.model-item.hovered .actions-content .action-container.isactive,*/
6804
.model-item .actions-content .action-container.selected {
6805
  display: block;
6806
}
6807

    
6808
.model-item.actionpending .nested-model-list .actions-content .action-container.isactive {
6809
  display: none;
6810
}
6811

    
6812
.model-item.actionpending .nested-model-list .model-item.actionpending .actions-content .action-container.isactive {
6813
  display: block;
6814
}
6815

    
6816
.model-item .actions-content .action-container.selected:hover {
6817
  background-color: transparent;
6818
  border-left: 5px solid #7DB4CD;
6819
  margin-left: 5px;
6820
}
6821

    
6822
.model-item .actions-content .action-container:hover a {
6823
  color: #fff;
6824
}
6825

    
6826
.model-item .actions-content .action-container:hover {
6827
  background-color: #A1C8DB;
6828
  border-left: 5px solid #7DB4CD;
6829
  margin-left: 5px;
6830
}
6831

    
6832
.model-item .actions-content .action-container.selected {
6833
}
6834

    
6835
.model-item .actions-content .action-container {
6836
  display: none; 
6837
}
6838

    
6839
.model-item .actions-content .action-container {
6840
  padding: 2px;
6841
  margin-bottom: 5px;
6842
  padding-left: 5px;
6843
  margin-left: 10px;
6844
  cursor: pointer;
6845
}
6846

    
6847
.model-item .status-active .status-indicator .indicator {
6848
  background-color: #63cf1c;
6849
}
6850

    
6851
.model-item .status-inactive .status-indicator .indicator {
6852
  background-color: #940606;
6853
}
6854

    
6855
.model-item .status-error .status-indicator .indicator {
6856
  background-color: #ff0000;
6857
}
6858

    
6859
.model-item .status-progress .status-indicator .indicator {
6860
  background-color: #FF7F2A;
6861
}
6862

    
6863
.model-item .status-indicator .indicator {
6864
  width: 10px;
6865
  height: 11px;
6866
  float: right;
6867
  background-color: #EFF7FA;
6868
  margin-right: 3px;
6869
}
6870

    
6871
/* vm sprites */
6872
.vm-icon.medium {
6873
  width: 50px;
6874
  height: 54px;
6875
}
6876

    
6877
.vm-icon.medium.state1 {
6878
    background-position: 0px 0;
6879
}
6880

    
6881
.vm-icon.medium.state2 {
6882
    background-position: -100px 0;
6883
}
6884

    
6885
.vm-icon.medium.state3 {
6886
    background-position: -150px 0;
6887
}
6888

    
6889
.vm-icon.medium.state4 {
6890
    background-position: -50px 0;
6891
}
6892
/* end vm sprites */
6893

    
6894
/* ips */
6895
.ip-port-view .vm-logo {
6896
  width: 
6897
}
6898

    
6899
.model-item .vm-name {
6900
  font-weight: bold;
6901
}
6902

    
6903
.nested-model-list {
6904
  position: relative;
6905
  top: 43px;
6906
  overflow: visible;
6907
  width: 531px;
6908
  margin-left: -41px;
6909
  margin-bottom: 39px;
6910
}
6911

    
6912
.nested-model-list .collection {
6913
  padding: 0;
6914
}
6915

    
6916
.nested-model-list .model-item .outer {
6917
  width: 470px;
6918
  position: relative;
6919
}
6920

    
6921
.model-item .border i.remove,
6922
.empty-list i.add {
6923
    display: block;
6924
    color: #fff;
6925
    padding-left: 10%;
6926
    width: 90%;
6927
    padding-top: 0px;
6928
    font-weight: bold;
6929
    font-size: 1.4em;
6930
    cursor: pointer;
6931
    font-style: normal;
6932
}
6933

    
6934
.model-item .border i.remove {
6935
  font-size: 1em;
6936
  color: #BE5812;
6937
  padding-top: 1px;
6938
}
6939

    
6940
.empty-list.nested {
6941
  height: 30px;
6942
}
6943

    
6944
.empty-list .border2, 
6945
.nested-model-list .outer .border2 {
6946
  border-left: 3px solid #FB822F;
6947
  position: absolute;
6948
  height: 100%;
6949
  width: 1px;
6950
  left:0;
6951
  top:0;
6952
}
6953

    
6954
.empty-list .border2, 
6955
.nested-model-list .model-item:last-child .outer .border2 {
6956
  height: 69px;
6957
}
6958

    
6959
.empty-list .border, .nested-model-list .outer .border {
6960
  position: absolute;
6961
  top: 52px;
6962
  left: 0;
6963
  background-color: #FB822F;
6964
  height: 17px;
6965
  width: 91px;
6966
  z-index: 0;
6967
}
6968

    
6969
.empty-list .border {
6970
  top: 31px;
6971
}
6972

    
6973
.empty-list .border2 {
6974
  height: 31px;
6975
}
6976

    
6977
.nested-model-list .model-item .inner .model-logo {
6978
  position: relative;
6979
  z-index: 100;
6980
}
6981

    
6982
.model-item.actionpending .nested-model-list.proxy .model-item .inner.main-content,
6983
.model-item:hover .nested-model-list.proxy .model-item .inner.main-content,
6984
.model-item.hovered .nested-model-list.proxy .model-item .inner.main-content,
6985
.nested-model-list .model-item.actionpending .inner.main-content,
6986
.nested-model-list .model-item:hover .inner.main-content,
6987
.nested-model-list .model-item.hovered .inner.main-content {
6988
  background-color: #84B7D0;
6989
}
6990

    
6991
.nested-model-list .model-item:last-child .inner.main-content {
6992
  border-bottom: none;
6993
}
6994

    
6995
.nested-model-list .model-item .inner.main-content {
6996
  width: auto;
6997
  margin-bottom: 0;
6998
  float: none;
6999
  z-index: 0;
7000
  margin-left: 30px;
7001
  padding-bottom: 20px;
7002
  padding: 10px;
7003
  border-bottom: 1px solid #5CA1C0;
7004
  /*height: 59px;*/
7005
}
7006

    
7007
.nested-model-list .model-item .inner.main-content .subtitle {
7008
  position: absolute;
7009
  top: 27px;
7010
  left: 110px;
7011
  font-weight: normal;
7012
  font-size: 0.8em;
7013
}
7014

    
7015
.nested-model-list .model-item .inner.main-content .title {
7016
  position: absolute;
7017
  top: 10px;
7018
  left: 110px;
7019
  font-weight: bold;
7020
}
7021

    
7022
.model-item:hover .nested-model-list .actions-content .action-container.isactive {
7023
  display: none;
7024
}
7025

    
7026
.model-item:hover .nested-model-list .model-item.actionpending .actions-content .action-container.isactive {
7027
  display: block !important;
7028
}
7029

    
7030

    
7031
.model-item .actions-content .action-container.selected a {
7032
  color: #FF7F2A;
7033
}
7034

    
7035
.model-item:hover .nested-model-list.proxy .model-item .actions-content .action-container.selected,
7036
.model-item:hover .nested-model-list.proxy .model-item .actions-content .action-container.isactive,
7037
.model-item.hovered .nested-model-list.proxy .model-item .actions-content .action-container.selected,
7038
.model-item.hovered .nested-model-list.proxy .model-item .actions-content .action-container.isactive,
7039
.model-item:hover .nested-model-list .model-item .actions-content .action-container.selected,
7040
.model-item:hover .nested-model-list .model-item:hover .actions-content .action-container.isactive {
7041
  display: block !important;
7042
}
7043

    
7044
.pane-view .model-view .nested-model-list .model-item .actions-content {
7045
  position: absolute;
7046
  right: -180px;
7047
  top:0;
7048
  float: none;
7049
  display: block;
7050
  width: 180px;
7051
  height: 80px;
7052
}
7053

    
7054
/* networks */
7055
.nested-model-list .ip-addresses {
7056
  padding-top: 0px;
7057
  font-size: 0.9em;
7058
  margin-left: 328px;
7059
  text-align: right;
7060
  position: absolute;
7061
  top: 53px;
7062
  right: 10px;
7063
}
7064

    
7065
.network-ports-toggler {
7066
  position: absolute;
7067
  top: 30px;
7068
  left: 0px;
7069
}
7070

    
7071
.model-form-actions .form-action {
7072
  font-size: 1.1em !important;
7073
}
7074

    
7075
.model-form textarea {
7076
    width: 99%;
7077
    height: 100px;
7078
    border: 1px solid #aaa;
7079
}
7080

    
7081
.model-form .form-field {
7082
    margin-bottom: 10px;
7083
}
7084

    
7085
.model-form label {
7086
    display: block;
7087
    color: #406A7D;
7088
    font-size: 1.1em;
7089
    margin: 0px 0 5px 0;
7090
}
7091

    
7092
.model-form .inline label {
7093
    float: left;
7094
    margin-right: 10px;
7095
    margin-top: 15px !important;
7096
}
7097

    
7098
.model-form input.long {
7099
    width: 400px;
7100
}
7101

    
7102
.model-form .inline input {
7103
    width: auto;
7104
    margin-top: 10px;
7105
}
7106

    
7107
.model-form .inline select {
7108
    width: auto;
7109
    margin-top: 7px;
7110
}
7111

    
7112
.model-form .inline .errors,
7113
.model-form .inline .field-desc {
7114
    clear: both;
7115
}
7116

    
7117
.model-action.disabled {
7118
    background-color: #aaa;
7119
    border-color: #aaa;
7120
    cursor: default;
7121
}
7122
.model-action.disabled:hover {
7123
    background-color: #aaa;
7124
    border-color: #aaa;
7125
}
7126

    
7127
.model-action:hover {
7128
    background-color: #aaa;
7129
}
7130

    
7131
.model-action:hover {
7132
    background-color: #F95;
7133
    border-color: #F95;
7134
}
7135

    
7136
.model-action.in-progress {
7137
    background-color: #aaa;
7138
    color: #fff;
7139
    border-color: #aaa;
7140
    background-image: url("../images/icons/indicators/small/progress.gif") !important;
7141
}
7142

    
7143
.model-action.add-generate {
7144
    background-image: url("../images/option-action-generate-ssh.png");
7145
}
7146

    
7147
.model-action.add {
7148
    background-image: url("../images/option-action-add.png");
7149
    padding-right: 20px !important;
7150
}
7151

    
7152
.model-action {
7153
    float: right;
7154
    background-color: #FF7F2A;
7155
    color: #fff;
7156
    padding: 6px 8px;
7157
    margin-left: 10px;
7158
    cursor: pointer;
7159
    padding-right: 30px;
7160
    background-position: right center;
7161
    background-repeat: no-repeat;
7162
    background-clip: border-box;
7163
    border-right: 5px solid #FF7F2A;
7164
    font-size: 0.9em;
7165
}
7166

    
7167
.overlay-public-key-create .error-msg {
7168
    margin-bottom: 5px;
7169
}
7170

    
7171
.model-form.public-key textarea {
7172
  height: 125px;
7173
}
7174

    
7175
.model-notice {
7176
    margin-bottom: 10px;
7177
}
7178

    
7179
.model-notice p.message {
7180
    margin: 0;
7181
    padding: 0; 
7182
    border: 2px solid #444;
7183
    padding: 4px;
7184
    background-color: #efefef;
7185
    line-height: 1.7em;
7186
    padding: 6px;
7187
}
7188

    
7189
.model-notice p.message .download {
7190
    color: #fff;
7191
    background-color: #FF7F2A;
7192
    border: 1px solid #F95;
7193
    padding: 3px;
7194
    cursor: pointer;
7195
}
7196

    
7197

    
7198
.model-notice p.message.success {
7199
    color: #447821;
7200
    background-color: #AADE87;
7201
    border: 1px solid #447821;
7202
}
7203

    
7204
#public-keys-list-view .model-item textarea.content {
7205
  width: 270px;
7206
  background-color: transparent;
7207
  font-family: monospace;
7208
  font-size: 1em;
7209
  border: none;
7210
  overflow-y: hidden;
7211
  overflow-x: hidden;
7212
  height: 155px;
7213
  margin: 10px 0;
7214
  padding: 10px;
7215
  border: 1px solid #ddd;
7216
  background-color: #efefef;
7217
}
7218

    
7219

    
7220
.model-rename-view .edit {}
7221

    
7222
.model-rename-view .edit-btn {
7223
  display: none;
7224
  background-repeat: no-repeat;
7225
  font-size: 75%;
7226
  font-weight: normal;
7227
  margin-left: 10px;
7228
  padding-left: 10px;
7229
  text-align: left;
7230
  cursor: pointer;
7231
  color: #3D3D3D;
7232
  margin-top: 0.4em;
7233
  background-image: url("../images/pencil.png");
7234
  background-position: 0 0px;
7235
  width: 10px;
7236
  height: 7px;
7237
}
7238

    
7239
.model-rename-view:hover .edit-btn {
7240
  display: inline;
7241
}
7242

    
7243
.model-rename-view input {
7244
  border: 1px solid #aaaaaa;
7245
  font-size: 85%;
7246
  padding: 2px;
7247
  width: 235px;
7248
}
7249

    
7250
.model-rename-view .value {}
7251

    
7252
.model-rename-view .name {}
7253

    
7254
.model-rename-view .rename-actions {
7255
  float: right;
7256
  width: 40px;
7257
  position: relative;
7258
  top: 1px;
7259
  left: -6px;
7260
}
7261

    
7262
.model-rename-view .rename-actions .btn {
7263
  float: left;
7264
  height: 16px;
7265
  width: 16px;
7266
  cursor: pointer;
7267
}
7268

    
7269
.model-rename-view .rename-actions .btn.confirm {
7270
  background-image: url("../images/save.png"); 
7271
  margin-left: 3px;
7272
}
7273

    
7274
.model-rename-view .rename-actions .btn.cancel {
7275
  background-image: url("../images/cancel.png"); 
7276
  margin-left: 3px;
7277
}
7278

    
7279
.model-rename-view .rename-actions .btn.confirm:hover {
7280
  background-color: #84b7d0;
7281
}
7282

    
7283
.model-rename-view .rename-actions .btn.cancel:hover {
7284
  background-image: url("../images/cancel-onhover.png"); 
7285
}
7286

    
7287

    
7288
.select-item input {
7289
  cursor: pointer;
7290
}
7291

    
7292
.select-item {
7293
  font-size: 12px;
7294
  padding: 5px 4px;
7295
  margin-bottom: 3px;
7296
  background-color: #efefef;
7297
  cursor: pointer;
7298
}
7299

    
7300
.select-item.selected {
7301
  background-color: #FF7F2A;
7302
}
7303

    
7304
.select-item.selected * {
7305
  color: #fff;
7306
}
7307

    
7308
.steps-container .floating-ips .collection {
7309
}
7310

    
7311
.items-list.floating-ips {
7312
  margin-top: -5px;
7313
}
7314

    
7315
.select-item.floating-ip.not-available {
7316
  background-image: none;
7317
}
7318

    
7319
.select-item.floating-ip.create.no-available {
7320
  background-image: url("../images/option-action-add.png");
7321
}
7322

    
7323
.select-item.floating-ip.create {
7324
  padding-left: 34px;
7325
  margin-bottom: 5px;
7326
  background-image: url("../images/option-action-add-dark.png");
7327
  background-repeat: no-repeat;
7328
  background-position: 9px 7px;
7329
}
7330

    
7331
.select-item.floating-ip.selected * {
7332
  color: #222 !important;
7333
  font-weight: bold;
7334
}
7335

    
7336
.select-item.floating-ip {
7337
  border-left: 10px solid #efefef;
7338
  background-color: #ddd;
7339
  margin-bottom: 0;
7340
  border-bottom: 1px solid #efefef;
7341
}
7342

    
7343
.select-item.private-network .name {
7344
  float: left;
7345
  width: 50%;
7346
}
7347

    
7348
.select-item.vm .status .indicators {
7349
  width: 60px;
7350
  float: left;
7351
  margin: 0px 0 0 0;
7352
}
7353

    
7354
.select-item.vm .status span {
7355
  text-align: right;
7356
  display: block;
7357
  width: 100px;
7358
  float: left;
7359
  font-size: 0.9em;
7360
  margin-top: 2px;
7361
}
7362

    
7363
.select-item.vm .status {
7364
  float: right;
7365
  margin-right: 0px;
7366
  width: 170px;
7367
}
7368

    
7369
.select-item.private-network .cidr {
7370
  float: right;
7371
  width: 40%;
7372
  font-size: 0.9em;
7373
  text-align: right;
7374
  margin-top: 3px;
7375
}
7376

    
7377
.select-item .name {
7378
  float: left;
7379
  width: 90%;
7380
}
7381

    
7382
.select-item .ico {
7383
  float: left;
7384
  width: 5%;
7385
}
7386

    
7387
.select-item .checkbox {
7388
  float: left;
7389
  width: 5%;
7390
}