[ Index ]

PHP Cross Reference of WordPress Trunk (Updated Daily)

Search

title

Body

[close]

/wp-admin/css/ -> about-rtl.css (source)

   1  /*! This file is auto-generated */
   2  /*------------------------------------------------------------------------------
   3    22.0 - About Pages
   4  
   5     1.0 Global: About, Credits, Freedoms, Privacy
   6      1.1 Layout
   7      1.2 Typography & Elements
   8      1.3 Header
   9     2.0 Credits Page
  10     3.0 Freedoms Page
  11     x.2.0 Legacy About Styles: Global
  12      x.2.1 Typography
  13      x.2.2 Structure
  14      x.2.3 Point Releases
  15     x.3.0 Legacy About Styles: About Page
  16      x.3.1 Typography
  17      x.3.2 Structure
  18     x.4.0 Legacy About Styles: Credits & Freedoms Pages
  19     x.5.0 Legacy About Styles: Media Queries
  20  ------------------------------------------------------------------------------*/
  21  
  22  .about__container {
  23      /* Section backgrounds */
  24      --background: #fff;
  25      --subtle-background: #f2edd4;
  26      /* Main text color */
  27      --text: #322d2b;
  28      --text-light: #f2edd4;
  29      /* Accent colors: used in header, on special classes. */
  30      --accent-1: #ebcd3d; /* Accent background */
  31      --accent-2: #bd7331;
  32      --accent-3: #b04329;
  33      /* Navigation colors. */
  34      --nav-background: var(--subtle-background);
  35      --nav-border: var(--accent-1);
  36      --nav-color: var(--accent-3);
  37      --nav-current: var(--accent-3);
  38  }
  39  
  40  /*------------------------------------------------------------------------------
  41    1.0 - Global: About, Credits, Freedoms, Privacy
  42  ------------------------------------------------------------------------------*/
  43  
  44  .about-php,
  45  .credits-php,
  46  .freedoms-php,
  47  .privacy-php {
  48      background: #fff;
  49  }
  50  
  51  .about-php #wpcontent,
  52  .credits-php #wpcontent,
  53  .freedoms-php #wpcontent,
  54  .privacy-php #wpcontent {
  55      background: white;
  56      padding: 0 24px;
  57  }
  58  
  59  @media screen and (max-width: 782px) {
  60      .about-php.auto-fold #wpcontent,
  61      .credits-php.auto-fold #wpcontent,
  62      .freedoms-php.auto-fold #wpcontent,
  63      .privacy-php.auto-fold #wpcontent {
  64          padding-right: 24px;
  65      }
  66  }
  67  
  68  .about__container {
  69      max-width: 1000px;
  70      margin: 24px auto;
  71      clear: both;
  72  }
  73  
  74  .about__container .alignleft {
  75      float: right;
  76  }
  77  
  78  .about__container .alignright {
  79      float: left;
  80  }
  81  
  82  .about__container .aligncenter {
  83      text-align: center;
  84  }
  85  
  86  .about__container .is-vertically-aligned-top {
  87      -ms-grid-row-align: start;
  88      align-self: start;
  89  }
  90  
  91  .about__container .is-vertically-aligned-center {
  92      -ms-grid-row-align: center;
  93      align-self: center;
  94  }
  95  
  96  .about__container .is-vertically-aligned-bottom {
  97      -ms-grid-row-align: end;
  98      align-self: end;
  99  }
 100  
 101  .about__section {
 102      background: #fff;
 103      background: var(--background);
 104      clear: both;
 105  }
 106  
 107  .about__container .has-accent-background-color {
 108      background-color: #ebcd3d;
 109      background-color: var(--accent-1);
 110  }
 111  
 112  .about__container .has-transparent-background-color {
 113      background-color: transparent;
 114  }
 115  
 116  .about__container .has-accent-color {
 117      color: #b04329;
 118      color: var(--accent-3);
 119  }
 120  
 121  .about__container .has-subtle-background-color {
 122      background-color: #f2edd4;
 123      background-color: var(--subtle-background);
 124      color: #322d2b;
 125      color: var(--text);
 126  }
 127  
 128  /* 1.1 - Layout */
 129  
 130  .about__section {
 131      margin: 0;
 132  }
 133  
 134  .about__section .column {
 135      padding: 32px;
 136  }
 137  
 138  .about__section + .about__section .column {
 139      padding-top: 0;
 140  }
 141  
 142  .about__section .column.is-edge-to-edge {
 143      padding: 0;
 144  }
 145  
 146  .about__section .column p:first-of-type {
 147      margin-top: 0;
 148  }
 149  
 150  .about__section .column p:last-of-type {
 151      margin-bottom: 0;
 152  }
 153  
 154  .about__section .has-text-columns {
 155      columns: 2;
 156      column-gap: 64px;
 157  }
 158  
 159  .about__section .is-section-header {
 160      margin-bottom: 0;
 161      padding: 32px 32px 0;
 162  }
 163  
 164  .about__section .is-section-header p:last-child {
 165      margin-bottom: 0;
 166  }
 167  
 168  /* Section header is alone in a container. */
 169  .about__section .is-section-header:first-child:last-child {
 170      padding: 0;
 171  }
 172  
 173  .about__section.is-feature {
 174      padding: 32px;
 175  }
 176  
 177  .about__section.is-feature p {
 178      margin: 0;
 179  }
 180  
 181  .about__section.is-feature p + p {
 182      margin-top: 1rem;
 183  }
 184  
 185  .about__section.has-1-column {
 186      margin-right: auto;
 187      margin-left: auto;
 188      max-width: 36em;
 189  }
 190  
 191  .about__section.has-2-columns,
 192  .about__section.has-3-columns,
 193  .about__section.has-4-columns {
 194      display: -ms-grid;
 195      display: grid;
 196  }
 197  
 198  .about__section.has-2-columns {
 199      -ms-grid-columns: 1fr 1fr;
 200      grid-template-columns: 1fr 1fr;
 201  }
 202  
 203  .about__section.has-2-columns.is-wider-right {
 204      -ms-grid-columns: 1fr 2fr;
 205      grid-template-columns: 1fr 2fr;
 206  }
 207  
 208  .about__section.has-2-columns.is-wider-left {
 209      -ms-grid-columns: 2fr 1fr;
 210      grid-template-columns: 2fr 1fr;
 211  }
 212  
 213  .about__section.has-2-columns .is-section-header {
 214      -ms-grid-column: 1;
 215      grid-column-start: 1;
 216      -ms-grid-column-span: 2;
 217      grid-column-end: span 2;
 218  }
 219  
 220  .about__section.has-2-columns .column:nth-of-type(2n+1) {
 221      -ms-grid-column: 1;
 222      grid-column-start: 1;
 223  }
 224  
 225  .about__section.has-2-columns .column:nth-of-type(2n) {
 226      -ms-grid-column: 2;
 227      grid-column-start: 2;
 228  }
 229  
 230  .about__section.has-3-columns {
 231      -ms-grid-columns: (1fr)[3];
 232      grid-template-columns: repeat(3, 1fr);
 233  }
 234  
 235  .about__section.has-3-columns .is-section-header {
 236      -ms-grid-column: 1;
 237      grid-column-start: 1;
 238      -ms-grid-column-span: 3;
 239      grid-column-end: span 3;
 240  }
 241  
 242  .about__section.has-3-columns .column:nth-of-type(3n+1) {
 243      -ms-grid-column: 1;
 244      grid-column-start: 1;
 245  }
 246  
 247  .about__section.has-3-columns .column:nth-of-type(3n+2) {
 248      -ms-grid-column: 2;
 249      grid-column-start: 2;
 250  }
 251  
 252  .about__section.has-3-columns .column:nth-of-type(3n) {
 253      -ms-grid-column: 3;
 254      grid-column-start: 3;
 255  }
 256  
 257  .about__section.has-4-columns {
 258      -ms-grid-columns: (1fr)[4];
 259      grid-template-columns: repeat(4, 1fr);
 260  }
 261  
 262  .about__section.has-4-columns .is-section-header {
 263      -ms-grid-column: 1;
 264      grid-column-start: 1;
 265      -ms-grid-column-span: 4;
 266      grid-column-end: span 4;
 267  }
 268  
 269  .about__section.has-4-columns .column:nth-of-type(4n+1) {
 270      -ms-grid-column: 1;
 271      grid-column-start: 1;
 272  }
 273  
 274  .about__section.has-4-columns .column:nth-of-type(4n+2) {
 275      -ms-grid-column: 2;
 276      grid-column-start: 2;
 277  }
 278  
 279  .about__section.has-4-columns .column:nth-of-type(4n+3) {
 280      -ms-grid-column: 3;
 281      grid-column-start: 3;
 282  }
 283  
 284  .about__section.has-4-columns .column:nth-of-type(4n) {
 285      -ms-grid-column: 4;
 286      grid-column-start: 4;
 287  }
 288  
 289  /* Any columns following a section header need to be expicitly put into the second row, for IE support. */
 290  .about__section.has-2-columns .is-section-header ~ .column,
 291  .about__section.has-3-columns .is-section-header ~ .column,
 292  .about__section.has-4-columns .is-section-header ~ .column {
 293      -ms-grid-row: 2;
 294      grid-row-start: 2;
 295  }
 296  
 297  @media screen and (max-width: 782px) {
 298      .about__section.has-2-columns.is-wider-right,
 299      .about__section.has-2-columns.is-wider-left,
 300      .about__section.has-3-columns,
 301      .about__section.has-4-columns {
 302          display: block;
 303          padding-bottom: 16px;
 304      }
 305  
 306      .about__section.has-3-columns .column:nth-of-type(n),
 307      .about__section.has-4-columns .column:nth-of-type(n) {
 308          padding-top: 16px;
 309          padding-bottom: 16px;
 310      }
 311  }
 312  
 313  @media screen and (max-width: 600px) {
 314      .about__section.has-2-columns {
 315          display: flex; /* This is flex, not block, so we can use order below. */
 316          flex-wrap: wrap;
 317          align-content: stretch;
 318          padding-bottom: 16px;
 319      }
 320  
 321      .about__section.has-2-columns .column:nth-of-type(n) {
 322          padding-top: 16px;
 323          padding-bottom: 16px;
 324      }
 325  
 326      .about__section.has-2-columns .is-edge-to-edge {
 327          order: -1;
 328      }
 329  }
 330  
 331  /* 1.2 - Typography & Elements */
 332  
 333  .about__container {
 334      line-height: 1.4;
 335  }
 336  
 337  .about__container h1 {
 338      margin: 0 0 1em;
 339      padding: 0;
 340      font-weight: 600;
 341      color: inherit;
 342  }
 343  
 344  .about__container h1,
 345  .about__container h2 {
 346      margin-top: 0;
 347      font-size: 1.4em;
 348      line-height: 1.4;
 349  }
 350  
 351  .about__container h3,
 352  .about__container h2.is-smaller-heading {
 353      margin-top: 0;
 354      font-size: 1em;
 355  }
 356  
 357  .about__container p {
 358      font-size: inherit;
 359      line-height: inherit;
 360  }
 361  
 362  .about__section a {
 363      color: #b04329;
 364      color: var(--accent-3);
 365      text-decoration: underline;
 366  }
 367  
 368  .about__section a:hover,
 369  .about__section a:active,
 370  .about__section a:focus {
 371      color: #bd7331;
 372      color: var(--accent-2);
 373      text-decoration: none;
 374  }
 375  
 376  .wp-credits-list a {
 377      text-decoration: none;
 378  }
 379  
 380  .wp-credits-list a:hover,
 381  .wp-credits-list a:active,
 382  .wp-credits-list a:focus {
 383      text-decoration: underline;
 384  }
 385  
 386  .about__container ul {
 387      list-style: disc;
 388      margin-right: 16px;
 389  }
 390  
 391  .about__container img {
 392      margin: 0;
 393      max-width: 100%;
 394      vertical-align: middle;
 395  }
 396  
 397  .about__container .about__image {
 398      margin: 0;
 399  }
 400  
 401  .about__container .about__image img {
 402      max-width: 100%;
 403      width: 100%;
 404      height: auto;
 405  }
 406  
 407  .about__container .about__image .wp-video {
 408      margin-right: auto;
 409      margin-left: auto;
 410  }
 411  
 412  .about__container .about__image + h3 {
 413      margin-top: 1.5em;
 414  }
 415  
 416  .about__container hr {
 417      margin: 0;
 418      height: 32px;
 419      border: none;
 420  }
 421  
 422  .about__container hr.is-small {
 423      height: 8px;
 424  }
 425  
 426  .about__container div.updated,
 427  .about__container div.error,
 428  .about__container .notice {
 429      display: none !important;
 430  }
 431  
 432  .about__section {
 433      font-size: 1.2em;
 434  }
 435  
 436  .about__section.is-feature {
 437      font-size: 1.6em;
 438      font-weight: 600;
 439      text-align: center;
 440  }
 441  
 442  @media screen and (max-width: 480px) {
 443      .about__section.is-feature {
 444          font-size: 1.4em;
 445          font-weight: 500;
 446      }
 447  }
 448  
 449  /* 1.3 - Header */
 450  
 451  .about__header {
 452      padding-top: 8em;
 453      margin-bottom: 32px;
 454      background-color: #ebcd3d;
 455      background-color: var(--accent-1);
 456      color: #322d2b;
 457      color: var(--text);
 458  }
 459  
 460  .about__header-title {
 461      display: flex;
 462      align-items: center;
 463      justify-content: center;
 464      height: 20vh;
 465      max-height: 16em;
 466      padding: 32px;
 467      margin-bottom: 4em;
 468      text-align: center;
 469  }
 470  
 471  .about__header-title p {
 472      margin: 0;
 473      padding: 0;
 474      font-size: 4em;
 475      line-height: 1;
 476      font-weight: 500;
 477  }
 478  
 479  .about__header-title p span {
 480      display: block;
 481      font-size: 2em;
 482  }
 483  
 484  .about__header-text {
 485      display: inline-block;
 486      margin-right: -16px;
 487      padding: 16px 48px;
 488      font-size: 1.5em;
 489      line-height: 1.4;
 490      background: #b04329;
 491      background: var(--accent-3);
 492      color: #f2edd4;
 493      color: var(--text-light);
 494  }
 495  
 496  .about__header-text p {
 497      margin: 0;
 498  }
 499  
 500  .about__header-navigation {
 501      clear: both;
 502      padding-top: 0;
 503      background: #f2edd4;
 504      background: var(--nav-background);
 505      color: #b04329;
 506      color: var(--nav-color);
 507      border-bottom: 3px solid #ebcd3d;
 508      border-bottom: 3px solid var(--nav-border);
 509  }
 510  
 511  .about__header-navigation .nav-tab {
 512      margin-right: 0;
 513      padding: 24px 32px;
 514      font-size: 1.4em;
 515      line-height: 1;
 516      border-width: 0 0 3px;
 517      border-style: solid;
 518      border-color: transparent;
 519      background: transparent;
 520      color: inherit;
 521  }
 522  
 523  .about__header-navigation .nav-tab:hover,
 524  .about__header-navigation .nav-tab:active {
 525      background-color: #322d2b;
 526      background-color: var(--text);
 527      color: #f2edd4;
 528      color: var(--text-light);
 529  }
 530  
 531  .about__header-navigation .nav-tab-active {
 532      margin-bottom: -3px;
 533      border-width: 0 0 6px;
 534      border-color: #b04329;
 535      border-color: var(--nav-current);
 536  }
 537  
 538  .about__header-navigation .nav-tab-active:hover,
 539  .about__header-navigation .nav-tab-active:active {
 540      background-color: #322d2b;
 541      background-color: var(--text);
 542      color: #f2edd4;
 543      color: var(--text-light);
 544      border-color: #b04329;
 545      border-color: var(--nav-current);
 546  }
 547  
 548  @media screen and (max-width: 782px) {
 549      .about__container .about__header-text {
 550          font-size: 1.4em;
 551      }
 552  
 553      .about__header-title {
 554          min-height: 0;
 555          max-height: none;
 556          height: auto;
 557      }
 558  
 559      .about__header-navigation .nav-tab {
 560          margin-top: 0;
 561          margin-left: 0;
 562          padding: 24px 16px;
 563      }
 564  }
 565  
 566  @media screen and (max-width: 480px) {
 567      .about__header-title p {
 568          font-size: 3.2em;
 569      }
 570  
 571      .about__header-navigation .nav-tab {
 572          float: none;
 573          display: block;
 574          margin-bottom: 0;
 575          padding: 16px 16px;
 576          border-right-width: 6px;
 577          border-bottom: none;
 578      }
 579  
 580      .about__header-navigation .nav-tab-active {
 581          border-bottom: none;
 582          border-right-width: 6px;
 583      }
 584  }
 585  
 586  
 587  /*------------------------------------------------------------------------------
 588    2.0 - Credits Page
 589  ------------------------------------------------------------------------------*/
 590  
 591  .about__section .wp-people-group {
 592      margin: 0;
 593  }
 594  
 595  .about__section .wp-person {
 596      display: inline-block;
 597      vertical-align: top;
 598      box-sizing: border-box;
 599      padding: 0 0 1em 1em;
 600      height: 6em;
 601      width: calc( 33% - 4px );
 602      min-width: 280px;
 603  }
 604  
 605  .about__section .compact .wp-person {
 606      height: auto;
 607      width: calc( 25% - 4px );
 608      min-width: 220px;
 609      padding-bottom: 0.5em;
 610  }
 611  
 612  .about__section .wp-person .gravatar {
 613      float: right;
 614      margin: -4px 0 0.85em 0.85em;
 615      padding: 1px;
 616      width: 80px;
 617      height: 80px;
 618      border-radius: 100%;
 619  }
 620  
 621  .about__section .compact .wp-person .gravatar {
 622      width: 40px;
 623      height: 40px;
 624  }
 625  
 626  .about__section .wp-person .web {
 627      font-size: 1.4em;
 628      font-weight: 600;
 629      text-decoration: none;
 630      color: #322d2b;
 631      color: var(--text);
 632  }
 633  
 634  .about__section .wp-person .web:hover {
 635      text-decoration: underline;
 636  }
 637  
 638  .about__section .compact .wp-person .web {
 639      font-size: 1.2em;
 640  }
 641  
 642  .about__section .wp-person .title {
 643      display: block;
 644      margin-top: 0.5em;
 645  }
 646  
 647  @media screen and (max-width: 480px) {
 648      .about__section .wp-person {
 649          min-width: 100%;
 650      }
 651  
 652      .about__section .wp-person .gravatar {
 653          width: 60px;
 654          height: 60px;
 655      }
 656  
 657      .about__section .wp-person .web {
 658          font-size: 1em;
 659      }
 660  
 661      .about__section .compact .wp-person .web {
 662          font-size: 1em;
 663      }
 664  }
 665  
 666  
 667  /*------------------------------------------------------------------------------
 668    3.0 - Freedoms Page
 669  ------------------------------------------------------------------------------*/
 670  
 671  .about__section .column .freedoms-image {
 672      margin-bottom: 1em;
 673  }
 674  
 675  
 676  /*------------------------------------------------------------------------------
 677    x.2.0 - Legacy About Styles: Global
 678  ------------------------------------------------------------------------------*/
 679  
 680  .about-wrap {
 681      position: relative;
 682      margin: 25px 20px 0 40px;
 683      max-width: 1050px; /* readability */
 684      font-size: 15px;
 685  }
 686  
 687  .about-wrap.full-width-layout {
 688      max-width: 1200px;
 689  }
 690  
 691  .about-wrap-content {
 692      max-width: 1050px;
 693  }
 694  
 695  .about-wrap div.updated,
 696  .about-wrap div.error,
 697  .about-wrap .notice {
 698      display: none !important;
 699  }
 700  
 701  .about-wrap hr {
 702      border: 0;
 703      height: 0;
 704      margin: 3em 0 0;
 705      border-top: 1px solid rgba(0, 0, 0, 0.1);
 706  }
 707  
 708  .about-wrap img {
 709      margin: 0;
 710      width: 100%;
 711      height: auto;
 712      vertical-align: middle;
 713  }
 714  
 715  .about-wrap .inline-svg img {
 716      max-width: 100%;
 717      width: auto;
 718      height: auto;
 719  }
 720  
 721  .about-wrap video {
 722      margin: 1.5em auto;
 723  }
 724  
 725  /* WordPress Version Badge */
 726  
 727  .wp-badge {
 728      background: #0073aa url(../images/w-logo-white.png?ver=20160308) no-repeat;
 729      background-position: center 25px;
 730      background-size: 80px 80px;
 731      color: #fff;
 732      font-size: 14px;
 733      text-align: center;
 734      font-weight: 600;
 735      margin: 5px 0 0;
 736      padding-top: 120px;
 737      height: 40px;
 738      display: inline-block;
 739      width: 140px;
 740      text-rendering: optimizeLegibility;
 741      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
 742  }
 743  
 744  .svg .wp-badge {
 745      background-image: url(../images/wordpress-logo-white.svg?ver=20160308);
 746  }
 747  
 748  .about-wrap .wp-badge {
 749      position: absolute;
 750      top: 0;
 751      left: 0;
 752  }
 753  
 754  /* Tabs */
 755  
 756  .about-wrap .nav-tab {
 757      padding-left: 15px;
 758      padding-right: 15px;
 759      font-size: 18px;
 760      line-height: 1.33333333;
 761  }
 762  
 763  /* x.2.1 - Typography */
 764  
 765  .about-wrap h1 {
 766      margin: 0.2em 0 0 200px;
 767      padding: 0;
 768      color: #32373c;
 769      line-height: 1.2;
 770      font-size: 2.8em;
 771      font-weight: 400;
 772  }
 773  
 774  .about-wrap h2 {
 775      margin: 40px 0 0.6em;
 776      font-size: 2.7em;
 777      line-height: 1.3;
 778      font-weight: 300;
 779      text-align: center;
 780  }
 781  
 782  .about-wrap h3 {
 783      margin: 1.25em 0 0.6em;
 784      font-size: 1.4em;
 785      line-height: 1.5;
 786  }
 787  
 788  .about-wrap h4 {
 789      font-size: 16px;
 790      color: #23282d;
 791  }
 792  
 793  .about-wrap p {
 794      line-height: 1.5;
 795      font-size: 16px;
 796  }
 797  
 798  .about-wrap code,
 799  .about-wrap ol li p {
 800      font-size: 14px;
 801      font-weight: 400;
 802  }
 803  
 804  .about-wrap figcaption {
 805      font-size: 13px;
 806      text-align: center;
 807      color: white;
 808      text-overflow: ellipsis;
 809  }
 810  
 811  .about-wrap .about-description,
 812  .about-wrap .about-text {
 813      margin-top: 1.4em;
 814      font-weight: 400;
 815      line-height: 1.6;
 816      font-size: 19px;
 817  }
 818  
 819  .about-wrap .about-text {
 820      margin: 1em 0 1em 200px;
 821      color: #555d66;
 822  }
 823  
 824  /* x.2.2 - Structure */
 825  
 826  .about-wrap .has-1-columns,
 827  .about-wrap .has-2-columns,
 828  .about-wrap .has-3-columns,
 829  .about-wrap .has-4-columns {
 830      display: -ms-grid;
 831      display: grid;
 832      max-width: 800px;
 833      margin-top: 40px;
 834      margin-right: auto;
 835      margin-left: auto;
 836  }
 837  
 838  .about-wrap .column {
 839      margin-left: 20px;
 840      margin-right: 20px;
 841  }
 842  
 843  .about-wrap .is-wide {
 844      max-width: 760px;
 845  }
 846  
 847  .about-wrap .is-fullwidth {
 848      max-width: 100%;
 849  }
 850  
 851  .about-wrap .has-1-columns {
 852      display: block;
 853      max-width: 680px;
 854      margin: 0 auto 40px;
 855  }
 856  
 857  .about-wrap .has-2-columns {
 858      -ms-grid-columns: 1fr 1fr;
 859      grid-template-columns: 1fr 1fr;
 860  }
 861  
 862  .about-wrap .has-2-columns .column:nth-of-type(2n+1) {
 863      -ms-grid-column: 1;
 864      grid-column-start: 1;
 865  }
 866  
 867  .about-wrap .has-2-columns .column:nth-of-type(2n) {
 868      -ms-grid-column: 2;
 869      grid-column-start: 2;
 870  }
 871  
 872  .about-wrap .has-2-columns.is-wider-right {
 873      -ms-grid-columns: 1fr 2fr;
 874      grid-template-columns: 1fr 2fr;
 875  }
 876  
 877  .about-wrap .has-2-columns.is-wider-left {
 878      -ms-grid-columns: 2fr 1fr;
 879      grid-template-columns: 2fr 1fr;
 880  }
 881  
 882  .about-wrap .has-3-columns {
 883      -ms-grid-columns: (1fr)[3];
 884      grid-template-columns: repeat(3, 1fr);
 885  }
 886  
 887  .about-wrap .has-3-columns .column:nth-of-type(3n+1) {
 888      -ms-grid-column: 1;
 889      grid-column-start: 1;
 890  }
 891  
 892  .about-wrap .has-3-columns .column:nth-of-type(3n+2) {
 893      -ms-grid-column: 2;
 894      grid-column-start: 2;
 895  }
 896  
 897  .about-wrap .has-3-columns .column:nth-of-type(3n) {
 898      -ms-grid-column: 3;
 899      grid-column-start: 3;
 900  }
 901  
 902  .about-wrap .has-4-columns {
 903      -ms-grid-columns: (1fr)[4];
 904      grid-template-columns: repeat(4, 1fr);
 905  }
 906  
 907  .about-wrap .has-4-columns .column:nth-of-type(4n+1) {
 908      -ms-grid-column: 1;
 909      grid-column-start: 1;
 910  }
 911  
 912  .about-wrap .has-4-columns .column:nth-of-type(4n+2) {
 913      -ms-grid-column: 2;
 914      grid-column-start: 2;
 915  }
 916  
 917  .about-wrap .has-4-columns .column:nth-of-type(4n+3) {
 918      -ms-grid-column: 3;
 919      grid-column-start: 3;
 920  }
 921  
 922  .about-wrap .has-4-columns .column:nth-of-type(4n) {
 923      -ms-grid-column: 4;
 924      grid-column-start: 4;
 925  }
 926  
 927  .about-wrap .column :first-child {
 928      margin-top: 0;
 929  }
 930  
 931  .about-wrap .aligncenter {
 932      text-align: center;
 933  }
 934  
 935  .about-wrap .alignleft {
 936      float: right;
 937      margin-left: 40px;
 938  }
 939  
 940  .about-wrap .alignright {
 941      float: left;
 942      margin-right: 40px;
 943  }
 944  
 945  .about-wrap .is-vertically-aligned-top {
 946      -ms-grid-row-align: start;
 947      align-self: start;
 948  }
 949  
 950  .about-wrap .is-vertically-aligned-center {
 951      -ms-grid-row-align: center;
 952      align-self: center;
 953  }
 954  
 955  .about-wrap .is-vertically-aligned-bottom {
 956      -ms-grid-row-align: end;
 957      align-self: end;
 958  }
 959  
 960  /* x.2.3 - Point Releases */
 961  
 962  .about-wrap .point-releases {
 963      margin-top: 5px;
 964      border-bottom: 1px solid #ddd;
 965  }
 966  
 967  .about-wrap .changelog {
 968      margin-bottom: 40px;
 969  }
 970  
 971  .about-wrap .changelog.point-releases h3 {
 972      padding-top: 35px;
 973  }
 974  
 975  .about-wrap .changelog.point-releases h3:first-child {
 976      padding-top: 7px;
 977  }
 978  
 979  .about-wrap .changelog.feature-section .col {
 980      margin-top: 40px;
 981  }
 982  
 983  /*------------------------------------------------------------------------------
 984    x.3.0 - Legacy About Styles: About Page
 985  ------------------------------------------------------------------------------*/
 986  
 987  /* x.3.1 - Typography */
 988  
 989  .about-wrap .lead-description {
 990      font-size: 1.5em;
 991      text-align: center;
 992  }
 993  
 994  .about-wrap .feature-section p {
 995      margin-top: 0.6em;
 996  }
 997  
 998  /* x.3.2 - Structure */
 999  
