1 /*------------------------------------------------------------------------------
4 1.0 Global: About, Credits, Freedoms
11 3.0 Credits & Freedoms Pages
12 ------------------------------------------------------------------------------*/
14 /*------------------------------------------------------------------------------
15 1.0 - Global: About, Credits, Freedoms
16 ------------------------------------------------------------------------------*/
20 margin: 25px 40px 0 20px;
21 max-width: 1050px; /* readability */
25 .about-wrap div.updated,
26 .about-wrap div.error,
28 display: none !important;
35 border-top: 1px solid rgba(0, 0, 0, 0.1);
42 vertical-align: middle;
45 .about-wrap .jetpack-video-wrapper {
49 /* WordPress Version Badge */
52 background: #0073aa url(../images/w-logo-white.png?ver=20131202) no-repeat;
53 background-position: center 24px;
54 -webkit-background-size: 85px 85px;
55 background-size: 85px 85px;
63 display: inline-block;
65 text-rendering: optimizeLegibility;
66 -webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.2);
67 box-shadow: 0 1px 3px rgba(0,0,0,0.2);
71 background-image: url(../images/wordpress-logo-white.svg?ver=20131110);
74 .about-wrap .wp-badge {
82 .about-wrap h2.nav-tab-wrapper {
86 .about-wrap h2 .nav-tab {
87 padding: 4px 15px 6px;
95 /* 1.1 - Typography */
103 margin: 0.2em 200px 0 0;
112 margin: 1.25em 0 .6em;
122 .about-wrap ol li p {
127 .about-wrap .about-description,
128 .about-wrap .about-text {
135 .about-wrap .about-text {
136 margin: 1em 200px 1em 0;
141 /* 1.2 - Structure */
143 .about-wrap [class$=col] .col {
147 .about-wrap .two-col .col {
148 margin-right: 4.799999999%;
152 .about-wrap .three-col .col {
153 margin-right: 4.999999999%;
157 .about-wrap .two-col .col:nth-of-type(2n),
158 .about-wrap .three-col .col:nth-of-type(3n) {
162 /* 1.3 - Point Releases */
164 .about-wrap .point-releases {
166 border-bottom: 1px solid #dfdfdf;
169 .about-wrap .changelog.point-releases h3 {
173 .about-wrap .changelog.point-releases h3:first-child {
177 /*------------------------------------------------------------------------------
179 ------------------------------------------------------------------------------*/
181 /* 2.1 - Typography */
183 .about-wrap .headline-feature h2 {
191 .about-wrap .headline-feature h3 {
196 .about-wrap .feature-list h2 {
201 .about-wrap .feature-section h4 {
202 margin: 1.4em 0 0.6em 0;
206 .about-wrap .feature-section p {
210 /* 2.2 - Structure */
212 .about-wrap .feature-video {
215 padding-bottom: 56.25%; /* video is 1280 x 720 */
221 .about-wrap .feature-video embed {
229 .about-wrap .featured-image {
233 .about-wrap .feature-section {
236 border-bottom: 1px solid rgba(0, 0, 0, 0.1);
239 .about-wrap .headline-feature .feature-section {
244 .about-wrap .feature-section .media-container {
245 border: 1px solid #ddd;
249 .about-wrap .feature-section .svg-container {
252 background-color: #e1e1e3;
255 .about-wrap .feature-section .svg-container img {
259 .about-wrap .feature-section:not(.under-the-hood) .col {
263 .about-wrap .changelog {
267 .about-wrap .changelog.feature-section .col {
271 /* Return to Dashboard Home link */
273 .about-wrap .return-to-dashboard {
274 margin: 30px 0 0 -5px;
279 .about-wrap .return-to-dashboard a {
280 text-decoration: none;
284 .about-wrap .feature-list.finer-points h4,
285 .about-wrap .feature-list.finer-points p {
289 /*------------------------------------------------------------------------------
290 3.0 - Credits & Freedoms Pages
291 ------------------------------------------------------------------------------*/
295 .about-wrap h4.wp-people-group {
300 .about-wrap ul.wp-people-group {
303 margin: 0 -15px 0 -5px;
306 .about-wrap ul.compact {
310 .about-wrap li.wp-person {
311 display: inline-block;
314 padding-bottom: 15px;
319 .about-wrap ul.compact li.wp-person {
326 .about-wrap li.wp-person img.gravatar {
328 margin: 0 10px 10px 0;
334 .about-wrap ul.compact li.wp-person img.gravatar {
339 .about-wrap li.wp-person a.web {
345 text-decoration: none;
348 .about-wrap #wp-people-group-validators + p.wp-credits-list {
352 .about-wrap p.wp-credits-list a {
358 .freedoms-php .about-wrap ol {
362 .freedoms-php .about-wrap ol li {
363 list-style-type: decimal;
367 .freedoms-php .about-wrap ol p {
372 /*------------------------------------------------------------------------------
374 ------------------------------------------------------------------------------*/
376 @media screen and ( max-width: 782px ) {
377 .about-wrap .feature-section {
382 .about-wrap [class$=col] .col {
387 border-bottom: 1px solid rgba(0, 0, 0, 0.1);
390 .about-wrap .three-col img {
395 .about-wrap .feature-list .col {
401 .about-wrap .headline-feature .feature-section {
405 .about-wrap .feature-list .feature-section {
410 @media only screen and (max-width: 500px) {
417 .about-wrap .about-text {
421 .about-wrap .about-text {
422 margin-bottom: 0.25em;
425 .about-wrap .wp-badge {
427 margin-bottom: 1.5em;
431 .about-wrap h2.nav-tab-wrapper {
436 .about-wrap h2 .nav-tab {
439 border-bottom: 1px solid #ccc;
442 .about-wrap .feature-section .svg-container {
444 padding-bottom: 20px;
447 .about-wrap .three-col .col,
448 .about-wrap .headline-feature .feature-section .col {
449 width: 100% !important;
450 float: none !important;
454 @media only screen and (max-width: 400px) {
455 .about-wrap .feature-list svg {
460 .about-wrap .feature-list.finer-points h4,
461 .about-wrap .feature-list.finer-points p {