@import"https://fonts.googleapis.com/css2?family=Freeman&family=Monoton&family=Reddit+Mono:wght@200..900&display=swap";.error-route{position:fixed;top:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem;background-color:#7676764c;background-color:#444;width:100vw;height:100vh}.error-route a{color:#000;text-decoration:none}.error-route .contents{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem;width:100%;padding:2rem 0;color:#fff}.error-route .contents p{font-size:1.6rem}.home-btn{background-color:#fff;color:#000;padding:.5rem 2rem;margin-top:2rem;font-size:1.4rem;font-weight:600;cursor:pointer}.hamburger{display:none;position:fixed;margin:1rem;z-index:2;cursor:pointer}@media screen and (max-width: 800px){.hamburger{display:block}}.home{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:0rem;width:100vw;height:100vh;margin:0 auto;background-color:var(--bg-color-01)}.home:after{content:"";display:block;position:absolute;top:35%;left:29%;width:20rem;height:20rem;background-color:var(--bg-color-02);border-radius:50%;border:.5rem solid grey;opacity:.2;filter:blur(3px);z-index:10}@media screen and (max-width: 500px){.home{width:100%;padding-left:2rem;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0rem;flex-direction:column-reverse}}.home__para{font-size:2rem;font-family:Reddit Mono,monospace;font-weight:400;font-style:normal;color:var(--text-color-02);width:auto;max-width:50rem}.home__hello{color:var(--text-color-02);font-weight:600}.home__name{color:var(--text-color-01);margin-top:.5rem}.home__social-link{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;gap:0rem;margin-top:1rem;position:relative}.home__social-link .link{margin-right:1rem;cursor:pointer;position:absolute;bottom:-3rem;z-index:100}.home__social-link .github{left:3rem}.about{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0rem;width:100vw;height:100vh;margin:0 auto;padding:0 20rem;background-color:var(--bg-color-01);color:var(--text-color-01)}@media screen and (max-width: 500px){.about{padding:10rem 1rem 5rem;width:100vw;height:auto}}.about__heading{margin-bottom:5rem;font-size:1.4rem;color:var(--text-color-01)}.about__description{color:#eaeaea}@media screen and (max-width: 500px){.about__description{width:90%}}.about__boxs{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:0rem;align-self:flex-start}@media screen and (max-width: 500px){.about__boxs{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0rem;width:100%}}.about__box{width:45%;border:.1rem solid grey;padding:1rem 1.5rem;border-radius:1.4rem;text-align:center;margin-bottom:2rem;background-color:var(--bg-color-02)}@media screen and (max-width: 500px){.about__box{width:100%}}.about__box h2{margin-top:.5rem;font-size:1.4rem}.about__box p{margin:.5rem}.about__pargraph{font-size:1.4rem;background-color:var(--bg-color-02);padding:1rem 1rem 5rem 2rem;border-radius:1rem}.about__pargraph h3{font-weight:400;line-height:1.5;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0rem}.about__pargraph h3 span{margin-top:2rem}.skills{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0rem;text-align:center;width:100vw;height:100vh;padding-top:5rem;background-color:var(--bg-color-01)}@media screen and (max-width: 500px){.skills{padding:10rem;width:100%;height:auto}}.skills p{color:var(--text-color-02)}.skills__heading{margin-bottom:5rem;margin-top:1rem;font-size:1.4rem;text-align:center;color:var(--text-color-02)}.skills__list{color:var(--text-color-02);font-size:1.4rem;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:0rem;flex-wrap:wrap;gap:2rem;text-align:center}@media screen and (max-width: 500px){.skills__list{gap:2rem;width:100vw;padding:0 1rem}}.subject{display:flex;justify-content:center;align-items:flex-start;margin-bottom:1.4rem;text-align:left}.subject__text{margin:-.2rem .5rem .5rem}.subject__text h2{font-weight:400}.subject__text h3{font-weight:300}.project{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0rem;border:.1rem dashed #696969;border-radius:2rem;margin:2rem;padding:2rem;width:55rem}@media screen and (max-width: 500px){.project{width:80%;padding:1rem}}.project__img--container{width:100%;height:40vh;overflow:hidden;border-radius:2rem;border:.1rem solid grey}@media screen and (max-width: 500px){.project__img--container{height:30vh;border:none}}.project__img--container img[data-projectname~=Kanbam],.project__img--container img[data-projectname~=Natures]{transform:scale(1.1)}.project__img--container img[data-projectname~=Nc-news-FE]{transform:scale(1.04)}.project__img--container img{width:100%;object-fit:cover;transition:all .2s ease}.project__img--container img:hover{transform:scale(1.05)}.project__description{text-align:center;width:100%;color:var(--text-color-01)}.project__description h2{margin-bottom:1rem;font-weight:600;margin-top:2rem}.project__links{display:flex;flex-direction:row;justify-content:space-between;align-items:center;gap:0rem;padding:0 1rem}@media screen and (max-width: 500px){.project__links{width:100%;padding:0}}.project__links h3{width:45%;border:.1rem dashed grey;border-radius:2rem;padding:1rem;font-weight:400;background-color:var(--bg-color-02);color:var(--text-color-02);transition:all .2s ease}.project__links h3:hover{opacity:.6}@media screen and (max-width: 500px){.project__links h3{padding:1rem 0rem;font-size:1rem;font-weight:600}}.project__links h3 a{text-decoration:none;color:#fff}.projects{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;gap:0rem;width:100vw;height:100vh;padding:8rem 1rem 1rem;text-align:center;overflow-x:hidden;background-color:var(--bg-color-01)}.projects p{color:var(--text-color-02)}@media screen and (max-width: 500px){.projects{width:100%}}.projects__heading{font-size:1.4rem;color:var(--text-color-02)}.projects__list{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:0rem}@media screen and (max-width: 500px){.projects__list{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0rem}}.projects__list ul{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:0rem;margin-right:2rem}@media screen and (max-width: 500px){.projects__list ul{display:none}}.projects__list ul li{margin:.5rem;padding:1rem 1.5rem;background-color:var(--bg-color-02);border-radius:2rem;transition:all .2s ease;color:#eee}.projects__list ul li:hover{filter:brightness(85%)}.projects__list a{color:var(--text-color-02);text-decoration:none;font-size:1.4rem}.root{width:100vw;height:100vh;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;gap:0rem}.theme-btn-wrapper{display:flex;flex-direction:column;justify-content:flex-start;align-items:center;gap:0rem;position:fixed;bottom:20%;right:2rem;border:.1rem dashed var(--text-color-02);border-radius:1rem;padding:1rem .4rem}.theme-btn-wrapper .theme-btn{cursor:pointer;transition:all .2s ease;color:var(--text-color-02)}.theme-btn-wrapper .theme-btn:hover{transform:scale(1.5)}.theme-btn-wrapper .theme-btn:active{transform:scale(1)}.link-element{position:fixed;width:auto;border-radius:2rem;padding:1rem;margin-top:1rem;border:.1rem dashed grey;z-index:1000}@media screen and (max-width: 500px){.link-element{max-width:100vw}}.link-element ul{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:1rem;list-style-type:none}@media screen and (max-width: 500px){.link-element ul{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:.5rem}}.link-element ul a{text-decoration:none;text-transform:capitalize;font-size:1.2rem;font-weight:600;color:#fff}.link-element .link{background-color:#444;border-radius:2rem;padding:.5rem 1rem;transition:all .2s ease}.link-element .link:hover{transform:translateY(-.2rem)}.link-element .link:active{transform:translateY(.2rem)}.contact{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0rem;width:50%;margin:0 auto;text-align:center}@media screen and (max-width: 500px){.contact{width:100%;height:60vh;text-align:center}}.contact__heading{margin-bottom:2.5rem;font-size:1.4rem;color:var(--text-color-01)}.contact__links{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:0rem;border:.1rem solid grey;border-radius:2rem;padding:1rem;margin-bottom:2rem;font-size:1.4rem}@media screen and (max-width: 500px){.contact__links{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:0rem;width:auto;border:none;padding:0}}.contact__link{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:0rem}.contact__link p{margin-left:1rem;margin-right:2rem}.footer{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:0rem;width:100vw;height:100vh;background-color:var(--bg-color-01)}.footer p{color:var(--text-color-01);font-size:1.4rem}.footer .copyright{position:absolute;bottom:10rem}.footer__qrcode{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:0rem;width:15%;padding-top:.5rem}@media screen and (max-width: 500px){.footer__qrcode{width:50%}}.footer__qrcode img{width:100%;object-fit:cover}.footer_links{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:1.5rem;margin-bottom:1rem;padding:.5rem 2.5rem;border:.1rem solid #bbbbbb;border-radius:2rem}.footer_links a{color:var(--text-color-01)}*,*:before,*:after{margin:0;padding:0;box-sizing:border-box}html{font-size:62.5%}body{font-family:Reddit Mono,monospace;position:relative;-webkit-font-smoothing:antialiased;-moz-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}::-webkit-scrollbar{width:5px;height:10px;background-color:#555}::-webkit-scrollbar-thumb{border-radius:2rem;background-color:#333}.intersectionVisible{opacity:1;transition:all .3s ease .2s;transform:translateY(0)}.intersectionNotVisible{opacity:0;transform:translateY(2rem)}:root{--bg-color-01: #ecf2ff;--bg-color-02: #2b283a;--text-color-01: #2b283a;--text-color-02: #393743}