@import"https://fonts.google.com/specimen/Roboto";html,body{margin:0;padding:0;width:100%;overflow-x:hidden;scrollbar-width:none;-ms-overflow-style:none}html{scroll-behavior:smooth}body::-webkit-scrollbar{display:none}*{box-sizing:border-box}h1{font-family:Cal Sans,sans-serif;font-weight:600;text-align:center;font-size:80px;color:#fff}h2{font-family:Roboto,sans-serif;text-align:center;font-size:25px;font-weight:500;color:#fff}h3{font-family:Noto Sans,sans-serif;text-align:center;font-size:25px;color:#fff}h4,span{font-family:Roboto,sans-serif;text-align:center;font-size:20px;font-weight:200;color:#fff}.navbar{position:fixed;top:0;left:0;width:100%;background-color:transparent;padding:20px 10%;display:flex;justify-content:center;transition:background-color .3s ease;z-index:1000}.navbar.scrolled{background-color:#000}@media (max-width: 600px){.navbar{padding:10px 4%}.navbar nav{display:grid;grid-template-columns:repeat(3,1fr);justify-items:center;gap:16px 0;width:100%}.navbar nav a{font-size:16px;margin:0}}.home-container{background-image:url(/personal-website/assets/Toronto-Skyline-ZJ_5LjKG.jpeg);background-size:cover;background-position:center;display:flex;flex-direction:column;justify-content:center;align-items:center;height:100vh;width:100vw;text-align:center}.navbar{position:fixed;top:0;left:0;width:100%;background-color:transparent;padding:20px 10%}.navbar a{text-decoration:none;text-align:center;color:#fff;font-size:18px;font-weight:500;margin-right:60px;font-family:Roboto,sans-serif}.navbar a:last-child{margin-right:0}.home-container h1{font-family:Cal Sans,sans-serif;font-weight:400;font-style:normal;text-align:center;font-size:80px;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.5)}.home-container h3{font-family:Noto Sans,sans-serif;text-align:center;font-size:25px;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.5)}.home-container h1.name,.home-container h3.tagline{line-height:0}.icons{display:flex;gap:20px;margin-top:20px;justify-content:center;align-items:center}.icons img{height:35px;cursor:pointer;transition:transform .2s ease}.icons img:hover{transform:scale(1.1)}@media (max-width: 600px){.home-container h1{font-size:45px}.home-container h3{font-size:16px}}@media (max-width: 600px){.home-container h3.tagline{line-height:1.1;margin:0 20px}}.about-container{min-height:120vh;width:100vw;background-color:#191919;padding-top:10px}.about-container h2.title{color:#f93;line-height:20px;margin-top:30px}.about-container h3.description{font-size:40px;line-height:0;margin-bottom:100px}.about-me{display:flex;gap:50px;justify-content:center;align-items:center;margin:0 300px}.about-me h4{line-height:1.5}.headshot img{width:200px;height:200px;border-radius:50%;border:2px solid rgb(255,153,51);object-fit:cover;object-position:top center;margin-bottom:30px}.skills-and-interests{display:flex;justify-content:center;gap:40px;padding:40px 60px;flex-wrap:wrap}.card{background-color:#1e1e1e;padding:25px 30px;border-radius:12px;border:1px solid rgb(255,153,51);box-shadow:0 4px 12px #00000040;min-width:300px;max-width:400px;display:flex;flex-direction:column}.card h3{color:#f93;text-align:center;margin-bottom:20px}.card-list{display:grid;grid-template-columns:repeat(2,1fr);gap:10px 20px}.card-list h4{margin:0;background-color:#2b2b2b;padding:10px;border-radius:6px;color:#fff;font-weight:400;text-align:center;transition:background-color .2s ease}.skill-list{line-height:120%}@media (max-width: 600px){.about-container h2.title{font-size:20px}.about-container h3.description{font-size:25px}.about-me{display:grid;justify-items:center;margin:0 50px}.headshot img{margin-bottom:0}.card-list{grid-template-columns:1fr}}.portfolio-container h2.title{color:#f93;line-height:20px;margin-top:40px}.portfolio-container h3.description{font-size:40px;line-height:0;margin-bottom:75px;color:#1e1e1e}.entry-content{display:flex;justify-content:flex-start;align-self:stretch;margin:0 100px;gap:50px}.title-and-date,.border,.company-and-description{flex-shrink:0}.title-and-date{width:300px}.company-and-description,.education-and-description{flex:1;text-align:left;line-height:1.5}.border,.education-border{position:relative;width:10px;border-left:3px solid gray}.dot{position:absolute;top:33px;left:-11px;width:20px;height:20px;background-color:#f93;border-radius:50%}.company-link{text-decoration:none}.company-link .company-name{color:#000;text-align:left;transition:color .2s ease,font-size .2s ease}.company-link:hover .company-name{color:#f93;font-size:27px}.education{font-size:40px;line-height:0;margin-top:75px;margin-bottom:75px;color:#1e1e1e}@media (max-width: 600px){.portfolio-container h2.title{font-size:20px}.portfolio-container h3.description{font-size:25px;margin-bottom:30px}.entry-content{position:relative;display:flex;flex-direction:column;gap:20px;margin:0 20px}.entry-content h3{font-size:20px}.entry-content h4{font-size:16px}.title-and-date{margin-left:50px}.title-and-date h3,.title-and-date h4{text-align:left}.company-and-description,.education-and-description{margin-left:50px}.border,.education-border{position:absolute;left:20px;top:0;bottom:0;width:10px;border-left:3px solid gray}.dot{position:absolute;top:10px;left:-11px;width:20px;height:20px;background:#f93;border-radius:50%;margin-top:15px}.education{margin-top:75px;margin-bottom:30px;font-size:25px}}.activities-container{min-height:240vh;width:100vw;background-color:#505050;padding-top:10px}.activities{display:flex;gap:150px;justify-content:center;align-items:center;margin:0 200px}.activities-container h2.title{color:#f93;line-height:20px;margin-top:30px}.activities-container h3.description{font-size:40px;margin-bottom:100px;line-height:0}.activities img{height:300px;width:300px;background-color:#fff;border-radius:50%;object-fit:contain;transition:transform .2s ease}.activities img:hover{transform:translateY(-5px)}.description a{text-decoration:none}.description a h3{transition:color .2s ease,font-size .2s ease}.description h4{line-height:1.5}.description a h3:hover{color:#f93;font-size:27px}@media (max-width: 600px){.activities-container h2.title{font-size:20px}.activities-container h3.description{font-size:25px;margin-bottom:75px}.activities{display:flex;flex-direction:column;align-items:center;margin:0 50px;padding-bottom:0}.activities>a{order:-1}.activities img{height:200px;width:200px;margin-bottom:-110px}.description{margin-bottom:50px}}.projects-container{min-height:120vh;width:100vw;background-color:#fff;padding-top:10px;margin-bottom:100px}.projects{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:40px;justify-content:center;max-width:1100px;margin:0 auto}.projects-container h2.title{color:#f93;line-height:20px;margin-top:30px}.projects-container h3.description{color:#000;font-size:40px;line-height:0;margin-bottom:100px}.projects img{width:100%;height:200px;object-fit:cover;border-radius:8px;background-color:#fff;transition:transform .2s ease,filter .2s ease}.projects img:hover{transform:translateY(-2px);filter:brightness(50%)}.projects h3{color:#000;font-size:20px;margin:4px 0 0}.projects h4{color:#000}.tiles{padding:15px 20px;border-radius:12px;box-shadow:0 4px 12px #00000040;min-width:300px;max-width:400px;display:flex;flex-direction:column;gap:10px;height:100%}.tile-description{font-size:14px;line-height:1.5;margin:4px 0 0}.tiles h4{font-size:16px}.tile-list{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;max-width:280px;margin-top:10px}.tile-list h4{margin:0;background-color:#f93;padding:7px;border-radius:6px;color:#fff;font-size:14px;font-weight:400;text-align:center;transition:background-color .2s ease}.image-wrapper{position:relative;display:block}.learn-more{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);color:#fff;font-size:20px;font-weight:700;opacity:0;pointer-events:none;transition:opacity .3s ease}.image-wrapper:hover img{filter:brightness(40%);transform:translateY(-2px)}.image-wrapper:hover .learn-more{opacity:1}@media (max-width: 600px){.projects{margin:20px}.projects-container h2.title{font-size:20px}.projects-container h3.description{font-size:25px;margin-bottom:50px}}.contact-container{min-height:70vh;width:100vw;background-color:#191919;padding-top:10px}.contacts{display:flex;gap:150px;justify-content:center;max-width:1100px;margin:0 auto}.contact-container h2.title{color:#f93;line-height:20px;margin-top:30px}.contact-container h3.description{color:#fff;font-size:40px;line-height:0;margin-bottom:120px}.layout{display:flex;flex-direction:column;align-items:center;text-align:center}.layout h3{font-size:20px;color:#f93}.layout h4{font-size:16px}img{height:30px;transition:transform .2s ease}img:hover{transform:scale(1.1)}a{text-decoration:none}.layout a h4{transition:color .2s ease,font-size .2s ease}.layout a h4:hover{color:#f93;font-size:17px}@media (max-width: 600px){.contact-container{min-height:auto;padding-bottom:50px}.contact-container h2.title{font-size:20px}.contact-container h3.description{font-size:25px;margin-bottom:75px}.contacts{display:flex;flex-direction:column;justify-items:center}}