@import"https://fonts.googleapis.com/css2?family=Kanit:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden}#root{height:100%}.container{font-family:Kanit,sans-serif;display:flex;height:100vh;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-behavior:smooth}.section{flex:0 0 100vw;height:100vh;display:flex;scroll-snap-align:start}.main-content{flex:0 0 85vw;padding:2rem;display:flex;flex-direction:column;justify-content:center}.side-title,.side-title a,.side-title a:hover,.side-title a:visited{flex:0 0 5vw;background:#000;color:#8ace00;display:flex;justify-content:center;align-items:center;font-size:5rem;font-weight:700;writing-mode:sideways-lr;text-orientation:mixed;white-space:nowrap;text-decoration:none}.intro{background:#000;color:#fff;position:relative}.intro .main-content{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;flex:1;padding:2rem}.intro h1{font-size:8rem;line-height:10rem}.intro h1 span{color:#8ace00;font-size:14rem;line-height:.5rem}.intro p{font-size:1.2rem;padding-left:.5rem}.about{background:#000;color:#d1c1bb}.about p{max-width:65vw;max-height:90vh;text-align:justify;font-size:1.2rem;margin-left:10vw;overflow:auto;padding:1rem}.about p strong{color:#8ace00}.work{background:#000;color:#d1c1bb}.work .grid{display:grid;grid-template-columns:150px 1fr 150px 1fr;gap:1 rem;align-items:center;width:100%}.work .item{background:#000;overflow:visible;scrollbar-width:thin;scrollbar-color:#aacf61 #111}.work .item img{width:100%;height:100%;display:block}.work .item a{color:#8ace00;text-decoration:none}.work .item a:hover{color:#aacf61;text-decoration:overline}.contact{background:#8ace00;color:#000}.contact .main-content{flex:0 0 100vw;height:100vh;display:flex;flex-direction:column;align-items:center;text-align:center;padding:2rem}.contact .content-block{margin:auto 0;display:flex;flex-direction:column;align-items:center;gap:2rem}.contact footer{margin-top:auto}.contact a,a:visited{text-decoration:none;color:#416002;font-weight:700}.contact a:hover{text-decoration:overline}.contact p{font-size:5rem}.social{display:flex;gap:1rem;font-size:2rem}.fa-linkedin{font-size:2rem;color:#0a66c2}.fa-github{font-size:2rem;color:#000}.container::-webkit-scrollbar,.work .item::-webkit-scrollbar,.about p::-webkit-scrollbar{width:8px;height:8px}.container::-webkit-scrollbar-track,.work .item::-webkit-scrollbar-track,.about p::-webkit-scrollbar-track{background:#111;border-radius:4px}.container::-webkit-scrollbar-thumb,.work .item::-webkit-scrollbar-thumb,.about p::-webkit-scrollbar-thumb{background:#8e8e8e;border-radius:4px}@media (max-width: 768px){*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;overflow:hidden}#root{height:100%}html,body{height:auto;overflow:auto}.container{flex-direction:column;height:auto;overflow-x:hidden;overflow-y:auto;scroll-snap-type:none}.section{flex:0 0 auto;width:100vw;height:auto;min-height:100vh;display:flex;flex-direction:column;scroll-snap-align:none;padding:2rem 1rem}.main-content{flex:1 1 auto;width:100%;max-width:100%;padding:1rem}.side-title,.side-title a,.side-title a:hover,.side-title a:visited{display:flex;justify-content:center;align-items:center;width:100vw;max-width:100vw;height:auto;font-size:2.5rem;writing-mode:horizontal-tb!important;text-orientation:initial!important;margin:.5rem 0;position:relative;left:0}.intro h1{font-size:4rem;line-height:1.2}.intro h1 span{font-size:6rem;line-height:1}.about p{max-width:100%;max-height:none;margin-left:0;padding:1rem 0}.work .grid{display:flex;flex-direction:column;gap:2rem;text-align:center}.work .item{width:100%;height:auto}.work .item img{max-width:50%;max-height:50%;margin:0 auto}.contact .main-content{flex:1 1 auto;width:100%;padding:2rem 1rem}.contact p,.social{font-size:1.5rem}}