Statistics
| Branch: | Tag: | Revision:

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

History | View | Annotate | Download (128.6 kB)

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

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

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

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

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

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

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

    
63
#content {
64
    padding-bottom: 10px;
65
    width: 100%;
66
}
67

    
68
div#wrapper {
69
    width: 700px;
70
    margin: 0em auto;
71
    text-align: left;
72
}
73

    
74
#footer a {
75
    color: #fff;
76
}
77

    
78
#footer .software .version {
79
    font-weight: bold;
80
}
81

    
82
#footer .software {
83
    font-size: 0.6em;
84
    margin-top: 7px;
85
    color: #fff;
86
}
87

    
88
#footer {
89
    height: 80px;
90
    background-color: #4085A5;
91
    width:100%;
92
}
93

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

    
101
#footer div.grnet-sign {
102
    margin-top:10px;
103
}
104

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

    
109
#footer div.grnet-sign a:hover {
110
    color: #FFFFFF;
111
}
112

    
113
ol, ul {
114
    list-style: none;
115
}
116

    
117
blockquote, q {
118
    quotes: none;
119
}
120

    
121
blockquote:before, blockquote:after,
122
q:before, q:after {
123
    content: '';
124
    content: none;
125
}
126

    
127
/* remember to define focus styles! */
128
:focus {
129
    outline: 1px dotted #87AADE;
130
}
131

    
132
/* remember to highlight inserts somehow! */
133
ins {
134
    text-decoration: none;
135
}
136

    
137
del {
138
    text-decoration: line-through;
139
}
140

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

    
147
h5 {
148
    font-weight: normal;
149
    margin-bottom:3px;
150
}
151

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

    
159
.create-container a {
160
    font-family: 'Open Sans', sans-serif;
161
}
162

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

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

    
183
ul.css-tabs {
184
    padding: 0;
185
    height:31px;
186
    background-color: #5CA1C0;
187
}
188

    
189
ul.css-tabs .secondary {
190
    position:relative;
191
}
192

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

    
200
ul.css-tabs .current {
201
    background: #4085A5;
202
}
203

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

    
216
ul.css-tabs a:hover {
217
    background: #74AEC9;
218
}
219

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

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

    
234
.css-panes > div.pane {
235
    display:none;
236
}
237

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

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

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

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

    
279
#beforecreate {
280
    background-color: #FF9955;
281
    height: 32px;
282
    width: 13px;
283
}
284

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

    
292
#machines-pane-top.empty {
293
    background: transparent;
294
}
295

    
296
#beforecreate {
297
    border-left: 16px solid #efefef;
298
    margin-left: -16px;
299
}
300

    
301
.create-container {
302
    line-height: 4em;
303
}
304

    
305
#createcontainer a {
306
}
307

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

    
316
#create:hover {
317
    background-color: #FF9955;
318
}
319

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

    
326
.header-logo {
327
    padding-top: 28px;
328
}
329

    
330
div#footer-text a {
331
    color: #FFFFFF;
332
    text-decoration: none;
333
}
334

    
335
div#footer-text{
336
    color: #FFFFFF;
337
    font-size: 75%;
338
    padding-top: 10px;
339
}
340

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

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

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

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

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

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

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

    
402
#networks-wizard h2 {
403
    margin-top: 15px;
404
}
405

    
406
#wizard li {
407
    margin-bottom:1.2em;
408
}
409

    
410
#wizard .pane li {
411
    margin: 0;
412
}
413

    
414
#wizard label {
415
    font-size:120%;
416
    display:block;
417
    clear: both;
418
}
419

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

    
427
#wizard label em {
428
    font-size:75%;
429
    color:#666;
430
    font-style:normal;
431
}
432

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

    
442
#wizard select {
443
    border:1px solid #ccc;
444
    width:94%;
445
    padding:4px;
446
    display: none;
447
}
448

    
449
#wizard .double label {
450
    width:50%;
451
    float:left;
452
}
453

    
454
#wizard .double .text {
455
    width:93%;
456
}
457

    
458
#wizard .clearfix {
459
    clear:left;
460
    padding-top:10px;
461
}
462

    
463
#wizard .right {
464
    float:right;
465
}
466

    
467
#wizard .error {
468
    border:1px solid red;
469
}
470

    
471
#wizard a:hover div.image {
472
    background-color: #C5DEE9;
473
}
474

    
475
.selecteddiv {
476
    background-color: #C5DEE9 !important;
477
}
478

    
479
#wizard label a:hover strong {
480
    color: black;
481
}
482

    
483
#wizard div.image span.size {
484
    font-size: 75%;
485
    color: #666;
486
}
487

    
488
#wizard div.image .radio {
489
    float: left;
490
    margin-top: 10px;
491
}
492

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

    
500
#wizard a:hover div.image span.image-id, #wizard a:hover div.image span.description, #wizard a:hover div.image span.size {
501
    color: black;
502
}
503

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

    
512
#wizard #status {
513
    height: 50px;
514
    background-color: #4085A5;
515
}
516

    
517
#wizard .headernumber {
518
    font-size: 410%;
519
}
520

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

    
529
#wizard .first {
530
    left: -10px;
531
}
532

    
533
#wizard .checked {
534
    color: #64a6c4 !important;
535
}
536

    
537
#wizard .li-2 {
538
    margin-top: -1px !important;
539
}
540

    
541
#wizard .img-check {
542
    margin-bottom: 8px;
543
    margin-left: -8px;
544
}
545

    
546
#wizard .li-1 .img-check {
547
    margin-left: 2px;
548
}
549

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

    
561
#wizard .bottomruler, #networks-wizard .bottomruler {
562
    margin-top:6px;
563
}
564

    
565
#networks-wizard .topruler, #networks-wizard .bottomruler {
566
    width: 455px;
567
    float: left;
568
}
569

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

    
576
#wizard #cancel:hover, #networks-wizard .cancel:hover {
577
    background-color: #7DB4CD;
578
    border-color: #7DB4CD;
579
}
580

    
581
#wizard #start, #networks-wizard .create {
582
    text-align: center;
583
    background-color: #FF7F2A;
584
    border-color: #FF7F2A;
585
}
586

    
587
:focus {
588
    outline: none;
589
    -moz-outline-style: none;
590
}
591

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

    
596
#wizard .img-prev {
597
    margin: 0 8px -1px -4px;
598
}
599

    
600
#networks-wizard .create {
601
    float:right;
602
    width: 140px;
603
}
604

    
605
.overlay-networks-create .form-action {
606
  float: left;
607
}
608

    
609
.overlay-networks-create .fixpos {
610
  margin-top: 3px;
611
}
612

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

    
619
.overlay-networks-create .col-fields {
620
  margin-bottom: 10px;
621
}
622

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

    
629
.overlay-networks-create form select {
630
  padding: 1px;
631
}
632

    
633
.overlay-networks-create #network-create-subnet-custom {
634
  width: 125px;
635
}
636

    
637
.overlay-networks-create .col-fields .form-field {
638
  float: left;
639
  margin-right: 20px;
640
}
641

    
642
.overlay-networks-create .col-fields .right-field {
643
  float: right;
644
  width: 210px;
645
  margin-right: 0px;
646
}
647

    
648
.overlay-networks-create .use-dhcp {
649
  width: auto;
650
}
651

    
652
#wizard #start:hover, #networks-wizard .create:hover {
653
    background-color: #FF9651;
654
    border-color: #FF9651;
655
}
656

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

    
666
.page ul {
667
    height: 270px;
668
    overflow: auto;
669
}
670

    
671
.panes ul.pane {
672
    height: 220px;
673
}
674

    
675
#wizard #tabscontainer {
676
    background-color: #CDE2EC;
677
    height: 20px;
678
    width: 448px;
679
}
680

    
681
.page ul.tabs {
682
    overflow: hidden;
683
    height: auto;
684
    margin-bottom: -1px;
685
    margin-top: -1px;
686
}
687

    
688
.page ul.tabs li {
689
    float: right;
690
    margin: 0 0.2em;
691
}
692

    
693
#status li {
694
    float: left;
695
    color: #387693;
696
    padding: 0 1px 0 37px;
697
    bottom: 0px;
698
}
699

    
700
#status li.active .headernumber {
701
    color: #FFFFFF;
702
}
703

    
704
#status li.active .headerbody {
705
    color: #FFFFFF;
706
}
707

    
708
div.image-container {
709
    border-bottom: 1px solid #CCCCCC;
710
    margin-left: 10px;
711
    margin-right: 10px;
712
}
713

    
714
#page2-container {
715
    background-color: #ECF4F8;
716
    height: 193px;
717
    margin-top: 3px;
718
    padding-top: 25px;
719
}
720

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

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

    
739
.sliders {
740
    float:left;
741
    width: 40px;
742
    margin-left: 10px;
743
    margin-top: 3px;
744
}
745

    
746
.units {
747
    padding-left:10px;
748
}
749

    
750
.slider-container {
751
    padding-bottom: 15px;
752
    margin-left: 5px;
753
}
754

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

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

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

    
785
.selectedrange {
786
    border-color: #5599FF;
787
}
788

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

    
797
/* machines */
798
.machine-container {
799
    position:relative;
800
}
801

    
802
.icon .machine-container.last .machine-data-cont, .machine-container:last-child .machine-data-cont {
803
    margin-bottom:0;
804
    padding-bottom: 0;
805
    border-bottom: none;
806
}
807

    
808
.icon .machine-container.last .machine-data, .machine-container:last-child .machine-data {
809
    border-bottom: none;
810
}
811

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

    
820
.icon .machine-container .subtitle {
821
    
822
}
823

    
824
.icon .machine-container .info {
825
    margin-top: 2px;
826
    height: 17px;
827
}
828

    
829
.icon .machine-container .building-progress {
830
    vertical-align: top;
831
}
832

    
833
.icon .build-progress {
834
    margin-left: -3px;
835
}
836

    
837
#machinesview .build-progress .message {
838
  padding: 3px;
839
}
840

    
841
#machinesview .build-progress .btn:hover {
842
  background-color: #387693;
843
}
844

    
845
#machinesview .column1 .build-progress .btn {
846
    margin-top: 5px;
847
    display: inline-block;
848
}
849

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

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

    
864
.icon .machine-data {
865
    width: 520px;
866
    float: left;
867
    background-color: transparent;
868
}
869

    
870
.icon .machine-info {
871
    padding: 10px 0;
872
}
873

    
874
.icon .machine-details .name {
875
    height: 24px;
876
}
877

    
878
.icon .machine-connect {
879
    width: 80px;
880
    float: left;
881
}
882

    
883
.icon .machine-details {
884
    width: 310px;
885
    float: left;
886
    margin-top: -5px;
887
}
888

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

    
898
.vm-actions {
899
    position: relative;
900
}
901

    
902
.icon .vm-actions {
903
    /*display: none;*/
904
}
905

    
906
.icon .vm-actions, .network .vm-actions {
907
    width: 180px;
908
    height: 76px;
909
    float: left;
910
}
911

    
912
.network .vm-actions {
913
    width: 185px;
914
}
915

    
916
.icon .machine-container:hover .machine-data {
917
    background-color:#A1C8DB !important;
918
}
919

    
920
.icon .machine-container:hover .vm-actions {
921
    display: block;
922
}
923

    
924
.vm-actions {
925
    font-size: 75%;
926
}
927

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

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

    
944
.vm-actions a.selected {
945
    color: #FF7F2A !important;
946
}
947

    
948
.vm-actions a.selected {
949
    background-color:transparent;
950
}
951

    
952
.vm-actions .action-container {
953
    position: relative;
954
}
955

    
956
.vm-actions .action-container .confirm_single {
957
    position: absolute;
958
    right: -20px;
959
    top: -2px;
960
}
961

    
962
div.list div.actions a.enabled.destroy {
963
}
964

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

    
973
.vm-actions .action-container.destroy a {
974
}
975

    
976
.icon .light-background .machine-data, div.network.light-background, div.network.expand {
977
    background-color:#aed2e3 !important;
978
}
979

    
980
.single .light-background {
981
    background-color:#aed2e3;
982
}
983

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

    
995
.machine a {
996
    font-weight: normal;
997
    text-decoration: none;
998
}
999

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

    
1006
.machine span.name {
1007
    font-weight: bold;
1008
}
1009

    
1010
.oldValue {
1011
    display:none;
1012
}
1013

    
1014
.state {
1015
}
1016

    
1017
.state div {
1018
    text-align: right;
1019
    margin-right: 3px;
1020
}
1021

    
1022
/* icon view actions */
1023
div.machine div.actions a.shutdown-padding {
1024
    margin-bottom: 22px;
1025
}
1026

    
1027
div.actions a.enabled:hover{
1028
    color: black !important;
1029
    text-decoration: underline;
1030
    display: block;
1031
}
1032

    
1033
div.machine:hover .actions a {
1034
    visibility: visible;
1035
}
1036

    
1037
div.machine div.display a{
1038
    visibility: visible;
1039
}
1040

    
1041
div.machine div.actions .disabled {
1042
    display: none;
1043
}
1044

    
1045
div.single-container div.vm-actions .disabled {
1046
    display: none;
1047
}
1048

    
1049
div.machine div.actions .disabled {
1050
    display: none;
1051
}
1052

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

    
1061
.machine div.connect-arrow {
1062
    display: none;
1063
    left: -3px;
1064
    position: absolute;
1065
    top: 9px;
1066
}
1067

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

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

    
1085
div.connect-border:hover {
1086
    cursor: pointer;
1087
}
1088

    
1089
.machine div.connect-border {
1090
    display: none;
1091
    left: -15px;
1092
    position: absolute;
1093
    top: 9px;
1094
}
1095

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

    
1108
.standard .machine .single-image-state1 {
1109
    background-position: 0px 0;
1110
}
1111

    
1112
.standard .machine .single-image-state3 {
1113
    background-position: -100px 0;
1114
}
1115

    
1116
.standard .machine .single-image-state4 {
1117
    background-position: -150px 0;
1118
}
1119

    
1120
.standard .machine .single-image-state2 {
1121
    background-position: -50px 0;
1122
}
1123

    
1124
.standard .running .machine .logo {
1125
   cursor: pointer;
1126
}
1127

    
1128
.list .machine img {
1129
    margin: 0;
1130
}
1131

    
1132
.icon div.ip, .icon div.ips {
1133
    font-size: 75%;
1134
}
1135

    
1136
.icon div.indicators {
1137
    float: right;
1138
}
1139

    
1140
div.indicators {
1141
    margin-right: 2px !important;
1142
    cursor: pointer;
1143
}
1144

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

    
1157
.view-separator {
1158
    color:#5F8DD3;
1159
}
1160

    
1161
.running.disabled {
1162
    background: transparent;
1163
}
1164

    
1165
.running-state .indicator1, .running-state .indicator2, .running-state .indicator3, .running-state .indicator4 {
1166
    background-color: #63cf1c;
1167
}
1168

    
1169
.rebooting-state .indicator1, .rebooting-state .indicator2, .rebooting-state .indicator3, .rebooting-state .indicator4 {
1170
    background-color: #d4aa00;
1171
}
1172

    
1173
.error-state .indicator1, .error-state .indicator2, .error-state .indicator3, .error-state .indicator4 {
1174
    background-color: #ff0000 !important;
1175
}
1176

    
1177
.terminated-state .indicator1, .terminated-state .indicator2, .terminated-state .indicator3, .terminated-state .indicator4 {
1178
    background-color: #5e1616;
1179
}
1180

    
1181
.build-state .indicator1, .build-state .indicator2, .build-state .indicator3, .build-state .indicator4 {
1182
    background-color: #FF7F2A;
1183
}
1184

    
1185
.destroying-state .indicator1, .destroying-state .indicator3, .destroying-state .indicator2, .destroying-state .indicator4 {
1186
    background-color: #4085a5 !important;
1187
}
1188

    
1189
.shutting-state .indicator1, .shutting-state .indicator3, .shutting-state .indicator2, .shutting-state .indicator4 {
1190
    background-color: #940606;
1191
}
1192

    
1193
.starting-state .indicator1, .starting-state .indicator2, .starting-state .indicator3, .starting-state .indicator4 {
1194
    background-color: #9ed976;
1195
}
1196

    
1197
.network-indicator .indicator1, .network-indicator .indicator2, .network-indicator .indicator3, .network-indicator .indicator4 {
1198
    background-color: #63cf1c;
1199
}
1200

    
1201
.network-indicator.in-progress .indicator1, .network-indicator.in-progress .indicator2, .network-indicator.in-progress .indicator3, .network-indicator.in-progress .indicator4 {
1202
    background-color: #FF7F2A;
1203
}
1204

    
1205
.running, .terminated {
1206
    background: #EFF7FA repeat scroll 0 0;
1207
    padding-bottom: 15px;
1208
}
1209

    
1210
.running, #machinesview-list, .single {
1211
}
1212

    
1213
.terminated {
1214
    background:#DCE5E8  repeat scroll 0 0;
1215
    padding-top: 15px;
1216
    margin-top: 15px;
1217
}
1218

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

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

    
1237
.machine div.info {
1238
    font-size: 75%;
1239
}
1240

    
1241
div.machine:hover div.info-header, div.machine:hover div.toggler div.down {
1242
    background-color: #84b7d0;
1243
}
1244

    
1245
div.machine div.info-label.darker, .single div.tags-label.darker, div.network .darker {
1246
    background-color: #5CA1C0;
1247
}
1248

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

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

    
1263
div.network div.toggler {
1264
    margin-left: 90px;
1265
}
1266

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

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

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

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

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

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

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

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

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

    
1308
button.next {
1309
    background-color: #4085A5;
1310
    border-color: #4085A5;
1311
    text-align: right;
1312
}
1313

    
1314
button.next:hover {
1315
    background-color: #7DB4CD;
1316
    border-color: #7DB4CD;
1317
}
1318

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

    
1326
button.prev:hover {
1327
    background-color: #7DB4CD;
1328
    border-color: #7DB4CD;
1329
}
1330

    
1331
.image-logo {
1332
    float: left;
1333
    margin-right: 1em;
1334
    margin-left: 1.5em;
1335
    margin-top: 4px;
1336
}
1337

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

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

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

    
1365
a.machines_view_link span {
1366
    float: left;
1367
}
1368

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

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

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

    
1392
div#view-select a {
1393
    display: block;
