:root{--color-background: #E7DCF2;--color-primary: #231B40;--color-secondary: #7139C0;--color-tertiary: #F29D35;--color-text: #231B40}.kanit-thin{font-family:Kanit,sans-serif;font-weight:100;font-style:normal}.kanit-extralight{font-family:Kanit,sans-serif;font-weight:200;font-style:normal}.kanit-light{font-family:Kanit,sans-serif;font-weight:300;font-style:normal}.kanit-regular{font-family:Kanit,sans-serif;font-weight:400;font-style:normal}.kanit-medium{font-family:Kanit,sans-serif;font-weight:500;font-style:normal}.kanit-semibold{font-family:Kanit,sans-serif;font-weight:600;font-style:normal}.kanit-bold{font-family:Kanit,sans-serif;font-weight:700;font-style:normal}.kanit-extrabold{font-family:Kanit,sans-serif;font-weight:800;font-style:normal}.kanit-black{font-family:Kanit,sans-serif;font-weight:900;font-style:normal}.kanit-thin-italic{font-family:Kanit,sans-serif;font-weight:100;font-style:italic}.kanit-extralight-italic{font-family:Kanit,sans-serif;font-weight:200;font-style:italic}.kanit-light-italic{font-family:Kanit,sans-serif;font-weight:300;font-style:italic}.kanit-regular-italic{font-family:Kanit,sans-serif;font-weight:400;font-style:italic}.kanit-medium-italic{font-family:Kanit,sans-serif;font-weight:500;font-style:italic}.kanit-semibold-italic{font-family:Kanit,sans-serif;font-weight:600;font-style:italic}.kanit-bold-italic{font-family:Kanit,sans-serif;font-weight:700;font-style:italic}.kanit-extrabold-italic{font-family:Kanit,sans-serif;font-weight:800;font-style:italic}.kanit-black-italic{font-family:Kanit,sans-serif;font-weight:900;font-style:italic}#projects-list{display:flex;flex-wrap:wrap;flex-direction:row}#projects-list .project-card-heading,#projects-list .project-card-details,#projects-list .project-card-footer{padding:1em}#projects-list .project-card{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;box-sizing:border-box;border:1px solid transparent;border-radius:5px;min-height:35vh;max-height:40vh;width:calc(100% / 3 - 1.6em);margin:.8em;box-shadow:1px 1px 10px #000}#projects .project-card:before{content:"";position:absolute;top:0;left:0;width:100%;height:100%;background-color:var(--color-primary);z-index:-1}#projects-list .project-card-heading{display:flex;flex-direction:row;justify-content:space-between;background:#11121c;border:1px solid transparent;border-bottom-left-radius:30px}.project-card-heading .languageContainer{position:absolute;top:0;right:0;width:80px;height:80px;border-bottom-left-radius:100%;background-color:var(--color-background);display:flex;justify-content:right;align-items:start}.project-card-heading img{width:60px}#projects-list .project-card-heading>h2{margin:0;color:var(--color-tertiary);overflow:hidden;text-overflow:ellipsis;width:80%}#projects-list .project-card-details{margin-top:0;overflow:hidden}#projects-list .project-card-details p{color:#eddef9;overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:4;line-clamp:4;overflow-wrap:break-word}#projects-list .project-card-footer{margin-top:auto}#projects-list .author-img-container>img{width:40px}@media(orientation:portrait){#projects-list>.project-card{border:1px solid transparent;width:calc(50% - 1.6em)}#projects-list .project-card{min-height:55vh;max-height:65vh}}@media(max-width:900px){#projects-list>.project-card{border:1px solid transparent;width:calc(50% - 1.6em)}}@media(max-width:600px){#projects-list>.project-card{border:1px solid transparent;width:60vw}}nav{font-size:1.3rem;position:fixed;z-index:1;right:0;width:max-content;top:50%;transform:translateY(-50%)}nav li{margin:0 2rem 0 0;list-style-type:none}nav a,nav .fetched{text-decoration:none}nav a{color:gray}nav .fetched{color:var(--color-primary)}html,body{font-size:16px;height:100vh;scroll-snap-type:y mandatory;background:var(--color-background)}h1{color:var(--color-primary)}h2{color:var(--color-secondary)}section{min-height:100vh}section>div{padding:10% 15%}.title{font-size:3.9rem}.sub-title{font-size:1.9rem}.medium-title{font-size:2.5rem}.no-scroll{overflow:hidden}@media(max-width:900px){.title{font-size:2.9rem}.medium-title{font-size:2.3rem}}@media(max-width:600px){.title{font-size:1.9rem}}