* { margin: 0; padding: 0; } body { overflow: hidden; } html { font-family: -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica, Arial, sans-serif; /* color: white; text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5); overflow-wrap: break-word; */ } #statusContainer { font-weight: 500; font-size: 30px; text-align: center; background-color: #D12025; color: white; padding: 10px; border-radius: 10px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } #timer-bar { width: 0px; height: 0px; background-color: #ffcc00; position: absolute; } #timer-label { font-family: 'Metropolis'; font-weight: bold; background-color: rgba(0, 0, 0, .4); color: white; padding: 12px; border-radius: 10px; position: absolute; margin: 50px; display: table; opacity: 0; transition: opacity 0.5s linear; } #ad-label { font-size: 20px; font-weight: bold; max-width: fit-content; text-align: center; display: inline-block; background-color: #F9BE2A; color: #1C1B22; padding: 10px; border-radius: 10px; display: table-cell; } #upcoming-ad-warning-container { font-family: 'Metropolis'; font-size: 20px; max-width: fit-content; text-align: center; display: inline-block; background-color: #000000CC; color: #FFFFFF; padding: 10px 20px; border-radius: 10px 0px 0px 10px; display: table-cell; position: absolute; bottom: 15%; right: -100%; transition: right 0.5s ease-in-out; } #countdown-label { font-size: 40px; font-weight: bold; margin: 10px 0px 0px 0px; }