1394
    float: left;
1395
}
1396

    
1397
a#list:hover {
1398
    background: #5f8dd3;
1399
}
1400

    
1401
a#machines_view_icon_link:active, a#machines_view_list_link:active {
1402
    color:white;
1403
}
1404

    
1405
a#machines_view_icon_link span.ico {
1406
    background-image: url("../images/icon-view.png");
1407
}
1408

    
1409
a#machines_view_list_link span.ico {
1410
    background-image: url("../images/list-view.png");
1411
}
1412

    
1413
a#machines_view_single_link span.ico {
1414
    background-image: url("../images/single-view.png");
1415
}
1416

    
1417
#machinetype {
1418
    background-color: #CDE2EC;
1419
    height: 25px;
1420
    margin-bottom: 0px !important;
1421
}
1422

    
1423
div.machine-type {
1424
    float: left;
1425
    margin: 4px 18px 20px;
1426
}
1427

    
1428
.machine-type .active {
1429
    color: #FFFFFF
1430
}
1431

    
1432
div.machine-type label.disabled {
1433
    color: #aaa !important;
1434
}
1435

    
1436
#machinesview {
1437
}
1438

    
1439
#machines-pane {
1440
}
1441

    
1442
.list#machinesview {
1443
    margin-left: -20px;
1444
    display:none;
1445
}
1446

    
1447
#machinesview-list.list {
1448
    background: #EFF7FA  repeat scroll 0 0;
1449
    padding-left: 15px;
1450
    padding-bottom: 15px;
1451
}
1452

    
1453
#machinesview_content {
1454
    display:none;
1455
}
1456

    
1457
.list-machines {
1458
    min-width: 515px;
1459
}
1460

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

    
1470
#welcomeheader {
1471
    color:white;
1472
    text-align: center;
1473
}
1474

    
1475
.welcomebody {
1476
    color: white;
1477
    font-size:80%;
1478
}
1479

    
1480
.welcomebody a {
1481
    color: white;
1482
}
1483

    
1484
.welcomefooter {
1485
    color: white;
1486
    font-size:60%;
1487
}
1488

    
1489
.welcomefooter a {
1490
    color: white;
1491
}
1492

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

    
1503
.emptycreate {
1504
    margin: 20px 10px 5px 0 !important;
1505
}
1506

    
1507
#createbody {
1508
    display:none;
1509
    font-size: 80%;
1510
}
1511

    
1512
div.list label img {
1513
    margin: 5px 5px -3px 0;
1514
}
1515

    
1516
div.list label {
1517
    color: #3D3D3D;
1518
    font-size: 75%;
1519
}
1520

    
1521
div.list .state {
1522
    margin-top: 7px;
1523
    margin-right: 10px;
1524
}
1525

    
1526
div.list table tbody {
1527
    margin-top: 8px;
1528
}
1529

    
1530
div.list table tr.checked td {
1531
    background-color: #A1C8DB !important;
1532
}
1533

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

    
1541
div.list table td.name {
1542
    min-width: 170px;
1543
}
1544

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

    
1552
div.list table td.flavor {
1553
    font-size: 0.8em;
1554
}
1555

    
1556
div.list table td {
1557
    border-bottom: 1px solid #DDD;
1558
}
1559

    
1560
div.list table tr.error td.status {
1561
    color: #800000 !important;
1562
    font-weight: bold;
1563
}
1564

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

    
1569
div.list table tr.inactive td {
1570
    background-color: #DCE5E8;
1571
}
1572

    
1573
div.list .stopped {
1574
    margin-top: 8px;
1575
}
1576

    
1577
/* root element for tabs  */
1578
#wizard ul.tabs {
1579
    margin-right: -1px;
1580
    float: right;
1581
}
1582

    
1583
#wizard div.panes {
1584
    height: 247px;
1585
    clear:both;
1586
    margin-top: 3px;
1587
}
1588

    
1589
.typebody {
1590
    font-size: 80%;
1591
    font-weight: normal;
1592
    position: relative;
1593
    top: -3px;
1594
}
1595

    
1596
.typehover {
1597
    color: #FFFFFF;
1598
}
1599

    
1600
#label-name {
1601
    margin-top: 10px;
1602
}
1603

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

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

    
1627
#wizard ul.tabs a:hover {
1628
    color: #FFFFFF;
1629
    background-color:#4085A5;
1630
}
1631

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

    
1639
#wizard #standard-images {
1640
    background-color: #ECF4F8;
1641
}
1642

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

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

    
1661
div.list div.actions a:hover {
1662
    background-color: transparent;
1663
}
1664

    
1665
div.list div.actions a.enabled {
1666
    color: #3D3D3D;
1667
}
1668

    
1669
div.list div.actions a.enabled:hover{
1670
    cursor: pointer;
1671
    color: black;
1672
    text-decoration: underline;
1673
}
1674

    
1675
div.list div.actions a.selected {
1676
    color: #FF7F2A !important;
1677
}
1678

    
1679
input.machine {
1680
    width: 13px;
1681
    height: 13px;
1682
    top: -1px;
1683
    overflow: hidden;
1684
}
1685

    
1686
.description-container {
1687
    display: inline-block;
1688
    position: relative;
1689
    width: 300px;
1690
}
1691

    
1692
#wizard .button-container {
1693
    height: 20px;
1694
}
1695

    
1696

    
1697
/* metadata dropdown combo */
1698
.meta-key {
1699
    margin-right: 18px;
1700
    float:left;
1701
}
1702

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

    
1710
#yes-no p, #yes-no button {
1711
    margin-top: 15px;
1712
}
1713

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

    
1722
#error-success p, .notification-box p {
1723
    margin-top: 5px;
1724
}
1725

    
1726
.error-report {
1727
    display: none;
1728
}
1729

    
1730
#error-success .error-report {
1731
    position: absolute;
1732
    top: 140px;
1733
    right: 40px;
1734
}
1735

    
1736
.error .error-report {
1737
    display: block;
1738
}
1739

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

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

    
1748
#error-success .error-report .sending {
1749
    display: none;
1750
}
1751

    
1752
#error-success .error-report .send-btn {
1753
    color: #4085A5;
1754
    text-decoration: underline;
1755
    cursor: pointer;
1756
}
1757

    
1758
#error-success strong, .notification-box strong {
1759
    color: #F49C1A;
1760
}
1761

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

    
1773
.popup-header-error {
1774
    background-color: #800000 !important;
1775
}
1776

    
1777
.popup-border-error {
1778
    border-color: #800000 !important;
1779
    width:auto;
1780
}
1781

    
1782
.popup-details-error {
1783
    border: none !important;
1784
}
1785

    
1786
.popup-separator-error {
1787
    margin-bottom: 5px !important;
1788
}
1789

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

    
1805

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

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

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

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

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

    
1851
#error-success.success .machine-now-building {
1852
    padding-bottom: 14px !important;
1853
}
1854

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

    
1862
#error-success .password-header, .notification-box .password-header {
1863
    margin-bottom: 5px;
1864
}
1865

    
1866
#error-success .password, .notification-box .password {
1867
    color: #447821;
1868
}
1869

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

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

    
1884
#error-success.success .popup-separator, .notification-box .popup-seperator {
1885
    margin-bottom: 14px !important;
1886
}
1887

    
1888
#error-success .write-password, .notification-box .write-password {
1889
    margin-bottom: 5px;
1890
    padding-left: 30px;
1891
}
1892

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

    
1901
#error-success .write-password-details, .notification-box .write-password-details {
1902
    font-size: 75%;
1903
}
1904

    
1905
.more-details {
1906
    display: block;
1907
}
1908

    
1909
.notification-box h3 span.header-box {
1910
    background: transparent;
1911
}
1912

    
1913
.notification-box .machine-now-building {
1914
    padding: 20px 0;
1915
}
1916

    
1917
.notification-box .header-box {
1918
    width: auto !important;
1919
}
1920

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

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

    
1938
.popup-details a:link, .popup-details a:visited {
1939
    color: black;
1940
}
1941

    
1942
.destroy .confirm_single .yes {
1943
    background-color: #880000;
1944
    color: #fff;
1945
}
1946

    
1947
.destroy .confirm_single .no {
1948
    background-color: #CC0000;
1949
    color: #880000;
1950
}
1951

    
1952
.destroy .confirm_single .yes:hover {
1953
    background-color:#CC0000;
1954
}
1955

    
1956
div.list div.actions a.selected#action-destroy {
1957
    color: #880000 !important;
1958
}
1959

    
1960
.vm-actions .destroy a#action-destroy.selected {
1961
    color: #880000 !important;
1962
}
1963

    
1964
/* Confirmation boxes */
1965
div.confirm_single, div.confirm_multiple, div.action_error {
1966
    display: none;
1967
    color: black;
1968
}
1969

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

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

    
1987
div.confirm_single button.yes {
1988
    width: 90px;
1989
    background-color:#FF7F2A;
1990
}
1991

    
1992
div.confirm_single button.yes:hover {
1993
    background-color: #FF9955;
1994
}
1995

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

    
2003
div.confirm_single button.no:hover {
2004
    color: white;
2005
}
2006

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

    
2017
div.confirm_reboot_required {
2018
}
2019

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

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

    
2035
#networks-pane {
2036
    display: none;
2037
}
2038

    
2039
#networks-pane div.confirm_multiple p {
2040
    margin: 7px 0 0 100px;
2041
}
2042

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

    
2050
div.confirm_multiple button.yes {
2051
    border-color: #FF7F2A;
2052
    padding: 0 12px;
2053
}
2054

    
2055
div.confirm_multiple button.yes:hover {
2056
    background-color: #FF7F2A;
2057
}
2058

    
2059
div.confirm_multiple button.no {
2060
    padding: 0px 16px;
2061
}
2062

    
2063
div.confirm_multiple button.no:hover {
2064
    background-color: #5CA1C0;
2065
}
2066

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

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

    
2088
div.action_error .action-error-msg {
2089
    font-size: 0.8em;
2090
}
2091

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

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

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

    
2121
div.action_error button.details:hover {
2122
    background-color: #FF7F2A;
2123
}
2124

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

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

    
2143
div#user a{
2144
    color: #FFFFFF;
2145
    text-decoration: none;
2146
}
2147

    
2148
div#user a.current_lang {
2149
    color: #72ADC8;
2150
}
2151

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

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

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

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

    
2184
div#user .active {
2185
    background-color: #BED5E0 !important;
2186
}
2187

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

    
2193
div#user .useractions {
2194
    display: none;
2195
}
2196

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

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

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

    
2229
div#user .useractions li.hovered {
2230
    background-color: #E1EFF6;
2231
}
2232

    
2233
div#user .useractions li.last {
2234
    border-bottom: none;
2235
}
2236

    
2237
div#user .useractions .logout a {
2238
    background-image: url("../images/icon-logout.png");
2239
}
2240

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

    
2248
div#user .langmenu .sep {
2249
    display: inline-block;
2250
    color: #72ADC8;
2251
}
2252

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

    
2261
#disks.separator {
2262
    background-color: #dea842;
2263
}
2264

    
2265
#networks.separator {
2266
    background-color: #6c535d;
2267
}
2268

    
2269
.network-machine h5 {
2270
    margin-bottom: 20px;
2271
    margin-top:0px;
2272
}
2273

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

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

    
2294
div.editbuttons div.save:hover, div.editbuttons div.cancel:hover {
2295
    background-color: #84b7d0;
2296
}
2297

    
2298
div.editbuttons div.cancel:hover {
2299
    background-image: url("../images/cancel-onhover.png");
2300
}
2301

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

    
2310
.editbuttons .cancel {
2311
    background-image: url("../images/cancel.png");
2312
    margin-left: 3px;
2313
}
2314

    
2315
.editbuttons .save {
2316
    background-image: url("../images/save.png");
2317
    margin-left: 1px;
2318
}
2319

    
2320
.editbuttons img {
2321
    float:none !important;
2322
    margin: 0px !important;
2323
}
2324

    
2325
.network .namecontainer {
2326
    font-size: 1.1em;
2327
}
2328
.network .machine-name-div .namecontainer {
2329
    font-size: 1em;
2330
    font-weight: bold;
2331
}
2332

    
2333

    
2334
.namecontainer .name {
2335
    position: relative;
2336
}
2337

    
2338
.namecontainer .name .nametextbox, .network-rename-input {
2339
    z-index: 1000;
2340
}
2341

    
2342
.icon .nametextbox {
2343
    width: 255px;
2344
}
2345

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

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

    
2365
#machinesview-icon .large-spinner {
2366
    top: 170px;
2367
}
2368

    
2369
.list .large-spinner {
2370
    margin-top:-30px;
2371
}
2372

    
2373
.single .large-spinner {
2374
    margin-top: 50px;
2375
}
2376

    
2377
div#networks-container {
2378
    display: none;
2379
}
2380

    
2381
div#networks-container .large-spinner {
2382
    margin-top: 50px;
2383
}
2384

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

    
2391
div.list div.dataTables_filter input{
2392
    font-size: 100%;
2393
}
2394

    
2395
.dataTables_wrapper {
2396
    width: 515px;
2397
    padding-bottom: 40px;
2398
}
2399

    
2400
div.list table thead .sorting, div.list table thead .sorting_desc, div.list table thead .sorting_asc {
2401
    padding-right: 15px !important;
2402
}
2403

    
2404
div.list table {
2405
    width: 515px;
2406
    font-size: 75%;
2407
}
2408

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

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

    
2433
div.list table thead .sorting_asc, div.list table thead .sorting_desc {
2434
    background-color: #5CA1C0;
2435
}
2436

    
2437
div.list table thead .sorting_asc {
2438
    background-image: url("../images/asc.gif");
2439
}
2440

    
2441
div.list table thead .sorting_desc {
2442
    background-image: url("../images/desc.gif");
2443
}
2444

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

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

    
2466
ul.dropdown-selector li {
2467
    padding: 4px;
2468
}
2469

    
2470
ul.dropdown-selector li:hover {
2471
    background-color: #5CA1C0;
2472
}
2473

    
2474
ul.dropdown-selector li a{
2475
    color: black;
2476
    text-decoration: none;
2477
}
2478

    
2479
div.list table span.imagetag {
2480
    display: none;
2481
}
2482

    
2483
div.list table thead .vmos {
2484
    width: 20px !important;
2485
    vertical-align:middle;
2486
}
2487

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

    
2495
div.list table thead .vmflavor {
2496
    width: 100px !important;
2497
}
2498

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

    
2505
div.list table thead .vmstatus {
2506
    width: 50px !important;
2507
}
2508

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

    
2513
.spinner, .action-indicator {
2514
    clear: right;
2515
    float:right;
2516
    margin: 10px 6px 0 15px;
2517
}
2518

    
2519
.icon .spinner {
2520
    margin: 20px 4px 0 15px !important;
2521
}
2522

    
2523
.single .state .spinner {
2524
    margin: 20px 55px 0 15px !important;
2525
}
2526

    
2527
.action-indicator {
2528
    margin-right: 18px;
2529
}
2530

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

    
2539
.wave {
2540
    clear: right;
2541
    float:right !important;
2542
    margin: 10px 15px 0 15px !important;
2543
}
2544

    
2545
#networks-pane .spinner {
2546
    margin-top: 18px !important;
2547
}
2548

    
2549
.hidden {
2550
    display:none;
2551
}
2552

    
2553
div.actions a.selected, div.actions a.selected:hover, div.machine-actions a.selected, div.machine-actions a.selected:hover {
2554
    display:block !important;
2555
}
2556

    
2557
.action_error .message, .action_error .code {
2558
    display: none;
2559
}
2560

    
2561
.fixed {
2562
    bottom: 0;
2563
    position: fixed !important;
2564
}
2565

    
2566
/* Networks */
2567
#networks-pane {
2568
    background-color: transparent;
2569
    color: black;
2570
}
2571

    
2572
#networkscreate {
2573
}
2574

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

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

    
2592
#networkscreate:hover {
2593
    background-color: #FF9955;
2594
}
2595

    
2596
#createcontainer {
2597
}
2598

    
2599
#networks-container {
2600
}
2601

    
2602
#networks-pane .public-networks {
2603
    background: #EFF7FA repeat scroll 0 0;
