:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;color:#010101;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}html{height:100%;font-size:clamp(4px,1.2vw,32px)}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}body{margin:0;min-width:100%;min-height:100vh;text-align:center;position:fixed;overflow:hidden}#root{width:calc(100% - 2vw);height:calc(100vh - 2vw);margin:0;border:#435c5f solid 1vw;position:fixed;z-index:0;overflow:hidden}#contentDiv{width:100%;height:100vh;margin:0;padding:0;background-color:#dedede;text-align:center;position:relative;z-index:0;-ms-overflow-style:none;scrollbar-width:none;overflow-y:auto;overflow-x:hidden}#contentDiv::-webkit-scrollbar{display:none}#contentDiv.expanded{overflow-y:hidden}#contentDiv:not(.expanded){overflow-y:auto}h1{font-size:3.2em;line-height:1.1}button{border-radius:8px;border:1px solid transparent;padding:.6em 1.2em;font-size:1em;font-weight:500;font-family:inherit;background-color:#1a1a1a;cursor:pointer;transition:border-color .25s}button:hover{border-color:#646cff}button:focus,button:focus-visible{outline:4px auto -webkit-focus-ring-color}@media (prefers-color-scheme: light){:root{color:#213547;background-color:#fff}a:hover{color:#747bff}button{background-color:#f9f9f9}}#h1{font-size:3rem;font-weight:300}#h2{font-size:1.5rem;line-height:1.1;font-weight:400}#home{position:relative;color:#fcecc9;height:75%;padding-top:60px;background-color:#181818}#home h1{font-size:4rem;margin:0}#home h2{color:#b0d9c8;font-size:1.5em;margin:0}#home button{width:150px;height:40px;background-color:#435c5f;color:#fff;border:none;border-radius:5px;margin:5px;cursor:pointer;font-size:16px}#home button:hover{background-color:#b0d9c8}#home #buttons{display:flex;justify-content:center;align-items:center;height:200px}#home #content{position:relative;height:100%;display:flex;justify-content:space-evenly;align-items:center}#home #hello{display:flex;text-align:left;flex-direction:column}#home #intro{font-size:1.5em;width:30%}#about{color:#000;background-color:#fcecc9;height:75%;padding:0;position:relative;overflow:hidden}#profile{padding:0;margin:0;height:20%;display:flex;justify-content:center;align-items:center}#about-content{height:70%;display:flex;justify-content:space-evenly;align-items:flex-start;width:100%;font-size:.9em;overflow:scroll;scrollbar-width:none}#descrip{width:30%;display:inline;height:100%}#about-content p{font-size:1em;height:80%}#details{width:30%}#detailDiv{display:flex;flex-direction:column;gap:.6rem}.detail{display:grid;grid-template-columns:auto 1fr;column-gap:.6rem;align-items:start}.detail-value{text-align:left}.headshot-container{display:flex;justify-content:center;align-items:center;align-self:center;height:30%}.headshot-container img{height:150%;width:auto;border-radius:50%}#about h1,h2{color:#435c5f}#about h1{font-weight:300}#about h2{line-height:1.1;font-weight:400}#about .line{width:75%}#detailDiv{display:flex;flex-direction:column;justify-content:center;align-items:start}:root{--start-x: 0;--start-y: 0;--scale-x: 0;--scale-y: 0}.card-whole,.card-placeholder{display:flex;flex-direction:column}.card{margin:0;padding:0;background-color:transparent;border:1px solid #b0d9c8;border-radius:5px;box-shadow:0 2px 4px #0000001a;display:flex;justify-content:center;align-items:center;height:100%;width:100%;perspective:1000px}.card a{text-decoration:none;color:#435c5f;font-weight:700;display:flex;flex-direction:column;justify-content:center;align-items:center}.card-content{display:flex;justify-content:center;align-items:center;position:relative;width:100%;height:100%;border-radius:5px;padding:0;text-align:center;transition:transform .8s linear;transform-style:preserve-3d}.card.expanded{overflow:visible;border:none}.card.expanded .card-content{transform:translate(var(--start-x),var(--start-y)) rotateY(180deg) scale(var(--scale-x),var(--scale-y));transform-origin:middle;position:fixed}.card{transition:transform .25s ease,box-shadow .25s ease}#cardtitle{transition:transform .25s ease}.card-whole:hover .card{position:relative;transform:scale(1.05) translateY(-5px);box-shadow:0 12px 30px #00000059}.card-whole:hover #cardtitle{transform:scale(1.2)}#cardtitle{overflow:hidden;white-space:nowrap;margin:0 auto;padding-bottom:5%;text-align:center}#cardtitle .cardtitle-text{display:inline-block}.card-whole:hover .scrollable{animation:scroll-title 3s linear infinite}.cardtitle-text{font-size:.8rem}@keyframes scroll-title{0%{transform:translate(0)}50%{transform:translate(-100%);opacity:1}51%{transform:translate(-100%);opacity:0}52%{transform:translate(100%);opacity:0}53%{transform:translate(100%);opacity:1}to{transform:translate(0) translateY(0)}}.card img{width:100%;height:100%;margin-bottom:10px;border-radius:5px}.card-front,.card-back{position:absolute;width:100%;height:100%;-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:5px}.card-front{background-color:#fcecc9;color:#000}.card-back{background-color:#fcecc9;color:#000;transform:rotateY(180deg);display:flex;flex-direction:column;justify-content:flex-start;align-items:center;overflow:hidden}#titleHeader{width:75%;height:10%;display:flex;justify-content:center;white-space:nowrap;margin:.1rem .1rem .3rem;padding:0}.card-back h1{font-size:clamp(.25rem,2vw,.5rem);color:#435c5f}.card-back p{font-size:.25rem;margin:0;padding:0;text-align:left;white-space:pre-wrap;-moz-tab-size:6;tab-size:6;width:100%}.card-back #detailsDiv{width:100%;height:80%;display:flex;justify-content:flex-start;font-size:1rem}.vertical-bar{flex:0 0 .25rem;height:100%;background-color:#435c5f;margin:0 1rem}.card-back #projectContent{display:flex;flex-direction:column;flex:0 0 auto;width:calc(100% - 4.25rem);align-items:flex-start;justify-content:space-evenly;grid-template-rows:repeat(10,1fr);grid-template-columns:calc(100% - 2rem);grid-gap:1px;height:100%}.card-back h2{font:italic small-caps 700 .4rem Times New Roman,serif;color:#333;align-self:flex-start;padding:0;margin:0}.card-back #descriptionDiv{grid-row:2 / 7;display:flex;flex-direction:column;overflow:scroll;scrollbar-width:none}#descriptionDiv::-webkit-scrollbar{display:none}.card-back #techContent{grid-row:8 / 10;display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%}.card-back #techs{display:flex;align-items:center;justify-content:space-evenly;width:100%;font-size:.25rem}.card-back #links{grid-row:10;padding:none;margin:0;display:flex;justify-content:space-evenly;font-size:1rem;align-self:center;flex:0 0 auto;width:100%}.card-back a{width:75%;font-size:.3rem;margin:0;padding:0;color:#333}.card-back #techs img{width:.6rem;height:auto;border-radius:0;padding:none;margin:0}.card-back #projectLine{border:none;height:1px;background-color:#435c5f;margin:0;padding:0;width:30%}.card-back span{padding:5%}#portfolio{background-color:#181818;color:#fcecc9;padding:0;margin:0;text-align:center;height:75%;position:relative}#portfolio #portfolioHead{padding:0;margin:0;height:20%;font-size:3em;font-weight:300;display:flex;justify-content:center;align-items:center}#portfolio .line{width:75%}.background-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;background-color:#0009;z-index:50;display:none}.page-controls{display:flex;align-items:center;justify-content:center;width:100%;height:70%;margin:1rem auto;position:relative}.cards{display:grid;grid-auto-flow:column;width:100%;grid-auto-columns:calc((100% - 4rem - 2px - 2rem) / 3);grid-template-rows:repeat(2,1fr);gap:2rem;height:calc(100% - 2rem);transition:left 1s ease;position:relative;margin:.5rem 1rem 1.5rem}.viewport{width:65%;height:100%;position:relative}.mask-left,.mask-right{background-color:#181818;z-index:4;position:relative;height:100%;flex:1}.page-changer{z-index:4;width:5%;height:100%;position:relative;background-color:#181818}.arrow,.arrow-placeholder{border:none;border-radius:0%;outline:none;position:relative;box-shadow:none;cursor:pointer}.arrow:focus{outline:none}.arrow:before{content:"";position:absolute;top:50%;left:50%;width:12px;height:12px;border-right:2px solid #fcecc9;border-bottom:2px solid #fcecc9;transform-origin:center}.arrow.left:before{transform:translate(-50%,-50%) rotate(135deg)}.arrow.right:before{transform:translate(-50%,-50%) rotate(-45deg)}#contact{color:#000;background-color:#fcecc9;height:75%;padding:0;position:relative;overflow:hidden}#contact .line{width:75%}.logo{height:6em;padding:1.5em;will-change:filter;transition:filter .3s}.logo:hover{filter:drop-shadow(0 0 2em #646cffaa)}.logo.react:hover{filter:drop-shadow(0 0 2em #61dafbaa)}@keyframes logo-spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (prefers-reduced-motion: no-preference){a:nth-of-type(2) .logo{animation:logo-spin infinite 20s linear}}.read-the-docs{color:#888}#navbar{background:#181818;width:calc(100% - 2vw);height:60px;position:fixed;z-index:50}#navbar .logo{display:block;padding:8px 0}#navbar .logo img{display:block;margin:8px auto;width:24px;height:auto}#navbar .logo img.sub-logo{width:50px}#navbar nav{display:flex;justify-content:center;text-align:center;position:absolute;top:10%;right:1%}#navbar nav a{font-size:1.2em;color:#4d4d4e;display:block;line-height:51px;height:51px;position:relative;text-decoration:none;padding:0 20px}#navbar nav a i{transition:all .3s ease-out}#navbar nav a:hover{color:#b0d9c8}#navbar nav a:hover svg{opacity:0}#navbar nav a:hover:after{opacity:1;bottom:0;left:50%;transform:translate(-50%)}#navbar nav a:after{content:"";font-size:9px;letter-spacing:2px;position:absolute;bottom:0;display:block;width:100%;text-align:center;opacity:0;-webkit-transition:all .3s ease-out;transition:all .3s ease-out}#navbar nav a:first-child:after{content:"HOME"}#navbar nav a.about-link:after{content:"ABOUT"}#navbar nav a.contact-link:after{content:"MISC"}#navbar nav a.portfolio-link:after{content:"PROJECTS"}#navbar ul{position:absolute;left:20px;top:35%;display:flex;padding:0;list-style:none;text-align:center;margin:0}#navbar ul li a{display:block;font-size:1.5em;line-height:16px;padding:0 20px;color:#4d4d4e}#navbar ul li:hover .anchor-icon{color:#335477}.hamburger-icon,.close-icon{display:none}@media screen and (max-width: 1200px){#navbar{background:transparent;position:initial;height:auto;min-height:auto}#navbar ul,#navbar nav{display:none}#navbar nav{width:100%;top:0;left:0;background:#181818;height:100%;margin:0;z-index:2;position:fixed}#navbar nav.mobile-show{display:block}#navbar nav a{display:flex;justify-content:center;align-items:center}#navbar nav a:after{opacity:1;position:initial;width:auto;margin-left:10px}#navbar nav a svg{opacity:1!important}#navbar .hamburger-icon,#navbar .close-icon{position:absolute;top:15px;right:15px;display:block}}#misc{color:#000;background-color:#fcecc9;padding:0 0 60px;position:relative;overflow:hidden}#misc-content{height:70%;display:flex;justify-content:space-evenly;align-items:flex-start;width:100%;font-size:1em}#misc-content p{font-size:clamp(.5rem,1vw + .25rem,1.5rem);height:80%}#misc h1,h2{color:#435c5f;font-weight:400}#misc h1{font-size:3rem;font-weight:300}#misc h2{font-size:1.5rem;line-height:1.1;font-weight:400;margin-bottom:.5rem}#misc h3{font-size:1.2rem;font-weight:600;margin-bottom:.5rem}#misc .line{width:75%}.miscGrid{display:flex;justify-content:center;gap:20px;text-align:center;width:100%;height:100%}.miscGridItem{color:#fff;border:1px solid #435c5f;border-radius:5px;background-color:#181818;height:50%;margin:30px;width:30%}#misc .vertical-bar{grid-row:1 / span 5;grid-column:1;width:6px;height:100%;background-color:#435c5f;margin:0 10px;align-self:center;justify-self:center}#misc ul{list-style-position:inside;text-align:left;padding-left:1rem}#misc #miscContent{display:flex;justify-content:space-evenly;align-items:flex-start;flex-direction:column;margin:3rem}#misc #GUsite{display:flex;flex-direction:column}.miscSection{display:flex;flex-direction:column;align-items:flex-start;margin-bottom:2rem;width:100%}#misc .miscSection .line{width:50%;margin:0 0 1rem}#misc p{text-align:left}#courseLists{display:grid;grid-template-columns:repeat(3,1fr);width:100%}
