.merchant-patcher-eol { position: relative; } .merchant-patcher-eol a.notice-dismiss { text-decoration: none; } .wp-core-ui .merchant-patcher-eol-bar.notice { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: calc(100% + 20px); min-height: 50px; margin: 0; -webkit-margin-start: -20px; margin-inline-start: -20px; padding-block: 16px; padding-inline: 20px 48px; border: 0; border-top: 3px solid #3858E9; border-bottom: 3px solid #3858E9; border-radius: 0; -webkit-box-shadow: none; box-shadow: none; -webkit-box-sizing: border-box; box-sizing: border-box; } .wp-core-ui .merchant-patcher-eol-bar.notice p { margin: 0; padding: 0; font-size: 14px; line-height: 18px; text-align: center; } .wp-core-ui .merchant-patcher-eol-bar.notice a.notice-dismiss { top: 50%; inset-inline-end: 20px; width: 20px; height: 20px; padding: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%); } .wp-core-ui .merchant-patcher-eol-bar.notice a.notice-dismiss:before { width: 20px; height: 20px; margin: 0; color: #646970; font-size: 20px; line-height: 20px; } @media screen and (max-width: 782px) { .wp-core-ui .merchant-patcher-eol-bar.notice { width: calc(100% + 10px); -webkit-margin-start: -10px; margin-inline-start: -10px; padding-inline: 10px 40px; } .wp-core-ui .merchant-patcher-eol-bar.notice a.notice-dismiss { inset-inline-end: 10px; } } @media screen and (max-width: 600px) { .wp-core-ui .merchant-patcher-eol-bar.notice { -webkit-padding-before: 62px; padding-block-start: 62px; border-top: 0; } } .merchant-notice { background-color: #FFF; border-color: #DDE2E7; border-left-color: #3858E9; padding: 15px 60px 20px 20px !important; color: #6D7175; } .merchant-notice .merchant-btn { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; font-size: 14px; font-weight: 600; padding: 8px 16px; border: 1px solid #757575; border-radius: 4px; text-decoration: none; -webkit-transition: ease color 300ms, ease background-color 300ms, ease border-color 300ms; transition: ease color 300ms, ease background-color 300ms, ease border-color 300ms; } .merchant-notice .merchant-btn + .merchant-btn { margin-left: 20px; } .merchant-notice .merchant-btn-primary { background-color: #3858E9; border-color: #3858E9; color: #FFF; } .merchant-notice .merchant-btn-primary:hover { background-color: #4d6aee; border-color: #4d6aee; } .merchant-notice .merchant-btn-secondary { background-color: #FFF; border-color: #3858E9; color: #3858E9; } .merchant-notice .merchant-btn-secondary:hover { background-color: #f5f5f5; border-color: #4d6aee; color: #4d6aee; } .merchant-notice .merchant-btn-link { border: none !important; background-color: transparent !important; color: #4d6aee; padding: 0; text-decoration: underline; } .merchant-notice .merchant-btn-link:hover { color: #4d6aee; } .merchant-notice h3 { font-size: 20px; line-height: 30px; margin: 0; } .merchant-notice h3 + p { margin-top: 10px; } .merchant-notice p { font-size: 13px; line-height: 20px; margin: 0; padding: 0; } .merchant-notice p + .merchant-btn { margin-top: 15px; } .merchant-notice strong { color: #212121; } .merchant-notice .notice-dismiss { padding: 14px; } .merchant-notice .notice-dismiss:before { content: "\f335"; font-size: 19px; color: #757575; -webkit-transition: ease color 300ms; transition: ease color 300ms; } .merchant-notice .notice-dismiss:active:before, .merchant-notice .notice-dismiss:focus:before, .merchant-notice .notice-dismiss:hover:before { color: #212121; } .merchant-notice.merchant-notice-with-thumbnail { background-image: url(../../images/admin/notice-thumbnail.png); background-repeat: no-repeat; background-position: 20px 20px; background-size: 89px; padding-left: 135px !important; }