2604
    margin: 0 0 0px;
2605
    padding: 0 0 15px 0px;
2606
}
2607

    
2608
#networks-pane .private-networks .network:last-child {
2609
    border-bottom: none;
2610
}
2611

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

    
2618
.private-networks .network-cont:last-child {
2619
    border-bottom: none;
2620
}
2621

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

    
2629
.private-networks .network {
2630
    padding-top: 10px;
2631
    padding-bottom: 10px;
2632
}
2633

    
2634
#public-template, #private-template, #public-machine-template, #private-machine-template {
2635
    display:none;
2636
}
2637

    
2638
div.network-cont.disable-destroy .actions .destroy {
2639
    display: none !important;
2640
}
2641

    
2642
div.network-cont.pending .actions .action-add {
2643
    display: none;
2644
}
2645

    
2646
div.network-cont.in-error .actions .action-add {
2647
    display: none;
2648
}
2649

    
2650
div.network a.action-network-add {
2651
    display: none;
2652
}
2653

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

    
2660
div.network {
2661
    clear: both;
2662
    padding: 5px 20px 5px 20px;
2663
    width: 480px;
2664
    position: relative;
2665
}
2666

    
2667
#private-template {
2668
    margin: 2px 0 0 -30px;
2669
}
2670

    
2671
div.network-placeholder {
2672
    margin-left: 33px;
2673
}
2674

    
2675
div.private-networks div.network-placeholder {
2676
}
2677

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

    
2687
.first div.network-cable {
2688
    height:143px;
2689
    margin-top:-6px;
2690
    position: relative;
2691
}
2692

    
2693
div.network-contents div.machines-list div.first {
2694
    margin-top:0;
2695
}
2696

    
2697
.last div.network-cable {
2698
    height:85px;
2699
}
2700

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

    
2709
.last div.firewall-cable {
2710
    display:none;
2711
}
2712

    
2713
div.network a:hover {
2714
    text-decoration: underline;
2715
    cursor: pointer;
2716
}
2717

    
2718
#networks-container .name {
2719
    font-size: 75%;
2720
}
2721

    
2722
div.network-machines, div.firewall {
2723
    font-size: 75%;
2724
    margin-left: 70px;
2725
}
2726

    
2727
div.firewall {
2728
    margin-left: 60px;
2729
    margin-bottom: 3px;
2730
    margin-top: -3px;
2731
}
2732

    
2733
div.firewall .firewall-options {
2734
    float: left;
2735
}
2736

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

    
2745
 div.private-networks div.machines-header {
2746
    margin-top: -5px;
2747
}
2748

    
2749
div.network:hover div.machines-header, div.network:hover div.firewall-header {
2750
    background-color: #84b7d0;
2751
}
2752

    
2753
div.network-machine:hover div.firewall-header {
2754
    background-color: #5CA1C0;
2755
}
2756

    
2757
div.firewall-label.darker {
2758
    background-color: #4085a5;
2759
}
2760

    
2761
.state {
2762
}
2763

    
2764
.network .state {
2765
    font-size: 75%;
2766
    position: absolute;
2767
    right: 10px;
2768
    top: 5px;
2769
}
2770

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

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

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

    
2798

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

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

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

    
2825
div.network.expand .net-actions a {
2826
    visibility: visible;
2827
}
2828

    
2829
div.network:hover div.actions a, div.network-machine:hover div.machine-actions a {
2830
    visibility: visible;
2831
}
2832

    
2833
div.network div.machine-actions a.action-destroy.selected {
2834
    color: #880000 !important;
2835
}
2836

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

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

    
2852
div.network .nic-ip {
2853
  font-size: 0.8em;
2854
}
2855

    
2856
div.network div.display a {
2857
    visibility: visible;
2858
}
2859

    
2860
div.network-machine div.machine-actions a.action-details {
2861
    margin-top: 7px;
2862
    width: 168px;
2863
}
2864

    
2865
div.network .net-actions {
2866
    margin-right:5px !important;
2867
    margin-top:0px !important;
2868
    height: 80px !important;
2869
}
2870

    
2871
div.network .net-actions .action-container.destroy {
2872
    position: relative;
2873
    bottom: auto;
2874
}
2875

    
2876
div.network:hover {
2877
    background-color: #A1C8DB !important;
2878
}
2879

    
2880
.network-logos {
2881
    float:left;
2882
    padding-right: 10px;
2883
}
2884

    
2885
.network-logos:hover {
2886
    cursor: pointer;
2887
}
2888

    
2889
.state div {
2890
    text-align: right;
2891
    margin: 4px 1px -4px;
2892
}
2893

    
2894
.public-networks .state div {
2895
    margin-top: 4px;
2896
}
2897

    
2898
.private-networks .state div {
2899
    margin-top: 9px;
2900
    margin-bottom: -12px;
2901
}
2902

    
2903
.network .name-div {
2904
    margin-bottom: 15px;
2905
    margin-top: 0px;
2906
}
2907

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

    
2916
#private-networks {
2917
    margin-top: 20px;
2918
}
2919

    
2920
.private-networks .editbuttons {
2921
    margin-right: 117px;
2922
    margin-top: 1px;
2923
}
2924

    
2925
.private-networks div.confirm_single {
2926
    margin: 45px -219px -5px 0;
2927
    font-size: 80%;
2928
}
2929

    
2930
.private-networks .network-machine div.confirm_single {
2931
    margin: 0 -199px 0 0;
2932
}
2933

    
2934
.private-networks .state {
2935
}
2936

    
2937
.private-networks div.machines-list {
2938
    padding-top: 3px;
2939
}
2940

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

    
2952
span.rename-network {
2953
    cursor: pointer;
2954
}
2955

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

    
2963
div.network:hover a.rename {
2964
    color: #3d3d3d;
2965
}
2966

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

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

    
2987
.network-machine {
2988
    border-bottom: 1px solid #5CA1C0;
2989
}
2990
.network-machine:last-child {
2991
    border-bottom: none;
2992
}
2993

    
2994
.network-machine .state div {
2995
    text-align: left;
2996
}
2997

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

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

    
3015
.network-machine .logo {
3016
    float:left;
3017
    padding-right: 10px;
3018
    position:relative;
3019
}
3020

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

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

    
3035
.network-machine .state {
3036
    margin-right: 18px;
3037
}
3038

    
3039
.network-machine .state .status {
3040
    margin-bottom: 4px;
3041
}
3042

    
3043
.machine-name .name {
3044
}
3045

    
3046
.machine-name .namecontainer {
3047
    line-height: 18px;
3048
    margin-bottom: 20px;
3049
}
3050

    
3051
div.network-machine:hover {
3052
    background-color: #84B7D0;
3053
}
3054

    
3055
.machines {
3056
    width: 416px;
3057
    margin-bottom: -8px;
3058
    margin-top: 10px;
3059
}
3060

    
3061
div.empty-network-slot {
3062
    height: 60px;
3063
}
3064

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

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

    
3081
div.add-icon {
3082
    margin-left: 15px;
3083
    margin-top: -1px;
3084
    cursor: pointer;
3085
}
3086

    
3087
span.remove-icon:hover, span.add-icon:hover {
3088
    cursor:pointer;
3089
    color: #fff;
3090
}
3091

    
3092
div.network-add-machine {
3093
    margin:43px 0 0 0px;
3094
}
3095

    
3096
.firewall-on {
3097
    color: #42E342;
3098
}
3099

    
3100
.firewall-off {
3101
    color: #F82E2E;
3102
}
3103

    
3104
.firewall-content {
3105
    color: black;
3106
    font-size: 60%;
3107
    margin-left: 60px;
3108
    height: 55px;
3109
}
3110

    
3111
.firewall-content .checkbox-legends {
3112
    cursor: pointer;
3113
}
3114

    
3115
.firewall-content .checkbox-legends.current {
3116
    font-weight: bold;
3117
}
3118

    
3119
.firewall-content .checkbox-legends {
3120
    vertical-align: text-top;
3121
}
3122

    
3123
.checkbox-legends a {
3124
    color: black;
3125
    text-decoration: underline;
3126
    font-size: 100%;
3127
}
3128

    
3129
h5.machine-connect {
3130
    font-size: 75%;
3131
    margin-bottom: 3px;
3132
    height: 23px;
3133
}
3134

    
3135
.machine-connect span {
3136
    text-decoration: underline;
3137
}
3138

    
3139
h5.machine-connect span:hover {
3140
    cursor: pointer;
3141
}
3142

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

    
3156
.firewall-apply:hover {
3157
    background-color:#5CA1C0;
3158
}
3159

    
3160
.name-div {
3161
    margin: -9px 0 30px 70px;
3162
}
3163

    
3164
.machine-name-div {
3165
    margin-bottom: 20px;
3166
    margin-left: 60px;
3167
}
3168

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

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

    
3185
div.reboot-dialog p {
3186
    color: #FFFFFF;
3187
    padding: 10px 0 10px 10px;
3188
}
3189

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

    
3197
div.reboot-dialog button:hover {
3198
    background-color: #FF7F2A;
3199
}
3200

    
3201
div.reboot-dialog button.reboot-all {
3202
    margin: -30px 35px 0 0;
3203
}
3204

    
3205
div.reboot-dialog button.reboot-single {
3206
    color: black;
3207
    margin-top: -20px;
3208
}
3209

    
3210
div.reboot-dialog div.code, div.reboot-dialog div.action, div.reboot-dialog div.message, div.reboot-dialog button.details {
3211
    display:none;
3212
}
3213

    
3214
div.reboot-dialog button.details {
3215
    border-color: #800000;
3216
    margin-top: -20px;
3217
}
3218

    
3219
div.reboot-dialog button.details:hover {
3220
    background-color: #800000;
3221
}
3222

    
3223
/* Metadata */
3224
.machine .info-content {
3225
    display: none;
3226
}
3227

    
3228
.metadata-container {
3229
    line-height: 12px;
3230
    height: 85px;
3231
    background-color: #84b7d0;
3232
}
3233

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

    
3244
.vm-stats {
3245
    padding-left: 10px;
3246
    padding-right: 5px;
3247
    width: 220px;
3248
}
3249

    
3250
.vm-stats div.stat-content {
3251
    height: 18px;
3252
}
3253

    
3254
.vm-stats div.stat-content img {
3255
    margin: 0;
3256
}
3257

    
3258
.vm-stats div img.stat-busy {
3259
    margin-top: -7px;
3260
    margin-left: 90px;
3261
}
3262

    
3263
.vm-stats div.stat-content img.busy {
3264
    margin-left: 95px;
3265
}
3266

    
3267
.vm-stats div.stat-error {
3268
    display:none;
3269
}
3270

    
3271
div.stat-error {
3272
    color: #f00;
3273
}
3274

    
3275
.single div.stat-error {
3276
    text-align: center;
3277
    font-size: 0.8em;
3278
}
3279

    
3280
.metadata-column {
3281
    margin-top: 4px;
3282
}
3283

    
3284
.vm-details {
3285
    width: 130px;
3286
    margin-left:17px;
3287
}
3288

    
3289
.vm-details.metadata-column {
3290
    padding-top: 5px;
3291
    height: 65px;
3292
}
3293

    
3294
.vm-details .image-details {
3295
    margin-top: 8px;
3296
}
3297

    
3298
.vm-details .vm-detail {
3299
    display: block;
3300
}
3301

    
3302
.vm-details span.value {
3303
    color: #444;
3304
}
3305

    
3306
.single-container .lower .stat-busy {
3307
    margin-top: 10px;
3308
    margin-left: 325px;
3309
}
3310

    
3311
.vm-metadata {
3312
    padding-left: 10px;
3313
    width: 100px;
3314
    border: none;
3315
}
3316

    
3317
.metadata-left {
3318
}
3319

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

    
3329
.metadata-right .items {
3330
    position:absolute;
3331
    height:20000em;
3332
}
3333

    
3334
.metadata-keys-container {
3335
    height: 60px;
3336
    float: left;
3337
}
3338

    
3339
.single .metadata-keys-container {
3340
    float: none;
3341
    height: auto;
3342
    margin-bottom: 5px;
3343
}
3344

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

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

    
3358
a.stats-report {
3359
    margin: 15px 0  0 80px;
3360
}
3361

    
3362
div.machine a.manage-metadata:hover {
3363
    background-color: transparent;
3364
}
3365

    
3366
.single .metadata-actions, .single .metadata-keys-container .items {
3367
    padding-left: 5px;
3368
}
3369
.metadata-actions, .metadata-keys-container .items{
3370
    margin-top: 5px;
3371
}
3372

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

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

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

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

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

    
3402
.scrollable .items {
3403
    position:absolute;
3404
    height:20000em;
3405
}
3406

    
3407
/* single view */
3408
.single {
3409
    color: #383838;
3410
}
3411

    
3412
.single .column1 {
3413
    float: left;
3414
    margin: 1px 0 25px 17px;
3415
    width: 140px;
3416
}
3417

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

    
3429
.single .column1 .state-label {
3430
    padding-top: 5px;
3431
}
3432

    
3433
.single .column1 .indicators {
3434
    margin-right: 38px !important;
3435
}
3436

    
3437
.single div.connect-arrow {
3438
    margin-left: -17px;
3439
}
3440

    
3441
.single div.connect-border {
3442
    margin-left: -29px;
3443
}
3444

    
3445
.single .single-actions {
3446
    width: 150px;
3447
    height: 60px;
3448
    margin-bottom: 45px;
3449
    margin-left: -10px;
3450
}
3451

    
3452
.single .vm-actions .action-container {
3453
    margin-bottom: 1px;
3454
}
3455

    
3456
.single .vm-actions .action-container .confirm_single {
3457
    right: -45px;
3458
}
3459

    
3460
.single .vm-actions .action-container.destroy .confirm_single {
3461
}
3462

    
3463
.single .vm-actions .action-container.destroy {
3464
    bottom: -20px;
3465
}
3466

    
3467
.single a.single-action {
3468
    text-decoration: none;
3469
    cursor: pointer;
3470
    display: block;
3471
}
3472

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

    
3480
.single .destroy a.single-action.selected {
3481
    color: #880000 !important;
3482
}
3483

    
3484
.single a.single-action.selected {
3485
    color: #FF7F2A !important;
3486
    width: 50px !important;
3487
}
3488

    
3489
.single a.single-action.selected:hover {
3490
    background-color:transparent;
3491
}
3492

    
3493
.single .spinner, .single .action-indicator {
3494
    margin: 15px 45px 0 0px !important
3495
}
3496

    
3497
.single .action-indicator {
3498
    margin-right: 55px !important;
3499
}
3500

    
3501
.single .wave {
3502
    margin: 15px 53px 0 0px !important
3503
}
3504

    
3505
.icon div.action_error {
3506
    font-size: 100%;
3507
}
3508

    
3509
.single div.action_error {
3510
    position: absolute;
3511
    top: 29px;
3512
    right: 35px;
3513
}
3514

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

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

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

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

    
3551
.single .column2 .name, .single .column2 .disk, .single .column2 .image-size, .single .column2 .ipv6 {
3552
    margin-bottom: 13px;
3553
}
3554

    
3555
.single .tags {
3556
    clear: both;
3557
    margin-bottom: 10px;
3558
    margin-left: 10px;
3559
}
3560

    
3561
.single .tags-label {
3562
    float: left;
3563
    padding: 0 5px;
3564
    width: 30px;
3565
}
3566

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

    
3574
.single .tags-header .info-header{
3575
    padding-top:0;
3576
    padding-bottom:0;
3577
}
3578

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

    
3586
.single .tags-header span.label {
3587
    font-size: 104%;
3588
}
3589

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

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

    
3609
.single .col3 {
3610
    float: right;
3611
    width: 150px;
3612
    margin-right: 15px;
3613
    margin-bottom: 15px;
3614
}
3615

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

    
3626
.single .column3 .vm-control:hover {
3627
    background-color: #5CA1C0;
3628
}
3629

    
3630
.single .column3 .previous {
3631
    float:left;
3632
    width: 72px;
3633
}
3634

    
3635
.single .column3 .next {
3636
    float: right;
3637
    text-align: center;
3638
    width: 60px;
3639
}
3640

    
3641
.single .column3 .next-label {
3642
    float: right;
3643
    margin-right: 3px;
3644
    margin-top: -2px;
3645
}
3646

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

    
3654
.single .column3 .prev-label {
3655
    float: left;
3656
    margin-left: 3px;
3657
    margin-top: -2px;
3658
}
3659

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

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

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

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

    
3704
.single .toggler {
3705
    color: #FFFFFF;
3706
    float: right;
3707
    font-size: 140%;
3708
}
3709

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

    
3718
.single .cpu-graph, .single .network-graph {
3719
    margin-left: 20px;
3720
    margin-bottom:30px;
3721
    width: 660px;
3722
}
3723

    
3724
.single div.lower .stats-select .stats-select-option.selected {
3725
    background-color: #4085A5;
3726
    color: #fff;
3727
}
3728

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

    
3739
.single div.lower img.stats {
3740
    margin-left: 82px;
3741
}
3742

    
3743
.single div.lower img.stats {
3744
    display: none;
3745
}
3746

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

    
3757
.single .single-image-state1 {
3758
    background-position: 0px 0;
3759
}
3760

    
3761
.single .single-image-state3 {
3762
    background-position: -252px 0;
3763
}
3764

    
3765
.single .single-image-state4 {
3766
    background-position: -378px 0;
3767
}
3768

    
3769
.single .single-image-state2 {
3770
    background-position: -126px 0;
3771
}
3772

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

    
3782
.single .column3 .disabled {
3783
    opacity: 0.5;
3784
    filter: alpha(opacity = 50);
3785
}
3786

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

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

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

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

    
3819
div.console-container {
3820
    margin: 0 0em;
3821
    height: auto;
3822
}
3823

    
3824
#wrapper.console {
3825
    width: auto;
