/* Voulamandis House – Christmas layer. Everything is scoped to html.vh-xmas. */
html.vh-xmas header strong { overflow: visible; }
.vh-house { position: relative; display: inline-block; margin-left: .3em; }
.vh-hat { position: absolute; left: -.5em; top: -.62em; width: 1.3em; height: 1.13em; overflow: visible; pointer-events: none; }

.vh-cane { flex: none; width: .85em; height: 1.35em; margin-right: .45em; vertical-align: -.3em; }

.vh-fx { position: absolute; inset: 0; overflow: hidden; pointer-events: none; z-index: 5; contain: strict; }
.vh-lights { position: absolute; top: 0; left: 0; display: flex; height: 40px; }
.vh-lights svg { flex: 0 0 240px; width: 240px; height: 40px; }
.vh-tw { animation: vhTwinkle 2.6s ease-in-out infinite; }
.vh-tw.b { animation-delay: -.9s; }
.vh-tw.c { animation-delay: -1.7s; }
@keyframes vhTwinkle { 0%, 100% { opacity: 1; } 50% { opacity: .4; } }

.vh-corner { position: absolute; top: 46px; width: 34px; height: 54px; }
.vh-corner.l { left: 20px; transform: rotate(-8deg); }
.vh-corner.r { right: 20px; transform: scaleX(-1) rotate(-8deg); }

.vh-flake { position: absolute; top: -8px; border-radius: 50%; background: #fff; animation: vhSnow linear infinite; will-change: transform; }
@keyframes vhSnow { to { transform: translate3d(36px, var(--vh-fall, 700px), 0); } }

@media (max-width: 767px) {
  .vh-lights { height: 28px; }
  .vh-lights svg { flex-basis: 160px; width: 160px; height: 28px; }
  .vh-corner.l { display: none; }
  .vh-corner.r { top: 34px; right: 12px; width: 24px; height: 38px; }
}
@media (prefers-reduced-motion: reduce) {
  .vh-tw { animation: none; }
  .vh-flake { display: none; }
}

html.vh-xmas a.vh-book { background: #8f1d1d; background-image: none; color: #fff; }

.vh-title-hat { position: relative; display: inline-block; width: 0; height: 0; }
.vh-title-hat .vh-hat { left: -.2em; top: auto; bottom: .58em; width: 1.05em; height: .91em; transform: rotate(-12deg); }
.vh-deco { display: inline-block; width: .85em; height: 1em; margin-left: .32em; vertical-align: -.12em; }

.vh-chip { width: 2.75rem; height: 2.75rem; background: none; box-shadow: none; filter: none; --tw-ring-shadow: 0 0 #0000; }
.vh-chip::before { content: none !important; }
.vh-badge { display: block; width: 100%; height: 100%; }

.vh-rel { position: relative; }
.vh-bow { position: absolute; top: 8px; right: 10px; width: 46px; height: 42px; z-index: 6; pointer-events: none; }
.vh-mini-gift { display: inline-block; width: 1.1em; height: 1.2em; margin-right: .3em; vertical-align: -.25em; }
.vh-ai-fx { position: fixed; left: 0; right: 0; bottom: 0; overflow: hidden; pointer-events: none; z-index: 30; }
.vh-ai-fx .vh-flake { background: #d9c7a8; }

.vh-open { overflow: visible !important; }
h1 .vh-title-hat .vh-hat { bottom: .66em; width: .72em; height: .62em; }

.vh-open .vh-title-hat .vh-hat { left: -.25em; bottom: .42em; width: 1.25em; height: 1.08em; transform: rotate(-10deg); }