@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@200;300;400;500;600;700&display=swap);@import url(https://fonts.googleapis.com/css2?family=Nunito:wght@400;600;800&display=swap);*{font-family:Poppins,sans-serif}a{text-decoration:none}.headerTop{align-items:center;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#333333d9;box-shadow:0 4px 6px #0000001a;display:flex;height:60px;justify-content:center;padding:0 20px;position:fixed;top:0;transition:background .3s,box-shadow .3s;width:100%;z-index:100}.headerTop:hover{background:#333333f2;box-shadow:0 6px 8px #0003}.nav{align-items:center;display:flex;justify-content:space-between;max-width:1100px;width:100%}.nav_logo{color:#fff;font-size:25px;font-weight:600;transition:color .3s}.nav_logo:hover{color:#ff6b6b}.nav_items{column-gap:25px;list-style:none;padding:0}.nav_items,.nav_link{align-items:center;display:flex}.nav_link{color:#fff;column-gap:8px;font-size:20px;margin-right:30px;transition:color .3s}.nav_item{display:flex}.nav_link:hover{color:#ff6b6b}.buttons{background:#ffffff1a;border:2px solid #fff;border-radius:6px;color:#fff;cursor:pointer;font-size:15px;padding:6px 24px;transition:background .3s,transform .2s}.buttons:hover{background:#fff3}.buttons:active{transform:scale(.98)}*{font-family:Nunito,sans-serif}.box{max-width:500px;overflow:hidden;width:100%}.wrapper{height:100%;width:100%}input{background:#0000;color:#333;font-size:17px;padding:0 10px;transition:all .3s ease-in-out}.input-submit{border-radius:7px;height:40px;width:100%}*,.input-submit{box-sizing:border-box}*{font-family:nunito,sans-serif;font-weight:600;margin:0;padding:0}body{background:linear-gradient(325deg,#03001e,#7303c0 50%,#ec38bc);background-size:cover}.container{align-items:center;display:flex;justify-content:center;min-height:100vh;position:relative}.box{-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);background:#fff;box-shadow:2px 2px 15px 2px #0000001a,-2px 0 15px 2px #0000001a;padding:40px;width:450px;z-index:10}.box,.wrapper{border-radius:30px;height:500px}.wrapper{background:#ffffff87;box-shadow:2px 2px 15px 2px rgba(0,0,0,.115),-2px 0 15px 2px rgba(0,0,0,.054);position:absolute;transform:rotate(5deg);width:455px}.header{margin-bottom:50px}.header header{display:flex;justify-content:right}header img{width:25px}.header p{font-size:25px;font-weight:800;margin-top:10px}.input-box{display:flex;flex-direction:column;margin:10px 0;position:relative}i{color:#595b5e;font-size:22px;position:absolute;right:12px;top:35px}input{border:2px solid #999d9e;border-radius:7px;height:40px;margin:7px 0;outline:none}.input-field{background:#0000;color:#333;font-size:17px;font-weight:500;padding:0 10px;transition:all .3s ease-in-out}.input-field:focus{border:2px solid #5935b4}.input-field:focus~i{color:#5935b4}.input-submit{background:#1e263a;border:none;color:#fff;cursor:pointer;margin-top:20px;transition:all .3s ease-in-out}.input-submit:hover{background:#122b71}.bottom{display:flex;flex-direction:row;justify-content:space-between;margin-top:25px}.bottom span a{color:#727374;text-decoration:none}.bottom span a:hover{text-decoration:underline}.section1{background:linear-gradient(325deg,#03001e,#7303c0 50%,#ec38bc);font-family:Arial,Helvetica,sans-serif;height:100%;margin:0;overflow:hidden;width:100%}.section2{color:#fff;margin:0}.grid-container,.section2{align-items:center;display:flex;height:100vh;justify-content:center}.grid{background-color:#262626;border:2px solid #333;box-shadow:0 4px 10px #000000b3;flex-direction:column}.grid,.row{display:flex}.cell{background-color:#333;border:3px solid #444;height:50px;transition:background-color .3s;width:50px}.cell:hover{background-color:#555}.controls{align-items:flex-start;color:#fff;display:flex;flex-direction:column;margin-left:80px;width:200px}.message{height:24px;margin-bottom:20px;overflow:hidden;text-align:center;width:85%}.direction-buttons{grid-gap:10px;display:grid;gap:10px;grid-template-areas:". up ." "left . right" ". down ."}.direction-buttons button{align-items:center;background-color:#888;border:2px solid #ccc;border-radius:5px;box-shadow:0 2px 5px #0000004d;color:#fff;display:flex;font-size:1.5rem;height:50px;justify-content:center;transition:background-color .3s,transform .2s,box-shadow .3s;width:50px}.direction-buttons button:hover{background-color:#555;box-shadow:0 4px 10px #00000080;transform:scale(1.1)}.cell{align-items:center;color:#fff;display:flex;font-size:2rem;justify-content:center;transition:transform .3s}.cell:hover{transform:scale(1.1)}h1{color:#fff;font-size:2.5rem;margin:20px 0}
/*# sourceMappingURL=main.420eade1.css.map*/