| author | Eugen Sawin <sawine@me73.com> |
| Sun, 18 Dec 2011 03:44:26 +0100 | |
| changeset 73 | 44d14b5e7bab |
| child 74 | c0e6fb6cf6ef |
| permissions | -rw-r--r-- |
1 /*
2 ME73.com stylesheet
3 Author: Eugen Sawin <sawine@me73.com>
4 */
6 * { margin: 0; padding: 0; outline: 0 }
8 html { background: #222222; }
10 body {
11 /*font: 11px/165% 'Lucida Grande', Geneva, Verdana, Arial, Helvetica, sans-serif;*/
12 font: 12px/1.4 Helvetica Neue, Arial, Helvetica, 'Liberation Sans', FreeSans, sans-serif;
13 color: #8D8D8D;
14 margin: 0;
15 padding: 0;
16 background: #222222;
17 text-align: center;
18 }
20 /* Links */
21 a, a:visited {
22 text-decoration: none;
23 color: #DEDEDE;
24 }
25 a:hover {
26 color: #fff;
27 border-bottom: 1px dotted #438800;
28 }
30 /* headers */
31 h1, h2, h3, h4 {
32 /*font-family: 'Trebuchet MS', Helvetica, Tahoma, Arial, Sans-serif;*/
33 /*color: #0AEAEA;*/
34 color: #FFF;
35 }
36 h1 {
37 font-size: 3.1em;
38 letter-spacing: -2px;
39 padding: 15px 10px 5px 10px;
40 }
41 h2 {
42 font-size: 1.7em;
43 /*color: #895F30;*/
44 color: #FFF;
45 padding: 20px 10px 5px 10px;
46 }
47 h3 {
48 font-size: 1.6em;
49 font-weight: normal;
50 padding: 10px 10px 10px 5px;
51 }
53 h4 {
54 color: #AbAbAb;
55 font-size: 1.1em;
56 /*font-weight: bold;*/
57 padding: 10px 5px 0px 0px;
58 }
60 h5 {
61 font-size: 1.0em;
62 padding: 0px 0px 0px 0px;
63 }
65 p, dl {
66 padding: 5px 20px;
67 margin: 0;
68 }
70 ul, ol {
71 margin: 5px 20px;
72 padding: 0px 20px;
73 }
74 ul { list-style: none; }
76 dt {
77 /*font-weight: bold;*/
78 color: #FAFAFA;
79 }
80 dd {
81 padding-left: 25px;
82 }
84 /* images */
85 img {
86 background: #1B1B1B;
87 border: 4px solid #262626;
88 padding: 0px;
89 }
91 img.float-right {
92 margin: 5px 0px 5px 10px;
93 }
95 img.float-left {
96 margin: 5px 10px 5px 0px;
97 }
99 canvas {
100 border: 4px solid #262626;
101 }
103 #logo {
104 border-style: none;
105 position: relative;
106 margin: 0;
107 padding: 0;
108 color: #F8F8F8;
109 /* change the values of top and left to adjust the position of the logo*/
110 top: 40px; left: 25px;
111 height: 120px;
112 width: 670px;
113 }
115 code {
116 margin: 5px 0;
117 padding: 15px;
118 text-align: left;
119 display: block;
120 overflow: auto;
121 font: 500 1em/1.5em 'Lucida Console', 'Courier New', Monospace;
122 /* white-space: pre; */
123 background: #070707;
124 /*border: 1px solid #111; */
125 }
126 acronym {
127 cursor: help;
128 border-bottom: 1px dotted #5B5B5B;
129 }
130 blockquote {
131 margin: 15px 10px;
132 padding: 10px 10px 10px 35px;
133 background: #070707 url(quote.gif) no-repeat 10px 10px;
134 border: 1px solid #111;
135 font-weight: normal;
136 font-size: 17px;
137 line-height: 1.6em;
138 font-style: italic;
139 font-family: Georgia, 'Times New Roman', Times, serif;
140 color: #808080;
141 }
143 /* start - table */
144 table {
145 margin: 15px 0px;
146 border-collapse: collapse;
147 }
148 th {
149 color: #FAFAFA;
150 height: 38px;
151 padding-left: 0px;
152 padding-right: 12px;
153 text-align: left;
154 }
155 tr {
156 color: #5b5b5b;
157 height: 15px;
158 }
159 td {
160 padding-left: 0px;
161 padding-right: 12px;
162 }
163 /* end - table */
166 /* form elements */
167 form {
168 margin: 20px 10px;
169 padding: 15px 25px 25px 20px;
170 background: #070707;
171 /*border: 1px solid #111; */
172 }
173 form p {
174 /*border-bottom: 1px solid #101010;*/
175 padding: 12px 0 5px 0; margin: 0;
176 }
177 label {
178 font-weight: bold;
179 color: #FAFAFA;
180 }
181 input, select, textarea {
182 margin: 5px 0;
183 padding: 5px;
184 font: normal 1em Verdana, Tahoma, sans-serif;
185 color: #6A6969;
186 background: #0C0C0C;
187 /*border: 1px solid #1C1C1C;*/
188 }
189 option { padding-right: 0.5em; }
191 #name, #email, #message{
192 width: 480px;
193 }
194 input.button {
195 font: bold 12px Arial, Verdana, Sans-serif;
196 height: 30px;
197 padding: 2px 3px;
198 margin-top: 8px;
199 color: #48780E;
200 background: #000;
201 border-width: 1px;
202 border-style: solid;
203 border-color: #1B1B1B;
204 }
207 /* ------------------------------------------
208 LAYOUT
209 ------------------------------------------- */
210 #wrap {
211 position: relative;
212 width: 1020px;
213 margin: 0 auto;
214 text-align: left;
215 }
216 #content-wrap {
217 clear: both;
218 width: 1020px;
219 float: left;
220 padding-top: 15px;
221 padding-bottom: 50px;
222 }
223 #header {
224 position: relative;
225 width: 1020px;
226 height: 170px;
227 margin: 0;
228 padding: 0;
229 }
230 #header h1#logo-text a {
231 position: absolute;
232 margin: 0; padding: 0;
233 font: bold 65px 'Trebuchet MS', Tahoma, Helvetica, Arial, Sans-serif;
234 letter-spacing: -1.5px;
235 color: #F8F8F8;
236 text-decoration: none;
237 text-transform: none;
239 /* change the values of top and left to adjust the position of the logo*/
240 top: 70px; left: 30px;
241 }
242 #header h1#logo-text a:hover {
243 background: none;
244 margin-top: 100px;
245 padding-top: 100px;
246 }
247 #header img {
248 position: relative;
249 top: 90px;
250 left: 22px;
251 border: 0px;
252 }
254 #header p#intro {
255 position: absolute;
256 margin: 0;
257 padding: 0;
258 font-family: 'Trebuchet MS', Tahoma, Helvetica, Arial, Sans-serif;
259 font-weight: bold;
260 font-size: 16px;
261 line-height: 1.5em;
262 font-style: normal;
263 text-transform: none;
264 /*color: #6D7D2D;*/
265 color: #5ad715;
266 width: 400px;
268 /* change the values of top and left to adjust the position */
269 top: 145px;
270 left: 22px;
271 }
273 /* Navigation */
274 #nav {
275 position: absolute;
276 margin: 0;
277 padding: 0;
278 height: 50px;
279 left: 0px;
280 top: 30px;
281 }
282 #nav ul {
283 float: left;
284 list-style: none;
285 height: 50px;
286 margin: 0 0 0 10px;
287 padding: 0;
288 display: inline;
289 }
290 #nav ul li {
291 display: inline;
292 margin: 0;
293 padding: 0;
294 }
295 #nav ul li a {
296 float: left;
297 margin: 0;
298 padding: 0 12px;
299 font-weight: bold;
300 font-size: 1.25em;
301 text-decoration: none;
302 color: #c95723;
303 color: #999;
304 text-transform: uppercase;
305 }
306 #nav ul li a:hover,
307 #nav ul li a:active {
308 color: #eee;
309 background: none;
310 border: none;
311 }
312 #nav ul li#current a {
313 color: #D33972;
314 }
316 #subnav{
317 position: absolute;
318 margin: 17px 280px;
319 padding: 0;
320 height: 50px;
321 left: 10px;
322 top: 30px;
323 }
325 #subnav ul {
326 float: left;
327 list-style: none;
328 height: 50px;
329 margin: 0 0 0 10px;
330 padding: 0;
331 display: inline;
332 }
333 #subnav ul li {
334 display: inline;
335 margin: 0;
336 padding: 0;
337 }
338 #subnav ul li a {
339 float: left;
340 margin: 0;
341 padding: 0 12px;
342 font: bold 15px/50px 'Trebuchet MS', Helvetica, Arial, Geneva, sans-serif;
343 text-decoration: none;
344 color: #5ad715;
345 text-transform: uppercase;
346 }
347 #subnav ul li a:hover,
348 #subnav ul li a:active {
349 color: #eee;
350 background: none;
351 border: none;
352 }
353 #subnav ul li#current a {
354 color: #D33972;
355 }
357 /* Main Column */
358 #main {
359 float: left;
360 width: 670px;
361 padding: 0;
362 margin: 0 0 0 2px;
363 display: inline;
364 }
365 #main h2 {
366 padding: 5px 22px;
367 margin: 15px 5px 0px 0px;
368 /*font: bold 2.4em 'Trebuchet MS', Helvetica, Arial, sans-serif; */
369 /*color: #45D5E6;
370 color: #00cccc;*/
371 color: #FFF;
372 }
373 #main h2 a {
374 /*color: #45D5E6;*/
375 color: #FFF;
376 text-decoration: none;
377 border: none;
378 }
379 #main ul li {
380 /*list-style-image: url(images/bullet.png);*/
381 list-style: disc;
382 }
384 /* Sidebar */
385 #sidebar {
386 float: right;
387 width: 300px;
388 padding: 0;
389 margin: 0px 18px 0 0;
390 display: inline;
391 color: #5D5D5D;
392 /*border: 4px solid #262626;*/
393 }
395 #random_quote {
396 color: #c95723;
397 font-style: italic;
398 }
400 #sidebar h3 {
401 /*padding: 5px 12px;
402 margin: 15px 5px 10px 0;
403 font: bold 2.4em 'Trebuchet MS', Tahoma, Helvetica, Arial, sans-serif;
404 color: #45D5E6;*/
405 /*border-bottom: 1px solid #121212; */
406 /*background-image: url(pattern.gif); */
407 }
408 #sidebar ul.sidemenu {
409 text-align: left;
410 margin: 20px 5px 20px 0px;
411 padding: 0;
412 /*border-top: 1px solid #111; */
413 }
414 #sidebar ul.sidemenu li {
415 list-style: none;
416 padding: 8px 10px;
417 margin: 0;
418 /*border-bottom: 1px solid #111;*/
419 }
420 * html body #sidebar ul.sidemenu li {
421 height: 1%;
422 }
423 #sidebar ul.sidemenu li a {
424 text-decoration: none;
425 border: none;
426 color: #666666;
427 font-weight: bold;
428 /*font-family: 'Trebuchet MS', Tahoma, Helvetica, Arial, Sans-serif;*/
429 font-size: 9pt;
430 }
431 #sidebar ul.sidemenu li a span {
432 color: #444;
433 /*font-family: Georgia, 'Times New Roman', Times, serif;*/
434 font-style: italic;
435 font-weight: normal;
436 font-size: 8pt;
437 }
438 #sidebar ul.sidemenu li a:hover,
439 #sidebar ul.sidemenu li a:hover span {
440 color: #fff;
441 }
442 #sidebar ul.sidemenu ul { margin: 0 0 0 0px; padding: 0; }
443 #sidebar ul.sidemenu ul li { border: none; }
445 /* header quick search */
446 #sidebar form#quick-search {
447 padding: 0;
448 margin: 20px 0 35px 0;
449 border: none;
450 width: 290px; height: 33px;
451 /*background: url(header-search.gif) no-repeat; */
452 }
453 #sidebar form#quick-search p {
454 margin: 0;
455 padding: 0;
456 }
457 #sidebar form#quick-search input {
458 float: left;
459 border: none;
460 background: transparent;
461 color: #4E4E4E;
462 margin: 0;
463 }
464 #sidebar form#quick-search .tbox {
465 margin: 5px 0 0 0px;
466 width: 240px;
467 display: inline;
468 }
469 #search form#quick-search .btn{
470 width: 24px; height: 24px;
471 }
472 #sidebar form#quick-search label {
473 display: none;
474 }
476 /* footer */
477 #footer {
478 clear: both;
479 /*padding: 1em 0 2.5em 0;*/
480 background: #222222;
481 color: #4E4E4E;
482 width: 100%;
483 float: left;
484 }
485 #footer a {
486 color: #4E4E4E;
487 /*color: #0E909C;*/
488 border: none;
489 }
490 #footer a:hover {
491 color: #fafafa;
492 }
493 #footer .rssfeed {
494 background: url(images/rss.gif) no-repeat left 1px;
495 padding-left: 17px;
496 }
497 #footer-left {
498 float: left;
499 width: 70%;
500 }
501 #footer-right {
502 float: right;
503 width: 25%;
504 }
506 .download a
507 {
508 color: #5ad715;
509 }
511 /* postmeta */
512 .postmeta {
513 padding: 7px 5px;
514 margin: 5px 5px 5px 5px;
515 font-size: 1em;
516 color: #545454;
517 /*border: 1px solid #111; */
518 background: #222222;
519 }
520 .postmeta .date{ margin: 0 10px 0 5px; }
521 .postmeta a.comments { margin: 0 10px 0 5px; }
522 .postmeta a.readmore { margin: 0 10px 0 5px; }
524 .post-info { font-size: .95em; padding-top: 3px; margin-left: 5px; color: #444; }
525 .post-info a, .post-info a:visited { color: #AE275A; }
527 /* alignment classes */
528 .float-left { float: left; }
529 .float-right { float: right; }
530 .align-left { text-align: left; }
531 .align-right { text-align: right; }
533 /* display and additional classes */
534 .no-border {
535 border: none;
536 }
538 .clearer {
539 clear: both;
540 }
542 .clear {
543 display:inline-block;
544 }
546 .clear:after {
547 display:block;
548 visibility:hidden;
549 clear:both;
550 height:0;
551 content: ".";
552 }