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