.page-container{display:flex;flex-direction:column;flex:1;max-width:800px;gap:60px;margin:60px 0;align-self:center;justify-content:center}.page-container>div{width:100%}.text-block-container{display:flex;flex-direction:column;gap:20px;min-width:250px;max-width:450px;text-align:center}.text-block-header-container{display:flex;justify-content:center;align-items:center;gap:10px}.text-block-container ul{list-style-type:none;padding:0;margin:0}.text-block-header{font-family:Kanit,sans-serif;text-decoration:none;color:#252525;font-weight:bolder;font-size:60px}@media screen and (max-width:1200px){.text-block-header{font-size:48px}}@media screen and (max-width:920px){.text-block-header{font-size:32px}}@media screen and (max-width:400px){.text-block-header{font-size:24px}}.text-block-sub-header{font-family:Kanit,sans-serif;text-decoration:none;color:#252525;font-weight:bolder;font-size:32px;margin-top:7px}@media screen and (max-width:1200px){.text-block-sub-header{font-size:32px}}@media screen and (max-width:920px){.text-block-sub-header{font-size:32px}}@media screen and (max-width:400px){.text-block-sub-header{font-size:24px}}@media screen and (max-width:400px){.text-block-sub-header{margin-top:2px}}.text-block-text{font-family:Kanit,sans-serif;text-decoration:none;color:#757575;font-weight:300;font-size:18px}.image-block-container{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:10px}.image-block-image{max-width:320px;border-radius:320px}.image-block-text{font-family:Kanit,sans-serif;text-decoration:none;color:#757575;font-weight:300;font-size:18px}@media screen and (max-width:640px){.image-block-container{display:none}}.image-text-block-container{display:flex;gap:35px}.banner-container{font-family:Kanit,sans-serif;text-decoration:none;color:#252525;font-weight:bolder;font-size:110px;display:flex;justify-content:center;align-items:center}@media screen and (max-width:1200px){.banner-container{font-size:96px}}@media screen and (max-width:920px){.banner-container{font-size:72px}}@media screen and (max-width:400px){.banner-container{font-size:48px}}.mini-projects-sub-header{font-family:Kanit,sans-serif;text-decoration:none;color:#252525;font-weight:bolder;font-size:24px}@media screen and (max-width:1200px){.mini-projects-sub-header{font-size:24px}}@media screen and (max-width:920px){.mini-projects-sub-header{font-size:24px}}@media screen and (max-width:400px){.mini-projects-sub-header{font-size:18px}}.projects-page .text-block-header{font-family:Kanit,sans-serif;text-decoration:none;color:#252525;font-weight:bolder;font-size:32px}@media screen and (max-width:1200px){.projects-page .text-block-header{font-size:32px}}@media screen and (max-width:920px){.projects-page .text-block-header{font-size:32px}}@media screen and (max-width:400px){.projects-page .text-block-header{font-size:24px}}.projects-page .text-block-sub-header{font-family:Kanit,sans-serif;text-decoration:none;color:#252525;font-weight:300;font-size:18px}.toolkit-item{width:160px;height:48px;line-height:48px;background-color:#252525;color:#fdfdfd;text-align:center;border-radius:48px}.toolkit-container{display:flex;flex-direction:column;gap:20px}.toolkit-header{font-family:Kanit,sans-serif;text-decoration:none;color:#252525;font-weight:bolder;font-size:24px}@media screen and (max-width:1200px){.toolkit-header{font-size:24px}}@media screen and (max-width:920px){.toolkit-header{font-size:24px}}@media screen and (max-width:400px){.toolkit-header{font-size:18px}}.toolkit-items-container{font-family:Kanit,sans-serif;text-decoration:none;color:#757575;font-weight:300;font-size:18px;display:flex;flex-wrap:wrap;justify-content:space-evenly;gap:20px}.about-page .text-block-container,.about-page .text-block-header-container{justify-content:left;text-align:left}.about-page .text-block-header{font-family:Kanit,sans-serif;text-decoration:none;color:#252525;font-weight:bolder;font-size:24px}@media screen and (max-width:1200px){.about-page .text-block-header{font-size:24px}}@media screen and (max-width:920px){.about-page .text-block-header{font-size:24px}}@media screen and (max-width:400px){.about-page .text-block-header{font-size:18px}}.thumbnail-container{display:flex;flex:1;gap:10px}.thumbnail-image{max-width:35px;border-radius:35px;align-self:center}.thumbnail-text{font-family:Kanit,sans-serif;text-decoration:none;color:#757575;font-weight:300;font-size:18px;font-weight:400;align-self:center;min-width:120px}.navbar-container{display:flex;flex:1;gap:50px;justify-content:right}.navbar-container.active{background-color:#fdfdfd;display:flex}.navbar-item{cursor:pointer;color:#252525;transition:.25s;font-family:Kanit,sans-serif;text-decoration:none;color:#757575;font-weight:300;font-size:18px;font-weight:400;align-self:center}.navbar-item:hover{color:#252525}.hamburger-container{display:none;flex:1;justify-content:right}.hamburger-icon{font-family:Kanit,sans-serif;text-decoration:none;cursor:pointer;font-weight:400;color:#252525;transition:.25s;align-self:center;font-size:2em}.hamburger-icon:hover{color:#757575}@media screen and (max-width:640px){.navbar-container{display:none;flex-direction:column;position:fixed;width:100%;height:100vh;top:60px;margin-top:60px;left:0;z-index:100}.hamburger-container{display:flex}}.header-container{min-height:60px;display:flex}.links-container{display:flex;flex:1;gap:50px;justify-content:left}.links-item{cursor:pointer;color:#252525;transition:.25s;font-family:Kanit,sans-serif;text-decoration:none;color:#757575;font-weight:300;font-size:18px;font-weight:400;align-self:center}.links-item:hover{color:#252525}@media screen and (max-width:640px){.links-container{justify-content:center}}@media screen and (max-width:300px){.links-container{gap:25px}}.footer-container{min-height:60px;display:flex;margin-top:auto}@media screen and (max-width:640px){.footer-container .thumbnail-container{display:none}}body{background-color:#fdfdfd;margin:0;padding:0}#root{display:flex;flex-direction:column;height:100vh;min-width:240px;min-height:480px;margin-left:12%;margin-right:12%}a{font-family:Kanit,sans-serif;text-decoration:none;cursor:pointer;font-weight:400;color:#252525;transition:.25s}a:hover{color:#757575}@media screen and (max-width:480px){#root{margin-left:6%;margin-right:6%}}@media screen and (max-width:320px){#root{margin-left:3%;margin-right:3%}}
