/* Seasonal themes (switched on in Admin > Seasonal Themes) */
.sx-layer{position:fixed;inset:0;pointer-events:none;overflow:hidden;z-index:40}
.sx-p{position:absolute;top:-8vh;left:0;line-height:1;user-select:none;will-change:transform;
  animation:sx-fall var(--d,12s) linear var(--delay,0s) infinite}
@keyframes sx-fall{
  0%{transform:translate3d(0,-8vh,0) rotate(0deg)}
  25%{transform:translate3d(calc(var(--dx,30px) * 1),28vh,0) rotate(calc(var(--rot,180deg) * .25))}
  50%{transform:translate3d(calc(var(--dx,30px) * -.6),56vh,0) rotate(calc(var(--rot,180deg) * .5))}
  75%{transform:translate3d(calc(var(--dx,30px) * .8),84vh,0) rotate(calc(var(--rot,180deg) * .75))}
  100%{transform:translate3d(0,112vh,0) rotate(var(--rot,180deg))}
}
.season-winter .sx-p{color:#9ccbf5;text-shadow:0 0 3px rgba(255,255,255,.9),0 0 6px rgba(120,170,230,.6)}

/* decorations */
.sx-deco{position:absolute;left:0;right:0;display:flex;justify-content:space-around;align-items:flex-end;pointer-events:none;z-index:3;padding:0 10px}
.sx-deco span{font-size:34px;line-height:1;display:inline-block;transform-origin:50% 100%;animation:sx-bob 4.5s ease-in-out infinite;filter:drop-shadow(0 2px 2px rgba(0,0,0,.18))}
.sx-deco span:nth-child(2n){animation-delay:-1.3s;font-size:28px}
.sx-deco span:nth-child(3n){animation-delay:-2.6s;font-size:38px}
.sx-deco span.hop{animation:sx-hop 2.2s ease-in-out infinite}
.sx-deco span.hop:nth-child(2n){animation-delay:-.9s}
@keyframes sx-bob{0%,100%{transform:rotate(-4deg)}50%{transform:rotate(4deg) translateY(-3px)}}
@keyframes sx-hop{0%,55%,100%{transform:translateY(0)}70%{transform:translateY(-14px)}85%{transform:translateY(0)}92%{transform:translateY(-5px)}}
.mbfc-header-hero{position:relative}
.mbfc-footer{position:relative}
.sx-deco.sx-foot{top:-26px}
.season-winter .mbfc-footer{border-top:5px solid #eaf4ff}
.season-easter .mbfc-footer{border-top:5px solid #f9c8e0}
.season-autumn .mbfc-footer{border-top:5px solid #d9822b}
@media (max-width:640px){
  .sx-deco span{font-size:24px !important}
  .sx-deco.sx-foot span:nth-child(n+5){display:none}
}
@media (prefers-reduced-motion:reduce){.sx-deco span,.sx-p{animation:none !important}}

/* winter: a layer of snow on the header */
.sx-snowsvg{position:absolute;left:0;top:0;pointer-events:none;z-index:2;max-width:100%;filter:drop-shadow(0 2px 2px rgba(60,100,160,.35))}
.sx-snowbase{position:absolute;left:0;right:0;bottom:0;height:7px;pointer-events:none;z-index:2;background:linear-gradient(to top,#fff,rgba(255,255,255,0))}

/* autumn: leaf vine across the header */
.sx-vine{position:absolute;left:0;top:0;pointer-events:none;z-index:2;max-width:100%}

/* easter: bunnies hopping back and forth along the header */
.sx-lane{position:absolute;left:0;right:0;bottom:0;height:74px;overflow:hidden;pointer-events:none;z-index:3}
.sx-run{position:absolute;left:0;bottom:0;width:100%;height:100%;animation:none}
.sx-face{position:absolute;bottom:0;left:0;line-height:1;animation:sx-run var(--t,16s) linear var(--dl,0s) infinite}
.sx-hopper{display:block;line-height:0;animation:sx-bunhop .75s ease-in-out infinite}
@keyframes sx-run{0%{left:0;transform:scaleX(1)}49.9%{left:calc(100% - var(--sz,40px));transform:scaleX(1)}50%{left:calc(100% - var(--sz,40px));transform:scaleX(-1)}99.9%{left:0;transform:scaleX(-1)}100%{left:0;transform:scaleX(1)}}
@keyframes sx-bunhop{0%,100%{transform:translateY(0)}45%{transform:translateY(-24px)}}

/* big snowman / pumpkin just outside the right edge of the page */
.sx-side{position:fixed;bottom:0;z-index:30;pointer-events:none;line-height:1;white-space:nowrap}
.sx-side .sx-big{display:block;transform-origin:50% 100%;animation:sx-sway 5s ease-in-out infinite;filter:drop-shadow(0 4px 4px rgba(0,0,0,.25))}
.sx-side .sx-leafpile{position:absolute;bottom:0;font-size:.32em}
.sx-side .sx-leafpile.l1{left:-.1em}.sx-side .sx-leafpile.l2{right:.1em}
.sx-side .sx-snowpile{position:absolute;left:-.05em;right:-.05em;bottom:-.04em;height:.16em;border-radius:50% 50% 0 0;background:#fff;box-shadow:0 -2px 6px rgba(120,160,210,.4)}
@keyframes sx-sway{0%,100%{transform:rotate(-2.5deg)}50%{transform:rotate(2.5deg)}}
@media (prefers-reduced-motion:reduce){.sx-face,.sx-hopper,.sx-side .sx-big{animation:none !important}}

/* falling effect kept in the background, behind the main site box */
.sx-layer.sx-behind{z-index:0}
.season-winter .mbfc-wrapper,.season-autumn .mbfc-wrapper,.season-easter .mbfc-wrapper,.season-newyear .mbfc-wrapper{position:relative;z-index:1}
.sx-side-easter{bottom:8px}

.season-newyear .mbfc-footer{border-top:5px solid #e6c15a}
.sx-side-newyear{bottom:6px}
.sx-side-newyear .sx-big{transform-origin:50% 100%;animation:sx-sway 6s ease-in-out infinite}

/* new year: hanging mirror balls */
.sx-balls{position:absolute;left:0;right:0;top:0;height:0;pointer-events:none;z-index:3}
.sx-ball{position:absolute;top:0;transform-origin:50% 0;animation:sx-swing 4.6s ease-in-out infinite;display:flex;flex-direction:column;align-items:center}
.sx-ball i{display:block;width:2px;background:linear-gradient(#cbd5e1,#94a3b8)}
.sx-ball svg{display:block;filter:drop-shadow(0 3px 4px rgba(0,0,0,.35));animation:sx-spin 9s linear infinite}
.sx-ball:nth-child(2n){animation-duration:5.4s;animation-delay:-1.7s}
.sx-ball:nth-child(3n){animation-duration:6.2s;animation-delay:-3.1s}
@keyframes sx-swing{0%,100%{transform:rotate(-5deg)}50%{transform:rotate(5deg)}}
@keyframes sx-spin{0%{filter:drop-shadow(0 3px 4px rgba(0,0,0,.35)) brightness(1)}50%{filter:drop-shadow(0 3px 4px rgba(0,0,0,.35)) brightness(1.25)}100%{filter:drop-shadow(0 3px 4px rgba(0,0,0,.35)) brightness(1)}}
.sx-tw{animation:sx-twinkle 1.6s ease-in-out infinite;transform-box:fill-box;transform-origin:center}
@keyframes sx-twinkle{0%,100%{opacity:.15;transform:scale(.6)}50%{opacity:1;transform:scale(1.2)}}
.sx-fw{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;z-index:40}
.sx-fw.sx-behind{z-index:0}
/* champagne bottle */
.sx-cork{animation:sx-pop 3.4s ease-in infinite;transform-box:fill-box;transform-origin:center}
@keyframes sx-pop{0%,62%{transform:translateY(0) rotate(0);opacity:1}80%{transform:translateY(-22px) rotate(25deg);opacity:1}100%{transform:translateY(-44px) rotate(60deg);opacity:0}}
.sx-bub{animation:sx-bubble 3.4s ease-out infinite;opacity:0}
@keyframes sx-bubble{0%,62%{opacity:0;transform:translateY(0)}70%{opacity:.95}100%{opacity:0;transform:translateY(-34px)}}
@media (max-width:640px){.sx-ball:nth-child(n+3){display:none}}
@media (prefers-reduced-motion:reduce){.sx-ball,.sx-ball svg,.sx-tw,.sx-cork,.sx-bub{animation:none !important}}
.sx-conf{border-radius:2px;box-shadow:0 0 2px rgba(0,0,0,.25)}
.sx-deco.sx-head{bottom:0;top:auto}
.sx-deco.sx-head span{font-size:26px}
.sx-deco.sx-head span:nth-child(2n){font-size:22px}
.sx-deco.sx-head span:nth-child(3n){font-size:30px}
@media (max-width:640px){.sx-deco.sx-head span:nth-child(n+5){display:none}}
