@import url(https://fonts.googleapis.com/css2?family=Metrophobic:wght@300;400;500;600;700&family=Lexend:wght@700&family=Oxygen:wght@300;400;700&display=swap);@import url(https://fonts.googleapis.com/css2?family=Bai+Jamjuree:wght@300;400;500;600;700);a,abbr,acronym,address,applet,article,aside,audio,b,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,strong,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video{border:0;font-size:100%;font:inherit;margin:0;padding:0;vertical-align:initial}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}li,ol{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}*,:after,:before{box-sizing:border-box}*{margin:0}canvas,img,picture,svg,video{display:block;max-width:100%}button,input,select,textarea{font:inherit}h1,h2,h3,h4,h5,h6{overflow-wrap:break-word}#__next,#root{isolation:isolate}@keyframes grow{0%{-webkit-mask-size:150% 100%;mask-size:150% 100%}to{-webkit-mask-size:150% 95%;mask-size:150% 95%}}@keyframes pulse{0%{opacity:1}to{opacity:.5}}@keyframes bob{0%{transform:translateX(0)}to{transform:translateX(.5rem)}}@keyframes bob-alt{0%{transform:translateX(0) translateY(0)}to{transform:translateX(.2rem) translateY(-.2rem)}}html{font-family:Metrophobic,Bai Jamjuree,sans-serif;font-size:16px;font-weight:400;line-height:1.5}body{-webkit-tap-highlight-color:rgba(0,0,0,0)}h1,h2,h3,h4,h5,h6{font-family:Bai Jamjuree}h1{font-size:2rem;font-weight:700}h2{font-size:1.8rem;font-weight:600}h3{font-size:1.2rem}h3,h4{font-weight:500}h4{font-size:1rem}p,span{line-height:1.6}a{color:#444;text-decoration:none}button{background-color:#0000;border:1px solid #ccc;border-radius:5px;cursor:pointer;padding:7px 15px;transition:background-color .1s linear}button:hover{background-color:#f3f3f3!important}aside{background-image:linear-gradient(0deg,#11507a,#0e1130 90%);color:#fff;display:flex;flex-direction:column;position:relative}aside h2{font-size:1.3rem}aside section,aside>div{display:flex;flex-direction:column;justify-content:center;row-gap:2rem}aside section:first-child,aside>div:first-child{height:6rem}aside section a,aside>div a{color:#fff}aside section a span:last-child,aside>div a span:last-child{text-decoration:underline;text-underline-offset:5px}aside section a:hover,aside>div a:hover{color:#999}aside .contacts{bottom:1.5rem;position:absolute}nav{background-color:#fff;position:sticky;top:0;z-index:100}nav>div{align-items:center;column-gap:.6rem;display:flex;overflow-x:auto;row-gap:.4rem}nav>div>*{text-transform:capitalize;white-space:pre}nav>div a{color:#11507a;text-decoration:underline;text-underline-offset:5px}nav>div a:hover{color:#0e1130}main{color:#444;padding-bottom:3vh;row-gap:1.5rem}main,main header{display:flex;flex-direction:column}main header{row-gap:.2rem}main header>:first-child{-webkit-background-clip:text;background-clip:text;background-image:linear-gradient(45deg,#11507a,#0e1130);color:#0000}main header>div{align-items:center;column-gap:.5rem;display:flex}main menu{display:flex;flex-direction:column;row-gap:1.2rem;width:25vw}main menu .icon_grid{align-items:flex-start}main menu li{border:1px solid #ccc;border-radius:5px;font-size:1.2rem}main menu li span{line-height:1!important}main menu li:hover{color:#11507a;cursor:pointer}main menu li:hover span:not(.subtext){color:#11507a}main menu li:hover .go_to .material-symbols-rounded{opacity:1}main menu li a{padding:1rem}main menu .go_to .material-symbols-rounded{opacity:0;transition:opacity .1s linear}footer{display:flex;font-size:.85rem;justify-content:flex-end;position:relative}footer>*{bottom:1.5rem;position:absolute}@media only screen and (max-width:1024px){aside .contacts{align-self:flex-end;bottom:0;padding:1.5rem 0;position:relative}main menu{width:100%}footer{justify-content:center}}.info_container{display:flex;flex-direction:column;row-gap:1rem}.info_container .icon_grid{align-items:flex-start}.contacts{column-gap:2.5rem;display:flex;flex-direction:row}.contacts img{cursor:pointer;width:1.5rem}.svg-inverted{filter:invert(1)}.svg-bg_light{background-color:#fff;border-radius:2px}.go_to{align-items:center;column-gap:.5rem;display:flex}.go_to .material-symbols-rounded{animation:bob .5s ease-out infinite alternate;color:#11507a}.go_to-alt .material-symbols-rounded{animation:bob-alt .5s ease-out infinite alternate;font-size:1rem}.icon_grid{grid-column-gap:.6rem;grid-row-gap:.4rem;align-items:center;column-gap:.6rem;display:grid;grid-template-columns:1.5rem auto;row-gap:.4rem}.icon_grid h4{line-height:1.5!important}.icon_grid-lg{column-gap:1rem;grid-template-columns:2.5rem auto;row-gap:.8rem}.subtext{font-size:.9rem}.tile{border-bottom:1px solid #ccc;padding:15px;position:relative;transition:box-shadow .1s linear}.tile:hover{border-bottom-color:#0000;border-radius:5px;box-shadow:4px 4px 3px 1px #e6e6e6}.tile:hover:after{height:100%}.tile:after{background-color:#999;border-radius:5px;content:"";height:0;left:0;-webkit-mask-image:url(/static/media/mask.f76173cc8a3b4fb11044.png);mask-image:url(/static/media/mask.f76173cc8a3b4fb11044.png);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:350% 75%;mask-size:350% 75%;mix-blend-mode:hard-light;opacity:.1;position:absolute;top:0;transition:height .3s ease-in-out;width:100%}.cards-stacked{position:relative}.cards-stacked>div{background-color:#fff;background-repeat:no-repeat;background-size:cover;border-radius:5px;box-shadow:0 0 5px #ccc;display:flex;height:100%;left:50%;position:absolute;transform:translateX(-50%);transition:top .1s linear}.cards-stacked>div:first-child{top:6%;width:100%;z-index:20}.cards-stacked>div:nth-child(2){top:3%;width:95%;z-index:15}.cards-stacked>div:last-child{top:0;width:90%;z-index:10}.cards-stacked h3{color:#999;margin:auto}.toast{background-color:#999;border-radius:20px;bottom:10vh;color:#fff;left:50%;opacity:0;padding:5px 15px;position:fixed;transform:translateX(-50%);transition:opacity .3s ease-in-out}.caret{display:none}.caret .material-symbols-rounded{transition:transform .1s linear}.caret:hover{cursor:pointer}.caret-active{transform:rotate(90deg)}@media only screen and (max-width:1024px){.caret{display:flex}}.landing{display:flex;flex-direction:column;height:100vh}.landing h1{font-size:3.3vw}.landing>section{animation:grow 2s ease-in-out infinite alternate;background-image:linear-gradient(0deg,#11507a,#0e1130 90%);background-repeat:no-repeat;color:#fff;display:flex;flex-direction:column;height:75vh;justify-content:center;-webkit-mask-image:url(/static/media/mask.f76173cc8a3b4fb11044.png);mask-image:url(/static/media/mask.f76173cc8a3b4fb11044.png);-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-size:150% 100%;mask-size:150% 100%;row-gap:1rem}.landing>section h2{animation:pulse 2s ease-in-out infinite alternate;text-align:left}.landing>section>*{margin:0 auto;text-align:center}.landing>section>:not(h1){width:40vw}.landing>section>:first-child{margin-top:10rem}.landing>section li{display:inline-block;padding:0 .5rem}.landing>div{align-items:center;display:flex;flex-direction:column;height:25vh;padding-top:2rem;row-gap:1.5rem}.landing>div .go_to{border-radius:50%;transition:background .1s linear}.landing>div .go_to:hover{background-color:#f3f3f3;cursor:pointer}.landing>div .go_to .material-symbols-rounded{font-size:2.5rem;padding:1.5rem}.split_screen{display:flex;height:100vh}.split_screen aside,.split_screen footer,.split_screen main,.split_screen nav{padding:0 1.5rem}.split_screen aside{width:22vw}.split_screen main{width:78vw}.split_screen>div{overflow-y:auto}.split_screen>div nav{height:6rem}.split_screen>div main{min-height:calc(100vh - 12rem)}.split_screen>div footer{height:6rem}.experience_container{width:70ch}.experience_container .experience:not(:last-child){margin-bottom:.8rem}.experience_container .experience img{border-radius:50%;box-shadow:0 0 5px #ccc;height:2.5rem}.experience_container .experience h3{line-height:1.7}.experience_container .experience h3,.experience_container .experience h4{color:#11507a}.experience_container .experience>div:nth-child(3){align-self:stretch;border:.5px solid #ccc;justify-self:center;width:0}.experience_container .experience>div:last-child{margin:.5rem 0 1rem}.experience_container .experience:last-child>div:nth-child(3){border:none}.experience_container .experience .experience_details{font-size:.9rem}.experience_container .experience .experience_details a{column-gap:.3rem;display:flex}.experience_container .experience .experience_details a:hover .material-symbols-rounded{opacity:1}.experience_container .experience .experience_details a .material-symbols-rounded{font-size:.9rem;opacity:0;transform:translateY(.3rem);transition:opacity .1s linear}.experience_container .experience .experience_details>div{display:flex}.experience_container .experience .experience_details>div span:not(:first-child):before{content:"  ○  ";white-space:pre}.experience_container .experience .experience_titles{display:flex;flex-direction:column;row-gap:1rem}.experience_container .experience .experience_titles p{font-size:.9rem;font-weight:600}.experience_container .experience .experience_titles li{line-height:1.8;list-style-type:disc;margin-left:1rem}.experience_container .experience .experience_titles li em{color:#0e1130;font-weight:700}.experience_container .experience .experience_titles h4:last-child{margin:.5rem 0}.experience_container .experience .experience_titles .material-symbols-rounded{font-size:1.3rem}.experience_container .experience .experience_titles .icon_grid{align-items:flex-start;row-gap:.7rem}.tech_container{display:flex;flex-wrap:wrap;gap:2rem;width:55%}.tech_container img{height:2.5rem}.tech_container_alt{margin-top:3rem}.tech_container_alt h3{margin-bottom:.5rem}.tech_container_alt span{color:#11507a;white-space:pre}.projects_all_container{display:flex;flex-wrap:wrap}.projects_all_container .project{display:flex;flex-direction:column;padding:1.5rem 2rem;row-gap:3rem;width:25rem}.projects_all_container .project .cards-stacked{height:13rem}.projects_all_container .project>div:last-child{align-items:center;display:flex;flex-direction:column;row-gap:1rem;text-align:center}.projects_all_container .project>div:last-child h2{-webkit-background-clip:text;background-clip:text;background-image:linear-gradient(45deg,#11507a,#0e1130);color:#0000;font-size:1.5rem}.projects_all_container .project:hover .cards-stacked>div:first-child{top:8%}.projects_all_container .project:hover .cards-stacked>div:last-child{top:-2%}.projects_all_container .project:hover .go_to{opacity:1}.projects_all_container .project .go_to{opacity:0;transition:opacity .1s linear}.project_container{display:flex;flex-direction:column;row-gap:1.5rem}.project_container .project_carousel{align-items:center;background-color:#000;border-radius:5px;display:flex;height:65vh;justify-content:space-between;padding:0 1.5rem;position:relative}.project_container .project_carousel img{height:100%;left:50%;position:absolute;transform:translateX(-50%);z-index:5}.project_container .project_carousel .material-symbols-rounded{border-radius:50%;color:#999;font-size:3rem;padding:1rem;transition:background-color .1s linear,color .1s linear;-webkit-user-select:none;user-select:none;z-index:10}.project_container .project_carousel .material-symbols-rounded:hover{background-color:#33333380;color:#fff;cursor:pointer}.project_container a{align-self:flex-start}.project_container a:hover{color:#11507a}.project_container .project_content{display:flex;flex-direction:column;row-gap:1rem;width:70ch}.project_container .project_content h3{margin-bottom:.5rem}.project_container .project_date{color:#11507a;font-weight:600}.project_container .project_date b{margin-right:.3rem}.project_container .project_nav{display:flex;flex-direction:column;gap:2rem;justify-content:space-between;width:70ch}.project_container .project_nav>div{cursor:pointer}.project_container .project_nav>div:hover em{color:#11507a}.project_container .project_nav>div:first-child{align-self:flex-end;text-align:right}.project_container .project_nav>div:first-child:hover em{left:7px}.project_container .project_nav>div:last-child:hover em{left:-7px}.project_container .project_nav h3{font-size:1.6rem}.project_container .project_nav h3 em{font-weight:300;left:0;position:relative;transition:left .1s linear}.not_found{padding-top:1rem}.img-pad{padding:.2rem}@media only screen and (max-width:1024px){.landing h1{font-size:9vw}.landing h2{font-size:1.5rem}.landing>section{-webkit-mask-image:url(/static/media/mask-mobile.73c238adf1759846e858.png);mask-image:url(/static/media/mask-mobile.73c238adf1759846e858.png);row-gap:2rem}.landing>section h1,.landing>section>:not(h1){width:80vw}.landing>section>:first-child{margin-top:5rem}.landing>section li{display:block;padding:.3rem 0}.split_screen{flex-direction:column}.split_screen aside,.split_screen main{width:100%}.split_screen>div{overflow-y:visible}.menu-pad{padding-top:1.5rem}.experience_container{width:100%}.experience_container .experience_details{overflow:auto;white-space:nowrap}.experience_container .experience_details a{left:0;position:sticky}.tech_container{gap:1.5rem;width:100%}.projects_all_container .project{padding:1.5rem 1rem;width:100%}.project_container .project_carousel{height:25vh;padding:0 .5rem}.project_container .project_carousel .material-symbols-rounded{padding:0}.project_container .project_content,.project_container .project_nav{width:100%}}
/*# sourceMappingURL=main.616dd253.css.map*/