­ ­ ­ ­ ­ ­ ­ ­ ­ ­ ­ ­ ­ ­ ­ ­ ­ ­ @import "variables"; /** * CDN styles * * @since 3.0 */ @include body-class { .sui-wrap { .sui-box-settings-row .sui-box-settings-col-1 { vertical-align: top; } &.wrap-smush-cdn .sui-block-content-center p { max-width: 600px; margin: 20px auto 30px; } .sui-cdn { form p:first-of-type { margin-top: 0; } } .wp-smush-stats { display: flex; align-items: center; line-height: 0; .sui-tooltip { line-height: 10px; margin-right: 10px; } } /* Filename Extensions Icons */ .smush-filename-extension { border-radius: 4px; display: inline-block; font-size: 9px; font-weight: 600; color: #fff; text-transform: uppercase; text-align: center; line-height: 43px; height: 30px; margin: 0 5px 0 0; width: 30px; &.smush-extension-jpeg, &.smush-extension-jpg { background-color: #F7E100; } &.smush-extension-png { background-color: #FFB694; } &.smush-extension-gif { background-color: #72D5D4; } &.smush-extension-webp { background-color: #72ADD5; } &.smush-extension-svg { background-color: #88D572; } &.smush-extension-iframe { background-color: #8772D5; font-size: 7px; } } &.wrap-smush-cdn { /* Pro features list in Free */ .smush-pro-features { max-width: 350px; margin: 0 auto 30px auto; text-align: left; .smush-pro-feature-row { .smush-pro-feature-title { font-size: 12px; line-height: 14px; &:before { font-size: 12px; } } &:not(:last-child) { border-bottom: 1px solid #F2F2F2; padding-bottom: 12px; margin-bottom: 12px; } } } } } }