3826
}
3827

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

    
3835
applet {
3836
    width:100%;
3837
    height:100%;
3838
}
3839

    
3840
div.console-footer {
3841
    /* this is for version 0.5*/
3842
    display: none;
3843
}
3844

    
3845
.console-footer #footer-text{
3846
    float:left;
3847
    left: auto;
3848
    margin-left:30px;
3849
}
3850

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

    
3857
#networks-wizard div.name-input {
3858
    margin: 75px 0 0 55px;
3859
}
3860

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

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

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

    
3882
.red {
3883
    color: red;
3884
}
3885

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

    
3892
#add-machines-wizard img.list-logo {
3893
    margin: 2px 1px 1px;
3894
}
3895

    
3896
.css-panes {
3897
    clear: both;
3898
    position: relative;
3899
    z-index: 10;
3900
}
3901

    
3902
.last .firewall-content {
3903
}
3904

    
3905
#pub .last .network-separator {
3906
    display:none;
3907
}
3908

    
3909
.public-networks .empty-network-slot {
3910
    display: none;
3911
}
3912

    
3913
.clearfix {
3914
    display: block;
3915
    width: auto;
3916
    zoom: 1;
3917
}
3918

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

    
3929
* html .clearfix {
3930
    display: inline-block;
3931
}
3932

    
3933
.icon .cont-toggler {
3934
    margin-top: -1px;
3935
}
3936

    
3937
.icon .wave {
3938
    margin-right: 4px !important;
3939
    margin-top: 15px !important;
3940
}
3941

    
3942
.icon .status {
3943
    margin-right: 3px;
3944
}
3945

    
3946
#machinesview .status, .single .state {
3947
    font-size: 75%;
3948
}
3949

    
3950
#machinesview-list div.action-indicator {
3951
    margin:0 !important;
3952
    float: none !important;
3953
}
3954

    
3955
.icon div.action-indicator {
3956
    margin-top: 14px;
3957
    margin-right: 4px;
3958
}
3959

    
3960
div.action-indicator {
3961
    width: 15px;
3962
    height: 20px;
3963
    background-repeat: no-repeat;
3964
    background-position: 0 0;
3965
}
3966

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

    
3987
h3.overlay-inner-title {
3988
    color: #4085A5;
3989
    font-size: 2em;
3990
}
3991

    
3992
#add-name-container {
3993
    margin-bottom: 10px;   
3994
}
3995

    
3996
.remove-field-trigger, .add-field-trigger {
3997
    cursor: pointer;
3998
}
3999

    
4000
.add-field-trigger img {
4001
    vertical-align: middle;
4002
}
4003

    
4004
.machine-now-building {
4005
    padding-right: 15px !important;
4006
    text-align: justify;
4007
}
4008

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

    
4017
#notification-box a {
4018
    color: #4085A5;
4019
}
4020

    
4021
#notification-box .machine-title img {
4022
    vertical-align: middle;
4023
}
4024

    
4025
#notifiaction-box .password-header {
4026
    margin-bottom: 0 !important;
4027
}
4028

    
4029
#notification-box .password-container a {
4030
    color: #fff;
4031
    text-decoration: underline;
4032
}
4033

    
4034
#notification-box .password-container a:hover {
4035
    background-color: #fff;
4036
    color: #4085A5;
4037
}
4038

    
4039
#notification-box .password-container {
4040
    background: #4085A5;
4041
    border: none;
4042
}
4043

    
4044
#notification-box .password-container .password a {
4045
    font-weight: normal !important;
4046
}
4047

    
4048
#notification-box .cmd {
4049
    color: #fff;
4050
    font-family: monospace;
4051
    font-size: 1.6em;
4052
}
4053

    
4054
.machine-container .separator {
4055
    background-color: #B0D1E0;
4056
}
4057

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

    
4069
#creation-password-overlay {
4070
    position: relative;
4071
}
4072

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

    
4080
#creation-password-overlay .password-label {
4081
    float: left;
4082
}
4083

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

    
4094
.feedback-form .description {
4095
    margin-bottom: 25px;
4096
}
4097

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

    
4105
.feedback-form .form-actions {
4106
    border-top: none;
4107
}
4108

    
4109
.nospace {
4110
    padding-top: 0 !important;
4111
    padding-bottom: 0 !important;
4112
}
4113

    
4114
.noborder {
4115
    border-top: none !important;
4116
    border-bottom: none !important;
4117
}
4118

    
4119
.overlay .feedback-form .messages.description {
4120
    padding-bottom:0;
4121
    margin-bottom: 0;
4122
}
4123

    
4124
.feedback-form .messages .error-message {
4125
    color: #f00;
4126
}
4127

    
4128
.feedback-form .messages .success-message {
4129
    color: #8AA87F;
4130
}
4131

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

    
4139
#feedback-form .empty-error-msg {
4140
    display: none;
4141
}
4142

    
4143
#feedback-form .data-text {
4144
    display: none;
4145
}
4146

    
4147
#feedback-form .message {
4148
    display: none;
4149
}
4150

    
4151
#feedback-form label {
4152
    display: block;
4153
    font-size: 0.85em;
4154
    font-weight: bold;
4155
}
4156

    
4157
#feedback-form label.inline {
4158
    display: inline;
4159
    padding-left: 5px;
4160
}
4161

    
4162
#feedback-form p {
4163
    padding: 1em 0;
4164
    color: #444;
4165
    margin-bottom: 10px;
4166
}
4167

    
4168
#feedback-form .description {
4169
    font-style: italic;
4170
    font-size: 0.9em;
4171
    color: #888;
4172
}
4173

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

    
4181
#feedback-form .submit-data {
4182
    display: none;
4183
}
4184

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

    
4195
#feedback .submit {
4196
    float: right;
4197
    right: 10px;
4198
    margin-top: 10px;
4199
}
4200

    
4201

    
4202
#feedback-form .submit:hover, #invform .submit:hover {
4203
    background-color: #549FC3;
4204
}
4205

    
4206
.feedback-intro {
4207
    padding-right: 15px !important;
4208
    text-align: justify;
4209
}
4210

    
4211
.popup-body .message {
4212
    padding: 20px 5px;
4213
    display: none;
4214
}
4215

    
4216
.popup-body .loading {
4217
    color: #fff;
4218
}
4219

    
4220
.popup-body .success {
4221
    color: #1F921A;
4222
}
4223

    
4224
.popup-body .errormsg {
4225
    color: #E32424;
4226
}
4227

    
4228

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

    
4237

    
4238
.console .ip-version-label {
4239
    margin: 0 5px;
4240
}
4241

    
4242
.ipv6-text, .ipv4-text {
4243
    font-size: 0.9em;
4244
}
4245

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

    
4255
/*404 and 500 pages*/
4256

    
4257
.error_page {
4258
    position: relative;
4259
    top: 40px;
4260
    padding-bottom: 140px !important;
4261
}
4262

    
4263
.error_page h1 {
4264
    font-weight: normal;
4265
}
4266

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

    
4277
.error_page p.error_desc {
4278
    color: #fff;
4279
    font-size: 0.8em;
4280
}
4281

    
4282
.error_page {
4283
    padding-right: 50px !important;
4284
    padding-left: 100px !important;
4285
}
4286

    
4287
.error_page .error_content {
4288
    padding-left: 150px;
4289
    padding-top: 97px;
4290
}
4291

    
4292
.error_page .error_content .links, .info_content .links {
4293
    margin-top: 10px;
4294
    margin-left: 20px;
4295
}
4296

    
4297
.error_page .http_error .code {
4298
    letter-spacing: -10px;
4299
    font-size: 9em;
4300
}
4301

    
4302
.error_page .http_error .msg {
4303
    letter-spacing: -1px;
4304
    font-size: 2em;
4305
}
4306

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

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

    
4322
.error_body #container, .info_body #container {
4323
    background-position: right 200px;
4324
}
4325

    
4326
.info_page h1 {
4327
    color: #4085A5;
4328
    font-size: 2em;
4329
    font-weight: normal;
4330
}
4331

    
4332
.info_page p {
4333
    color: #ffffff;
4334
    margin: 1em 0;
4335
}
4336

    
4337
.info_body p a, .error_body p a{
4338
    color: #4085A5;
4339
    text-decoration: underline;
4340
}
4341

    
4342
.error_404 .http_error .code {
4343
    letter-spacing: -7px;
4344
}
4345

    
4346
.network-progress-indicator {
4347
    position: relative;
4348
    display: none;
4349
}
4350

    
4351
.network-progress-indicator img {
4352
    position: absolute;
4353
    bottom: 44px;
4354
    left: 340px;
4355
}
4356

    
4357

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

    
4365
/*metadata keys/values*/
4366
.items .tag-item  {
4367
    display: block;
4368
}
4369

    
4370
.single .items .tag-item .key {
4371
    width: 60px;
4372
}
4373

    
4374
.running .scrollable, .terminated .scrollable {
4375
    height: 42px;
4376
}
4377

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

    
4386
.items .tag-item .value {
4387
    color: #444;
4388
}
4389

    
4390
#machinesview-list {
4391
    display: none;
4392
}
4393

    
4394
#machinesview-single {
4395
    position: relative;
4396
    display: none;
4397
}
4398

    
4399
#machinesview-icon {
4400
    display: none;
4401
}
4402

    
4403
#machinesview-icon, #machinesview-single, #machinesview-list {
4404
    
4405
}
4406

    
4407
tbody.machines .spinner {
4408
    margin-top: 0!important;
4409
    margin: 0 !important;
4410
    float: none !important;
4411
}
4412

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

    
4424
.slider .slider-point-light {
4425
    background-color: transparent;
4426
}
4427

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

    
4440
.slider .handle {
4441
    z-index: 50;
4442
}
4443

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

    
4451
.api_overlay_template {
4452
    display: none;
4453
}
4454

    
4455
.api_content .password-container .password {
4456
    color: #fff;
4457
    font-size: 1.1em;
4458
}
4459

    
4460
#disks-pane {
4461
    margin-top: 58px;
4462
}
4463

    
4464
span.resend-msg {
4465
    display: block;
4466
    margin-bottom: 5px;
4467
}
4468

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

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

    
4483
.success-msg em, .error-msg em {
4484
    font-weight: bold;
4485
    font-style: normal;
4486
    font-size: 0.9em;
4487
}
4488

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

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

    
4509
.pagination .current {
4510
    background: #4085A5;
4511
    color: #fff;
4512
        border: solid 1px #AAE;
4513
}
4514

    
4515
.pagination .current.prev, .pagination .current.next{
4516
        color:#999;
4517
        border-color:#999;
4518
        background:#fff;
4519
}
4520

    
4521
table.list-machines .wave {
4522
    float: none !important;
4523
    margin: 0 !important;
4524
}
4525

    
4526
.overlay {
4527
    display: none;
4528
}
4529

    
4530
.overlay .copy-content .clip-copy  {
4531
    right: 10px;
4532
    top:8px;
4533
    border: 1px solid #fff;
4534
}
4535

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

    
4545
.overlay {
4546
    background-color: #fff;
4547
    border: 2px solid #444;
4548
    text-align: left;
4549

    
4550
    -moz-box-shadow: 0 0 90px 5px #000;
4551
    -webkit-box-shadow: 0 0 90px 5px #000;
4552
    box-shadow: 0 0 90px 5px #000;
4553
    width: 600px;
4554
}
4555

    
4556
.overlay.overlay-createvm {
4557
    width: 640px;
4558
}
4559

    
4560
.overlay a {
4561
    color: #387693;
4562
}
4563

    
4564
.overlay .diagnostics-list {
4565
    height: 400px;
4566
    overflow: scroll;
4567
    overflow-y: scroll;
4568
    overflow-x: hidden;
4569
}
4570

    
4571
.overlay .overlay-content .description.subinfo, .overlay .extra-info {
4572
    margin-bottom:0;
4573
    border-bottom: none;
4574
    padding-bottom:0;
4575
    margin-top: 10px;
4576
    padding-top:10px;
4577
    border-top: 1px solid #64a6c4;
4578
    /*border-top: 1px solid #DBE6EB;*/
4579
    font-size: 0.8em;
4580
}
4581

    
4582
.overlay .overlay-content .important {
4583
    color: #800000;
4584
}
4585

    
4586
.overlay .overlay-content .description.noborder {
4587
  margin-bottom:0;
4588
  border:0;
4589
}
4590

    
4591
.overlay .overlay-content .description {
4592
    color: #444;
4593
    border-bottom: 1px solid #64a6c4;
4594
    margin-bottom: 10px;
4595
    padding-bottom: 10px;
4596
    font-size: 0.9em;
4597
    line-height: 1.6em;
4598
}
4599

    
4600
.overlay .overlay-content .empty-message {
4601
    margin-bottom: 5px;
4602
}
4603

    
4604
.overlay h3.overlay-header {
4605
    font-size: 0.9em;
4606
    text-align: left;
4607
    padding: 0.8em;
4608
    padding-left: 1em;
4609
    font-weight: normal;
4610
    border-bottom: 1px solid #ddd;
4611
}
4612

    
4613
.overlay h3.overlay-header .title {
4614
    float: left;
4615
}
4616

    
4617
.overlay .container {
4618
    position: relative;
4619
    padding-top: 1em;
4620
    padding: 0.5em;
4621
    background-image: url("../images/popup-bg.png");
4622
    background-repeat: repeat-x;
4623
}
4624

    
4625
.overlay .content {
4626
    background-color: transparent;
4627
    background-image: url("../images/popup-inner-bg.png");
4628
    padding: 1em;
4629
    font-size: 0.8em;
4630
    background-repeat: repeat-x;
4631
    -moz-box-shadow: 0 0 1px 1px #888;
4632
    -webkit-box-shadow: 0 0 1px 1px #888;
4633
    box-shadow: 0 0 1px 1px #888;
4634
}
4635

    
4636
.overlay .message {
4637
}
4638

    
4639
.overlay .actions {
4640
    position: absolute;
4641
    right: 0.75em;
4642
    top: 0.6em;
4643
}
4644

    
4645
.overlay .actions span {
4646
    font-size: 0.8em;
4647
    color: #fff;
4648
    cursor: pointer;
4649
    margin-left: 10px;
4650
    display: block;
4651
    float: left;
4652
    background-color: #4085A5;
4653
    padding: 0.2em 0.4em;
4654
}
4655

    
4656
.overlay-error .error-more-details {
4657
    margin-top: 5px;
4658
    max-height: 210px;
4659
    overflow: auto;
4660
}
4661

    
4662
.overlay-error .key.details.expand {
4663
    background-image: url("../images/plus-8.png");
4664
}
4665

    
4666
.overlay-error .key.details {
4667
    background-color: #5189A3;
4668
    cursor: pointer;
4669
    background-image: url("../images/minus-8.png");
4670
    background-repeat: no-repeat;
4671
    background-position: 545px;
4672
}
4673

    
4674
.overlay-error .container {
4675
    padding-top: 1.9em;
4676
}
4677

    
4678
.overlay-error .error-details {
4679
    font-size: 0.8em;
4680
    margin-top: 10px;
4681
}
4682

    
4683
.overlay-error .error-details anonymous {
4684
    display: block;
4685
    margin-top: 10px;
4686
}
4687

    
4688
.overlay-error h3.overlay-header {
4689
    background-color: #800000;
4690
    color: #fff;
4691
}
4692

    
4693
.overlay-error.non-critical h3.overlay-header {
4694
    background-color: #987249;
4695
}
4696

    
4697
.overlay-error span.key {
4698
    font-weight: normal;
4699
    display: block;
4700
    margin-top: 0.5em;
4701
    background-color: #74AEC9;
4702
    color: #fff;
4703
    padding: 0.4em;
4704
    font-size: 0.8em;
4705
    font-weight: bold;
4706
}
4707

    
4708
.overlay-error .indicator {
4709
    background-color: #880000;
4710
    color: #fff;
4711
    padding: 4px;
4712
    display: block;
4713
    float: left;
4714
    border: 1px solid #444;
4715
}
4716

    
4717
.overlay-error .nav-btn:hover {
4718
    
4719
}
4720

    
4721
.overlay-error .nav-btn {
4722
    margin-left: 5px;
4723
    color: #fff;
4724
    display: block;
4725
    float: left;
4726
    padding: 4px;
4727
    background-color: #AAA;
4728
    border: 1px solid #444;
4729
}
4730

    
4731
.overlay-error .error-nav {
4732
    position: absolute;
4733
    right: 0px;
4734
    bottom: -25px;
4735
    font-size: 0.8em;
4736
}
4737

    
4738
.overlay-error span.value, .overlay-error div.value {
4739
    padding: 0.4em;
4740
    display: block;
4741
    margin-bottom: 0.3em;
4742
}
4743

    
4744
.overlay h3 .closeme {
4745
    float: right;
4746
    font-size: 0.7em;
4747
    margin-top: 0.2em;
4748
    cursor: pointer;
4749
}
4750

    
4751
.overlay .overlay-header .subtitle {
4752
    display: block;
4753
    font-size: 0.8em;
4754
    color: #ddd;
4755
}
4756

    
4757
.overlay .overlay-header .subtitle img {
4758
    vertical-align: middle;
4759
    margin-left: 10px;
4760
    margin-bottom: 2px;
4761
}
4762

    
4763
.overlay-info .msg-log-entry .src {
4764
    color: #4085A5;
4765
    float: right;
4766
    font-size: 0.9em;
4767
}
4768

    
4769
.overlay-info .msg-log-entry .date {
4770
    font-style: italic;
4771
}
4772

    
4773
.overlay-info .msg-log-entry pre {
4774
    color: #333;
4775
    width: 100%;
4776
    display: none;
4777
    margin: 10px 0;
4778
}
4779

    
4780
.msg-log-entry.warning {
4781
    color: #E57F01;
4782
}
4783

    
4784
.overlay-info .msg-log-entry.with-details .src {
4785
    margin-right: 15px;
4786
}
4787

    
4788
.overlay-info .msg-log-entry.with-details {
4789
    cursor: pointer;
4790
}
4791

    
4792
.overlay-info .msg-log-entry.with-details {
4793
    background-image: url("../images/plus-8-dark.png");
4794
    background-repeat: no-repeat;
4795
    background-position: 99% 9px;
4796
}
4797

    
4798
.overlay-info .msg-log-entry.with-details.expanded {
4799
    background-image: url("../images/minus-8-dark.png");
4800
}
4801

    
4802
.overlay-info .msg-log-entry .msg {
4803
    display: inline-block;
4804
    margin-left: 10px;
4805
}
4806

    
4807
.overlay-info .msg-log-entry {
4808
    border-bottom: 1px solid #aaa;
4809
    padding: 5px;
4810
}
4811

    
4812
.overlay-info .description.subinfo {
4813
    border: none !important;
4814
    padding-top: 0 !important;
4815
}
4816

    
4817
.overlay-info .content {
4818
    background-repeat: no-repeat;
4819
    background-position: 110% 110%;
4820
    background-color: rgba(255,255,255,0.6)
4821
}
4822

    
4823
.overlay-info .overlay-header {
4824
    background-color: #4085A5;
4825
}
4826

    
4827
.overlay-info .overlay-header .title {
4828
    color: #fff;
4829
}
4830

    
4831
.overlay-info .overlay-header .closeme {
4832
    color: #fff;
4833
}
4834

    
4835
#loading-view {
4836
    width: 400px;
