:root{--tranTime: .5s;--background: #fffdf9;--text: #0C0F15;--accent: #e77f67;--tran-accent: #e15f41}body{margin:0;font-family:system-ui,-apple-system,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,Liberation Sans,sans-serif,"Apple Color Emoji","Segoe UI Emoji",Segoe UI Symbol,"Noto Color Emoji";-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.social-icons{display:flex;align-items:center;justify-content:space-evenly}.social-icons a img{width:35px;pointer-events:all;cursor:pointer;-webkit-filter:invert(100%);filter:invert(100%) drop-shadow(3px 3px rgb(200,200,200));transition:all .3s ease-in-out}.social-icons a img:hover{-webkit-filter:invert(0%);transform:scale(1.1);filter:invert(50%) drop-shadow(3px 3px rgb(200,200,200))}.navbar{position:fixed;width:75%;display:flex;flex-direction:row;justify-content:space-between;padding:1em 3em;z-index:1000;background-color:var(--background);border-radius:0 0 25px 25px;border-left:solid 5px transparent;border-bottom:solid 4px transparent;border-right:solid 5px transparent;transition:all .25s ease-in-out}.navbar.border{border-color:#000}.navbar div{width:25%}#pages{width:50%;display:flex;flex-direction:row;justify-content:space-around}@media(max-width:1024px){.navbar{padding:.125em 1.5em}#pages{width:75%}}@media(max-width:875px){#pages{display:none}}@media(max-width:600px){.navbar div{width:50%}}.section{scroll-margin-top:125px}.section-header{width:10%;min-width:125px;position:relative;text-align:center;border-radius:25px 25px 0 0;border-top:solid 5px black;border-left:solid 5px black;border-right:solid 5px black;background:var(--background);margin:0 0 0 2.5%;padding:.5em 1em;z-index:501}.section-header:after{content:"";background:var(--background);position:absolute;bottom:-5px;left:0;height:5px;width:100%}.section-body{height:fit-content;background:var(--background);position:relative;border-top:solid 5px black;padding:2em;z-index:500}.section-body.heading{border:none;padding:2em}.section-header h2{margin:0!important}#footer{width:75%;display:flex;flex-direction:row;justify-content:space-between;padding:1em 3em;border-radius:25px 25px 0 0;border-left:solid 5px black;border-top:solid 4px black;border-right:solid 5px black}#footer div{width:25%}@media(max-width:600px){#footer div{width:45%}}.homepage{min-height:90vh;display:flex;justify-content:center;align-items:center;padding:2rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.content{max-width:700px;text-align:center}.highlight{color:var(--tran-accent);transition:all .3s ease-in-out}.highlight:hover{font-size:110%;color:var(--accent);text-decoration:underline}.animated-title{font-size:1.5rem;margin:1rem 0 2rem;height:2rem}.description{font-size:1.1rem;color:var(--text);margin-bottom:2rem}.buttons a{display:inline-block;border-radius:5px;margin:.5rem;padding:.75rem 1.25rem;border:1px solid var(--accent);text-decoration:none;color:var(--text);transition:all .3s,border-color .3s}.buttons a:hover{background:var(--text);color:var(--background);border-color:var(--tran-accent)}.about-container{display:flex;flex-direction:row;gap:3rem;align-items:flex-start;max-width:1100px;margin:0 auto;padding:2rem}.about-text{flex:2}.about-text p{font-size:1.05rem;line-height:1.8;color:#333;margin-bottom:1.25rem}.about-divider{border:none;border-top:1px solid rgba(0,0,0,.15);margin:1.5rem 0}.about-tagline{font-size:.95rem!important;font-style:italic;color:#555!important;line-height:1.6!important}.about-highlights{flex:1;display:flex;flex-direction:column;gap:1.25rem}.highlight-card{background-color:#f8f8f8;border-left:3px solid #555;border-radius:4px;padding:1rem 1.25rem}.highlight-card h3{font-size:.85rem;text-transform:uppercase;letter-spacing:.08em;color:#777;margin:0 0 .6rem}.highlight-card ul{list-style:none;padding:0;margin:0}.highlight-card ul li{font-size:.95rem;color:#333;padding:.2rem 0;line-height:1.5}@media(max-width:768px){.about-container{flex-direction:column}}.skill-card{padding:1em 2em;height:125px;border-radius:10px;border:solid 2px var(--text);color:var(--text);display:flex;flex-direction:column;cursor:pointer;align-items:center;justify-content:space-between;background:var(--accent);text-decoration:none;filter:drop-shadow(5px 5px 0px var(--text));transition:all .25s ease-in-out}.skill-card:hover{transform:scale(1.125);background:var(--tran-accent);z-index:1}.skill-card img{height:90%}.skill-card h3{text-align:center;margin:0}.skill-card-image{display:flex;flex-direction:column;align-items:center;width:100%;height:75%}.skill-card-title{width:100%;height:25%}.skills{position:relative;display:flex;align-items:center;overflow:hidden}.skills-container{overflow:hidden;width:100%}.skills-content{display:flex;transition:transform .5s ease-in-out;width:100%}.skills-group{flex:0 0 100%;box-sizing:border-box;padding:1em 10em}.skills-grid{display:grid;justify-content:center;align-items:center;gap:2.5em;grid-template-columns:repeat(auto-fill,minmax(150px,1fr))}@media(max-width:992px){.skill-wrapper:not(.always-show):nth-child(n+6){display:none}}@media(max-width:768px){.skill-wrapper:not(.always-show):nth-child(n+4){display:none}}.project-card{padding:1em 2em;height:16em;border-radius:10px;border:solid 2px var(--text);color:var(--text);display:flex;flex-direction:column;align-items:center;cursor:pointer;background:#fff;text-decoration:none;filter:drop-shadow(5px 5px 0px var(--text));transition:all .25s ease-in-out}.project-card:hover{transform:scale(1.125);background:var(--accent);z-index:1}.project-card img{margin:.5em 0;width:7.5em}.project-card h2{width:100%;text-align:center;margin:.25em 0}@media(max-width:775px){.project-card{width:50%}.project-card:hover{transform:none}}.projects{position:relative;display:flex;align-items:center;overflow:hidden;width:100%}.projects-content{display:grid;justify-content:center;gap:1em;width:100%;grid-template-columns:repeat(auto-fill,minmax(550px,5%));padding:2em 0}@media(max-width:775px){.projects-content{display:flex;flex-direction:column;align-items:center}}.contact-container{max-width:700px;margin:4rem auto;padding:0 1rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif;color:var(--text);text-align:center}.contact-text,.contact-links,.contact-email{font-size:1.1rem;line-height:1.6;margin-bottom:1.5rem}.contact-container a{color:var(--accent);text-decoration:none;border-bottom:1px dashed var(--accent);transition:all .3s}.contact-container a:hover{color:var(--tran-accent);border-color:var(--tran-accent);border-bottom:1px solid var(--tran-accent);font-size:larger}.App{margin:0;max-width:100vw;min-height:100vh;overflow-x:hidden;background-color:var(--background);color:var(--text);display:flex;flex-direction:column;align-items:center}.App .animated-link{color:var(--accent);text-decoration:none;display:block;position:relative;cursor:pointer;padding:.2em 0;overflow:hidden;transition:all .25s}.App .animated-link:hover,.App .animated-link:focus{color:var(--tran-accent)}.App .animated-link:after{content:"";position:absolute;width:100%;height:2px;margin-top:.25em;opacity:0;background-color:var(--tran-accent);transform:translate3d(-100%,0,0);transition:opacity .1s,transform .25s}.App .animated-link:hover:after,.App .animated-link:focus:after{opacity:1;transform:translateZ(0)}.App .icon-button{opacity:1;pointer-events:all;transition:.25s ease-in-out;cursor:pointer}.App .icon-button.disabled{opacity:.3;pointer-events:none}.about-section,.projects-section{--background: #ffbe76}
