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