4837
    margin: 0 auto;
4838
    padding: 20px 0;
4839
    font-size: 0.8em;
4840
}
4841

    
4842
#loading-view .header.off {
4843
    color: #829096;
4844
}
4845

    
4846
#loading-view .header.on {
4847
    color: #fff;
4848
    background-image: url("../images/icons/indicators/small/progress.gif");
4849
}
4850

    
4851
#loading-view .header.done {
4852
    color: #2B6681;
4853
    background-image: url("../images/check.png");
4854
}
4855

    
4856
#loading-view .header {
4857
    font-size: 0.9em;
4858
    text-align: left;
4859
    border-bottom: 1px solid #578BA3;
4860
    margin-bottom: 10px;
4861
    padding-bottom: 6px;
4862
    background-repeat: no-repeat;
4863
    background-position: 380px 0px;
4864
}
4865

    
4866
#loading-view .header span {
4867
    font-weight: bold;
4868
    color: #4085A5;
4869
}
4870

    
4871
#loading-view .info {
4872
    color: #ddd;
4873
}
4874

    
4875
.options-list {
4876
    margin-top: 0.5em;
4877
    font-size: 0.8em;
4878
}
4879

    
4880
.options-list.five li {
4881
    float: left;
4882
    display: block;
4883
    width: 20%;
4884
    margin-bottom: 5px;
4885
}
4886

    
4887
.options-list.five li:nth-child(5n) .options-object-cont {
4888
    margin-right: 0;
4889
}
4890

    
4891
.options-object-cont input {
4892
    border: 1px solid #aaa;
4893
    width: 92px;
4894
    padding: 0;
4895
    margin: 0;
4896
    margin-top:3px;
4897
    padding: 2px;
4898
}
4899

    
4900
.options-list.three li {
4901
    float: left;
4902
    display: block;
4903
    width: 33%;
4904
    margin-bottom: 5px;
4905
}
4906

    
4907
.meta-list .options-list li.options-object.create .options-object-cont {
4908
    background-image: url("../images/option-action-add.png");
4909
    background-repeat: no-repeat;
4910
    background-position: 90px 5px;
4911
}
4912

    
4913
.meta-list .options-list li .options-object-cont .option-action,
4914
.meta-list .options-list li.options-object.create {
4915
    cursor: pointer !important;
4916
}
4917

    
4918
.meta-list .options-list li .options-object-cont {
4919
    cursor: inherit;
4920
}
4921

    
4922
.options-list li .options-object-cont {
4923
    padding: 5px;
4924
    margin-right: 4px;
4925
    border: 1px solid #A6D1E6;
4926
    cursor: pointer;
4927
    min-height: 35px;
4928
    position: relative;
4929
}
4930

    
4931
.options-list.three li:nth-child(3n) .options-object-cont {
4932
    margin-right: 0;
4933
}
4934

    
4935
.options-list li.selected .options-object-cont {
4936
    background-color: #efefef;
4937
    border: 2px solid #4085A5;
4938
    padding: 4px;
4939
}
4940

    
4941
.options-list li.selected .options-object-cont .title {
4942
}
4943

    
4944
.options-list li.options-object .title {
4945
    display: block;
4946
    color: #FF7F2A;
4947
    margin-bottom: 2px;
4948
}
4949

    
4950
.options-list li .option-action {
4951
    display: none;
4952
    position: absolute;
4953
    background-repeat: no-repeat;
4954
}
4955

    
4956
.options-list.five li.editing {
4957
    width: 40%;
4958
}
4959

    
4960
.options-list.five li.editing .value {
4961
    display: none;
4962
}
4963

    
4964
.options-list li .remove {
4965
    background-image: url("../images/option-action-remove.png");
4966
    width:10px;
4967
    height:10px;
4968
    right:5px;
4969
    top: 5px;
4970
}
4971

    
4972
.options-list li .edit {
4973
    background-image: url("../images/option-action-edit.png");
4974
    width:10px;
4975
    height:10px;
4976
    right:5px;
4977
    bottom: 8px;
4978
}
4979

    
4980
.options-list li:hover .option-action  {
4981
    display: block;
4982
}
4983

    
4984
.options-list li.options-object .value {
4985
    color: #4085A5;
4986
    margin-top: 5px;
4987
    display: block;
4988
}
4989

    
4990
.options-list li.selected.options-object .value {
4991
}
4992

    
4993
.options-list li .options-object-cont:hover {
4994
    background-color: #fff;
4995
}
4996

    
4997
.options-list li.selected .options-object-cont:hover {
4998
    background-color: #fff;
4999
}
5000

    
5001
.options-list li img {
5002
    float: left;
5003
    margin:2px;
5004
    margin-right: 10px;
5005
    padding-bottom:10px;
5006
}
5007

    
5008
#network-vms-select-content li.options-object .value {
5009
    margin-top: 10px;
5010
    margin-left: 30px;
5011
}
5012

    
5013
#network-vms-select-content li.options-object:hover .options-object-cont,
5014
#network-vms-select-content li.options-object .options-object-cont {
5015
    background-image: url("../images/option-action-add-dark.png");
5016
    background-repeat: no-repeat;
5017
    background-position: 160px 28px;
5018
}
5019

    
5020
#network-vms-select-content li.selected:hover .options-object-cont,
5021
#network-vms-select-content li.selected .options-object-cont {
5022
    background-image: url("../images/option-action-remove.png") !important;
5023
}
5024

    
5025
#metadata-overlay-content .view .value {
5026
    margin-top: 10px;
5027
}
5028

    
5029
#metadata-overlay-content {
5030
    position: relative;
5031
}
5032

    
5033
.vm-meta .editor .predefined .predefined-meta-key:hover {
5034
    background-color: #4e8eac;
5035
    color: #fff;
5036
}
5037

    
5038
.vm-meta .editor .predefined .predefined-meta-key {
5039
    float: left;
5040
    margin-right: 5px;
5041
    padding: 4px;
5042
    display: block;
5043
    cursor: pointer;
5044
}
5045

    
5046
.vm-meta .editor .predefined {
5047
    background-color: #A6D1E6;
5048
    font-size: 0.9em;
5049
    border-top: 1px solid #ddd;
5050
}
5051

    
5052
.vm-meta .editor input {
5053
}
5054
.vm-meta .editor {
5055
    margin-bottom: 10px;
5056
}
5057

    
5058
.vm-meta .editor .form-actions .form-action {
5059
    min-width: 50px;
5060
}
5061

    
5062
.vm-meta .editor .form-field input.meta-key {
5063
    width: 90px;
5064
}
5065

    
5066
.vm-meta .form-field {
5067
    float: left;
5068
}
5069

    
5070
.vm-meta .form-actions .form-action {
5071
    float: left;
5072
    margin-right: 10px;
5073
    height: 11px;
5074
}
5075

    
5076
.vm-meta .editor .form-actions .cancel {
5077
    margin-right: 0;
5078
}
5079

    
5080
.vm-meta .editor .form-actions {
5081
    float: right;
5082
    margin:0;
5083
    padding:0;
5084
    margin-left: 15px;
5085
    margin-top: 0px;
5086
}
5087

    
5088
.vm-meta .editor {
5089
    background-color: rgba(64, 133, 165, 0.898) !important;
5090
    background-color: #649DB8;
5091
    font-size:0.9em;
5092
}
5093

    
5094
.vm-meta .meta-key-title {
5095
    font-size: 1.3em;
5096
    color: #fff;
5097
    margin-bottom: 10px;
5098
    display: none;
5099
    float: left;
5100
}
5101

    
5102
.vm-meta .editor-content {
5103
    padding: 10px;
5104
}
5105

    
5106
.vm-meta .inner-mask {
5107
    background-color: #fff;
5108
    opacity:0.6;
5109
    position: absolute;
5110
    top:0;
5111
    left:0;
5112
}
5113

    
5114
.vm-meta .editor label {
5115
    float: left;
5116
    color: #fff;
5117
    margin-right: 2px;
5118
    padding-top:4px;
5119
    font-size: 0.9em;
5120
}
5121

    
5122
.vm-meta .editor input {
5123
    border: none;
5124
    width: 170px;
5125
    margin-left: 10px;
5126
    font-size: 0.9em;
5127
    padding: 4px;
5128
}
5129

    
5130
.vm-meta li.create .options-object-cont {
5131
    background-color: #B3C9AD ;
5132
    border-color: #788774;
5133
}
5134
.vm-meta li.create .options-object-cont .value,
5135
.vm-meta li.create .options-object-cont .title {
5136
    color: #fff;
5137
}
5138

    
5139
#createvm-overlay-content {
5140
    padding: 0;
5141
}
5142

    
5143
.overlay-createvm .container {
5144
    width: 624px !important;
5145
}
5146

    
5147
.create-vm .header-step.current {
5148
    font-weight: bold;
5149
}
5150

    
5151
.create-vm .create-step-cont {
5152
    min-height: 240px;
5153
}
5154
.create-vm .create-controls {
5155
    padding: 10px;
5156
}
5157

    
5158
.create-vm ul li {
5159
    cursor: pointer;
5160
    padding: 4px;
5161
}
5162

    
5163
.create-vm ul li.selected {
5164
    background-color: #aaa;
5165
}
5166

    
5167
.cont-toggler {
5168
    background-image: url("../images/down-arrow.png");
5169
    background-position: right;
5170
    background-repeat: no-repeat;
5171
    background-color: #A1C8DB;
5172
    display: inline-block;
5173
    border-right: 6px solid #A1C8DB;
5174
    padding:2px;
5175
    padding-right: 14px;
5176
    padding-left:0;
5177
    cursor: pointer;
5178
    color: #fff;
5179
    font-size: 0.9em;
5180
}
5181

    
5182
.cont-toggler .label {
5183
    background-color: #98BDCF;
5184
    padding: 2px;
5185
    padding-left: 5px;
5186
    padding-right: 5px;
5187
}
5188

    
5189
.cont-toggler.open {
5190
    background-color: #98BDCF;
5191
    border-color: #98BDCF;
5192
    background-image: url("../images/up-arrow.png");
5193
}
5194

    
5195
.cont-toggler.open .label {
5196
    background-color: #4085A5;
5197
}
5198

    
5199
.overlay .form label {
5200
    font-color: #444;
5201
    margin-right: 10px;
5202
}
5203

    
5204
.form-field.error label {
5205
    color: #ff0000;
5206
    text-decoration: underline;
5207
}
5208

    
5209
.form-field input {
5210
    border: 1px solid #aaa;
5211
    width: 200px;
5212
    padding: 3px;
5213
}
5214

    
5215
.form-actions {
5216
    margin-top: 5px;
5217
    padding-top:5px;
5218
    border-top: 1px solid #64a6c4;
5219
    font-size: 0.8em;
5220
}
5221

    
5222
.form-actions.plain {
5223
    margin-top: 0px;
5224
    padding-top:0px;
5225
    border-top: 0px;
5226
}
5227

    
5228
.form-action {
5229
    float: right;
5230
    min-width: 140px;
5231
    background-color: #FF7F2A;
5232
    border: 1px solid #FF7F2A;
5233
    text-align: center;
5234
    color: #FFFFFF;
5235
    cursor: pointer;
5236
    padding: 4px;
5237
}
5238

    
5239
.form-action:hover {
5240
    background-color: #FF9955;
5241
    color: #FFF;
5242
}
5243

    
5244
.form-action.prev,
5245
.form-action.cancel {
5246
    background-color: #800;
5247
    border: 1px solid #800;
5248
    float: left;
5249
}
5250

    
5251
.form-action.prev:hover,
5252
.form-action.cancel:hover {
5253
    background-color: #CC0000;
5254
    color: #fff;
5255
}
5256

    
5257
.form-action.next,
5258
.form-action.ok {
5259
    background-color: #080;
5260
    border: 1px solid #080;
5261
}
5262

    
5263
.form-action.next:hover,
5264
.form-action.ok:hover {
5265
    background-color: #00aa00;
5266
    color: #fff;
5267
}
5268

    
5269
.form-action .create,
5270
.form-action .submit {
5271

    
5272
}
5273

    
5274
.form-action.in-progress, button.in-progress {
5275
    background-image: url("../images/icons/indicators/medium/horizontal-progress.gif");
5276
    background-repeat: no-repeat;
5277
    background-position: center center;
5278
    color: transparent;
5279
}
5280

    
5281
#createvm-overlay-content {
5282
    padding: 0;
