:root{font-family:Inter,system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color:#000;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root{--accent1: #8E8D8A;--accent2: #C7A27C;--bg1: #F0F0F0;--bg2: #E0E0E0;--bg3: #FFFFFF;--bg3-light: #F5F5F5;--main: #333333}.theme-simple-light{--accent1: #8E8D8A;--accent2: #C7A27C;--bg1: #F0F0F0;--bg2: #E0E0E0;--bg3: #FFFFFF;--bg3-light: #F5F5F5;--main: #333333}.theme-simple-dark{--accent1: #C0BEBB;--accent2: #D3A27C;--bg1: #1E1E1E;--bg2: #2C2C2C;--bg3: #3B3B3B;--bg3-light: #4A4A4A;--main: #EDEDED}.theme-teal{--accent1: #008891;--accent2: #F0A500;--bg1: #012E40;--bg2: #013A63;--bg3: #046E8F;--bg3-light: #058CAA;--main: #E8F1F2}.theme-blue{--accent1: #98A5CC;--accent2: #FFD700;--bg1: #1A1A2E;--bg2: #2E3A59;--bg3: #44577C;--bg3-light: #566D8F;--main: #F5F5F5}.theme-purple{--accent1: #A288C2;--accent2: #FFCC80;--bg1: #201C2B;--bg2: #2E2740;--bg3: #413657;--bg3-light: #54496D;--main: #EDE7F6}.theme-brown{--accent1: #8C7A5E;--accent2: #D9B44A;--bg1: #1C1B18;--bg2: #2F2B26;--bg3: #463D38;--bg3-light: #5A514B;--main: #F4EDE4}.theme-grey-modern{--accent1: #FF6B6B;--accent2: #4ECDC4;--bg1: #222831;--bg2: #393E46;--bg3: #444B54;--bg3-light: #555D68;--main: #FFFFFF}.theme-dark-modern{--accent1: #6f99cf;--accent2: #98C1D9;--bg1: #121212;--bg2: #1F1F1F;--bg3: #2E2E2E;--bg3-light: #404040;--main: #F4F4F4}hr{border:0;height:2px;background:var(--main)}a{display:block;font-weight:500;text-decoration:inherit}body{margin:0;min-width:320px;min-height:100vh;overflow-x:hidden;background:linear-gradient(180deg,var(--bg1),var(--bg2),var(--bg1))}h1{font-size:3.2em;line-height:1.1;text-align:center;color:var(--accent1)}button{border-radius:8px;border:1px solid transparent;padding:.6em 1em;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}.section-correction{padding-top:1em}.header{height:fit-content;min-height:fit-content;background-color:var(--bg2);color:var(--main);display:flex;align-items:center}.header-name{margin-left:3rem;width:50%;padding:1rem;text-align:left;color:var(--main)}.header-nav{width:50%;display:flex;justify-content:space-evenly;align-items:center;margin-right:1rem}.nav-link{padding:.5rem 1rem;border-radius:5px;font-size:larger;text-align:center;transition:transform .3s ease}.nav-link:hover{background-color:var(--bg1);transform:scale(1.05)}.intro-container{width:100%;height:fit-content;display:flex;justify-content:center;align-items:center;padding-top:5vh;padding-bottom:5vh}.intro-photo-container{height:50vh;border-radius:50%;padding:2px;background:var(--bg3);overflow:hidden;margin-right:1rem;margin-left:1rem}.profile-picture{width:100%;height:100%;border-radius:50%;object-fit:cover}.intro-text{width:50%;padding:0 2rem;color:var(--main)}.intro-text h1{text-align:left}.project-section{height:fit-content}.project-grid{height:100%;width:100%;display:flex;justify-content:space-around;flex-wrap:wrap;align-items:center}.project-card{width:26em;padding:1em;border-radius:.5em;box-shadow:0 .5em 1em #0000001a;background-color:var(--bg3);display:flex;flex-direction:column;align-items:center;margin:1em .5em 3em;height:61vh}.project-title{font-size:1.5em;margin-bottom:.5em;font-weight:700;color:var(--main)}.project-body{font-size:1.1em;margin:.5em 0;color:var(--main)}.project-link{font-size:.875em;color:var(--main);text-decoration:none;margin-top:1em}.project-link:hover{text-decoration:underline;color:var(--accent2)}.project-image-container{width:100%;padding-top:56.25%;position:relative;margin-bottom:1em;border-radius:.5em;border:3px solid var(--bg3);overflow:hidden}.project-image{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.extra-section{height:fit-content}.extra-grid{height:100%;width:100%;display:flex;justify-content:space-evenly;flex-wrap:wrap;align-items:center}.extra-card-img{width:59em;padding:1em;border-radius:.5em;box-shadow:0 .5em 1em #0000001a;background-color:var(--bg3-light);color:var(--main);display:flex;align-items:flex-start;margin:1em;height:fit-content}.extra-image-container{position:relative;padding-top:44.4%;margin-right:2.5em;transition:transform .3s ease,box-shadow .3s ease;border:5px solid;border-radius:.5em;flex-grow:1;cursor:pointer}.extra-image-container:hover{transform:scale(1.02)}.extra-image{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.extra-content-img{width:50%}.extra-card{width:20em;padding:1em;border-radius:.5em;box-shadow:0 .5em 1em #0000001a;background-color:var(--bg3);color:var(--main);display:flex;flex-direction:column;align-items:center;margin:1em .5em 3em;height:32vh}.extra-title,.extra-title-img{font-size:1.5em;margin-bottom:.5em;font-weight:700;color:var(--main)}.extra-title.link:hover,.extra-title-img:hover{color:var(--accent2);text-decoration:underline}.extra-title-img{font-size:2em;margin-top:0}.extra-body{font-size:1.1em;margin-bottom:1em}.skills-section{height:fit-content;padding:1em;display:flex;flex-direction:column;align-items:center}.skills-section h2{color:var(--main);margin-bottom:.2em}.skills-grid{display:flex;flex-direction:column;width:98%}.skill-filter-grid h2{margin-top:0}.skill-cards-line{display:flex;flex-wrap:wrap}.skill-block{width:12%;min-width:125px;height:7vh;min-height:fit-content;background-color:var(--bg3);color:var(--main);padding:1em;border-radius:10px;margin:1em;display:flex;flex-direction:column;justify-content:center;align-items:center}.skill-name{font-weight:700}.skill-clarification{overflow:hidden;transition:max-height .2s ease-in;text-align:center}.skill-clarification.visible{max-height:11vh;overflow:hidden}.skill-clarification.hidden{max-height:0}.skill-filter-grid{display:flex}.skill-filter-grid .skill-cards-line{justify-content:space-evenly;flex-wrap:nowrap;gap:1em}.skill-block.filter{text-align:center;height:15vh;background-color:var(--bg3-light);width:20%;min-width:125px;color:var(--main);flex:1 1 auto;border:5px solid transparent}.skill-block.filter.active{border-color:var(--accent1)}.filter-instructions{color:var(--main);text-align:center;font-size:1em;margin-top:-1em;font-weight:700}@media (max-width: 1200px){.skill-block.filter{width:18%;height:24vh}}@media (max-width: 900px){.skill-cards-line,.skill-filter-grid{justify-content:flex-start;flex-wrap:wrap;gap:1em}.skill-block.filter{width:200px;height:150px}}@media (max-width: 450px){.skill-block.filter h2{font-size:1em}.skill-block.filter{height:100px}}@keyframes expand{0%{max-height:0}to{max-height:10vh}}@keyframes collapse{0%{max-height:0vh}to{max-height:10}}.contact-section{height:fit-content;background-color:var(--bg2);color:var(--main);margin-top:5em}.footer-grid-practice{display:grid;grid-template-columns:4fr 1fr 1fr;align-items:center}.contact-call{font-size:2rem;margin-left:2em}.contact-column{display:grid;gap:1em;justify-content:center;align-items:center;margin-top:6vh;margin-bottom:6vh}.contact-column a{color:var(--main);font-size:large;transition:transform .3s ease}.contact-column a:hover{text-decoration:underline;transform:scale(1.05);color:var(--accent2)}.email-wrapper{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden;transition:height .3s ease;height:0}.email-wrapper.visible{height:50vh}.contact-form-box{display:flex;flex-direction:column;justify-content:center;width:50%;margin-bottom:5em}.contact-form-label{margin-top:1em;font-size:larger}.contact-form-email{height:2em;width:40%;border-radius:.5em;border:2px solid transparent}.contact-form-message{height:10em;border-radius:.25em;border:2px solid transparent}.contact-form-bottom{display:flex;align-items:center;margin-top:2em}.contact-form-button{width:20%;margin-right:3em;background-color:var(--main);color:var(--bg3)}.contact-form-button.disabled{background-color:var(--accent1);color:var(--main)}.contact-form-warning{font-size:larger}.warning-box{border:2px solid red;transition:border .2s ease}.warning-text{color:red;transition:color .2s ease}.color-switch{position:absolute;right:10px;background:var(--bg3);padding:8px 16px;border-radius:8px;box-shadow:0 4px 6px #0000001a;transition:width .3s ease;display:flex;align-items:center;max-width:fit-content;overflow:hidden;white-space:nowrap}.color-switch.expanded{width:340px}.color-switch.collapsed{width:44px}.color-switch label{font-size:14px;color:var(--main);margin-right:10px;margin-left:10px}.color-switch-select{background:var(--bg3);color:var(--main);border:1px solid var(--main, #555);border-radius:5px;padding:6px 12px;font-size:14px;cursor:pointer;width:160px;transition:background .3s,box-shadow .2s}.color-switch-select:hover,.color-switch-select:focus{outline:none}.show-colorSwitch-button{background-color:var(--main);color:var(--bg3);transition:transform .2s ease-in-out}.show-colorSwitch-button:hover{transform:scale(1.05)}.show-colorSwitch-button:focus{outline-color:var(--accent1)}.color-switch-controls{opacity:1;visibility:visible;transition:opacity .3s ease,visibility .3s ease}.color-switch-controls.collapsed{opacity:0;visibility:hidden}@media (max-width: 1050px){.header{flex-direction:column;justify-content:center}.header-name{margin:0;width:100%;text-align:center;background-size:100% 100%}.header-nav{width:100%;margin-bottom:1em}.intro-text h1{display:none}.extra-card-img{align-items:center}.color-switch{padding:4px 16px}.color-switch-select{padding:3px 6px}.show-colorSwitch-button{padding:.3em 1em}}@media (max-width: 850px){.extra-card-img{flex-direction:column}.extra-image-container{width:90%;margin-right:0;margin-bottom:2em}.extra-content-img,.contact-form-box{width:90%}}@media (max-width: 650px){h1{font-size:2.7em}.header-nav{display:flex;flex-direction:column}.intro-container{margin-top:2em;flex-direction:column}.intro-text{text-align:center;width:90%}.project-card,.extra-card{height:fit-content}.skill-cards-line{justify-content:center}.footer-grid-practice{grid-template-columns:1fr 1fr;text-align:center}.contact-call{font-size:1.75rem;margin-left:0;grid-column:span 2}.contact-column{margin-top:0}.contact-form-email{width:75%}.contact-form-bottom{flex-direction:column;align-items:flex-start}.contact-form-button{margin:0;width:70%}.contact-form-warning{margin-top:1em}}