1000  .about-wrap .headline-feature {
1001      margin: 0 auto 40px;
1002      max-width: 680px;
1003  }
1004  
1005  .about-wrap .headline-feature h2 {
1006      margin: 50px 0 0;
1007  }
1008  
1009  .about-wrap .headline-feature img {
1010      max-width: 600px;
1011      width: 100%;
1012  }
1013  
1014  /* Return to Dashboard Home link */
1015  
1016  .about-wrap .return-to-dashboard {
1017      margin: 30px -5px 0 0;
1018      font-size: 14px;
1019      font-weight: 600;
1020  }
1021  
1022  .about-wrap .return-to-dashboard a {
1023      text-decoration: none;
1024      padding: 0 5px;
1025  }
1026  
1027  /*------------------------------------------------------------------------------
1028    x.4.0 - Legacy About Styles: Credits & Freedoms Pages
1029  ------------------------------------------------------------------------------*/
1030  
1031  /* Credits */
1032  
1033  .about-wrap h2.wp-people-group {
1034      margin: 2.6em 0 1.33em;
1035      padding: 0;
1036      font-size: 16px;
1037      line-height: inherit;
1038      font-weight: 600;
1039      text-align: right;
1040  }
1041  
1042  .about-wrap .wp-people-group {
1043      padding: 0 5px;
1044      margin: 0 -5px 0 -15px;
1045  }
1046  
1047  .about-wrap .compact {
1048      margin-bottom: 0;
1049  }
1050  
1051  .about-wrap .wp-person {
1052      display: inline-block;
1053      vertical-align: top;
1054      margin-left: 10px;
1055      padding-bottom: 15px;
1056      height: 70px;
1057      width: 280px;
1058  }
1059  
1060  .about-wrap .compact .wp-person {
1061      height: auto;
1062      width: 180px;
1063      padding-bottom: 0;
1064      margin-bottom: 0;
1065  }
1066  
1067  .about-wrap .wp-person .gravatar {
1068      float: right;
1069      margin: 0 0 10px 10px;
1070      padding: 1px;
1071      width: 60px;
1072      height: 60px;
1073  }
1074  
1075  .about-wrap .compact .wp-person .gravatar {
1076      width: 30px;
1077      height: 30px;
1078  }
1079  
1080  .about-wrap .wp-person .web {
1081      margin: 6px 0 2px;
1082      font-size: 16px;
1083      font-weight: 400;
1084      line-height: 2;
1085      text-decoration: none;
1086  }
1087  
1088  .about-wrap .wp-person .title {
1089      display: block;
1090  }
1091  
1092  .about-wrap #wp-people-group-validators + p.wp-credits-list {
1093      margin-top: 0;
1094  }
1095  
1096  .about-wrap p.wp-credits-list a {
1097      white-space: nowrap;
1098  }
1099  
1100  /* Freedoms */
1101  
1102  .freedoms-php .about-wrap ol {
1103      margin: 40px 60px;
1104  }
1105  
1106  .freedoms-php .about-wrap ol li {
1107      list-style-type: decimal;
1108      font-weight: 600;
1109  }
1110  
1111  .freedoms-php .about-wrap ol p {
1112      font-weight: 400;
1113      margin: 0.6em 0;
1114  }
1115  
1116  .freedoms-php .column .freedoms-image {
1117      background-image: url('../images/freedoms-2x.png');
1118      background-size: 100%;
1119      padding-top: 100%;
1120  }
1121  
1122  .freedoms-php .column:nth-of-type(2) .freedoms-image {
1123      background-position: 100% 34%;
1124  }
1125  
1126  .freedoms-php .column:nth-of-type(3) .freedoms-image {
1127      background-position: 100% 66%;
1128  }
1129  
1130  .freedoms-php .column:nth-of-type(4) .freedoms-image {
1131      background-position: 100% 100%;
1132  }
1133  
1134  /*------------------------------------------------------------------------------
1135    x.5.0 - Legacy About Styles: Media Queries
1136  ------------------------------------------------------------------------------*/
1137  
1138  @media screen and (max-width: 782px) {
1139      .about-wrap .has-3-columns,
1140      .about-wrap .has-4-columns {
1141          -ms-grid-columns: 1fr 1fr;
1142          grid-template-columns: 1fr 1fr;
1143      }
1144  
1145      .about-wrap .has-3-columns .column:nth-of-type(3n+1),
1146      .about-wrap .has-4-columns .column:nth-of-type(4n+1) {
1147          -ms-grid-column: 1;
1148          grid-column-start: 1;
1149          -ms-grid-row: 1;
1150          grid-row-start: 1;
1151      }
1152  
1153      .about-wrap .has-3-columns .column:nth-of-type(3n+2),
1154      .about-wrap .has-4-columns .column:nth-of-type(4n+2) {
1155          -ms-grid-column: 2;
1156          grid-column-start: 2;
1157          -ms-grid-row: 1;
1158          grid-row-start: 1;
1159      }
1160  
1161      .about-wrap .has-3-columns .column:nth-of-type(3n),
1162      .about-wrap .has-4-columns .column:nth-of-type(4n+3) {
1163          -ms-grid-column: 1;
1164          grid-column-start: 1;
1165          -ms-grid-row: 2;
1166          grid-row-start: 2;
1167      }
1168  
1169      .about-wrap .has-4-columns .column:nth-of-type(4n) {
1170          -ms-grid-column: 2;
1171          grid-column-start: 2;
1172          -ms-grid-row: 2;
1173          grid-row-start: 2;
1174      }
1175  }
1176  
1177  @media screen and (max-width: 600px) {
1178      .about-wrap .has-2-columns,
1179      .about-wrap .has-3-columns,
1180      .about-wrap .has-4-columns {
1181          display: block;
1182      }
1183  
1184      .about-wrap :not(.is-wider-right):not(.is-wider-left) .column {
1185          margin-left: 0;
1186          margin-right: 0;
1187      }
1188  
1189      .about-wrap .has-2-columns.is-wider-right,
1190      .about-wrap .has-2-columns.is-wider-left {
1191          display: -ms-grid;
1192          display: grid;
1193      }
1194  }
1195  
1196  @media only screen and (max-width: 500px) {
1197      .about-wrap {
1198          margin-left: 20px;
1199          margin-right: 10px;
1200      }
1201  
1202      .about-wrap h1,
1203      .about-wrap .about-text {
1204          margin-left: 0;
1205      }
1206  
1207      .about-wrap .about-text {
1208          margin-bottom: 0.25em;
1209      }
1210  
1211      .about-wrap .wp-badge {
1212          position: relative;
1213          margin-bottom: 1.5em;
1214          width: 100%;
1215      }
1216  }
1217  
1218  @media only screen and (max-width: 480px) {
1219      .about-wrap .has-2-columns.is-wider-right,
1220      .about-wrap .has-2-columns.is-wider-left {
1221          display: block;
1222      }
1223  
1224      .about-wrap .column {
1225          margin-left: 0;
1226          margin-right: 0;
1227      }
1228  
1229      .about-wrap .has-2-columns.is-wider-right img,
1230      .about-wrap .has-2-columns.is-wider-left img {
1231          max-width: 160px;
1232      }
1233  }


Generated : Tue Oct 27 08:20:02 2020 Cross-referenced by PHPXref