5283
}
5284

    
5285
.create-vm .image-details.selected .size {
5286

    
5287
}
5288

    
5289
.create-vm .image-details .show-details:hover {
5290
    color: #aaa !important; 
5291
}
5292
.create-vm .image-details.selected .show-details:hover {
5293
    color: #fff !important; 
5294
}
5295

    
5296
.create-vm .image-details.selected .show-details,
5297
.create-vm .image-details.selected .size {
5298
    color: #eee;
5299
}
5300

    
5301
.create-vm .image-details.selected span.owner {
5302
    color: #fff;
5303
}
5304

    
5305

    
5306
.create-vm .image-details p {
5307
    font-size: 0.8em;
5308
    padding-left: 27px;
5309
    display:block;
5310
}
5311

    
5312
.create-vm .image-details span.owner {
5313
    display: block;
5314
    font-size: 0.9em;
5315
    float: right;
5316
    color: #FF7F2A;
5317
    position: absolute;
5318
    top: 5px;
5319
    right: 5px;
5320
}
5321

    
5322
.create-vm .select-image .show-details {
5323
    display: none;
5324
    font-size: 0.8em;
5325
    text-decoration: underline;
5326
    color: #000;
5327
    position: absolute;
5328
    bottom: 5px;
5329
    right: 5px;
5330
}
5331

    
5332
.create-vm .image-details .size {
5333
    margin-top: 2px;
5334
    font-size: 0.8em;
5335
    color: #aaa;
5336
    margin-left: 10px;
5337
}
5338

    
5339
.create-vm .step-cont {
5340
    margin: 15px;
5341
}
5342

    
5343
.create-vm .create-step-cont {
5344
    min-height: 250px;
5345
    float: left;
5346
    width: 624px;
5347
}
5348

    
5349
.create-vm .create-controls {
5350
    padding: 10px;
5351
    border-top: 1px solid #ddd;
5352
}
5353

    
5354
.create-vm .empty {
5355
    font-size: 0.8em;
5356
    color: #444;
5357
}
5358

    
5359
.create-vm h4 {
5360
    color: #5CA1C0;
5361
    margin-bottom: 0.5em;
5362
    font-family: arial;
5363
}
5364
.create-vm ul li {
5365
    cursor: pointer;
5366
    padding: 4px;
5367
    font-size: 0.9em;
5368
}
5369

    
5370
.create-vm .create-step-cont li.ssh-key-option.selected,
5371
.create-vm ul li.selected {
5372
    background-color: #FF7F2A;
5373
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5374
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5375
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5376
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5377
    color: #fff;
5378
}
5379

    
5380
.create-vm .images-list-cont.loading .loading-indicator {
5381
    display: block !important;
5382
}
5383

    
5384
.create-vm .images-list-cont .loading-indicator {
5385
    display: none;
5386
    position: absolute;
5387
    right: -13px;
5388
    top: 2px;
5389
    width: 30px;
5390
    height: 10px;
5391
    background-repeat: no-repeat;
5392
    background-image: url("../images/icons/indicators/medium/progress.gif");
5393
}
5394

    
5395
.create-vm .images-list-cont h4 {
5396
    position: relative;
5397
}
5398

    
5399
.create-vm .images-list-cont {
5400
    width: 40%;
5401
    float: left;
5402
    padding-left: 3%;
5403
    padding-right: 3%;
5404
}
5405

    
5406
.create-vm li p.desc {
5407
    font-size: 0.9em;
5408
}
5409

    
5410
.create-vm p.desc.warning {
5411
    color: #880000;
5412
}
5413

    
5414
.create-vm p.desc.empty {
5415
    color: #000;
5416
}
5417

    
5418
.create-vm p.desc {
5419
    font-size: 0.8em;
5420
    color: #888;
5421
    margin-bottom: 10px;
5422
}
5423

    
5424
.create-vm li.role .values .val:hover {
5425
    background-color: #eee;
5426
}
5427
.create-vm li.role .values .val.selected,  .create-vm li.role .values .val.selected:hover {
5428
    color: #fff;
5429
    background-color: #FF9955;
5430
}
5431

    
5432
.create-vm .images-filter-cont, .create-vm .flavors-predefined-cont {
5433
    width: 18%;
5434
    padding-right: 4%;
5435
    float:left;
5436
    border-right: 1px solid #A1C8DB;
5437
    overflow: auto;
5438
}
5439

    
5440
.create-vm .flavor-options-cont {
5441
    width: 74%;
5442
    float: left;
5443
    margin-left: 20px;
5444
}
5445

    
5446
.create-vm .flavor-options-cont .flavor-options li:hover {
5447
    background-image:-webkit-linear-gradient(top, #E8F4FA, #D1E7F0);
5448
    background-image:-o-linear-gradient(top, #E8F4FA, #D1E7F0);
5449
    background-image:-moz-linear-gradient(top, #E8F4FA, #D1E7F0);
5450
    background-image:linear-gradient(top, #E8F4FA, #D1E7F0);
5451
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#E8F4FA', endColorstr='#D1E7F0', GradientType=0);
5452
}
5453

    
5454
.create-vm .flavor-options-cont .flavor-options li.disabled * {
5455
    color: #eee !important;
5456
}
5457

    
5458
.create-vm .flavor-options-cont .flavor-options li.disabled {
5459
    background-image:linear-gradient(top, #aaa, #ddd);
5460
    background-image:-webkit-linear-gradient(top, #aaa, #ddd);
5461
    background-image:-o-linear-gradient(top, #aaa, #ddd);
5462
    background-image:-moz-linear-gradient(top, #aaa, #ddd);
5463
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#aaaaaa', endColorstr='#dddddd', GradientType=0);
5464
}
5465

    
5466
.create-vm .flavor-options-cont .flavor-options li.selected {
5467
    background-color: #FF9955;
5468
    background-image:linear-gradient(top, #FF9955, #E88B4D);
5469
    background-image:-webkit-linear-gradient(top, #FF9955, #E88B4D);
5470
    background-image:-o-linear-gradient(top, #FF9955, #E88B4D);
5471
    background-image:-moz-linear-gradient(top, #FF9955, #E88B4D);
5472
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FF9955', endColorstr='#E88B4D', GradientType=0);
5473
    border: 1px solid #C97943;
5474
}
5475

    
5476
.create-vm .predefined-list li.disabled {
5477
    color: #ddd !important;
5478
}
5479

    
5480
.create-vm .flavor-options-cont .flavor-options li {
5481
    display: block;
5482
    float: left;
5483
    margin-right: 10px;
5484
    margin-bottom: 9px;
5485
    padding: 9px 14px;
5486
    border: 1px solid #aaa;
5487
    background-image:-webkit-linear-gradient(top, #D1E7F0, #E8F4FA);
5488
    background-image:-o-linear-gradient(top, #D1E7F0, #E8F4FA);
5489
    background-image:-moz-linear-gradient(top, #D1E7F0, #E8F4FA);
5490
    background-image:linear-gradient(top, #D1E7F0, #E8F4FA);
5491
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#D1E7F0', endColorstr='#E8F4FA', GradientType=0);
5492
}
5493

    
5494
.create-vm .flavor-opts-list.compact li {
5495
    padding: 7px 9px;
5496
    margin-right: 7px;
5497
}
5498

    
5499
.create-vm .flavor-options-cont .flavor-options {
5500
    margin-bottom: 2px;
5501
}
5502

    
5503

    
5504
.create-vm .flavor-options .metric {
5505
    font-size: 0.8em;
5506
    margin-left: 2px;
5507
}
5508

    
5509
.create-vm .flavor-options span.available {
5510
  font-size: 0.8em;
5511
  font-weight: normal;
5512
  margin-left: 5px;
5513
}
5514

    
5515
.create-vm .flavor-options span.title {
5516
    color: #444;
5517
}
5518

    
5519
.create-vm .flavor-options span.desc {
5520
    display: block;
5521
    color: #aaa;
5522
    font-weight: normal;
5523
    font-size: 0.8em;
5524
    float: right;
5525
    margin-top: 4px;
5526
}
5527

    
5528
.disktip {
5529
    padding: 4px;
5530
    top: 20px;
5531
}
5532

    
5533
.create-vm .flavor-options .flavors-disk-template-list {
5534
    position: relative;
5535
}
5536

    
5537
.create-vm .flavor-options .disk_template.option {
5538
    z-index: 10;
5539
    min-width: 50px;
5540
    text-align: center;
5541
}
5542

    
5543
/*0 position is -470px*/
5544
.create-vm .flavor-options .disk-template-description {
5545
    font-size: 0.8em;
5546
    color: #444;
5547
    background-image: url("../images/horizontal-pointer.png");
5548
    background-repeat: repeat-x;
5549
    background-position: -470px 0;
5550
    padding-top: 15px;
5551
    margin-top: -10px;
5552
    font-style: italic;
5553
    display:block;
5554
    overflow: auto;
5555
    padding-bottom: 0px;
5556
    margin-bottom: 7px;
5557
    width: 100%;
5558
}
5559

    
5560
.create-vm .flavor-options .disk_template.option .description {
5561
    display: none;
5562
    position: absolute;
5563
    bottom: -20px;
5564
    left:0;
5565
    color: #888;
5566
    font-style: italic;
5567
    display: block;
5568
    background-color: #fff;
5569
    width: 100%;
5570
    text-align: left;
5571
    z-index: 0;
5572
    border-top: 1px solid #ddd;
5573
    padding-top: 3px;
5574
    display: none;
5575
}
5576

    
5577
.create-vm .flavor-options .selected .value {
5578
    color: #FFF;
5579
}
5580

    
5581
.create-vm .flavor-options .value {
5582
    font-weight: bold;
5583
    color: #5CA1C0;
5584
}
5585

    
5586
.create-vm .flavor-options-cont h4 {
5587
    border-bottom: 1px solid #A1C8DB;
5588
    padding-bottom: 5px;
5589
}
5590

    
5591
.create-vm .images-info-cont {
5592
    width: 28%;
5593
    padding-left: 3%;
5594
    float: left;
5595
    border-left: 1px solid #A1C8DB;
5596
}
5597

    
5598
.create-vm .select-image.wide .show-details {
5599
    display: inline;
5600
}
5601

    
5602
.create-vm .select-image .images-info-cont .hide {
5603
    display: none;
5604
}
5605

    
5606
.create-vm .select-image.wide .images-info-cont .hide {
5607
    display: block;
5608
    float: right;
5609
    position: absolute;
5610
    right: 10px;
5611
    top: 10px;
5612
    font-size: 0.8em;
5613
    text-decoration: underline;
5614
    color: #5CA1C0;
5615
    cursor: pointer;
5616
}
5617

    
5618
.create-vm .select-image.wide .images-list-cont {
5619
    width: 74%;
5620
    padding-right: 0;
5621
}
5622

    
5623
.create-vm .select-image.wide .images-info-cont .description .title {
5624
    display: none;
5625
    float: none;
5626
}
5627

    
5628
.create-vm .select-image.wide .images-info-cont .description p {
5629
    background-color: #fff;
5630
    border: 1px solid #ddd;
5631
    padding: 10px;
5632
    float: none;
5633
}
5634

    
5635
.create-vm .select-image.wide .selected .size {
5636
    color: #FFF !important;
5637
}
5638

    
5639
.create-vm .select-image.wide .image-details .size {
5640
    color: #5CA1C0;
5641
    position: absolute;
5642
    top: 5px;
5643
}
5644

    
5645
.create-vm .select-image.wide .images-info-cont h3 {
5646
    color: #5CA1C0;
5647
    margin: 10px 0;
5648
    margin-top: 5px;
5649
    text-align: left;
5650
    font-size: 0.9em;
5651
}
5652

    
5653
.create-vm .select-image.wide .images-info-cont .description p {
5654
    height: 50px;
5655
}
5656

    
5657
.create-vm .select-image.wide .images-info-cont .description {
5658
    width: 100% !important;
5659
    float: none !important;
5660
    background-color: transparent !important;
5661
    padding: 0 !important;
5662
    font-size: 1.1em;
5663
}
5664
.create-vm .select-image.wide .images-info-cont .extra-details {
5665
    height: 160px;
5666
    overflow-y: scroll;
5667
    padding-right: 15px;
5668
}
5669

    
5670
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail.extra-meta .title .custom {
5671
    display: inline-block;
5672
}
5673

    
5674
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail.extra-meta .title {
5675
    background-color: #999 !important;
5676
    border-color: #888 !important;
5677
}
5678
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail .custom {
5679
    float: right;
5680
    display: none;
5681
    font-size: 0.8em;
5682
    margin-left: 10px;
5683
    color: #DDD;
5684
    margin-top: 2px;
5685
}
5686

    
5687
.create-vm .select-image.wide .images-info-cont .extra-details .image-detail {
5688
    padding: 0px;
5689
    background-color: transparent;
5690
    margin-bottom: 4px;
5691
}
5692

    
5693
.create-vm .select-image.wide .images-info-cont .extra-details .title {
5694
    float: left;
5695
    display: block;
5696
    width: 39%;
5697
    padding: 1%;
5698
    background-color: #5CA1C0;
5699
    color: #fff;
5700
    border: 1px solid #4F8DAA;
5701
    font-size: 0.8em;
5702
}
5703

    
5704
.create-vm .select-image.wide .images-info-cont .extra-details .value {
5705
    float: right;
5706
    display: block;
5707
    width: 55%;
5708
    padding: 1%;
5709
    border: none;
5710
    background-color: #FFF;
5711
    color: #444;
5712
    border: 1px solid #ddd;
5713
    margin-bottom: 0px;
5714
    font-size: 0.8em;
5715
}
5716

    
5717

    
5718
.create-vm .select-image.wide .images-info-cont .image-detail {
5719
}
5720

    
5721
.create-vm .select-image.wide ul.images-list {
5722
    height: 310px;
5723
    overflow-y: scroll;
5724
    padding-right: 3%;
5725
}
5726

    
5727
.flavors-predefined-cont {
5728

    
5729
}
5730

    
5731
.flavor-options-cont {
5732
}
5733

    
5734
.create-vm .select-image.wide .images-info-cont {
5735
    position: absolute;
5736
    width: 88%;
5737
    background-color: #DAE9F0;
5738
    padding: 2%;
5739
    border-left: none;
5740
    height: 320px;
5741
    box-shadow: 0px 0px 2px #aaa;
5742
    -moz-box-shadow: 0px 0px 2px #aaa;
5743
    -webkit-box-shadow: 0px 0px 2px #aaa;
5744
    display: none;
5745
}
5746

    
5747

    
5748
.create-vm .images-info-cont h4, .create-vm .create-step-cont .param h4{
5749
    color: #FF9955;
5750
    margin-bottom: 1em;
5751
    font-size: 1.2em;
5752
}
5753

    
5754
.create-vm .images-info-cont span.title {
5755
    color: #4085A5;
5756
    display: block;
5757
    margin-bottom: 2px;
5758
    font-size: 0.8em;
5759
}
5760

    
5761
.create-vm .type-filter li {
5762
    font-size: 0.8em;
5763
    /*font-weight: bold;*/
5764
    padding: 4px;
5765
    margin-bottom: 0px;
5766
    color: #FF7F2A;
5767
}
5768

    
5769
.create-vm .images-list li {
5770
    min-height: 30px;
5771
}
5772
.create-vm .images-list .image-details:hover {
5773
    background-color: #eee;
5774
}
5775

    
5776
.create-vm .images-list .image-details.selected:hover {
5777
    background-color: #FF7F2A;
5778
}
5779

    
5780
.create-vm .images-list .image-details.selected {
5781
    /*font-weight: bold;*/
5782
}
5783

    
5784
.create-vm .images-list .image-details {
5785
    padding: 6px;
5786
    margin-bottom:1px;
5787
    position: relative;
5788
}
5789

    
5790
.create-vm .images-list .image-details img {
5791
    vertical-align: middle;
5792
    margin-right: 10px;
5793
}
5794

    
5795
.create-vm .images-info-cont .image-detail:last-child p {
5796
    border-bottom: none;
5797
}
5798

    
5799
.create-vm .images-info-cont h4 img {
5800
    vertical-align: middle;
5801
    margin-right: 7px;
5802
    margin-bottom: 5px;
5803
}
5804

    
5805
.create-vm .images-info-cont .description p {
5806
    font-size: 0.8em;
5807
}
5808

    
5809
.create-vm .images-info-cont p {
5810
    margin-bottom: 7px;
5811
    font-size: 0.9em;
5812
    border-bottom: 1px solid #A1C8DB;
5813
    padding-bottom: 7px;
5814
}
5815

    
5816
.create-vm .step-header {
5817
    padding-bottom:0;
5818
    position: relative;
5819
}
5820

    
5821
.create-vm .step-header .header-step .info span.subtitle {
5822
    font-size: 1.2em;
5823
    color: #fff;
5824
    font-weight: bold;
5825
}
5826

    
5827
.create-vm .step-header .header-step .info span {
5828
    float: none;
5829
    text-align: right;
5830
}
5831

    
5832
.create-vm .step-header .header-step .info {
5833
    position: absolute;
5834
    right: 15px;
5835
    top: 20px;
5836
    font-size: 0.8em;
5837
}
5838

    
5839
.create-vm .step-header .header-step span {
5840
    float: left;
5841
    display: block;
5842
}
5843

    
5844
.create-vm .steps-container {
5845
    width: 2000em;
5846
}
5847

    
5848
.create-vm .step-header .header-step .title {
5849
    margin-top: 20px;
5850
    font-size: 1em;
5851
    margin-left: 10px;
5852
}
5853

    
5854
#createvm-overlay-content {
5855
    width: 624px;
5856
    overflow: hidden;
5857
}
5858

    
5859
.create-vm .steps-history .steps-history-cont.current .title {
5860
    display: block;
5861
    top: 23px;
5862
    left: 43px;
5863
    font-size: 1.2em;
5864
    color: #ffffff;
5865
    font-weight: bold;
5866
    font-family: 'Ubuntu', sans-serif !important;
5867
}
5868

    
5869
.create-vm .steps-history .steps-history-cont.current .subnum {
5870
    display: none;
5871
    float: none;
5872
    font-size: 0.9em;
5873
    font-family: 'Ubuntu', sans-serif  !important;
5874
}
5875

    
5876
.create-vm .steps-history .steps-history-cont.current .subtitle,
5877
.create-vm .steps-history .steps-history-cont.current .description {
5878
    font-family: 'Ubuntu', sans-serif  !important;
5879
}
5880

    
5881
.create-vm .steps-history .steps-history-cont.current .info {
5882
    display: block;
5883
    font-family: 'Ubuntu', sans-serif !important;
5884
}
5885

    
5886
.create-vm .steps-history .steps-history-cont.completed .title,
5887
.create-vm .steps-history .steps-history-cont.completed .num {
5888
    color: #A1C8DB;
5889
}
5890

    
5891
.create-vm .steps-history .steps-history-cont.completed {
5892
    background-color: #4085A5;
5893
    color: #fff;
5894
    cursor: pointer;
5895
}
5896

    
5897
.create-vm .steps-history .steps-history-cont.completed .steps-history-step {
5898
    background-image: url("../images/check.png");
5899
}
5900

    
5901
.create-vm .steps-history .steps-history-cont.current .steps-history-step {
5902
    width: 320px;
5903
}
5904

    
5905
.create-vm .steps-history .steps-history-cont.current .num {
5906
    color: #fff;
5907
}
5908

    
5909
.create-vm .steps-history .steps-history-cont.current .info {
5910
    color: #4085A5;
5911
    font-size: 0.8em;
5912
}
5913

    
5914
.create-vm .steps-history .steps-history-cont.current {
5915
    background-color: #A1C8DB;
5916
    color: #fff;
5917
    width: 468px;
5918
}
5919

    
5920
.create-vm .steps-history-step {
5921
    padding: 4px;
5922
    padding-left: 7px;
5923
    font-size: 1em;
5924
    font-family: 'Ubuntu', sans-serif  !important;
5925
    margin-right: 5px;
5926
    padding-top: 12px;
5927
    background-position: right 30px;
5928
    background-image: none;
5929
    background-repeat: no-repeat;
5930
}
5931

    
5932
.create-vm .steps-history {
5933
    background-color: #4085A5;
5934
}
5935

    
5936
.create-vm .steps-history .steps-history-cont.last {
5937
    border-right: none;
5938
}
5939

    
5940
.create-vm .steps-history .steps-history-cont .num {
5941
    margin-left: 5px;
5942
    margin-top: -10px;
5943
    padding-bottom: 10px;
5944
}
5945

    
5946
.create-vm .steps-history .steps-history-cont .title {
5947
    display: none;
5948
    position: absolute;
5949
    bottom: 0px;
5950
    text-align: center;
5951
    padding-bottom: 2px;
5952
    left:0;
5953
    width: 55px;
5954
    margin-left:0;
5955
    margin-top:0;
5956
    font-size: 0.8em;
5957
}
5958

    
5959
.create-vm .steps-history .steps-history-cont .subnum,
5960
.create-vm .steps-history .steps-history-cont .info {
5961
    display: none;
5962
}
5963

    
5964
.create-vm .steps-history .steps-history-cont {
5965
    height: 70px;
5966
    width: 51px;
5967
    float: left;
5968
    color: #fff;
5969
    border-right: 1px solid #A1C8DB;
5970
    color: #A1C8DB;
5971
    background-color: #4085A5;
5972
    background-position: center right;
5973
    background-image: none;
5974
    background-repeat: no-repeat;
5975

    
5976
    -webkit-transition: background-color .15s ease-in;
5977
    -o-transition: background-color .15s ease-in;
5978
    -moz-transition: background-color .15s ease-in;
5979
    transition: background-color .15s ease-in;
5980

    
5981
    border-bottom: 1px solid #aaa;
5982
}
5983

    
5984
.create-vm .step-header .header-step .num {
5985
    color: #225871;
5986
    font-size: 4em;
5987
    margin-bottom: -5px;
5988
    font-family: 'Ubuntu', sans-serif;
5989
    font-weight: normal !important;
5990
}
5991

    
5992
.create-vm .step-header .header-step {
5993
    color: #;
5994
    margin-bottom: -6px;
5995
    width: 25%;
5996
    padding-left: 0%;
5997
    display: block;
5998
    float: left;
5999
}
6000

    
6001
.create-vm .step-header .header-step.current {
6002
    color: #387693;
6003
}
6004

    
6005
.create-vm .image-filters-title {
6006
    margin-top: 1em;
6007
    margin-bottom: 0.5em;
6008
}
6009

    
6010
.create-vm .create-step-cont span.clear {
6011
    font-size: 0.8em;
6012
    font-weight: bold;
6013
    color: #A1C8DB;
6014
    display: block;
6015
}
6016

    
6017
.create-vm .category-filters li {
6018
    float:left;
6019
    display: block;
6020
    padding: 4px;
6021
    background-color: #eee;
6022
    margin-right: 5px;
6023
    font-size: 0.9em;
6024
    margin-bottom: 5px;
6025
}
6026

    
6027
.create-vm .content-cont {
6028
    height: 340px;
6029
    overflow: auto;
6030
}
6031

    
6032
.create-vm .vm-confirm .confirm-params span.cval {
6033
    margin-left: 8px;
6034
    color: #444;
6035
}
6036

    
6037
.create-vm .vm-confirm .confirm-params span.ckey {
6038
    color: #4085A5;
6039
    font-weight: bold;
6040
}
6041

    
6042
.create-vm .vm-confirm .confirm-params {
6043
    margin-bottom: 15px;
6044
}
6045

    
6046
.create-vm .vm-confirm h3.vm-name {
6047
    background-repeat: no-repeat;
6048
    background-position: left center;
6049
    font-size: 1.4em;
6050
    padding-left: 1.45em;
6051
    color: #4085A5;
6052
}
6053

    
6054
.create-vm .images-list-cont h4 a {
6055
    margin-top: 3px;
6056
    margin-right: -2px !important;
6057
}
6058
.create-vm .images-list-cont h4 a,
6059
.create-vm .list-cont h4 a {
6060
    font-size: 0.8em;
6061
    font-weight: normal;
6062
    margin-right: 5px;
6063
    float: right;
6064
    color: #FF7F2A;
6065
}
6066

    
6067
.create-vm .confirm-params {
6068
    overflow: auto;
6069
}
6070

    
6071
.create-vm .vm-confirm .ssh.confirm-params {
6072
    max-height: 150px;
6073
}
6074

    
6075
.create-vm .personalize-cont .confirm-params {
6076
    max-height: 160px;
6077
    margin-right: 10px;
6078
}
6079

    
6080
.create-vm .personalize-cont,
6081
.create-vm .confirm-cont {
6082
    height: 250px;
6083
}
6084

    
6085
.create-vm .image-warning p {
6086
  width: 80%;
6087
  float: left;
6088
}
6089

    
6090
.create-vm .image-warning .untrusted-image-confirm:hover {
6091
  background-color: #7D674E;
6092
}
6093

    
6094
.create-vm .image-warning .untrusted-image-confirm {
6095
  display: inline-block;
6096
  padding: 5px;
6097
  background-color: #5C4D39;
6098
  color: #FFF;
6099
  width: 10%;
6100
  float: right;
6101
  margin-top: 4px;
6102
  margin-right: 2px;
6103
  cursor: pointer;
6104
  text-align: center;
6105
}
6106

    
6107
.create-vm .image-warning {
6108
  display: none;
6109
  background-color: #987249;
6110
  color: #fff;
6111
  padding: 10px 15px;
6112
  font-size: 0.9em;
6113
  border-top: 1px solid #AAA;
6114
}
6115

    
6116
.create-vm .create-step-cont .rename input.rename-field {
6117
    font-size: 1.4em;
6118
    padding: 5px;
6119
    width: 93%;
6120
    padding-left: 30px;
6121
    background-position: 7px center;
6122
    background-repeat: no-repeat;
6123
}
6124

    
6125
.create-vm .create-step-cont .rename label {
6126
    display: block;
6127
}
6128

    
6129
.create-vm .create-step-cont .personalize-conts,
6130
.create-vm .create-step-cont .confirm-conts {
6131
    margin-top: 20px;
6132
}
6133

    
6134
.create-vm .create-step-cont .personalize-cont,
6135
.create-vm .create-step-cont .confirm-cont {
6136
    width: 30%;
6137
    margin-right: 2%;
6138
    border-right: 1px solid #A1C8DB;
6139
    float: left;
6140
}
6141

    
6142
.create-vm .create-step-cont .confirm-cont ul li .title {
6143
    width: 55px;
6144
    float: left;
6145
}
6146

    
6147
.create-vm .create-step-cont .list-cont ul li .value {
6148
    float: right;
6149
    padding-top: 2px;
6150
    display: block;
6151
    width: 90px;
6152
    text-align: right;
6153
}
6154

    
6155
.create-vm .create-step-cont .list-cont ul li.flavor-disktype .value {
6156
    width: 45px;
6157
}
6158

    
6159
.create-vm .create-step-cont .list-cont ul li.image-description .value,
6160
.create-vm .create-step-cont .list-cont ul li.image-name .value {
6161
    float: none;
6162
    width: auto;
6163
    text-align:left;
6164
    width: auto;
6165
}
6166

    
6167
.create-vm .create-step-cont .list-cont ul li {
6168
    padding:0;
6169
    margin:0;
6170
    margin-bottom: 5px;
6171
    border-bottom: 1px solid #EEE;
6172
    padding-bottom: 7px;
6173
    margin-right: 10px;
6174
}
6175

    
6176
.create-vm .create-step-cont li.ssh-key-option .check {
6177
    float: right;
6178
    margin-right: 5px;
6179
    margin-top: 0px;
6180
}
6181

    
6182
.create-vm .create-step-cont li.ssh-key-option.selected {
6183
}
6184
.create-vm .create-step-cont li.ssh-key-option.selected:hover {
6185
    background-color: #F95;
6186
}
6187

    
6188
.create-vm .create-step-cont li.ssh-key-option:hover {
6189
    background-color: #eee;
6190
}
6191

    
6192
.create-vm .create-step-cont li.ssh-key-option.selected {
6193
}
6194

    
6195
.create-vm .create-step-cont li.ssh-key-option {
6196
    padding: 6px !important;
6197
}
6198

    
6199
.create-vm .create-step-cont .list-cont.ssh {
6200
    width: 60%;
6201
}
6202

    
6203
.create-vm .create-step-cont .list-cont.meta h4 {
6204
    margin-right: 0;
6205
}
6206

    
6207
.create-vm .create-step-cont .list-cont.meta {
6208
    margin-right:0;
6209
    border-right: none;
6210
    width: 195px;
6211
}
6212

    
6213
.create-vm .list-cont > h4 {
6214
    font-size: 1.2em;
6215
    margin-right: 10px;
6216
    border-bottom: 1px solid #A1C8DB;
6217
    padding-bottom: 5px;
6218
    color: #387693;
6219
}
6220

    
6221
.create-vm .list-cont .param.image-name {
6222
    margin-bottom: 0 !important;
6223
    border-bottom: none !important;
6224
}
6225

    
6226
.create-vm .list-cont .param h4 {
6227
    margin-bottom: 0px !important;
6228
    font-size: 1.1em !important; 
6229
}
6230

    
6231
.create-vm .list-cont .param {
6232
    margin-bottom: 7px !important;
6233
}
6234

    
6235
.create-vm .list-cont .value {
6236
    font-weight: bold;
6237
}
6238

    
6239
.create-vm .list-cont .param .value {
6240
    font-size: 0.9em;
6241
}
6242

    
6243
.create-vm .list-cont .param .title {
6244
    color: #387693;
6245
}
6246

    
6247
.create-vm .list-cont .image-description {
6248
    margin-left:0;
6249
}
6250

    
6251
.create-vm .list-cont .image-description .value {
6252
    font-weight: normal;
6253
    margin-left: 0 !important;
6254
}
6255

    
6256
.create-vm .list-cont .image-description .title {
6257
    display: none;
6258
    font-size: 0.8em;
6259
}
6260

    
6261
.create-vm .list-cont.meta .values span {
6262
    display:block;
6263
    float: left;
6264
    margin-right: 4px;
6265
    border: 1px solid #eee;
6266
    padding:3px;
6267
    margin-bottom: 4px;
6268
    font-size: 0.9em;
6269
}
6270

    
6271
.create-vm .list-cont.meta .key {
6272
    font-weight: bold;
6273
    font-size: 0.9em;
6274
    display: block;
6275
    margin-bottom: 5px;
6276
}
6277

    
6278
.create-vm .meta input {
6279
    font-size: 0.8em;
6280
}
6281

    
6282
.vm-connect .connect-cont {
6283
    margin-bottom: 20px;
6284
    border-bottom: 1px solid #A1C8DB;
6285
    padding-bottom: 20px;
6286
}
6287

    
6288
.vm-connect .connection-info {
6289
    padding-bottom: 0px;
6290
    margin-bottom: 0;
6291
    border-bottom: none;
6292
}
6293

    
6294
.vm-connect .connection-info .connect a {
6295
    color: #fff;
6296
}
6297

    
6298
.vm-connect .connection-info .connect {
6299
    background-color: #387693;
6300
    color: #fff;
6301
    padding: 10px;
6302
    font-size: 1.2em;
6303
    text-align: center;
6304
}
6305

    
6306
.clip-copy {
6307
    display: block;
6308
    width: 20px;
6309
    height: 20px;
6310
    position: absolute;
6311
    border: 1px solid #387693;
6312
    background-image: url("../images/clipboard.png");
6313
    background-repeat: no-repeat;
6314
    background-position: center;
6315
    cursor: pointer;
6316
    background-color: #A1C8DB;
6317
}
6318

    
6319
.password-cont .clip-copy { right: 10px; top: 8px;}
6320

    
6321

    
6322
.overlay-invitations {
6323
    width: 680px;
6324
}
6325
.invitations-form .sending .sending-msg {
6326
    font-size: 0.8em;
6327
    display: block !important;
6328
    margin-bottom: 5px;
6329
    color: #008800;
6330
}
6331

    
6332
.invitations-form .send-error {
6333
    font-size: 0.8em;
6334
    margin-bottom: 5px;
6335
    margin-top: 5px;
6336
    color: #800;
6337
    padding: 3px;
6338
    padding-left: 0;
6339
    display: none;
6340
}
6341

    
6342
.invitations-form .error label {
6343
    color: #000 !important;
6344
}
6345

    
6346
.invitations-form .form-field {
6347
    width: 49%;
6348
    float: left;
6349
}
6350

    
6351
.invitations-view .left.none {
6352
    background-color: #880000;
6353
}
6354

    
6355
.invitations-form {
6356
    position: relative;
6357
}
6358

    
6359
.invitations-form h3 {
6360
    float: left;
6361
}
6362

    
6363
.invitations-form .add-new-invitation {
6364
    float:left;
6365
    top:2px;
6366
    right: 20px;
6367
    width: 16px;
6368
    height: 16px;
6369
    background-image: url("../images/option-action-add.png");
6370
    background-repeat: no-repeat;
6371
    background-position: center;
6372
    text-indent: -50000em;
6373
    background-color: #4085A5;
6374
    margin-left: 15px;
6375
    cursor: pointer;
6376
}
6377

    
6378
.invitations-view .left {
6379
    font-size: 1em;
6380
    color: #fff;
6381
    font-weight: bold;
6382
    background-color: #4085A5;
6383
    padding: 4px;
6384
}
6385

    
6386
input.has-errors {
6387
    border-color: #ff0000;
6388
}
6389

    
6390
.none-left .invitations-wrapper .invitations-list {
6391
    width: 100% !important;
6392
    border-left: none !important;
6393
    padding-left: 0;
6394
}
6395

    
6396
.invitations-wrapper .invitations-list {
6397
    width: 40%;
6398
    float: left;
6399
    padding-left: 10px;
6400
    border-left: 1px solid #4085A5;
6401
    margin-left: -1px
6402
}
6403

    
6404
.invitations-wrapper .invitations-form {
6405
    width: 57%;
6406
    float: left;
6407
    border-right: 1px solid #4085A5;
6408
}
6409

    
6410
.invitations-wrapper label span {
6411
    color: #aaa;
6412
    font-size: 0.8em;
6413
}
6414

    
6415
.invitations-wrapper label {
6416
    display: block;
6417
    font-size: 0.9em;
6418
    margin-bottom:10px;
6419
    font-weight: bold;
6420
}
6421

    
6422
.invitations-view .add-new-invitation {
6423
    cursor: pointer;
6424
}
6425

    
6426
.invitations-wrapper input.name {
6427
    width: 150px;
6428
}
6429

    
6430
.invitations-wrapper input {
6431
    font-size: 0.9em;
6432
    width: 155px;
6433
    padding:4px;
6434
}
6435

    
6436
.invitations-list .invitation-sent {
6437
    border-bottom: 1px solid #A1C8DB;
6438
    padding-bottom: 5px;
6439
    margin-bottom: 5px;
6440
    position: relative;
6441
}
6442

    
6443
.invitations-view h3 {
6444
    margin-bottom: 10px;
6445
    color: #4085A5;
6446
}
6447

    
6448
.invitations-list .invitation-sent.last,
6449
.invitations-list .invitation-sent:last-child {
6450
    border-bottom: none;
6451
}
6452

    
6453

    
6454
.invitations-list .invitation-sent .email {
6455
    color: #D98147;
6456
    font-size: 0.8em;
6457
    font-weight: bold;
6458
    margin-top: 2px;
6459
}
6460

    
6461
.invitations-list .pagination a,
6462
.invitations-list .pagination span {
6463
    padding: 0.2em 0.3em;
6464
}
6465

    
6466
.invitations-list .pagination {
6467
    font-size: 0.75em;
6468
}
6469

    
6470
.invitations-list .name {
6471
    color: #444;
6472
    font-size: 0.9em;
6473
}
6474

    
6475
.invitations-list .status.sending {
6476
    background-image: url("../images/icons/indicators/small/progress.gif");
6477
}
6478

    
6479
.invitations-list .status.sent {
6480
    background-image: url("../images/invitation_accepted.png");
6481
}
6482

    
6483
.invitations-list .status.resend {
6484
    background-image: url("../images/resend.png");
6485
}
6486

    
6487
.invitations-list .status.resend {
6488
    cursor: pointer;
6489
}
6490

    
6491
.invitations-list .status {
6492
    width: 20px;
6493
    height: 15px;
6494
    position: absolute;
6495
    top:5px;
6496
    right: 2px;
6497
    background-repeat: no-repeat;
6498
    background-position: center;
6499
}
6500

    
6501
.invitations-form .form-entry:last-child {
6502
    border-bottom: none;
6503
}
6504

    
6505
.invitations-form .form-entry {
6506
    position: relative;
6507
    margin-bottom: 10px;
6508
    padding-bottom: 10px;
6509
    border-bottom: 1px solid #ddd;
6510
    margin-right: 10px;
6511
}
6512

    
6513
.invitations-form .send-invitations {
6514
    float: left;
6515
    padding: 5px;
6516
    color: #fff;
6517
    margin-right: 10px;
6518
    margin-top: 10px;
6519
}
6520

    
6521
.invitations-form .form-entry.error {
6522
    padding-bottom: 0px;
6523
}
6524

    
6525
.invitations-form .form-entry.error .remove-invitation {
6526
    bottom: 32px;
6527
}
6528

    
6529
.invitations-form .remove-invitation {
6530
    padding: 5px;
6531
    background-image: url("../images/option-action-remove.png");
6532
    background-position: center;
6533
    background-repeat: no-repeat;
6534
    color: #fff;
6535
    width: 15px;
6536
    height: 15px;
6537
    cursor: pointer;
6538
    text-indent: -50000px;
6539
    position: absolute;
6540
    right: -10px;
6541
    bottom: 14px;
6542
}
6543

    
6544
.invitations-list .resent-info,
6545
.invitations-form .top-info {
6546
    font-size: 0.8em;
6547
    margin-bottom: 10px;
6548
}
6549

    
6550
.invitations-list .msg .email,
6551
.invitations-form .success .msg .email {
6552
    font-weight: bold;
6553
}
6554

    
6555
.invitations-list .msg.err-msg,
6556
.invitations-list .success.msg,
6557
.invitations-form .success .msg {
6558
    background-color: #080;
6559
    color: white;
6560
    padding: 5px;
6561
    margin-right: 10px;
6562
    margin-bottom: 5px;
6563
}
6564
.invitations-list .msg.err-msg,
6565
.invitations-list .success.msg {
6566
    margin-right: 0px;
6567
}
6568
.invitations-list .msg.err-msg {
6569
    background-color: #800;
6570
}
6571

    
6572
.overlay .models-view .previous-view-link {
6573
    margin: -10px;
6574
    margin-bottom:10px;
6575
    padding: 10px 5px;
6576
    background-image: url("../images/left-arrow.png");
6577
    background-repeat: no-repeat;
6578
    background-position: 10px center;
6579
    padding-left: 20px;
6580
    background-color: #93D070;
6581
    cursor: pointer;
6582
    border-bottom: 1px solid #eee;
6583
    text-decoration: underline;
6584
}
6585
.models-view .quick-add {
6586
    text-decoration: underline; 
6587
    color: #4085A5;
6588
    cursor: pointer;
6589
}
6590

    
6591
.empty .items-list {
6592
    margin-top: 0 !important;
6593
}
6594

    
6595
.models-view .items-empty-msg {
6596
    border-top: 1px solid #aaa;
6597
    padding-top: 10px;
6598
    font-size: 1em;
6599
    margin-top:0 !important;
6600
}
6601

    
6602
.models-view .items-empty-msg,
6603
.models-view .model-description {
6604
    color: #444;
6605
    margin: 10px 0;
6606
}
6607

    
6608
.models-view .model-list .collection-action.disabled {
6609
    background-color: #aaa;
6610
    border-color: #aaa;
6611
    cursor: default;
6612
}
6613
.models-view .model-list .collection-action.disabled:hover {
6614
    background-color: #aaa;
6615
    border-color: #aaa;
6616
}
6617

    
6618
.models-view .model-list .collection-action:hover {
6619
    background-color: #aaa;
6620
}
6621

    
6622
.models-view .model-list .collection-action:hover {
6623
    background-color: #F95;
6624
    border-color: #F95;
6625
}
6626

    
6627
.models-view .model-list .collection-action.in-progress {
6628
    background-color: #aaa;
6629
    color: #fff;
6630
    border-color: #aaa;
6631
    background-image: url("../images/icons/indicators/small/progress.gif") !important;
6632
}
6633

    
6634
.models-view .model-list .collection-action.add-generate {
6635
    background-image: url("../images/option-action-generate-ssh.png");
6636
}
6637

    
6638
.models-view .model-list .collection-action.add {
6639
    background-image: url("../images/option-action-add.png");
6640
    padding-right: 20px !important;
6641
}
6642

    
6643
.models-view .model-list .collection-action {
6644
    float: right;
6645
    background-color: #FF7F2A;
6646
    color: #fff;
6647
    padding: 6px 8px;
6648
    margin-left: 10px;
6649
    cursor: pointer;
6650
    padding-right: 30px;
6651
    background-position: right center;
6652
    background-repeat: no-repeat;
6653
    background-clip: border-box;
6654
    border-right: 5px solid #FF7F2A;
6655
}
6656

    
6657
.models-view .items-list {
6658
    margin-top: 10px;
6659
}
6660

    
6661
.models-view .model-list ul li.model-item:last-child {
6662
    margin-bottom: 0;
6663
}
6664

    
6665
.models-view .model-list ul li.model-item {
6666
    background-color: #D4E2E8;
6667
    margin-bottom: 5px;
6668
    position: relative;
6669
}
6670

    
6671
.models-view .model-list ul li.model-item .param {
6672
    float: left;
6673
    padding: 6px;
6674
}
6675

    
6676
.models-view .model-list ul li.model-item .item-action.confirm-remove {
6677
    margin-right: -15px !important;
6678
}
6679

    
6680
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover .cancel {
6681
    color: inherit !important;
6682
}
6683

    
6684
.models-view .model-list ul li.model-item .item-action.confirm-remove:hover {
6685
    background-color: #F95;
6686
    color: inherit !important;
6687
}
6688

    
6689
.models-view .model-list ul li.model-item .item-action.confirm-remove span.cancel {
6690
    padding: 6px !important;
6691
}
6692

    
6693
.models-view .model-list ul li.model-item .item-action.confirm-remove span {
6694
    display: block;
6695
    float: left;
6696
    padding: 6px 15px;
6697
}
6698

    
6699
.models-view .model-list ul li.model-item .item-action .cancel-remove:hover {
6700
    color: #fff !important;
6701
}
6702

    
6703
.models-view .model-list ul li.model-item .item-action.confirm-remove,
6704
.models-view .model-list ul li.model-item .item-action .do-confirm,
6705
.models-view .model-list ul li.model-item .item-action .cancel-remove {
6706
    display:none !important;
6707
    background-color: #D95D0A;
6708
    padding:0;
6709
    margin:0;
6710
}
6711

    
6712
.models-view .model-list ul li.model-item.pending-delete .item-action.remove {
6713
    display: none;
6714
}
6715

    
6716
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel {
6717
    background-color: #F95;
6718
}
6719

    
6720
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm {
6721
    background-color: #FF7F2A;
6722
}
6723

    
6724
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove,
6725
.models-view .model-list ul li.model-item.pending-delete .item-action.confirm-remove .do-confirm,
6726
.models-view .model-list ul li.model-item.pending-delete .item-action .cancel-remove {
6727
    display:block !important;
6728
}
6729

    
6730
.models-view .model-list ul li.model-item.pending-delete .item-action {
6731
    display: block;
6732
}
6733

    
6734
.models-view .model-list ul li.model-item.expanded .item-action,
6735
.models-view .model-list ul li.model-item:hover .item-action {
6736
    display: block;
6737
}
6738

    
6739
.models-view .model-list ul li.model-item .item-action.hide {
6740
    background-image: url("../images/minus-8.png");
6741
}
6742
.models-view .model-list ul li.model-item .item-action.show:hover {
6743
    background-image: url("../images/plus-8.png");
6744
}
6745

    
6746
.models-view .model-list ul li.model-item .item-action.show {
6747
    background-image: url("../images/plus-8-dark.png");
6748
}
6749

    
6750
.models-view .model-list ul li.model-item .item-action.remove {
6751
    background-image: url("../images/option-action-remove.png");
6752
}
6753

    
6754
.models-view .model-list ul li.model-item .item-action.edit:hover {
6755
    background-image: url("../images/option-action-edit-light.png");
6756
}
6757

    
6758
.models-view .model-list ul li.model-item .item-action.edit {
6759
    background-image: url("../images/option-action-edit.png");
6760
}
6761
.models-view .model-list ul li.model-item .item-action.remove:hover {
6762
    background-color: #880000 !important;
6763
    border-color: #800 !important;
6764
}
6765

    
6766
.models-view .model-list ul li.model-item.expanded .item-action.show,
6767
.models-view .model-list ul li.model-item.expanded .item-action.hide,
6768
.models-view .model-list ul li .item-actions .item-action:hover {
6769
    background-color: #4085A5;
6770
    color: #fff;
6771
    border-color: #4085A5;
6772
}
6773

    
6774
.models-view .model-list ul li .item-actions {
6775
    position: absolute;
6776
    right: -10px;
6777
    top: 0px;
6778
}
6779

    
6780
.models-view .model-list ul li .item-actions .item-action {
6781
    float: right;
6782
    padding: 6px;
6783
    margin-right: 10px;
6784
    display: none;
6785
    cursor: pointer;
6786
    padding-right: 20px;
6787
    background-repeat: no-repeat;
6788
    background-position: right center;
6789
    border-right: 5px solid transparent;
6790
}
6791

    
6792
.models-view .model-list h3 {
6793
    float: left;
6794
}
6795

    
6796
.models-view h3 {
6797
    font-size: 1.2em;
6798
    margin-bottom: 1em;
6799
    margin-top: 5px;
6800
    color: #4085A5;
6801
}
6802

    
6803
.models-view .form-actions {
6804
    font-size: 1.1em;
6805
}
6806

    
6807
.models-view .model-list ul li,
6808
.models-view .model-list ul {
6809
    list-style: none;
6810
}
6811

    
6812
.models-view .model-list ul li.header {
6813
    display: none;
6814
}
6815

    
6816
.models-view .model-form textarea {
6817
    width: 99%;
6818
    height: 100px;
6819
    border: 1px solid #aaa;
6820
}
6821

    
6822

    
6823
.models-view .model-form .form-field {
6824
    margin-bottom: 10px;
6825
}
6826

    
6827
.models-view .model-form label {
6828
    display: block;
6829
    color: #406A7D;
6830
    font-size: 1.1em;
6831
    margin: 0px 0 5px 0;
6832
}
6833

    
6834
.models-view .model-form .inline label {
6835
    float: left;
6836
    margin-right: 10px;
6837
    margin-top: 10px !important;
6838
}
6839

    
6840
.models-view .model-form input.long {
6841
    width: 400px;
6842
}
6843

    
6844
.models-view .model-form .inline input {
6845
    width: auto;
6846
    margin-top: 10px;
6847
}
6848

    
6849
.models-view .model-form .inline select {
6850
    width: auto;
6851
    margin-top: 7px;
6852
}
6853

    
6854
.models-view .model-form .inline .errors,
6855
.models-view .model-form .inline .field-desc {
6856
    clear: both;
6857
}
6858

    
6859
#user_public_keys .private-download {
6860
    margin: 5px 0;
6861
    margin-top: 6px;
6862
}
6863

    
6864
#user_public_keys .private-cont form {
6865
    float: left;
6866
    margin-left: 5px;
6867
}
6868

    
6869
#user_public_keys input.form-text:hover {
6870
    background: #F95;
6871
}
6872

    
6873
#user_public_keys input.form-text {
6874
    background: #FF7F2A;
6875
    color: #fff;
6876
    border: 1px solid #F95;
6877
    padding: 0 5px;
6878
    margin: 0 5px;
6879
    margin-top: -1px;
6880
    cursor: pointer;
6881
}
6882

    
6883
#user_public_keys .form-text {
6884
    float: left;
6885
}
6886

    
6887
#user_custom_images,
6888
#user_public_keys {
6889
    font-size: 0.7em;
6890
}
6891

    
6892
#user_public_keys .download-button {
6893
    width: 30px;
6894
    height: 30px;
6895
}
6896

    
6897

    
6898
#user_public_keys #model-item-tpl {
6899
    display: none;
6900
}
6901
#user_public_keys .model-item .name {
6902
    color: #4085A5;
6903
    font-size: 1.2em;
6904
}
6905

    
6906
#user_public_keys .model-item .fingerprint .flabel {
6907
    color: #888;
6908
    float: left;
6909
    margin-right: 5px;
6910
}
6911

    
6912
#user_public_keys .model-item .fingerprint {
6913
    float: none;
6914
    clear: both;
6915
    color: #444;
6916
    font-family: monospace;
6917
    letter-spacing: 1px;
6918
    padding: 4px;
6919
    font-size: 0.9em;
6920
    border-top: 1px solid #fff;
6921
}
6922

    
6923
#user_public_keys .model-item .publicid {
6924
    display: none;
6925
}
6926

    
6927
#user_public_keys .model-item.expanded .publicid .param-content {
6928
    padding: 5px 5px;
6929
    overflow: auto;
6930
    background-color: #FFF;
6931
    border: 1px solid #4085A5;
6932
    border-left: none;
6933
    border-right: none;
6934
    font-size: 1.1em;
6935
}
6936

    
6937
#user_public_keys .model-item.expanded .publicid .param-content textarea {
6938
    width: 100%;
6939
    height: 90px;
6940
    margin:0;
6941
    padding:0;
6942
    border:none;
6943
    overflow: auto;
6944
}
6945

    
6946
#user_public_keys .model-item.expanded .publicid {
6947
    display: block;
6948
    background-color: #fff;
6949
    width: 100%;
6950
    margin-top: 0px;
6951
    margin-left: 0px;
6952
    color: #fff;
6953
    padding:0 !important;
6954
}
6955

    
6956
.models-view .form-messages {
6957
    margin-bottom: 10px;
6958
}
6959

    
6960
.models-view .list-messages {
6961
    margin-top: 10px;
6962
}
6963

    
6964
.models-view .form-messages .error,
6965
.models-view .form-messages .success,
6966
.models-view .list-messages .error,
6967
.models-view .list-messages .success,
6968
#user_public_keys .private-cont {
6969
    background-color: #AADE87;
