@import"https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&display=swap";*{margin:0;padding:0;box-sizing:border-box}html,body{height:100%}.home-container{width:100vw;height:100vh;background-color:#f5f5f5;display:flex}.menu{width:30%;height:100vh;border-right:4px solid black;position:fixed;font-family:Inter,sans-serif;padding:40px;display:flex;flex-direction:column;justify-content:space-between}.site-name-title{font-weight:600;font-size:32px}li{list-style:none;font-weight:400;margin-bottom:3px;padding:0;cursor:pointer;font-size:20px}.my-groceries-title-menu:hover,.pink{color:#000;-webkit-text-stroke-width:.5px;-webkit-text-stroke-color:#f5aec5}.vocabinet-title-menu:hover,.purple{color:#000;-webkit-text-stroke-width:.5px;-webkit-text-stroke-color:rgb(247,216,255)}.title-clicked{font-size:22px}.project-container{position:relative;margin-left:30%;width:70%;height:100vh;overflow-y:auto;overflow-x:hidden;scroll-behavior:smooth;padding:40px 105px;-webkit-overflow-scrolling:touch}.menu-toggle{display:none;all:unset;z-index:999}@media(max-width:1700px){.project-container{padding:40px 95px}}@media(max-width:1600px){.project-container{padding:40px 75px}}@media(max-width:1368px){.project-container{padding:40px 50px}.site-name-title{font-size:27px}li{font-size:19px}.title-clicked{font-size:21px}}@media(max-width:1100px){.project-container{padding:40px 45px}}@media(max-width:1024px){.project-container{padding:40px}.site-name-title{font-size:20px}li{font-size:17px}.title-clicked{font-size:18px}}@media(max-width:800px){.project-container{padding:40px 20px}.menu{padding:30px;border-right:3px solid black}.site-name-title{font-size:15.5px}li{font-size:14px}.title-clicked{font-size:15px}}@media(min-width:616px){.menu-toggle{display:none!important}}@media(max-width:615px){.menu-toggle{display:block;position:fixed;bottom:27px;right:39px;color:#000;font-size:42px;z-index:999;font-weight:700}.menu{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#f5f5f5;z-index:800;padding:40px 30px}.menu.closed{display:none}.project-container{position:relative;margin-left:0;width:100%;height:100vh;padding:20px 30px}.site-name-title{font-size:21.5px;position:fixed;bottom:40px;left:30px}li,.title-clicked{font-size:20px}}.video-wrapper-vocabinet{width:100.5%;overflow:hidden;position:relative;background-color:#000;font-size:0;line-height:0;padding:4px 4px 5.5px}.video-wrapper-vocabinet video{width:100%;height:auto;display:block;margin-bottom:-2px}.video-wrapper-my-groceries{width:100%;overflow:hidden;position:relative;background-color:#000;font-size:0;line-height:0;padding:4px 4px 4.5px}.video-wrapper-my-groceries video{width:100%;height:auto;display:block}@media(max-width:1024px){.video-wrapper-vocabinet{padding:3px 3px 4.75px}.video-wrapper-my-groceries{padding:3px 3px 3.8px}}.loading-screen{position:absolute;top:0;left:0;width:100%;height:100%;z-index:990;display:flex;justify-content:center;align-items:center;font-size:24px;font-family:Inter,sans-serif;background-color:#fff}.project-content.hidden{max-height:0;overflow:hidden;opacity:0}.project-content.visible{max-height:5000px;opacity:1;transition:max-height .3s ease,opacity .3s ease}.project-title{font-size:58px;font-family:Inter,sans-serif;font-weight:700;text-align:right;margin-bottom:100px}.project-intro-tag{display:block;font-size:20px;font-family:Inter,sans-serif;font-weight:600;text-align:left;margin-bottom:5px}.project-intro-subtitle{display:block;font-size:17px;font-family:Inter,sans-serif;font-weight:500;text-align:left;margin-bottom:7px}.project-intro-text{display:block;font-size:16px;font-family:Inter,sans-serif;font-weight:300;text-align:left;margin-bottom:25px;max-width:95%}.project-technologies{display:block;font-size:20px;font-family:Inter,sans-serif;font-weight:600;text-align:left;margin-bottom:30px}.spacer{height:35px}.video-caption{display:block;font-size:15px;font-family:Inter,sans-serif;font-weight:300;text-align:left;margin-top:15px;margin-bottom:50px;margin-left:10px}.video-instruction{display:block;font-size:13px;font-family:Inter,sans-serif;font-weight:300;text-align:left;margin-bottom:15px}.project-subtitle{font-family:Inter,sans-serif;font-weight:700;text-align:left;margin:80px 0 40px}.project-screenshot-mobile{display:block;width:320px;margin:50px 0;border:solid black 5px}@media(max-width:1340px){.project-title{font-size:47px;margin-bottom:80px}.project-intro-tag,.project-technologies{font-size:19px}}@media(max-width:1024px){.project-title{font-size:44px;margin-bottom:64px}.project-intro-tag,.project-technologies{font-size:18px}.project-intro-text{font-size:15px}.video-caption{font-size:13px;margin-left:0}.project-screenshot-mobile{width:300px}.project-subtitle{margin:60px 0 34px}.project-screenshot-mobile{border:solid black 3.75px}}@media(max-width:800px){.project-title{font-size:33px;margin-bottom:45px}.project-intro-tag{font-size:17px}.project-technologies,.project-intro-subtitle{font-size:16px}.project-intro-text{font-size:14px}.video-caption{font-size:11.5px;margin-left:0;margin-bottom:43px}.project-screenshot-mobile{width:250px;margin:43px 0}.project-subtitle{margin:52px 0 30px}}@media(max-width:615px){.project-title{font-size:45px;margin-bottom:30px;text-align:left;margin-top:15px}.project-screenshot-mobile{width:100%}}