theme: Fix CSS coding style.
[people/teissler/ipfire-2.x.git] / html / html / themes / ipfire / include / css / style.css
1
2 /* This controls the width of the fixed width layouts */
3
4 .fixed {
5 width: 910px !important;
6 }
7
8 /* Basic Stuff */
9
10 * {
11 margin: 0;
12 padding: 0;
13 }
14
15 html {
16 height: 100%;
17 }
18
19 /* This decorates all tables with class="tbl" */
20
21 table {
22 *border-collapse: collapse; /* IE7 and lower */
23 border-spacing: 0;
24 }
25
26 .tbl th {
27 color: #000000;
28 font-size: 14px;
29 border-top: 1px solid grey;
30 border-bottom: 1px solid grey;
31 background: #cccccc;
32 }
33
34 .tbl th:first-child {
35 border-left: 1px solid grey;
36 border-top: 1px solid grey;
37 border-bottom: 1px solid grey;
38 }
39
40 .tbl th:last-child {
41 border-right: 1px solid grey;
42 border-top: 1px solid grey;
43 border-bottom: 1px solid grey;
44 }
45
46 .tbl th:only-child {
47 border: 1px solid grey;
48 }
49
50 .tbl tr td:first-child {
51 border-left: 1px solid grey;
52 }
53
54 .tbl tr td:last-child {
55 border-right: 1px solid grey;
56 }
57
58 .tbl tr:first-child td:only-child {
59 border-top: 1px solid grey;
60 }
61
62 .tbl tr:last-child td:only-child {
63 border-bottom: 1px solid grey;
64 }
65
66 .tbl tr:last-child td:first-child {
67 border-bottom: 1px solid grey;
68 }
69
70 .tbl tr:last-child td:last-child {
71 border-bottom: 1px solid grey;
72 }
73
74 .tbl tr:last-child td {
75 border-bottom: 1px solid grey;
76 }
77
78 body {
79 /* SVG as background image (IE9/Chrome/Safari/Opera) */
80 background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIHZpZXdCb3g9IjAgMCAxIDEiIHByZXNlcnZlQXNwZWN0UmF0aW89Im5vbmUiPgo8bGluZWFyR3JhZGllbnQgaWQ9Imc2ODQiIGdyYWRpZW50VW5pdHM9InVzZXJTcGFjZU9uVXNlIiB4MT0iMTAwJSIgeTE9IjEwMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPgo8c3RvcCBzdG9wLWNvbG9yPSIjMDAwMDAwIiBvZmZzZXQ9IjAiLz48c3RvcCBzdG9wLWNvbG9yPSIjODgwNDAwIiBvZmZzZXQ9IjU3JSIvPgo8L2xpbmVhckdyYWRpZW50Pgo8cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2c2ODQpIiAvPgo8L3N2Zz4=);
81
82 background-image: linear-gradient(
83 bottom,
84 #000000 0%,
85 #880400 57%
86 );
87 background-image: -o-linear-gradient(
88 bottom,
89 #000000 0%,
90 #880400 57%
91 );
92 background-image: -moz-linear-gradient(
93 bottom,
94 #000000 0%,
95 #880400 57%
96 );
97 background-image: -webkit-linear-gradient(
98 bottom,
99 #000000 0%,
100 #880400 57
101 );
102 background-image: -ms-linear-gradient(
103 bottom,
104 #000000 0%,
105 #880400 57%
106 );
107 background-image: -webkit-gradient(
108 linear,
109 left bottom,
110 left top,
111 color-stop(0, #000000),
112 color-stop(0.57, #880400)
113 );
114 background-attachment: fixed;
115
116 font-size: 9pt;
117 font-family: "trebuchet ms", helvetica, sans-serif;
118 }
119
120
121 h1, h2, h3, h4, h5, h6 {
122 font-size: 20px;
123 font-weight: normal;
124 letter-spacing: -1px;
125 text-align: left;
126 }
127
128 h2, h3, h4, h5, h6 {
129 color: #66000F;
130 }
131
132 br.clear {
133 clear: both;
134 }
135
136 img {
137 padding: 3px;
138 }
139
140 a {
141 text-decoration: underline;
142 color: #d90000;
143 }
144
145 a:hover {
146 text-decoration: none;
147 }
148
149 p {
150 line-height: 1.8em;
151 }
152
153 hr {
154 margin: 0.3em 0 0.3em 0;
155 }
156
157 iframe {
158 border: 0;
159 }
160
161 .pull-right {
162 float: right !important;
163 }
164
165 /* Header */
166
167 #header {
168 height: 70px;
169 margin: 0 auto;
170 }
171
172 /* Logo */
173
174 #logo {
175 height: 65px;
176 margin-top: 1em;
177 background: url('../../images/tux2.png') no-repeat;
178 }
179
180 #logo h1 {
181 color: #fff;
182 font-size: 3.6em;
183 font-weight: bold;
184 padding-left: 1.7em;
185 }
186
187 /* Main */
188
189 .bigbox {
190 margin: 0 auto;
191 margin-top: 0.5em;
192 padding: 1.5em 2em 0 2em;
193 background: #fff url('../../images/n2.gif') 0px 0px repeat-x;
194 border: 1px solid black;
195
196 border-radius: 3px 3px 3px 3px;
197 -webkit-border-radius: 3px 3px 3px 3px;
198 }
199
200 #main_inner {
201 padding-bottom: 1.5em;
202 }
203
204 #main_inner p {
205 text-align: justify;
206 margin-bottom: 2em;
207 }
208
209 #main_inner ul {
210 margin-bottom: 2em;
211 }
212
213 #main_inner h1 {
214 font-size: 1.8em;
215 margin-bottom: 1em;
216 }
217
218 #main_inner .post {
219 border: 1px solid silver;
220 padding: 1em 2em 1em 2em;
221 margin-bottom: 1em;
222 clear: both;
223 }
224
225 #main_inner .post h2 {
226 border-bottom: dotted 1px #e1e1e1;
227 font-size: 1.7em;
228 margin-bottom: 1em;
229 }
230
231 #footer {
232 height: 2.5em;
233 margin-bottom: 1em;
234 }
235
236 #footer a {
237 color: inherit;
238 text-decoration: none;
239 }
240
241 #footer a:hover {
242 text-decoration: underline;
243 }
244
245 input {
246 margin: 0.2em;
247 }
248
249 input.button {
250 background: #ca2f2f url('../../images/n3.gif') repeat-x;
251 color: #fff;
252 border: solid 1px #a94b4b;
253 font-weight: bold;
254 font-size: 0.8em;
255 height: 2.0em;
256 }
257
258 input.text {
259 border: solid 1px #f1f1f1;
260 padding: 0.25em;
261 }
262
263 #traffic {
264 float: right;
265 min-width: 20em;
266 line-height: 32px;
267 }
268
269 /* Menu */
270 #cssmenu {
271 margin: 0 auto;
272 margin-top: 0;
273 padding-top: 0;
274 font-weight: 600;
275 height: 32px;
276 border: 1px solid black;
277 }
278
279 #cssmenu a {
280 color: #111111;
281 display: inline-block;
282 line-height: 32px;
283 padding: 0 1em;
284 text-decoration: none;
285 }
286
287 #cssmenu ul {
288 list-style: none;
289 }
290
291 #cssmenu > ul > li {
292 display: inline-block;
293 }
294
295 #cssmenu > ul > li.active a, #cssmenu > ul > li:hover > a {
296 color: white;
297 background: #aaaaaa;
298 }
299
300 #cssmenu .has-sub:hover > ul {
301 display: block;
302 }
303
304 #cssmenu .has-sub ul {
305 display: none;
306 position: absolute;
307 }
308
309 #cssmenu .has-sub ul li a {
310 min-width: 12em;
311 background: #ffffff;
312 color: grey;
313 display: block;
314 line-height: 40%;
315 padding: 12px 5px;
316 border: 1px solid black;
317 }
318
319 #cssmenu .has-sub ul li:hover a {
320 background: #dddddd;
321 }