autocomplete style
[wolnelektury.git] / wolnelektury / static / css / header.css
1 #header-bg {
2         z-index: -1;
3         background: #191919;
4         position: absolute;
5         width: 50%;
6         height: 9.4em;
7 }
8
9 #header {
10     height: 3em;
11     padding-top: 1.9em;
12     padding-bottom: 0;
13     color: #989898;
14     background: #191919;
15 }
16 #header a {
17         color: #17CFDB;
18 }
19
20 #half-header {
21     padding-bottom: 0;
22 }
23
24 #half-header-content {
25     background: #191919;
26     color: #989898;
27 }
28
29
30 #user-info {
31     float: right;
32     margin: 0;
33 }
34
35 #logo {
36     position: absolute;
37     top: -1.6em;
38     margin-left: 1.5em;
39 }
40
41 #logo a {
42     color:#f7f7f7;
43     font-size: 2.05em;
44 }
45
46 #tagline {
47     display: inline-block;
48     margin-left: 25.5em;
49 }
50 #tagline span {
51     font-size: 1.3em;
52     color: #bbb;
53 }
54
55 #search-area {
56     margin: 0;
57     background: #444;
58     color: white;
59     margin-left: 24em;
60     width: 73.5em;
61 }
62
63 #search-field {
64     display: inline-block;
65     width: 63.1em;
66     padding-left: .5em;
67     padding-right: 0;
68     padding-top: 0.5em;
69     padding-bottom: 0;
70 }
71
72 #search {
73     font-size: 1.3em;
74     padding: 0;
75     /*height: 3.3em;
76     width: 62.6em;
77     padding-left: .5em;
78     -webkit-border-radius: .5em;
79     -moz-border-radius: .5em;
80     border: none;
81     border-radius: .5em;
82     -webkit-box-shadow:0 0 .5em #444 inset;
83     -moz-box-shadow:0 0 .5em #444 inset;
84     box-shadow: 0 0 .5em #444 inset;*/
85     height: 2.54em;
86     width: 47.47em;
87     padding-left: 1em;
88     -webkit-border-radius: .38em;
89     -moz-border-radius: .38em;
90     border: none;
91     border-radius: .38em;
92     -webkit-box-shadow:0 0 .38em #444 inset;
93     -moz-box-shadow:0 0 .38em #444 inset;
94     box-shadow: 0 0 .5em #444 inset;
95     line-height: 2.5em;
96
97     font-family: Georgia;
98     background-color: #fff;
99     color: #000;
100     z-index: 200;
101     position: relative;
102 }
103
104 /* styling search placeholder */
105
106 #search:-webkit-input-placeholder
107 {
108     font-family: Georgia;
109     font-style: italic;
110     color: #767676;
111 }
112
113 #search.placeholder
114 {
115     font-family: Georgia;
116     font-style: italic;
117     color: #767676;
118 }
119
120 #search:-moz-placeholder
121 {
122     font-family: Georgia;
123     font-style: italic;
124     color: #767676;
125 }
126
127 #search-button {
128     display: inline-block;
129     background: #018189;
130     color: white;
131     padding: 0;
132     margin: 0;
133     width: 9.4em;
134     float: right;
135 }
136 #search-button button {
137     font-size: 1em;
138     height: 4.5em;
139     border: none;
140     background: #018189;
141     color: white;
142     width: 100%;
143     padding: 0;
144 }
145
146 #search-button button span {
147     font-size: 1.1em;
148     position:relative;
149 }
150
151
152 #nav-line {
153     background-color: #e2e2e2;
154     height: 4.9em;
155 }
156
157 ul#menu {
158     list-style: none;
159     padding: 0;
160     margin: 0 0 0 .6em;
161 }
162
163 li.menu {
164     background-color: #e2e2e2;
165     float: left;
166 }
167 a.menu {
168     display: block;
169     padding-left: 1.4em;
170     padding-right: 1.4em;
171     /* must match grid-line */
172     height: 3.1em;
173     padding-top: 1.8em;
174     color: #0c7076;
175 }
176 a.menu span {
177     font-size: 1.1em;
178 }
179
180
181 #lang-button {
182     color: #717171;
183 }
184 #lang-button:after {
185     padding-left: 1em;
186     content: "↓";
187     font-family: WL-Nav;
188     vertical-align: middle;
189 }
190 #lang-menu {
191     position: relative;
192     float: right;
193     display: block;
194     padding-left: 2.5em;
195     padding-right: 2em;
196     /* must match grid-line */
197     height: 3em;
198     padding-top: 1.9em;
199     background: #f7f7f7;
200 }
201
202 #lang-menu-items {
203         z-index: 9999;
204 }
205
206 #lang-menu-items button {
207     display: none;
208     background: #f7f7f7;
209     color: #6f6f6f;
210     cursor: pointer;
211     width: 100%;
212     border: solid #ddd;
213     border-width: 0 0 1px 0;
214     padding: .5em 0;
215     margin: 0;
216 }
217
218 #lang-menu:hover button {
219     display: block;
220 }
221
222 #lang-menu:hover #lang-menu-items {
223     position: absolute;
224     width: 100%;
225     padding: 0;
226     left: 0;
227     /* must match grid-line height */
228     top: 3.9em;
229 }
230
231 #lang-menu .active {
232     color: #000;
233 }
234
235 .search-hint-label {
236     display: inline-block;
237     width: 25em;
238     font-size: 1.1em;
239     line-height: 1.636em;
240 }
241
242 .search-hint-category {
243     font-size: 1.1em;
244     line-height: 1.636em;
245     
246 }