[Summary view] [Print] [Text view]

   1  /*  phpBB 3.2 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  }
 529  
 530  .rtl #menu {
 531      float: right;
 532      border: none;
 533      border-left: 1px solid #CCCFD3;
 534  }
 535  
 536  #menu p {
 537      font-size: 0.85em;
 538  }
 539  
 540  #menu ul {
 541      list-style: none;
 542      margin: 0;
 543      padding: 0;
 544      word-wrap: normal;
 545  }
 546  
 547  /* Default list state */
 548  #menu li, #menu .header {
 549      padding: 0;
 550      margin: 0;
 551      font-size: 0.85em;
 552      font-weight: bold;
 553      display: block;
 554  }
 555  
 556  /* Link styles for the sub-section links */
 557  #menu li span {
 558      display: block;
 559      padding: 3px 3px 3px 8px;
 560      margin: 1px 0;
 561      text-decoration: none;
 562      font-weight: normal;
 563      color: #138ECB;
 564  }
 565  
 566  .rtl #menu li span {
 567      padding: 3px 8px 3px 3px;
 568  }
 569  
 570  #menu li a:hover, #menu li a:hover span {
 571      text-decoration: none;
 572      background-color: #FFFFFF;
 573      color: #BC2A4D;
 574  }
 575  
 576  #menu li a:active, #menu li a:active span {
 577      color: #F632A0;
 578  }
 579  
 580  #menu li#activemenu a span {
 581      text-decoration: none;
 582      font-weight: bold;
 583      color: #1180B7;
 584      background: transparent url("../images/arrow_right.gif") 0% 50% no-repeat;
 585  }
 586  
 587  .rtl #menu li#activemenu a span {
 588      background: transparent url("../images/arrow_left.gif") 100% 50% no-repeat;
 589  }
 590  
 591  #menu li#activemenu a:hover span, #menu li#activemenu span {
 592      text-decoration: none;
 593      font-weight: bold;
 594      color: #BC2A4D;
 595      background: #FFFFFF url("../images/arrow_right.gif") 1% 50% no-repeat;
 596  }
 597  
 598  .rtl #menu li#activemenu a:hover span, .rtl #menu li#activemenu span {
 599      background: #FFFFFF url("../images/arrow_left.gif") 99% 50% no-repeat;
 600  }
 601  
 602  #menu li a:active, #menu li a:active span, #menu li#activemenu a:active span {
 603      color: #F632A0;
 604  }
 605  
 606  #menu li span.completed {
 607      text-decoration: none;
 608      padding: 3px 3px 3px 12px;
 609      background: url("../images/arrow_down.gif") 1% 50% no-repeat;
 610  }
 611  
 612  .rtl #menu li span.completed {
 613      text-decoration: none;
 614      padding: 3px 12px 3px 3px;
 615      background: url("../images/arrow_down.gif") 99% 50% no-repeat;
 616  }
 617  
 618  #menu .header {
 619      font-family: Tahoma, Helvetica, sans-serif;
 620      display: block;
 621      font-weight: bold;
 622      color: #115098;
 623      border-bottom: 1px solid #327AA5;
 624      padding: 4px 0 2px;
 625      margin-top: 15px;
 626      text-transform: uppercase;
 627      font-size: 0.75em;
 628      text-decoration: none;
 629      cursor: inherit;
 630      outline-style: none;
 631  }
 632  
 633  @media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
 634  {
 635      #menu, .rtl #menu {
 636          float: none;
 637          width: auto;
 638          border-width: 0;
 639          max-width: 200px;
 640          margin: 0 auto 10px;
 641      }
 642  
 643      #menu p {
 644          text-align: center;
 645      }
 646  
 647      #menu .menu-block.active {
 648          margin: 0 -5px;
 649          padding: 0 5px 3px;
 650          background: rgba(255, 255, 255, .5);
 651          border-radius: 5px;
 652      }
 653  
 654      #menu .menu-block.no-header.active {
 655          padding-top: 3px;
 656      }
 657  
 658      #menu .menu-block .header {
 659          margin-top: 5px;
 660          cursor: pointer;
 661          border-bottom-width: 0;
 662          position: relative;
 663          text-decoration: underline;
 664      }
 665  
 666      #menu .menu-block .header:focus, #menu .menu-block.active .header {
 667          color: #D31141;
 668          text-decoration: none;
 669      }
 670  
 671      #menu .menu-block ul {
 672          display: none;
 673      }
 674  
 675      .nojs #menu .menu-block:hover ul, #menu .menu-block.active ul, #menu .menu-block.no-header ul {
 676          display: block;
 677      }
 678  
 679      #menu .menu-block li:last-child {
 680          border-bottom: 1px solid #327AA5;
 681      }
 682  
 683      #menu .menu-block:last-child li:last-child, #menu .menu-block.active li:last-child {
 684          border-bottom-width: 0;
 685      }
 686  
 687      #menu .menu-block li a span {
 688          border-radius: 2px;
 689      }
 690  }
 691  
 692  
 693  /* Table styles
 694  ---------------------------------------- */
 695  
 696  table {
 697      width: 100%;
 698      border: 1px solid #CCCFD3;
 699      background-color: #FFFFFF;
 700      padding: 1px;
 701  }
 702  
 703  th {
 704      padding: 3px 4px;
 705      color: #FFFFFF;
 706      background: #70AED3 url("../images/gradient2b.gif") bottom left repeat-x;
 707      border-top: 1px solid #6DACD2;
 708      border-bottom: 1px solid #327AA5;
 709      text-align: left;
 710      font-size: 0.75em;
 711      text-transform: uppercase;
 712  }
 713  
 714  td {
 715      text-align: left;
 716      font-size: 0.85em;
 717      padding: 4px;
 718      line-height: 1.20em;
 719  }
 720  
 721  .rtl th, .rtl td {
 722      text-align: right;
 723  }
 724  
 725  .table1 {
 726      border-collapse: separate;
 727      border-spacing: 1px;
 728      clear: both;
 729  }
 730  
 731  dt#color_palette_placeholder table {
 732      margin-right: 5px;
 733      width: 80px;
 734  }
 735  
 736  #color_palette_placeholder td {
 737      padding: 0;
 738  }
 739  
 740  table.type2 {
 741      border: none;
 742      background: none;
 743      padding: 0;
 744  }
 745  
 746  table.type2 th {
 747      background: none;
 748      border-top: none;
 749      text-align: center;
 750      color: #115098;
 751      padding: 2px 0;
 752  }
 753  
 754  table.type2 td {
 755      padding: 0;
 756      font-size: 1em;
 757  }
 758  
 759  table.type2 td.name {
 760      padding: 2px;
 761      vertical-align: middle;
 762  }
 763  
 764  table.type3  {
 765      float: right;
 766      width: 300px;
 767      border: none;
 768      background-color: transparent;
 769      padding: 0;
 770  }
 771  
 772  .rtl table.type3 {
 773      float: left;
 774  }
 775  
 776  table.type3 thead th {
 777      background-color: transparent;
 778      border-top: none;
 779      text-align: center;
 780      color: #115098;
 781      padding: 0 3px;
 782      font-size: 0.85em;
 783      font-weight: normal;
 784      text-transform: none;
 785  }
 786  
 787  table.type3 tbody th {
 788      border-top: none;
 789      text-align: left;
 790      text-transform: none;
 791      padding: 0;
 792      border: none;
 793      font-size: 0.90em;
 794      font-weight: normal;
 795      width: 100%;
 796  }
 797  
 798  .rtl table.type3 tbody th {
 799      text-align: right;
 800  }
 801  
 802  table.type3 td {
 803      text-align: center;
 804      padding: 1px;
 805  }
 806  
 807  th.name {
 808      text-align: left;
 809      width: auto;
 810  }
 811  
 812  .rtl th.name {
 813      text-align: right;
 814  }
 815  
 816  td.name {
 817      text-align: left;
 818      font-weight: bold;
 819  }
 820  
 821  .rtl td.name {
 822      text-align: right;
 823  }
 824  
 825  .entry {
 826      text-align: left;
 827      font-weight: normal;
 828  }
 829  
 830  .rtl .entry {
 831      text-align: right;
 832  }
 833  
 834  .row1 {
 835      background-color: #F9F9F9;
 836  }
 837  
 838  table.zebra-table tbody tr:nth-child(odd) {
 839      background-color: #F9F9F9;
 840  }
 841  
 842  .row2 {
 843      word-break: break-all;
 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, .warningbox {
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  .warningbox {
1810      background-color: #fca600;
1811  }
1812  
1813  .successbox h3, .errorbox h3 {
1814      color: #FFFFFF;
1815      margin: 0 0 0.5em;
1816      font-size: 1.10em;
1817      font-family: "Lucida Grande",Verdana,Helvetica,Arial,sans-serif;
1818  }
1819  
1820  .successbox p, .errorbox p {
1821      color: #FFFFFF;
1822      font-size: 0.85em;
1823      margin-bottom: 0;
1824  }
1825  
1826  .errorbox a:link, .errorbox a:active, .errorbox a:visited,
1827  .successbox a:link, .successbox a:active, .successbox a:visited {
1828      color: #DBD7D1;
1829      text-decoration: underline;
1830      font-weight: bold;
1831  }
1832  
1833  .errorbox a:hover, .successbox a:hover {
1834      color: #FFFFFF;
1835      text-decoration: none;
1836      font-weight: bold;
1837  }
1838  
1839  #log-container {
1840      display: none;
1841      max-height: 300px;
1842      padding: 8px;
1843      margin: 10px 0;
1844      clear: both;
1845      overflow-y: auto;
1846      background-color: #FFFFFF;
1847  }
1848  
1849  #log-container.show_log_container {
1850      display: block;
1851      border: 1px solid #DBD7D1;
1852  }
1853  
1854  .log {
1855      font-size: 0.8em;
1856  }
1857  
1858  .notice {
1859      background-color: #62A5CC;
1860  }
1861  
1862  .download-box {
1863      margin: 10px 0 10px 0;
1864  }
1865  
1866  /* Special cases for the error page */
1867  #errorpage #page-header a {
1868      font-weight: bold;
1869      line-height: 6em;
1870  }
1871  
1872  #errorpage #content {
1873      padding-top: 10px;
1874  }
1875  
1876  #errorpage #content h1 {
1877      color: #DF075C;
1878  }
1879  
1880  #errorpage #content h2 {
1881      margin-top: 20px;
1882      margin-bottom: 5px;
1883      border-bottom: 1px solid #CCCCCC;
1884      padding-bottom: 5px;
1885      color: #333333;
1886  }
1887  
1888  /* Tooltip for permission roles */
1889  .tooltip {
1890      width: 200px;
1891      color: #000;
1892      text-align: center;
1893      border: 1px solid #AAA;
1894  }
1895  
1896  .tooltip span.top {
1897      background: #EFEFEF;
1898      font-weight: bold;
1899      padding: 2px;
1900  }
1901  
1902  .tooltip span.bottom {
1903      padding: 5px;
1904      color: #000000;
1905      background: #FFFFFF;
1906  }
1907  
1908  /*
1909   Format Buttons for signature editor
1910  */
1911  #format-buttons {
1912      margin: 15px 0 2px 0;
1913  }
1914  
1915  #format-buttons input, #format-buttons select {
1916      vertical-align: middle;
1917  }
1918  
1919  .row, fieldset dl {
1920      overflow: hidden;
1921  }
1922  
1923  /* Syntax Highlighting
1924  ---------------------------------------- */
1925  .sourcenum {
1926      color: gray;
1927      font-family: Monaco, 'Courier New', monospace;
1928      font-size: 1.25em;
1929      font-weight: bold;
1930      line-height: 1.20em;
1931      text-align: right;
1932      padding: 0;
1933  }
1934  
1935  .rtl .sourcenum {
1936      text-align: left;
1937  }
1938  
1939  .source {
1940      font-family: Monaco, 'Courier New', monospace;
1941      font-size: 1.25em;
1942      line-height: 1.20em;
1943      padding: 0;
1944  }
1945  
1946  .syntaxbg {
1947      color: #FFFFFF;
1948  }
1949  
1950  .syntaxcomment {
1951      color: #FF8000;
1952  }
1953  
1954  .syntaxdefault {
1955      color: #0000BB;
1956  }
1957  
1958  .syntaxhtml {
1959      color: #000000;
1960  }
1961  
1962  .syntaxkeyword {
1963      color: #007700;
1964  }
1965  
1966  .syntaxstring {
1967      color: #DD0000;
1968  }
1969  
1970  /* Permission interface
1971  ---------------------------------------- */
1972  
1973  .column1, .column2 {
1974      width: 48%;
1975      float: left;
1976  }
1977  
1978  .ltr .column2, .rtl .column1 {
1979      float: right;
1980  }
1981  
1982  fieldset.permissions legend {
1983      text-transform: none;
1984  }
1985  
1986  fieldset.permissions legend input{
1987      height: 1.1em;
1988  }
1989  
1990  /* Permission sections */
1991  fieldset.permissions .permissions-simple {
1992      text-align: left;
1993      padding-top: 3px;
1994  }
1995  
1996  .rtl fieldset.permissions .permissions-simple {
1997      text-align: right;
1998  }
1999  
2000  fieldset.permissions .permissions-advanced {
2001      padding: 10px 0 0 5px;
2002      vertical-align: top;
2003      clear: right;
2004  }
2005  
2006  .rtl fieldset.permissions .permissions-advanced {
2007      padding: 10px 5px 0 0;
2008      clear: left;
2009  }
2010  
2011  fieldset.permissions .permissions-switch {
2012      float: right;
2013  }
2014  
2015  .rtl fieldset.permissions .permissions-switch {
2016      float: left;
2017  }
2018  
2019  fieldset.permissions .padding {
2020  }
2021  
2022  .permissions-switch {
2023      margin-top: -6px;
2024      font-size: .9em;
2025  }
2026  
2027  .permissions-switch a {
2028      text-decoration: underline;
2029  }
2030  
2031  .permissions-reset {
2032      padding-bottom: 10px;
2033  }
2034  
2035  .permissions-reset a {
2036      font-size: .85em;
2037  }
2038  
2039  /* Tabbed menu */
2040  .permissions-category {
2041      line-height: normal;
2042      margin: 0 0 -1px 7px;
2043      min-width: 570px;
2044      font-size: 0.85em;
2045  }
2046  
2047  .rtl .permissions-category {
2048      margin: 0 7px -1px 0;
2049  }
2050  
2051  .permissions-category ul {
2052      display: flex;
2053      flex-wrap: wrap;
2054      margin: 0;
2055      padding: 0;
2056      list-style: none;
2057  }
2058  
2059  .permissions-category li {
2060      display: inline;
2061      margin: 0;
2062      padding: 0;
2063      font-size: 1em;
2064      font-weight: bold;
2065  }
2066  
2067  .permissions-category a {
2068      float: left;
2069      background: url("../images/bg_tabs_alt1.gif") no-repeat 0% -35px;
2070      margin: 0 1px 0 0;
2071      padding: 0 0 0 6px;
2072      text-decoration: none;
2073      position: relative;
2074  }
2075  
2076  .rtl .permissions-category a {
2077      float: right;
2078  }
2079  
2080  .permissions-category a span.tabbg {
2081      float: left;
2082      display: block;
2083      background: url("../images/bg_tabs_alt2.gif") no-repeat 100% -35px;
2084      padding: 7px 12px 6px 6px;
2085      color: #536482;
2086      white-space: nowrap;
2087  }
2088  
2089  .rtl .permissions-category a span.tabbg {
2090      float: right;
2091  }
2092  
2093  /* Commented Backslash Hack hides rule from IE5-Mac \*/
2094  .permissions-category a span.tabbg, .rtl .permissions-category a span.tabbg { float: none;}
2095  /* End hack */
2096  
2097  .permissions-category a:hover span.tabbg {
2098      color: #DD6900;
2099  }
2100  
2101  .permissions-category .activetab a {
2102      background-position: 0 0;
2103  }
2104  
2105  .permissions-category .activetab a span.tabbg {
2106      background-position: 100% 0;
2107      color: #333333;
2108  }
2109  
2110  .permissions-category a:hover {
2111      background-position: 0 -70px;
2112  }
2113  
2114  .permissions-category a:hover span.tabbg {
2115      background-position: 100% -70px;
2116  }
2117  
2118  .permissions-category .activetab a:hover span.tabbg {
2119      color: #333333;
2120      background-position: 100% 0;
2121  }
2122  
2123  .permissions-category .activetab a:hover {
2124      background-position: 0 0;
2125  }
2126  
2127  .permissions-category a span.colour {
2128      border: 1px solid #536482;
2129      display: block;
2130      float: left;
2131      width: 10px;
2132      height: 10px;
2133      margin: 0 5px 0 0;
2134  }
2135  
2136  /* 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
2137  .rtl .permissions-category a span.colour {
2138      float: right;
2139      margin: 0 0 0 5px;
2140  }
2141  */
2142  
2143  .permissions-category .activetab span.colour {
2144      border-color: #333333;
2145  }
2146  
2147  .permissions-category a:hover span.colour {
2148      border-color: #DD6900;
2149  }
2150  
2151  .permissions-category .activetab a:hover span.colour {
2152      border-color: #333333;
2153  }
2154  
2155  /* Permission preset colours */
2156  .permissions-preset-yes span.colour,
2157  .yes {
2158      background-color: #86F786;
2159  }
2160  
2161  .permissions-preset-custom span.colour {
2162      background-color: #B2BBDD;
2163  }
2164  
2165  .permissions-preset-never span.colour {
2166      background-color: #DD0000;
2167  }
2168  
2169  .permissions-preset-no span.colour,
2170  .never {
2171      background-color: #EFB0B2;
2172  }
2173  
2174  /* Permission panel
2175  ---------------------------------------- */
2176  .permissions-panel {
2177      float: left;
2178      background-color: #CADCEB;
2179      width: 100%;
2180      border-radius: 5px;
2181      overflow: hidden;
2182      padding: 5px 0;
2183  }
2184  
2185  .rtl .permissions-panel {
2186      float: right;
2187  }
2188  
2189  /* Permission table
2190  ---------------------------------------- */
2191  .permissions-panel .tablewrap {
2192      margin: 0 10px;
2193  }
2194  
2195  .permissions-panel table {
2196      width: 100%;
2197  }
2198  
2199  .permissions-panel th {
2200      text-transform: none;
2201  }
2202  
2203  .permissions-panel th.value {
2204      text-align: center;
2205  }
2206  
2207  .permissions-panel th.name {
2208      text-align: left;
2209      width: auto;
2210      text-transform: none;
2211  }
2212  
2213  .rtl .permissions-panel th.name {
2214      text-align: right;
2215  }
2216  
2217  .permissions-panel th.permissions-name {
2218      border: none;
2219      color: #536482;
2220      font-weight: normal;
2221  }
2222  
2223  .permissions-panel th.permissions-name a.trace {
2224      display: inline;
2225  }
2226  
2227  .permissions-panel th.row3 {
2228      background-image: none;
2229      background-color: #D1D7DC;
2230      color: #536482;
2231      border: none;
2232  }
2233  
2234  .permissions-panel th.row4 {
2235      background-image: none;
2236      background-color: #E4E8EB;
2237      color: #536482;
2238      border: none;
2239  }
2240  
2241  .permissions-panel th a:link, .permissions-panel th a:hover, .permissions-panel th a:visited {
2242      display: block;
2243      color: #FFFFFF;
2244      text-decoration: underline;
2245  }
2246  
2247  .permissions-panel td.permissions-yes label:hover {
2248      background-color: #86F786;
2249  }
2250  
2251  .permissions-panel td.permissions-no label:hover {
2252      background-color: #EFB0B2;
2253  }
2254  
2255  .permissions-panel td.permissions-never label:hover {
2256      background-color: #DD0000;
2257  }
2258  
2259  .permissions-panel td {
2260      padding: 0;
2261      text-align: center;
2262      width: 10%;
2263  }
2264  
2265  .permissions-panel td label {
2266      display: block;
2267      margin: 0;
2268      padding: 0;
2269  }
2270  
2271  @media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
2272  {
2273      .column1, .column2 {
2274          float: none !important;
2275          width: auto;
2276      }
2277  
2278      .permissions-simple {
2279          clear: both;
2280      }
2281  
2282      .permissions-simple td, .permissions-simple dd {
2283          width: auto !important;
2284          margin-left: 0 !important;
2285          margin-right: 0 !important;
2286      }
2287  
2288      .permissions-simple dd {
2289          margin-top: 5px;
2290      }
2291  
2292      .permissions-panel .tablewrap {
2293          margin: 0 5px;
2294      }
2295  
2296      .permissions-category {
2297          min-width: 0;
2298          margin: 0 !important;
2299      }
2300  
2301      .permissions-category ul {
2302          display: block;
2303      }
2304  
2305      .permissions-category a, .permissions-category a span.tabbg {
2306          display: block;
2307          float: none !important;
2308          background: transparent none;
2309      }
2310  
2311      .permissions-category a {
2312          background: #d9e5ee;
2313          margin: 5px 0;
2314          padding: 0 !important;
2315          border-radius: 3px;
2316          text-decoration: underline;
2317      }
2318  
2319      .permissions-category .activetab a {
2320          background-color: #dd6900;
2321          color: #fff;
2322      }
2323  
2324      .permissions-category a span.tabbg {
2325          color: inherit !important;
2326          padding-top: 6px !important;
2327          padding-bottom: 6px !important;
2328      }
2329  
2330      .permissions-category .activetab span.colour {
2331          border-color: #fff;
2332      }
2333  }
2334  
2335  /* Avatars gallery
2336  ---------------------------------------- */
2337  #gallery {
2338      display: block;
2339      margin: 0 -5px;
2340      padding: 0;
2341      overflow: hidden;
2342  }
2343  
2344  #gallery li {
2345      display: block;
2346      float: left;
2347      border: 1px solid #ccc;
2348      border-radius: 2px;
2349      background: #fff;
2350      padding: 5px;
2351      margin: 5px;
2352  }
2353  
2354  #gallery li:hover {
2355      background-color: #eee;
2356  }
2357  
2358  #gallery li label {
2359      display: block;
2360      text-align: center;
2361      padding: 0;
2362  }
2363  
2364  /* Dropdown menu
2365  ----------------------------------------*/
2366  .dropdown {
2367      position: absolute;
2368      left: 0;
2369      top: 22px;
2370      z-index: 2;
2371      border: 1px solid transparent;
2372      border-radius: 5px;
2373      padding: 9px 0 0;
2374  }
2375  
2376  .dropdown-up .dropdown {
2377      top: auto;
2378      bottom: 18px;
2379      padding: 0 0 9px;
2380  }
2381  
2382  .dropdown-left .dropdown {
2383      left: auto;
2384      right: 0;
2385  }
2386  
2387  .dropdown .pointer, .dropdown .pointer-inner {
2388      position: absolute;
2389      width: 0;
2390      height: 0;
2391      border-top-width: 0;
2392      border-bottom: 10px solid transparent;
2393      border-left: 10px dashed transparent;
2394      border-right: 10px dashed transparent;
2395      -webkit-transform: rotate(360deg); /* better anti-aliasing in webkit */
2396      display: block;
2397  }
2398  
2399  .dropdown-up .pointer, .dropdown-up .pointer-inner {
2400      border-bottom-width: 0;
2401      border-top: 10px solid transparent;
2402  }
2403  
2404  .dropdown .pointer {
2405      right: auto;
2406      left: 10px;
2407      top: 0;
2408      z-index: 3;
2409  }
2410  
2411  .dropdown-up .pointer {
2412      bottom: 0;
2413      top: auto;
2414  }
2415  
2416  .dropdown-left .dropdown .pointer {
2417      left: auto;
2418      right: 10px;
2419  }
2420  
2421  .dropdown .pointer-inner {
2422      top: auto;
2423      bottom: -11px;
2424      left: -10px;
2425  }
2426  
2427  .dropdown-up .pointer-inner {
2428      bottom: auto;
2429      top: -11px;
2430  }
2431  
2432  .dropdown .pointer {
2433      border-color: #B9B9B9 transparent;
2434  }
2435  
2436  .dropdown .pointer-inner {
2437      border-color: #FFF transparent;
2438  }
2439  
2440  .dropdown .dropdown-contents {
2441      z-index: 2;
2442      overflow: hidden;
2443      overflow-y: auto;
2444      background: #fff;
2445      border: 1px solid #b9b9b9;
2446      border-radius: 5px;
2447      padding: 5px;
2448      position: relative;
2449      min-width: 40px;
2450      max-height: 200px;
2451      box-shadow: 1px 3px 5px rgba(0, 0, 0, 0.2);
2452      -webkit-box-sizing: border-box;
2453      -moz-box-sizing: border-box;
2454      box-sizing: border-box;
2455  }
2456  
2457  .dropdown-up .dropdown-contents {
2458      box-shadow: 1px 0 5px rgba(0, 0, 0, 0.2);
2459  }
2460  
2461  .dropdown li {
2462      float: none;
2463      margin: 0;
2464      white-space: nowrap;
2465      text-align: left;
2466  }
2467  
2468  .rtl .dropdown li {
2469      text-align: right;
2470  }
2471  .wrap .dropdown li, .dropdown.wrap li {
2472      white-space: normal;
2473  }
2474  
2475  .dropdown li:before, .dropdown li:after {
2476      display: none !important;
2477  }
2478  
2479  .roles-options > .dropdown {
2480      left: auto;
2481      top: 3.2em;
2482      width: 250px;
2483  }
2484  
2485  .rtl .roles-options > .dropdown {
2486      right: auto;
2487  }
2488  
2489  .roles-options {
2490      -webkit-user-select: none;
2491      -moz-user-select: none;
2492      -ms-user-select: none;
2493      -o-user-select: none;
2494      user-select: none;
2495      width: 250px;
2496  }
2497  
2498  .roles-options > span {
2499      border: 1px solid #DEDEDE;
2500      border-radius: 3px;
2501      padding: 4px;
2502      width: 250px;
2503      display: none;
2504      background: url('../images/arrow_down.gif') no-repeat 245px .7em;
2505  }
2506  
2507  .rtl .roles-options > span {
2508      background: url('../images/arrow_down.gif') no-repeat 7px .7em;
2509  }
2510  
2511  .roles-options li {
2512      list-style: none;
2513  }
2514  
2515  .roles-highlight {
2516      background-color: #1e90ff;
2517      color: #fff;
2518  }
2519  
2520  
2521  /* Classes for additional tasks
2522  ---------------------------------------- */
2523  
2524  .current-ext {
2525      color: #228822;
2526  }
2527  
2528  .outdated-ext {
2529      color: #BC2A4D;
2530  }
2531  
2532  .phpinfo {
2533      overflow: auto;
2534      width: 99%;
2535      direction: ltr;
2536  }
2537  
2538  .phpinfo td, .phpinfo th, .phpinfo h2, .phpinfo h1 {
2539      text-align: left;
2540  }
2541  
2542  .requirements_not_met {
2543      padding: 5px;
2544      background-color: #BC2A4D;
2545  }
2546  
2547  .requirements_not_met dt label, .requirements_not_met dd p {
2548      color: #FFFFFF;
2549      font-size: 1.4em;
2550  }
2551  
2552  @media only screen and (max-width: 700px), only screen and (max-device-width: 700px)
2553  {
2554      .responsive-hide { display: none !important; }
2555      .responsive-show { display: block !important; }
2556      .responsive-show-inline { display: inline !important; }
2557      .responsive-show-inline-block { display: inline-block !important; }
2558  }
2559  
2560  .clearfix {
2561      overflow: hidden;
2562  }
2563  
2564  .pagination:after,
2565  #page-header:after,
2566  #page-body:after,
2567  #tabs:after,
2568  #tabs > ul:after,
2569  #tabs li:after,
2570  #acp:after,
2571  #content:after {
2572      content: '';
2573      clear: both;
2574      display: block;
2575  }
2576  
2577  #progress-bar {
2578      position: relative;
2579      width: 90%;
2580      text-align: center;
2581      height: 25px;
2582      margin: 20px auto;
2583      border: 1px solid #cecece;
2584  }
2585  
2586  #progress-bar #progress-bar-text {
2587      position: absolute;
2588      top: 0;
2589      width: 100%;
2590      color: #000;
2591  }
2592  
2593  #progress-bar #progress-bar-filler {
2594      display: block;
2595      position: relative;
2596      top: 0;
2597      left: 0;
2598      background-color: #3c84ad;
2599      width: 0;
2600      height: 25px;
2601      overflow: hidden;
2602      color: #fff;
2603  }
2604  
2605  #progress-bar p {
2606      line-height: 25px;
2607      font-weight: bold;
2608  }
2609  
2610  .send-stats-row {
2611      margin: 15px 0;
2612  }
2613  
2614  .send-stats-row:before {
2615      display: table;
2616      content: " ";
2617  }
2618  
2619  .send-stats-tile {
2620      position: relative;
2621      padding: 14px;
2622      margin-bottom: 20px;
2623      background-color: #eff0f2;
2624      border-radius: 6px;
2625      box-shadow: rgba(0,0,0,0.3) 1px 1px 5px;
2626  }
2627  
2628  .send-stats-tile h2 {
2629      margin-top: 0;
2630      text-align: center;
2631      padding-bottom: 1em;
2632  }
2633  
2634  .send-stats-tile i {
2635      padding-right: 0.3em;
2636  }
2637  
2638  .icon {
2639      font-family: FontAwesome;
2640      font-style: normal;
2641  }
2642  
2643  .send-stats-data-row {
2644      background: #f9f9f9;
2645      border-radius: 6px;
2646      border: #DEDEDE 1px solid;
2647      padding: 10px;
2648      border-top-width: 0;
2649      border-top-right-radius: 0;
2650      border-top-left-radius: 0;
2651  }
2652  
2653  .send-stats-data-hidden .configlist {
2654      display: none;
2655  }
2656  
2657  .send-stats-data-only-row {
2658      border-radius: 6px !important;
2659      border-bottom-width: 1px !important;
2660  }
2661  
2662  .send-stats-data-hidden {
2663      padding: 0;
2664      border: none;
2665  }
2666  
2667  .send-stats-row > .send-stats-data-row:first-child {
2668      background-color: #d9edf7;
2669      border-bottom-width: 0;
2670      border-top-right-radius: 6px;
2671      border-top-left-radius: 6px;
2672      border-top-width: 1px;
2673      border-bottom-left-radius: 0;
2674      border-bottom-right-radius: 0;
2675  }
2676  
2677  .send-stats-settings dt, .send-stats-settings dd {
2678      min-width: 25px;
2679  }
2680  
2681  .send-stats-settings dd {
2682      line-height: 1.5em;
2683  }
2684  
2685  .send-stats-settings input {
2686      display: none;
2687  }
2688  
2689  .send-stats-settings input[type=checkbox] + label:before {
2690      content: "\f096";
2691      font-family: FontAwesome;
2692      font-size: 1.5em;
2693  }
2694  
2695  .send-stats-settings input[type=checkbox]:checked + label:before {
2696      content: "\f14a";
2697      color: #3c763d;
2698  }
2699  
2700  .send-stats-data-row a:hover span {
2701      text-decoration: underline;
2702  }
2703  
2704  .send-stats-data-row a {
2705      text-decoration: none;
2706      cursor: default;
2707  }
2708  
2709  .send-stats-data-row i {
2710      padding-left: 6px;
2711  }
2712  
2713  .configlist {
2714      word-wrap: break-word;
2715      word-break: break-all;
2716  }
2717  
2718  /* stylelint-disable declaration-property-unit-whitelist */
2719  .emoji {
2720      min-height: 18px;
2721      min-width: 18px;
2722      height: 1em;
2723      width: 1em;
2724  }
2725  /* stylelint-enable declaration-property-unit-whitelist */