@import url(https://fonts.googleapis.com/css2?family=Inconsolata:wght@200&display=swap);@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@200&display=swap);#background,#content{width:100%;height:100%}#back,#content,#countdown,#front{position:relative}#back,#countdown.is-flipped{transform:rotateY(180deg)}#countdown,footer button{color:#f0f0f0;cursor:pointer;backdrop-filter:blur(10px)}*{margin:0;padding:0;box-sizing:border-box;user-select:none}body,html{height:100%;font-size:16px;font-family:Inconsolata;font-weight:200}#background{position:absolute;background:url('huetten-am-berg.jpg') center center no-repeat fixed;filter:grayscale(70%);transition:filter .3s ease-in-out;z-index:1;animation:60s linear infinite moveIt}@keyframes moveIt{0%,100%{background-position:center left}50%{background-position:center right}}.background-hover{filter:grayscale(0%)!important}#content{display:flex;align-items:center;justify-content:center;z-index:3}#back{display:none}#countdown{display:inline-block;margin:auto;background-color:rgba(255,255,255,.2);border-radius:10px;padding:25px;text-align:center;z-index:4;transition:transform 1s ease-in-out;transform-style:preserve-3d}#days,#total-hours{font-size:8rem}#total-hours{font-size:7rem}.details{font-size:3rem}footer{position:fixed;bottom:10px;left:10px;z-index:4}footer button{border:none;font:inherit;font-family:Poppins;font-weight:200;padding:6px 10px;border-radius:4px;background-color:rgba(0,0,0,.7);transition:background-color .2s ease-in-out}footer button:hover{background-color:#000}.ribbon{font-size:14px;padding:4px;position:absolute;right:-25px;top:-12px;text-align:center;border-radius:4px;transform:rotate(20deg);background-color:#ff9800;color:#fff;font-family:Poppins;font-weight:200;z-index:5}