/* Extra small */ @media screen and (max-width:480px) { :root { --global-font-size:15px; --global-line-height:1.2em; --global-space:8px; --global-pad:0px; --min-width:35ch; --max-width:100%; --head-size-base:100%; --head-size-step:0%; /*Content*/ --dismiss-content:"✘"; --enter-content:""; } .full { display:none; } } /* Small */ @media screen and (min-width:481px) { :root { --global-font-size:18px; --global-line-height:1.2em; --global-space:8px; --global-pad:4px; --min-width:35ch; --head-size-base:112%; --head-size-step:6.25%; /*Content*/ --dismiss-content:"✘"; --enter-content:" ⮨"; } .terse { display:none; } } /* Medium */ @media screen and (min-width:768px) { :root { --global-font-size:0.156in; --global-line-height:1.2em; --global-space:8px; --global-pad:4px; --min-width:48ch; --head-size-base:125%; --head-size-step:12.5%; /*Content*/ --dismiss-content:"Close ✘"; --enter-content:" ⮨"; } .terse { display:none; } } :root { --font-stack:Roboto, Helvetica, Arial, sans; --header-stack:Noto Serif, serif; --figures-font-stack:Inconsolata, Liberation Mono, Courier New, monospace; --page-width:85ch; --warning-font-color:firebrick; --warning-background-color:khaki; --error-background-color:thistle; --valid-font-color:darkgreen; --valid-background-color:palegreen; /*Rethink these colors*/ --content-font-color:black; --content-background-color:#FEFEFF; --text-hl-color:#E0E0FC; --text-ll-color:#251125; --text-interactive-color:indigo; --background-texture:url('data:image/png;base64,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'); } /* Tags */ html * { line-height:var(--global-line-height); font-family:var(--font-stack); font-size:var(--global-font-size); margin:0; padding:0; box-sizing:border-box; } input::-webkit-outer-spin-button, input::-webkit-inner-spin-button { -webkit-appearance:none; margin: 0; } input[type=number] { -moz-appearance: textfield; border:none; box-sizing:content-box; background:transparent; color:var(--text-interactive-color); font-weight:bold; max-width:4.5ch; } body { background-image:var(--background-texture); margin:var(--global-space); padding:var(--global-pad); min-width:var(--min-width); } info-card { padding:1em; } input, button, a { text-align:center; flex-shrink:0; height:var(--global-line-height); } button { background-image:none; background-color:var(--content-background-color); border-color:var(--text-hl-color); } h1, h2, h3, h4, h5 { padding-top:0.2em; padding-bottom:0.4em; font-weight:bold; font-family:var(--header-stack); text-wrap:nowrap; } h1 { font-size:calc(var(--head-size-base) + calc(4 * var(--head-size-step))); } h2 { font-size:calc(var(--head-size-base) + calc(3 * var(--head-size-step))); } h3 { font-size:calc(var(--head-size-base) + calc(2 * var(--head-size-step))); } h4 { font-size:calc(var(--head-size-base) + calc(1 * var(--head-size-step))); } /*Line by line highlight*/ code, p, .card-body { background-image:linear-gradient(var(--text-hl-color) 50%, transparent 50%); background-size:var(--min-width) calc(2 * var(--global-line-height)); } ul>:nth-child(odd) { background-color:var(--text-hl-color); } /*classes*/ .postal-invalid { color:var(--warning-font-color); background-color:var(--warning-background-color); } .postal-valid { color:var(--valid-font-color); background-color:var(--valid-background-color); } .left-input { background-image: linear-gradient(to right, var(--content-background-color), var(--text-hl-color)); border-color:var(--text-hl-color); border-style:solid; border-width: 0px var(--global-pad) 0px 0px; } .right-input { display:inline-block; background-image: linear-gradient(to left, var(--content-background-color), var(--text-hl-color)); border-style:hidden; padding-left:var(--global-pad); } .dismiss-button { align-self:center; border-style:solid none; } .dismiss-button::after { content:var(--dismiss-content); } .interactive-hint { background-color:var(--content-background-color); border:none; height:var(--global-line-height); } .card-title { display:flex; flex-flow:row nowrap; align-items:baseline; justify-content:space-between; max-width:100%; margin-bottom:0.2em; } .card-title > * { box-sizing:content-box; } .card-body { display:flex; flex-flow:column nowrap; align-items:center; text-align:center; } .card-content { position:relative; } .center { display:inline-flex; flex-flow:row nowrap; align-items:center; justify-content:space-around; width:100%; } .center > * { padding:0 0.5ch; } .right { text-align:left; position:absolute; width:100%; top:0%; left:100%; } .left { text-align:right; position:absolute; right:100%; width:100%; } .title-text { display:flex; flex-flow:row nowrap; align-items:center; max-width:87%; } .title-spacer { background-color:var(--text-hl-color); height:2px; align-self:center; margin:0 15px; width:90%; flex-shrink:100; } .card-fineprint { display:flex; flex-flow:row nowrap; justify-content:space-between; width:100%; padding-top:0.4em; } .card-fineprint > .title-spacer { margin-right:0; } .allow-shrink { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex-shrink:50; } .fineprint { font-size:70%; color:var(--text-ll-color); } .figures { font-family:var(--figures-font-stack); } /*ids*/ #error { margin:var(--global-space) auto; background-color:var(--error-background-color); background-image:initial; border-radius:var(--global-space); max-width:calc(var(--page-width) + var(--global-space)); padding:var(--global-pad); } #warn { margin:var(--global-space) 0; background-color:var(--warning-background-color); background-image:initial; border-radius:var(--global-space); max-width:calc(var(--page-width) + var(--global-space)); padding:var(--global-pad); } #main { margin:auto; background-color:var(--content-background-color); background-image:initial; border-radius:var(--global-space); max-width:calc(var(--page-width)); padding:var(--global-pad); } #info-cards { display:flex; flex-flow:column; justify-content:flex-start; align-items:stretch; width:100%; } #postal-prompt { display:flex; flex-flow:column; text-align:center; margin:auto; padding:0 1em; } #postal-prompt > label { font-size:calc(var(--head-size-base) + calc(4 * var(--head-size-step))); font-weight:bold; padding-top:0.2em; padding-bottom:0.4em; } #postal-prompt.cards-displayed > label { font-size:initial; font-weight:bold; } #get-postal:after { content:var(--enter-content); } #spotlight-segment { display:flex; justify-content:space-between; flex-flow:column wrap; min-height:96vh; width:100%; } /*ids + class override*/ #postal-prompt.cards-displayed { align-self: flex-end; align-items:baseline; justify-content:flex-end; flex-flow:row; margin:inherit; }