9e81463df7441f90a7039a037177d61cdfe482eb
[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     color: #969696;
15     background: #191919;
16 }
17
18 #half-header {
19     background: url('/static/img/bg-header.png');
20     background-position: center;
21     background-size: 100%;
22 }
23
24 #half-header-content {
25     background: #191919;
26 }
27
28
29 #user-info {
30     float: right;
31     margin: 0;
32 }
33
34 #logo {
35     position: absolute;
36     top: 4em;
37 }
38
39 #logo a {
40     font-family: WL-Logo;
41     font-size: 1.9em;
42     color:#f7f7f7;
43 }
44
45 #logo img {
46     max-width: 15em;
47 }
48
49 #tagline {
50     display: inline-block;
51     margin-left: 16em;
52 }
53
54 #search {
55     margin: 0;
56     background: #444;
57     margin-left: 16em;
58     width: 59em;
59 }
60
61 #search-field {
62     display: inline-block;
63     width: 50em;
64     padding-left: .5;
65     padding-right: .5;
66     padding: .1em .5em 0 .5em;
67 }
68
69 #search-field input {
70     height: 2.8em;
71     border: none;
72     width: 49.5em;
73     font-size: 1em;
74     padding-left: .5em;
75     -webkit-border-radius: .5em;
76     -moz-border-radius: .5em;
77     border-radius: .5em;
78     -webkit-box-shadow:0 0 .5em #444 inset;
79     -moz-box-shadow:0 0 .5em #444 inset;
80     box-shadow: 0 0 .5em #444 inset;
81 }
82
83 #search-button {
84     display: inline-block;
85     background: #02adb7;
86     padding: 0;
87     margin: 0;
88     width: 8em;
89 }
90 #search-button button {
91     font-size: 1em;
92     /* should match grid-line */
93     height: 4em;
94     border: none;
95     background: #02adb7;
96     color: white;
97     width: 100%;
98     padding: 0;
99 }
100
101 #search-button button span {
102     position:relative;
103     top: -.2em;
104 }
105
106
107 #nav-line {
108     background-color: #e2e2e2;
109     height: 3.95em;
110 }
111
112 ul#catalogue {
113     list-style: none;
114     padding: 0;
115     margin: 0;
116 }
117 ul#catalogue li {
118     background-color: #e2e2e2;
119     float: left;
120 }
121 ul#catalogue a {
122     display: block;
123     padding-left: 1.5em;
124     padding-right: 1.5em;
125     /* must match grid-line */
126     height: 2.7em;
127     padding-top: 1.3em;
128 }
129
130
131
132 #lang-button:after {
133     padding-left: .5em;
134     content: "↓";
135     font-family: WL-Nav;
136     vertical-align: middle;
137 }
138 #lang-menu {
139     position: relative;
140     float: right;
141     display: block;
142     padding-left: 1.5em;
143     padding-right: 1.5em;
144     /* must match grid-line */
145     height: 2.7em;
146     padding-top: 1.3em;
147     background: #f7f7f7;
148 }
149
150 #lang-menu-items button {
151     display: none;
152     background: #f7f7f7;
153     color: #444;
154     cursor: pointer;
155     width: 100%;
156     border: solid #ddd;
157     border-width: 0 0 1px 0;
158     padding: .5em 0;
159     margin: 0;
160 }
161
162 #lang-menu:hover button {
163     display: block;
164 }
165
166 #lang-menu:hover #lang-menu-items {
167     position: absolute;
168     width: 100%;
169     padding: 0;
170     left: 0;
171     /* must match grid-line height */
172     top: 3.9em;
173 }
174
175 #lang-menu .active {
176     font-weight: bold;
177 }