@import"https://fonts.googleapis.com/css2?family=Quicksand:wght@300;400;500;600;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Noto+Sans+Gothic&family=Noto+Sans:ital,wght@0,100..900;1,100..900&family=Nunito:ital,wght@0,200..1000;1,200..1000&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Raleway:ital,wght@0,100..900;1,100..900&family=Roboto+Mono:ital,wght@0,100..700;1,100..700&family=Rubik:ital,wght@0,300..900;1,300..900&family=Ubuntu:ital,wght@0,300;0,400;0,500;0,700;1,300;1,400;1,500;1,700&display=swap";*{margin:0;padding:0;box-sizing:border-box}#root{min-width:100vw;min-height:100vh}*{margin:0;padding:0;box-sizing:border-box;font-family:Quicksand,sans-serif}body{display:flex;justify-content:center;align-items:center;min-height:100vh;background:#000}section{position:absolute;width:100vw;height:100vh;display:flex;justify-content:center;align-items:center;gap:2px;flex-wrap:wrap;overflow:hidden}section:before{content:"";position:absolute;width:100%;height:100%;background:linear-gradient(#000,#0f0,#000);animation:animate 5s linear infinite}@keyframes animate{0%{transform:translateY(-100%)}to{transform:translateY(100%)}}section span{position:relative;display:block;width:calc(6.25vw - 2px);height:calc(6.25vw - 2px);background:#181818;z-index:2;transition:1.5s}section span:hover{background:#0f0;transition:0s}section .signin{position:absolute;width:400px;background:#222;z-index:1000;display:flex;justify-content:center;align-items:center;padding:40px;border-radius:4px;box-shadow:0 15px 35px #000}section .signin .content{position:relative;width:100%;display:flex;justify-content:center;align-items:center;flex-direction:column;gap:40px}section .signin .content h2{font-size:2em;color:#0f0;text-transform:uppercase}section .signin .content .form{width:100%;display:flex;flex-direction:column;gap:25px}section .signin .content .form .inputBox{position:relative;width:100%}section .signin .content .form .inputBox input{position:relative;width:100%;background:#333;border:none;outline:none;padding:25px 10px 7.5px;border-radius:4px;color:#fff;font-weight:500;font-size:1em}section .signin .content .form .inputBox i{position:absolute;left:0;padding:15px 10px;font-style:normal;color:#aaa;transition:.5s;pointer-events:none}.signin .content .form .inputBox input:focus~i,.signin .content .form .inputBox input:valid~i{transform:translateY(-7.5px);font-size:.8em;color:#fff}.signin .content .form .links{position:relative;width:100%;display:flex;justify-content:space-between}.signin .content .form .links a{color:#fff;text-decoration:none}.signin .content .form .links a:nth-child(2){color:#0f0;font-weight:600}.signin .content .form .inputBox input[type=submit]{padding:10px;background:#0f0;color:#000;font-weight:600;font-size:1.35em;letter-spacing:.05em;cursor:pointer}.loginButton:active{opacity:.6}@media (max-width: 900px){section span{width:calc(10vw - 2px);height:calc(10vw - 2px)}}@media (max-width: 600px){section span{width:calc(20vw - 2px);height:calc(20vw - 2px)}}#viewbutton{width:10%;height:30px;background-color:#333}*{margin:0;padding:0;box-sizing:border-box;font-family:Inter}.website{width:100vw;height:100vh;display:flex;background-color:#000}.leftPanel{width:30%;margin:20px;background-color:#333;display:flex;flex-direction:column;justify-content:space-between;border-radius:1rem;color:azure}.rightPanel{width:70%;background-color:#333;margin:20px;border-radius:1rem;color:#fff;padding:20px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#888 #333}.rightPanel::-webkit-scrollbar{width:8px}.rightPanel::-webkit-scrollbar-thumb{background-color:#888;border-radius:10px}.rightPanel::-webkit-scrollbar-track{background-color:#333}.sendMessage{width:100%;display:flex;padding:20px;background-color:#fff;border-radius:0 0 1rem 1rem}#inp{height:40px;padding:10px;outline:none;border:none;width:80%;background-color:#c8c6c6}.leftPanel h1,p{margin-left:20px;margin-top:20px}#button{width:20%;outline:none;border:none;background-color:#343232;color:#fff;transition:all .3s}#inp:focus{border:2px solid blue}#button:hover{transform:scale(1.1)}#button:active{opacity:.8;transform:scale(1)}