.hidden{display:none}body{height:100vh;padding:30px;box-sizing:border-box;background-size:cover;color:#fff;text-align:center}body::after{content:'';position:fixed;left:0;right:0;top:0;bottom:0;background:rgba(0,0,0,0.6);z-index:-1}article{margin:0 auto}.flex{display:flex}.flex-column{display:flex;flex-direction:column}input,.btn{box-sizing:border-box;font-size:1.6rem;vertical-align:middle}input{border:1px solid #ccc;padding:0 1rem;border-radius:0.4rem 0 0 0.4rem}.btn{border-radius:0.3rem;border:none;background:#FDD65F;color:#000;position:relative;font-weight:bold;padding:0 2rem;border-radius:0 0.4rem 0.4rem 0}.btn:focus,.btn:hover{border-color:#ffc310}.cont-greeting{margin-top:4rem}.cont-greeting label{display:block;font-size:2.4rem;margin-bottom:1rem}.cont-greeting input,.cont-greeting .btn{height:4rem}.cont-greeting .greeting{display:inline-block;font-size:5rem;padding-top:1rem;border-bottom:3px solid #fff}@media (max-width: 640px){.cont-greeting .greeting{font-size:3rem}}.cont-todo{position:absolute;bottom:16rem;right:30px}@media (max-width: 640px){.cont-todo{margin:2rem auto;position:relative;bottom:auto;right:auto}}.cont-todo .todo-form{display:flex}.cont-todo input,.cont-todo .btn{font-size:1.4rem;height:3rem}.cont-todo input{flex-grow:1;border:1px solid rgba(255,255,255,0.2);border-width:1px 0 1px 1px;background:rgba(255,255,255,0.2);color:#fff;transition:border 0.3s}.cont-todo input::placeholder{color:rgba(255,255,255,0.6)}.cont-todo input:active,.cont-todo input:hover,.cont-todo input:focus{border:1px solid rgba(255,255,255,0.8);transform:border 0.3s}.cont-todo .btn{padding:0 1rem;border:1px solid rgba(253,213,95,0.3);color:#ffc310;background:rgba(253,213,95,0.2);transition:border 0.3s, background-color 0.3s}.cont-todo .btn:hover{border:1px solid rgba(253,213,95,0.6);background:rgba(253,213,95,0.3)}.cont-todo .todo-list{margin-top:0.8rem;border:1px solid rgba(255,255,255,0.2);background:rgba(0,0,0,0.2)}.cont-todo .todo-list li{font-size:1.3rem;text-align:left;padding:0.6rem;display:flex;justify-content:space-between;align-items:center;margin-left:1rem;margin-right:1rem}.cont-todo .todo-list li:not(:first-child){border-top:1px solid rgba(255,255,255,0.1)}.cont-todo .todo-list li:first-child{margin-top:1rem}.cont-todo .todo-list li:last-child{margin-bottom:1rem}.cont-todo .del{color:#fff;font-size:0.8rem;text-align:center;font-weight:100;border:1px solid rgba(255,255,255,0.3);background:rgba(255,255,255,0.2);opacity:0.6;border-radius:2rem;width:1.6rem;height:1.6rem;padding:0;transition:all 0.3s;margin-left:0.8rem}.cont-todo .del:hover{opacity:1;color:#ff3737;border:1px solid rgba(255,0,0,0.2)}.cont-time{width:400px;max-width:calc(100% - 30px);position:absolute;top:50%;left:50%;transform:translate(-50%, -50%)}@media (max-width: 640px){.cont-time{position:relative;top:auto;left:auto;transform:translate(0, 0);margin-top:4rem}}.cont-time .date{text-align:center;font-size:3.6rem;letter-spacing:0.05rem;margin-bottom:1rem;font-weight:200}@media (max-width: 640px){.cont-time .date{font-size:2.4rem}}.cont-time .cont-clock{justify-content:center;align-items:center;font-size:20rem;line-height:1}@media (max-width: 640px){.cont-time .cont-clock{font-size:10rem}}.cont-time .cont-clock .flex-column{margin-left:0.8rem;line-height:1.2;font-size:0.3em;font-weight:200}.cont-time .cont-clock .flex-column .ampm{opacity:0.8;border-bottom:1px solid rgba(255,255,255,0.3);padding-bottom:0.2rem;margin-bottom:0.2rem}.cont-time .cont-clock .flex-column .seconds{font-size:1.1em}.cont-quote{border:1px solid rgba(255,255,255,0.3);padding:2.4rem;border-radius:0.4rem;text-align:center;margin-top:2rem;width:calc(100% - 60px);margin:0 auto;position:absolute;bottom:30px;left:50%;transform:translateX(-50%)}@media (max-width: 640px){.cont-quote{position:relative;bottom:auto;left:auto;transform:translateX(0);width:100%}}.cont-quote .quote{font-size:1.6rem;letter-spacing:-0.5px;word-break:keep-all;line-height:1.4}.cont-quote .author{font-size:1.2rem;opacity:0.7;margin-top:0.8rem}.cont-quote .author::before{content:'- '}.cont-quote .author::after{content:' -'}