body,html{margin:0;padding:0;height:100%;font-family:Arial,sans-serif}.background{top:0;left:0;width:100%;position:fixed;height:100vh;z-index:-1;background-color:#333;background-size:cover;background-position:center;background-repeat:no-repeat}.layout{height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:none;color:#fff}.layout a{color:#fff;text-decoration:none}.layout a:hover{text-decoration:underline}img{width:1rem;height:1rem;margin:.3rem}img:hover{cursor:pointer}header{position:fixed;top:0;left:0;margin:.8rem}.time{font-size:6.5rem;margin:0;font-weight:700}.date{font-size:2.5rem;margin:0;font-weight:700}.greeting{font-size:3rem;font-weight:700}.search-box{margin:1rem 0}.search-box input{width:390px;max-width:80vw;padding:.5rem 1rem;font-size:1.4rem;border:none;border-radius:20px;background:#fff3;color:#fff;outline:none}.search-box input::placeholder{color:#ffffffb3}.quote{font-size:1.2rem;width:80vw;max-width:600px;display:flex;flex-direction:column;align-items:center}footer{position:fixed;bottom:1rem;font-size:.8rem}footer>img{width:1.1rem;height:1.1rem;margin:.5rem}footer>div:first-child{position:fixed;bottom:1rem;left:1rem;font-size:.95rem}footer>div:last-child{position:fixed;bottom:2.2rem;left:47.5vw}.clock>svg{width:200px;height:200px}.clock>svg>*{stroke:#fff}.clock>svg>line{stroke-linecap:round;stroke-width:2;transform-origin:50px 50px;transition:transform .15s cubic-bezier(.175,.885,.32,1.275)}.modal{display:flex;position:fixed;z-index:1000;left:0;top:0;width:100%;height:100%;overflow:auto;background-color:#0006;color:#333}.modal-content{background-color:#fff;margin:auto;padding:15px;border:1px solid #ccc;width:80%;max-width:500px}.modal-content>textarea{width:95%;padding:10px;border:1px solid #ccc;border-radius:4px}.modal-content>.modal-footer{display:flex;justify-content:space-between;margin-top:1rem}.modal-content>.modal-footer>button{padding:.5rem 1rem;border:none;border-radius:4px;background-color:#333;color:#fff;cursor:pointer}.modal-content>.modal-footer>button:hover{background-color:#555}.modal-content>.modal-footer>button:active{background-color:#777}