6970
    color: #447821;
6971
    padding: 5px;
6972
    border: 1px solid #447821;
6973
    font-size: 1.1em;
6974
    margin-top: 5px;
6975
}
6976

    
6977
.models-view .form-messages .error,
6978
.models-view .list-messages .error {
6979
    background-color: #DE8D87;
6980
    color:  #782421 !important;
6981
    border-color: #782421;
6982
}
6983

    
6984
#user_public_keys .limit-msg {
6985
    color: #800;
6986
    position: absolute;
6987
    right: 20px;
6988
    top: 25px;
6989
}
6990

    
6991
#user_public_keys .private-cont {
6992
    margin-top: 10px;
6993
}
6994

    
6995
#user_public_keys .private-cont .private-msg {
6996
    float: left;
6997
    padding:5px;
6998
    margin-top: 5px;
6999
}
7000

    
7001
#user_public_keys .private-cont textarea {
7002
    margin: 5px;
7003
    width: 97%;
7004
    height: 200px;
7005
}
7006

    
7007
#user_public_keys .private-cont .close-private:hover {
7008
    color: #Fff;
7009
}
7010

    
7011
#user_public_keys .private-cont .close-private {
7012
    float: right;
7013
    margin-right: 5px;
7014
    font-weight: bold;
7015
    cursor: pointer;
