body{background-color:#4e17cf;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;position:relative;margin:0;padding:0 20px;overflow-x:hidden}*{font-family:Bricolage Grotesque,sans-serif}.flex{display:flex}.flex.row{flex-direction:row;align-items:center;justify-content:space-between}.flex.column{flex-direction:column;align-items:flex-start;justify-content:center}.canvas-cont{position:fixed;z-index:3;top:0;left:0;width:100vw;height:100vh;pointer-events:none}#canvas3d{width:100%;height:100%}nav{width:100%;position:relative;z-index:10}nav>div{display:flex;align-items:center;gap:10px}nav>div>img{width:60px}.heading{font-size:34px;color:#fff}p{margin:0;font-size:18px;font-weight:200;color:#fff}.bar{height:100%;width:0%;position:absolute;right:0;top:0;background-color:#000;z-index:-5}.keyboardheading{font-size:10vw;position:absolute;top:calc(100vh - 50vw + 40px);font-weight:800;left:20px;line-height:1;letter-spacing:-5px;color:#fff}h2{font-size:40px;line-height:1;color:#fff}#hero{height:calc(100vh - 100px);margin-top:40px}#part1{width:100%;height:150vh}.part1-info,.part2-info{width:30%;gap:40px;padding:1%}button{border:1px solid rgba(255,255,255,.4);background-color:transparent;font-size:18px;font-weight:200;width:100%;border-radius:10px;padding:20px 0;cursor:pointer;color:#fff}button:hover{border:1px solid white}#part2{height:150vh;width:100%}#part3{height:120vh;justify-content:flex-end!important;align-items:center!important;margin-bottom:50px}a{color:#fff}.Create{background-color:transparent;color:#fff;border:2px solid white;text-decoration:none;padding:10px 20px;font-size:20px;font-weight:500;border-radius:2rem;cursor:pointer}.scroll-icon{height:50px;width:35px;border:1px solid white;border-radius:100px;padding:5px 14px 20px;box-sizing:border-box}.scroll{height:10px;width:5px;border-radius:10px;background-color:#fff}.key{display:inline-block;letter-spacing:-2vw;transition:transform .2s}@keyframes pressDown{0%,to{transform:translateY(0)}50%{transform:translateY(10px)}}@media screen and (max-width: 1000px){.canvas-cont{width:200vw;transform:scale(.5);left:auto;top:25vh}.keyboardheading{top:20vw;font-size:15vw}.part1-info,.part2-info{width:100%}h2{font-size:5vw}}