nav{border-bottom:1px solid #ffffff;margin:0;padding:0}nav ul{list-style-type:none;display:flex;align-items:center;justify-content:flex-end;height:100%;padding-top:15px;margin-top:0!important}nav li:first-child{width:25px;margin-right:auto;cursor:pointer}nav li:nth-child(2),nav li:nth-child(3){display:inline-block;margin:0 20px;font-size:1.2rem}nav li:nth-child(2):after,nav li:nth-child(3):after{content:"";width:100%;height:2px;background:#fff;display:block;position:relative;top:3px;width:0%;transition:width .5s ease-in}nav li:nth-child(2):hover:after,nav li:nth-child(3):hover:after{width:100%}nav.custom li:first-child{display:inline-block;margin:0 50px;font-size:1.2rem}nav.custom li:first-child:after{content:"";width:100%;height:2px;background:#fff;display:block;position:relative;top:3px;width:0%;transition:width .5s ease-in}nav.custom li:first-child:hover:after{width:100%}nav button{border-radius:25px;width:68px;height:35px;border:none;background-color:#fff;align-items:center;display:flex;justify-content:space-between;position:relative;cursor:pointer;margin:0 20px;padding:0 9px}nav button img{width:20px}nav .toggle-circle{position:absolute;width:30px;height:30px;border-radius:99%;background-color:#2cab8d;transition:2s;transform:translate(-5px)}nav .toggle-circle.light{transform:translate(25px)}nav.light{background-color:#2cab8d;color:#000;border-color:#2cab8d}@media screen and (max-width: 860px){svg{display:none}}.intro-container{width:100%;height:100vh;padding:80px;display:grid;grid-template-columns:1fr 1fr;align-items:center;max-width:100%}.intro-container span{color:#2cab8d}.intro-container h1{font-size:6rem;margin:0}.intro-container h1 span{cursor:pointer}.intro-container h2{overflow:hidden;white-space:nowrap;background-color:#2cab8d;padding:5px;font-size:3rem;display:inline-block;animation:typing 3s,blinking .7s infinite}.intro-container h2 span{color:#fff;cursor:pointer}.intro-container img{width:100%;margin:0 auto}.intro-container.light h1{color:#000}.img-container{position:relative;width:900px}.img-container .welcome{position:absolute;overflow:hidden;opacity:0;animation-fill-mode:both;top:380px;left:345px;transform:rotate(30deg);font-size:.9rem;letter-spacing:2px;transition:1s;font-family:Roboto Mono,monospace}.img-container:hover .welcome{animation-direction:alternate;top:360px;left:360px;opacity:1}.secretcode1{font-size:1.5rem;position:absolute;top:480px;left:625px;opacity:0;cursor:pointer}.secretcode1:hover{opacity:1}@keyframes slide-up{0%{transform:rotate(30deg) translateY(0);top:335px;left:310px}20%{visibility:hidden}to{transform:rotate(30deg);visibility:visible}}@keyframes typing{0%{width:0}to{width:492px}}@media screen and (max-width: 1500px){.img-container{width:600px}.img-container .welcome{top:250px;left:235px;font-size:.6rem}.img-container:hover .welcome{top:240px;left:240px}.secretcode1{top:310px;left:412px}}@media screen and (max-width: 1200px){.img-container{display:none}}@media screen and (max-width: 860px){.intro-container{margin:0 auto;padding:80px 0;width:90vw;grid-template-columns:1fr;height:100%}.intro-container h1,.intro-container h2{font-size:2.8rem;text-wrap:wrap;animation:none}}.skills-container{margin:80px 0;padding:0 80px}.skills-container h1{margin:0}.skills-container:hover hr{animation:hr 1s ease-in-out;width:30%;background-color:#fff;border-color:#fff}.skills-container.light{background-color:#2cab8d;padding:80px}.skills-container.light .skill{border:1px solid #ffffff}.skills-container.light .skill .front,.skills-container.light .skill .back{background-color:transparent}.skills-container.light hr{background-color:#2cab8d;border-color:#2cab8d}.skills{display:flex;gap:20px;width:1200px;max-width:100%;flex-wrap:wrap}.skills h1{font-size:3rem}.skill{background-color:#2cab8d;width:auto;display:inline-block;font-size:2rem;border-radius:15px;padding:10px;display:flex;align-items:center;gap:5px;cursor:default}.skill svg,.skill img{width:30px}.skill span{font-size:1.5rem}.flipcard{perspective:1000px;width:90px;height:50px;background-color:transparent;padding:0}.card-container{width:100%;height:100%;position:relative;transition:transform 1s;transform-style:preserve-3d}.front,.back{position:absolute;height:100%;width:100%;backface-visibility:hidden;background-color:#2cab8d;border-radius:15px;padding:10px;display:flex;align-items:center;justify-content:center;gap:5px;cursor:pointer}.back{transform:rotateY(180deg)}.back span,.code5{cursor:pointer}.card-container.flip{transform:rotateY(180deg)}@media screen and (max-width: 860px){.skills-container{width:100vw;padding:5vw!important;margin:0}}.projects-container:hover hr{transition:1s;width:30%;background-color:#fff}.projects-container,.full-projects-container{margin:40px 0;padding:0 80px}.projects-container.light,.full-projects-container.light{color:#000}.projects-container.light hr,.full-projects-container.light hr{background-color:#2cab8d;border-color:#2cab8d}.projects-container.light .project,.full-projects-container.light .project{color:#000;border:4px solid #2cab8d;font-weight:600;padding:5px}.projects-container.light .tools img,.full-projects-container.light .tools img{padding:5px;width:30px;background-color:#2cab8d;border-radius:99%}.projects{display:flex;gap:20px;flex-wrap:wrap}.project{width:330px;height:300px;border:2px solid #ffffff;border-radius:15px;display:grid;padding:10px;grid-template-rows:220px 1fr 1fr;cursor:pointer}.project p{margin:5px 0}.project img{width:310px}.project-img{position:relative;width:310px;height:210px;overflow:hidden;border:1px solid #ffffff;border-radius:15px;margin:0 auto}.project-img img{position:absolute}.project-img img:nth-child(1){display:none}.project-img:hover img:nth-child(1){display:block}.project-img:hover img:nth-child(2){opacity:0}.tools{display:flex;gap:8px}.tools img{width:20px}.fullproject{display:flex;justify-content:space-between;border-radius:15px;max-width:100%;margin-bottom:100px;padding:20px 0;font-size:1.3rem}.fullproject .project-text{width:66%}.fullproject img{width:30%;border:3px solid #fff;border-radius:15px}.fullproject button{background-color:#2cab8d;width:auto;display:inline-block;font-size:1.3rem;border-radius:15px;padding:10px;display:flex;align-items:center;gap:5px;color:#fff;border:none;cursor:pointer}.fullproject:nth-of-type(2n){flex-direction:row-reverse}.full-projects-container hr{width:100%;background-color:#fff;transition:none}.button-container{display:flex;gap:10px}@media screen and (max-width: 860px){.project{width:100%;height:auto;aspect-ratio:330/300;display:flex;flex-direction:column;justify-content:space-around}.project .project-img{width:100%;height:250px;aspect-ratio:278/194}.project .project-img img{width:100%;-o-object-fit:contain;object-fit:contain}.fullproject{flex-direction:column!important}.fullproject img,.fullproject .project-text{width:100%}.projects-container{width:90vw;padding:0;margin:0 auto}.projects-container .project-img{border:none;height:auto}.projects-container .project-img img{border:1px solid #ffffff;border-radius:15px}}footer{width:100%;height:100px;border-top:1px solid #ffffff;display:flex;align-items:center;justify-content:center;gap:20px}footer>img{width:50px}footer.light{background-color:#2cab8d;border-top:1px solid #2cab8d;color:#000}.modal-background{width:100vw;height:100vh;min-height:100%;overflow:hidden;background-color:#00000080;position:absolute;top:0;left:0;z-index:3;position:fixed}.modal{width:50%;height:400px;background-color:#141d29;position:absolute;top:25vh;left:25%;border:1px solid #ffffff;text-align:center;z-index:4;position:fixed;display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;font-size:1.4rem;padding:2rem}.modal.light{background-color:#2cab8d}.code-container{display:flex;gap:20px}.code{border:1px solid #ffffff;width:60px;height:60px;font-size:2rem;text-align:center;line-height:3.5rem}@media screen and (max-width: 860px){.modal{width:95%;left:2.5%;font-size:1.3rem}.code{width:50px;height:50px;font-size:1.8rem;line-height:3rem}}.hangman-container{width:100vw;height:100vh;background-color:#00000080;z-index:1;position:absolute;top:0;left:0;position:fixed;overflow:hidden}.hangman{width:1200px;max-width:90%;height:90vh;height:800px;max-height:90vh;border:1px solid #ffffff;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:3fr 1fr;padding:40px;position:relative;top:5vh;background-color:#141d29;z-index:2}.hangman.light,.hangman.light>div{background-color:#2cab8d}.hangman.light.letter{background-color:#2cab8d}.hangman-drawing{width:600px;max-width:90%;height:400px;max-height:90%;border:1px solid #ffffff;margin:0 auto}.answer{display:flex;margin:auto 0}.letter,.letteranswer{border:1px solid #ffffff;width:3vw;height:3vw;font-size:2rem;font-size:150%;text-align:center;display:flex;align-items:center;justify-content:center}.letteroptions{display:flex;flex-wrap:wrap;width:90%;gap:15px;align-items:center;justify-content:center;cursor:pointer;grid-column:1/3;margin:0 auto;max-height:100px}.letteranswer p{visibility:hidden;margin:0}.base{background-color:#fff;height:5px;position:relative;width:500px;top:352px;margin:auto}.firstwrong{background-color:#fff;height:5px;position:relative;width:300px;transform:rotate(90deg);top:200px}.secondwrong{background-color:#fff;height:5px;position:relative;width:250px;top:45px;left:147px}.thirdwrong{background-color:#fff;height:5px;position:relative;width:50px;transform:rotate(90deg);top:62px;left:370px}.fourthwrong{background-color:#fff;height:5px;position:relative;width:60px;height:60px;top:80px;left:365px;border-radius:90%;border:5px solid #ffffff;background-color:transparent}.fifthwrong{background-color:#fff;height:5px;position:relative;width:100px;transform:rotate(90deg);left:345px;top:128px}.sixthwrong{background-color:#fff;height:5px;position:relative;width:50px;transform:rotate(45deg);left:352px;top:100px}.seventhwrong{background-color:#fff;height:5px;position:relative;width:50px;transform:rotate(135deg);left:389px;top:96px}.eighthwrong{background-color:#fff;height:5px;position:relative;width:50px;transform:rotate(135deg);left:352px;top:180px}.ninthwrong{background-color:#fff;height:5px;position:relative;width:50px;transform:rotate(45deg);left:388px;top:175px}.right-side{display:flex;flex-direction:column;text-align:center;margin:auto 0;align-items:center;max-width:90%}.right-side button{width:150px;height:50px;visibility:hidden;background-color:#2cab8d;color:#fff;font-weight:700;margin-bottom:10px;cursor:pointer;border:1px solid #ffffff}.cross{position:absolute;top:8px;right:18px;width:5px;height:25px;transform:rotate(45deg);background-color:#fff!important;border-radius:10px;cursor:pointer}.cross:before{content:"";display:inline-block;width:5px;height:25px;background-color:#fff;transform:rotate(90deg);border-radius:10px}@media screen and (min-width: 2000px){.hangman{grid-template-rows:2fr 1fr}}@media screen and (max-width: 860px){.hangman{overflow-x:hidden;padding:10px;top:5%;display:flex;flex-direction:column}.hangman-drawing{margin:auto;left:0;overflow-x:scroll}.hangman-drawing>div{-o-object-fit:contain;object-fit:contain}.letteroptions{width:90%;margin:0 auto 20px;max-height:none}.right-side{margin:0 auto}.letter,.letteranswer{height:40px;width:40px;font-size:1rem;line-height:2.5rem}}@media screen and (max-height: 620px){.hangman{width:100vw}.letteroptions{width:100%;gap:5px;margin:-20px auto}.letter,.letteranswer{font-size:.8rem}}@font-face{font-family:Work Sans;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/worksans/v19/QGY_z_wNahGAdqQ43RhVcIgYT2Xz5u32K0nXBi8Jpg.woff2) format("woff2")}@font-face{font-family:Roboto Mono;font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/robotomono/v23/L0xuDF4xlVMF-BfR8bXMIhJHg45mwgGEFl0_3vq_SeW4Ep0.woff2) format("woff2")}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:#141d29;color:#fff;font-family:Work Sans;padding:0;margin:0}hr{width:1%;height:6px;background-color:#2cab8d;border:none;margin:10px 0 20px;transition:1s}a{text-decoration:none;color:#fff}#cursor-light{width:200px;height:200px;background-color:transparent;border:1px solid white;position:absolute;top:0;left:0;border-radius:99%}#overlay{width:100%;height:100%;position:absolute;z-index:2;overflow:hidden}.secretcode2{color:#141d29;cursor:pointer;font-size:1.5rem}.secretcode2.light{color:#fff}h1,h2,h3,p{cursor:default}
