www/include/style.css

   1 /*
   2
   3         Nonzero1.0 by nodethirtythree design
   4         http://www.nodethirtythree.com
   5         missing in a maze
   6
   7 */
   8
   9 /* This controls the width of the fluid width layouts */
  10
  11 div.fluid
  12 {
  13 width: 90% !important;
  14 }
  15
  16 /* This controls the width of the fixed width layouts */
  17
  18 div.fixed
  19 {
  20 width: 980px !important;
  21 margin: 0;
  22 }
  23
  24 /* Basic Stuff */
  25
  26 *
  27 {
  28 margin: 0em;
  29 padding: 0em;
  30 }
  31
  32 body
  33 {
  34   font-family: "Verdana", "Deja-Vu Sans", "Bitstream Vera Sans", sans-serif;
  35   font-size: 0.9em;
  36   background: #880400; /* url(/images/bg.png) repeat;*/
  37   color: #585858;
  38 }
  39
  40 h1,h2,h3,h4,h5,h6
  41 {
  42 font-weight: normal;
  43 letter-spacing: -1px;
  44 text-transform: lowercase;
  45 }
  46
  47 h3,h4,h5,h6
  48 {
  49 color: #66000F;
  50 }
  51
  52 h1 span
  53 {
  54 font-weight: bold;
  55 }
  56
  57 h3 span
  58 {
  59 font-weight: bold;
  60 }
  61
  62 h4 span
  63 {
  64 font-weight: bold;
  65 }
  66
  67 br.clear
  68 {
  69 clear: both;
  70 }
  71
  72 img
  73 {
  74 padding: 3px;
  75 }
  76
  77 img.floatTL
  78 {
  79 float: left;
  80 margin-right: 1.5em;
  81 margin-bottom: 1.5em;
  82 margin-top: 0.5em;
  83 }
  84
  85 img.floatTR
  86 {
  87 float: right;
  88 margin-left: 1.5em;
  89 margin-bottom: 1.5em;
  90 margin-top: 0.5em;
  91 }
  92
  93 img.symbol
  94 {
  95 float: left;
  96 margin-bottom: 0em;
  97 border: 0;
  98 }
  99
 100 a
 101 {
 102 text-decoration: underline;
 103 color: #D90000;
 104 border-style: none;
 105 }
 106
 107 a:hover
 108 {
 109 text-decoration: none;
 110 }
 111
 112 ul.links
 113 {
 114   /* list-style: none; */
 115   padding-left: 1em;
 116 }
 117
 118 ul.links li
 119 {
 120 line-height: 1.5em;
 121 font-size: 0.9em;
 122 /* display: inline; */
 123 }
 124
 125 ul.links li.first
 126 {
 127 }
 128
 129 p
 130 {
 131 line-height: 1.5em;
 132 }
 133
 134 /* Header */
 135
 136 #header
 137 {
 138 width:100%;
 139 height:102px;
 140 background: url('/images/bg-menu99.png') repeat-x;
 141 }
 142
 143 #header_inner
 144 {
 145 position: relative;
 146 width: 980px;
 147 height:102px;
 148 margin: 0 auto;
 149 }
 150
 151 img.symbol
 152 {
 153 margin: 0;
 154 padding: 0;
 155 }
 156
 157 /* Logo */
 158
 159 #logo
 160 {
 161 position: absolute;
 162 top: 0;
 163 float: left;
 164 }
 165
 166 #header h1
 167 {
 168 float: left;
 169 margin-left: 105px;
 170 color: #eee;
 171 font-size: 150%;
 172 }
 173
 174 #header h2
 175 {
 176 float: left;
 177 margin-left: 105px;
 178 color: #E5CCD0;
 179 font-size: 1.0em;
 180 vertical-align: bottom;
 181 }
 182
 183 /* Header Line's */
 184 #line1
 185 {
 186 height: 37px;
 187 }
 188
 189 #line2
 190 {
 191 height: 32px;
 192 }
 193
 194 #line3
 195 {
 196 height: 31px;
 197 }
 198
 199 /* Lang */
 200
 201 #lang
 202 {
 203 position: absolute;
 204 right: 0em;
 205 top: 0em;
 206 }
 207
 208 #lang img
 209 {
 210 float: left;
 211 border: none;
 212 margin-right: 0.5em;
 213 margin-bottom: 1.5em;
 214 margin-top: 0.5em;
 215 width: 30px;
 216 }
 217
 218 /* Menu */
 219
 220 #menu
 221 {
 222 position: absolute;
 223 left: 105px;
 224 top: 0em;
 225 }
 226
 227 #menu ul
 228 {
 229 list-style: none;
 230 }
 231
 232 #menu li
 233 {
 234 float: left;
 235 }
 236 #menu li
 237 {
 238 vertical-align: middle;
 239 background: #333 url('/images/btn-break.png') center;
 240 }
 241 #menu li a
 242 {
 243 margin-left: 1px; /*0.5em;*/
 244 margin-right: 1px;
 245 display: block;
 246 padding: 10px 5px 0 8px;
 247 height: 26px;
 248 background: #333 url('/images/btn-empty.png') repeat-x center;
 249 color: #ddd;
 250 font-weight: bolder;
 251 vertical-align: middle;
 252 font-size: 0.8em;
 253 text-decoration: none;
 254 }
 255
 256 #menu li a.active
 257 {
 258 background: #CA2F2F url('/images/btn-red2.png') repeat-x center;
 259 color: #ddd;
 260 }
 261
 262 #menu li a:hover
 263 {
 264 background: #333 url('/images/btn-red2.png') repeat-x center;
 265 color: #fff;
 266 }
 267
 268 /* Main */
 269
 270 #main
 271 {
 272 /* background: #fff url('images/n2.gif') 0px 1px repeat-x; */
 273 }
 274
 275 #main_inner p
 276 {
 277 text-align: justify;
 278 margin-bottom: 0.5em;
 279 font-size: 0.9em;
 280 }
 281
 282 #main_inner .post a
 283 {
 284 font-size: 0.9em;
 285 }
 286
 287 #main_inner ul
 288 {
 289 margin-bottom: 2.0em;
 290 font-size: 0.9em;
 291 }
 292
 293 #main_inner
 294 {
 295 position: relative;
 296 width: 950px;
 297 margin: 0 auto;
 298 }
 299
 300 #main_inner h3,h4
 301 {
 302 border-bottom: dotted 1px #E1E1E1;
 303 position: relative;
 304 }
 305
 306 #main_inner h3
 307 {
 308 font-size: 2.1em;
 309 padding-bottom: 0.1em;
 310 margin-bottom: 0.5em;
 311 }
 312
 313 #main_inner h4
 314 {
 315 font-size: 1.1em;
 316 padding-bottom: 0.175em;
 317 margin-bottom: 0.25em;
 318 margin-top: 0.95em;
 319 }
 320
 321 #main_inner .post
 322 {
 323 position: relative;
 324 margin-bottom: 2.0em;
 325 }
 326
 327 #main_inner .post h3
 328 {
 329 position: relative;
 330 font-size: 1.4em;
 331 padding-bottom: 0.25em;
 332 }
 333
 334 #main_inner .post ul.post_info , #main_inner .post .post_info
 335 {
 336 list-style: none;
 337 position: absolute;
 338 top: 3em;
 339 font-size: 0.7em;
 340 }
 341
 342 #main_inner .post .post_info
 343 {
 344 width: 100%;
 345 text-align: right;
 346 margin-top: -1.5em;
 347 }
 348
 349 #main_inner .post ul
 350 {
 351 padding-left: 1.0em;
 352 }
 353
 354 #main_inner .post ul a
 355 {
 356 font-size: 1.0em;
 357 }
 358
 359 #main_inner .post ul.post_info li
 360 {
 361 background-position: 0em center;
 362 background-repeat: no-repeat;
 363 display: inline;
 364 padding-left: 15px;
 365 }
 366
 367 #main_inner .post ul.post_info li.date
 368 {
 369 background-image: url('images/n5.gif');
 370 }
 371
 372 #main_inner .post ul.post_info li.comments
 373 {
 374 background-image: url('images/n6.gif');
 375 margin-left: 1.1em;
 376 }
 377
 378 table {
 379   border: 0px;
 380   border-collapse: collapse;
 381   border-spacing: 0px;
 382   margin: 0em;
 383   padding: 0em;
 384   width: 980px;
 385   max-width: 980px;
 386 }
 387 .post table {
 388   width: 900px;
 389   max-width: 900px;
 390   font-size: 0.9em;
 391 }
 392 #sh-tl {
 393   background: url(/images/sh-tl.png) no-repeat right bottom;
 394 }
 395 #sh-top {
 396   background: url(/images/sh-top.png) repeat-x bottom;
 397 }
 398 #sh-tr {
 399   background: url(/images/sh-tr.png) no-repeat left bottom;
 400 }
 401 #sh-lft {
 402   background: url(/images/sh-lft.png) repeat-y right;
 403 }
 404 #sh-rgt {
 405   background: url(/images/sh-rgt.png) repeat-y left;
 406 }
 407 #sh-bl {
 408   background: url(/images/sh-bl.png) no-repeat right top;
 409 }
 410 #sh-btn {
 411   background: url(/images/sh-btn.png) repeat-x top;
 412 }
 413 #sh-br {
 414   background: url(/images/sh-br.png) no-repeat left top;
 415 }
 416 #no-sh {
 417   background-color: #f5f5f5;
 418   width: 980px;
 419 }
 420 #sh-tl, #sh-top, #sh-tr, #sh-lft, #sh-rgt, #sh-bl, #sh-btn, #sh-br {
 421   width: 16px;
 422   height: 16px;
 423   padding: 0px;
 424   border-width: 0px;
 425   border-style: none;
 426 }
 427 .banner {
 428   border: 0;
 429 }
 430
 431 #nodes {
 432   width: 720px;
 433 }
 434 #nodes th, #nodes td {
 435   text-align: left;
 436 }
 437 #nodes td {
 438   width: 50px;
 439 }
 440
 441 /* Footer */
 442
 443 #footer
 444 {
 445 clear: both;
 446 height: 26px;
 447 color: #ddd;
 448 text-align: center;
 449 background: url(/images/ft.png) left top;
 450 margin-top: 0em;
 451 margin-bottom: 0em;
 452 padding-top: 0.5em;
 453 padding-bottom: 0.5em;
 454 text-transform: lowercase;
 455 }
 456
 457 /* Search */
 458
 459 input.button
 460 {
 461 background: #CA2F2F url('images/n3.gif') repeat-x;
 462 color: #fff;
 463 border: solid 1px #A94B4B;
 464 font-weight: bold;
 465 text-transform: lowercase;
 466 font-size: 0.8em;
 467 height: 2.0em;
 468 }
 469
 470 input.text
 471 {
 472 border: solid 1px #F1F1F1;
 473 font-size: 1.0em;
 474 padding: 0.25em 0.25em 0.25em 0.25em;
 475 }
 476
 477 #search
 478 {
 479 position: relative;
 480 width: 100%;
 481 margin-bottom: 2.0em;
 482 }
 483
 484 #search input.text
 485 {
 486 position: absolute;
 487 top: 0em;
 488 left: 0em;
 489 width: 9.5em;
 490 }
 491
 492 #search input.button
 493 {
 494 position: absolute;
 495 top: 0em;
 496 right: 0em;
 497 min-width: 2.0em;
 498 max-width: 2.5em;
 499 }
 500
 501 .thumbnail{
 502 position: relative;
 503 z-index: 0;
 504 }
 505
 506 .thumbnail:hover{
 507 background-color: transparent;
 508 z-index: 50;
 509 }
 510
 511 .thumbnail span{ /*CSS for enlarged image*/
 512 position: absolute;
 513 background-color: lightyellow;
 514 padding: 5px;
 515 left: -1000px;
 516 border: 1px dashed gray;
 517 visibility: hidden;
 518 color: black;
 519 text-decoration: none;
 520 }
 521
 522 .thumbnail span img{ /*CSS for enlarged image*/
 523 border-width: 0;
 524 padding: 2px;
 525 }
 526
 527 .thumbnail:hover span{ /*CSS for enlarged image on hover*/
 528 visibility: visible;
 529 top: 0;
 530 left: 60px; /*position where enlarged image should offset horizontally */
 531
 532 }
 533
 534 .feed {
 535   margin-left: 3px;
 536   padding: 0 0 0 19px;
 537   background: url("/images/feed.png") no-repeat 0 50%;
 538 }
 539
 540 /* LAYOUT - 3 COLUMNS */
 541
 542         /* Primary content */
 543
 544         #primaryContent_3columns
 545         {
 546         position: relative;
 547         margin-right: 34em;
 548         }
 549
 550         #columnA_3columns
 551         {
 552         position: relative;
 553         float: left;
 554         width: 100%;
 555         margin-right: -34em;
 556         padding-right: 2em;
 557         }
 558
 559         /* Secondary Content */
 560
 561         #secondaryContent_3columns
 562         {
 563         float: right;
 564         }
 565
 566         #columnB_3columns
 567         {
 568         width: 13.0em;
 569         float: left;
 570         padding: 0em 2em 0.5em 2em;
 571         border-left: dotted 1px #E1E1E1;
 572         }
 573
 574         #columnC_3columns
 575         {
 576         width: 13.0em;
 577         float: left;
 578         padding: 0em 0em 0.5em 2em;
 579         border-left: dotted 1px #E1E1E1;
 580         }
 581
 582 /* LAYOUT - 2 COLUMNS */
 583
 584         /* Primary content */
 585
 586         #primaryContent_2columns
 587         {
 588         position: relative;
 589         /* margin-right: 17em; */
 590         }
 591
 592         #columnA_2columns
 593         {
 594         position: relative;
 595         float: left;
 596         padding: 1em 0.5em 0.5em 1em;
 597         width: 710px;
 598         }
 599
 600         /* Secondary Content */
 601
 602         #secondaryContent_2columns
 603         {
 604         float: right;
 605         }
 606
 607         #columnC_2columns
 608         {
 609         width: 12.0em;
 610         float: left;
 611         padding: 0em 1em 0.5em 1em;
 612         border-left: dotted 1px #E1E1E1;
 613         }
 614
 615 /* LAYOUT - COLUMNLESS */
 616
 617         /* Primary content */
 618
 619         #primaryContent_columnless
 620         {
 621         position: relative;
 622         }
 623
 624         #columnA_columnless
 625         {
 626         position: relative;
 627         width: 100%;
 628         }