[Summary view] [Print] [Text view]

   1  /*  phpBB 3.1 Admin Style Sheet
   2      ------------------------------------------------------------------------
   3      Original author:    subBlue ( http://www.subblue.com/ )
   4      Copyright (c) phpBB Limited <https://www.phpbb.com>
   5  
   6      For full copyright and license information, please see
   7      the docs/CREDITS.txt file.
   8      ------------------------------------------------------------------------
   9  */
  10  
  11  /* General markup styles
  12  ---------------------------------------- */
  13  * {
  14      /* Reset browsers default margin, padding and font sizes */
  15      margin: 0;
  16      padding: 0;
  17      font-size: 100%;
  18  }
  19  
  20  abbr {
  21      text-decoration: none;
  22  }
  23  
  24  body, div, p, th, td, li, dd {
  25      font-size: x-small;
  26      voice-family: "\"}\"";
  27      voice-family: inherit;
  28      font-size: small;
  29  }
  30  
  31  html>body, html>div, html>p, html>th, html>td, html>li, html>dd {
  32      font-size: small;
  33  }
  34  
  35  html {
  36      color: #536482;
  37      background: #DBD7D1;
  38      /* Always show a scrollbar for short pages - stops the jump when the scrollbar appears. non-ie browsers */
  39      height: 100%;
  40      margin-bottom: 1px;
  41      word-wrap: break-word;
  42  }
  43  
  44  body {
  45      /* Text-Sizing with ems: http://www.clagnut.com/blog/348/ */
  46      font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
  47      color: #536482;
  48      background: #DBD7D1;
  49      font-size: 62.5%;    /* This sets the default font size to be equivalent to 10px */
  50      margin: 10px 15px;
  51  }
  52  
  53  code, samp {
  54      font-size: 1.2em;
  55  }
  56  
  57  img {
  58      border: 0;
  59  }
  60  
  61  h1 {
  62      font-family: "Trebuchet MS", Helvetica, sans-serif;
  63      font-size: 1.70em;
  64      font-weight: normal;
  65      color: #333333;
  66  }
  67  
  68  h2, caption {
  69      font-family: "Trebuchet MS", Helvetica, sans-serif;
  70      font-size: 1.40em;
  71      font-weight: normal;
  72      color: #115098;
  73      text-align: left;
  74      margin-top: 25px;
  75  }
  76  
  77  .rtl h2, .rtl caption {
  78      text-align: right;
  79  }
  80  
  81  h3, h4 {
  82      font-family: "Trebuchet MS", Helvetica, sans-serif;
  83      font-size: 1.20em;
  84      text-decoration: none;
  85      line-height: 1.20em;
  86      margin-top: 25px;
  87  }
  88  
  89  p {
  90      margin-bottom: 0.7em;
  91      line-height: 1.40em;
  92      font-size: 0.90em;
  93  }
  94  
  95  ul {
  96      list-style: disc;
  97      margin: 0 0 1em 2em;
  98  }
  99  
 100  .rtl ul {
 101      margin: 0 2em 1em 0;
 102  }
 103  
 104  hr {
 105      border: 0 none;
 106      border-top: 1px dashed #999999;
 107      margin-bottom: 5px;
 108      padding-bottom: 5px;
 109      height: 1px;
 110  }
 111  
 112  .centered-text {
 113      text-align: center;
 114  }
 115  
 116  .search-box {
 117      float: left;
 118  }
 119  
 120  .rtl .search-box {
 121      float: right;
 122  }
 123  
 124  .small {
 125      font-size: 0.85em;
 126  }
 127  
 128  .hidden {
 129      display: none;
 130  }
 131  
 132  @media only screen and (max-width: 800px), only screen and (max-device-width: 800px)
 133  {
 134      body {
 135          margin: 5px 5px 0;
 136      }
 137  }
 138  
 139  @media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
 140  {
 141      html, body {
 142          height: auto;
 143          margin: 0;
 144          padding: 0;
 145      }
 146  }
 147  
 148  
 149  /* General links  */
 150  a:link, a:visited {
 151      color: #105289;
 152      text-decoration: none;
 153  }
 154  
 155  a:hover {
 156      color: #BC2A4D;
 157      text-decoration: underline;
 158  }
 159  
 160  a:active {
 161      color: #368AD2;
 162      text-decoration: none;
 163  }
 164  
 165  .install-body p a {
 166      font-weight: bold;
 167  }
 168  
 169  a#maincontent, a#acl, a#assigned_to {
 170      display: block;
 171  }
 172  
 173  /* List items */
 174  ul, ol {
 175      list-style-position: inside;
 176      margin-left: 1em;
 177  }
 178  
 179  li {
 180      display: list-item;
 181      list-style-type: inherit;
 182  }
 183  
 184  
 185  /* Main blocks
 186  ---------------------------------------- */
 187  #wrap {
 188      padding: 0 0 15px 0;
 189      min-width: 615px;
 190  }
 191  
 192  #page-header {
 193      text-align: right;
 194      background: url("../images/phpbb_logo.png") top left no-repeat;
 195      height: 54px;
 196      font-size: 0.85em;
 197      margin-bottom: 10px;
 198  }
 199  
 200  .rtl #page-header {
 201      text-align: left;
 202      background: url("../images/phpbb_logo.png") top right no-repeat;
 203  }
 204  
 205  #page-header h1 {
 206      color: #767676;
 207      font-family: "Trebuchet MS",Helvetica,sans-serif;
 208      font-size: 1.70em;
 209      padding-top: 10px;
 210  }
 211  
 212  #page-header p {
 213      font-size: 1.00em;
 214  }
 215  
 216  #page-header p#skip {
 217      display: none;
 218  }
 219  
 220  #page-body {
 221      min-width: 650px;
 222  }
 223  
 224  .copyright {
 225      font-size: 0.75em;
 226      text-align: center;
 227  }
 228  
 229  #content {
 230      padding: 30px 10px 10px;
 231      position: relative;
 232  }
 233  
 234  #content h1 {
 235      color: #115098;
 236      line-height: 1.2em;
 237      margin-bottom: 0;
 238  }
 239  
 240  #main {
 241      float: right;
 242      width: 100%;
 243      margin: 0 0 0 -210px;
 244  }
 245  
 246  .rtl #main {
 247      float: left;
 248      margin: 0 -210px 0 0;
 249  }
 250  
 251  .main {
 252      margin-left: 210px;
 253  }
 254  
 255  .rtl .main {
 256      margin-left: 0;
 257      margin-right: 210px;
 258  }
 259  
 260  #page-body.simple-page-body {
 261      padding: 0;
 262      padding-right: 10px;
 263      min-width: 0;
 264  }
 265  
 266  @media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
 267  {
 268      #wrap, #page-body, #page-body.simple-page-body {
 269          padding: 0;
 270          min-width: 300px;
 271      }
 272  
 273      #page-header {
 274          margin: 5px;
 275          padding-left: 160px;
 276          height: auto;
 277          min-height: 54px;
 278          overflow: hidden;
 279      }
 280  
 281      .rtl #page-header {
 282          padding-right: 160px;
 283          padding-left: 0;
 284      }
 285  
 286      #page-header h1 {
 287          font-size: 1.2em;
 288          white-space: nowrap;
 289          overflow: hidden;
 290          text-overflow: ellipsis;
 291      }
 292  
 293      #page-header fieldset {
 294          margin-top: 5px;
 295      }
 296  
 297      #main, .rtl #main, .main, .rtl .main {
 298          float: none;
 299          width: auto;
 300          margin: 0;
 301      }
 302  
 303      #content {
 304          background: #F3F3F3 url("../images/innerbox_bg.gif") repeat-x top;
 305          padding: 5px;
 306      }
 307  
 308      #page-footer {
 309          padding: 0 5px 5px;
 310      }
 311  }
 312  
 313  @media only screen and (max-width: 400px), only screen and (max-device-width: 400px)
 314  {
 315      #page-header {
 316          background-size: 76px 26.5px;
 317          padding-left: 80px;
 318          min-height: 30px;
 319      }
 320  
 321      .rtl #page-header {
 322          padding-right: 80px;
 323      }
 324  
 325      #page-header h1 {
 326          padding-top: 0;
 327          font-size: 1.1em;
 328      }
 329  }
 330  
 331  
 332  /* Tabbed menu
 333  ----------------------------------------*/
 334  #tabs {
 335      font-family: Arial, Helvetica, sans-serif;
 336      line-height: normal;
 337      margin: 0 7px;
 338      position: relative;
 339      z-index: 2;
 340  }
 341  
 342  #tabs > ul {
 343      list-style: none;
 344      margin: 0;
 345      padding: 0;
 346  }
 347  
 348  #tabs .tab {
 349      display: inline-block;
 350      float: left;
 351      font-size: 0.85em;
 352      font-weight: bold;
 353      line-height: 14px;
 354  }
 355  
 356  .rtl #tabs .tab {
 357      float: right;
 358  }
 359  
 360  #tabs .tab > a {
 361      background: #D4D6DA;
 362      background: -moz-linear-gradient(top, #CACBCF 0%, #D4D6DA 100%);
 363      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #CACBCF), color-stop(100%, #D4D6DA));
 364      background: -webkit-linear-gradient(top, #CACBCF 0%, #D4D6DA 100%);
 365      background: -o-linear-gradient(top, #CACBCF 0%, #D4D6DA 100%);
 366      background: -ms-linear-gradient(top, #CACBCF 0%, #D4D6DA 100%);
 367      background: linear-gradient(to bottom, #CACBCF 0%, #D4D6DA 100%);
 368      border: 1px solid #BBB;
 369      border-bottom-width: 0;
 370      border-radius: 5px 5px 0 0;
 371      color: #767676;
 372      display: block;
 373      font-weight: bold;
 374      margin: 1px 1px 2px 0;
 375      padding: 6px 9px 4px;
 376      position: relative;
 377      text-decoration: none;
 378      text-transform: uppercase;
 379      white-space: nowrap;
 380      cursor: pointer;
 381  }
 382  
 383  #tabs .tab > a:hover {
 384      background: #F1F1EE;
 385      border-color: #C0BFBB;
 386      color: #BC2A4D;
 387  }
 388  
 389  #tabs .activetab > a,
 390  #tabs .activetab > a:hover {
 391      background: #DCDEE2;
 392      background: -moz-linear-gradient(top, #F2F2F2 0%, #DCDEE2 100%);
 393      background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #F2F2F2), color-stop(100%, #DCDEE2));
 394      background: -webkit-linear-gradient(top, #F2F2F2 0%, #DCDEE2 100%);
 395      background: -o-linear-gradient(top, #F2F2F2 0%, #DCDEE2 100%);
 396      background: -ms-linear-gradient(top, #F2F2F2 0%, #DCDEE2 100%);
 397      background: linear-gradient(to bottom, #F2F2F2 0%, #DCDEE2 100%);
 398      border-color: #999;
 399      border-bottom: 2px solid #DCDEE2;
 400      box-shadow: 0 1px 1px #FFF inset;
 401      color: #23649F;
 402      margin: 0 1px 0 0;
 403      padding: 7px 10px 4px;
 404  }
 405  
 406  #tabs .activetab > a:hover {
 407      color: #115098;
 408  }
 409  
 410  /* Responsive tabs
 411  ----------------------------------------*/
 412  .responsive-tab {
 413      position: relative;
 414  }
 415  
 416  .responsive-tab > a.responsive-tab-link {
 417      display: block;
 418      font-size: 16px;
 419      position: relative;
 420      width: 16px;
 421      line-height: 14px;
 422      text-decoration: none;
 423      padding-left: 9px !important;
 424      padding-right: 9px !important;
 425  }
 426  
 427  .responsive-tab .responsive-tab-link:before {
 428      content: '';
 429      position: absolute;
 430      left: 10px;
 431      top: 7px;
 432      height: .125em;
 433      width: 14px;
 434      border-bottom: 0.125em solid #767676;
 435      border-top: 0.375em double #767676;
 436  }
 437  
 438  .responsive-tab .responsive-tab-link:hover:before {
 439      border-color: #BC2A4D;
 440  }
 441  
 442  .responsive-tab.activetab .responsive-tab-link:before {
 443      border-color: #23649F;
 444  }
 445  
 446  .responsive-tab.activetab .responsive-tab-link:hover:before {
 447      border-color: #115098;
 448  }
 449  
 450  #tabs .dropdown, #minitabs .dropdown {
 451      top: 20px;
 452      margin-right: -2px;
 453      font-weight: normal;
 454  }
 455  
 456  #tabs .dropdown-right .dropdown {
 457      margin-left: -2px;
 458  }
 459  
 460  #tabs .dropdown-contents {
 461      list-style: none;
 462      margin: 0;
 463  }
 464  
 465  #tabs .dropdown li {
 466      border-bottom: 1px dotted #DCDCDC;
 467  }
 468  
 469  #tabs .dropdown li:last-child {
 470      border-bottom: none;
 471  }
 472  
 473  #tabs .dropdown a {
 474      display: block;
 475      padding: 4px 8px;
 476      text-align: right;
 477  }
 478  
 479  /* Main Panel
 480  ---------------------------------------- */
 481  #acp {
 482      position: relative;
 483      top: -2px;
 484      margin: 0 0 2px;
 485      padding: 3px 1px;
 486      min-width: 550px;
 487      background: #F3F3F3 url("../images/innerbox_bg.gif") repeat-x top;
 488      border: 1px #999999 solid;
 489      border-radius: 5px;
 490      box-shadow: #FFF 0 0 0 1px inset;
 491  }
 492  
 493  #acp:first-child {
 494      top: 0;
 495  }
 496  
 497  .panel {
 498      background: #F3F3F3 url("../images/innerbox_bg.gif") repeat-x top;
 499      padding: 5px 0;
 500      border-radius: 5px;
 501      overflow: hidden;
 502  }
 503  
 504  @media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
 505  {
 506      #acp {
 507          min-width: 0;
 508          min-height: 0;
 509          border-radius: 0;
 510          border-width: 1px 0;
 511          background: #fff;
 512          padding: 1px 0;
 513          box-shadow: none;
 514      }
 515  }
 516  
 517  /* Sub-navigation Menu
 518  ---------------------------------------- */
 519  
 520  /* Menu */
 521  #menu {
 522      float: left;
 523      width: 200px;
 524      font-size: 1.00em;
 525      padding: 0;
 526      border-right: 1px solid #CCCFD3;
 527      position: relative;
 528      z-index: 1;
 529  }
 530  
 531  .rtl #menu {
 532      float: right;
 533      border: none;
 534      border-left: 1px solid #CCCFD3;
 535  }
 536  
 537  #menu p {
 538      font-size: 0.85em;
 539  }
 540  
 541  #menu ul {
 542      list-style: none;
 543      margin: 0;
 544      padding: 0;
 545      word-wrap: normal;
 546  }
 547  
 548  /* Default list state */
 549  #menu li, #menu .header {
 550      padding: 0;
 551      margin: 0;
 552      font-size: 0.85em;
 553      font-weight: bold;
 554      display: block;
 555  }
 556  
 557  /* Link styles for the sub-section links */
 558  #menu li span {
 559      display: block;
 560      padding: 3px 3px 3px 8px;
 561      margin: 1px 0;
 562      text-decoration: none;
 563      font-weight: normal;
 564      color: #138ECB;
 565  }
 566  
 567  .rtl #menu li span {
 568      padding: 3px 8px 3px 3px;
 569  }
 570  
 571  #menu li a:hover, #menu li a:hover span {
 572      text-decoration: none;
 573      background-color: #FFFFFF;
 574      color: #BC2A4D;
 575  }
 576  
 577  #menu li a:active, #menu li a:active span {
 578      color: #F632A0;
 579  }
 580  
 581  #menu li#activemenu a span {
 582      text-decoration: none;
 583      font-weight: bold;
 584      color: #1180B7;
 585      background: transparent url("../images/arrow_right.gif") 0% 50% no-repeat;
 586  }
 587  
 588  .rtl #menu li#activemenu a span {
 589      background: transparent url("../images/arrow_left.gif") 100% 50% no-repeat;
 590  }
 591  
 592  #menu li#activemenu a:hover span, #menu li#activemenu span {
 593      text-decoration: none;
 594      font-weight: bold;
 595      color: #BC2A4D;
 596      background: #FFFFFF url("../images/arrow_right.gif") 1% 50% no-repeat;
 597  }
 598  
 599  .rtl #menu li#activemenu a:hover span, .rtl #menu li#activemenu span {
 600      background: #FFFFFF url("../images/arrow_left.gif") 99% 50% no-repeat;
 601  }
 602  
 603  #menu li a:active, #menu li a:active span, #menu li#activemenu a:active span {
 604      color: #F632A0;
 605  }
 606  
 607  #menu li span.completed {
 608      text-decoration: none;
 609      padding: 3px 3px 3px 12px;
 610      background: url("../images/arrow_down.gif") 1% 50% no-repeat;
 611  }
 612  
 613  .rtl #menu li span.completed {
 614      text-decoration: none;
 615      padding: 3px 12px 3px 3px;
 616      background: url("../images/arrow_down.gif") 99% 50% no-repeat;
 617  }
 618  
 619  #menu .header {
 620      font-family: Tahoma, Helvetica, sans-serif;
 621      display: block;
 622      font-weight: bold;
 623      color: #115098;
 624      border-bottom: 1px solid #327AA5;
 625      padding: 4px 0 2px;
 626      margin-top: 15px;
 627      text-transform: uppercase;
 628      font-size: 0.75em;
 629      text-decoration: none;
 630      cursor: inherit;
 631      outline-style: none;
 632  }
 633  
 634  @media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
 635  {
 636      #menu, .rtl #menu {
 637          float: none;
 638          width: auto;
 639          border-width: 0;
 640          max-width: 200px;
 641          margin: 0 auto 10px;
 642      }
 643  
 644      #menu p {
 645          text-align: center;
 646      }
 647  
 648      #menu .menu-block.active {
 649          margin: 0 -5px;
 650          padding: 0 5px 3px;
 651          background: rgba(255, 255, 255, .5);
 652          border-radius: 5px;
 653      }
 654  
 655      #menu .menu-block.no-header.active {
 656          padding-top: 3px;
 657      }
 658  
 659      #menu .menu-block .header {
 660          margin-top: 5px;
 661          cursor: pointer;
 662          border-bottom-width: 0;
 663          position: relative;
 664          text-decoration: underline;
 665      }
 666  
 667      #menu .menu-block .header:focus, #menu .menu-block.active .header {
 668          color: #D31141;
 669          text-decoration: none;
 670      }
 671  
 672      #menu .menu-block ul {
 673          display: none;
 674      }
 675  
 676      .nojs #menu .menu-block:hover ul, #menu .menu-block.active ul, #menu .menu-block.no-header ul {
 677          display: block;
 678      }
 679  
 680      #menu .menu-block li:last-child {
 681          border-bottom: 1px solid #327AA5;
 682      }
 683  
 684      #menu .menu-block:last-child li:last-child, #menu .menu-block.active li:last-child {
 685          border-bottom-width: 0;
 686      }
 687  
 688      #menu .menu-block li a span {
 689          border-radius: 2px;
 690      }
 691  }
 692  
 693  
 694  /* Table styles
 695  ---------------------------------------- */
 696  
 697  table {
 698      width: 100%;
 699      border: 1px solid #CCCFD3;
 700      background-color: #FFFFFF;
 701      padding: 1px;
 702  }
 703  
 704  th {
 705      padding: 3px 4px;
 706      color: #FFFFFF;
 707      background: #70AED3 url("../images/gradient2b.gif") bottom left repeat-x;
 708      border-top: 1px solid #6DACD2;
 709      border-bottom: 1px solid #327AA5;
 710      text-align: left;
 711      font-size: 0.75em;
 712      text-transform: uppercase;
 713  }
 714  
 715  td {
 716      text-align: left;
 717      font-size: 0.85em;
 718      padding: 4px;
 719      line-height: 1.20em;
 720  }
 721  
 722  .rtl th, .rtl td {
 723      text-align: right;
 724  }
 725  
 726  .table1 {
 727      border-collapse: separate;
 728      border-spacing: 1px;
 729      clear: both;
 730  }
 731  
 732  dt#color_palette_placeholder table {
 733      margin-right: 5px;
 734      width: 80px;
 735  }
 736  
 737  #color_palette_placeholder td {
 738      padding: 0;
 739  }
 740  
 741  table.type2 {
 742      border: none;
 743      background: none;
 744      padding: 0;
 745  }
 746  
 747  table.type2 th {
 748      background: none;
 749      border-top: none;
 750      text-align: center;
 751      color: #115098;
 752      padding: 2px 0;
 753  }
 754  
 755  table.type2 td {
 756      padding: 0;
 757      font-size: 1em;
 758  }
 759  
 760  table.type2 td.name {
 761      padding: 2px;
 762      vertical-align: middle;
 763  }
 764  
 765  table.type3  {
 766      float: right;
 767      width: 300px;
 768      border: none;
 769      background-color: transparent;
 770      padding: 0;
 771  }
 772  
 773  .rtl table.type3 {
 774      float: left;
 775  }
 776  
 777  table.type3 thead th {
 778      background-color: transparent;
 779      border-top: none;
 780      text-align: center;
 781      color: #115098;
 782      padding: 0 3px;
 783      font-size: 0.85em;
 784      font-weight: normal;
 785      text-transform: none;
 786  }
 787  
 788  table.type3 tbody th {
 789      border-top: none;
 790      text-align: left;
 791      text-transform: none;
 792      padding: 0;
 793      border: none;
 794      font-size: 0.90em;
 795      font-weight: normal;
 796      width: 100%;
 797  }
 798  
 799  .rtl table.type3 tbody th {
 800      text-align: right;
 801  }
 802  
 803  table.type3 td {
 804      text-align: center;
 805      padding: 1px;
 806  }
 807  
 808  th.name {
 809      text-align: left;
 810      width: auto;
 811  }
 812  
 813  .rtl th.name {
 814      text-align: right;
 815  }
 816  
 817  td.name {
 818      text-align: left;
 819      font-weight: bold;
 820  }
 821  
 822  .rtl td.name {
 823      text-align: right;
 824  }
 825  
 826  .entry {
 827      text-align: left;
 828      font-weight: normal;
 829  }
 830  
 831  .rtl .entry {
 832      text-align: right;
 833  }
 834  
 835  .row1 {
 836      background-color: #F9F9F9;
 837  }
 838  
 839  table.zebra-table tbody tr:nth-child(odd) {
 840      background-color: #F9F9F9;
 841  }
 842  
 843  .row2 {
 844      background-color: #DCEBFE;
 845  }
 846  
 847  table.zebra-table tbody tr:nth-child(even) {
 848      background-color: #DCEBFE;
 849  }
 850  
 851  .row3 { background-color: #DBDFE2; }
 852  .row4 { background-color: #E4E8EB; }
 853  .col1 { background-color: #DCEBFE; }
 854  .col2 { background-color: #F9F9F9; }
 855  
 856  /* 4 row background colours for trees */
 857  .row1a { background-color: #F9F9F9; }
 858  .row1b { background-color: #F6F6F6; }
 859  .row2a { background-color: #E7EEF4; }
 860  .row2b { background-color: #E3EBF2; }
 861  
 862  tr.row-highlight:hover td { background-color: #DBDFE2; }
 863  
 864  .spacer {
 865      background-color: #DBDFE2;
 866      height: 1px;
 867      line-height: 1px;
 868  }
 869  
 870  /* Deactivated row */
 871  .row-inactive {
 872      color: #999;
 873  }
 874  .row-inactive a, .row-inactive strong {
 875      color: #888;
 876  }
 877  .row-inactive a:hover {
 878      color: #BC2A4D;
 879  }
 880  
 881  /* Specific tables */
 882  table.forums td.folder {
 883      width: 27px;
 884      text-align: center;
 885  }
 886  
 887  table td.actions {
 888      vertical-align: middle;
 889      width: 100px;
 890      text-align: center;
 891      white-space: nowrap;
 892  }
 893  
 894  table tr:first-child td.actions .up, table tr:last-child td.actions .down {
 895      display: none;
 896  }
 897  
 898  table tr:first-child td.actions .up-disabled, table tr:last-child td.actions .down-disabled {
 899      display: inline !important;
 900  }
 901  
 902  table.styles td.users, table td.mark {
 903      text-align: center;
 904  }
 905  
 906  table.fixed-width-table {
 907      table-layout: fixed;
 908      word-break: break-word;
 909  }
 910  
 911  @media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
 912  {
 913      table.responsive, table.responsive tbody, table.responsive tr, table.responsive td {
 914          display: block;
 915      }
 916  
 917      table.responsive thead, table.responsive th, table.responsive colgroup {
 918          display: none;
 919      }
 920  
 921      table.responsive.show-header thead, table.responsive.show-header th:first-child, table.responsive caption {
 922          display: block;
 923          width: auto !important;
 924          text-align: left !important;
 925          margin: 0;
 926      }
 927  
 928      table.responsive {
 929          background: transparent none;
 930          border-width: 0;
 931          padding: 0;
 932      }
 933  
 934      table.responsive caption {
 935          padding: 3px 4px;
 936          color: #FFFFFF;
 937          background: #70AED3 url("../images/gradient2b.gif") bottom left repeat-x;
 938          border-top: 1px solid #6DACD2;
 939          border-bottom: 1px solid #327AA5;
 940          text-align: left;
 941          font-size: 0.75em;
 942          font-weight: bold;
 943          text-transform: uppercase;
 944      }
 945  
 946      table.responsive.show-header th:first-child span.rank-img, table.responsive.no-caption caption, table.responsive.no-header thead {
 947          display: none;
 948      }
 949  
 950      table.responsive tr {
 951          margin: 2px 0;
 952          border: 1px solid #CCCFD3;
 953          background-color: #FFFFFF;
 954          padding: 1px 1px 0;
 955          overflow: hidden;
 956      }
 957  
 958      table.responsive tr.row1 td { background-color: #F9F9F9; }
 959      table.responsive tr.row2 td { background-color: #DCEBFE; }
 960      table.responsive tr.row3 td { background-color: #DBDFE2; }
 961      table.responsive tr.row4 td { background-color: #E4E8EB; }
 962      table.responsive tr.col1 td { background-color: #DCEBFE; }
 963      table.responsive tr.col2 td { background-color: #F9F9F9; }
 964      table.responsive tr.row1a td { background-color: #F9F9F9; }
 965      table.responsive tr.row1b td { background-color: #F6F6F6; }
 966      table.responsive tr.row2a td { background-color: #E7EEF4; }
 967      table.responsive tr.row2b td { background-color: #E3EBF2; }
 968  
 969      table.responsive td {
 970          width: auto !important;
 971          text-align: left !important;
 972          padding: 4px;
 973          margin-bottom: 1px;
 974      }
 975  
 976      .rtl table.responsive td {
 977          text-align: right !important;
 978      }
 979  
 980      table.responsive td.empty {
 981          display: none !important;
 982      }
 983  
 984      table.responsive td > dfn {
 985          display: inline-block !important;
 986      }
 987  
 988      table.responsive td > dfn:after {
 989          content: ':';
 990          padding-right: 5px;
 991      }
 992  
 993      table.responsive.two-columns td {
 994          width: 50% !important;
 995          float: left;
 996          -moz-box-sizing: border-box;
 997          box-sizing: border-box;
 998      }
 999  
1000      .rtl table.responsive.two-columns td {
1001          float: right;
1002      }
1003  
1004      table.responsive.two-columns td:nth-child(2n+1) {
1005          clear: left;
1006      }
1007  
1008      table.responsive span.rank-img {
1009          float: none;
1010          padding-right: 5px;
1011      }
1012  
1013      table.responsive#memberlist td:first-child input[type="checkbox"] {
1014          float: right;
1015      }
1016  
1017      /* Specific tables */
1018      table.responsive.forums td.folder {
1019          float: left;
1020          width: 27px;
1021          background: transparent;
1022      }
1023      .rtl table.responsive.forums td.folder {
1024          float: right;
1025      }
1026  
1027      table.responsive.forums td.forum-desc {
1028          margin-left: 35px;
1029          min-height: 27px;
1030          background: transparent;
1031      }
1032  
1033      .rtl table.responsive.forums td.forum-desc {
1034          margin-left: 0;
1035          margin-right: 35px;
1036      }
1037  
1038      table.responsive td.actions {
1039          clear: both;
1040          text-align: right !important;
1041      }
1042  
1043      .rtl table.responsive td.actions {
1044          text-align: left !important;
1045      }
1046  
1047      table.responsive.styles tr.responsive-style-row td:first-child {
1048          padding-left: 4px !important;
1049          padding-right: 4px !important;
1050      }
1051  
1052      table.responsive.styles td:first-child > dfn, table.responsive td.actions > dfn {
1053          display: none !important;
1054      }
1055  
1056      .horizontal-palette td:nth-child(2n), .vertical-palette tr:nth-child(2n) {
1057          display: none;
1058      }
1059  
1060      .colour-palette a {
1061          display: inline-block !important;
1062      }
1063  }
1064  
1065  /* General form styles
1066  ----------------------------------------*/
1067  fieldset {
1068      margin: 15px 0;
1069      padding: 10px;
1070      border-top: 1px solid #D7D7D7;
1071      border-right: 1px solid #CCCCCC;
1072      border-bottom: 1px solid #CCCCCC;
1073      border-left: 1px solid #D7D7D7;
1074      background-color: #FFFFFF;
1075      position: relative;
1076      border-radius: 3px;
1077  }
1078  
1079  fieldset h2 {
1080      margin-top: 0;
1081  }
1082  
1083  .rtl fieldset {
1084      border-top: 1px solid #D7D7D7;
1085      border-right: 1px solid #D7D7D7;
1086      border-bottom: 1px solid #CCCCCC;
1087      border-left: 1px solid #CCCCCC;
1088  }
1089  
1090  fieldset p {
1091      font-size: 0.85em;
1092  }
1093  
1094  legend {
1095      padding: 1px 0;
1096      font-family: Tahoma,arial,Verdana,Sans-serif;
1097      font-size: .9em;
1098      font-weight: bold;
1099      color: #115098;
1100      margin-top: -.4em;
1101      position: relative;
1102      text-transform: none;
1103      line-height: 1.2em;
1104      top: -.2em;
1105      vertical-align: middle;
1106  }
1107  
1108  input, textarea {
1109      font-family: Verdana, Helvetica, Arial, sans-serif;
1110      font-size: 0.90em;
1111      font-weight: normal;
1112      vertical-align: middle;
1113      padding: 2px;
1114      color: #111111;
1115      border-left: 1px solid #AFAEAA;
1116      border-top: 1px solid #AFAEAA;
1117      border-right: 1px solid #D5D5C8;
1118      border-bottom: 1px solid #D5D5C8;
1119      background-color: #E3DFD8;
1120  }
1121  
1122  .rtl input, .rtl textarea {
1123      border-left: 1px solid #D5D5C8;
1124      border-top: 1px solid #AFAEAA;
1125      border-right: 1px solid #AFAEAA;
1126      border-bottom: 1px solid #D5D5C8;
1127  }
1128  
1129  input:hover, textarea:hover {
1130      border-left: 1px solid #AFAEAA;
1131      border-top: 1px solid #AFAEAA;
1132      border-right: 1px solid #AFAEAA;
1133      border-bottom: 1px solid #AFAEAA;
1134      background-color: #E9E9E2;
1135  }
1136  
1137  input.langvalue, textarea.langvalue {
1138      width: 90%;
1139  }
1140  
1141  input[type="number"] {
1142      width: 60px;
1143      -moz-padding-end: 0;
1144  }
1145  
1146  optgroup, select {
1147      background-color: #FAFAFA;
1148      border: 1px solid #666666;
1149      font-family: Verdana, Helvetica, Arial, sans-serif;
1150      font-size: 0.85em;
1151      font-weight: normal;
1152      font-style: normal;
1153      cursor: pointer;
1154      padding: 1px;
1155      vertical-align: middle;
1156      width: auto;
1157      color: #000;
1158  }
1159  
1160  select:focus {
1161      outline-style: none;
1162  }
1163  
1164  optgroup {
1165      font-size: 1.00em;
1166      font-weight: bold;
1167  }
1168  
1169  optgroup.disabled-options {
1170      display: none;
1171      background-color: gray;
1172  }
1173  
1174  option {
1175      padding: 0 1em 0 0;
1176      color: #000;
1177  }
1178  
1179  option.disabled-option {
1180      color: graytext;
1181  }
1182  
1183  .rtl option {
1184      padding: 0 0 0 1em;
1185  }
1186  
1187  .sep {
1188      font-weight: bold;
1189  }
1190  
1191  .username-coloured {
1192      font-weight: bold;
1193  }
1194  
1195  textarea {
1196      font-family: Verdana, Helvetica, Arial, sans-serif;
1197      font-size: 0.85em;
1198      width: 60%;
1199      padding: 2px;
1200  }
1201  
1202  label {
1203      cursor: pointer;
1204      font-size: 0.85em;
1205      padding: 0 5px 0 0;
1206  }
1207  
1208  .rtl label {
1209      padding: 0 0 0 5px;
1210  }
1211  
1212  label input {
1213      font-size: 1.00em;
1214      vertical-align: middle;
1215  }
1216  
1217  label img {
1218      vertical-align: middle;
1219  }
1220  
1221  fieldset.quick, p.quick {
1222      margin: 0 0 5px;
1223      padding: 5px 0 0;
1224      border: none;
1225      background-color: transparent;
1226      text-align: right;
1227  }
1228  
1229  .rtl fieldset.quick, .rtl p.quick {
1230      text-align: left;
1231  }
1232  
1233  fieldset.quick legend {
1234      display: none;
1235  }
1236  
1237  fieldset.tabulated {
1238      background: none;
1239      margin: 0;
1240      margin-top: 5px;
1241      padding: 0;
1242      border: 0;
1243  }
1244  
1245  fieldset.tabulated legend {
1246      display: none;
1247  }
1248  
1249  fieldset.nobg {
1250      margin: 15px 0 0 0;
1251      padding: 0;
1252      border: none;
1253      background-color: transparent;
1254  }
1255  
1256  fieldset.display-options {
1257      margin: 15px 0 2px 0;
1258      padding: 0 0 4px 0;
1259      border: none;
1260      background-color: transparent;
1261      text-align: center;
1262      font-size: 0.85em;
1263  }
1264  
1265  fieldset.display-options select, fieldset.display-options input, fieldset.display-options label {
1266      font-size: 1.00em;
1267      vertical-align: middle;
1268  }
1269  
1270  select option.disabled {
1271      background-color: #bbb;
1272      color: #fff;
1273  }
1274  
1275  /* Special case inputs */
1276  select#board_timezone,
1277  select#full_folder_action {
1278      width: 95%;
1279  }
1280  
1281  @media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
1282  {
1283      fieldset {
1284          padding: 5px;
1285      }
1286  
1287      fieldset.quick, p.quick {
1288          float: none !important;
1289          text-align: center;
1290      }
1291  
1292      fieldset.display-options {
1293          clear: both;
1294      }
1295  }
1296  
1297  /* Definition list layout for forms
1298      Other general def. list properties defined in prosilver_main.css
1299  ---------------------------------------- */
1300  dl {
1301      font-family: Verdana, Helvetica, Arial, sans-serif;
1302      font-size: 1.00em;
1303  }
1304  
1305  dt {
1306      float: left;
1307      width: auto;
1308  }
1309  
1310  .rtl dt {
1311      float: right;
1312  }
1313  
1314  dd { color: #666666;}
1315  dd + dd { padding-top: 5px;}
1316  dt span { padding: 0 5px 0 0;}
1317  .rtl dt span { padding: 0 0 0 5px;}
1318  
1319  dt .explain { font-style: italic;}
1320  
1321  dt label {
1322      font-size: 1.00em;
1323      text-align: left;
1324      font-weight: bold;
1325      color: #4A5A73;
1326  }
1327  
1328  .rtl dt label {
1329      text-align: right;
1330  }
1331  
1332  dd label {
1333      font-size: 1.00em;
1334      white-space: nowrap;
1335      margin: 0 10px 0 0;
1336      color: #4A5A73;
1337  }
1338  
1339  .rtl dd label {
1340      margin: 0 0 0 10px;
1341  }
1342  
1343  html>body dd label input { vertical-align: text-bottom;}    /* Tweak for Moz to align checkboxes/radio buttons nicely */
1344  
1345  dd input {
1346      font-size: 1.00em;
1347      max-width: 100%;
1348      margin: 2px 0;
1349  }
1350  
1351  dd select {
1352      font-size: 100%;
1353      font-size: 1em;
1354      width: auto;
1355      max-width: 100%;
1356      margin: 2px 0;
1357  }
1358  
1359  dd textarea {
1360      font-size: 0.90em;
1361      width: 90%;
1362  }
1363  
1364  fieldset dl {
1365      margin-bottom: 10px;
1366      font-size: 0.85em;
1367  }
1368  
1369  fieldset dt {
1370      width: 45%;
1371      text-align: left;
1372      border: none;
1373      border-right: 1px solid #CCCCCC;
1374      padding-top: 3px;
1375  }
1376  
1377  .rtl fieldset dt {
1378      text-align: right;
1379      border: none;
1380      border-left: 1px solid #CCCCCC;
1381  }
1382  
1383  fieldset #color_palette_placeholder {
1384      padding-top: 0;
1385  }
1386  
1387  fieldset dd {
1388      margin: 0 0 0 45%;
1389      padding: 0 0 0 5px;
1390      border: none;
1391      border-left: 1px solid #CCCCCC;
1392      vertical-align: top;
1393      font-size: 1.00em;
1394  }
1395  
1396  .rtl fieldset dd {
1397      margin: 0 45% 0 0;
1398      padding: 0 5px 0 0;
1399      border: none;
1400      border-right: 1px solid #CCCCCC;
1401  }
1402  
1403  dd.full, .rtl dd.full {
1404      margin: 0;
1405      border: 0;
1406      padding: 0;
1407      padding-top: 3px;
1408      text-align: center;
1409      width: 95%;
1410  }
1411  
1412  /* Hover highlights for form rows */
1413  fieldset dl:hover dt, fieldset dl:hover dd {
1414      border-color: #666666;
1415  }
1416  
1417  fieldset dl:hover dt label {
1418      color: #000000;
1419  }
1420  
1421  fieldset dl dd label:hover {
1422      color: #BC2A4D;
1423  }
1424  
1425  input:focus, textarea:focus {
1426      border: 1px solid #BC2A4D;
1427      background-color: #E9E9E2;
1428      color: #BC2A4D;
1429      outline-style: none;
1430  }
1431  
1432  @media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
1433  {
1434      fieldset dl {
1435          margin-bottom: 5px;
1436          padding-bottom: 5px;
1437          border-bottom: 1px solid #e8e8e8;
1438      }
1439  
1440      fieldset > dl:last-child, fieldset > form:last-child > dl:last-child {
1441          border-bottom-width: 0;
1442          margin-bottom: 0;
1443      }
1444  
1445      fieldset dt, .rtl fieldset dt, fieldset dd, .rtl fieldset dd {
1446          border-width: 0;
1447          margin-left: 0;
1448          margin-right: 0;
1449          float: none;
1450          width: auto;
1451      }
1452  
1453      fieldset .responsive-columns dt {
1454          float: left;
1455      }
1456  
1457      .ltr fieldset dd {
1458          padding-left: 20px;
1459      }
1460  
1461      .rtl fieldset dd {
1462          padding-right: 20px;
1463      }
1464  
1465      select, dd select, dd input {
1466          max-width: 300px;
1467      }
1468  
1469      input[type="number"], dd input[type="number"] {
1470          max-width: 70px;
1471      }
1472  }
1473  
1474  @media only screen and (max-width: 400px), only screen and (max-device-width: 400px)
1475  {
1476      select, dd select, dd input {
1477          max-width: 240px;
1478      }
1479  }
1480  
1481  /* Submit button fieldset or paragraph
1482  ---------------------------------------- */
1483  fieldset.submit-buttons {
1484      text-align: center;
1485      border: none;
1486      background-color: transparent;
1487      margin: 0;
1488      padding: 4px;
1489      margin-top: -1px;
1490  }
1491  
1492  p.submit-buttons {
1493      text-align: center;
1494      margin: 0;
1495      padding: 4px;
1496      margin-top: 10px;
1497  }
1498  
1499  fieldset.submit-buttons input, p.submit-buttons input {
1500      padding: 3px 2px;
1501  }
1502  
1503  fieldset.submit-buttons legend {
1504      display: none;
1505  }
1506  
1507  @media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
1508  {
1509      p.submit-buttons {
1510          margin-top: 0;
1511      }
1512  }
1513  
1514  /* Input field styles
1515  ---------------------------------------- */
1516  
1517  input.radio, input.checkbox, input.permissions-checkbox {
1518      width: auto !important;
1519      background-color: transparent;
1520      border: none;
1521      cursor: pointer;
1522  }
1523  
1524  input.full,
1525  textarea.full {
1526      width: 99%;
1527  }
1528  
1529  input.medium { width: 50%;}
1530  input.narrow { width: 25%;}
1531  input.tiny { width: 10%;}
1532  input.autowidth { width: auto !important;}
1533  .box2 .inputbox { background-color: #E9E9E9;}
1534  
1535  /* Form button styles
1536  ---------------------------------------- */
1537  a.button1, input.button1,
1538  a.button2, input.button2 {
1539      width: auto !important;
1540      padding: 1px 3px 0 3px;
1541      font-family: "Lucida Grande", Verdana, Helvetica, Arial, sans-serif;
1542      color: #000;
1543      font-size: 0.85em;
1544      background: #EFEFEF url("../images/bg_button.gif") repeat-x top;
1545      cursor: pointer;
1546  }
1547  
1548  a.button1, input.button1 {
1549      font-weight: bold;
1550      border: 1px solid #666666;
1551  }
1552  
1553  /* Alternative button */
1554  a.button2, input.button2 {
1555      border: 1px solid #666666;
1556  }
1557  
1558  /* <a> button in the style of the form buttons */
1559  a.button1, a.button1:link, a.button1:visited, a.button1:active,
1560  a.button2, a.button2:link, a.button2:visited, a.button2:active {
1561      text-decoration: none;
1562      color: #000000;
1563      padding: 4px 8px;
1564  }
1565  
1566  /* Hover states */
1567  a.button1:hover, input.button1:hover,
1568  a.button2:hover, input.button2:hover {
1569      border: 1px solid #BC2A4D;
1570      background: #EFEFEF url("../images/bg_button.gif") repeat bottom;
1571      color: #BC2A4D;
1572  }
1573  
1574  input.disabled {
1575      font-weight: normal;
1576      color: #666666;
1577  }
1578  
1579  /* Focus states */
1580  input.button1:focus, input.button2:focus {
1581      outline-style: none;
1582  }
1583  
1584  /* jQuery popups
1585  ---------------------------------------- */
1586  .phpbb_alert {
1587      background-color: #FFFFFF;
1588      border: 1px solid #999999;
1589      position: fixed;
1590      display: none;
1591      top: 150px;
1592      left: 0;
1593      right: 0;
1594      width: 620px;
1595      margin: 0 auto;
1596      z-index: 50;
1597      padding: 25px;
1598      padding: 0 25px 20px 25px;
1599  }
1600  
1601  .phpbb_alert .alert_close {
1602      display: block;
1603      float: right;
1604      width: 16px;
1605      height: 16px;
1606      overflow: hidden;
1607      text-decoration: none !important;
1608      background: transparent url("../images/alert_close.png") 0 0 no-repeat;
1609      margin-top: -7px;
1610      margin-right: -31px;
1611  }
1612  .phpbb_alert .alert_close:hover {
1613      background-position: 0 -16px;
1614  }
1615  
1616  
1617  .phpbb_alert p {
1618      margin: 8px 0;
1619      padding-bottom: 8px;
1620  }
1621  
1622  .phpbb_alert label {
1623      display: block;
1624      margin: 8px 0;
1625      padding-bottom: 8px;
1626  }
1627  
1628  .phpbb_alert div.alert_text > p,
1629  .phpbb_alert div.alert_text > label,
1630  .phpbb_alert div.alert_text > select,
1631  .phpbb_alert div.alert_text > textarea,
1632  .phpbb_alert div.alert_text > input {
1633      font-size: 0.9em;
1634  }
1635  
1636  #darkenwrapper {
1637      display: none;
1638      position: relative;
1639      z-index: 44;
1640  }
1641  
1642  #darken {
1643      position: fixed;
1644      left: 0;
1645      top: 0;
1646      width: 100%;
1647      height: 100%;
1648      background-color: #000000;
1649      opacity: 0.5;
1650      z-index: 45;
1651  }
1652  
1653  @media only screen and (max-height: 500px), only screen and (max-device-width: 500px)
1654  {
1655      .phpbb_alert {
1656          top: 25px;
1657      }
1658  }
1659  
1660  @media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
1661  {
1662      .phpbb_alert {
1663          width: auto;
1664          margin: 0 25px;
1665      }
1666  }
1667  
1668  #loading_indicator {
1669      background: #000000 url("../images/loading.gif") center center no-repeat;
1670      border-radius: 5px;
1671      display: none;
1672      opacity: 0.8;
1673      margin-top: -50px;
1674      margin-left: -50px;
1675      height: 50px;
1676      width: 50px;
1677      position: fixed;
1678      left: 50%;
1679      top: 50%;
1680      z-index: 51;
1681  }
1682  
1683  /* Pagination
1684  ---------------------------------------- */
1685  .pagination {
1686      font-size: .85em;
1687      height: 1%; /* IE tweak (holly hack) */
1688      width: auto;
1689      text-align: right;
1690      margin: 5px 0;
1691  }
1692  
1693  .top-pagination {
1694      float: right;
1695      margin: 15px 0 5px 0;
1696  }
1697  
1698  .rtl .pagination {
1699      text-align: left;
1700      float: left;
1701  }
1702  
1703  li.pagination {
1704      margin-top: 0;
1705  }
1706  
1707  .pagination img {
1708      vertical-align: middle;
1709  }
1710  
1711  .pagination ul {
1712      display: inline-block;
1713      *display: inline; /* IE7 inline-block hack */
1714      *zoom: 1;
1715      margin-left: 0;
1716      margin-bottom: 0;
1717  }
1718  
1719  li.pagination ul {
1720      margin-top: -2px;
1721      vertical-align: middle;
1722  }
1723  
1724  .pagination ul li, dl .pagination ul li, dl.icon .pagination ul li {
1725      display: inline;
1726      padding: 0;
1727      font-size: 100%;
1728      line-height: normal;
1729  }
1730  
1731  .pagination li a, .pagnation li span, li .pagination li a, li .pagnation li span, .pagination li.active span, .pagination li.ellipsis span {
1732      font-weight: normal;
1733      text-decoration: none;
1734      padding: 0 2px;
1735      border: 1px solid transparent;
1736      font-size: 0.9em;
1737      line-height: 1.5em;
1738  }
1739  
1740  .pagination li a, .pagination li a:link, .pagination li a:visited {
1741      color: #5C758C;
1742      background-color: #ECEDEE;
1743      border-color: #B4BAC0;
1744  }
1745  
1746  .pagination li.ellipsis  span {
1747      background-color: transparent;
1748      color: #000000;
1749  }
1750  
1751  .pagination li.active span {
1752      color: #FFFFFF;
1753      background-color: #4692BF;
1754      border-color: #4692BF;
1755  }
1756  
1757  .pagination li a:hover, .pagination .active a:hover {
1758      color: #FFFFFF;
1759      background-color: #368AD2;
1760      border-color: #368AD2;
1761  }
1762  
1763  .pagination li a:active, .pagination li.active a:active {
1764      color: #5C758C;
1765      background-color: #ECEDEE;
1766      border-color: #B4BAC0;
1767  }
1768  
1769  @media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
1770  {
1771      .pagination, .rtl .pagination {
1772          float: none;
1773          text-align: center;
1774          margin: 5px 0;
1775      }
1776  
1777      .pagination li a, .pagination li span {
1778          display: inline-block;
1779          min-width: 10px;
1780      }
1781  }
1782  
1783  /* Action Highlighting
1784  ---------------------------------------- */
1785  .successbox, .errorbox {
1786      padding: 8px;
1787      margin: 10px 0;
1788      color: #FFFFFF;
1789      text-align: center;
1790      clear: both;
1791  }
1792  
1793  .success {
1794      color: #228822;
1795  }
1796  
1797  .error {
1798      color: #BC2A4D;
1799  }
1800  
1801  .successbox {
1802      background-color: #228822;
1803  }
1804  
1805  .errorbox {
1806      background-color: #BC2A4D;
1807  }
1808  
1809  .successbox h3, .errorbox h3 {
1810      color: #FFFFFF;
1811      margin: 0 0 0.5em;
1812      font-size: 1.10em;
1813      font-family: "Lucida Grande",Verdana,Helvetica,Arial,sans-serif;
1814  }
1815  
1816  .successbox p, .errorbox p {
1817      color: #FFFFFF;
1818      font-size: 0.85em;
1819      margin-bottom: 0;
1820  }
1821  
1822  .errorbox a:link, .errorbox a:active, .errorbox a:visited,
1823  .successbox a:link, .successbox a:active, .successbox a:visited {
1824      color: #DBD7D1;
1825      text-decoration: underline;
1826      font-weight: bold;
1827  }
1828  
1829  .errorbox a:hover, .successbox a:hover {
1830      color: #FFFFFF;
1831      text-decoration: none;
1832      font-weight: bold;
1833  }
1834  
1835  .notice {
1836      background-color: #62A5CC;
1837  }
1838  
1839  /* Special cases for the error page */
1840  #errorpage #page-header a {
1841      font-weight: bold;
1842      line-height: 6em;
1843  }
1844  
1845  #errorpage #content {
1846      padding-top: 10px;
1847  }
1848  
1849  #errorpage #content h1 {
1850      color: #DF075C;
1851  }
1852  
1853  #errorpage #content h2 {
1854      margin-top: 20px;
1855      margin-bottom: 5px;
1856      border-bottom: 1px solid #CCCCCC;
1857      padding-bottom: 5px;
1858      color: #333333;
1859  }
1860  
1861  /* Tooltip for permission roles */
1862  .tooltip {
1863      width: 200px;
1864      color: #000;
1865      text-align: center;
1866      border: 1px solid #AAA;
1867  }
1868  
1869  .tooltip span.top {
1870      background: #EFEFEF;
1871      font-weight: bold;
1872      padding: 2px;
1873  }
1874  
1875  .tooltip span.bottom {
1876      padding: 5px;
1877      color: #000000;
1878      background: #FFFFFF;
1879  }
1880  
1881  /*
1882   Format Buttons for signature editor
1883  */
1884  #format-buttons {
1885      margin: 15px 0 2px 0;
1886  }
1887  
1888  #format-buttons input, #format-buttons select {
1889      vertical-align: middle;
1890  }
1891  
1892  .row, fieldset dl {
1893      overflow: hidden;
1894  }
1895  
1896  /* Syntax Highlighting
1897  ---------------------------------------- */
1898  .sourcenum {
1899      color: gray;
1900      font-family: Monaco, 'Courier New', monospace;
1901      font-size: 1.25em;
1902      font-weight: bold;
1903      line-height: 1.20em;
1904      text-align: right;
1905      padding: 0;
1906  }
1907  
1908  .rtl .sourcenum {
1909      text-align: left;
1910  }
1911  
1912  .source {
1913      font-family: Monaco, 'Courier New', monospace;
1914      font-size: 1.25em;
1915      line-height: 1.20em;
1916      padding: 0;
1917  }
1918  
1919  .syntaxbg {
1920      color: #FFFFFF;
1921  }
1922  
1923  .syntaxcomment {
1924      color: #FF8000;
1925  }
1926  
1927  .syntaxdefault {
1928      color: #0000BB;
1929  }
1930  
1931  .syntaxhtml {
1932      color: #000000;
1933  }
1934  
1935  .syntaxkeyword {
1936      color: #007700;
1937  }
1938  
1939  .syntaxstring {
1940      color: #DD0000;
1941  }
1942  
1943  /* Permission interface
1944  ---------------------------------------- */
1945  
1946  .column1, .column2 {
1947      width: 48%;
1948      float: left;
1949  }
1950  
1951  .ltr .column2, .rtl .column1 {
1952      float: right;
1953  }
1954  
1955  fieldset.permissions legend {
1956      text-transform: none;
1957  }
1958  
1959  fieldset.permissions legend input{
1960      height: 1.1em;
1961  }
1962  
1963  /* Permission sections */
1964  fieldset.permissions .permissions-simple {
1965      text-align: left;
1966      padding-top: 3px;
1967  }
1968  
1969  .rtl fieldset.permissions .permissions-simple {
1970      text-align: right;
1971  }
1972  
1973  fieldset.permissions .permissions-advanced {
1974      padding: 10px 0 0 5px;
1975      vertical-align: top;
1976      clear: right;
1977  }
1978  
1979  .rtl fieldset.permissions .permissions-advanced {
1980      padding: 10px 5px 0 0;
1981      clear: left;
1982  }
1983  
1984  fieldset.permissions .permissions-switch {
1985      float: right;
1986  }
1987  
1988  .rtl fieldset.permissions .permissions-switch {
1989      float: left;
1990  }
1991  
1992  fieldset.permissions .padding {
1993  }
1994  
1995  .permissions-switch {
1996      margin-top: -6px;
1997      font-size: .9em;
1998  }
1999  
2000  .permissions-switch a {
2001      text-decoration: underline;
2002  }
2003  
2004  .permissions-reset {
2005      padding-bottom: 10px;
2006  }
2007  
2008  .permissions-reset a {
2009      font-size: .85em;
2010  }
2011  
2012  /* Tabbed menu */
2013  .permissions-category {
2014      line-height: normal;
2015      margin: 0 0 -1px 7px;
2016      min-width: 570px;
2017      font-size: 0.85em;
2018  }
2019  
2020  .rtl .permissions-category {
2021      margin: 0 7px -1px 0;
2022  }
2023  
2024  .permissions-category ul {
2025      margin: 0;
2026      padding: 0;
2027      list-style: none;
2028  }
2029  
2030  .permissions-category li {
2031      display: inline;
2032      margin: 0;
2033      padding: 0;
2034      font-size: 1em;
2035      font-weight: bold;
2036  }
2037  
2038  .permissions-category a {
2039      float: left;
2040      background: url("../images/bg_tabs_alt1.gif") no-repeat 0% -35px;
2041      margin: 0 1px 0 0;
2042      padding: 0 0 0 6px;
2043      text-decoration: none;
2044      position: relative;
2045  }
2046  
2047  .rtl .permissions-category a {
2048      float: right;
2049  }
2050  
2051  .permissions-category a span.tabbg {
2052      float: left;
2053      display: block;
2054      background: url("../images/bg_tabs_alt2.gif") no-repeat 100% -35px;
2055      padding: 7px 12px 6px 6px;
2056      color: #536482;
2057      white-space: nowrap;
2058  }
2059  
2060  .rtl .permissions-category a span.tabbg {
2061      float: right;
2062  }
2063  
2064  /* Commented Backslash Hack hides rule from IE5-Mac \*/
2065  .permissions-category a span.tabbg, .rtl .permissions-category a span.tabbg { float: none;}
2066  /* End hack */
2067  
2068  .permissions-category a:hover span.tabbg {
2069      color: #DD6900;
2070  }
2071  
2072  .permissions-category .activetab a {
2073      background-position: 0 0;
2074  }
2075  
2076  .permissions-category .activetab a span.tabbg {
2077      background-position: 100% 0;
2078      padding-bottom: 7px;
2079      color: #333333;
2080  }
2081  
2082  .permissions-category a:hover {
2083      background-position: 0 -70px;
2084  }
2085  
2086  .permissions-category a:hover span.tabbg {
2087      background-position: 100% -70px;
2088  }
2089  
2090  .permissions-category .activetab a:hover span.tabbg {
2091      color: #333333;
2092      background-position: 100% 0;
2093  }
2094  
2095  .permissions-category .activetab a:hover {
2096      background-position: 0 0;
2097  }
2098  
2099  .permissions-category a span.colour {
2100      border: 1px solid #536482;
2101      display: block;
2102      float: left;
2103      width: 10px;
2104      height: 10px;
2105      margin: 0 5px 0 0;
2106  }
2107  
2108  /* Most browsers will have to live with a left aligned icon in RTL mode, as (currently) only Firefox 3.0 Alpha 3 renders it correctly without destroying it
2109  .rtl .permissions-category a span.colour {
2110      float: right;
2111      margin: 0 0 0 5px;
2112  }
2113  */
2114  
2115  .permissions-category .activetab span.colour {
2116      border-color: #333333;
2117  }
2118  
2119  .permissions-category a:hover span.colour {
2120      border-color: #DD6900;
2121  }
2122  
2123  .permissions-category .activetab a:hover span.colour {
2124      border-color: #333333;
2125  }
2126  
2127  /* Permission preset colours */
2128  .permissions-preset-yes span.colour,
2129  .yes {
2130      background-color: #86F786;
2131  }
2132  
2133  .permissions-preset-custom span.colour {
2134      background-color: #B2BBDD;
2135  }
2136  
2137  .permissions-preset-never span.colour {
2138      background-color: #DD0000;
2139  }
2140  
2141  .permissions-preset-no span.colour,
2142  .never {
2143      background-color: #EFB0B2;
2144  }
2145  
2146  /* Permission panel
2147  ---------------------------------------- */
2148  .permissions-panel {
2149      float: left;
2150      background-color: #CADCEB;
2151      width: 100%;
2152      border-radius: 5px;
2153      overflow: hidden;
2154      padding: 5px 0;
2155  }
2156  
2157  .rtl .permissions-panel {
2158      float: right;
2159  }
2160  
2161  /* Permission table
2162  ---------------------------------------- */
2163  .permissions-panel .tablewrap {
2164      margin: 0 10px;
2165  }
2166  
2167  .permissions-panel table {
2168      width: 100%;
2169  }
2170  
2171  .permissions-panel th {
2172      text-transform: none;
2173  }
2174  
2175  .permissions-panel th.value {
2176      text-align: center;
2177  }
2178  
2179  .permissions-panel th.name {
2180      text-align: left;
2181      width: auto;
2182      text-transform: none;
2183  }
2184  
2185  .rtl .permissions-panel th.name {
2186      text-align: right;
2187  }
2188  
2189  .permissions-panel th.permissions-name {
2190      border: none;
2191      color: #536482;
2192      font-weight: normal;
2193  }
2194  
2195  .permissions-panel th.permissions-name a.trace {
2196      display: inline;
2197  }
2198  
2199  .permissions-panel th.row3 {
2200      background-image: none;
2201      background-color: #D1D7DC;
2202      color: #536482;
2203      border: none;
2204  }
2205  
2206  .permissions-panel th.row4 {
2207      background-image: none;
2208      background-color: #E4E8EB;
2209      color: #536482;
2210      border: none;
2211  }
2212  
2213  .permissions-panel th a:link, .permissions-panel th a:hover, .permissions-panel th a:visited {
2214      display: block;
2215      color: #FFFFFF;
2216      text-decoration: underline;
2217  }
2218  
2219  .permissions-panel td.permissions-yes label:hover {
2220      background-color: #86F786;
2221  }
2222  
2223  .permissions-panel td.permissions-no label:hover {
2224      background-color: #EFB0B2;
2225  }
2226  
2227  .permissions-panel td.permissions-never label:hover {
2228      background-color: #DD0000;
2229  }
2230  
2231  .permissions-panel td {
2232      padding: 0;
2233      text-align: center;
2234      width: 10%;
2235  }
2236  
2237  .permissions-panel td label {
2238      display: block;
2239      margin: 0;
2240      padding: 0;
2241  }
2242  
2243  @media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
2244  {
2245      .column1, .column2 {
2246          float: none !important;
2247          width: auto;
2248      }
2249  
2250      .permissions-simple {
2251          clear: both;
2252      }
2253  
2254      .permissions-simple td, .permissions-simple dd {
2255          width: auto !important;
2256          margin-left: 0 !important;
2257          margin-right: 0 !important;
2258      }
2259  
2260      .permissions-simple dd {
2261          margin-top: 5px;
2262      }
2263  
2264      .permissions-panel .tablewrap {
2265          margin: 0 5px;
2266      }
2267  
2268      .permissions-category {
2269          min-width: 0;
2270          margin: 0 !important;
2271      }
2272  
2273      .permissions-category a, .permissions-category a span.tabbg {
2274          display: block;
2275          float: none !important;
2276          background: transparent none;
2277      }
2278  
2279      .permissions-category a {
2280          background: #d9e5ee;
2281          margin: 5px 0;
2282          padding: 0 !important;
2283          border-radius: 3px;
2284          text-decoration: underline;
2285      }
2286  
2287      .permissions-category .activetab a {
2288          background-color: #dd6900;
2289          color: #fff;
2290      }
2291  
2292      .permissions-category a span.tabbg {
2293          color: inherit !important;
2294          padding-top: 6px !important;
2295          padding-bottom: 6px !important;
2296      }
2297  
2298      .permissions-category .activetab span.colour {
2299          border-color: #fff;
2300      }
2301  }
2302  
2303  /* Avatars gallery
2304  ---------------------------------------- */
2305  #gallery {
2306      display: block;
2307      margin: 0 -5px;
2308      padding: 0;
2309      overflow: hidden;
2310  }
2311  
2312  #gallery li {
2313      display: block;
2314      float: left;
2315      border: 1px solid #ccc;
2316      border-radius: 2px;
2317      background: #fff;
2318      padding: 5px;
2319      margin: 5px;
2320  }
2321  
2322  #gallery li:hover {
2323      background-color: #eee;
2324  }
2325  
2326  #gallery li label {
2327      display: block;
2328      text-align: center;
2329      padding: 0;
2330  }
2331  
2332  /* Dropdown menu
2333  ----------------------------------------*/
2334  .dropdown {
2335      position: absolute;
2336      left: 0;
2337      top: 22px;
2338      z-index: 2;
2339      border: 1px solid transparent;
2340      border-radius: 5px;
2341      padding: 9px 0 0;
2342  }
2343  
2344  .dropdown-up .dropdown {
2345      top: auto;
2346      bottom: 18px;
2347      padding: 0 0 9px;
2348  }
2349  
2350  .dropdown-left .dropdown {
2351      left: auto;
2352      right: 0;
2353  }
2354  
2355  .dropdown .pointer, .dropdown .pointer-inner {
2356      position: absolute;
2357      width: 0;
2358      height: 0;
2359      border-top-width: 0;
2360      border-bottom: 10px solid transparent;
2361      border-left: 10px dashed transparent;
2362      border-right: 10px dashed transparent;
2363      -webkit-transform: rotate(360deg); /* better anti-aliasing in webkit */
2364      display: block;
2365  }
2366  
2367  .dropdown-up .pointer, .dropdown-up .pointer-inner {
2368      border-bottom-width: 0;
2369      border-top: 10px solid transparent;
2370  }
2371  
2372  .dropdown .pointer {
2373      right: auto;
2374      left: 10px;
2375      top: 0;
2376      z-index: 3;
2377  }
2378  
2379  .dropdown-up .pointer {
2380      bottom: 0;
2381      top: auto;
2382  }
2383  
2384  .dropdown-left .dropdown .pointer {
2385      left: auto;
2386      right: 10px;
2387  }
2388  
2389  .dropdown .pointer-inner {
2390      top: auto;
2391      bottom: -11px;
2392      left: -10px;
2393  }
2394  
2395  .dropdown-up .pointer-inner {
2396      bottom: auto;
2397      top: -11px;
2398  }
2399  
2400  .dropdown .pointer {
2401      border-color: #B9B9B9 transparent;
2402  }
2403  
2404  .dropdown .pointer-inner {
2405      border-color: #FFF transparent;
2406  }
2407  
2408  .dropdown .dropdown-contents {
2409      z-index: 2;
2410      overflow: hidden;
2411      overflow-y: auto;
2412      background: #fff;
2413      border: 1px solid #b9b9b9;
2414      border-radius: 5px;
2415      padding: 5px;
2416      position: relative;
2417      min-width: 40px;
2418      max-height: 200px;
2419      box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.2);
2420      -webkit-box-sizing: border-box;
2421      -moz-box-sizing: border-box;
2422      box-sizing: border-box;
2423  }
2424  
2425  .dropdown-up .dropdown-contents {
2426      box-shadow: 1px 0 5px rgba(0, 0, 0, 0.2);
2427  }
2428  
2429  .dropdown li {
2430      float: none;
2431      margin: 0;
2432      white-space: nowrap;
2433      text-align: left;
2434  }
2435  
2436  .wrap .dropdown li, .dropdown.wrap li {
2437      white-space: normal;
2438  }
2439  
2440  .dropdown li:before, .dropdown li:after {
2441      display: none !important;
2442  }
2443  
2444  
2445  /* Classes for additional tasks
2446  ---------------------------------------- */
2447  
2448  .phpinfo {
2449      overflow: auto;
2450      width: 99%;
2451      direction: ltr;
2452  }
2453  
2454  .phpinfo td, .phpinfo th, .phpinfo h2, .phpinfo h1 {
2455      text-align: left;
2456  }
2457  
2458  .requirements_not_met {
2459      padding: 5px;
2460      background-color: #BC2A4D;
2461  }
2462  
2463  .requirements_not_met dt label, .requirements_not_met dd p {
2464      color: #FFFFFF;
2465      font-size: 1.4em;
2466  }
2467  
2468  @media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
2469  {
2470      .responsive-hide { display: none !important; }
2471      .responsive-show { display: block !important; }
2472      .responsive-show-inline { display: inline !important; }
2473      .responsive-show-inline-block { display: inline-block !important; }
2474  }
2475  
2476  .clearfix {
2477      overflow: hidden;
2478  }
2479  
2480  .pagination:after,
2481  #page-header:after,
2482  #page-body:after,
2483  #tabs:after,
2484  #tabs > ul:after,
2485  #tabs li:after,
2486  #acp:after,
2487  #content:after {
2488      content: '';
2489      clear: both;
2490      display: block;
2491  }