.wpcf7 .screen-reader-response {
position: absolute;
overflow: hidden;
clip: rect(1px, 1px, 1px, 1px);
clip-path: inset(50%);
height: 1px;
width: 1px;
margin: -1px;
padding: 0;
border: 0;
word-wrap: normal !important;
}
.wpcf7 .hidden-fields-container {
display: none;
}
.wpcf7 form .wpcf7-response-output {
margin: 2em 0.5em 1em;
padding: 0.2em 1em;
border: 2px solid #00a0d2; }
.wpcf7 form.init .wpcf7-response-output,
.wpcf7 form.resetting .wpcf7-response-output,
.wpcf7 form.submitting .wpcf7-response-output {
display: none;
}
.wpcf7 form.sent .wpcf7-response-output {
border-color: #46b450; }
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output {
border-color: #dc3232; }
.wpcf7 form.spam .wpcf7-response-output {
border-color: #f56e28; }
.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output {
border-color: #ffb900; }
.wpcf7-form-control-wrap {
position: relative;
}
.wpcf7-not-valid-tip {
color: #dc3232; font-size: 1em;
font-weight: normal;
display: block;
}
.use-floating-validation-tip .wpcf7-not-valid-tip {
position: relative;
top: -2ex;
left: 1em;
z-index: 100;
border: 1px solid #dc3232;
background: #fff;
padding: .2em .8em;
width: 24em;
}
.wpcf7-list-item {
display: inline-block;
margin: 0 0 0 1em;
}
.wpcf7-list-item-label::before,
.wpcf7-list-item-label::after {
content: " ";
}
.wpcf7-spinner {
visibility: hidden;
display: inline-block;
background-color: #23282d; opacity: 0.75;
width: 24px;
height: 24px;
border: none;
border-radius: 100%;
padding: 0;
margin: 0 24px;
position: relative;
}
form.submitting .wpcf7-spinner {
visibility: visible;
}
.wpcf7-spinner::before {
content: '';
position: absolute;
background-color: #fbfbfc; top: 4px;
left: 4px;
width: 6px;
height: 6px;
border: none;
border-radius: 100%;
transform-origin: 8px 8px;
animation-name: spin;
animation-duration: 1000ms;
animation-timing-function: linear;
animation-iteration-count: infinite;
}
@media (prefers-reduced-motion: reduce) {
.wpcf7-spinner::before {
animation-name: blink;
animation-duration: 2000ms;
}
}
@keyframes spin {
from {
transform: rotate(0deg);
}
to {
transform: rotate(360deg);
}
}
@keyframes blink {
from {
opacity: 0;
}
50% {
opacity: 1;
}
to {
opacity: 0;
}
}
.wpcf7 [inert] {
opacity: 0.5;
}
.wpcf7 input[type="file"] {
cursor: pointer;
}
.wpcf7 input[type="file"]:disabled {
cursor: default;
}
.wpcf7 .wpcf7-submit:disabled {
cursor: not-allowed;
}
.wpcf7 input[type="url"],
.wpcf7 input[type="email"],
.wpcf7 input[type="tel"] {
direction: ltr;
}
.wpcf7-reflection > output {
display: list-item;
list-style: none;
}
.wpcf7-reflection > output[hidden] {
display: none;
}.wpcf7 form{position:relative}.wpcf7 form>div,.wpcf7 form>p{margin-bottom:1.2em}.wpcf7 .wpcf7-form-control-wrap{width:100%;display:block}.wpcf7 input:not([type=submit]):focus,.wpcf7 select:focus,.wpcf7 textarea:focus{border-color:var(--ast-border-color);outline:0}.wpcf7 input:not([type=submit]),.wpcf7 select,.wpcf7 textarea{width:100%;padding:.75em}.wpcf7 input[type=file]{color:#666;height:auto;border-width:1px;border-style:solid;border-color:var(--ast-border-color);border-radius:2px;background:#fafafa;box-shadow:none;box-sizing:border-box;transition:all .2s linear}.wpcf7 input[type=checkbox],.wpcf7 input[type=radio]{display:inline-block;background:#e9eef2;color:#555;clear:none;cursor:pointer;line-height:0;height:1.2em;margin:-3px 4px 0 0;outline:0;padding:0;border-radius:.2em;text-align:center;vertical-align:middle;width:1.4em;min-width:1.4em;transition:all .2s linear}.wp-block-image.spectra-mask img{mask-image:var(--spectra-mask-image);-webkit-mask-image:var(--spectra-mask-image);mask-position:var(--spectra-mask-position,center center);-webkit-mask-position:var(--spectra-mask-position,center center);mask-repeat:var(--spectra-mask-repeat,no-repeat);-webkit-mask-repeat:var(--spectra-mask-repeat,no-repeat);mask-size:var(--spectra-mask-size,contain);-webkit-mask-size:var(--spectra-mask-size,contain)}.spectra-responsive-hidden{background:repeating-linear-gradient(125deg,#0000000d,#0000000d 1px,#0000 2px,#0000 9px);opacity:.4}.spectra-responsive-icons{align-items:last baseline;display:inline-flex;gap:.4rem;margin:0 0 0 .4rem;padding:0}.spectra-responsive-icons button.spectra-responsive-icon{backface-visibility:hidden;background:none;border:none;cursor:pointer;height:.825rem;line-height:1;margin:0;padding:0;transition:opacity .15s ease,transform .15s ease;width:.825rem}.spectra-responsive-icons button.spectra-responsive-icon svg{height:100%;width:100%;fill:none;shape-rendering:geometricPrecision;display:block;will-change:transform}.spectra-responsive-icons button.spectra-responsive-icon.is-active svg,.spectra-responsive-icons button.spectra-responsive-icon:hover svg{stroke:var(--wp-components-color-accent,var(--wp-admin-theme-color,#007cba))}.spectra-responsive-icons button.spectra-responsive-icon:focus{box-shadow:none;outline:none}.components-tools-panel.spectra-enhanced-panel .components-tools-panel-header h2{display:inline-flex;width:100%}.components-tools-panel.spectra-enhanced-panel .spectra-responsive-help-notice{grid-column:span 2;position:relative;z-index:1}.components-tools-panel.spectra-enhanced-panel .spectra-responsive-help-notice.components-notice.is-info{display:block!important}.components-tools-panel.spectra-enhanced-panel .spectra-responsive-help-notice+.components-tools-panel__item:first-of-type{margin-top:0}.components-panel__body.spectra-enhanced-panel .components-base-control__label,.components-panel__body.spectra-enhanced-panel .components-input-control__label,.components-panel__body.spectra-enhanced-panel .components-toggle-control__label,.components-panel__body.spectra-enhanced-panel .spacing-sizes-control__label,.components-panel__body.spectra-enhanced-panel label,.spectra-enhanced-panel .spectra-enhanced-control .components-base-control__label,.spectra-enhanced-panel .spectra-enhanced-control .components-input-control__label,.spectra-enhanced-panel .spectra-enhanced-control .components-toggle-control__label,.spectra-enhanced-panel .spectra-enhanced-control .spacing-sizes-control__label,.spectra-enhanced-panel .spectra-enhanced-control label,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item .components-base-control__label,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item .components-input-control__label,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item .components-toggle-control__label,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item .spacing-sizes-control__label,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item label{align-items:center;display:inline-flex;position:relative}.components-panel__body.spectra-enhanced-panel .components-base-control__label:after,.components-panel__body.spectra-enhanced-panel .components-input-control__label:after,.components-panel__body.spectra-enhanced-panel .components-toggle-control__label:after,.components-panel__body.spectra-enhanced-panel .spacing-sizes-control__label:after,.components-panel__body.spectra-enhanced-panel label:after,.spectra-enhanced-panel .spectra-enhanced-control .components-base-control__label:after,.spectra-enhanced-panel .spectra-enhanced-control .components-input-control__label:after,.spectra-enhanced-panel .spectra-enhanced-control .components-toggle-control__label:after,.spectra-enhanced-panel .spectra-enhanced-control .spacing-sizes-control__label:after,.spectra-enhanced-panel .spectra-enhanced-control label:after,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item .components-base-control__label:after,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item .components-input-control__label:after,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item .components-toggle-control__label:after,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item .spacing-sizes-control__label:after,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item label:after{backface-visibility:hidden;background-image:url("data:image/svg+xml;utf8,<svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\" class=\"lucide lucide-monitor-smartphone-icon lucide-monitor-smartphone\"><path d=\"M18 8V6a2 2 0 0 0-2-2H4a2 2 0 0 0-2 2v7a2 2 0 0 0 2 2h8\"/><path d=\"M10 19v-3.96 3.15\"/><path d=\"M7 19h5\"/><rect width=\"6\" height=\"10\" x=\"16\" y=\"12\" rx=\"2\"/></svg>");background-position:50%;background-repeat:no-repeat;background-size:contain;content:"";display:inline-block;height:.825rem;image-rendering:crisp-edges;margin-left:.4rem;transform:translateZ(0);transition:background-image .1s ease-out;vertical-align:middle;width:.825rem;will-change:transform}.spectra-enhanced-control[aria-label="Slider Settings"] .components-flex .components-base-control:not(:first-child):not(:nth-child(2)) .components-toggle-control__label:after,.spectra-enhanced-control[aria-label="Slider Settings"] .components-flex .components-base-control:not(:first-child):not(:nth-child(2)) label:after,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item[aria-label="Drop cap"] .components-toggle-control__label:after,.typography-block-support-panel.spectra-enhanced-panel .components-tools-panel-item[aria-label="Drop cap"] label:after{display:none}.spectra-updating{transition:none!important;visibility:hidden!important}.spectra-responsive-icons.spectra-injecting{opacity:0;transition:none}.has-z-index.has-z-index{position:relative;z-index:var(--spectra-z-index,auto)!important}.wwso-sticker,
a.wwso-sticker {
box-sizing: border-box;
z-index: 999999;
text-decoration: none;
color: inherit;
} .wwso-placement-fixed {
position: fixed;
}
a.wwso-sticker,
.wwso-has-link {
text-decoration: none !important;
color: inherit !important;
cursor: pointer;
}
a.wwso-sticker:hover,
.wwso-has-link:hover {
text-decoration: none !important;
color: inherit !important;
}
.wwso-has-link:focus,
a.wwso-sticker:focus {
outline: none;
} .wwso-sticker,
a.wwso-sticker {
display: inline-flex;
align-items: center;
justify-content: center;
padding: 14px 18px;
font-weight: 700;
font-size: 14px;
line-height: 1.2;
box-shadow: 0 10px 25px rgba(0, 0, 0, 0.18);
max-width: 220px;
min-width: 80px;
text-align: center;
word-break: break-word;
white-space: normal;
overflow: visible;
position: relative;
isolation: isolate;
}
.wwso-sticker:hover,
a.wwso-sticker:hover {
text-decoration: none;
transform: translateY(-2px);
box-shadow:
0 16px 34px rgba(0, 0, 0, 0.22),
inset 0 -2px 0 rgba(0, 0, 0, 0.10);
}
.wwso-sticker::before,
a.wwso-sticker::before {
content: "";
position: absolute;
inset: 0;
border-radius: inherit;
pointer-events: none;
z-index: 0;
opacity: 0.22;
background: linear-gradient(
180deg,
rgba(255, 255, 255, 0.55) 0%,
rgba(255, 255, 255, 0.18) 32%,
rgba(255, 255, 255, 0) 60%
);
}
.wwso-sticker::after,
a.wwso-sticker::after {
content: "";
position: absolute;
inset: 0;
border-radius: inherit;
pointer-events: none;
z-index: 0;
box-shadow: inset 0 -2px 0 rgba(0, 0, 0, 0.10);
opacity: 0.9;
}
.wwso-sticker-text {
display: block;
width: 100%;
font-size: var(--wwso-font-size, 14px);
font-weight: var(--wwso-font-weight, 700);
text-align: var(--wwso-text-align, center);
line-height: 1.3;
word-break: break-word;
margin: 0;
color: var(--wwso-text-color, inherit);
position: relative;
z-index: 1;
} .wwso-shape-rectangle {
border-radius: 10px;
}
.wwso-shape-rounded {
border-radius: 18px;
}
.wwso-shape-pill {
border-radius: 999px;
min-width: 150px;
min-height: 50px;
padding: 14px 22px;
box-shadow:
0 12px 30px rgba(0, 0, 0, 0.18),
inset 0 -2px 0 rgba(0, 0, 0, 0.10);
} .wwso-animate-pulse {
animation: wwsoPulse 1.8s infinite;
}
.wwso-animate-bounce {
animation: wwsoBounce 1.6s infinite;
}
.wwso-animate-shake {
animation: wwsoShake 1.5s infinite;
}
.wwso-animate-pulse:hover,
.wwso-animate-bounce:hover,
.wwso-animate-shake:hover {
transform-origin: center;
}
@keyframes wwsoPulse {
0%, 100% {
transform: scale(1);
}
50% {
transform: scale(1.05);
}
}
@keyframes wwsoBounce {
0%, 100% {
transform: translateY(0);
}
50% {
transform: translateY(-8px);
}
}
@keyframes wwsoShake {
0%, 100% {
transform: rotate(0deg);
}
25% {
transform: rotate(-2deg);
}
75% {
transform: rotate(2deg);
}
} .wwso-overlay {
display: none;
position: fixed;
inset: 0;
z-index: 9999999;
opacity: 0;
transition: opacity 0.28s ease;
}
.wwso-overlay.is-visible {
display: block !important;
opacity: 1;
}
.wwso-overlay-backdrop {
position: absolute;
inset: 0;
background:
radial-gradient(circle at top, rgba(37, 99, 235, 0.12), transparent 38%),
rgba(15, 23, 42, 0.62);
backdrop-filter: blur(6px);
-webkit-backdrop-filter: blur(6px);
}
.wwso-overlay-box {
position: relative;
z-index: 2;
width: min(92%, 560px);
margin: 9vh auto 0;
padding: 34px 30px 28px;
border-radius: 24px;
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(248, 250, 252, 0.98));
color: #0f172a;
box-shadow:
0 30px 80px rgba(15, 23, 42, 0.28),
0 10px 30px rgba(15, 23, 42, 0.12);
border: 1px solid rgba(255, 255, 255, 0.7);
transform: translateY(24px) scale(0.98);
opacity: 0;
transition:
transform 0.34s ease,
opacity 0.34s ease;
overflow: hidden;
}
.wwso-overlay-box::before {
content: "";
position: absolute;
inset: 0 0 auto 0;
height: 6px;
background: linear-gradient(90deg, #2563eb, #7c3aed, #ec4899);
}
.wwso-overlay-box::after {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
background:
radial-gradient(circle at top right, rgba(37, 99, 235, 0.08), transparent 26%),
radial-gradient(circle at bottom left, rgba(124, 58, 237, 0.08), transparent 26%);
}
.wwso-overlay.is-visible .wwso-overlay-box {
transform: translateY(0) scale(1);
opacity: 1;
}
.wwso-overlay-box-banner {
width: min(94%, 760px);
min-height: 300px;
padding: 40px 34px 30px;
background-repeat: no-repeat;
background-origin: border-box;
background-clip: padding-box;
}
.wwso-overlay-box-banner::after {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
background:
linear-gradient(180deg, rgba(15, 23, 42, 0.18), rgba(15, 23, 42, 0.34)),
radial-gradient(circle at top right, rgba(255, 255, 255, 0.10), transparent 30%);
}
.wwso-overlay-box-banner .wwso-overlay-title,
.wwso-overlay-box-banner .wwso-overlay-text,
.wwso-overlay-box-banner .wwso-overlay-button-wrap,
.wwso-overlay-box-banner .wwso-overlay-button,
.wwso-overlay-box-banner .wwso-overlay-close {
position: relative;
z-index: 2;
}
.wwso-overlay-title {
margin: 0 38px 14px 0;
font-size: 32px;
line-height: 1.12;
font-weight: 800;
letter-spacing: -0.02em;
color: #0f172a;
position: relative;
z-index: 1;
}
.wwso-overlay-text {
margin: 0 0 24px;
line-height: 1.7;
font-size: 16px;
color: #334155;
position: relative;
z-index: 1;
}
.wwso-overlay-text p:last-child {
margin-bottom: 0;
}
.wwso-overlay-button-wrap {
display: flex;
width: 100%;
margin-top: 6px;
position: relative;
z-index: 1;
}
.wwso-overlay-button-align-left {
justify-content: flex-start;
}
.wwso-overlay-button-align-center {
justify-content: center;
}
.wwso-overlay-button-align-right {
justify-content: flex-end;
}
.wwso-overlay-button-align-full {
justify-content: stretch;
}
.wwso-overlay-button {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 10px;
min-height: 48px;
padding: 13px 22px;
border-radius: 14px;
background: linear-gradient(135deg, #111827, #1f2937);
color: #fff !important;
text-decoration: none !important;
border: none;
cursor: pointer;
font-weight: 700;
font-size: 15px;
box-shadow:
0 12px 26px rgba(17, 24, 39, 0.25),
inset 0 1px 0 rgba(255, 255, 255, 0.12);
transition:
transform 0.18s ease,
box-shadow 0.18s ease,
opacity 0.18s ease;
position: relative;
z-index: 1;
}
.wwso-overlay-button-full {
width: 100%;
}
.wwso-overlay-button::after {
content: "→";
font-size: 16px;
line-height: 1;
}
.wwso-overlay-button:hover {
color: #fff !important;
text-decoration: none !important;
transform: translateY(-2px);
box-shadow:
0 18px 34px rgba(17, 24, 39, 0.32),
inset 0 1px 0 rgba(255, 255, 255, 0.14);
}
.wwso-overlay-button:active {
transform: translateY(0);
}
.wwso-overlay-close {
position: absolute;
top: 16px;
right: 16px;
width: 38px;
height: 38px;
border: 0;
border-radius: 999px;
background: rgba(15, 23, 42, 0.06);
color: #334155;
font-size: 24px;
cursor: pointer;
line-height: 1;
display: inline-flex;
align-items: center;
justify-content: center;
transition:
background 0.18s ease,
transform 0.18s ease,
color 0.18s ease;
z-index: 3;
}
.wwso-overlay-close:hover {
background: rgba(15, 23, 42, 0.12);
color: #0f172a;
transform: rotate(90deg);
} @media (max-width: 768px) {
.wwso-sticker,
a.wwso-sticker {
font-size: 13px;
padding: 12px 14px;
max-width: 170px;
}
.wwso-shape-pill {
min-width: 120px;
min-height: 42px;
padding: 12px 16px;
}
.wwso-overlay-box {
width: min(94%, 560px);
margin-top: 10vh;
padding: 28px 20px 22px;
border-radius: 20px;
}
.wwso-overlay-box-banner {
width: min(94%, 560px);
min-height: 240px;
padding: 28px 20px 22px;
background-position: center center !important;
}
.wwso-overlay-title {
font-size: 24px;
margin-right: 32px;
}
.wwso-overlay-text {
font-size: 15px;
line-height: 1.6;
}
.wwso-overlay-button-wrap,
.wwso-overlay-button-align-left,
.wwso-overlay-button-align-center,
.wwso-overlay-button-align-right,
.wwso-overlay-button-align-full {
justify-content: stretch;
}
.wwso-overlay-button,
.wwso-overlay-button-full {
width: 100%;
}
.wwso-overlay-close {
top: 12px;
right: 12px;
width: 34px;
height: 34px;
font-size: 22px;
}
}a.wwso-item.wwso-pro-rendered,
a.wwso-item.wwso-pro-rendered:hover,
a.wwso-item.wwso-pro-rendered:focus,
a.wwso-item.wwso-pro-rendered:active,
a.wwso-sticker-image,
a.wwso-mascot-motion,
a.wwso-bubble,
a.wwso-type-image,
a.wwso-type-sticker-image,
a.wwso-image,
a.wwso-flying-banner-wrap,
a.wwso-flying-banner-wrap:hover,
a.wwso-flying-banner-wrap:focus,
a.wwso-flying-banner-wrap:active,
.wwso-track-click.wwso-pro-rendered,
.wwso-track-click.wwso-pro-rendered:hover,
.wwso-track-click.wwso-pro-rendered:focus,
.wwso-track-click.wwso-pro-rendered:active {
text-decoration: none !important;
color: inherit !important;
}
a.wwso-item.wwso-pro-rendered,
a.wwso-sticker-image,
a.wwso-mascot-motion,
a.wwso-bubble,
a.wwso-image,
a.wwso-flying-banner-wrap,
.wwso-flying-banner-wrap,
.wwso-track-click.wwso-pro-rendered {
cursor: pointer;
} .wwso-sticker-image,
.wwso-image,
a.wwso-sticker-image,
a.wwso-image {
background: transparent !important;
padding: 0 !important;
border: 0 !important;
box-shadow: none !important;
width: auto !important;
max-width: none !important;
min-width: 0 !important;
min-height: 0 !important;
}
.wwso-sticker-image-inner {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 6px;
text-align: var(--wwso-text-align, center);
background: transparent !important;
box-shadow: none !important;
transition: opacity 0.2s ease, filter 0.2s ease;
}
.wwso-sticker-image img,
.wwso-image img {
display: block;
width: var(--wwso-image-width, 220px);
max-width: 100%;
height: auto;
background: transparent !important;
}
.wwso-sticker-image .wwso-sticker-text,
.wwso-image .wwso-sticker-text,
a.wwso-sticker-image .wwso-sticker-text,
a.wwso-image .wwso-sticker-text {
margin-top: 8px;
text-align: var(--wwso-text-align, center);
font-size: var(--wwso-font-size, 16px);
font-weight: var(--wwso-font-weight, 700);
line-height: 1.3;
word-break: break-word;
max-width: 220px;
color: var(--wwso-text-color, #111111);
} .wwso-placement-anchor,
.wwso-placement-shortcode {
max-width: none !important;
}
.wwso-placement-anchor {
position: absolute;
z-index: 999999;
margin: 0 !important;
}
.wwso-placement-shortcode {
position: relative;
z-index: 1;
display: inline-flex;
vertical-align: middle;
margin: 0;
} .wwso-mascot-motion,
a.wwso-mascot-motion {
background: transparent !important;
padding: 0 !important;
border: 0 !important;
box-shadow: none !important;
width: auto !important;
max-width: none !important;
min-width: 0 !important;
min-height: 0 !important;
will-change: transform;
pointer-events: auto;
overflow: visible !important;
transform: translate3d(0, 0, 0);
opacity: 1 !important;
visibility: visible !important;
}
.wwso-mascot-motion.wwso-placement-fixed,
a.wwso-mascot-motion.wwso-placement-fixed {
position: fixed !important;
z-index: 999999 !important;
}
.wwso-mascot-motion.wwso-placement-anchor,
a.wwso-mascot-motion.wwso-placement-anchor {
position: absolute !important;
z-index: 999999 !important;
}
.wwso-mascot-motion.wwso-placement-shortcode,
a.wwso-mascot-motion.wwso-placement-shortcode {
position: relative !important;
z-index: 1 !important;
display: inline-flex !important;
transform: none !important;
vertical-align: middle;
} .wwso-mascot-motion .wwso-mascot,
a.wwso-mascot-motion .wwso-mascot {
position: relative !important;
top: auto !important;
right: auto !important;
bottom: auto !important;
left: auto !important;
z-index: auto !important;
display: flex !important;
flex-direction: column;
align-items: center;
justify-content: center;
gap: 6px;
background: transparent !important;
padding: 0 !important;
border: 0 !important;
box-shadow: none !important;
width: auto !important;
max-width: none !important;
min-width: 0 !important;
min-height: 0 !important;
overflow: visible !important;
cursor: inherit;
text-decoration: none;
opacity: 1 !important;
visibility: visible !important;
transition: opacity 0.2s ease, filter 0.2s ease;
}
.wwso-mascot-motion .wwso-mascot-image {
background: transparent !important;
overflow: visible !important;
opacity: 1 !important;
visibility: visible !important;
}
.wwso-mascot-motion .wwso-mascot-image img {
display: block !important;
width: var(--wwso-image-width, 220px) !important;
max-width: 100% !important;
min-width: 0 !important;
height: auto !important;
background: transparent !important;
opacity: 1 !important;
visibility: visible !important;
}
.wwso-mascot-motion .wwso-mascot-text {
margin-top: 8px;
text-align: var(--wwso-text-align, center);
font-size: var(--wwso-font-size, 16px);
font-weight: var(--wwso-font-weight, 700);
line-height: 1.3;
word-break: break-word;
max-width: 220px;
color: var(--wwso-text-color, #111111);
opacity: 1 !important;
visibility: visible !important;
} .wwso-is-bubble,
.wwso-bubble,
a.wwso-bubble {
background: transparent !important;
padding: 0 !important;
border: 0 !important;
box-shadow: none !important;
text-decoration: none !important;
color: inherit !important;
}
.wwso-bubble,
a.wwso-bubble {
position: relative;
display: inline-flex !important;
align-items: center;
justify-content: center;
width: var(--wwso-image-width, 220px) !important;
max-width: 100%;
line-height: 1;
overflow: visible !important;
vertical-align: top;
isolation: isolate;
}
.wwso-bubble-box {
position: relative;
display: flex !important;
align-items: center;
justify-content: center;
width: 100%;
min-width: 120px;
min-height: 72px;
margin: 0 auto;
padding: 14px 16px;
color: var(--wwso-bubble-text, #111111);
text-align: var(--wwso-text-align, center);
font-size: var(--wwso-font-size, 16px);
font-weight: var(--wwso-font-weight, 700);
line-height: 1.3;
word-break: break-word;
overflow-wrap: anywhere;
box-sizing: border-box;
border-radius: 18px;
background-color: var(--wwso-bubble-fill-2, #f6d94c) !important;
background-image:
linear-gradient(180deg, var(--wwso-bubble-highlight, rgba(255,255,255,0.25)) 0%, rgba(255,255,255,0) 34%),
linear-gradient(180deg, var(--wwso-bubble-fill-1, #ffe96b) 0%, var(--wwso-bubble-fill-2, #f6d94c) 62%, var(--wwso-bubble-fill-3, #d9b72f) 100%) !important;
background-repeat: no-repeat !important;
background-size: 100% 100% !important;
box-shadow:
0 18px 32px var(--wwso-bubble-shadow, rgba(15, 23, 42, 0.18)),
0 6px 10px rgba(15, 23, 42, 0.08),
inset 0 2px 0 rgba(255,255,255,0.34),
inset 0 -3px 0 rgba(0,0,0,0.08);
transition: opacity 0.2s ease, filter 0.2s ease;
}
.wwso-bubble-box::before {
content: "";
position: absolute;
top: 8px;
left: 12px;
right: 12px;
height: 34%;
border-radius: 999px;
background: linear-gradient(180deg, rgba(255,255,255,0.28), rgba(255,255,255,0));
pointer-events: none;
z-index: 2;
}
.wwso-bubble-box::after {
content: "";
position: absolute;
bottom: -10px;
left: 18px;
width: 0;
height: 0;
border-style: solid;
border-width: 10px 10px 0 10px;
border-color: var(--wwso-bubble-tail, var(--wwso-bubble-fill-3, #d9b72f)) transparent transparent transparent;
filter: drop-shadow(0 4px 5px rgba(0,0,0,0.10));
z-index: 2;
}
.wwso-bubble-content,
.wwso-bubble-content p {
margin: 0;
}
.wwso-bubble-content {
position: relative;
z-index: 5;
display: block;
width: 100%;
line-height: 1.25;
text-align: var(--wwso-text-align, center);
text-shadow: 0 1px 0 rgba(255,255,255,0.10);
}
.wwso-bubble-content * {
color: inherit;
font-size: inherit;
font-weight: inherit;
line-height: inherit;
text-align: inherit;
margin-top: 0;
margin-bottom: 0;
}
.wwso-bubble-content-empty {
min-height: 1em;
} .wwso-bubble-rounded .wwso-bubble-box,
.wwso-bubble-rounded_left .wwso-bubble-box,
.wwso-bubble-rounded_right .wwso-bubble-box {
min-height: 76px;
border-radius: 22px;
}
.wwso-bubble-rounded_left .wwso-bubble-box::after,
.wwso-bubble-square_left .wwso-bubble-box::after {
left: 16px;
right: auto;
}
.wwso-bubble-rounded_right .wwso-bubble-box::after,
.wwso-bubble-square_right .wwso-bubble-box::after {
left: auto;
right: 16px;
}
.wwso-bubble-square .wwso-bubble-box,
.wwso-bubble-square_left .wwso-bubble-box,
.wwso-bubble-square_right .wwso-bubble-box {
min-height: 76px;
border-radius: 6px;
}
.wwso-bubble-soft .wwso-bubble-box {
min-height: 76px;
border-radius: 30px;
padding: 16px 18px;
} .wwso-bubble-badge,
a.wwso-bubble-badge {
width: var(--wwso-image-width, 120px) !important;
min-width: var(--wwso-image-width, 120px) !important;
max-width: var(--wwso-image-width, 120px) !important;
}
.wwso-bubble-badge .wwso-bubble-box {
width: var(--wwso-image-width, 120px) !important;
min-width: var(--wwso-image-width, 120px) !important;
height: var(--wwso-image-width, 120px) !important;
min-height: var(--wwso-image-width, 120px) !important;
aspect-ratio: 1 / 1;
border-radius: 50% !important;
padding: 14px !important;
}
.wwso-bubble-badge .wwso-bubble-box::after {
bottom: -10px;
left: 50%;
transform: translateX(-50%);
}
.wwso-bubble-ribbon .wwso-bubble-box {
min-height: 78px !important;
border-radius: 8px;
padding: 18px 22px !important;
}
.wwso-bubble-ribbon .wwso-bubble-box::after {
left: auto;
right: 16px;
} .wwso-bubble-thought .wwso-bubble-box {
min-height: 88px !important;
border-radius: 999px;
padding: 20px 22px !important;
}
.wwso-bubble-thought .wwso-bubble-box::before {
content: "";
position: absolute;
top: -8px;
right: 18px;
left: auto;
width: 72px;
height: 72px;
border-radius: 50%;
background:
linear-gradient(180deg, rgba(255,255,255,0.22), rgba(255,255,255,0)),
var(--wwso-bubble-fill-1, #ffe96b);
box-shadow:
-56px 12px 0 8px var(--wwso-bubble-fill-2, #f6d94c),
0 8px 18px rgba(15, 23, 42, 0.12);
pointer-events: none;
z-index: 1;
}
.wwso-bubble-thought .wwso-bubble-box::after {
content: "";
position: absolute;
bottom: -16px;
left: 28px;
width: 14px;
height: 14px;
border: none;
border-radius: 50%;
background: var(--wwso-bubble-tail, var(--wwso-bubble-fill-3, #d9b72f));
box-shadow:
-18px 18px 0 -2px var(--wwso-bubble-tail, var(--wwso-bubble-fill-3, #d9b72f)),
-34px 34px 0 -4px var(--wwso-bubble-tail, var(--wwso-bubble-fill-3, #d9b72f));
filter: drop-shadow(0 4px 5px rgba(0,0,0,0.10));
z-index: 2;
} .wwso-bubble-cloud {
padding-top: 28px;
}
.wwso-bubble-cloud .wwso-bubble-box {
min-height: 105px !important;
padding: 28px 26px 22px !important;
border-radius: 999px;
}
.wwso-bubble-cloud .wwso-bubble-box::before {
content: "";
position: absolute;
top: -24px;
left: 26px;
width: 46px;
height: 46px;
border-radius: 50%;
background:
linear-gradient(180deg, rgba(255,255,255,0.24) 0%, rgba(255,255,255,0.00) 36%),
var(--wwso-bubble-fill-1, #ffe96b);
box-shadow:
34px -8px 0 10px var(--wwso-bubble-fill-1, #ffe96b),
78px 2px 0 -2px var(--wwso-bubble-cloud-shade, var(--wwso-bubble-fill-2, #f6d94c)),
10px 10px 0 rgba(255,255,255,0.10);
filter: drop-shadow(0 8px 12px rgba(0,0,0,0.08));
pointer-events: none;
z-index: 2;
}
.wwso-bubble-cloud .wwso-bubble-box::after {
width: 16px;
height: 16px;
border: none;
border-radius: 50%;
background: var(--wwso-bubble-tail, var(--wwso-bubble-fill-3, #d9b72f));
bottom: -12px;
left: 28px;
box-shadow:
-18px 16px 0 0 var(--wwso-bubble-tail, var(--wwso-bubble-fill-3, #d9b72f)),
-34px 30px 0 -2px var(--wwso-bubble-tail, var(--wwso-bubble-fill-3, #d9b72f));
filter: drop-shadow(0 4px 5px rgba(0,0,0,0.10));
} .wwso-bubble-burst .wwso-bubble-box {
min-height: 130px !important;
aspect-ratio: 1.45 / 1;
padding: 28px 30px !important;
display: flex !important;
align-items: center;
justify-content: center;
clip-path: polygon(
50% 0%,
61% 15%,
78% 6%,
82% 24%,
100% 26%,
89% 42%,
100% 58%,
82% 60%,
78% 78%,
61% 69%,
50% 100%,
39% 69%,
22% 78%,
18% 60%,
0% 58%,
11% 42%,
0% 26%,
18% 24%,
22% 6%,
39% 15%
);
}
.wwso-bubble-burst .wwso-bubble-box::after {
display: none;
} .wwso-bubble-heart {
padding-top: 36px;
padding-right: 36px;
padding-left: 12px;
overflow: visible !important;
}
.wwso-bubble-heart .wwso-bubble-box {
position: relative;
width: 140px;
min-width: 140px;
height: 126px;
min-height: 126px;
flex-shrink: 0;
padding: 0 18px 8px;
margin: 0 auto;
display: flex !important;
align-items: center;
justify-content: center;
text-align: center;
border-radius: 18px;
background:
linear-gradient(180deg, var(--wwso-bubble-highlight, rgba(255,255,255,0.25)) 0%, rgba(255,255,255,0) 32%),
linear-gradient(180deg, var(--wwso-bubble-fill-1, #ff6b8a) 0%, var(--wwso-bubble-fill-2, #ef2d56) 62%, var(--wwso-bubble-fill-3, #b91c1c) 100%) !important;
transform: rotate(-45deg);
transform-origin: center center;
box-shadow:
0 18px 32px var(--wwso-bubble-shadow, rgba(15, 23, 42, 0.18)),
0 8px 14px rgba(15, 23, 42, 0.10),
inset 0 2px 0 rgba(255,255,255,0.20),
inset 0 -3px 0 rgba(0,0,0,0.08);
overflow: visible !important;
z-index: 1;
}
.wwso-bubble-heart .wwso-bubble-box::before,
.wwso-bubble-heart .wwso-bubble-box::after {
content: "";
position: absolute;
display: block;
background:
linear-gradient(180deg, rgba(255,255,255,0.22) 0%, rgba(255,255,255,0.00) 34%),
linear-gradient(180deg, var(--wwso-bubble-fill-1, #ff6b8a) 0%, var(--wwso-bubble-fill-2, #ef2d56) 62%, var(--wwso-bubble-fill-3, #b91c1c) 100%) !important;
pointer-events: none;
z-index: -1;
}
.wwso-bubble-heart .wwso-bubble-box::before {
width: 140px;
height: 126px;
border-radius: 50%;
top: -68px;
left: 0;
}
.wwso-bubble-heart .wwso-bubble-box::after {
width: 126px;
height: 126px;
border: none;
border-radius: 50%;
top: 0;
left: 68px;
filter: none;
}
.wwso-bubble-heart .wwso-bubble-content {
transform: rotate(45deg);
transform-origin: center center;
max-width: 82px;
line-height: 1.15;
color: var(--wwso-bubble-text, #ffffff);
text-shadow: 0 1px 0 rgba(0,0,0,0.12);
z-index: 5;
}
.wwso-bubble-heart .wwso-bubble-content * {
transform: none;
} .wwso-item.wwso-pro-rendered:not(.wwso-bubble):not(.wwso-is-bubble),
.wwso-item.wwso-pro-rendered:not(.wwso-bubble):not(.wwso-is-bubble) .wwso-sticker-image-inner,
.wwso-item.wwso-pro-rendered:not(.wwso-bubble):not(.wwso-is-bubble) .wwso-mascot,
.wwso-item.wwso-pro-rendered:not(.wwso-bubble):not(.wwso-is-bubble) .wwso-mascot-image {
background-color: transparent !important;
background-image: none !important;
}
.wwso-item.wwso-type-sticker-image.wwso-sticker-image,
.wwso-item.wwso-type-image.wwso-sticker-image,
.wwso-item.wwso-type-image.wwso-image,
a.wwso-item.wwso-type-image.wwso-image {
background: transparent !important;
border: 0 !important;
padding: 0 !important;
box-shadow: none !important;
} a.wwso-item.wwso-pro-rendered:hover .wwso-sticker-image-inner,
a.wwso-sticker-image:hover .wwso-sticker-image-inner,
a.wwso-image:hover .wwso-sticker-image-inner,
a.wwso-bubble:hover .wwso-bubble-box,
a.wwso-mascot-motion:hover .wwso-mascot,
.wwso-track-click.wwso-pro-rendered:hover .wwso-sticker-image-inner,
.wwso-track-click.wwso-pro-rendered:hover .wwso-bubble-box,
.wwso-track-click.wwso-pro-rendered:hover .wwso-mascot {
opacity: 0.96;
filter: brightness(1.02);
}
.wwso-render-context-shortcode a.wwso-item.wwso-pro-rendered:hover .wwso-sticker-image-inner,
.wwso-render-context-shortcode a.wwso-sticker-image:hover .wwso-sticker-image-inner,
.wwso-render-context-shortcode a.wwso-image:hover .wwso-sticker-image-inner,
.wwso-render-context-shortcode a.wwso-bubble:hover .wwso-bubble-box,
.wwso-render-context-shortcode a.wwso-mascot-motion:hover .wwso-mascot,
.wwso-render-context-shortcode .wwso-track-click.wwso-pro-rendered:hover .wwso-sticker-image-inner,
.wwso-render-context-shortcode .wwso-track-click.wwso-pro-rendered:hover .wwso-bubble-box,
.wwso-render-context-shortcode .wwso-track-click.wwso-pro-rendered:hover .wwso-mascot {
opacity: 1;
filter: none;
} .wwso-render-context-shortcode {
position: relative !important;
}
.wwso-render-context-shortcode.wwso-sticker-image,
.wwso-render-context-shortcode.wwso-image,
.wwso-render-context-shortcode.wwso-bubble,
.wwso-render-context-shortcode.wwso-item.wwso-pro-rendered,
a.wwso-render-context-shortcode.wwso-sticker-image,
a.wwso-render-context-shortcode.wwso-image,
a.wwso-render-context-shortcode.wwso-bubble,
a.wwso-render-context-shortcode.wwso-item.wwso-pro-rendered {
display: inline-flex;
vertical-align: middle;
}
.wwso-render-context-shortcode .wwso-sticker-text,
.wwso-render-context-shortcode .wwso-mascot-text {
max-width: min(220px, 40vw);
}
.wwso-render-context-shortcode.wwso-bubble,
a.wwso-render-context-shortcode.wwso-bubble {
width: var(--wwso-image-width, 220px) !important;
max-width: 100%;
} .wwso-render-context-footer.wwso-placement-anchor,
.wwso-render-context-shortcode.wwso-placement-anchor {
position: absolute !important;
z-index: 999999 !important;
} .wwso-animate-pulse {
animation: wwsoProPulse 1.8s ease-in-out infinite;
transform-origin: center center;
}
.wwso-animate-bounce {
animation: wwsoProBounce 1.2s ease-in-out infinite;
transform-origin: center bottom;
}
.wwso-animate-shake {
animation: wwsoProShake 0.9s ease-in-out infinite;
transform-origin: center center;
}
@keyframes wwsoProPulse {
0% { transform: scale(1); }
50% { transform: scale(1.06); }
100% { transform: scale(1); }
}
@keyframes wwsoProBounce {
0% { transform: translateY(0); }
25% { transform: translateY(-8px); }
50% { transform: translateY(0); }
75% { transform: translateY(-4px); }
100% { transform: translateY(0); }
}
@keyframes wwsoProShake {
0% { transform: translateX(0); }
15% { transform: translateX(-3px) rotate(-1deg); }
30% { transform: translateX(3px) rotate(1deg); }
45% { transform: translateX(-3px) rotate(-1deg); }
60% { transform: translateX(3px) rotate(1deg); }
75% { transform: translateX(-2px) rotate(-0.5deg); }
100% { transform: translateX(0); }
} .wwso-flying-banner-wrap,
a.wwso-flying-banner-wrap {
background: transparent !important;
padding: 0 !important;
border: 0 !important;
box-shadow: none !important;
width: auto !important;
max-width: none !important;
min-width: 0 !important;
min-height: 0 !important;
overflow: visible !important;
text-decoration: none !important;
color: inherit !important;
will-change: transform;
pointer-events: auto;
}
.wwso-flying-banner-wrap.wwso-placement-fixed,
a.wwso-flying-banner-wrap.wwso-placement-fixed {
position: fixed !important;
z-index: 999999 !important;
will-change: transform;
}
.wwso-flying-banner-wrap.wwso-placement-anchor,
a.wwso-flying-banner-wrap.wwso-placement-anchor {
position: absolute !important;
z-index: 999999 !important;
}
.wwso-flying-banner-wrap.wwso-placement-shortcode,
a.wwso-flying-banner-wrap.wwso-placement-shortcode {
position: relative !important;
z-index: 1 !important;
display: inline-flex !important;
vertical-align: middle;
}
.wwso-flying-banner-wrap.wwso-placement-fixed.wwso-flying-banner-direction-left_to_right {
animation: wwsoFlyingAcrossLTR var(--wwso-flying-duration, 14s) linear infinite;
}
.wwso-flying-banner-wrap.wwso-placement-fixed.wwso-flying-banner-direction-right_to_left {
animation: wwsoFlyingAcrossRTL var(--wwso-flying-duration, 14s) linear infinite;
}
.wwso-flying-banner {
position: relative;
display: inline-flex;
align-items: center;
gap: 0;
white-space: nowrap;
will-change: transform;
}
.wwso-flying-banner-direction-left_to_right .wwso-flying-banner {
flex-direction: row;
}
.wwso-flying-banner-direction-right_to_left .wwso-flying-banner {
flex-direction: row-reverse;
}
.wwso-flying-banner-direction-left_to_right .wwso-flying-banner-flyer {
transform: scaleX(-1);
transform-origin: center center;
}
.wwso-flying-banner-direction-right_to_left .wwso-flying-banner-flyer {
transform: none;
}
.wwso-flying-banner-rope {
width: 34px;
height: 2px;
flex: 0 0 34px;
margin: 0 6px;
background: linear-gradient(90deg, rgba(110,82,55,0.25) 0%, #8a6642 50%, rgba(110,82,55,0.25) 100%);
transform: rotate(-3deg);
transform-origin: center center;
animation: wwsoFlyingBannerRope 1.8s ease-in-out infinite;
opacity: 0.95;
}
.wwso-flying-banner-direction-right_to_left .wwso-flying-banner-rope {
transform: rotate(3deg);
}
.wwso-flying-banner-flag {
position: relative;
display: inline-flex;
align-items: center;
justify-content: center;
min-width: 190px;
min-height: 52px;
padding: 10px 18px;
border-radius: 14px;
background:
linear-gradient(180deg, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0.03) 100%),
linear-gradient(180deg, var(--wwso-banner-bg, #d90429) 0%, color-mix(in srgb, var(--wwso-banner-bg, #d90429) 82%, black 18%) 100%);
box-shadow:
0 10px 24px rgba(0,0,0,0.14),
inset 0 1px 0 rgba(255,255,255,0.20),
inset 0 -1px 0 rgba(0,0,0,0.10);
overflow: hidden;
animation: wwsoFlyingBannerWave 1.9s ease-in-out infinite;
}
.wwso-flying-banner-flag::before,
.wwso-flying-banner-flag::after {
content: "";
position: absolute;
top: 50%;
width: 7px;
height: 7px;
margin-top: -3.5px;
border-radius: 50%;
background: rgba(0,0,0,0.16);
box-shadow: inset 0 1px 1px rgba(255,255,255,0.25);
}
.wwso-flying-banner-flag::before {
left: 9px;
}
.wwso-flying-banner-flag::after {
right: 9px;
}
.wwso-flying-banner-flag span {
position: relative;
z-index: 2;
display: block;
margin: 0;
color: var(--wwso-banner-text, #ffffff);
text-align: center;
font-size: var(--wwso-font-size, 18px);
font-weight: var(--wwso-font-weight, 800);
line-height: 1.1;
letter-spacing: 0.3px;
word-break: break-word;
text-transform: uppercase;
text-shadow: 0 1px 1px rgba(0,0,0,0.12);
}
.wwso-flying-banner-flyer {
position: relative;
width: 154px;
height: 82px;
flex: 0 0 154px;
overflow: visible;
} .wwso-flying-plane {
position: absolute;
right: 0;
top: 14px;
width: 140px;
height: 46px;
border-radius: 28px 40px 18px 18px;
background: linear-gradient(180deg, var(--wwso-plane-color-1, #ffffff) 0%, var(--wwso-plane-color-2, #d1d5db) 100%);
box-shadow:
0 10px 18px rgba(0,0,0,0.14),
inset 0 1px 0 rgba(255,255,255,0.9),
inset 0 -1px 0 rgba(0,0,0,0.08);
animation: wwsoFlyingPlaneFloat 2.2s ease-in-out infinite;
}
.wwso-flying-plane::before {
content: "";
position: absolute;
inset: 6px 22px 18px 18px;
border-radius: 18px 24px 14px 14%;
background: linear-gradient(180deg, rgba(255,255,255,0.8), rgba(255,255,255,0.1));
opacity: 0.6;
}
.wwso-flying-plane-wing {
position: absolute;
left: 44px;
top: 24px;
width: 56px;
height: 10px;
border-radius: 999px;
background: linear-gradient(180deg, var(--wwso-plane-wing-1, #9ca3af), var(--wwso-plane-wing-2, #6b7280));
}
.wwso-flying-plane-tail {
position: absolute;
right: 10px;
top: 4px;
width: 20px;
height: 18px;
background: linear-gradient(180deg, var(--wwso-plane-tail-1, #6b7280), var(--wwso-plane-tail-2, #374151));
clip-path: polygon(0 100%, 100% 52%, 18% 0);
}
.wwso-flying-plane-propeller {
position: absolute;
left: -8px;
top: 10px;
width: 24px;
height: 24px;
border-radius: 50%;
background: radial-gradient(circle, var(--wwso-plane-propeller-core, #4b5563) 0 22%, var(--wwso-plane-propeller-ring, #e5e7eb) 23% 100%);
}
.wwso-flying-plane-propeller::before,
.wwso-flying-plane-propeller::after {
content: "";
position: absolute;
left: 10px;
top: -8px;
width: 4px;
height: 40px;
border-radius: 999px;
background: var(--wwso-plane-propeller-blade, rgba(200,210,220,0.7));
transform-origin: center center;
}
.wwso-flying-plane-propeller::before {
animation: wwsoFlyingPropellerBladeA 0.12s linear infinite;
}
.wwso-flying-plane-propeller::after {
animation: wwsoFlyingPropellerBladeB 0.12s linear infinite;
}
.wwso-flying-plane-eye,
.wwso-flying-plane-wheel {
display: none;
} .wwso-flying-glider {
position: absolute;
right: 0;
top: 10px;
width: 146px;
height: 70px;
animation: wwsoFlyingGliderFloat 2.4s ease-in-out infinite;
}
.wwso-flying-glider-body {
position: absolute;
left: 54px;
top: 26px;
width: 52px;
height: 14px;
border-radius: 999px;
background: linear-gradient(180deg, #f5f7fa 0%, #cfd8e3 100%);
box-shadow:
0 8px 18px rgba(0,0,0,0.12),
inset 0 1px 0 rgba(255,255,255,0.85);
}
.wwso-flying-glider-wing {
position: absolute;
left: 16px;
top: 14px;
width: 110px;
height: 12px;
border-radius: 999px 999px 12px 12px;
background: linear-gradient(180deg, #9fb7cc 0%, #73879b 100%);
transform: skewX(-10deg);
box-shadow: 0 5px 14px rgba(0,0,0,0.12);
}
.wwso-flying-glider-tail {
position: absolute;
left: 98px;
top: 18px;
width: 24px;
height: 14px;
background: linear-gradient(180deg, #8095aa 0%, #5e7285 100%);
clip-path: polygon(0 100%, 100% 50%, 0 0);
} .wwso-flying-bird {
position: absolute;
right: 0;
top: 8px;
width: 138px;
height: 72px;
animation: wwsoFlyingBirdFloat 1.7s ease-in-out infinite;
}
.wwso-flying-bird-body {
position: absolute;
left: 48px;
top: 24px;
width: 50px;
height: 26px;
border-radius: 40px 40px 28px 28px;
background: linear-gradient(180deg, #475569 0%, #334155 100%);
box-shadow: 0 8px 18px rgba(0,0,0,0.14);
}
.wwso-flying-bird-wing {
position: absolute;
top: 10px;
width: 38px;
height: 22px;
border-radius: 100% 100% 30% 30%;
background: linear-gradient(180deg, #64748b 0%, #475569 100%);
transform-origin: bottom center;
}
.wwso-flying-bird-wing.wing-left {
left: 38px;
animation: wwsoFlyingBirdWingLeft .55s ease-in-out infinite;
}
.wwso-flying-bird-wing.wing-right {
left: 68px;
animation: wwsoFlyingBirdWingRight .55s ease-in-out infinite;
}
.wwso-flying-bird-eye {
position: absolute;
left: 58px;
top: 33px;
width: 5px;
height: 5px;
border-radius: 50%;
background: rgba(255,255,255,0.85);
}
.wwso-flying-bird-eye::after {
content: "";
position: absolute;
inset: 1px;
border-radius: 50%;
background: #0f172a;
}
.wwso-flying-bird-beak {
position: absolute;
left: 42px;
top: 34px;
width: 12px;
height: 8px;
background: #f59e0b;
clip-path: polygon(0 50%, 100% 0, 100% 100%);
}
.wwso-flying-bird-tail {
position: absolute;
left: 94px;
top: 32px;
width: 20px;
height: 12px;
background: #1e293b;
clip-path: polygon(0 50%, 100% 0, 100% 100%);
} a.wwso-flying-banner-wrap:hover .wwso-flying-banner-flag,
a.wwso-flying-banner-wrap:hover .wwso-flying-plane,
a.wwso-flying-banner-wrap:hover .wwso-flying-glider,
a.wwso-flying-banner-wrap:hover .wwso-flying-bird,
.wwso-track-click.wwso-flying-banner-wrap:hover .wwso-flying-banner-flag,
.wwso-track-click.wwso-flying-banner-wrap:hover .wwso-flying-plane,
.wwso-track-click.wwso-flying-banner-wrap:hover .wwso-flying-glider,
.wwso-track-click.wwso-flying-banner-wrap:hover .wwso-flying-bird {
filter: brightness(1.03);
} .wwso-item.wwso-pro-rendered.wwso-sticker,
a.wwso-item.wwso-pro-rendered.wwso-sticker,
.wwso-item.wwso-pro-rendered.wwso-sticker:hover,
a.wwso-item.wwso-pro-rendered.wwso-sticker:hover {
background: transparent !important;
background-color: transparent !important;
background-image: none !important;
box-shadow: none !important;
border: 0 !important;
outline: 0 !important;
padding: 0 !important;
}
.wwso-item.wwso-pro-rendered.wwso-sticker::before,
.wwso-item.wwso-pro-rendered.wwso-sticker::after,
a.wwso-item.wwso-pro-rendered.wwso-sticker::before,
a.wwso-item.wwso-pro-rendered.wwso-sticker::after {
content: none !important;
display: none !important;
background: transparent !important;
box-shadow: none !important;
border: 0 !important;
}
.wwso-item.wwso-pro-rendered.wwso-sticker:not(.wwso-bubble) *,
.wwso-item.wwso-pro-rendered.wwso-sticker:not(.wwso-bubble) *::before,
.wwso-item.wwso-pro-rendered.wwso-sticker:not(.wwso-bubble) *::after {
background-color: transparent !important;
box-shadow: none !important;
} @keyframes wwsoFlyingAcrossLTR {
0% {
transform: translateX(-120vw) scale(0.95);
opacity: 0;
}
10% {
transform: translateX(-80vw) scale(1);
opacity: 1;
}
50% {
transform: translateX(0);
opacity: 1;
}
90% {
transform: translateX(80vw);
opacity: 1;
}
100% {
transform: translateX(120vw) scale(0.95);
opacity: 0;
}
}
@keyframes wwsoFlyingAcrossRTL {
0% {
transform: translateX(120vw) scale(0.95);
opacity: 0;
}
10% {
transform: translateX(80vw) scale(1);
opacity: 1;
}
50% {
transform: translateX(0);
opacity: 1;
}
90% {
transform: translateX(-80vw);
opacity: 1;
}
100% {
transform: translateX(-120vw) scale(0.95);
opacity: 0;
}
}
@keyframes wwsoFlyingBannerWave {
0% { transform: rotate(0deg) skewX(0deg); }
25% { transform: rotate(1deg) skewX(-0.8deg); }
50% { transform: rotate(-0.8deg) skewX(0.8deg); }
75% { transform: rotate(0.6deg) skewX(-0.4deg); }
100% { transform: rotate(0deg) skewX(0deg); }
}
@keyframes wwsoFlyingBannerRope {
0% { transform: rotate(-3deg) scaleX(1); }
50% { transform: rotate(-1deg) scaleX(1.04); }
100% { transform: rotate(-3deg) scaleX(1); }
}
@keyframes wwsoFlyingPlaneFloat {
0% { transform: translateY(0) rotate(0deg); }
50% { transform: translateY(-4px) rotate(-0.8deg); }
100% { transform: translateY(0) rotate(0deg); }
}
@keyframes wwsoFlyingGliderFloat {
0% { transform: translateY(0) rotate(-0.8deg); }
50% { transform: translateY(-6px) rotate(0.8deg); }
100% { transform: translateY(0) rotate(-0.8deg); }
}
@keyframes wwsoFlyingBirdFloat {
0% { transform: translateY(0); }
50% { transform: translateY(-4px); }
100% { transform: translateY(0); }
}
@keyframes wwsoFlyingBirdWingLeft {
0% { transform: rotate(-18deg); }
50% { transform: rotate(18deg); }
100% { transform: rotate(-18deg); }
}
@keyframes wwsoFlyingBirdWingRight {
0% { transform: rotate(18deg); }
50% { transform: rotate(-18deg); }
100% { transform: rotate(18deg); }
}
@keyframes wwsoFlyingPropellerBladeA {
from { transform: rotate(0deg); }
to { transform: rotate(360deg); }
}
@keyframes wwsoFlyingPropellerBladeB {
from { transform: rotate(90deg); }
to { transform: rotate(450deg); }
} .wwso-flying-banner-wrap:hover,
a.wwso-flying-banner-wrap:hover,
.wwso-track-click.wwso-flying-banner-wrap:hover {
animation-play-state: paused !important;
} @media (max-width: 768px) {
.wwso-sticker-image img,
.wwso-image img,
.wwso-mascot-motion .wwso-mascot-image img,
.wwso-type-mascot img {
width: var(--wwso-image-width-mobile, var(--wwso-image-width, 220px)) !important;
max-width: 100% !important;
min-width: 0 !important;
height: auto !important;
}
.wwso-sticker-image .wwso-sticker-text,
.wwso-image .wwso-sticker-text,
.wwso-mascot-motion .wwso-mascot-text,
.wwso-render-context-shortcode .wwso-sticker-text,
.wwso-render-context-shortcode .wwso-mascot-text {
max-width: var(--wwso-image-width-mobile, var(--wwso-image-width, 220px));
}
.wwso-bubble,
a.wwso-bubble {
width: min(var(--wwso-image-width, 220px), 180px) !important;
max-width: 100%;
}
.wwso-bubble-box {
min-width: 100px;
min-height: 66px;
}
.wwso-bubble-content {
font-size: min(var(--wwso-font-size, 16px), 15px);
}
.wwso-bubble-burst .wwso-bubble-box {
min-height: 108px !important;
padding: 24px 24px !important;
}
.wwso-bubble-cloud {
padding-top: 24px;
}
.wwso-bubble-cloud .wwso-bubble-box {
min-height: 92px !important;
padding: 24px 22px 18px !important;
}
.wwso-bubble-thought .wwso-bubble-box {
min-height: 78px !important;
}
.wwso-bubble-heart {
padding-top: 28px;
padding-right: 28px;
padding-left: 8px;
}
.wwso-bubble-heart .wwso-bubble-box {
width: 116px;
min-width: 116px;
height: 104px;
min-height: 104px;
}
.wwso-bubble-heart .wwso-bubble-box::before {
width: 116px;
height: 104px;
top: -56px;
}
.wwso-bubble-heart .wwso-bubble-box::after {
width: 104px;
height: 104px;
left: 56px;
}
.wwso-bubble-heart .wwso-bubble-content {
max-width: 68px;
}
.wwso-flying-banner-rope {
width: 22px;
flex-basis: 22px;
margin: 0 4px;
}
.wwso-flying-banner-flag {
min-width: 124px;
min-height: 40px;
padding: 8px 12px;
border-radius: 10px;
}
.wwso-flying-banner-flag span {
font-size: min(var(--wwso-font-size, 18px), 14px);
line-height: 1.1;
}
.wwso-flying-banner-flyer {
width: 100px;
height: 56px;
flex-basis: 100px;
}
.wwso-flying-plane {
width: 92px;
height: 30px;
top: 10px;
}
.wwso-flying-plane-wing {
left: 28px;
top: 16px;
width: 36px;
height: 7px;
}
.wwso-flying-plane-tail {
width: 14px;
height: 12px;
top: 3px;
}
.wwso-flying-plane-propeller {
width: 18px;
height: 18px;
left: -5px;
top: 6px;
}
.wwso-flying-glider {
width: 98px;
height: 52px;
top: 8px;
}
.wwso-flying-glider-body {
left: 38px;
top: 19px;
width: 34px;
height: 10px;
}
.wwso-flying-glider-wing {
left: 10px;
top: 10px;
width: 72px;
height: 9px;
}
.wwso-flying-glider-tail {
left: 66px;
top: 14px;
width: 16px;
height: 10px;
}
.wwso-flying-bird {
width: 96px;
height: 54px;
top: 6px;
}
.wwso-flying-bird-body {
left: 32px;
top: 18px;
width: 34px;
height: 18px;
}
.wwso-flying-bird-wing {
width: 24px;
height: 14px;
top: 8px;
}
.wwso-flying-bird-wing.wing-left {
left: 25px;
}
.wwso-flying-bird-wing.wing-right {
left: 45px;
}
.wwso-flying-bird-eye {
left: 40px;
top: 24px;
width: 4px;
height: 4px;
}
.wwso-flying-bird-beak {
left: 27px;
top: 24px;
width: 8px;
height: 6px;
}
.wwso-flying-bird-tail {
left: 63px;
top: 23px;
width: 11px;
height: 8px;
}
}