* { margin: 0; padding: 0; } html, body { min-height: 100%; height: auto; } body{ font-weight: 350; } * { -webkit-tap-highlight-color: transparent; } header, footer{ padding-left: var(--sectionMargin); padding-right: var(--sectionMargin) } header{ border-bottom: 1px solid; border-image: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,0), rgba(255,255,255,0)) 1; } header.scrolling{ backdrop-filter: blur(24px); -webkit-backdrop-filter: blur(24px); background-color: hsla(var(--hsl-bg),0.5); border-bottom: 1px solid; border-image: linear-gradient(to right, rgba(255,255,255,0), rgba(255,255,255,0.1), rgba(255,255,255,0)) 1; } .scrolling #header__inner{ transform: none; } footer{ background: radial-gradient(60.3% 52.63% at 50% 0%, rgba(113, 25, 255, 0.15) 0%, rgba(121, 25, 255, 0) 100%); margin-top: calc(var(--sectionPadding) + clamp(7.5rem, 8.333vw + 5rem, 15rem)) !important; } body:has(dialog[open]) { overflow: hidden; padding-right: var(--scrollbar-width, 17px); } body:has(dialog[open]) header{ padding-right: calc(var(--sectionMargin) + var(--scrollbar-width, 17px)); } .blockOverlay { background: none !important; }