.pw-widget{ --pw-padding:18px; --pw-padding-bottom:14px; --pw-icon-size:72px; position:relative; overflow:hidden; border-radius:22px; width:100%; max-width:100%; box-shadow:0 22px 55px rgba(10,14,40,.35); font-weight:600; isolation:isolate; color:#fff; flex-shrink:0; container-type:inline-size; } .portal-left-col-v20{display:grid;gap:16px;min-width:0} .pw-radius-zacht{border-radius:14px} .pw-radius-recht{border-radius:6px} .pw-widget.pw-noshadow{box-shadow:none !important} .pw-size-compact{--pw-padding:14px;--pw-padding-bottom:11px;--pw-icon-size:60px} .pw-size-compact .pw-top{margin-bottom:8px} .pw-size-compact .pw-title{font-size:.76rem} .pw-size-compact .pw-temp{font-size:2.3rem} .pw-size-compact .pw-desc{font-size:.9rem} .pw-size-compact .pw-now{gap:11px;margin-bottom:10px} .pw-size-compact .pw-row{padding:7px 2px;font-size:.87rem} .pw-size-compact .pw-panel{padding:2px 11px 9px} .pw-size-compact .pw-alert{font-size:.8rem;padding:6px 9px} .pw-size-compact .pw-fact{font-size:.78rem} .pw-size-ruim{--pw-padding:22px;--pw-padding-bottom:18px;--pw-icon-size:84px} .pw-size-ruim .pw-title{font-size:.9rem} .pw-size-ruim .pw-temp{font-size:3.4rem} .pw-size-ruim .pw-desc{font-size:1.05rem} .pw-size-ruim .pw-row{padding:11px 2px;font-size:.98rem} .pw-size-ruim .pw-alert{font-size:.9rem} .pw-size-ruim .pw-fact{font-size:.87rem} .pw-atmosphere{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none} .pw-sky{position:absolute;inset:0;z-index:0} .pw-shade{ position:absolute;inset:0;z-index:1;pointer-events:none; background:linear-gradient(180deg,rgba(0,0,0,.18),rgba(0,0,0,0) 55%); } .pw-canvas{position:absolute;inset:0;z-index:2;pointer-events:none} .pw-inner{position:relative;z-index:4;padding:var(--pw-padding) var(--pw-padding) var(--pw-padding-bottom)} .pw-head-content,.pw-body{position:relative;z-index:4} .pw-top{display:flex;align-items:center;gap:10px;margin-bottom:11px} .pw-title{ color:#fff;font-weight:800;font-size:.83rem;letter-spacing:.13em;text-transform:uppercase; text-shadow:0 1px 6px rgba(0,0,0,.35); } .pw-knmi{display:flex;align-items:center;gap:10px;border-radius:12px;padding:9px 12px;font-size:.86rem;font-weight:800;margin-bottom:12px;line-height:1.3} .pw-knmi small{display:block;font-weight:600;font-size:.74rem;opacity:.9} .pw-knmi strong{display:block} .pw-knmi-geel{background:#fef9c3;color:#854d0e;border:1px solid #fde047} .pw-knmi-oranje{background:#ffedd5;color:#9a3412;border:1px solid #fdba74} .pw-knmi-rood{background:#fee2e2;color:#991b1b;border:1px solid #fca5a5;animation:pwKnmiPulse 2.2s infinite} @keyframes pwKnmiPulse{0%,100%{box-shadow:0 0 0 0 rgba(220,38,38,.35)}50%{box-shadow:0 0 0 7px rgba(220,38,38,0)}} .pw-now{display:flex;align-items:center;gap:14px;margin-bottom:13px;color:#fff} .pw-icon{display:grid;place-items:center;flex:0 0 var(--pw-icon-size);width:var(--pw-icon-size);aspect-ratio:120 / 128;line-height:1;filter:drop-shadow(0 3px 8px rgba(0,0,0,.3))} .pw-icon img{display:block;width:100%;height:auto} .pw-icon canvas{display:block;max-width:100%;height:auto} .pw-icon img[hidden]{display:none} .pw-temp{font-size:2.9rem;font-weight:800;line-height:1;text-shadow:0 2px 12px rgba(0,0,0,.35)} .pw-temp sup{font-size:1.4rem;top:-.9em;position:relative;vertical-align:baseline} .pw-desc{font-size:.98rem;margin-top:2px;font-weight:700;text-shadow:0 1px 6px rgba(0,0,0,.4)} .pw-panel{background:rgba(255,255,255,.94);border-radius:14px;padding:4px 13px 11px;color:#22333a} .pw-row{display:flex;justify-content:space-between;gap:10px;padding:9px 2px;border-bottom:1px dashed #dfe5e3;color:#43555b;font-size:.92rem} .pw-row:last-child{border-bottom:none} .pw-row b{color:#22333a;font-weight:700;text-align:right} .pw-alert{display:flex;align-items:center;gap:9px;background:#eef4f2;color:#0f5f5c;border-radius:10px;padding:8px 11px;font-size:.85rem;font-weight:700;margin-top:8px} .pw-fact{border-top:1px dashed #dfe5e3;margin-top:9px;padding-top:9px;color:#5d6d74;font-size:.82rem;line-height:1.5} .pw-foot{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:4px 10px;margin:10px -4px 0;padding:7px 10px;border-radius:10px;background:rgba(10,18,36,.68)} .pw-radius-zacht .pw-foot{border-radius:8px} .pw-radius-recht .pw-foot{border-radius:4px} .pw-updated{color:#fff;font-size:.73rem;line-height:1.35;margin-left:auto} .pw-clock{white-space:nowrap} .pw-widget button.pw-geo{ display:inline-flex;align-items:center;gap:6px; border:none;background:transparent !important;padding:0;margin:0;min-height:0;min-width:0;width:auto;box-shadow:none; color:var(--pw-geo-color,#fff) !important;font:inherit;font-size:.82rem;font-weight:800;line-height:1.35;cursor:pointer; white-space:nowrap; } @container (max-width:300px){ .pw-foot{flex-direction:column;align-items:flex-start} .pw-updated{margin-left:0} } .pw-widget button.pw-geo:is(:hover,:focus-visible,:active){background:transparent !important;color:var(--pw-geo-color,#fff) !important;box-shadow:none} .pw-widget button.pw-geo:is(:hover,:focus-visible) .pw-geo-txt{text-decoration:underline} .pw-widget button.pw-geo:focus-visible{outline:2px solid currentColor;outline-offset:4px} .pw-widget button.pw-geo[hidden]{display:none} @media(max-width:1280px){ .portal-home-inner-v147 .pw-widget, .portal-home-inner-v147 .portal-left-col-v20, .portal-contact-v1473 .pw-widget, .portal-contact-v1473 .portal-left-col-v20, .portal-auth-v148 .pw-widget, .portal-auth-v148 .portal-left-col-v20{display:none} } .pw-sun{ position:absolute;top:-46px;right:-38px;width:190px;height:190px;border-radius:50%; z-index:1;pointer-events:none; background:radial-gradient(circle,rgba(255,214,120,.9) 0%,rgba(255,190,80,.3) 45%,transparent 70%); animation:pwSunSpin 40s linear infinite; } @keyframes pwSunSpin{to{transform:rotate(360deg)}} .pw-moon{ position:absolute;top:44px;right:16px;z-index:1;pointer-events:none; display:grid;place-items:center; filter:drop-shadow(0 0 16px rgba(220,230,255,.5)); } .pw-moon-dimmed{opacity:.4} .pw-moon-realistisch{animation:pwMoonFloat 8s ease-in-out infinite} .pw-moon-sikkel{animation:pwMoonGlow 5s ease-in-out infinite} @keyframes pwMoonFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-6px)}} @keyframes pwMoonGlow{ 0%,100%{filter:drop-shadow(0 0 12px rgba(245,205,130,.45))} 50%{filter:drop-shadow(0 0 26px rgba(245,205,130,.85))} } .pw-flash{position:absolute;inset:0;background:#fff;opacity:0;z-index:3;pointer-events:none} .pw-live .pw-icon{animation:pwIconBob 4s ease-in-out infinite} @keyframes pwIconBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}} @media (prefers-reduced-motion: reduce){ .pw-knmi-rood{animation:none} .pw-sun,.pw-moon-realistisch,.pw-moon-sikkel,.pw-live .pw-icon{animation:none} } .pw-skin-kaart{--pw-geo-color:var(--pw-kaart-accent,#2f5d8a);background:var(--pw-kaart-vlak,#fff);border:1.5px solid var(--pw-kaart-rand,#dfe5ec);color:var(--pw-kaart-inkt,#22333a);box-shadow:0 8px 26px rgba(35,47,62,.08)} .pw-skin-kaart .pw-shade{background:none} .pw-skin-kaart .pw-head{position:relative;overflow:hidden;margin:calc(-1 * var(--pw-padding)) calc(-1 * var(--pw-padding)) 13px} .pw-skin-kaart .pw-head-content{box-sizing:border-box;width:fit-content;max-width:100%;padding:var(--pw-padding) var(--pw-padding) 1px} .pw-skin-kaart .pw-head-content::before{ content:"";position:absolute;inset:0 -96px 0 0;z-index:-1;pointer-events:none; background:linear-gradient(90deg,rgba(3,35,76,.70),rgba(3,35,76,.70) calc(100% - 96px),rgba(3,35,76,0)); } .pw-skin-kaart .pw-panel{background:var(--pw-kaart-vlak,#fff);color:var(--pw-kaart-inkt,#22333a)} .pw-skin-kaart .pw-row{color:var(--pw-kaart-zacht,#4b5b6b);border-bottom-color:var(--pw-kaart-rand,#dfe5ec)} .pw-skin-kaart .pw-row b{color:var(--pw-kaart-inkt,#22333a)} .pw-skin-kaart .pw-foot{background:var(--pw-kaart-vlak,#fff)} .pw-skin-kaart .pw-updated{color:var(--pw-kaart-accent,#2f5d8a)}