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 /* Cluster */
 432
 433 #nodes {
 434   width: 100%;
 435   font-size: 0.9em;
 436 }
 437 #nodes th, #nodes td {
 438   text-align: left;
 439 }
 440 #nodes th.hostname {
 441   width: 40%;
 442 }
 443 #nodes th.arch {
 444   width: 8%;
 445 }
 446 #nodes th.jobs {
 447   width: 24%;
 448 }
 449 #nodes th.speed {
 450   width: 10%;
 451 }
 452 #nodes th.load {
 453   width: 18%;
 454 }
 455
 456 /* Builds */
 457
 458 #builds {
 459   width: 100%;
 460   font-size: 0.9em;
 461 }
 462 #builds img {
 463         border: 0;
 464 }
 465 #builds td {
 466   text-align: left;
 467 }
 468 #builds tr.headline td {
 469         text-align: center;
 470         font-weight: bold;
 471 }
 472 #builds td.packages {
 473         text-align: right;
 474 }
 475
 476 /* Footer */
 477
 478 #footer
 479 {
 480 clear: both;
 481 height: 26px;
 482 color: #ddd;
 483 text-align: center;
 484 background: url(/images/ft.png) left top;
 485 margin-top: 0em;
 486 margin-bottom: 0em;
 487 padding-top: 0.5em;
 488 padding-bottom: 0.5em;
 489 text-transform: lowercase;
 490 }
 491
 492 /* Search */
 493
 494 input.button
 495 {
 496 background: #CA2F2F url('images/n3.gif') repeat-x;
 497 color: #fff;
 498 border: solid 1px #A94B4B;
 499 font-weight: bold;
 500 text-transform: lowercase;
 501 font-size: 0.8em;
 502 height: 2.0em;
 503 }
 504
 505 input.text
 506 {
 507 border: solid 1px #F1F1F1;
 508 font-size: 1.0em;
 509 padding: 0.25em 0.25em 0.25em 0.25em;
 510 }
 511
 512 #search
 513 {
 514 position: relative;
 515 width: 100%;
 516 margin-bottom: 2.0em;
 517 }
 518
 519 #search input.text
 520 {
 521 position: absolute;
 522 top: 0em;
 523 left: 0em;
 524 width: 9.5em;
 525 }
 526
 527 #search input.button
 528 {
 529 position: absolute;
 530 top: 0em;
 531 right: 0em;
 532 min-width: 2.0em;
 533 max-width: 2.5em;
 534 }
 535
 536 .thumbnail{
 537 position: relative;
 538 z-index: 0;
 539 }
 540
 541 .thumbnail:hover{
 542 background-color: transparent;
 543 z-index: 50;
 544 }
 545
 546 .thumbnail span{ /*CSS for enlarged image*/
 547 position: absolute;
 548 background-color: lightyellow;
 549 padding: 5px;
 550 left: -1000px;
 551 border: 1px dashed gray;
 552 visibility: hidden;
 553 color: black;
 554 text-decoration: none;
 555 }
 556
 557 .thumbnail span img{ /*CSS for enlarged image*/
 558 border-width: 0;
 559 padding: 2px;
 560 }
 561
 562 .thumbnail:hover span{ /*CSS for enlarged image on hover*/
 563 visibility: visible;
 564 top: 0;
 565 left: 60px; /*position where enlarged image should offset horizontally */
 566
 567 }
 568
 569 .feed {
 570   margin-left: 3px;
 571   padding: 0 0 0 19px;
 572   background: url("/images/feed.png") no-repeat 0 50%;
 573 }
 574
 575 /* LAYOUT - 3 COLUMNS */
 576
 577         /* Primary content */
 578
 579         #primaryContent_3columns
 580         {
 581         position: relative;
 582         margin-right: 34em;
 583         }
 584
 585         #columnA_3columns
 586         {
 587         position: relative;
 588         float: left;
 589         width: 100%;
 590         margin-right: -34em;
 591         padding-right: 2em;
 592         }
 593
 594         /* Secondary Content */
 595
 596         #secondaryContent_3columns
 597         {
 598         float: right;
 599         }
 600
 601         #columnB_3columns
 602         {
 603         width: 13.0em;
 604         float: left;
 605         padding: 0em 2em 0.5em 2em;
 606         border-left: dotted 1px #E1E1E1;
 607         }
 608
 609         #columnC_3columns
 610         {
 611         width: 13.0em;
 612         float: left;
 613         padding: 0em 0em 0.5em 2em;
 614         border-left: dotted 1px #E1E1E1;
 615         }
 616
 617 /* LAYOUT - 2 COLUMNS */
 618
 619         /* Primary content */
 620
 621         #primaryContent_2columns
 622         {
 623         position: relative;
 624         /* margin-right: 17em; */
 625         }
 626
 627         #columnA_2columns
 628         {
 629         position: relative;
 630         float: left;
 631         padding: 1em 0.5em 0.5em 1em;
 632         width: 710px;
 633         }
 634
 635         /* Secondary Content */
 636
 637         #secondaryContent_2columns
 638         {
 639         float: right;
 640         }
 641
 642         #columnC_2columns
 643         {
 644         width: 12.0em;
 645         float: left;
 646         padding: 0em 1em 0.5em 1em;
 647         border-left: dotted 1px #E1E1E1;
 648         }
 649
 650 /* LAYOUT - COLUMNLESS */
 651
 652         /* Primary content */
 653
 654         #primaryContent_columnless
 655         {
 656         position: relative;
 657         }
 658
 659         #columnA_columnless
 660         {
 661         position: relative;
 662         width: 100%;
 663         }
 664
 665
 666 /* URIEL */
 667 table.uriel {
 668         width: 100%;
 669         /* border: 1px solid #880400; */
 670         font-size: 0.9em;
 671 }
 672 table.uriel td.header {
 673         width: 80px;
 674 }
 675 table.uriel td {
 676         padding: 4px;
 677 }
 678 table.uriel td.item {
 679         /* font-weight: bold; */
 680 }
 681 table.uriel td.value {
 682         text-align: right;
 683 }
 684 table.uriel td.footer {
 685         text-align: right;
 686         background-color: #dedede;
 687         border: 1px solid #999;
 688 }
 689 /* Tabs */
 690 .ui-tabs {
 691         padding: .2em;
 692         zoom: 1;
 693 }
 694 .ui-tabs .ui-tabs-nav {
 695         list-style: none;
 696         position: relative;
 697         padding: .2em .2em 0;
 698 }
 699 .ui-tabs .ui-tabs-nav li {
 700         position: relative;
 701         float: left;
 702         border-bottom-width: 0 !important;
 703         margin: 0 .2em -1px 0;
 704         padding: 0;
 705 }
 706 .ui-tabs .ui-tabs-nav li a {
 707         float: left;
 708         text-decoration: none;
 709         padding: .5em .3em;
 710 }
 711 .ui-tabs .ui-tabs-nav li.ui-tabs-selected {
 712         padding-bottom: 1px;
 713         border-bottom-width: 0;
 714 }
 715 .ui-tabs .ui-tabs-nav li.ui-tabs-selected a, .ui-tabs .ui-tabs-nav li.ui-state-disabled a, .ui-tabs .ui-tabs-nav li.ui-state-processing a {
 716         cursor: text;
 717 }
 718 .ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a {
 719         cursor: pointer;
 720 } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
 721 .ui-tabs .ui-tabs-panel {
 722         padding: 1em 0.6em;
 723         display: block;
 724         border-width: 0;
 725         background: none;
 726 }
 727 .ui-tabs .ui-tabs-hide {
 728         display: none !important;
 729 }
 730 /* Component containers */
 731 .ui-widget-content {
 732     border: 1px solid #999/*{borderColorContent}*/;
 733         background: #F5F5F5/*{bgColorContent}*/ 50%/*{bgContentXPos}*/ url(/images/ui-bg_flat_75_f5f5f5_40x100.png)/*{bgImgUrlDefault}*/50%/*{bgContentYPos}*/ repeat-x/*{bgContentRepeat}*/;
 734         color: #222222/*{fcContent}*/;
 735 }
 736 .ui-widget-content a {
 737         color: #222222/*{fcContent}*/;
 738 }
 739 .ui-widget-header {
 740         border: 1px solid #aaaaaa/*{borderColorHeader}*/;
 741         background: #cccccc/*{bgColorHeader}*/ url(/images/ui-bg_highlight-soft_75_cccccc_1x100.png)/*{bgImgUrlHeader}*/ 50%/*{bgHeaderXPos}*/ 50%/*{bgHeaderYPos}*/ repeat-x/*{bgHeaderRepeat}*/;
 742         color: #222222/*{fcHeader}*/;
 743         font-weight: bold;
 744 }
 745 .ui-widget-header a {
 746         color: #222222/*{fcHeader}*/;
 747 }
 748 /* Interaction states */
 749 .ui-state-default, .ui-widget-content .ui-state-default {
 750         border: 1px solid #d3d3d3/*{borderColorDefault}*/;
 751         background: #e6e6e6/*{bgColorDefault}*/ url(/images/ui-bg_glass_75_e6e6e6_1x400.png)/*{bgImgUrlDefault}*/ 50%/*{bgDefaultXPos}*/ 50%/*{bgDefaultYPos}*/ repeat-x/*{bgDefaultRepeat}*/;
 752         font-weight: normal/*{fwDefault}*/;
 753         color: #555555/*{fcDefault}*/;
 754         outline: none;
 755 }
 756 .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited {
 757         color: #555555/*{fcDefault}*/;
 758         text-decoration: none;
 759         outline: none;
 760 }
 761 .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus {
 762         border: 1px solid #999999/*{borderColorHover}*/;
 763         background: #dadada/*{bgColorHover}*/ url(/images/ui-bg_glass_75_dadada_1x400.png)/*{bgImgUrlHover}*/ 50%/*{bgHoverXPos}*/ 50%/*{bgHoverYPos}*/ repeat-x/*{bgHoverRepeat}*/;
 764         font-weight: normal/*{fwDefault}*/;
 765         color: #212121/*{fcHover}*/;
 766         outline: none;
 767 }
 768 .ui-state-hover a, .ui-state-hover a:hover {
 769         color: #212121/*{fcHover}*/;
 770         text-decoration: none;
 771         outline: none;
 772 }
 773 .ui-state-active, .ui-widget-content .ui-state-active {
 774         border: 1px solid #aaaaaa/*{borderColorActive}*/;
 775         background: #F5F5F5/*{bgColorActive}*/ 50%/*{bgActiveXPos}*/ 50%/*{bgActiveYPos}*/ repeat-x/*{bgActiveRepeat}*/;
 776         font-weight: normal/*{fwDefault}*/;
 777         color: #212121/*{fcActive}*/;
 778         outline: none;
 779 }
 780 .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {
 781         color: #212121/*{fcActive}*/;
 782         outline: none;
 783         text-decoration: none;
 784 }
 785 /* Layout helpers */
 786 .ui-helper-clearfix:after {
 787         content: ".";
 788         display: block;
 789         height: 0;
 790         clear: both;
 791         visibility: hidden;
 792 }
 793 .ui-helper-clearfix {
 794         display: inline-block;
 795 }
 796 /* required comment for clearfix to work in Opera \*/
 797 * html .ui-helper-clearfix {
 798         height:1%;
 799 }
 800 .ui-helper-clearfix {
 801         display:block;
 802 }
 803 /* end clearfix */
 804 .ui-helper-zfix {
 805         width: 100%;
 806         height: 100%;
 807         top: 0;
 808         left: 0;
 809         position: absolute;
 810         opacity: 0;
 811         filter:Alpha(Opacity=0);
 812 }