7016
    text-decoration: underline;
7017
}
7018

    
7019
#user_public_keys .model-item .key-type {
7020
    background-color: #72ADC8;
7021
    color: #fff;
7022
    text-align: center;
7023
    font-size: 0.9em;
7024
    padding:2px 10px;
7025
    margin: 4px 6px;
7026
    margin-top: 7px;
7027
    font-weight: bold;
7028
}
7029

    
7030
#user_public_keys .private-cont .down-button {
7031
}
7032

    
7033
.models-view .form-field .field-desc {
7034
    font-style: italic;
7035
    font-size: 1em;
7036
    color: #888;
7037
}
7038

    
7039
.models-view .form-field.error label {
7040
    font-weight: bold;
7041
    color: #800 !important;
7042
}
7043

    
7044
.models-view .form-field .errors {
7045
    margin: 5px 0;
7046
}
7047

    
7048
.models-view .form-field .errors .error {
7049
    background-color: transparent;
7050
    border: none;
7051
    color: #800;
7052
}
7053

    
7054
.single .suspended-notice {
7055
  right: 180px;
7056
  top: 0px;
7057
  padding: 7px;
7058
  padding-bottom: 6px;
7059
}
7060

    
7061
.icon .suspended-notice {
7062
  right: 192px;
7063
  top: 50px;
7064
}
7065

    
7066
.suspended-notice {
7067
  display: inline-block;
7068
  padding: 4px;
7069
  background-color: #8f1915;
7070
  cursor: pointer;
7071
  position: absolute;
7072
  color: #fff;
7073
  font-size: 0.6em;
7074
  display: none;
7075
}
7076

    
7077
.suspended .suspended-notice {
7078
  display: block;
7079
}
7080

    
7081
.suspended .action-indicator {
7082
  display: none !important;
7083
}