.clockContainer{width:auto;height:auto;margin:0;padding:15px 30px;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);border-radius:50px;box-shadow:0 0 20px rgba(0,0,0,.2)}.mainClockContent{text-align:center;font-size:25vw;font-weight:300}.secondaryClockContent{text-align:center;font-size:10vw;font-weight:500}@media screen and (min-width:1000px){.mainClockContent{font-size:20vw;text-align:center;font-weight:200}.secondaryClockContent{text-align:center;font-size:6vw;font-weight:400}}@media screen and (max-height:320px) and (min-width:400px){.mainClockContent{text-align:center;font-size:10vw;font-weight:200}.secondaryClockContent{text-align:center;font-size:5vw;font-weight:400}}@media screen and (max-height:420px) and (min-width:800px){.mainClockContent{text-align:center;font-size:7vw;font-weight:200}.secondaryClockContent{text-align:center;font-size:3vw;font-weight:400}}.stopWatchContainer{width:70vw;height:auto;margin:0;padding:15px 30px;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);border-radius:50px;box-shadow:0 0 20px rgba(0,0,0,.2)}.mainStopWatchContent{text-align:center;font-size:12vw;font-weight:300}.secondaryStopWatchContent{text-align:center;font-size:8vw;font-weight:500}.stopWatchButton{height:30px;width:50px;margin-left:15px;margin-top:8px;margin-bottom:8px;border-radius:20px;transition:.2s;outline:none;font-weight:400;border:0}.stopWatchButton:hover{cursor:pointer;width:60px}.stopWatchButton:active{opacity:.5}@media screen and (min-width:1000px){.mainStopWatchContent{text-align:center;font-weight:200}.secondaryStopWatchContent{text-align:center;font-size:6vw;font-weight:400}}@media screen and (max-height:320px) and (min-width:400px){.mainStopWatchContent{text-align:center;font-size:10vw;font-weight:200}.secondaryStopWatchContent{text-align:center;font-size:5vw;font-weight:400}}@media screen and (max-height:320px) and (min-width:800px){.mainStopWatchContent{text-align:center;font-size:7vw;font-weight:200}.secondaryStopWatchContent{text-align:center;font-size:3vw;font-weight:400}}.navBarContainer{width:100%;height:100%;box-sizing:border-box}.navBar{height:100%;width:80px;float:right}.Color{width:auto;height:40px;padding:10px;font-weight:500;overflow:hidden}.Color:hover{cursor:pointer;opacity:.5}.fontColor{width:auto;height:auto;padding:10px}.fontColor:hover{cursor:pointer;opacity:.5}.colorDrop{-webkit-transform:translateY(-10px);transform:translateY(-10px);width:auto;position:absolute;height:400px;display:none;overflow-y:scroll;border-radius:8px;top:50px;z-index:1;box-shadow:0 0 20px rgba(0,0,0,.3)}.colorDrop::-webkit-scrollbar{display:none}.Color:hover+.colorDrop,.colorDrop:hover{display:block}.fontColorDrop{width:auto;position:absolute;height:400px;display:none;overflow-y:scroll;border-radius:8px;z-index:1;box-shadow:0 0 20px rgba(0,0,0,.3)}.fontColorDrop::-webkit-scrollbar{display:none}.fontColor:hover+.fontColorDrop,.fontColorDrop:hover{display:block}.colorButton{height:30px;width:50px;margin-left:15px;margin-top:8px;border-radius:20px;outline:none;border:0;box-shadow:0 0 12px rgba(0,0,0,.3)}.colorButton:hover{cursor:pointer;box-shadow:0 0 16px rgba(0,0,0,.6)}.fontColorButton{height:30px;width:50px;margin-left:15px;margin-top:8px;border-radius:20px;outline:none;border:0;box-shadow:0 0 12px rgba(0,0,0,.3)}.fontColorButton:hover{cursor:pointer;box-shadow:0 0 16px rgba(0,0,0,.6)}@media screen and (max-height:300px){.colorDrop,.fontColorDrop{height:120px!important}}@media screen and (max-height:500px){.colorDrop,.fontColorDrop{height:240px}}.modeDrop{-webkit-transform:translateY(65px);transform:translateY(65px);width:80px;position:absolute;height:auto;display:none;border-radius:8px;text-align:center;top:50px;z-index:1;box-shadow:0 0 20px rgba(0,0,0,.3)}.mode:hover+.modeDrop,.modeDrop:hover{display:block}.mode{width:auto;height:40px;padding:10px;font-weight:500;overflow:hidden}.mode:hover{cursor:pointer;opacity:.5}.modeBtn{height:30px;width:70px;margin-bottom:8px;margin-top:8px;border-radius:20px;outline:none;border:0;box-shadow:0 0 12px rgba(0,0,0,.3)}.modeBtn:hover{box-shadow:0 0 16px rgba(0,0,0,.6);opacity:.9;cursor:pointer}.modeBtn:active{opacity:.5}.timerContainer{width:70vw;height:auto;margin:0;padding:15px 30px;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%);border-radius:50px;box-shadow:0 0 20px rgba(0,0,0,.2)}.mainTimerContent{text-align:center;font-size:12vw;font-weight:300}.secondaryTimerContent{text-align:center!important;font-size:8vw;font-weight:500}.timerButton{height:30px;width:50px;margin-left:15px;margin-top:8px;margin-bottom:8px;border-radius:20px;transition:.2s;outline:none;font-weight:400;border:0}.timerButton:hover{cursor:pointer;width:60px}.timerButton:active{opacity:.5}.timerInput{width:60px;-webkit-align-self:center;align-self:center;margin:10px;border-radius:5px}@media screen and (min-width:1000px){.mainTimerContent{text-align:center;font-weight:200}.secondaryTimerContent{text-align:center;font-size:6vw;font-weight:400}}@media screen and (max-height:320px) and (min-width:400px){.mainTimerContent{text-align:center;font-size:10vw;font-weight:200}.secondaryTimerContent{text-align:center;font-size:5vw;font-weight:400}}@media screen and (max-height:320px) and (min-width:800px){.mainTimerContent{text-align:center;font-size:7vw;font-weight:200}.secondaryTimerContent{text-align:center;font-size:3vw;font-weight:400}}@media screen and (max-width:500px){.timerButton{height:30px;width:45px;margin-left:5px;margin-top:8px;margin-bottom:8px;border-radius:20px;transition:.2s;outline:none;font-weight:400;border:0}.timerButton:hover{cursor:pointer;width:50px}}.app{width:100%;height:100%}
/*# sourceMappingURL=main.b3245198.chunk.css.map */