@import"https://fonts.googleapis.com/css2?family=Montserrat:wght@300;400;700;900&display=swap";header{height:70px;position:sticky;top:0;z-index:2;border-bottom:1px solid transparent;transition:.2s;background-color:#353535;color:#e5e5e5;border-color:#ffffff20}header .right-side{background-color:#353535;border-color:#ffffff20}header>.working-content{display:flex;align-items:center;justify-content:space-between}header .left-side,header .right-side{display:flex;align-items:center;flex:1}header .right-side{justify-content:flex-end;height:100%}header .left-side{z-index:1;justify-content:space-evenly}header .logo{width:50px;height:50px;margin-right:5px;display:flex;justify-content:center;align-items:center}header .logo>svg{height:100%;width:auto}header .name{font-size:clamp(1em,6vw,1.5em);font-weight:900;text-transform:uppercase;overflow:hidden;width:90%;white-space:nowrap;transition:.2s}header button{background:none;font-size:.9em;font-weight:300;text-transform:none;margin:0 5px;height:70px;box-shadow:0 2px 0 0 var(--borderColor);border-radius:0;flex:1;box-sizing:border-box;color:inherit}header button:hover{box-shadow:0 4px 0 0 var(--borderColor);font-size:.95em}header button:focus{transform:scale(1)}body{margin:0;font-family:Montserrat,sans-serif;font-size:20px}.theme-div{width:100%;min-height:100vh;box-sizing:border-box;transition:.5s background-color,.5s color}.theme-div.light-theme{background-color:#e5e5e5;color:#353535}.theme-div.dark-theme{background-color:#353535;color:#e5e5e5}.working-content{padding:0 24px;width:clamp(160px,80vw - 100px,800px);margin:0 auto;height:100%}header .working-content{width:clamp(200px,100vw - 100px,1000px)}.page-body{overflow:hidden;position:relative;padding-bottom:50px}.page-body.unclip{height:100%;max-height:100%}a,button{font-family:Montserrat,sans-serif!important;display:flex;align-items:center;justify-content:center;border-radius:10px;background:linear-gradient(0deg,#7100d3 50%,#8454c8);background-size:100% 200%;color:#e5e5e5;fill:#e5e5e5;text-decoration:none;text-transform:uppercase;font-weight:600;font-size:1.1em;transition:.2s;box-sizing:border-box;cursor:pointer;border:none;outline:none;box-shadow:0 8px 10px #1d1d1d40}a:hover,button:hover{background-position:0 25%}a:focus,button:focus{transform:scale(.95);background-position:0 50%}a.padded,button.padded{padding:15px}a.padded .text,button.padded .text{overflow:hidden;transition:.2s;width:calc(100% - clamp(24px,5vw,36px) - 10px)}.bottom-btn{height:70px;display:flex;justify-content:center}.bottom-btn button{position:absolute}.start-up-anim{width:100%;height:100vh;position:fixed;top:0;left:0;display:flex;justify-content:center;align-items:center;overflow:hidden;z-index:10;white-space:nowrap;transition:.2s}.start-up-anim.hide{opacity:0;pointer-events:none}.start-up-anim>.layer{width:100vw;height:100vh}.start-up-anim .full-logo{width:var(--width);height:var(--width);display:flex;justify-content:center;align-items:center;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.start-up-anim .full-logo>svg{position:absolute;height:100%;width:auto}.start-up-anim .names{position:absolute;text-align:center;line-height:.7;top:50%;left:50%;transform:translate(-50%) translateY(220px);font-size:3em;width:fit-content}.start-up-anim .names>.heavy{font-weight:900;text-transform:uppercase}.start-up-anim .names>.light{font-weight:300;font-size:.5em}.start-up-anim>.type-3 .full-logo{animation-name:logo-shing;transform:translate(-50%,-50%) scale(1.01)}@keyframes logo-shing{0%{clip-path:polygon(50% 0%,50% 0%,50% 0%,0% 25%,0% 25%,0% 25%)}to{clip-path:polygon(50% 0%,100% 25%,100% 75%,50% 100%,0% 75%,0% 25%)}}.start-up-anim>.type-4 .names{animation-fill-mode:forwards;animation-name:move-name-1}@keyframes move-name-1{0%{transform:translate(-50%) translateY(0);font-size:1em}to{transform:translate(-50%) translateY(220px);font-size:clamp(1em,10vw,3em)}}.start-up-anim>.type-5 .names{font-size:clamp(1em,10vw,3em)}.section{display:flex;flex-direction:column;align-items:center}.section-title{display:flex;justify-content:center;align-items:center;font-size:2em;margin:70px 0 30px;-webkit-text-stroke:1px transparent;z-index:1;width:100%}.section-title.colored h1,.section-title.colored .section-number,.section-title.colored .hex-stroke{background-position:0 0}.section-title h1{letter-spacing:-2px;font-weight:700;line-height:1.2;margin:0;font-size:1.2em;padding:0 5px;background-size:100% 200%;transition:.5s;background-position:0 100%;-webkit-background-clip:text;-webkit-text-fill-color:transparent}.light-theme .section-title h1{background-image:linear-gradient(0deg,#e5e5e5 50%,transparent 50%),linear-gradient(90deg,var(--startColor) 0%,var(--endColor) 100%)}.dark-theme .section-title h1{background-image:linear-gradient(0deg,#353535 50%,transparent 50%),linear-gradient(90deg,var(--startColor) 0%,var(--endColor) 100%)}.section .section-contents{width:100%;display:flex;flex-direction:column;align-items:center}.section.education .section-contents{flex-direction:row;align-items:flex-start;flex-wrap:wrap}.section.education .glass-card{margin:0 0 20px}.section.education .glass-card:last-child{margin:0}.section.games .glass-card{flex-direction:row;margin:0 0 40px;align-items:center}.section.games .glass-card .content{flex:1;padding:10px 20px 0;text-align:justify;text-align-last:center}.section.games .glass-card .game-image{flex:1;max-width:500px;border-radius:20px;overflow:hidden;margin:0 10px;display:flex;align-items:center;justify-content:center}.section.games .glass-card .game-image>img{width:100%;height:auto}.glass-card{height:100%;width:100%;background:#ffffff40;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);border-radius:15px;border:1px solid rgba(255,255,255,.18);padding:20px;box-sizing:border-box;overflow:hidden;box-shadow:0 8px 10px #1d1d1d40;display:flex;flex-direction:column;white-space:pre-wrap}.glass-card>div{margin-bottom:10px}.glass-card>div:last-child{margin-bottom:0}.glass-card .light-font{font-weight:300;font-style:italic}.glass-card .big-font{font-weight:700;margin-right:10px}.glass-card .small-font{font-weight:300;font-size:.75em}.glass-card .buttons{display:flex;align-items:center;justify-content:space-evenly;width:100%}.glass-card .buttons a{margin:10px;width:100%;max-width:300px}.glass-card .project-info{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;flex:1}.glass-card .project-info .project-logo{font-size:1.25em;font-weight:700}.glass-card .project-info .project-description{margin:10px auto 0;text-align:center;transition:.2s}.glass-card .project-images{transform:translate(20%);max-width:50%;flex:1;display:flex}.glass-card .project-images .img1{position:relative;z-index:2;transform:translate(30%) translateY(5%)}.glass-card .project-images .img1:only-child{transform:translate(-10%)}.glass-card .project-images .img2{position:relative;z-index:0;transform:translateY(-5%)}.section.work>.section-contents{width:100vw;height:600px;background-color:#00000040;overflow:hidden;position:relative;display:flex;flex-direction:column;align-items:center}.section.work>.section-contents>.border-element-container{position:absolute;height:0;width:100%;z-index:1}.section.work>.section-contents>.border-element-container>.border-element{height:30px;pointer-events:none}.section.work>.section-contents>.border-element-container.top-border{top:0}.section.work>.section-contents>.border-element-container.top-border>.border-element{background:linear-gradient(180deg,#00000040,#0000)}.section.work>.section-contents>.border-element-container.bottom-border{bottom:30px}.section.work>.section-contents>.border-element-container.bottom-border>.border-element{background:linear-gradient(0deg,#00000050,#0000)}.section.work>.section-contents>.working-content{display:flex;flex-direction:column;position:relative}.section.work>.section-contents .glass-card{height:470px;flex-direction:row;justify-content:space-between;align-items:center}.work-card{width:calc(100% - 48px);cursor:pointer;transition:.2s;position:absolute}.work-card:nth-child(1){top:50px}.work-card:nth-child(1):hover{top:30px}.work-card:nth-child(1):hover.hidden{top:90%}.work-card:nth-child(2){top:135px}.work-card:nth-child(2):hover{top:115px}.work-card:nth-child(2):hover.hidden{top:90%}.work-card:nth-child(3){top:220px}.work-card:nth-child(3):hover{top:200px}.work-card:nth-child(3):hover.hidden{top:90%}.work-card:nth-child(4){top:305px}.work-card:nth-child(4):hover{top:285px}.work-card:nth-child(4):hover.hidden{top:90%}.work-card:nth-child(5){top:390px}.work-card:nth-child(5):hover{top:370px}.work-card:nth-child(5):hover.hidden{top:90%}.work-card:nth-child(6){top:475px}.work-card:nth-child(6):hover{top:455px}.work-card:nth-child(6):hover.hidden{top:90%}.work-card:nth-child(7){top:560px}.work-card:nth-child(7):hover{top:540px}.work-card:nth-child(7):hover.hidden{top:90%}.work-card:nth-child(8){top:645px}.work-card:nth-child(8):hover{top:625px}.work-card:nth-child(8):hover.hidden{top:90%}.work-card.shown{top:40px!important}.work-card.hidden{top:90%}.work-card .glass-card{margin:0 auto}.work-card .project-name{position:absolute;top:15px;left:-5px;background-color:#1d1d1d40;border:1px solid transparent;padding:10px 15px 10px 20px;border-radius:5px;z-index:2}.light-theme .theme-color,.light-theme .theme-button svg:first-child,.theme-button .light-theme svg:first-child,.light-theme .hex-number{color:#e5e5e5}.dark-theme .theme-color,.dark-theme .theme-button svg:first-child,.theme-button .dark-theme svg:first-child,.dark-theme .hex-number{color:#353535}.light-theme .theme-stroke-inv,.light-theme .hex-number,.light-theme .section-title h1,.section-title .light-theme h1{-webkit-text-stroke-color:#353535}.dark-theme .theme-stroke-inv,.dark-theme .hex-number,.dark-theme .section-title h1,.section-title .dark-theme h1{-webkit-text-stroke-color:#e5e5e5}.hexagon{fill:#7100d3;position:absolute;transform:translate(-50%,-50%)}.hexagon>svg{height:100%;width:auto}.hexagon.to-center{animation:hex-to-center 1s forwards}.hex-icon{margin-right:10px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;position:relative}.hex-icon>svg:first-child{color:#7100d3;position:absolute;width:60%;height:60%}.hex-icon>svg:nth-child(2){fill:#e5e5e5;width:inherit;height:inherit}header button .hex-icon{display:none}header button .hex-icon>svg:first-child{color:#353535}.hex-number{margin-right:10px;width:50px;height:50px;font-weight:900;mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='73.44'%20height='83.25'%20viewBox='0%200%2073.44%2083.25'%3e%3cpath%20d='M73.44,59.93V23.32A5,5,0,0,0,70.93,19L39.23.67a5.05,5.05,0,0,0-5,0L2.51,19A5,5,0,0,0,0,23.32V59.93a5,5,0,0,0,2.51,4.34l31.7,18.31a5.05,5.05,0,0,0,5,0l31.7-18.31A5,5,0,0,0,73.44,59.93Z'/%3e%3c/svg%3e");-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:50% 50%;mask-position:50% 50%;display:flex;align-items:center;justify-content:center}.hex-number .hex-stroke{transition:.5s;display:flex;align-items:center;justify-content:center;width:48px;height:48px;mask:url("data:image/svg+xml,%3csvg%20xmlns='http://www.w3.org/2000/svg'%20width='73.44'%20height='83.25'%20viewBox='0%200%2073.44%2083.25'%3e%3cpath%20d='M73.44,59.93V23.32A5,5,0,0,0,70.93,19L39.23.67a5.05,5.05,0,0,0-5,0L2.51,19A5,5,0,0,0,0,23.32V59.93a5,5,0,0,0,2.51,4.34l31.7,18.31a5.05,5.05,0,0,0,5,0l31.7-18.31A5,5,0,0,0,73.44,59.93Z'/%3e%3c/svg%3e");-webkit-mask-size:100% 100%;mask-size:100% 100%;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:50% 50%;mask-position:50% 50%;background-size:100% 200%;background-position:0 100%}.light-theme .hex-number .hex-stroke{background-image:linear-gradient(0deg,#e5e5e5 50%,var(--startColor) 50%)}.dark-theme .hex-number .hex-stroke{background-image:linear-gradient(0deg,#353535 50%,var(--startColor) 50%)}.parallax-hexagons{pointer-events:none;position:absolute;width:100%;height:100%;overflow:hidden;opacity:.5}.theme-button{position:fixed;bottom:10px;right:10px;cursor:pointer;z-index:1;width:70px;height:70px}.theme-button .hex-icon{width:inherit;height:inherit}.theme-button svg:first-child{transition:.2s}.theme-button svg:nth-child(2){transition:.2s}.theme-button:hover svg:first-child{transform:scale(1.1)}@keyframes hex-to-center{to{top:50%;left:50%}}.light-theme .theme-fill-inv,.light-theme .theme-button svg:nth-child(2),.theme-button .light-theme svg:nth-child(2){fill:#353535}.dark-theme .theme-fill-inv,.dark-theme .theme-button svg:nth-child(2),.theme-button .dark-theme svg:nth-child(2){fill:#e5e5e5}.light-theme .theme-fill{fill:#e5e5e5}.dark-theme .theme-fill{fill:#353535}.light-theme .theme-color,.light-theme .hex-number,.light-theme .theme-button svg:first-child,.theme-button .light-theme svg:first-child{color:#e5e5e5}.dark-theme .theme-color,.dark-theme .hex-number,.dark-theme .theme-button svg:first-child,.theme-button .dark-theme svg:first-child{color:#353535}.light-theme .theme-color-inv{color:#353535}.dark-theme .theme-color-inv{color:#e5e5e5}.light-theme .theme-bkg,.light-theme .start-up-anim{background-color:#e5e5e5}.dark-theme .theme-bkg,.dark-theme .start-up-anim,.light-theme .theme-bkg-inv,.light-theme .hex-number{background-color:#353535}.dark-theme .theme-bkg-inv,.dark-theme .hex-number{background-color:#e5e5e5}.theme-bkg-inv-light,header button:hover{background-color:#e5e5e520}.light-theme .theme-border-inv,.light-theme .work-card .project-name,.work-card .light-theme .project-name{border-color:#353535}.dark-theme .theme-border-inv,.dark-theme .work-card .project-name,.work-card .dark-theme .project-name{border-color:#e5e5e5}.light-theme .theme-stroke-inv,.light-theme .section-title h1,.section-title .light-theme h1,.light-theme .hex-number{-webkit-text-stroke-color:#353535}.dark-theme .theme-stroke-inv,.dark-theme .section-title h1,.section-title .dark-theme h1,.dark-theme .hex-number{-webkit-text-stroke-color:#e5e5e5}@media screen and (max-width: 1100px){.section.games .glass-card{flex-direction:column}}@media screen and (max-width: 1000px){a.padded .text{width:0}a.padded .hex-icon{margin-right:0}a.padded:only-child .text{width:calc(100% - clamp(24px,5vw,36px) - 10px)}a.padded:only-child .hex-icon{margin-right:10px}header .right-side{align-items:flex-end;transition:.2s;width:100%;position:absolute;right:0;border-bottom:1px solid transparent;overflow:hidden;padding:0 0 4px;height:5px;transform:translateY(40px)}header:hover .right-side{height:70px;transform:translateY(73px)}.game-images>:first-child{display:none!important}.glass-card .project-info{position:absolute;z-index:1}}@media screen and (max-width: 650px){.working-content{width:clamp(200px,100vw - 100px,1000px)}header .logo{margin:0}header .name{width:0}header .right-side .text{display:none}header .right-side .hex-icon{display:flex;margin:0}.section.education .glass-card{text-align:center}.glass-card .buttons{flex-direction:column}.glass-card .buttons .text{width:calc(100% - clamp(24px,5vw,36px) - 10px)}.glass-card .buttons .hex-icon{margin-right:10px}.theme-button{width:60px;height:60px}}@media screen and (max-width: 400px){body{font-size:16px}.working-content{padding:0 10px;width:calc(100% - 20px)}.work-card{width:calc(100% - 20px)}.glass-card .buttons .text,a.padded:only-child .text{width:0}}