@font-face{font-family:Bold-Pixel-Font;src:url(/portfolio-website/assets/KarenFat-DVPb9u26.ttf)}@font-face{font-family:Thin-Pixel-Font;src:url(/portfolio-website/assets/Habbo-pf3Al8V2.ttf)}.body-container{width:100dvw;height:100dvh;background-color:#fffcf3;display:flex;flex-direction:row;justify-content:space-between;align-items:flex-start;overflow-x:hidden;overflow-y:auto}.body-container .left-container,.body-container .right-container{height:100%;width:48%;display:flex;flex-direction:column;justify-content:flex-start;align-items:center}.body-container .left-container{position:sticky;top:0;padding:5rem 0 5rem 5rem}.body-container .left-container .wrapper-box{height:100%;width:100%;display:flex;flex-direction:column;justify-content:flex-start;align-items:center;position:relative}.body-container .left-container .titles-container{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;width:100%;height:fit-content;position:absolute;top:0;left:0}.body-container .left-container .titles-container>h1{font-family:Bold-Pixel-Font,"monospace";color:var(--title-color);font-size:3.125rem;line-height:2.5rem}.body-container .left-container .titles-container>h2{font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:var(--text-color);font-size:1.875rem}.body-container .left-container .titles-container>h3{font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:#000;font-size:1.563rem;max-width:22rem}.body-container .left-container .nav-container{width:100%;height:fit-content;margin:25vh 0 20vh;display:flex;justify-content:flex-start;align-items:center;position:absolute;top:25vh;left:0}.body-container .left-container .nav-container ul{margin-top:-100px;list-style:none;cursor:pointer}.body-container .left-container .nav-container ul li{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;width:fit-content;margin-bottom:15px;cursor:pointer}.body-container .left-container .nav-container ul li>.nav-line{width:28px;height:1.5px;background-color:#323232;margin-right:10px;transition:width .2s linear;cursor:pointer}.body-container .left-container .nav-container ul li>p{font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:#323232;font-size:1.25rem;text-transform:uppercase;margin-top:-2px;cursor:pointer}.body-container .left-container .nav-container ul li.active-nav>.nav-line,.body-container .left-container .nav-container ul li:hover>.nav-line{background-image:url("data:image/svg+xml,%3csvg%20width='39'%20height='7'%20viewBox='0%200%2039%207'%20fill='none'%20xmlns='http://www.w3.org/2000/svg'%3e%3crect%20y='3'%20width='36'%20height='1'%20fill='%238DB447'/%3e%3crect%20x='36'%20y='3'%20width='1'%20height='1'%20fill='%238DB447'/%3e%3crect%20x='37'%20y='3'%20width='1'%20height='1'%20fill='%238DB447'/%3e%3crect%20x='38'%20y='3'%20width='1'%20height='1'%20fill='%238DB447'/%3e%3crect%20x='36'%20y='5'%20width='1'%20height='1'%20fill='%238DB447'/%3e%3crect%20x='37'%20y='4'%20width='1'%20height='1'%20fill='%238DB447'/%3e%3crect%20x='35'%20y='6'%20width='1'%20height='1'%20fill='%238DB447'/%3e%3crect%20x='36'%20y='1'%20width='1'%20height='1'%20fill='%238DB447'/%3e%3crect%20x='37'%20y='2'%20width='1'%20height='1'%20fill='%238DB447'/%3e%3crect%20x='35'%20width='1'%20height='1'%20fill='%238DB447'/%3e%3c/svg%3e");background-size:cover;image-rendering:pixelated;background-color:transparent;width:56px;height:10px}.body-container .left-container .nav-container ul li.active-nav>p,.body-container .left-container .nav-container ul li:hover>p{color:var(--text-color)}.body-container .left-container .social-container{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;width:100%;height:fit-content;position:absolute;bottom:5vh;left:0}.body-container .left-container .social-container>img{image-rendering:pixelated;image-rendering:crisp-edges;image-rendering:-moz-crisp-edges;image-rendering:-webkit-optimize-contrast;image-rendering:optimizeSpeed;cursor:pointer;width:31px;height:auto}.body-container .left-container .social-container>img:nth-of-type(1){width:29px}.body-container .left-container .social-container>img:nth-of-type(2){margin:0 .563rem 0 .625rem}.body-container .left-container .last_update_date{width:100%;text-align:left;font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:var(--text-color);font-size:1rem;position:absolute;bottom:0;left:0}.body-container .right-container{padding:5rem 5rem 5rem 0}.body-container .right-container>.home-text{font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:#000;font-size:1.375rem;margin-bottom:8rem}.body-container .right-container>.experiences-container,.body-container .right-container>.projects-container{width:100%}.body-container .right-container>.experiences-container>p,.body-container .right-container>.projects-container>p{font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:#323232;font-size:1.5rem;text-transform:uppercase;margin-bottom:1.875rem;display:none}.body-container .right-container>.experiences-container>h4,.body-container .right-container>.projects-container>h4{font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:#323232;font-size:1.5rem;margin:1.875rem 0 6.25rem;width:fit-content;transition:color .1s linear;cursor:pointer}.body-container .right-container>.experiences-container>h4:hover,.body-container .right-container>.projects-container>h4:hover{color:var(--text-color)}.body-container .right-container>.experiences-container>h4:hover>img,.body-container .right-container>.projects-container>h4:hover>img{color:var(--text-color)}.body-container .right-container>.experiences-container>.experience-box{display:flex;flex-direction:row;justify-content:flex-start;align-items:flex-start;width:calc(100% + 30px);padding:15px 20px;margin:0 0 20px -20px;transition:all .1s linear}.body-container .right-container>.experiences-container>.experience-box:hover{background-color:#fffcf3;border-radius:.938rem;box-shadow:#64646f33 0 7px 29px}.body-container .right-container>.experiences-container>.experience-box:hover>.details>.experience-title{color:var(--text-color)}.body-container .right-container>.experiences-container>.experience-box>.date{width:100px;margin:0 15px 0 0;flex-shrink:0}.body-container .right-container>.experiences-container>.experience-box>.date>p{font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:#323232;font-size:1.25rem}.body-container .right-container>.experiences-container>.experience-box>.details{display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;margin:-3px 0 0}.body-container .right-container>.experiences-container>.experience-box>.details>.experience-title{font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:var(--title-color);font-size:1.563rem;transition:all .2s linear}.body-container .right-container>.experiences-container>.experience-box>.details>.experience-detail{font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:#000;font-size:1.375rem}.body-container .right-container>.experiences-container>.experience-box>.details>.experience-tags{margin-top:20px}.body-container .right-container>.experiences-container>.experience-box>.details>.experience-tags ul{list-style:none;display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:10px}.body-container .right-container>.experiences-container>.experience-box>.details>.experience-tags ul>li{padding:5px 15px;background-color:#f5f6e4;border-radius:15px}.body-container .right-container>.experiences-container>.experience-box>.details>.experience-tags ul>li>p{font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:var(--text-color);font-size:1.25rem;margin-top:-3px}.body-container .right-container>.projects-container>.project-box{display:flex;flex-direction:row;justify-content:flex-start;align-items:flex-start;width:calc(100% + 30px);padding:15px 20px;margin:0 0 20px -20px;transition:all .1s linear}.body-container .right-container>.projects-container>.project-box:hover{background-color:#fffcf3;border-radius:.938rem;box-shadow:#64646f33 0 7px 29px}.body-container .right-container>.projects-container>.project-box:hover>.details>.project-title{color:var(--text-color)}.body-container .right-container>.projects-container>.project-box>.details>.project-title{font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:var(--title-color);font-size:1.563rem;transition:all .2s linear;cursor:pointer}.body-container .right-container>.projects-container>.project-box>.details>.project-detail{font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:#000;font-size:1.375rem}.body-container .right-container>.projects-container>.project-box>.details>.project-tags{margin-top:20px}.body-container .right-container>.projects-container>.project-box>.details>.project-tags ul{list-style:none;display:flex;flex-direction:row;align-items:center;flex-wrap:wrap;gap:10px}.body-container .right-container>.projects-container>.project-box>.details>.project-tags ul>li{padding:5px 15px;background-color:#f5f6e4;border-radius:15px}.body-container .right-container>.projects-container>.project-box>.details>.project-tags ul>li>p{font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:var(--text-color);font-size:1.25rem;margin-top:-3px}.body-container .right-container>.footer-container{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.body-container .right-container>.footer-container>img{image-rendering:pixelated;image-rendering:crisp-edges;image-rendering:-moz-crisp-edges;image-rendering:-webkit-optimize-contrast;image-rendering:optimizeSpeed;width:12.5rem;height:auto}.body-container .right-container>.footer-container>p{font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:#4c4c4c;font-size:1.25rem;width:65%;text-align:center;margin:0 0 6.25rem}.body-container .project-archive-container{height:100%;width:100%;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;padding:5rem}.body-container .project-archive-container .return-text{cursor:pointer;transition:all .2s linear;display:flex;flex-direction:row;justify-content:flex-start;align-items:center}.body-container .project-archive-container .return-text>p,.body-container .project-archive-container .return-text>.svg-wrapper,.body-container .project-archive-container .return-text>.svg-wrapper>svg{cursor:pointer;transition:all .2s linear}.body-container .project-archive-container .return-text>p{margin-top:-3px;font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:#323232;font-size:1.25rem;text-transform:uppercase}.body-container .project-archive-container .return-text .svg-wrapper{width:30px;overflow:hidden;display:inline-block;margin:0 10px 0 0}.body-container .project-archive-container .return-text .svg-wrapper>svg{height:10.5px;width:auto;color:#323232}.body-container .project-archive-container .return-text:hover>p{color:var(--text-color)}.body-container .project-archive-container .return-text:hover .svg-wrapper{width:20px}.body-container .project-archive-container .return-text:hover .svg-wrapper svg{color:var(--text-color)}.body-container .project-archive-container>h1{font-family:Bold-Pixel-Font,"monospace";color:var(--title-color);font-size:3.125rem;line-height:3.5rem;margin:2vh 0}.body-container .project-archive-container>table{width:100%;border-collapse:collapse}.body-container .project-archive-container>table>thead tr th{text-transform:uppercase;font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:#4c4c4c;font-size:1.3rem;text-align:left}.body-container .project-archive-container>table>thead tr th:nth-of-type(1){padding:0 30px 0 0}.body-container .project-archive-container>table>thead tr th:nth-of-type(5){padding:0 0 0 30px}.body-container .project-archive-container>table>tbody tr{height:50px;border-bottom:2px solid #F5F6E4}.body-container .project-archive-container>table>tbody tr th{font-family:Thin-Pixel-Font,"monospace";font-weight:100;color:var(--subtitle-color);font-size:1.5rem;text-align:left;vertical-align:top;padding:5px 0 0}.body-container .project-archive-container>table>tbody tr td{vertical-align:top;font-family:Thin-Pixel-Font,"monospace";font-weight:100;text-align:left}.body-container .project-archive-container>table>tbody tr td:nth-of-type(1){color:var(--text-color);font-size:1.9rem;padding-bottom:10px;padding-top:4px;line-height:1.5rem}.body-container .project-archive-container>table>tbody tr td:nth-of-type(1) svg{display:none}.body-container .project-archive-container>table>tbody tr td:nth-of-type(2){color:var(--subtitle-color);font-size:1.5rem;width:150px;padding:5px 0 0}.body-container .project-archive-container>table>tbody tr td:nth-of-type(3){color:var(--text-color);font-size:1.25rem;margin:0 20px 0 0}.body-container .project-archive-container>table>tbody tr td:nth-of-type(3)>.tag-wrapper{height:100%;padding:10px 0;width:100%;display:flex;flex-direction:row;justify-content:flex-start;align-items:center;flex-wrap:wrap;gap:10px}.body-container .project-archive-container>table>tbody tr td:nth-of-type(3)>.tag-wrapper span{padding:0 15px 3px;background-color:#f5f6e4;border-radius:15px}.body-container .project-archive-container>table>tbody tr td:nth-of-type(4){color:var(--subtitle-color);font-size:1.5rem;white-space:nowrap;padding:5px 0 0 30px}.body-container .project-archive-container>table>tbody tr td:nth-of-type(4)>svg{vertical-align:middle;margin:0 0 0 10px;color:var(--subtitle-color)}@media (min-width: 740px) and (max-width: 1100px){.body-container>.project-archive-container>table>thead tr th:nth-of-type(3){display:none}.body-container>.project-archive-container>table>tbody tr td:nth-of-type(2){display:none}}@media (max-width: 850px){.body-container>.project-archive-container>table>thead tr th:nth-of-type(3),.body-container>.project-archive-container>table>thead tr th:nth-of-type(4){display:none}.body-container>.project-archive-container>table>tbody tr td:nth-of-type(2),.body-container>.project-archive-container>table>tbody tr td:nth-of-type(3){display:none}}@media (max-width: 740px){.body-container{flex-direction:column;justify-content:flex-start;align-items:flex-start}.body-container .left-container,.body-container .right-container{height:100%;width:100%;display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start}.body-container .left-container{position:static;padding:3rem}.body-container .left-container .wrapper-box,.body-container .left-container .titles-container{position:static}.body-container .left-container .nav-container{display:none}.body-container .left-container .social-container{position:static;margin:5vh 0 0}.body-container .left-container .social-container>img{image-rendering:pixelated;image-rendering:crisp-edges;image-rendering:-moz-crisp-edges;image-rendering:-webkit-optimize-contrast;image-rendering:optimizeSpeed;cursor:pointer;width:31px;height:auto}.body-container .left-container .social-container>img:nth-of-type(1){width:29px}.body-container .left-container .social-container>img:nth-of-type(2){margin:0 .563rem 0 .625rem}.body-container .left-container .last_update_date{display:none}.body-container>.right-container{padding:3rem}.body-container>.right-container>.experiences-container>p,.body-container>.right-container>.projects-container>p{display:block}.body-container>.right-container>.experiences-container .experience-box{flex-direction:column}.body-container>.right-container>.experiences-container .experience-box.viewing{background-color:#fffcf3;border-radius:.938rem;box-shadow:#64646f33 0 7px 29px}.body-container>.right-container>.experiences-container .experience-box.viewing>.details>.experience-title{color:var(--text-color)}.body-container>.right-container>.experiences-container .experience-box>.date>p{color:#4c4c4c}.body-container>.right-container>.experiences-container .experience-box>.details>.experience-title{margin:1vh 0}.body-container>.right-container>.projects-container>.project-box.viewing{background-color:#fffcf3;border-radius:.938rem;box-shadow:#64646f33 0 7px 29px}.body-container>.right-container>.projects-container>.project-box.viewing>.details>.project-title{color:var(--text-color)}.body-container>.right-container>.projects-container>.project-box>.details>.project-title{margin:1vh 0}.body-container>.right-container>.footer-container>p{width:100%}.body-container>.project-archive-container{padding:3rem}.body-container>.project-archive-container>.return-text>.svg-wrapper{animation:ReturnButtonWidthAnimation 6s infinite ease-in-out}.body-container>.project-archive-container>.return-text>.svg-wrapper svg{animation:ReturnButtonTextAnimation 3s infinite ease-in-out}.body-container>.project-archive-container>table>thead tr th:nth-of-type(3),.body-container>.project-archive-container>table>thead tr th:nth-of-type(4),.body-container>.project-archive-container>table>thead tr th:nth-of-type(5){display:none}.body-container>.project-archive-container>table>tbody tr td:nth-of-type(1) .nowrap{white-space:nowrap;display:inline;height:100%}.body-container>.project-archive-container>table>tbody tr td:nth-of-type(1) .nowrap svg{vertical-align:middle;display:inline;height:100%;margin-left:.5ch;color:var(--text-color)}.body-container>.project-archive-container>table>tbody tr td:nth-of-type(2),.body-container>.project-archive-container>table>tbody tr td:nth-of-type(3),.body-container>.project-archive-container>table>tbody tr td:nth-of-type(4){display:none}}@keyframes ReturnButtonTextAnimation{0%{color:#000}50%{color:#8db447}to{color:#000}}@keyframes ReturnButtonWidthAnimation{0%{width:30px}50%{width:20px}to{width:30px}}
