@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap");body{background-color:#4158d0;background-image:linear-gradient(43deg, #4158d0 0%, #38b4b4 20%, #c850c0 46%, #4158d0 67%, #c850c0 100%);background-size:400% 400%;font-family:'Poppins', sans-serif;min-height:100vh;animation:bg 25s ease-in infinite alternate-reverse;color:#fff;margin:0;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center}@-webkit-keyframes bg{0%,100%{background-position:0% 50%}50%{background-position:100%, 50%}}@keyframes bg{0%,100%{background-position:0% 50%}50%{background-position:100%, 50%}}.shift{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:19px;height:45px}.shift #num{background:rgba(255,255,255,0.05);border-radius:6px;font-size:16px;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-top:1px solid rgba(255,255,255,0.2);border-left:1px solid rgba(255,255,255,0.2);-webkit-box-shadow:5px 5px 30px rgba(0,0,0,0.2);box-shadow:5px 5px 30px rgba(0,0,0,0.2);text-align:center;margin-left:10px;outline:none;width:40px;padding:0;border-bottom:none;height:29px;border-right:none;color:#fff}.shift #num::-webkit-inner-spin-button{display:none}.shift #num.check{border:2px solid red}.new{background:rgba(255,255,255,0.05);border-radius:6px;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-top:1px solid rgba(255,255,255,0.2);border-left:1px solid rgba(255,255,255,0.2);-webkit-box-shadow:5px 5px 30px rgba(0,0,0,0.2);box-shadow:5px 5px 30px rgba(0,0,0,0.2);padding:10px 5px}.main{background:rgba(255,255,255,0.05);border-radius:6px;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-top:1px solid rgba(255,255,255,0.2);border-left:1px solid rgba(255,255,255,0.2);-webkit-box-shadow:5px 5px 30px rgba(0,0,0,0.2);box-shadow:5px 5px 30px rgba(0,0,0,0.2);padding:10px;margin:20px 0;max-width:700px}.rot{border-bottom:2px solid #ffca18}.wrapper{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-direction:column;flex-direction:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center;margin-top:20px}.wrapper #text1,.wrapper #text2{width:400px;background:rgba(255,255,255,0.05);border-radius:6px;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-top:1px solid rgba(255,255,255,0.2);border-left:1px solid rgba(255,255,255,0.2);-webkit-box-shadow:5px 5px 30px rgba(0,0,0,0.2);box-shadow:5px 5px 30px rgba(0,0,0,0.2);height:150px;color:#fff;resize:none;outline:none;padding:5px}.wrapper #text1::-webkit-input-placeholder,.wrapper #text2::-webkit-input-placeholder{color:rgba(255,255,255,0.7)}.wrapper #text1:focus,.wrapper #text2:focus{border:2px solid #ffca18}.wrapper .submit{margin-top:20px;padding:10px;cursor:pointer;background:rgba(255,255,255,0.05);border-bottom:none;border-right:none;width:100%;color:#fff;border-radius:6px;-webkit-backdrop-filter:blur(15px);backdrop-filter:blur(15px);border-top:1px solid rgba(255,255,255,0.2);border-left:1px solid rgba(255,255,255,0.2);-webkit-box-shadow:5px 5px 30px rgba(0,0,0,0.2);box-shadow:5px 5px 30px rgba(0,0,0,0.2)}.wrapper .btns{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;-webkit-column-gap:10px;column-gap:10px;width:100%}.image{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center}.image p.active{border-bottom:2px solid #ffca18}.image img{width:70px;height:70px;-webkit-transform:rotate(180deg);transform:rotate(180deg);-webkit-transition:-webkit-transform 0.3s ease;transition:-webkit-transform 0.3s ease;transition:transform 0.3s ease;transition:transform 0.3s ease, -webkit-transform 0.3s ease;cursor:pointer}.image img.rotate{-webkit-transform:rotate(360deg);transform:rotate(360deg)}