e16a1bd4094539d166cca89fe43c8978fb1e4a5e
[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 }
101
102 /* styling search placeholder */
103
104 #search:-webkit-input-placeholder
105 {
106     font-family: Georgia;
107     font-style: italic;
108     color: #767676;
109 }
110
111 #search.placeholder
112 {
113     font-family: Georgia;
114     font-style: italic;
115     color: #767676;
116 }
117
118 #search:-moz-placeholder
119 {
120     font-family: Georgia;
121     font-style: italic;
122     color: #767676;
123 }
124
125 #search-button {
126     display: inline-block;
127     background: #018189;
128     color: white;
129     padding: 0;
130     margin: 0;
131     width: 9.4em;
132     float: right;
133 }
134 #search-button button {
135     font-size: 1em;
136     height: 4.5em;
137     border: none;
138     background: #018189;
139     color: white;
140     width: 100%;
141     padding: 0;
142 }
143
144 #search-button button span {
145     font-size: 1.1em;
146     position:relative;
147 }
148
149
150 #nav-line {
151     background-color: #e2e2e2;
152     height: 4.9em;
153 }
154
155 ul#menu {
156     list-style: none;
157     padding: 0;
158     margin: 0 0 0 .6em;
159 }
160
161 li.menu {
162     background-color: #e2e2e2;
163     float: left;
164 }
165 a.menu {
166     display: block;
167     padding-left: 1.4em;
168     padding-right: 1.4em;
169     /* must match grid-line */
170     height: 3.1em;
171     padding-top: 1.8em;
172     color: #0c7076;
173 }
174 a.menu span {
175     font-size: 1.1em;
176 }
177
178
179 #lang-button {
180     color: #717171;
181 }
182 #lang-button:after {
183     padding-left: 1em;
184     content: "↓";
185     font-family: WL-Nav;
186     vertical-align: middle;
187 }
188 #lang-menu {
189     position: relative;
190     float: right;
191     display: block;
192     padding-left: 2.5em;
193     padding-right: 2em;
194     /* must match grid-line */
195     height: 3em;
196     padding-top: 1.9em;
197     background: #f7f7f7;
198 }
199
200 #lang-menu-items {
201         z-index: 9999;
202 }
203
204 #lang-menu-items button {
205     display: none;
206     background: #f7f7f7;
207     color: #6f6f6f;
208     cursor: pointer;
209     width: 100%;
210     border: solid #ddd;
211     border-width: 0 0 1px 0;
212     padding: .5em 0;
213     margin: 0;
214 }
215
216 #lang-menu:hover button {
217     display: block;
218 }
219
220 #lang-menu:hover #lang-menu-items {
221     position: absolute;
222     width: 100%;
223     padding: 0;
224     left: 0;
225     /* must match grid-line height */
226     top: 3.9em;
227 }
228
229 #lang-menu .active {
230     color: #000;
231 }