:root{--font-color-black:#03324d;--font-color-white:#eeefff;--bg-grad:linear-gradient(to bottom, #e8f6ff, #9cd6ff);--bg-countdown:#5095eb;--light-blue:#e0f0ff;--progress-bg:#ff4d6d;--progress-bar-hover:#ee3c5c;--progress-bar-bg:#b1d7ff;--info-bg:#e7f3ff;--card-border:#cfcfcf;--radius-classic:10px;--radius-bar:4px;--warning-text-color:#78350f;--warning-border-color:#a41502;--warning-bg-color:#f59e0b}*{box-sizing:border-box}body{justify-content:top;color:var(--font-color-white);background:var(--bg-grad);flex-direction:column;align-items:center;min-height:100vh;margin:0;font-family:Segoe UI,Arial,sans-serif;font-weight:600;display:flex}h1{color:var(--font-color-black)}h2{color:var(--font-color-white)}.card-container{border-radius:var(--radius-classic);background:0 0;border:none;width:85%;max-width:900px;margin:10px;padding:0;box-shadow:5px 5px 20px #64647880}.card{border:none;width:100%;padding:20px}.abs-time{flex-direction:row;align-items:center;width:75%;max-width:500px;display:flex}.times{flex-direction:column;flex:4;justify-content:left;align-items:stretch;display:flex}.timelabels{align-items:left;text-align:left;flex-direction:column;flex:1;justify-content:left;margin-left:5px;display:flex}.abs-time .times .timebox{text-align:left;align-items:stretch;margin-left:10%}.countdown-container{background-color:var(--bg-countdown);border-radius:var(--radius-classic) var(--radius-classic) 0 0;box-sizing:border-box;flex-direction:column;justify-content:center;align-items:center;margin-bottom:0;display:flex}hr{border:none;border-top:2px solid #ccc;width:60%;margin:1px}.remaining-time{border-radius:var(--radius-classic);border:none;flex-flow:wrap;justify-content:center;width:100%;padding:20px;display:flex}.timebox{background-color:var(--light-blue);border-radius:var(--radius-classic);color:var(--font-color-black);flex:1 1 0;min-width:0;margin:10px;padding:5px 30px;box-shadow:0 0 20px #3232964d}.timelabel{color:var(--font-color-white);margin:10px 0;padding:5px 10px;font-size:18px}.timeunit{flex-direction:row;align-items:center;display:flex}.day-info{background-color:var(--info-bg);color:var(--font-color-black);border-radius:0 0 var(--radius-classic) var(--radius-classic);flex-direction:row;justify-content:space-around;align-items:center;margin-top:0;display:flex}.day-card{border-radius:var(--radius-classic);text-align:center;border:none;padding:10px}.day-info hr{width:100%;margin:10px auto}.status-text{text-align:center;font-size:18px;font-weight:700}.progress-bar{color:var(--font-color-black);background:var(--progress-bar-bg);flex-direction:column;justify-content:center;align-items:center;margin:0;display:flex}.bar{border-radius:var(--radius-bar);background:0 0;width:100%;height:20px}.warning-box{text-align:center;border:2px solid var(--warning-border-color);background-color:var(--warning-bg-color);color:var(--warning-text-color);border-radius:var(--radius-classic);padding:0 30px;font-size:20px;font-weight:700}.progress{border-radius:var(--radius-bar) 0 0 var(--radius-bar);background-color:var(--progress-bg);width:50%;height:100%}.progress:hover{background-color:var(--progress-bar-hover);transform:scaleY(1.05)}.card-title{font-size:18px;font-weight:700}.card-content{font-size:14px;font-style:italic}.menu{width:100%;height:50%;padding:15px;font-size:26px;position:absolute}.option{float:left;background:0 0;border:none;margin:5px;padding:0}.settings{font-size:25px;transition:transform .3s linear;display:inline-block}.github-icon{width:25px;height:25px}.settings:hover{transform:rotate(45deg)scale(1.05)}.github-icon:hover{transform:scale(1.05)}footer{opacity:.75;color:var(--font-color-black);padding:20px;font-size:12px;font-style:italic}@media (width<=1120px){.timelabel,.timebox{margin-left:5px;margin-right:5px}.timebox{padding-left:20px;padding-right:20px}}@media (width<=820px){.school-time{justify-content:center;align-items:left;flex-direction:column}.timelabel,.timebox{flex:1;margin-left:10px;margin-right:10px}.timebox{flex:1}.abs-time .times .timebox{margin-left:25%}}@media (width<=550px){.menu{position:relative}.school-time{justify-content:center;align-items:left;flex-direction:column}.timelabel,.timebox{flex:1;margin-left:10px;margin-right:10px}.timebox{flex:1;padding-left:20px;padding-right:20px}}
