html,body{top:0;left:0;width:100%;height:100%;background:#bdbdbd;color:#000;-webkit-user-select:none;user-select:none;font-family:Lato,sans-serif;padding:0;margin:0;box-sizing:border-box;overflow:hidden}canvas{overflow:hidden}@media (max-width: 412px){body{overflow-x:hidden}}.dark-mode{background:#3a3a3a;color:#fff}.frame{height:170px;width:280px;border:2px solid rgb(53,51,51)}.container{position:fixed;top:50%;left:10%;transform:translate(-50%,-50%);padding:.5rem;border-radius:4rem;font-size:.5rem;width:auto;background:rgba(255,255,255,.1);box-shadow:0 6px 20px #0003;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.3);z-index:1998}.container>div{text-align:center;padding:7px;font-size:1rem;list-style:none;opacity:100;width:auto;margin:.1rem}.container>div>a{text-decoration:none;color:#000;text-shadow:0 0 4px rgba(255,0,0,.4);transition:text-shadow .2s ease}.container>div:hover{opacity:1}.container>div:hover .icons{opacity:.7;color:azure}.toggle{display:none}@media (max-width: 1080px){.container{position:fixed;top:90%;left:50%;display:flex;justify-content:space-around;height:30px;width:300px}.container>div{margin-top:-18px}}@media (max-width: 820px){.container{position:fixed;top:90%;left:50%;display:flex;justify-content:space-around;height:30px;width:300px}.container>div{margin-top:-19px}}@media (max-width: 768px){.container{position:fixed;top:90%;left:50%;display:flex;justify-content:space-around;height:30px;width:300px}.container>div{margin-top:-18px}}@media (max-width: 412px){.container{position:fixed;top:96%;left:50%;display:flex;justify-content:space-around;width:300px;height:30px}.container>div{margin-top:-19px;opacity:100}}.content{display:flex;background:rgb(255,255,255,0);gap:0;width:100%;height:500px;border-radius:10px}.turn-dark{color:#fff}.detail{color:#000;padding:10px;border-top-left-radius:10px;border-bottom-left-radius:10px;background:rgb(0,0,0,.2);box-shadow:0 4px 30px #d6d3d31a;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);border:1px solid rgba(233,232,231,.3)}@media (max-width: 412px){.detail{border-top-left-radius:10px;border-top-right-radius:10px;border-bottom-left-radius:0}}.type{display:block}.details{display:block;padding:1rem;width:clamp(18rem,80vw,30rem)}.github-link{display:flex;justify-content:flex-start;text-align:center}.github-link a>.link{width:7rem;position:relative}.cv{height:2rem;border:none;border-radius:3px}.resume{display:grid;place-items:center}.cv>a{text-decoration:none;color:#fff}.aboutme{padding:1.5rem;background:rgb(0,0,0,.2);box-shadow:0 4px 30px #d6d3d31a;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);border:1px solid rgba(233,232,231,.3);border-top-right-radius:10px;border-bottom-right-radius:10px}.aboutme>p{text-align:left;font-size:1rem}.header{font-size:1rem;text-decoration:underline}.group{display:none;justify-content:space-around;width:25rem;padding:1rem;border-radius:10px}.one{font-size:.9rem;margin-top:.2rem;text-align:left}.one:nth-child(1){background:rgb(0,26,255);width:fit-content;font-weight:1px}@media (max-width: 1080px){.aboutme{padding:1rem;width:350px;font-size:.5rem}}@media (max-width: 1024px){.aboutme{padding:1rem;width:300px;font-size:2rem}.aboutme>p{font-size:1rem}}@media (max-width: 820px){.aboutme{padding:1rem;width:300px;font-size:.5rem}}@media (max-width: 768px){.aboutme{padding:1rem;width:250px;font-size:.5rem}}@media (max-width:412px){.content{font-size:.5rem;display:block;width:100%}.group{display:block;padding:1rem;width:300px}.aboutme{padding:1rem;width:315px;font-size:.5rem;border-radius:0}.aboutme>p{font-size:.7rem}.one{font-size:.7rem}}.project{display:flex;font-size:11px;gap:.5rem;color:#fff;border-bottom:1px solid orangered}.project-type{margin-top:13px}.icon{background-color:#fff;color:#000;padding:.3rem;border-radius:5px;size:4}.ui,.ui-notes{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:5;padding:10px;background:rgb(0,0,0,.2);box-shadow:0 4px 30px #d6d3d31a;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(5px);border:1px solid rgba(233,232,231,.3);border-radius:10px}@media (max-width: 412px){.ui-notes{width:350px;height:650px;overflow-x:hidden;overflow-y:scroll}}.just-for-bg{box-shadow:0 4px 30px #d6d3d31a;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);border:1px solid rgba(233,232,231,.3);border-radius:10px;padding:10px}.details{padding:none;gap:2rem}.github-link{display:flex;justify-content:left;align-items:center}.link{color:#fff;border:none;border-radius:7px;padding:7px;font-style:"Space Mono" monospace;text-decoration:none;font-size:.8rem}.floating-ui{background:black;border-radius:7px;color:wheat}.tools{list-style:none;display:flex;justify-content:flex-start;align-items:center;padding:0;gap:.4rem;font-size:1rem}.tools>li{background:rgba(255,255,255,.2);border-radius:10px;box-shadow:0 4px 30px #0000001a;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.3);padding:0;font-size:9px;margin:0;width:5rem;text-align:center}.description{font-size:13px;color:#fff}.name{font-weight:bolder;color:#ff4500;font-size:2rem;margin:5px 5px 5px 0}.github{font-size:3rem}.contacts{list-style:none}.contacts>li{margin-top:5px;border-radius:5px}.writeup-notes{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);height:600px;width:800px;background:rgba(0,0,0,.2);box-shadow:0 4px 30px #d6d3d30d;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);border:1px solid rgba(233,232,231,.3);padding:4rem}@media (max-width: 1080px){.writeup-notes{width:600px;padding:20px;border-radius:10px;height:400px}}@media (max-width: 820px){.writeup-notes{width:600px;padding:40px;height:600px}}@media (max-width: 768px){.writeup-notes{width:600px;padding:40px;height:600px}}@media (max-width: 412px){.writeup-notes{display:flex;flex-direction:column;align-items:center;gap:1px;padding:40px;width:300px;height:600px}}.writeup{font-size:1rem;margin-top:10px;list-style:none;height:30px;font-style:normal;color:#4a4c54;margin-left:1rem}.topics{display:flex;gap:.5rem;border:none}.topic-tag{background:#525252;border-radius:6px;border-radius:.9rem;font-size:.7rem;color:#fff;font-style:normal;font-weight:500;margin-left:1rem;list-style:none;display:flex;align-items:center;justify-content:center;width:auto;padding:.6rem;height:1px;transition:transform .25s}.note-container{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:1200px;height:90vh;padding:1rem;z-index:9999;overflow-y:auto;border-radius:6px;background:rgba(58,58,58,.9);box-shadow:0 4px 30px #d6d3d30d;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);border:1px solid rgba(233,232,231,.3)}.note-container::-webkit-scrollbar{width:7px}.note-container::-webkit-scrollbar-track{background:rgba(248,51,2,.05);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-radius:10px}.note-container::-webkit-scrollbar-thumb{background-color:#ee520ae6;border-radius:8px;border:2px solid transparent;background-clip:content-box}.note-display{position:relative;display:flex;justify-content:center}.note-display>h2{color:#fff;margin-top:0}.back-button{background:none;position:sticky;top:11px;left:10px;z-index:1001;border-radius:9px;height:1.6rem;width:1.6rem;margin:1rem;cursor:pointer;border:none;background:rgb(119,117,116);color:#fff}.back-button:hover{background-color:#fff;transition:1s ease-in-out}.text-body{padding:1rem}.text-body>p{padding:0}.note-icon{margin-top:2px;margin-left:1.5rem;padding:.8rem;border-radius:6px;height:30px;width:30px;display:flex;justify-content:center;align-items:center}.notebook{border:1px solid grey;margin-top:1rem;transition:transform .25s;border-radius:5px;display:flex;padding:2px;gap:1rem;width:800px;height:30px}.notebook:hover{transform:translate(-10px);border:1px solid rgb(235,81,46,.4);background:rgb(235,81,46,.4);outline-offset:15px}.notebook:hover .topic-tag{background:white}@media (max-width: 1024px){.notebook{width:600px}.note-container{width:800px;left:50%;padding:40px}.topic-tag{font-size:10px}}@media (max-width: 1080px){.notebook{width:600px}.note-container{width:750px;left:50%;padding:40px}.topic-tag{font-size:10px}}@media (max-width: 820px){.notebook{width:600px}.note-container{width:600px;left:50%;padding:40px}}@media (max-width: 768px){.notebook{width:600px}.note-container{width:600px;left:50%;padding:40px}.topic-tag{font-size:10px}}@media (max-width: 412px){.notebook{width:300px;height:90px;padding:5px}.writeup{color:#fff;font-size:1.5rem}.topics{position:relative;margin-top:1rem;font-size:3rem}.topic-tag{font-size:14px}.note-icon,.note-details{display:none}.note-container{position:absolute;top:1rem;left:50%;transform:translate(-50%);width:90%;max-width:600px;max-height:80vh;overflow-y:auto;background:rgba(0,0,0,.9);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:12px;z-index:10;padding:1rem}}.writeup-date{color:#fff;margin-left:9px;font-family:Lato,sans-serif}.note-details{justify-content:center;align-items:center;display:flex}@media (max-width: 412px){.note-details{display:block}}.floating-nav{position:fixed;top:62%;left:13%;background:rgba(0,0,0,.5);box-shadow:0 4px 30px #d6d3d30d;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(5px);border-radius:5rem;padding:.5rem;width:5rem;height:1.5rem;z-index:1000000;display:flex;justify-content:space-around;align-items:center}@media (max-width: 412px),(max-width: 768px),(max-width: 820px),(max-width: 1080px){.floating-nav{position:fixed;top:77%;left:68%;background:rgba(255,255,255,.2);border-radius:16px;box-shadow:0 4px 30px #d6d3d31a;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);border:1px solid rgba(233,232,231,.3);border-radius:5rem;padding:.5rem;width:1rem;height:4rem;z-index:1000000;display:flex;flex-direction:column;align-items:center;gap:1rem}}@media (max-width: 1080px){.floating-nav{left:60%;top:75%}}@media (max-width: 820px){.floating-nav{left:64%;top:79%}}@media (max-width: 768px){.floating-nav{left:64%}}@media (max-width: 412px){.floating-nav{left:77%;top:80%}}.copy-button{background:none;border:none;color:#fff;font-size:1rem;cursor:pointer;padding:.5rem;border-radius:5px;margin-left:1rem}.light-que,.colour-que{display:none;position:absolute;top:27%;left:120%;transition:1s ease;font-size:.7rem}.toggle-light-dark:hover .light-que,.colour-picker:hover .colour-que{display:block;transition:2s ease-in-out}.theme{display:flex;padding:.5rem;justify-content:space-around;background:rgba(255,255,255,.2);border-radius:2rem;box-shadow:0 4px 30px #d6d3d31a;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);border:1px solid rgba(233,232,231,.3);position:fixed;left:45%;top:70%;transform:translate(-50%,-50%);z-index:100000}@media (max-width: 412px),(max-width: 768px),(max-width: 1080px){.theme{position:fixed;left:50%;top:5%}}@media (max-width: 820px){.theme{top:10%}}@media (max-width: 768px){.theme{top:10%}}.theme>div{padding:.5rem;margin-left:.5rem;width:.5rem;height:.5rem;display:flex;justify-content:center;align-items:center;border-radius:50%}.function-que,.about-que,.home-que,.project-que,.notes-que{position:absolute;left:120%;background:red;padding:.5rem;border-radius:.6rem;display:none}.home-que{top:7%}.about-que{top:27%}.project-que{top:45%}.notes-que{top:65%}.function-que{top:85%}.home:hover .home-que,.about:hover .about-que,.projects:hover .project-que,.note:hover .notes-que{display:block}@media (max-width : 412px){.function-que,.about-que,.home-que,.project-que,.notes-que{position:absolute;top:-100%;border-radius:.6rem;font-size:.6rem}.home-que{left:5%;border-radius:.6rem;font-size:.6rem}.about-que{left:25%;border-radius:.6rem;font-size:.6rem}.project-que{left:40%;border-radius:.6rem;font-size:.6rem}.notes-que{left:60%;border-radius:.6rem;font-size:.6rem}}.folder-section{padding:1rem}.note-list-indented{border-left:2px solid rgba(255,0,0,.9);padding-left:1rem}@media (max-width: 412px){.note-list-indented{padding-left:0}}.socials-list a{color:#fff;text-decoration:none;transition:transform .2s ease,color .2s ease}.socials-list :hover{transform:translateY(-3px)}.socials-list{list-style:none;display:flex;justify-content:space-around}.socials-list>li{background:rgba(255,255,255,.2);border-radius:10px;box-shadow:0 4px 30px #0000001a;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);border:1px solid rgba(255,255,255,.3);padding:.5rem}.fourofour{color:#fff;font-size:3rem;background:none}.show-copied{width:fit-content;padding:.5rem;border-radius:8px}.highlighted svg{fill:#fff}.project-panel{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:90%;max-width:600px;max-height:80vh;padding:1rem;overflow:auto;z-index:10}.project-component{background:rgba(255,255,255,.1);border-radius:12px;box-shadow:0 6px 20px #0003;backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.3);padding:1rem;margin-bottom:1rem;transition:transform .2s ease,box-shadow .2s ease}.project-component:hover{transform:translateY(-2px);box-shadow:0 8px 25px #0000004d}.info-board{background:none;padding:8px;font-size:1.4rem;font-family:monospace}.info-board *{margin-top:1rem}.copyright{background:white;color:#000;padding:.4rem}.time{background:rgba(255,255,255,.1);border-radius:12px;box-shadow:0 6px 20px #0003;backdrop-filter:blur(1px);-webkit-backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.3);padding:.5rem;width:fit-content}