index.css

@font-face{font-family:altgothcondbold;src:url(/projection/altgothcondbold.woff2) format("woff2");font-weight:400;font-style:normal}@font-face{font-family:katwijk_monobold;src:url(/projection/katwijk-mono-bold-web.woff2) format("woff2");font-weight:400;font-style:normal}:root{--deadline: #fe3114;--lifeline: #619fc8;--newsfeed: #000;--text: #fff}*,*:before,*:after{box-sizing:border-box;margin:0;position:relative}body{text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:altgothcondbold,sans-serif;font-style:normal;color:var(--text)}.container{display:flex;height:100vh;flex-direction:column;overflow:hidden}.deadline,.lifeline{padding-block-start:3vh;justify-content:space-around}.deadline>div,.lifeline>div{display:flex;justify-content:center}.deadline .label,.lifeline .label{font-size:6vh;font-size:clamp(3vw,6vh,6vw);white-space:nowrap}.lifeline.sm .label{font-size:clamp(3vw,6vh,3vw)}.deadline{flex:0 0 67%;background-color:var(--deadline);flex-direction:column;display:flex}.deadline .branding{font-size:4vh;justify-content:space-between;padding-inline:8vh}.deadline .countdown{align-items:baseline;font-variant-numeric:tabular-nums;margin-block:-3vh -6vh}.deadline .countdown.sm h1{font-size:clamp(10vw,25vh,14vw)}.deadline .countdown.sm span{margin-inline:1vw 3vw;font-size:clamp(5vw,15vh,8vw)}.deadline .countdown.lg h1{font-size:clamp(10vw,25vh,15vw)}.deadline .countdown.lg span{margin-inline:2vw 4vw;font-size:clamp(5vw,15vh,10vw)}.deadline video{max-height:28vh;border-radius:50%;border:.5rem solid white}.lifeline{flex:1 0 25%;background-color:var(--lifeline)}.lifeline .value{font-family:katwijk_monobold,monospace;font-size:clamp(3vw,10vh,15vw);white-space:nowrap;overflow-x:hidden}.newsfeed{flex:0 0 7%;background-color:var(--newsfeed);font-size:4vh;font-weight:900;font-family:katwijk_monobold,monospace;overflow-x:hidden}.newsfeed .ticker{white-space:nowrap;top:1.1vh}.newsfeed .ticker span{position:absolute;animation-timing-function:linear;animation-iteration-count:infinite}.newsfeed .ticker span:nth-child(1){animation-name:newsfeed-A}.newsfeed .ticker span:nth-child(2){animation-name:newsfeed-B}@keyframes newsfeed-A{0%{transform:translate(0)}to{transform:translate(-100%)}}@keyframes newsfeed-B{0%{transform:translate(100%)}to{transform:translate(0)}}