.red-orange{background:#f44336!important}.light-blue{background:#29b6f6!important}.purple{background:#d50095!important}.sans-serif{font-family:sans-serif}.cursive{font-family:cursive}.times-new-roman{font-family:"Times New Roman",Times,serif}*,:after,:before{box-sizing:border-box;margin:0;padding:0}body,html{height:100%}body{background:#010111;color:#f3f3f3;font-size:.875rem}body #root{height:100%}body #root .app{min-height:100%;width:100%;position:relative;padding:2.5rem 0;overflow:hidden;display:grid;place-items:center;grid-gap:2rem;gap:2rem}body #root .app nav{height:3.5rem;width:90%;max-width:36rem;padding:.25rem;border-radius:9999rem;background-color:#000;display:flex;justify-content:center;grid-gap:.25rem;gap:.25rem}body #root .app nav button.nav-link{width:12rem;border:none;border-radius:inherit;outline:none;background:transparent;color:#3f3f3f;font-weight:700;cursor:pointer;transition:.35s;font-size:1.25em}body #root .app nav button.nav-link.active{color:#fff}body #root .app nav button.nav-link:hover{background:hsla(0,0%,100%,.1)}@media (max-width:640px){body #root .app nav{padding:.25rem;grid-gap:.25rem;gap:.25rem}body #root .app nav button.nav-link{width:7rem}}body #root .app main{height:28rem;width:28rem;position:relative;overflow:hidden;border-radius:100%;background:#010111;-webkit-transform:rotate(-40deg);transform:rotate(-40deg);box-shadow:0 -2.5rem 2.5rem #031323,0 1rem 1rem rgba(0,0,0,.5)}body #root .app main:after,body #root .app main:before{content:"";position:absolute;width:50%;height:100%;background:linear-gradient(#010111,#031323)}body #root .app main:before{border-top-left-radius:9999rem;border-bottom-left-radius:9999rem}body #root .app main:after{right:0;border-top-right-radius:9999rem;border-bottom-right-radius:9999rem}body #root .app main .timer{position:absolute;z-index:10;top:2rem;left:2rem;right:2rem;bottom:2rem;border-radius:inherit;background:inherit;-webkit-transform:rotate(40deg);transform:rotate(40deg)}body #root .app main .timer .countdown{position:absolute;width:100%;height:100%;display:grid;place-items:center;background:transparent!important}body #root .app main .timer .countdown.red-orange svg circle:first-child{stroke:#f44336}body #root .app main .timer .countdown.light-blue svg circle:first-child{stroke:#29b6f6}body #root .app main .timer .countdown.purple svg circle:first-child{stroke:#d50095}body #root .app main .timer .countdown svg{position:absolute;top:0;left:0;pointer-events:none;-webkit-transform:rotate(-90deg);transform:rotate(-90deg);-webkit-transform-origin:center;transform-origin:center}body #root .app main .timer .countdown svg circle{fill:transparent}body #root .app main .timer .countdown svg circle:first-child{stroke-width:.2rem}body #root .app main .timer .countdown svg circle:nth-child(2){stroke-width:.25rem;stroke:#010111}body #root .app main .timer .countdown .output{position:absolute;cursor:pointer;transition:.25s;display:grid;place-items:center}body #root .app main .timer .countdown .output span{display:block;text-align:center;font-size:5em;margin-bottom:1.5rem}body #root .app main .timer .countdown .output object{pointer-events:none;height:2.5rem;width:2.5rem}@media (max-width:640px){body #root .app main{height:19.5rem;width:19.5rem}body #root .app main .timer{top:1.5rem;left:1.5rem;right:1.5rem;bottom:1.5rem}body #root .app main .timer .countdown .output object{height:2rem;width:2rem}}body #root .app footer{cursor:pointer}body #root .app footer svg{height:3rem;width:3rem;fill:#3f3f3f}body #root .app footer:hover svg{fill:#f3f3f3}body #root .app .modal{height:100%;width:100%;position:absolute;background:rgba(0,0,0,.5);display:grid;place-items:center}body #root .app .modal.close{display:none}body #root .app .modal .setting{width:42.5rem;height:auto;background:#fff;color:#000;border-radius:1.5rem;padding:1rem 0}body #root .app .modal .setting .setting-head{padding:1.25rem 2.5rem;border-bottom:thin solid #f3f3f3;display:flex;justify-content:space-between;align-items:center}body #root .app .modal .setting .setting-head h1{font-size:3em}body #root .app .modal .setting .setting-head button.close{font-size:2em;color:#3f3f3f}body #root .app .modal .setting .setting-body{padding:0 2.5rem}body #root .app .modal .setting .setting-body .time{padding:1.5rem 0;border-bottom:thin solid #f3f3f3}body #root .app .modal .setting .setting-body .time h2{padding-bottom:1rem;text-transform:uppercase;font-size:1.25em;letter-spacing:.25rem}body #root .app .modal .setting .setting-body .time .options{display:grid;grid:auto/repeat(3,1fr);grid-column-gap:.75rem;-webkit-column-gap:.75rem;column-gap:.75rem}body #root .app .modal .setting .setting-body .time .options .option h3{font-size:1em;color:#8c8c8c;padding-bottom:.5rem}body #root .app .modal .setting .setting-body .time .options .option .select{background:#f3f3f3;padding:.75rem;border-radius:.5rem;display:flex;justify-content:space-between;align-items:center}body #root .app .modal .setting .setting-body .time .options .option .select span{font-weight:700;font-size:1.125em;padding:0 .5rem}body #root .app .modal .setting .setting-body .time .options .option .select .increment{cursor:pointer}body #root .app .modal .setting .setting-body .time .options .option .select .increment svg{height:1rem;width:1rem}body #root .app .modal .setting .setting-body .time .options .option .select .increment .down,body #root .app .modal .setting .setting-body .time .options .option .select .increment .up{padding:0 .5rem}body #root .app .modal .setting .setting-body .time .options .option .select .increment .down:hover,body #root .app .modal .setting .setting-body .time .options .option .select .increment .up:hover{background:hsla(0,0%,100%,.5)}body #root .app .modal .setting .setting-body .color,body #root .app .modal .setting .setting-body .font{display:flex;justify-content:space-between;align-items:center;padding:1.5rem 0}body #root .app .modal .setting .setting-body .color h2,body #root .app .modal .setting .setting-body .font h2{text-transform:uppercase;font-size:1.25em;letter-spacing:.25rem}body #root .app .modal .setting .setting-body .color .options,body #root .app .modal .setting .setting-body .font .options{display:flex;grid-gap:1rem;gap:1rem}body #root .app .modal .setting .setting-body .color .options .option,body #root .app .modal .setting .setting-body .font .options .option{width:2.75rem;height:2.75rem;border-radius:50%;display:grid;place-items:center;cursor:pointer}body #root .app .modal .setting .setting-body .font{border-bottom:thin solid #f3f3f3}body #root .app .modal .setting .setting-body .font .options .option:first-child{background-color:#000;color:#fff;font-family:sans-serif!important}body #root .app .modal .setting .setting-body .font .options .option:nth-child(2){background-color:#e5e5e5;font-family:cursive!important}body #root .app .modal .setting .setting-body .font .options .option:nth-child(3){background-color:#bfbfbf;font-family:"Times New Roman",Times,serif!important}body #root .app .modal .setting .setting-body .color .options .option:first-child{background-color:#f44336}body #root .app .modal .setting .setting-body .color .options .option:nth-child(2){background-color:#29b6f6}body #root .app .modal .setting .setting-body .color .options .option:nth-child(3){background-color:#d50095}body #root .app .modal .setting .setting-body .color .options .option svg{width:1.125rem}body #root .app .modal .setting button.apply{padding:1rem 3.5rem;border-radius:99999rem;color:#fff;position:relative;left:50%;-webkit-transform:translate(-50%,75%);transform:translate(-50%,75%)}body #root .app .modal .setting button{border:none;outline:none;background:transparent}@media (max-width:640px){body #root .app .modal .setting{width:90%}body #root .app .modal .setting .setting-head{padding:1.25rem 1.5rem}body #root .app .modal .setting .setting-body{padding:0 1.5rem}}@media (max-width:640px){body #root{font-size:.65rem}body #root .app{padding:2rem 0;grid-gap:2rem;gap:2rem}body #root .app footer svg{height:2rem;width:2rem}}
/*# sourceMappingURL=main.3895db48.chunk.css.map */