]>
Commit | Line | Data |
---|---|---|
7aba23d1 RK |
1 | .cfp-hotkeys-container { |
2 | display: table !important; | |
3 | position: fixed; | |
4 | overflow: auto; | |
5 | width: 100%; | |
6 | height: 100%; | |
7 | top: 0; | |
8 | left: 0; | |
9 | color: #333; | |
10 | font-size: 1em; | |
11 | background-color: rgba(255,255,255,0.9); | |
12 | } | |
13 | ||
14 | .cfp-hotkeys-container.fade { | |
15 | z-index: -1024; | |
16 | visibility: hidden; | |
17 | opacity: 0; | |
18 | -webkit-transition: opacity 0.15s linear; | |
19 | -moz-transition: opacity 0.15s linear; | |
20 | -o-transition: opacity 0.15s linear; | |
21 | transition: opacity 0.15s linear; | |
22 | } | |
23 | ||
24 | .cfp-hotkeys-container.fade.in { | |
25 | z-index: 10002; | |
26 | visibility: visible; | |
27 | opacity: 1; | |
28 | } | |
29 | ||
30 | .cfp-hotkeys-title { | |
31 | font-weight: bold; | |
32 | text-align: center; | |
33 | font-size: 1.2em; | |
34 | } | |
35 | ||
36 | .cfp-hotkeys { | |
37 | width: 100%; | |
38 | height: 100%; | |
39 | display: table-cell; | |
40 | vertical-align: middle; | |
41 | } | |
42 | ||
43 | .cfp-hotkeys table { | |
44 | margin: auto; | |
45 | color: #333; | |
46 | } | |
47 | ||
48 | .cfp-content { | |
49 | display: table-cell; | |
50 | vertical-align: middle; | |
51 | } | |
52 | ||
53 | .cfp-hotkeys-keys { | |
54 | padding: 5px; | |
55 | text-align: right; | |
56 | } | |
57 | ||
58 | .cfp-hotkeys-key { | |
59 | display: inline-block; | |
60 | color: #fff; | |
61 | background-color: #333; | |
62 | border: 1px solid #333; | |
63 | border-radius: 5px; | |
64 | text-align: center; | |
65 | margin-right: 5px; | |
66 | box-shadow: inset 0 1px 0 #666, 0 1px 0 #bbb; | |
67 | padding: 5px 9px; | |
68 | font-size: 1em; | |
69 | } | |
70 | ||
71 | .cfp-hotkeys-text { | |
72 | padding-left: 10px; | |
73 | font-size: 1em; | |
74 | } | |
75 | ||
76 | .cfp-hotkeys-close { | |
77 | position: fixed; | |
78 | top: 20px; | |
79 | right: 20px; | |
80 | font-size: 2em; | |
81 | font-weight: bold; | |
82 | padding: 5px 10px; | |
83 | border: 1px solid #ddd; | |
84 | border-radius: 5px; | |
85 | min-height: 45px; | |
86 | min-width: 45px; | |
87 | text-align: center; | |
88 | } | |
89 | ||
90 | .cfp-hotkeys-close:hover { | |
91 | background-color: #fff; | |
92 | cursor: pointer; | |
93 | } | |
94 | ||
95 | @media all and (max-width: 500px) { | |
96 | .cfp-hotkeys { | |
97 | font-size: 0.8em; | |
98 | } | |
99 | } | |
100 | ||
101 | @media all and (min-width: 750px) { | |
102 | .cfp-hotkeys { | |
103 | font-size: 1.2em; | |
104 | } | |
105 | } |