body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.countdown{align-items:center;display:flex;font-family:sans-serif;gap:15px;justify-content:center}.countdown.small{gap:10px;width:20%}.countdown.medium{gap:15px;width:30%}.countdown.big{gap:30px;width:50%}.time-section{font-size:18px;text-align:center}.time-section.small{font-size:14px}.time-section.medium{font-size:18px}.time-section.big{font-size:24px}.time-group{display:flex;gap:5px}.time-group.small{gap:3px}.time-group.medium{gap:5px}.time-group.big{gap:10px}.time-segment{display:block;font-size:50px;font-weight:900;width:50px}.time-segment.small{font-size:30px;width:30px}.time-segment.medium{font-size:40px;width:40px}.time-segment.big{font-size:60px;width:60px}.segment-display{height:100%;position:relative}.segment-display__bottom,.segment-display__top{height:50%;overflow:hidden;position:relative;text-align:center;width:100%}.segment-display__top{background-color:#111;color:#eee;line-height:1.2}.segment-display__bottom{background-color:#333;color:#fff;line-height:0}.segment-overlay{height:100%;perspective:200px;position:absolute;top:0;width:100%}.segment-overlay.small{perspective:150px}.segment-overlay.medium{perspective:200px}.segment-overlay.big{perspective:250px}.segment-overlay__bottom,.segment-overlay__top{height:50%;overflow:hidden;position:absolute;text-align:center;width:100%}.segment-overlay__top{background-color:#111;color:#fff;line-height:1.2;top:0;transform-origin:bottom}.segment-overlay__bottom{background-color:#333;border-top:1px solid #000;bottom:0;color:#eee;line-height:0;transform-origin:top}.segment-overlay.flip .segment-overlay__top{animation:flip-top .8s linear}.segment-overlay.flip .segment-overlay__bottom{animation:flip-bottom .8s linear}@keyframes flip-top{0%{transform:rotateX(0deg)}50%,to{transform:rotateX(-90deg)}}@keyframes flip-bottom{0%,50%{transform:rotateX(90deg)}to{transform:rotateX(0deg)}}