font-size: 1.2307692308em;
border-top: 1px solid #dcdcde;
.modal .button-secondary,
.modal .button-primary:active {
vertical-align: baseline;
@media (max-width: 900px) {
@media (max-width: 782px) {
@media (max-width: 600px) {
border: 1px solid #dcdcde;
.jp-info-img img:first-child {
@media (max-width: 782px) {
.content-container.modal-footer {
margin-top: 1.4285714286em;
padding: 10em 0 4.2857142857em;
.footer::before, .footer::after {
.footer .download-jetpack {
@media (min-width: 1147px) {
@media (max-width: 1147px) {
background-size: 160% auto;
@media (max-width: 900px) {
@media (max-width: 782px) {
@media (max-width: 530px) {
@media (max-width: 320px) {
.footer nav a:hover, .footer nav a:focus,
.footer nav a:visited:hover,
.footer nav a:visited:focus {
@media (max-width: 1147px) {
.footer nav a:hover, .footer nav a:focus,
.footer nav a:visited:hover,
.footer nav a:visited:focus {
@media (max-width: 530px) {
padding: 25px 15px 10px 15px;
border-bottom: 1px solid #f0f0f1;
@media (min-width: 782px) {
border-bottom: 1px solid #f0f0f1;
@media (min-width: 1147px) {
@media (max-width: 782px) {
@media (max-width: 530px) {
border-top: 1px solid #f0f0f1;
.footer .a8c-attribution {
font-size: 0.7857142857em;
font-family: "Gill Sans", "Gill Sans MT", Helvetica, Arial, sans-serif;
text-transform: uppercase;
.footer .a8c-attribution a {
.footer .a8c-attribution a::after {
font-size: 1.5454545455em;
font-family: "automatticons";
.footer .a8c-attribution a:hover::after {
animation: jetpack-candy 0.4s ease-in-out;
@media (min-width: 782px) {
padding: 0 15px 10px 15px;
border-bottom: 1px solid #f0f0f1;
@media (min-width: 1147px) {
padding: 0 15px 10px 15px;
background: rgb(0, 160.5, 19.0222222222);
border: 1px solid rgb(0, 109.5, 12.9777777778);
.jetpack-message.is-opt-in {
box-shadow: 0 1px 1px 0 rgba(0, 0, 0, 0.1);
.subhead .jetpack-message.is-opt-in {
.subhead .jetpack-message.is-opt-in .jp-button {
.jetpack-message.is-opt-in p {
.jetpack-message.is-opt-in .jp-button {
.jetpack-message .squeezer {
padding: 23px 23px 23px 80px;
.jetpack-message .squeezer::before {
.jetpack-message .squeezer h2 {
@media (max-width: 530px) {
.jetpack-message .squeezer {
.jetpack-message .squeezer::before {
.jetpack-message .squeezer a {
border-bottom: 1px solid #d5e4bd;
.jetpack-message .squeezer a:hover {
border-bottom: 1px solid #f1f6e9;
.jetpack-message.error .squeezer::before, .jetpack-message.jetpack-err .squeezer::before {
.configure-module .jetpack-message {
@media (max-width: 530px) {
.wrap.inner.jp-support .jp-support-column-left {
.wrap.inner.jp-support .jp-support-column-left .widget-text {
.wrap.inner.jp-support .jp-support-column-right {
@media screen and (max-width: 515px) {
.jp-frame .header-nav li {
.jp-frame .header-nav .jetpack-logo {
.jp-frame .header-nav .jetpack-modules {
.jp-frame .header-nav .jetpack-modules + .jetpack-modules {
.jp-frame .header-nav .jetpack-modules:nth-child(4) {
.jp-frame .header-nav .jetpack-modules:nth-child(4) a {
#ie-legacy-notice .dops-notice__content {
* color.adjust( $gray, $lightness: 10% )
* color.adjust( $gray, $lightness: 20% )
* color.adjust( $gray, $lightness: 30% )
* color.adjust( $gray, $lightness: -10% )
* color.adjust( $gray, $lightness: -20% )
* color.adjust( $gray, $lightness: -30% )
* See wordpress.com/design-handbook/colors/ for more info.
* Convert px to rem in a readable fashion.
* Example: font-size: rem.convert( 21px );
.page-content.configure {
padding-top: 1.4285714286em;
.configure .frame.top.fixed {
border-bottom: 1px solid #e9e9e9;
box-shadow: 0 2px 2px -2px #f0f0f1;
@media (max-width: 782px) {
.configure .frame.top.fixed {
padding-top: 1.4285714286em;
@media (max-width: 600px) {
.configure .frame.top.fixed {
.jp-frame-top-fixed .configure {
@media (max-width: 782px) {
@media (max-width: 530px) {
border: 1.5px solid rgb(0, 0, 0);
border-bottom: 1px solid #dcdcde;
.fixed-top .tablenav.top {