1/*! This file is auto-generated */
2/*------------------------------------------------------------------------------
3 22.0 - About Pages
4
5 1.0 Global: About, Credits, Freedoms, Privacy, Get Involved
6 1.1 Layout
7 1.2 Typography & Elements
8 1.3 Header
9 2.0 Credits Page
10 3.0 Freedoms Page
11 4.0 Privacy Page
12 x.2.0 Legacy About Styles: Global
13 x.2.1 Typography
14 x.2.2 Structure
15 x.2.3 Point Releases
16 x.3.0 Legacy About Styles: About Page
17 x.3.1 Typography
18 x.3.2 Structure
19 x.4.0 Legacy About Styles: Credits & Freedoms Pages
20 x.5.0 Legacy About Styles: Media Queries
21------------------------------------------------------------------------------*/
22
23.about__container {
24 /* Section backgrounds */
25 --background: #ececec;
26 --subtle-background: #eef0fd;
27
28 /* Main text color */
29 --text: #1e1e1e;
30 --text-light: #fff;
31
32 /* Accent colors: used in header, on special classes. */
33 --accent-1: #3858e9; /* Link color */
34 --accent-2: #183ad6; /* Accent background */
35 --accent-3: #ececec; /* hr background */
36
37 /* Header background on small screens */
38 --accent-gradient: linear-gradient(-90deg, #000000 4.7%, var(--accent-1) 83.84%)/*rtl:linear-gradient(-90deg, #000000 4.7%, var(--accent-1) 83.84%)*/;
39
40 /* Navigation colors. */
41 --nav-background: #fff;
42 --nav-border: transparent;
43 --nav-color: var(--text);
44 --nav-current: var(--accent-1);
45
46 --border-radius: 0;
47
48 --gap: 2rem;
49}
50
51/*------------------------------------------------------------------------------
52 1.0 - Global: About, Credits, Freedoms, Privacy, Get Involved
53------------------------------------------------------------------------------*/
54
55.about-php,
56.credits-php,
57.freedoms-php,
58.privacy-php,
59.contribute-php {
60 background: #fff;
61}
62
63.about-php #wpcontent,
64.credits-php #wpcontent,
65.freedoms-php #wpcontent,
66.privacy-php #wpcontent,
67.contribute-php #wpcontent {
68 background: #fff;
69 padding: 0 24px;
70}
71
72@media screen and (max-width: 782px) {
73 .about-php.auto-fold #wpcontent,
74 .credits-php.auto-fold #wpcontent,
75 .freedoms-php.auto-fold #wpcontent,
76 .privacy-php.auto-fold #wpcontent,
77 .contribute-php.auto-fold #wpcontent {
78 padding-right: 24px;
79 }
80}
81
82.about__container {
83 max-width: 1000px;
84 margin: 24px auto;
85 clear: both;
86}
87
88.about__container .alignleft {
89 float: right;
90}
91
92.about__container .alignright {
93 float: left;
94}
95
96.about__container .aligncenter {
97 text-align: center;
98}
99
100.about__container .is-vertically-aligned-top {
101 align-self: start;
102}
103
104.about__container .is-vertically-aligned-center {
105 align-self: center;
106}
107
108.about__container .is-vertically-aligned-bottom {
109 align-self: end;
110}
111
112.about__section {
113 background: transparent;
114 clear: both;
115}
116
117.about__container .has-accent-background-color {
118 color: var(--text-light);
119 background-color: var(--accent-2);
120}
121
122.about__container .has-transparent-background-color {
123 background-color: transparent;
124}
125
126.about__container .has-accent-color {
127 color: var(--accent-2);
128}
129
130.about__container .has-border {
131 border: 3px solid currentColor;
132}
133
134.about__container .has-subtle-background-color {
135 background-color: var(--subtle-background);
136}
137
138.about__container .has-background-image {
139 background-size: contain;
140 background-repeat: no-repeat;
141 background-position: center;
142}
143
144/* 1.1 - Layout */
145
146.about__section {
147 margin: 0;
148}
149
150.about__section .column:not(.is-edge-to-edge) {
151 padding: var(--gap);
152}
153
154.about__section + .about__section .is-section-header {
155 padding-bottom: var(--gap);
156}
157
158.about__section .column[class*="background-color"]:not(.is-edge-to-edge),
159.about__section:where([class*="background-color"]) .column:not(.is-edge-to-edge),
160.about__section .column.has-border:not(.is-edge-to-edge) {
161 padding-top: var(--gap);
162 padding-bottom: var(--gap);
163}
164
165.about__section .column p:first-of-type {
166 margin-top: 0;
167}
168
169.about__section .column p:last-of-type {
170 margin-bottom: 0;
171}
172
173.about__section .has-text-columns {
174 columns: 2;
175 column-gap: calc(var(--gap) * 2);
176}
177
178.about__section .is-section-header {
179 margin-bottom: 0;
180 padding: var(--gap) var(--gap) 0;
181}
182
183.about__section .is-section-header p:last-child {
184 margin-bottom: 0;
185}
186
187/* Section header is alone in a container. */
188.about__section .is-section-header:first-child:last-child {
189 padding: 0;
190}
191
192.about__section.is-feature {
193 padding: var(--gap);
194}
195
196.about__section.is-feature p {
197 margin: 0;
198}
199
200.about__section.is-feature p + p {
201 margin-top: calc(var(--gap) / 2);
202}
203
204.about__section.has-1-column {
205 margin-right: auto;
206 margin-left: auto;
207 max-width: 36em;
208}
209
210.about__section.has-2-columns,
211.about__section.has-3-columns,
212.about__section.has-4-columns,
213.about__section.has-overlap-style {
214 display: grid;
215}
216
217.about__section.has-gutters {
218 gap: var(--gap);
219 margin-bottom: var(--gap);
220}
221
222.about__section.has-2-columns {
223 grid-template-columns: 1fr 1fr;
224}
225
226.about__section.has-2-columns.is-wider-right {
227 grid-template-columns: 2fr 3fr;
228}
229
230.about__section.has-2-columns.is-wider-left {
231 grid-template-columns: 3fr 2fr;
232}
233
234.about__section .is-section-header {
235 grid-column-start: 1;
236 grid-column-end: -1;
237}
238
239.about__section.has-3-columns {
240 grid-template-columns: repeat(3, 1fr);
241}
242
243.about__section.has-4-columns {
244 grid-template-columns: repeat(4, 1fr);
245}
246
247.about__section.has-overlap-style {
248 grid-template-columns: repeat(7, 1fr);
249}
250
251.about__section.has-overlap-style .column {
252 grid-row-start: 1;
253}
254
255.about__section.has-overlap-style .column:nth-of-type(2n+1) {
256 grid-column-start: 2;
257 grid-column-end: span 3;
258}
259
260.about__section.has-overlap-style .column:nth-of-type(2n) {
261 grid-column-start: 4;
262 grid-column-end: span 3;
263}
264
265.about__section.has-overlap-style .column.is-top-layer {
266 z-index: 1;
267}
268
269@media screen and (max-width: 782px) {
270 .about__section.has-2-columns.is-wider-right,
271 .about__section.has-2-columns.is-wider-left,
272 .about__section.has-3-columns {
273 display: block;
274 margin-bottom: calc(var(--gap) / 2);
275 }
276
277 .about__section .column:not(.is-edge-to-edge) {
278 padding-top: var(--gap);
279 padding-bottom: var(--gap);
280 }
281
282 .about__section.has-2-columns.has-gutters.is-wider-right,
283 .about__section.has-2-columns.has-gutters.is-wider-left,
284 .about__section.has-3-columns.has-gutters {
285 margin-bottom: calc(var(--gap) * 2);
286 }
287
288 .about__section.has-2-columns.has-gutters .column,
289 .about__section.has-2-columns.has-gutters .column,
290 .about__section.has-3-columns.has-gutters .column {
291 margin-bottom: var(--gap);
292 }
293
294 .about__section.has-2-columns.has-gutters .column:last-child,
295 .about__section.has-2-columns.has-gutters .column:last-child,
296 .about__section.has-3-columns.has-gutters .column:last-child {
297 margin-bottom: 0;
298 }
299
300 .about__section.has-3-columns .column:nth-of-type(n) {
301 padding-top: calc(var(--gap) / 2);
302 padding-bottom: calc(var(--gap) / 2);
303 }
304
305 .about__section.has-4-columns {
306 grid-template-columns: repeat(2, 1fr);
307 }
308
309 .about__section.has-overlap-style {
310 grid-template-columns: 1fr;
311 }
312
313 /* At this size, the two columns fully overlap */
314 .about__section.has-overlap-style .column.column {
315 grid-column-start: 1;
316 grid-column-end: 2;
317 grid-row-start: 1;
318 grid-row-end: 2;
319 }
320}
321
322@media screen and (max-width: 600px) {
323 .about__section.has-2-columns {
324 display: block;
325 margin-bottom: var(--gap);
326 }
327
328 .about__section.has-2-columns:not(.has-gutters) .column:nth-of-type(n) {
329 padding-top: calc(var(--gap) / 2);
330 padding-bottom: calc(var(--gap) / 2);
331 }
332
333 .about__section.has-2-columns.has-gutters {
334 margin-bottom: calc(var(--gap) * 2);
335 }
336
337 .about__section.has-2-columns.has-gutters .column {
338 margin-bottom: var(--gap);
339 }
340
341 .about__section.has-2-columns.has-gutters .column:last-child {
342 margin-bottom: 0;
343 }
344}
345
346@media screen and (max-width: 480px) {
347 .about__section.is-feature .column,
348 .about__section .is-section-header {
349 padding: 0;
350 }
351
352 .about__section.has-4-columns {
353 display: block;
354 padding-bottom: calc(var(--gap) / 2);
355 }
356
357 .about__section.has-4-columns.has-gutters .column {
358 margin-bottom: calc(var(--gap) / 2);
359 }
360
361 .about__section.has-4-columns.has-gutters .column:last-child {
362 margin-bottom: 0;
363 }
364
365 .about__section.has-4-columns .column:nth-of-type(n) {
366 padding-top: calc(var(--gap) / 2);
367 padding-bottom: calc(var(--gap) / 2);
368 }
369}
370
371/* 1.2 - Typography & Elements */
372
373.about__container {
374 line-height: 1.4;
375 color: var(--text);
376}
377
378.about__container h1 {
379 padding: 0;
380}
381
382.about__container h1,
383.about__container h2,
384.about__container h3.is-larger-heading {
385 margin-top: 0;
386 margin-bottom: calc(0.5 * var(--gap));
387 font-size: 2rem;
388 font-weight: 700;
389 line-height: 1.16;
390}
391
392.about__container h3,
393.about__container h1.is-smaller-heading,
394.about__container h2.is-smaller-heading {
395 margin-top: 0;
396 margin-bottom: calc(0.5 * var(--gap));
397 font-size: 1.625rem;
398 font-weight: 700;
399 line-height: 1.4;
400}
401
402.about__container h4,
403.about__container h3.is-smaller-heading {
404 margin-top: 0;
405 font-size: 1.125rem;
406 font-weight: 600;
407 line-height: 1.6;
408}
409
410.about__container h1,
411.about__container h2,
412.about__container h3,
413.about__container h4 {
414 text-wrap: pretty;
415 color: inherit;
416}
417
418.about__container :is(h1, h2, h3, h4, .about__header-text):lang(en) {
419 text-wrap: balance;
420}
421
422.about__container p {
423 text-wrap: pretty;
424}
425
426.about__container p {
427 font-size: inherit;
428 line-height: inherit;
429}
430
431.about__container p.is-subheading {
432 margin-top: 0;
433 margin-bottom: 1rem;
434 font-size: 1.5rem;
435 font-weight: 300;
436 line-height: 160%;
437}
438
439.about__section a {
440 color: var(--accent-1);
441 text-decoration: underline;
442}
443
444.about__section a:hover,
445.about__section a:active,
446.about__section a:focus {
447 color: var(--accent-1);
448 text-decoration: none;
449}
450
451.wp-credits-list a {
452 text-decoration: none;
453}
454
455.wp-credits-list a:hover,
456.wp-credits-list a:active,
457.wp-credits-list a:focus {
458 text-decoration: underline;
459}
460
461.about__section a.button.button-hero {
462 padding-top: 1.1875rem;
463 padding-bottom: 1.1875rem;
464 font-size: 1.5rem;
465 line-height: 1.4;
466 white-space: normal;
467 text-wrap: pretty;
468}
469
470.about__container ul {
471 list-style: disc;
472 margin-right: calc(var(--gap) / 2);
473}
474
475.about__container li {
476 margin-bottom: 0.5rem;
477}
478
479.about__container img {
480 margin: 0;
481 max-width: 100%;
482 vertical-align: middle;
483}
484
485.about__container .about__image {
486 margin: 0;
487}
488
489.about__container .about__image img {
490 max-width: 100%;
491 width: 100%;
492 height: auto;
493 border-radius: var(--border-radius);
494}
495
496.about__container .about__image figcaption {
497 margin-top: 0.5em;
498 text-align: center;
499}
500
501.about__container .about__image .wp-video {
502 margin-right: auto;
503 margin-left: auto;
504}
505
506.about__container .about__image svg {
507 vertical-align: middle;
508}
509
510.about__container .about__image + h3 {
511 margin-top: calc(0.75 * var(--gap));
512}
513
514.about__container hr {
515 margin: calc(var(--gap) / 2) var(--gap);
516 height: 0;
517 border: none;
518 border-top: 4px solid var(--accent-3);
519}
520
521.about__container hr.is-small {
522 margin-top: 0;
523 margin-bottom: 0;
524}
525
526.about__container hr.is-large {
527 margin: var(--gap) auto;
528}
529
530.about__container hr.is-invisible {
531 border: none;
532}
533
534.about__container div.updated,
535.about__container div.error,
536.about__container .notice {
537 display: none !important;
538}
539
540.about__container code {
541 font-size: inherit;
542}
543
544.about__section {
545 font-size: 1.125rem;
546 line-height: 1.55;
547}
548
549.about__section.is-feature {
550 font-size: 1.6em;
551}
552
553.about__section.has-3-columns,
554.about__section.has-4-columns {
555 font-size: 1rem;
556}
557
558@media screen and (max-width: 480px) {
559 .about__section.is-feature {
560 font-size: 1.4em;
561 }
562
563 .about__container h1,
564 .about__container h2,
565 .about__container h3.is-larger-heading {
566 font-size: 2em;
567 }
568}
569
570/* 1.3 - Header */
571
572.about__header {
573 position: relative;
574 display: flex;
575 flex-direction: column;
576 align-items: flex-start;
577 justify-content: flex-end;
578 box-sizing: border-box;
579 padding: calc(var(--gap) * 1.5);
580 padding-left: 26rem; /* Space for the background image. */
581 min-height: clamp(10rem, 25vw, 18.75rem);
582 border-radius: var(--border-radius);
583 background-image: url("data:image/svg+xml,%3Csvg width='1000' height='300' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_6958_40721)'%3E%3Cpath fill='url(%23paint0_linear_6958_40721)' d='M0 0h1000v300H0z'/%3E%3Cg clip-path='url(%23clip1_6958_40721)'%3E%3Cpath d='M643.203 90.702c29.374-29.375 76.993-29.375 106.367 0 67.745 73.346-33.051 174.1-106.367 106.367-29.369-29.369-29.369-76.993 0-106.367z' stroke='url(%23paint1_linear_6958_40721)' stroke-width='50' stroke-miterlimit='10'/%3E%3Cpath d='M643.215 90.71L763.002-29.074' stroke='url(%23paint2_linear_6958_40721)' stroke-width='50' stroke-miterlimit='10'/%3E%3Cpath d='M981.603 113.114c-29.375 29.375-76.993 29.375-106.368 0-67.745-73.347 33.051-174.1 106.368-106.368 29.367 29.37 29.367 76.993 0 106.368z' stroke='url(%23paint3_linear_6958_40721)' stroke-width='50' stroke-miterlimit='10'/%3E%3Cpath d='M981.622 113.105L870.501 224.226' stroke='url(%23paint4_linear_6958_40721)' stroke-width='50' stroke-miterlimit='10'/%3E%3Ccircle cx='816.697' cy='221.067' r='24.068' fill='%233858E9'/%3E%3C/g%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_6958_40721' x1='47' y1='46' x2='963.5' y2='318.5' gradientUnits='userSpaceOnUse'%3E%3Cstop/%3E%3Cstop offset='.65' stop-color='%233858E9'/%3E%3Cstop offset='1' stop-color='%23D3CDB6'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear_6958_40721' x1='565.98' y1='158.471' x2='700.462' y2='23.995' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D3CDB6'/%3E%3Cstop offset='.665' stop-color='%233858E9'/%3E%3Cstop offset='1'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint2_linear_6958_40721' x1='722.025' y1='-41.283' x2='545.675' y2='135.067' gradientUnits='userSpaceOnUse'%3E%3Cstop/%3E%3Cstop offset='.5' stop-color='%233858E9'/%3E%3Cstop offset='1' stop-color='%23D3CDB6'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint3_linear_6958_40721' x1='1058.83' y1='45.345' x2='924.344' y2='179.821' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D3CDB6'/%3E%3Cstop offset='.665' stop-color='%233858E9'/%3E%3Cstop offset='1'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint4_linear_6958_40721' x1='902.813' y1='245.098' x2='1079.16' y2='68.748' gradientUnits='userSpaceOnUse'%3E%3Cstop/%3E%3Cstop offset='.5' stop-color='%233858E9'/%3E%3Cstop offset='1' stop-color='%23D3CDB6'/%3E%3C/linearGradient%3E%3CclipPath id='clip0_6958_40721'%3E%3Cpath fill='%23fff' d='M0 0h1000v300H0z'/%3E%3C/clipPath%3E%3CclipPath id='clip1_6958_40721'%3E%3Cpath fill='%23fff' transform='translate(596 -42)' d='M0 0h433v287.934H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
584 background-repeat: no-repeat;
585 background-position: left center;
586 background-size: cover;
587 background-color: var(--background);
588 color: var(--text-light);
589}
590
591.credits-php .about__header {
592 background-image: url("data:image/svg+xml,%3Csvg width='1000' height='300' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_6958_40732)'%3E%3Cpath fill='url(%23paint0_linear_6958_40732)' d='M0 0h1000v300H0z'/%3E%3Cpath d='M964.296 78.3c35.067-35.067 91.914-35.067 126.984 0 80.87 87.56-39.46 207.839-126.984 126.98-35.061-35.06-35.061-91.913 0-126.98z' stroke='url(%23paint1_linear_6958_40732)' stroke-width='50' stroke-miterlimit='10'/%3E%3Cpath d='M784.296 78.3c35.067-35.067 91.914-35.067 126.982 0 80.875 87.56-39.456 207.839-126.982 126.98-35.061-35.06-35.061-91.913 0-126.98z' stroke='url(%23paint2_linear_6958_40732)' stroke-width='50' stroke-miterlimit='10'/%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_6958_40732' x1='378.5' y1='402' x2='926' y2='9.5' gradientUnits='userSpaceOnUse'%3E%3Cstop/%3E%3Cstop offset='.65' stop-color='%233858E9'/%3E%3Cstop offset='1' stop-color='%23D3CDB6'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear_6958_40732' x1='872.106' y1='159.202' x2='1032.65' y2='-1.337' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D3CDB6'/%3E%3Cstop offset='.665' stop-color='%233858E9'/%3E%3Cstop offset='1'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint2_linear_6958_40732' x1='692.106' y1='159.202' x2='852.648' y2='-1.337' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D3CDB6'/%3E%3Cstop offset='.665' stop-color='%233858E9'/%3E%3Cstop offset='1'/%3E%3C/linearGradient%3E%3CclipPath id='clip0_6958_40732'%3E%3Cpath fill='%23fff' d='M0 0h1000v300H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
593}
594
595.freedoms-php .about__header {
596 background-image: url("data:image/svg+xml,%3Csvg width='1000' height='300' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_6958_40736)'%3E%3Cpath fill='url(%23paint0_linear_6958_40736)' d='M0 0h1000v300H0z'/%3E%3Cpath d='M847.111 61.731a1 1 0 0 1 1.778 0l29.511 57.436c.096.186.247.337.433.433l57.436 29.511a1 1 0 0 1 0 1.778L878.833 180.4a1.006 1.006 0 0 0-.433.433l-29.511 57.436a1 1 0 0 1-1.778 0L817.6 180.833a1.006 1.006 0 0 0-.433-.433l-57.436-29.511a1 1 0 0 1 0-1.778l57.436-29.511c.186-.096.337-.247.433-.433l29.511-57.436z' stroke='url(%23paint1_linear_6958_40736)' stroke-width='50' stroke-miterlimit='10'/%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_6958_40736' x1='47' y1='46' x2='1264.5' y2='46' gradientUnits='userSpaceOnUse'%3E%3Cstop/%3E%3Cstop offset='.65' stop-color='%233858E9'/%3E%3Cstop offset='1' stop-color='%23D3CDB6'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear_6958_40736' x1='692.106' y1='167.202' x2='852.648' y2='6.663' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D3CDB6'/%3E%3Cstop offset='.665' stop-color='%233858E9'/%3E%3Cstop offset='1'/%3E%3C/linearGradient%3E%3CclipPath id='clip0_6958_40736'%3E%3Cpath fill='%23fff' d='M0 0h1000v300H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
597}
598
599.privacy-php .about__header {
600 background-image: url("data:image/svg+xml,%3Csvg width='1000' height='300' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_6958_40739)'%3E%3Cpath fill='url(%23paint0_radial_6958_40739)' d='M0 0h1000v300H0z'/%3E%3Cpath d='M758 90l90-30 90 30v11.511c0 59.891-35.271 114.165-90 138.489-54.729-24.324-90-78.598-90-138.489V90z' stroke='url(%23paint1_linear_6958_40739)' stroke-width='50' stroke-miterlimit='10'/%3E%3C/g%3E%3Cdefs%3E%3CradialGradient id='paint0_radial_6958_40739' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='rotate(37.724 183.217 1253.89) scale(615.701 397.883)'%3E%3Cstop stop-color='%23D3CDB6'/%3E%3Cstop offset='.35' stop-color='%233858E9'/%3E%3Cstop offset='1'/%3E%3C/radialGradient%3E%3ClinearGradient id='paint1_linear_6958_40739' x1='692.106' y1='167.202' x2='852.648' y2='6.663' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D3CDB6'/%3E%3Cstop offset='.665' stop-color='%233858E9'/%3E%3Cstop offset='1'/%3E%3C/linearGradient%3E%3CclipPath id='clip0_6958_40739'%3E%3Cpath fill='%23fff' d='M0 0h1000v300H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
601}
602
603.contribute-php .about__header {
604 background-image: url("data:image/svg+xml,%3Csvg width='1000' height='300' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_6958_40742)'%3E%3Cpath fill='url(%23paint0_linear_6958_40742)' d='M0 0h1000v300H0z'/%3E%3Cpath d='M924.567 149.134a1 1 0 0 1 0 1.732L771.5 239.135a1 1 0 0 1-1.5-.866V61.731a1 1 0 0 1 1.5-.866l153.067 88.269z' stroke='url(%23paint1_linear_6958_40742)' stroke-width='50' stroke-miterlimit='10'/%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_6958_40742' x1='606.5' x2='721' y2='355' gradientUnits='userSpaceOnUse'%3E%3Cstop/%3E%3Cstop offset='.65' stop-color='%233858E9'/%3E%3Cstop offset='1' stop-color='%23D3CDB6'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear_6958_40742' x1='833.12' y1='-5.894' x2='992.039' y2='131.9' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D3CDB6'/%3E%3Cstop offset='.665' stop-color='%233858E9'/%3E%3Cstop offset='1'/%3E%3C/linearGradient%3E%3CclipPath id='clip0_6958_40742'%3E%3Cpath fill='%23fff' d='M0 0h1000v300H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
605}
606
607[dir="rtl"] .about__header {
608 background-image: url("data:image/svg+xml,%3Csvg width='1000' height='300' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_6958_40746)'%3E%3Cpath transform='matrix(-1 0 0 1 1000 0)' fill='url(%23paint0_linear_6958_40746)' d='M0 0h1000v300H0z'/%3E%3Cg clip-path='url(%23clip1_6958_40746)'%3E%3Cpath d='M18.203 90.702c29.375-29.375 76.993-29.375 106.367 0 67.745 73.346-33.05 174.1-106.367 106.367-29.369-29.369-29.369-76.993 0-106.367z' stroke='url(%23paint1_linear_6958_40746)' stroke-width='50' stroke-miterlimit='10'/%3E%3Cpath d='M18.215 90.71L138.002-29.074' stroke='url(%23paint2_linear_6958_40746)' stroke-width='50' stroke-miterlimit='10'/%3E%3Cpath d='M356.603 113.114c-29.375 29.375-76.993 29.375-106.368 0-67.745-73.347 33.051-174.1 106.368-106.368 29.368 29.37 29.368 76.993 0 106.368z' stroke='url(%23paint3_linear_6958_40746)' stroke-width='50' stroke-miterlimit='10'/%3E%3Cpath d='M356.622 113.105L245.501 224.226' stroke='url(%23paint4_linear_6958_40746)' stroke-width='50' stroke-miterlimit='10'/%3E%3Ccircle cx='191.698' cy='221.067' r='24.068' fill='%233858E9'/%3E%3C/g%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_6958_40746' x1='47' y1='46' x2='963.5' y2='318.5' gradientUnits='userSpaceOnUse'%3E%3Cstop/%3E%3Cstop offset='.65' stop-color='%233858E9'/%3E%3Cstop offset='1' stop-color='%23D3CDB6'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear_6958_40746' x1='218' y1='120.499' x2='51.502' y2='21.995' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D3CDB6'/%3E%3Cstop offset='.665' stop-color='%233858E9'/%3E%3Cstop offset='1'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint2_linear_6958_40746' x1='78' y1='-29.003' x2='216' y2='68.497' gradientUnits='userSpaceOnUse'%3E%3Cstop/%3E%3Cstop offset='.5' stop-color='%233858E9'/%3E%3Cstop offset='1' stop-color='%23D3CDB6'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint3_linear_6958_40746' x1='175.805' y1='53.58' x2='405.499' y2='103.005' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D3CDB6'/%3E%3Cstop offset='.608' stop-color='%233858E9'/%3E%3Cstop offset='1'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint4_linear_6958_40746' x1='414' y1='137.499' x2='180.5' y2='59.499' gradientUnits='userSpaceOnUse'%3E%3Cstop/%3E%3Cstop offset='.5' stop-color='%233858E9'/%3E%3Cstop offset='1' stop-color='%23D3CDB6'/%3E%3C/linearGradient%3E%3CclipPath id='clip0_6958_40746'%3E%3Cpath fill='%23fff' d='M0 0h1000v300H0z'/%3E%3C/clipPath%3E%3CclipPath id='clip1_6958_40746'%3E%3Cpath fill='%23fff' transform='translate(-29 -42)' d='M0 0h433v287.934H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
609}
610
611[dir="rtl"] .credits-php .about__header {
612 background-image: url("data:image/svg+xml,%3Csvg width='1000' height='300' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_6958_40757)'%3E%3Cpath transform='matrix(-1 0 0 1 1000 0)' fill='url(%23paint0_linear_6958_40757)' d='M0 0h1000v300H0z'/%3E%3Cpath d='M35.705 78.3C.637 43.233-56.21 43.233-91.279 78.3c-80.875 87.56 39.457 207.839 126.983 126.98 35.06-35.06 35.06-91.913 0-126.98z' stroke='url(%23paint1_linear_6958_40757)' stroke-width='50' stroke-miterlimit='10'/%3E%3Cpath d='M215.704 78.3c-35.067-35.067-91.914-35.067-126.982 0-80.875 87.56 39.456 207.839 126.982 126.98 35.061-35.06 35.061-91.913 0-126.98z' stroke='url(%23paint2_linear_6958_40757)' stroke-width='50' stroke-miterlimit='10'/%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_6958_40757' x1='378.5' y1='402' x2='926' y2='9.5' gradientUnits='userSpaceOnUse'%3E%3Cstop/%3E%3Cstop offset='.65' stop-color='%233858E9'/%3E%3Cstop offset='1' stop-color='%23D3CDB6'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear_6958_40757' x1='127.894' y1='159.202' x2='-32.648' y2='-1.337' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D3CDB6'/%3E%3Cstop offset='.665' stop-color='%233858E9'/%3E%3Cstop offset='1'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint2_linear_6958_40757' x1='307.894' y1='159.202' x2='147.352' y2='-1.337' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D3CDB6'/%3E%3Cstop offset='.665' stop-color='%233858E9'/%3E%3Cstop offset='1'/%3E%3C/linearGradient%3E%3CclipPath id='clip0_6958_40757'%3E%3Cpath fill='%23fff' d='M0 0h1000v300H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
613}
614
615[dir="rtl"] .freedoms-php .about__header {
616 background-image: url("data:image/svg+xml,%3Csvg width='1000' height='300' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_6958_40762)'%3E%3Cpath transform='matrix(-1 0 0 1 1000 0)' fill='url(%23paint0_linear_6958_40762)' d='M0 0h1000v300H0z'/%3E%3Cpath d='M152.889 61.731a1 1 0 0 0-1.778 0L121.6 119.167a1.006 1.006 0 0 1-.433.433l-57.436 29.511a1 1 0 0 0 0 1.778l57.436 29.511c.186.096.337.247.433.433l29.511 57.436a1 1 0 0 0 1.778 0l29.511-57.436c.096-.186.247-.337.433-.433l57.436-29.511a1 1 0 0 0 0-1.778L182.833 119.6a1.006 1.006 0 0 1-.433-.433l-29.511-57.436z' stroke='url(%23paint1_linear_6958_40762)' stroke-width='50' stroke-miterlimit='10'/%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_6958_40762' x1='47' y1='46' x2='1264.5' y2='46' gradientUnits='userSpaceOnUse'%3E%3Cstop/%3E%3Cstop offset='.65' stop-color='%233858E9'/%3E%3Cstop offset='1' stop-color='%23D3CDB6'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear_6958_40762' x1='307.894' y1='167.202' x2='147.352' y2='6.663' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D3CDB6'/%3E%3Cstop offset='.665' stop-color='%233858E9'/%3E%3Cstop offset='1'/%3E%3C/linearGradient%3E%3CclipPath id='clip0_6958_40762'%3E%3Cpath fill='%23fff' d='M0 0h1000v300H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
617}
618
619[dir="rtl"] .privacy-php .about__header {
620 background-image: url("data:image/svg+xml,%3Csvg width='1000' height='300' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_6958_40765)'%3E%3Cpath transform='matrix(-1 0 0 1 1000 0)' fill='url(%23paint0_radial_6958_40765)' d='M0 0h1000v300H0z'/%3E%3Cpath d='M242 90l-90-30-90 30v11.511C62 161.402 97.27 215.676 152 240c54.729-24.324 90-78.598 90-138.489V90z' stroke='url(%23paint1_linear_6958_40765)' stroke-width='50' stroke-miterlimit='10'/%3E%3C/g%3E%3Cdefs%3E%3CradialGradient id='paint0_radial_6958_40765' cx='0' cy='0' r='1' gradientUnits='userSpaceOnUse' gradientTransform='rotate(37.724 183.217 1253.89) scale(615.701 397.883)'%3E%3Cstop stop-color='%23D3CDB6'/%3E%3Cstop offset='.35' stop-color='%233858E9'/%3E%3Cstop offset='1'/%3E%3C/radialGradient%3E%3ClinearGradient id='paint1_linear_6958_40765' x1='307.894' y1='167.202' x2='147.352' y2='6.663' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D3CDB6'/%3E%3Cstop offset='.665' stop-color='%233858E9'/%3E%3Cstop offset='1'/%3E%3C/linearGradient%3E%3CclipPath id='clip0_6958_40765'%3E%3Cpath fill='%23fff' d='M0 0h1000v300H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
621}
622
623[dir="rtl"] .contribute-php .about__header {
624 background-image: url("data:image/svg+xml,%3Csvg width='1000' height='300' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cg clip-path='url(%23clip0_6958_40768)'%3E%3Cpath transform='matrix(-1 0 0 1 1000 0)' fill='url(%23paint0_linear_6958_40768)' d='M0 0h1000v300H0z'/%3E%3Cpath d='M241.498 149.134a1 1 0 0 1 0 1.732L88.43 239.135a1 1 0 0 1-1.5-.866V61.731a1 1 0 0 1 1.5-.866l153.068 88.269z' stroke='url(%23paint1_linear_6958_40768)' stroke-width='50' stroke-miterlimit='10'/%3E%3C/g%3E%3Cdefs%3E%3ClinearGradient id='paint0_linear_6958_40768' x1='606.5' x2='721' y2='355' gradientUnits='userSpaceOnUse'%3E%3Cstop/%3E%3Cstop offset='.65' stop-color='%233858E9'/%3E%3Cstop offset='1' stop-color='%23D3CDB6'/%3E%3C/linearGradient%3E%3ClinearGradient id='paint1_linear_6958_40768' x1='176' y1='45.5' x2='-6.506' y2='213.124' gradientUnits='userSpaceOnUse'%3E%3Cstop stop-color='%23D3CDB6'/%3E%3Cstop offset='.64' stop-color='%233858E9'/%3E%3Cstop offset='1'/%3E%3C/linearGradient%3E%3CclipPath id='clip0_6958_40768'%3E%3Cpath fill='%23fff' d='M0 0h1000v300H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E");
625}
626
627
628.about__header-image {
629 margin: 0 0 calc(var(--gap) * 1.5);
630}
631
632.about__header-title {
633 box-sizing: border-box;
634 margin: 0;
635 padding: 0;
636}
637
638.about__header-title h1 {
639 margin: 0;
640 padding: 0;
641 /* Fluid font size scales on browser size 960px - 1200px. */
642 font-size: clamp(2rem, 20vw - 9rem, 4rem);
643 line-height: 1;
644 font-weight: 600;
645}
646
647.about-php .about__header-title h1,
648.credits-php .about__header-title h1,
649.freedoms-php .about__header-title h1,
650.privacy-php .about__header-title h1,
651.contribute-php .about__header-title h1 {
652 /* Fluid font size scales on browser size 960px - 1200px. */
653 font-size: clamp(2rem, 20vw - 9rem, 4rem);
654}
655
656.about__header-text {
657 box-sizing: border-box;
658 max-width: 26em;
659 margin: 1rem 0 0;
660 padding: 0;
661 font-size: 1.6rem;
662 line-height: 1.15;
663}
664
665.about__header-navigation {
666 position: relative;
667 z-index: 1;
668 display: flex;
669 flex-wrap: wrap;
670 justify-content: space-between;
671 padding-top: 0;
672 margin-bottom: var(--gap);
673 background: var(--nav-background);
674 color: var(--nav-color);
675 border-bottom: 3px solid var(--nav-border);
676}
677
678.about__header-navigation::after {
679 display: none;
680}
681
682.about__header-navigation .nav-tab {
683 margin-right: 0;
684 padding: calc(var(--gap) * 0.75) var(--gap);
685 float: none;
686 font-size: 1.4em;
687 line-height: 1;
688 border-width: 0 0 3px;
689 border-style: solid;
690 border-color: transparent;
691 background: transparent;
692 color: inherit;
693}
694
695.about__header-navigation .nav-tab:hover,
696.about__header-navigation .nav-tab:active {
697 background-color: var(--nav-current);
698 color: var(--text-light);
699}
700
701.about__header-navigation .nav-tab-active {
702 margin-bottom: -3px;
703 color: var(--nav-current);
704 border-width: 0 0 6px;
705 border-color: var(--nav-current);
706}
707
708.about__header-navigation .nav-tab-active:hover,
709.about__header-navigation .nav-tab-active:active {
710 background-color: var(--nav-current);
711 color: var(--text-light);
712 border-color: var(--nav-current);
713}
714
715@media screen and (max-width: 960px) {
716 .about__header {
717 padding-left: 21rem;
718 }
719
720 .about-php .about__header-title h1,
721 .credits-php .about__header-title h1,
722 .freedoms-php .about__header-title h1,
723 .privacy-php .about__header-title h1,
724 .contribute-php .about__header-title h1 {
725 /* Fluid font size scales on browser size 600px - 960px. */
726 font-size: clamp(2rem, 20vw - 9rem, 4rem);
727 }
728
729 .about__header-navigation .nav-tab {
730 padding: calc(var(--gap) * 0.75) calc(var(--gap) * 0.5);
731 }
732}
733
734@media screen and (max-width: 782px) {
735 .about__container .about__header-text {
736 font-size: 1.4em;
737 }
738
739 .about__header-container {
740 display: block;
741 }
742
743 .about__header {
744 padding: var(--gap);
745 padding-left: 17rem;
746 }
747
748 .about__header-text {
749 margin-top: 0.5rem;
750 }
751
752 .about__header-navigation .nav-tab {
753 margin-top: 0;
754 margin-left: 0;
755 font-size: 1.2em;
756 }
757}
758
759@media screen and (max-width: 600px) {
760 .about__header {
761 min-height: auto;
762 padding-left: var(--gap);
763 }
764
765 .about__header,
766 .credits-php .about__header,
767 .freedoms-php .about__header,
768 .privacy-php .about__header,
769 .contribute-php .about__header {
770 background: var(--accent-gradient) !important;
771 }
772
773 .about__header-navigation {
774 display: block;
775 }
776
777 .about__header-navigation .nav-tab {
778 display: block;
779 margin-bottom: 0;
780 padding: calc(var(--gap) / 2);
781 border-right-width: 6px;
782 border-bottom: none;
783 }
784
785 .about__header-navigation .nav-tab-active {
786 border-bottom: none;
787 border-right-width: 6px;
788 }
789}
790
791
792/*------------------------------------------------------------------------------
793 2.0 - Credits Page
794------------------------------------------------------------------------------*/
795
796.about__section .wp-people-group-title {
797 margin-bottom: calc(var(--gap) * 2 - 10px);
798 text-align: center;
799
800}
801
802.about__section .wp-people-group {
803 margin: 0;
804 display: flex;
805 flex-wrap: wrap;
806}
807
808.about__section .wp-person {
809 display: inline-block;
810 vertical-align: top;
811 box-sizing: border-box;
812 margin-bottom: calc(var(--gap) - 10px);
813 width: 25%;
814 text-align: center;
815}
816
817.about__section .compact .wp-person {
818 height: auto;
819 width: 20%;
820}
821
822.about__section .wp-person-avatar {
823 display: block;
824 margin: 0 auto calc(var(--gap) / 2);
825 width: 140px;
826 height: 140px;
827 border-radius: 100%;
828 overflow: hidden;
829}
830
831.about__section .wp-person .gravatar {
832 width: 140px;
833 height: 140px;
834 filter: grayscale(100%);
835}
836
837.about__section .compact .wp-person-avatar,
838.about__section .compact .wp-person .gravatar {
839 width: 80px;
840 height: 80px;
841}
842
843.about__section .wp-person .web {
844 display: block;
845 font-size: 1.4em;
846 font-weight: 600;
847 padding: 10px 10px 0;
848 text-decoration: none;
849}
850
851.about__section .wp-person .web:hover {
852 text-decoration: underline;
853}
854
855.about__section .compact .wp-person .web {
856 font-size: 1.2em;
857}
858
859.about__section .wp-person .title {
860 display: block;
861 margin-top: 0.5em;
862}
863
864@media screen and (max-width: 782px) {
865 .about__section .wp-person {
866 width: 33%;
867 }
868
869 .about__section .compact .wp-person {
870 width: 25%;
871 }
872
873 .about__section .wp-person-avatar,
874 .about__section .wp-person .gravatar {
875 width: 120px;
876 height: 120px;
877 }
878}
879
880@media screen and (max-width: 600px) {
881 .about__section .wp-person {
882 width: 50%;
883 }
884
885 .about__section .compact .wp-person {
886 width: 33%;
887 }
888
889 .about__section .wp-person .web {
890 font-size: 1.2em;
891 }
892}
893
894@media screen and (max-width: 480px) {
895 .about__section .wp-person {
896 min-width: 100%;
897 }
898
899 .about__section .wp-person .web {
900 font-size: 1em;
901 }
902
903 .about__section .compact .wp-person .web {
904 font-size: 1em;
905 }
906}
907
908
909/*------------------------------------------------------------------------------
910 3.0 - Freedoms Page
911------------------------------------------------------------------------------*/
912
913.about__section .column .freedom-image {
914 margin-bottom: var(--gap);
915 max-height: 180px;
916}
917
918
919/*------------------------------------------------------------------------------
920 4.0 - Privacy Page
921------------------------------------------------------------------------------*/
922
923.about__section .column .privacy-image {
924 display: block;
925 margin-right: auto;
926 margin-left: auto;
927 max-width: 25rem;
928}
929
930
931/*------------------------------------------------------------------------------
932 x.2.0 - Legacy About Styles: Global
933------------------------------------------------------------------------------*/
934
935.about-wrap {
936 position: relative;
937 margin: 25px 20px 0 40px;
938 max-width: 1050px; /* readability */
939 font-size: 15px;
940}
941
942.about-wrap.full-width-layout {
943 max-width: 1200px;
944}
945
946.about-wrap-content {
947 max-width: 1050px;
948}
949
950.about-wrap div.updated,
951.about-wrap div.error,
952.about-wrap .notice {
953 display: none !important;
954}
955
956.about-wrap hr {
957 border: 0;
958 height: 0;
959 margin: 3em 0 0;
960 border-top: 1px solid rgba(0, 0, 0, 0.1);
961}
962
963.about-wrap img {
964 margin: 0;
965 width: 100%;
966 height: auto;
967 vertical-align: middle;
968}
969
970.about-wrap .inline-svg img {
971 max-width: 100%;
972 width: auto;
973 height: auto;
974}
975
976.about-wrap video {
977 margin: 1.5em auto;
978}
979
980/* WordPress Version Badge */
981
982.wp-badge {
983 background: #0073aa url(../images/w-logo-white.png?ver=20160308) no-repeat;
984 background-position: center 25px;
985 background-size: 80px 80px;
986 color: #fff;
987 font-size: 14px;
988 text-align: center;
989 font-weight: 600;
990 margin: 5px 0 0;
991 padding-top: 120px;
992 height: 40px;
993 display: inline-block;
994 width: 140px;
995 text-rendering: optimizeLegibility;
996 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2);
997}
998
999.svg .wp-badge {
1000 background-image: url(../images/wordpress-logo-white.svg?ver=20160308);
1001}
1002
1003.about-wrap .wp-badge {
1004 position: absolute;
1005 top: 0;
1006 left: 0;
1007}
1008
1009/* Tabs */
1010
1011.about-wrap .nav-tab {
1012 padding-left: 15px;
1013 padding-right: 15px;
1014 font-size: 18px;
1015 line-height: 1.33333333;
1016}
1017
1018/* x.2.1 - Typography */
1019
1020.about-wrap h1 {
1021 margin: 0.2em 0 0 200px;
1022 padding: 0;
1023 color: #32373c;
1024 line-height: 1.2;
1025 font-size: 2.8em;
1026 font-weight: 400;
1027}
1028
1029.about-wrap h2 {
1030 margin: 40px 0 0.6em;
1031 font-size: 2.7em;
1032 line-height: 1.3;
1033 font-weight: 300;
1034 text-align: center;
1035}
1036
1037.about-wrap h3 {
1038 margin: 1.25em 0 0.6em;
1039 font-size: 1.4em;
1040 line-height: 1.5;
1041}
1042
1043.about-wrap h4 {
1044 font-size: 16px;
1045 color: #23282d;
1046}
1047
1048.about-wrap p {
1049 line-height: 1.5;
1050 font-size: 16px;
1051}
1052
1053.about-wrap code,
1054.about-wrap ol li p {
1055 font-size: 14px;
1056 font-weight: 400;
1057}
1058
1059.about-wrap figcaption {
1060 font-size: 13px;
1061 text-align: center;
1062 color: white;
1063 text-overflow: ellipsis;
1064}
1065
1066.about-wrap .about-description,
1067.about-wrap .about-text {
1068 margin-top: 1.4em;
1069 font-weight: 400;
1070 line-height: 1.6;
1071 font-size: 19px;
1072}
1073
1074.about-wrap .about-text {
1075 margin: 1em 0 1em 200px;
1076 color: #555d66;
1077}
1078
1079/* x.2.2 - Structure */
1080
1081.about-wrap .has-1-columns,
1082.about-wrap .has-2-columns,
1083.about-wrap .has-3-columns,
1084.about-wrap .has-4-columns {
1085 display: grid;
1086 max-width: 800px;
1087 margin-top: 40px;
1088 margin-right: auto;
1089 margin-left: auto;
1090}
1091
1092.about-wrap .column {
1093 margin-left: 20px;
1094 margin-right: 20px;
1095}
1096
1097.about-wrap .is-wide {
1098 max-width: 760px;
1099}
1100
1101.about-wrap .is-fullwidth {
1102 max-width: 100%;
1103}
1104
1105.about-wrap .has-1-columns {
1106 display: block;
1107 max-width: 680px;
1108 margin: 0 auto 40px;
1109}
1110
1111.about-wrap .has-2-columns {
1112 grid-template-columns: 1fr 1fr;
1113}
1114
1115.about-wrap .has-2-columns .column:nth-of-type(2n+1) {
1116 grid-column-start: 1;
1117}
1118
1119.about-wrap .has-2-columns .column:nth-of-type(2n) {
1120 grid-column-start: 2;
1121}
1122
1123.about-wrap .has-2-columns.is-wider-right {
1124 grid-template-columns: 1fr 2fr;
1125}
1126
1127.about-wrap .has-2-columns.is-wider-left {
1128 grid-template-columns: 2fr 1fr;
1129}
1130
1131.about-wrap .has-3-columns {
1132 grid-template-columns: repeat(3, 1fr);
1133}
1134
1135.about-wrap .has-3-columns .column:nth-of-type(3n+1) {
1136 grid-column-start: 1;
1137}
1138
1139.about-wrap .has-3-columns .column:nth-of-type(3n+2) {
1140 grid-column-start: 2;
1141}
1142
1143.about-wrap .has-3-columns .column:nth-of-type(3n) {
1144 grid-column-start: 3;
1145}
1146
1147.about-wrap .has-4-columns {
1148 grid-template-columns: repeat(4, 1fr);
1149}
1150
1151.about-wrap .has-4-columns .column:nth-of-type(4n+1) {
1152 grid-column-start: 1;
1153}
1154
1155.about-wrap .has-4-columns .column:nth-of-type(4n+2) {
1156 grid-column-start: 2;
1157}
1158
1159.about-wrap .has-4-columns .column:nth-of-type(4n+3) {
1160 grid-column-start: 3;
1161}
1162
1163.about-wrap .has-4-columns .column:nth-of-type(4n) {
1164 grid-column-start: 4;
1165}
1166
1167.about-wrap .column :first-child {
1168 margin-top: 0;
1169}
1170
1171.about-wrap .aligncenter {
1172 text-align: center;
1173}
1174
1175.about-wrap .alignleft {
1176 float: right;
1177 margin-left: 40px;
1178}
1179
1180.about-wrap .alignright {
1181 float: left;
1182 margin-right: 40px;
1183}
1184
1185.about-wrap .is-vertically-aligned-top {
1186 align-self: flex-start;
1187}
1188
1189.about-wrap .is-vertically-aligned-center {
1190 align-self: center;
1191}
1192
1193.about-wrap .is-vertically-aligned-bottom {
1194 align-self: end;
1195}
1196
1197/* x.2.3 - Point Releases */
1198
1199.about-wrap .point-releases {
1200 margin-top: 5px;
1201 border-bottom: 1px solid #ddd;
1202}
1203
1204.about-wrap .changelog {
1205 margin-bottom: 40px;
1206}
1207
1208.about-wrap .changelog.point-releases h3 {
1209 padding-top: 35px;
1210}
1211
1212.about-wrap .changelog.point-releases h3:first-child {
1213 padding-top: 7px;
1214}
1215
1216.about-wrap .changelog.feature-section .col {
1217 margin-top: 40px;
1218}
1219
1220/*------------------------------------------------------------------------------
1221 x.3.0 - Legacy About Styles: About Page
1222------------------------------------------------------------------------------*/
1223
1224/* x.3.1 - Typography */
1225
1226.about-wrap .lead-description {
1227 font-size: 1.5em;
1228 text-align: center;
1229}
1230
1231.about-wrap .feature-section p {
1232 margin-top: 0.6em;
1233}
1234
1235/* x.3.2 - Structure */
1236
1237.about-wrap .headline-feature {
1238 margin: 0 auto 40px;
1239 max-width: 680px;
1240}
1241
1242.about-wrap .headline-feature h2 {
1243 margin: 50px 0 0;
1244}
1245
1246.about-wrap .headline-feature img {
1247 max-width: 600px;
1248 width: 100%;
1249}
1250
1251/* Go to Dashboard Home link */
1252
1253.about-wrap .return-to-dashboard {
1254 margin: 30px -5px 0 0;
1255 font-size: 14px;
1256 font-weight: 600;
1257}
1258
1259.about-wrap .return-to-dashboard a {
1260 text-decoration: none;
1261 padding: 0 5px;
1262}
1263
1264/*------------------------------------------------------------------------------
1265 x.4.0 - Legacy About Styles: Credits & Freedoms Pages
1266------------------------------------------------------------------------------*/
1267
1268/* Credits */
1269
1270.about-wrap h2.wp-people-group {
1271 margin: 2.6em 0 1.33em;
1272 padding: 0;
1273 font-size: 16px;
1274 line-height: inherit;
1275 font-weight: 600;
1276 text-align: right;
1277}
1278
1279.about-wrap .wp-people-group {
1280 padding: 0 5px;
1281 margin: 0 -5px 0 -15px;
1282}
1283
1284.about-wrap .compact {
1285 margin-bottom: 0;
1286}
1287
1288.about-wrap .wp-person {
1289 display: inline-block;
1290 vertical-align: top;
1291 margin-left: 10px;
1292 padding-bottom: 15px;
1293 height: 70px;
1294 width: 280px;
1295}
1296
1297.about-wrap .compact .wp-person {
1298 height: auto;
1299 width: 180px;
1300 padding-bottom: 0;
1301 margin-bottom: 0;
1302}
1303
1304.about-wrap .wp-person .gravatar {
1305 float: right;
1306 margin: 0 0 10px 10px;
1307 padding: 1px;
1308 width: 60px;
1309 height: 60px;
1310}
1311
1312.about-wrap .compact .wp-person .gravatar {
1313 width: 30px;
1314 height: 30px;
1315}
1316
1317.about-wrap .wp-person .web {
1318 margin: 6px 0 2px;
1319 font-size: 16px;
1320 font-weight: 400;
1321 line-height: 2;
1322 text-decoration: none;
1323}
1324
1325.about-wrap .wp-person .title {
1326 display: block;
1327}
1328
1329.about-wrap #wp-people-group-validators + p.wp-credits-list {
1330 margin-top: 0;
1331}
1332
1333.about-wrap p.wp-credits-list a {
1334 white-space: nowrap;
1335}
1336
1337/* Freedoms */
1338
1339.freedoms-php .about-wrap ol {
1340 margin: 40px 60px;
1341}
1342
1343.freedoms-php .about-wrap ol li {
1344 list-style-type: decimal;
1345 font-weight: 600;
1346}
1347
1348.freedoms-php .about-wrap ol p {
1349 font-weight: 400;
1350 margin: 0.6em 0;
1351}
1352
1353/*------------------------------------------------------------------------------
1354 x.5.0 - Legacy About Styles: Media Queries
1355------------------------------------------------------------------------------*/
1356
1357@media screen and (max-width: 782px) {
1358 .about-wrap .has-3-columns,
1359 .about-wrap .has-4-columns {
1360 grid-template-columns: 1fr 1fr;
1361 }
1362
1363 .about-wrap .has-3-columns .column:nth-of-type(3n+1),
1364 .about-wrap .has-4-columns .column:nth-of-type(4n+1) {
1365 grid-column-start: 1;
1366 grid-row-start: 1;
1367 }
1368
1369 .about-wrap .has-3-columns .column:nth-of-type(3n+2),
1370 .about-wrap .has-4-columns .column:nth-of-type(4n+2) {
1371 grid-column-start: 2;
1372 grid-row-start: 1;
1373 }
1374
1375 .about-wrap .has-3-columns .column:nth-of-type(3n),
1376 .about-wrap .has-4-columns .column:nth-of-type(4n+3) {
1377 grid-column-start: 1;
1378 grid-row-start: 2;
1379 }
1380
1381 .about-wrap .has-4-columns .column:nth-of-type(4n) {
1382 grid-column-start: 2;
1383 grid-row-start: 2;
1384 }
1385}
1386
1387@media screen and (max-width: 600px) {
1388 .about-wrap .has-2-columns,
1389 .about-wrap .has-3-columns,
1390 .about-wrap .has-4-columns {
1391 display: block;
1392 }
1393
1394 .about-wrap :not(.is-wider-right):not(.is-wider-left) .column {
1395 margin-left: 0;
1396 margin-right: 0;
1397 }
1398
1399 .about-wrap .has-2-columns.is-wider-right,
1400 .about-wrap .has-2-columns.is-wider-left {
1401 display: grid;
1402 }
1403}
1404
1405@media only screen and (max-width: 500px) {
1406 .about-wrap {
1407 margin-left: 20px;
1408 margin-right: 10px;
1409 }
1410
1411 .about-wrap h1,
1412 .about-wrap .about-text {
1413 margin-left: 0;
1414 }
1415
1416 .about-wrap .about-text {
1417 margin-bottom: 0.25em;
1418 }
1419
1420 .about-wrap .wp-badge {
1421 position: relative;
1422 margin-bottom: 1.5em;
1423 width: 100%;
1424 }
1425}
1426
1427@media only screen and (max-width: 480px) {
1428 .about-wrap .has-2-columns.is-wider-right,
1429 .about-wrap .has-2-columns.is-wider-left {
1430 display: block;
1431 }
1432
1433 .about-wrap .column {
1434 margin-left: 0;
1435 margin-right: 0;
1436 }
1437
1438 .about-wrap .has-2-columns.is-wider-right img,
1439 .about-wrap .has-2-columns.is-wider-left img {
1440 max-width: 160px;
1441 }
1442}
1443