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