@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;500;600&family=Russo+One&display=swap);@import url(https://fonts.googleapis.com/css2?family=Poppins:wght@300;500;600&display=swap);@import url(https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;500;700&display=swap);.nav{align-items:flex-start;display:flex;gap:2rem;left:50%;position:fixed;top:3rem;transition:var(--transition);z-index:0}.nav-about{-webkit-transform:translateX(-1.5rem);transform:translateX(-1.5rem)}.nav-skills{-webkit-transform:translateX(-6rem);transform:translateX(-6rem)}.nav-projects{-webkit-transform:translateX(-11rem);transform:translateX(-11rem)}.nav-contact{-webkit-transform:translateX(-15rem);transform:translateX(-15rem)}a{align-items:center;display:flex;flex-direction:column;gap:.5rem;justify-content:center;width:3.2rem}.page-title{color:#fff;cursor:default;font-size:.8rem}.nav-link{opacity:.5;transition:var(--transition)}.nav-link img{width:4rem}.nav-link:hover{opacity:1}.nav-link.current{opacity:1;text-decoration:none}@media (max-width:1024px){.nav-link,.nav-link img{width:3rem}}@media (max-width:700px){.nav-about,.nav-contact,.nav-projects,.nav-skills{-webkit-transform:translateX(0);transform:translateX(0)}.nav{top:80vh;-webkit-transform:translateX(-50%);transform:translateX(-50%)}.nav-link,.nav-link img{width:2rem}}.avatar{overflow:hidden;position:fixed;z-index:-4}.avatar.about{bottom:-8vh;height:70vh;left:50%;-webkit-transform:translateX(-60%);transform:translateX(-60%);z-index:-4}.avatar.skills{bottom:-20vh;height:100vh;left:50%;-webkit-transform:translateX(-60%) scaleX(-1);transform:translateX(-60%) scaleX(-1);z-index:-4}.shadow-overlay-about,.shadow-overlay-skills{background:linear-gradient(90deg,rgba(0,0,0,.25),hsla(0,0%,100%,0));display:block;height:100vh;position:fixed;width:100vh;z-index:-3}@media (max-width:1440px){.avatar.about{bottom:-10vh;height:70vh;-webkit-transform:translateX(-70%);transform:translateX(-70%)}}@media (max-width:1024px){.avatar.about{bottom:0;height:55vh}.avatar.skills{bottom:-10vh;height:70vh;-webkit-transform:translateX(-60%) scaleX(-1);transform:translateX(-60%) scaleX(-1)}.shadow-overlay-about,.shadow-overlay-skills{background:linear-gradient(hsla(0,0%,100%,0),#000 80%);height:40vh;left:-10vh;top:65vh;width:150vw;z-index:-3}}@media (max-width:700px){.avatar.about{bottom:0;height:50vh;-webkit-transform:translateX(-58%);transform:translateX(-58%)}.avatar.skills{bottom:-15vh;height:65vh;-webkit-transform:translateX(-45%) scaleX(-1);transform:translateX(-45%) scaleX(-1)}.shadow-overlay-about,.shadow-overlay-skills{background:linear-gradient(hsla(0,0%,100%,0),#000 60%)}}.menu{left:10vw;top:60%;-webkit-transform:translateY(-60%);transform:translateY(-60%)}.item{align-items:center;cursor:pointer;display:flex;height:3rem;justify-content:flex-end}.title{font-size:1rem;padding-right:2.5rem}.item.active .title{font-size:1.7rem}.sub-container{display:flex;flex-direction:column;position:fixed;right:11vw;top:32%;width:20rem}.sub-container p{cursor:default;margin-left:2rem}.item.active,.item.active:hover{background:linear-gradient(90deg,var(--transparent),var(--blue) 70%);border-radius:var(--radius-right);cursor:default}.sub-container-1.active-subheading h3,.sub-container-2.active-subheading h3,.sub-container-3.active-subheading h3{background:linear-gradient(90deg,var(--purple),var(--transparent) 70%);border-radius:var(--radius-left);cursor:default;padding:1rem 3rem}.sub-container-1:not(.active-subheading) h3,.sub-container-2:not(.active-subheading) h3,.sub-container-3:not(.active-subheading) h3{cursor:pointer;margin:0;opacity:.7}.p-container{display:none;margin-top:.5rem;max-height:25vh;transition:var(--transition)}.active-subheading .p-container{display:block;font-size:1rem;margin-top:.5rem;overflow:auto}.icon-title-container{cursor:default;display:flex;gap:1.2rem;margin-bottom:.5rem}.icon{height:3rem;width:3rem}.sub-container-1 h3,.sub-container-2,.sub-container-3{margin:.2rem 0;padding:.5rem 0 .5rem 1rem;position:relative}@media (max-width:1440px){.sub-container{top:25%;width:20rem}}@media (max-width:1024px){.sub-container{cursor:pointer;right:10vw;top:20%;width:20rem}.item.active .title{font-size:1.2rem}}@media (max-width:700px){.sub-container{left:50%;top:22%;-webkit-transform:translateX(-55%);transform:translateX(-55%);width:16rem}.icon,.icon-title-container{display:none}.sub-container h1{font-size:2rem}h2,h3,h4{font-size:.7rem}p{font-size:.5rem}.p-container{max-height:20vh}}.skill-menu{align-items:flex-end;display:flex;flex-direction:column;position:fixed;right:15vw;top:30%;width:30rem}.skill-item{align-items:center;cursor:pointer;display:flex;height:4rem;justify-content:flex-end;position:relative;width:50%}.skill-title{font-size:.8rem;padding-right:4rem}.skill-item.activeSkill .skill-title{font-size:1.2rem}.activeSkill{border-radius:var(--radius-left);cursor:default}.skill-item.activeSkill,.skill-item.activeSkill:hover{background:linear-gradient(270deg,#ffffff00,var(--blue) 70%)}.skill-icon{height:5rem;left:8rem;position:absolute;top:2rem;width:5rem}.skill-sub-container-1 h3,.skill-sub-container-2 h3,.skill-sub-container-3 h3{margin:0;position:relative}.menu{display:flex;flex-direction:column;position:fixed;right:15vw;top:50%;-webkit-transform:translateY(-25%);transform:translateY(-25%);width:20rem}.skill-sub-container-1,.skill-sub-container-2,.skill-sub-container-3{display:flex;gap:2rem;justify-content:right}.level-container{display:flex;gap:.3rem}.level-point{border-radius:.2rem;height:1rem;width:2rem}.filled{background:linear-gradient(180deg,#236473,#25afce,#7ce7ff)}.unfilled{background:linear-gradient(180deg,#1c8298,#074653,#074654)}.skill-sub-container{display:flex;flex-direction:column;gap:.4rem;margin-top:2rem}@media (max-width:1440px){.skill-menu{right:10vw}.menu{left:5vw;top:50%;-webkit-transform:translateY(-90%);transform:translateY(-90%);width:15rem}}@media (max-width:1024px){.menu{top:25vh;-webkit-transform:translateY(-50%);transform:translateY(-50%);width:18rem}.skill-menu{top:20vh}.skill-item{height:3rem;width:50%}.skill-title{font-size:.65rem;padding-right:4.5rem}.skill-item.activeSkill .skill-title{font-size:1.1rem}.skill-icon{height:4rem;width:4rem}}@media (max-width:700px){.menu{left:50%;top:5%;-webkit-transform:translateX(-5%);transform:translateX(-5%);width:10rem}.menu .item{height:2rem}.menu .title{font-size:.4rem}.menu .item.active .title{font-size:.8rem}.skill-menu{top:15%}.skill-item{height:2rem;width:40%}.skill-title{font-size:.5rem;padding-right:4.5rem}.skill-item.activeSkill .skill-title{font-size:.8rem}.skill-icon{height:3rem;left:12rem;position:absolute;top:2rem;width:3rem}}.project-menu{display:flex;left:50%;position:fixed;top:25%;-webkit-transform:translateX(-60%);transform:translateX(-60%);width:45rem;z-index:-3}.project-items-container{align-items:flex-end;display:flex;flex-direction:column;margin-top:12rem;position:relative;width:100%}.project-item{align-items:center;cursor:pointer;display:flex;font-family:Kanit,sans-serif;height:3.75rem;justify-content:flex-end;position:relative;width:68%}.project-item.activeProject .title{font-size:1.5rem}.activeProject{border-radius:var(--radius-left);cursor:default}.project-item.activeProject,.project-item.activeProject:hover{background:linear-gradient(270deg,#ffffff00,var(--blue) 70%);padding:0 2rem}.project-item:not(.activeProject){opacity:.8}.project-item:not(.activeProject):hover{opacity:1}.project-sub-container{display:flex;flex-direction:column;gap:.4rem;margin-top:2rem;width:100%}.project-sub-container h3{margin-bottom:0;position:relative}.project-sub-container img{border-radius:.5rem 3rem .5rem .5rem;object-fit:cover;opacity:.9;width:100%}.project-sub-container p{font-size:.9rem}.scrollbar-paragraph{height:25vh;overflow:auto}.link-container a{color:#fff;height:2.75rem;margin-top:1rem;opacity:.8;text-decoration:none;width:50%}.link-container a:hover{background:linear-gradient(90deg,#ffffff00,#ffffff42 50%,#ffffff00);opacity:1}.link-container{display:flex;justify-content:space-around}@media (max-width:1024px){.project-menu{top:20vh;-webkit-transform:translateX(-50%);transform:translateX(-50%);width:30rem}.project-item{height:2rem;width:100%}.project-item.activeProject .title{font-size:1.2rem}.title{font-size:.8rem}}@media (max-width:700px){.project-menu{top:15%;-webkit-transform:translateX(-60%);transform:translateX(-60%);width:20rem}.project-item{height:2rem;width:80%}.project-item.activeProject .title{font-size:.7rem}.project-item:not(.activeProject) .title{font-size:.5rem}.project-sub-container{display:flex;flex-direction:column;gap:.4rem;margin-top:2rem;width:100%}.project-sub-container p{font-size:.6rem}.scrollbar-paragraph{height:35%;margin-top:.5rem;padding:.2rem}}.contact-menu{left:50%;position:absolute;top:57%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}form{display:flex;flex-direction:column;gap:2rem;width:18.5rem}.form-group{width:100%}#message,input{background-color:#00000040;border:.07rem solid hsla(0,0%,100%,.4);border-radius:.3rem;color:#fff;font-family:Russo One,sans-serif;font-size:1rem;font-weight:700;outline:none;padding:.5rem;width:100%}input{height:1.9rem}::-webkit-input-placeholder{color:#fff;font-weight:400}::placeholder{color:#fff;font-weight:400}#message{height:6.2rem;resize:none}button{background-color:initial;border:none;color:#fff;cursor:pointer;font-family:Russo One,sans-serif;font-size:1rem;font-weight:600;padding:.5rem 0;width:102%}.success-message{background-color:#00000030;border:.07rem solid hsla(0,0%,100%,.7);border-radius:.3rem;display:flex;flex-direction:column;height:12.5rem;justify-content:center;text-align:center;width:100%}.success-message p{margin:.5rem;padding:0 3.7rem}.error-message{background-color:#ff3b3b;border-radius:.2rem;color:#fff;padding:.3rem}label{display:none}@media (max-width:1100px){.contact-menu{top:50%}}@media (max-width:700px){.contact-menu{width:70%}form{width:100%}#message,input{width:92%}.success-message p{padding:0 .5rem}}body{-webkit-tap-highlight-color:transparent;color:#fff;font-family:Russo One,sans-serif;transition:all .4s ease;transition:var(--transition)}h3{font-family:Kanit,sans-serif}p{font-family:Poppins,sans-serif}:root{--purple:#540351;--blue:#3627b1;--cyan:#25afce;--transparent:#00000000;--radius-left:3rem 0 0 3rem;--radius-right:0 3rem 3rem 0;--transition:all 400ms ease}::-webkit-scrollbar{width:.5vw}::-webkit-scrollbar-thumb{background-color:hsla(0,0%,100%,.1);border-radius:5vh}.class-sub-container a,.item:not(.active),.project-item,.skill-item,.sub-container-2:not(.active-subheading),.sub-container-3:not(.active-subheading),button{transition:all .4s ease;transition:var(--transition)}.class-sub-container a:hover,.item:not(.active):hover,.project-item:hover,.skill-item:hover,.sub-container-2:not(.active-subheading):hover,.sub-container-3:not(.active-subheading):hover,button:hover{background-image:linear-gradient(90deg,#ffffff00,#ffffff42 50%,#ffffff00)}#bg{z-index:-5}#bg,.shadow-overlay{height:100vh;left:0;object-fit:cover;position:fixed;top:0;width:100vw}.shadow-overlay{background-color:rgba(0,0,0,.4);z-index:-4}@media (max-width:1024px){.shadow-overlay{background-color:rgba(0,0,0,.55)}}@media (max-width:700px){.shadow-overlay{background-color:rgba(0,0,0,.7)}}#stats{cursor:default;display:flex;flex-direction:column;height:4rem;justify-content:space-between;left:3rem;position:fixed;top:2.5rem;width:15rem}h1{font-size:1.5rem;margin:0}h2{font-size:1rem;margin:.3rem 0}#stats__lines{align-items:center;display:flex;margin:.5rem 0}#stats__lines__thick{height:.3rem;width:2rem}#stats__lines__thick,#stats__lines__thin{background-color:#fff;display:block;left:0;top:0}#stats__lines__thin{background-color:#d3d3d3;height:.1rem;width:9.6rem}@media (max-width:1024px){#stats{top:2rem;width:8rem}h1{font-size:1rem}h2,h3,p{font-size:.75rem}}@media (max-width:700px){#stats{top:1.5rem;width:8rem}h1{font-size:1rem}h2,h3,p{font-size:.7rem}}
/*# sourceMappingURL=main.33341417.css.map*/