[Summary view] [Print] [Text view]

   1  /* $Id: layout-fixed.css,v 1.5.2.3 2009/02/13 19:20:19 johnalbin Exp $ */
   2  
   3  /*
   4   * LAYOUT STYLES
   5   *
   6   * Define CSS classes to create a table-free, 3-column, 2-column, or single
   7   * column layout depending on whether blocks are enabled in the left or right
   8   * columns.
   9   *
  10   * This layout is based on the Zen Columns layout method.
  11   *   http://drupal.org/node/201428
  12   *
  13   * Only CSS that affects the layout (positioning) of major elements should be
  14   * listed here.  Such as:
  15   *   display, position, float, clear, width, height, min-width, min-height
  16   *   margin, border, padding, overflow
  17   */
  18  
  19  
  20  /** body **/
  21    body
  22    {
  23      padding: 0px;
  24      margin: 0px;
  25      border: 0px;
  26  /*     background-color: #7A96DF; */
  27    }
  28  
  29    #page,
  30    #closure-blocks
  31    {
  32      /*
  33       * If you want to make the page a fixed width and centered in the viewport,
  34       * this is the standards-compliant way to do that. See also the ie.css file
  35       * for the necessary IE5 hack to center a div.
  36       */
  37      margin-left: auto;
  38      margin-right: auto;
  39      width: 960px;
  40      padding: 0px;
  41      border-left: 0px solid black;
  42      border-right: 0px solid black;
  43  
  44    }
  45  
  46    #page-inner
  47    {
  48      background: #ffffff url(images/innerwrap.gif)  repeat-y repeat-x;
  49    }
  50  
  51    #navigation-top,
  52    #navigation
  53    {
  54      position: absolute; /* Take the named anchors out of the doc flow    */
  55      left: -10000px;     /* and prevent any anchor styles from appearing. */
  56    }
  57  
  58    #skip-to-nav
  59    {
  60      float: right;
  61      margin: 0 !important;
  62      font-size: 0.8em;
  63      display: none;
  64    }
  65  
  66    #skip-to-nav a:link, #skip-to-nav a:visited
  67    {
  68      color: #fff; /* Same as background color of page */
  69    }
  70  
  71    #skip-to-nav a:hover
  72    {
  73      color: #000;
  74      text-decoration: none;
  75    }
  76  
  77    /* Alternatively, the skip-to-nav link can be completely hidden until a user tabs
  78       to the link. Un-comment the following CSS to use this technique. */
  79    /*
  80    #skip-to-nav a, #skip-to-nav a:hover, #skip-to-nav a:visited
  81    {
  82      position: absolute;
  83      left: 0;
  84      top: -500px;
  85      width: 1px;
  86      height: 1px;
  87      overflow: hidden;
  88    }
  89  
  90    #skip-to-nav a:active, #skip-to-nav a:focus
  91    {  
  92      position: static;
  93      width: auto;
  94      height: auto;
  95    }
  96    */
  97  
  98  /** header **/
  99    #header
 100    {
 101    }
 102  
 103    #head-image
 104    { padding-top: 0px;
 105    }
 106  
 107    #header-inner
 108    {
 109    }
 110  
 111    #logo-title
 112    {
 113    }
 114  
 115    #logo
 116    {
 117      float: left;
 118      display: none;
 119    }
 120  
 121    #site-name
 122    {
 123      display: none;
 124    }
 125  
 126    #site-slogan
 127    {
 128    }
 129  
 130    #header-blocks
 131    {
 132      clear: both; /* Clear the logo */
 133    }
 134  
 135  /** main (container for everything else) **/
 136    #main
 137    {
 138      position: relative;
 139    }
 140  
 141    #main-inner
 142    {
 143      background: #ffffff url(images/innerwrap.gif)  repeat-y repeat-x;
 144    }
 145  
 146  /** content **/
 147    #content,
 148    #content-bottom,
 149    .no-sidebars #content
 150    {
 151      float: left;
 152      width: 960px;
 153      margin-left: 0;
 154      margin-right: -960px; /* Negative value of #content's width + left margin. */
 155      padding: 0; /* DO NOT CHANGE. Add padding or margin to #content-inner. */
 156    }
 157  
 158    .sidebar-left #content
 159    {
 160      width: 760px;
 161      margin-left: 200px; /* The width of #sidebar-left. */
 162      margin-right: -960px; /* Negative value of #content's width + left margin. */
 163    }
 164  
 165    .sidebar-right #content-bottom,
 166    .sidebar-right #content
 167    {
 168      width: 600px;
 169      margin-left: 10px;
 170      margin-right: -560px; /* Negative value of #content's width + left margin. */
 171    }
 172  
 173    .two-sidebars #content
 174    {
 175      width: 500px;
 176      margin-left: 200px; /* The width of #sidebar-left */
 177      margin-right: -700px; /* Negative value of #content's width + left margin. */
 178    }
 179  
 180     .two-sidebars.logged-in #content
 181    {
 182      width: 500px;
 183      margin-left: 175px; /* The width of #sidebar-left */
 184      margin-right: -725px; /* Negative value of #content's width + left margin. */
 185    }
 186  
 187    #content-inner
 188    {
 189      margin: 5px;
 190      padding: 0px 0px;
 191  /*    background-color: white; 
 192      background: #ffffff url(images/innerwrap.gif) top right repeat-y; */
 193      font-family: Georgia, "Times New Roman", "Bitstream Vera Serif", serif;
 194      width: 44em;
 195    }
 196  
 197    .no-sidebars #content-inner
 198    {
 199      padding-left: 3em;
 200      width: 65em;
 201    }
 202  
 203    #content-inner a
 204    {
 205      color: #000;
 206      text-decoration: none;
 207    }
 208    #content-inner a:hover
 209    {
 210      color: #000;
 211      text-decoration: underline;
 212    }
 213  
 214  /** navbar **/
 215    #navbar
 216    {
 217      font-family: Tahoma, Verdana, Arial, Helvetica, "Bitstream Vera Sans", sans-serif;
 218      float: left;
 219      width: 100%;
 220      border-top: 1px solid #999;
 221      border-bottom: 1px solid #999;
 222      margin-top:  -4px;
 223      margin-left: 0px;
 224      background-color: #C9CFC2;
 225      margin-right: -1010px; /* Negative value of #navbar's width + left margin. */
 226      padding: 0; /* DO NOT CHANGE. Add padding or margin to #navbar-inner. */
 227      height: 2.6em; /* The navbar can have any arbritrary height. We picked one
 228                        that is twice the line-height pluse 1em: 2 x 1.3 + 1 = 3.6
 229                        Set this to the same value as the margin-top below. */
 230    }
 231    .sidebar-right #navbar
 232    {
 233      margin-left: -50px;
 234      font-family: Tahoma, Verdana, Arial, Helvetica, "Bitstream Vera Sans", sans-serif;
 235    }
 236   .sidebar-right
 237    {
 238      font-family: Tahoma, Verdana, Arial, Helvetica, "Bitstream Vera Sans", sans-serif;
 239    }
 240    .sidebar-left #navbar
 241    {
 242      margin-left: 0px;
 243    }
 244  
 245    .with-navbar #content,
 246    .with-navbar #sidebar-left,
 247    .with-navbar #sidebar-right
 248    {
 249      margin-top: 2.6em; /* Set this to the same value as the navbar height above. */
 250    }
 251  
 252    #navbar-inner
 253    {
 254    }
 255  /*
 256    #search-box
 257    {
 258      width: 200px;
 259      margin-right: -200px; /* Negative value of #search-box's width. */
 260      float: left;
 261    }
 262  */
 263  .search-box {
 264    float: right;
 265    margin-bottom: 0;
 266    overflow: visible;
 267    width: auto;
 268  }
 269  
 270  .search-box-inner {
 271    float: right;
 272    width: 232px;
 273  }
 274  
 275  .search-box-inner form#search-theme-form {
 276    background: url(../images/search-bg.png) no-repeat top center;
 277    height: 35px;
 278    position: absolute;
 279    right: 0;
 280    top: 5px;
 281    width: 232px;
 282    z-index: 10;
 283  }
 284  
 285  .search-box-inner #search-input {
 286    padding: 8px 0 0 10px;
 287  }
 288  
 289  .search-box-inner input#edit-search-theme-form-header {
 290    background: none;
 291    border: none;
 292    color: #333;
 293    float: left;
 294    margin: 0;
 295    padding: 0;
 296    width: 185px;
 297  }
 298  
 299  .search-box-inner .searchButtonPng {
 300    margin: -1px 0 0 10px;
 301    padding: 0;
 302  }
 303  
 304  .search-box-inner #search-input input {
 305    margin: 2px 0 0 0;
 306  }
 307    #primary
 308    {
 309      margin-left: 0px; /* Width of search-box */
 310    }
 311  
 312    #secondary
 313    {
 314      margin-left: 200px; /* Width of search-box */
 315    }
 316  
 317  
 318    #navbar ul /* Primary and secondary links */
 319    {
 320      margin: 0;
 321      padding: 8px 0px 0px 20px;
 322      text-align: left;
 323      font-size: 110%;
 324    }
 325    #navbar ul a:hover
 326    {
 327      text-decoration: underline;
 328    }
 329  
 330    #navbar li /* A simple method to get navbar links to appear in one line. */
 331    {
 332      float: left;
 333      padding: 0 10px 0 0;
 334    }
 335    #navbar li + li
 336    {
 337      border-left: 1px solid black;
 338      padding-left: 10px;
 339    }
 340  
 341  
 342  /** sidebar-left **/
 343    #sidebar-left
 344    {
 345      float: left;
 346      width: 200px;
 347      margin-left: 5px;
 348      margin-right: -200px; /* Negative value of #sidebar-left's width + left margin. */
 349      padding: 0; /* DO NOT CHANGE. Add padding or margin to #sidebar-left-inner. */
 350    }
 351  
 352  .logged-in #sidebar-left
 353    {
 354      width: 175px;
 355    }
 356  
 357  #sidebar-left-inner
 358    {
 359      margin: 0 20px 0 0;
 360      padding: 0;
 361    }
 362  
 363  /** sidebar-right **/
 364    #sidebar-right
 365    {
 366      float: left;
 367      width: 270px;
 368      margin-left: 600px; /* Width of content + sidebar-left. */
 369      margin-right: -980px; /* Negative value of #sidebar-right's width + left margin. */
 370      padding: 0; /* DO NOT CHANGE. Add padding or margin to #sidebar-right-inner. */
 371    }
 372  
 373  /*  .logged-in #sidebar-right
 374    {
 375      margin-left: 653px; 
 376    }
 377  */
 378    #sidebar-right-inner
 379    {
 380      margin: 0 0 0 20px;
 381      padding: 0;
 382    }
 383  
 384  /** footer **/
 385    #footer
 386    {
 387      background-color: #C9CFC2;
 388      height: 20px;
 389      padding-top: 5px;
 390      padding-bottom: 2px;
 391      border-top: 1px solid #999;
 392    }
 393  
 394    #footer-inner div 
 395    {
 396      display: inline;
 397    }
 398    #footer-inner span#hebdate
 399    {
 400      float: right;
 401      padding-right: 3em;
 402    }
 403  
 404  /** closure **/
 405    #closure-blocks /* See also the #page declaration above that this div shares. */
 406    {
 407    }
 408  
 409  /** Prevent overflowing content **/
 410    #header,
 411    #content,
 412    #navbar,
 413    #sidebar-left,
 414    #sidebar-right,
 415    #footer,
 416    #closure-blocks
 417    {
 418      overflow: visible;
 419      word-wrap: break-word; /* A very nice CSS3 property */
 420    }
 421  
 422    #navbar
 423    {
 424      overflow: visible; /* May need to be removed if using a dynamic drop-down menu */
 425    }
 426  
 427    /* If a div.clear-block doesn't have any content after it and its bottom edge
 428       touches the bottom of the viewport, Firefox and Safari will mistakenly
 429       place several pixels worth of space between the bottom of the div and the
 430       bottom of the viewport. Uncomment this CSS property to fix this.
 431       Note: with some over-large content, this property might cause scrollbars
 432       to appear on the #page div.
 433    */
 434    /*
 435    #page
 436    {
 437      overflow-y: hidden;
 438    }
 439    */
 440    
 441  /***
 442     Settings for schedule sidebar (placeholder)
 443  ***/
 444    div#holidays
 445    {
 446      margin-top: -2em;
 447    }
 448  
 449    #placeholder
 450    {
 451      width: 286px;
 452    }
 453  
 454    div#holidays
 455    {
 456      text-align: center;
 457      margin-left: 0px;
 458      padding: 0px 0px 0px 0px;
 459      width: 286px;
 460      line-height: .75em;
 461    }
 462  
 463   div#holidays table
 464    {
 465      width: 291px;
 466    }
 467  
 468  #holidays tr > td
 469    {
 470      text-align: right;
 471    }
 472  
 473    #holidays tr td + td
 474    {
 475      text-align: left;
 476      padding-left: 5px;
 477    }
 478  
 479    td#holsp
 480    {
 481      padding-left: 00px;
 482    }
 483  
 484    #skip-to-nav
 485    {
 486      display: hidden;
 487    }
 488  
 489    h4.title
 490    {
 491      display: inline;
 492      font-family: Tahoma, Verdana, Arial, Helvetica, "Bitstream Vera Sans", sans-serif;
 493    }
 494  
 495    table.tableSelect-processed
 496    {
 497      width: 100%
 498    }
 499  
 500    .posted-by
 501    {
 502      padding-left: 3em;
 503      font-family: Tahoma, Verdana, Arial, Helvetica, "Bitstream Vera Sans", sans-serif;
 504      font-style: italic;
 505      color: #BFBFBF
 506    }
 507  
 508    span.posted-by-date
 509    { 
 510      padding-left: 1em;
 511    }
 512  
 513  /***
 514     Settings for custom mobile page
 515  ***/
 516  
 517    body.page-indexm-shtml,
 518    body.page-indexm-shtml .sidebar-right #content,
 519    body.page-indexm-shtml #page
 520    {
 521      background:  transparent;
 522      background-color: #fff;
 523      width: 300px;
 524      padding: 0px;
 525      margin: 0px;
 526    }
 527    body.page-indexm-shtml #content
 528    {
 529       width: 300px;
 530    }
 531  
 532    body.page-indexm-shtml td#holsp
 533    {
 534      padding-left: 0px;
 535    }
 536  
 537    body.page-indexm-shtml  div#holidays
 538    {
 539      text-align: center;
 540      margin-left: 0px;
 541      padding: 0px 0px 0px 0px;
 542      width: 286px;
 543      line-height: .75em;
 544    }
 545  
 546  
 547    body.page-indexm-shtml td#holsp h4
 548    {
 549      margin-left: 0px;
 550      padding-left: 0px;
 551    }
 552  
 553    #holidays tr > td#holsp
 554    {
 555      text-align: center;
 556    }
 557  
 558  .two-sidebars #sidebar-right .title, #sidebar-right  .title, #content-area .title
 559    {
 560      background:url("images/bg-shade-light.png") repeat-x scroll left bottom #FFFFFF;
 561      color:#777777;
 562      clear: both;
 563      display:block;
 564      letter-spacing:normal;
 565      padding:5px 10px 2px 10px;
 566      text-align:left;
 567    }
 568  
 569   h4 #collapsibutton2 .title
 570    {
 571      padding-right: 5px;
 572    }
 573  
 574   .content h4.title:before
 575    {
 576   
 577       content: url("images/rt-pointer.png");
 578    }
 579  
 580   .content h4.visible:before
 581    {
 582   
 583       content: url("images/dn-pointer.png");
 584    }
 585  
 586    .not-logged-in.page-node-61.node-type-page #main-inner div.content
 587    {
 588          padding: 0 200px; 
 589    }
 590    .not-logged-in.page-node-61.node-type-page div#content-header
 591    {
 592          padding-left: 200px; 
 593    }
 594    #block-nice_menus-1 h2,
 595    .nice-menu-hide-title
 596    {
 597      display: none;
 598    }
 599    .block  #nice-menu-1
 600    {
 601      margin: -4px 0 4px 0;
 602      padding: 0;
 603    }
 604    .feed-icon
 605    {
 606      float: right;
 607      padding-right: 5px;
 608    }