footer{background-color:#000000b3;display:flex;align-items:center;justify-content:center}footer .container{margin-inline:auto;padding:10px 0;display:flex;align-items:center}footer .container span{color:#fff;font-weight:500;padding-right:5px}footer img{filter:grayscale(100%) invert();-webkit-filter:grayscale(100%) invert();width:auto;height:35px}header{padding:.5rem 1rem;overflow:hidden;position:fixed;top:0;width:100%;box-sizing:border-box;left:50%;transform:translate(-50%);z-index:7;transition:color .5s,background-color .5s,filter .5s}header .container{display:flex;align-items:center;justify-content:space-between;max-width:70rem;margin-inline:auto}div.overlay{visibility:hidden;opacity:0;transition:all .5s}header .container span{font-weight:700;text-transform:uppercase;font-size:1.3rem}header .container span a{padding:5px}header.scrolled{color:#dedede;background-color:#242424}header img{width:24px}nav ul{list-style:none;margin:0;padding:0}header.scrolled img{filter:invert()}header a,nav a{text-decoration:none;color:inherit}header a:visited,nav a:visited{text-decoration:none;color:inherit}header nav.links{display:flex}header nav.links a{padding:5px}header a.lang-switch,a.lang-switch{font-weight:700;padding:5px}header a.active,nav a.active,nav a:hover,header a:hover{background-color:gray}header .menu-button,nav.menu{visibility:hidden;display:none}@media(max-width:500px){header nav.links{display:none;visibility:hidden}header div.menu-button{display:flex;visibility:visible}header div.menu-button img{align-self:center}nav.menu{opacity:0;display:grid;grid-auto-flow:column;justify-items:center;position:fixed;width:100%;top:5%;left:50%;transform:translate(-50%,-100%);transition:all .5s ease-in-out,opacity .5s .2s;background-color:#242424;padding:0;margin:0;z-index:6}nav.menu.active{opacity:1;transform:translate(-50%);visibility:visible;flex-flow:column nowrap}nav.menu.active+div.overlay{background-color:#000;opacity:.7;visibility:visible;position:fixed;height:100%;width:100vw;z-index:5;left:0}nav.menu li{color:#fff;list-style:none;padding:5px;text-align:center}}html,body{margin:0;width:100%;height:100%}main{padding:4rem 0;max-width:70rem;width:100%;margin-inline:auto}hr{width:100%}@media(max-width:500px){main{padding:3rem 0}}body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;align-content:center;transition:background-color .7s,color .7s;color:#2a2a2a}body.dark{background-color:#202020}body.dark *,body.dark p{color:#e3e3e3}body.dark section.about img.tech-icon,body.dark img[data-menu-toggle]{filter:invert()}*{scroll-behavior:smooth}p{margin:0;font-size:20px}a.anchor{display:block;position:relative;top:-100px;visibility:hidden}section{padding-bottom:20px}:root{--background: rgba(188, 188, 188, .4);--outline-text: 0 0 2px rgb(226, 226, 226), 0 0 2px rgb(226, 226, 226), 0 0 2px rgb(226, 226, 226), 0 0 2px rgb(226, 226, 226)}section.hero{position:relative}section.hero .name{animation:slideInFromLeft .7s ease-out;position:relative;z-index:1;background-color:var(--background)}section.hero .prof{position:relative;z-index:1;background-color:var(--background);animation:slideInFromRight 1s ease-out}section.hero h1,section.hero h2{font-size:min(10vw,7rem);text-transform:uppercase;font-weight:500;margin:0;text-align:left;text-shadow:var(--outline-text)}section.hero h1:first-of-type{margin-left:2%}section.hero h1:nth-of-type(2){margin-left:5%}section.hero h2{text-transform:uppercase;font-weight:900}section.hero h2:first-of-type{margin-left:25%}section.hero h2:nth-of-type(2){margin-left:30%}section.hero picture{position:absolute;top:2%;right:2%;z-index:0;animation:slideInFromRight .7s ease-out}section.hero img{max-width:100%;object-fit:contain;width:min(70vw,800px);position:absolute;top:2%;right:2%;z-index:0;animation:slideInFromRight .7s ease-out}@keyframes slideInFromLeft{0%{transform:translate(-100%);opacity:0}to{transform:translate(0);opacity:1}}@keyframes slideInFromRight{0%{transform:translate(+100%);opacity:0}to{transform:translate(0);opacity:1}}@media(max-width:800px){section.hero{height:90vw}section.hero div.info{position:absolute;bottom:0%;left:0;right:0}}section.about{margin-inline:.5rem}section.about>h1{text-align:center;font-size:2rem}section.about>div{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}section.about>div>p{margin-inline:1rem}section.about>div>p,section.about>div .stack{opacity:0;transition:opacity 1s .5s}section.about .active{opacity:1}section.about div.tech{display:grid;grid-template-columns:repeat(5,auto);row-gap:10px;justify-items:center}section.about div.stack{display:grid;grid-template-rows:auto;justify-items:center}section.about .active div.stack:nth-child(2n-1){animation:fadeInDropDown 1.2s .5s ease-out forwards}section.about .active div.stack:nth-child(2n){animation:fadeInDropDown .9s .5s ease-out forwards}section.about .active div.stack:nth-child(3n){animation:fadeInDropDown 1.5s .5s ease-out forwards}section.about img.tech-icon{width:48px;height:48px;filter:grayscale(100%);-webkit-filter:grayscale(100%)}section.about .tech-label{text-align:center;margin:0;font-weight:300;font-size:14px}@keyframes fadeInDropDown{0%{transform:translateY(-100%);opacity:0}to{opacity:100;transform:translateY(0)}}@media(max-width:800px){section.about p{font-size:1rem}section.about>div{grid-template-columns:1fr;grid-template-rows:repeat(2,min-content)}}section.projects{margin-inline:1rem}section.projects .card div.stack{display:grid;justify-content:center;align-content:center;grid-auto-flow:column;gap:2px}section.projects .card img.tech-icon.small{width:30px;height:30px}section.projects h1{text-align:center;font-size:2rem}section.projects .card-container{position:relative;display:grid;height:110vh;max-height:900px;place-items:start center;top:10%}section.projects .card{position:absolute;background-color:#fff;border:1px solid black;padding:10px;width:350px;box-shadow:2px 2px 2px 2px gray;transition:transform .5s ease-out}body.dark section.projects .card h3{color:#000000e6}section.projects .card>a{height:100%;display:grid;grid-template-rows:min-content;align-items:baseline;text-decoration:none;color:inherit}section.projects .card h3{text-align:center;font-size:1.5rem}section.projects .card>a>img{width:100%;border:1px solid grey}@media(min-width:1000px){section.projects .card:nth-child(2){transform:translate(3%) rotate(-5deg)}section.projects .card:nth-child(3){transform:translate(-3%) rotate(5deg)}section.projects .card:nth-child(4){transform:translate(5%) rotate(7deg)}section.projects .card:nth-child(5){transform:translate(-5%) rotate(-7deg)}section.projects .card:nth-child(6){transform:translate(7%) rotate(10deg)}section.projects:hover .card:nth-child(2){transform:translate(-100%) translateY(-15%) rotate(-5deg)}section.projects:hover .card:nth-child(3){transform:translate(100%) translateY(-3%) rotate(18deg)}section.projects:hover .card:nth-child(4){transform:translateY(100%) rotate(3deg)}section.projects:hover .card:nth-child(5){transform:translate(100%,100%) rotate(-5deg)}section.projects:hover .card:nth-child(6){transform:translate(-100%,100%) rotate(5deg)}section.projects:hover .card:nth-child(7){transform:translateY(205%) rotate(-5deg)}}@media(max-width:1000px){section.projects div.card-container{position:static;display:grid;grid-auto-flow:row;gap:20px;height:100%;max-height:none}section.projects div.card-container div.card{width:95%;position:static}section.projects .card:first-of-type{transform:translate(-100%) rotate(-50deg)}section.projects .card:nth-of-type(2){transform:translate(-100%) rotate(30deg)}section.projects .card:nth-of-type(3){transform:translate(-100%) rotate(-20deg)}section.projects .card:nth-of-type(4){transform:translate(-100%) rotate(-40deg)}section.projects .card:nth-of-type(5){transform:translate(-100%) rotate(20deg)}section.projects .card:nth-of-type(6){transform:translate(-100%) rotate(-10deg)}section.projects .card:nth-of-type(7){transform:translate(-100%) rotate(-5deg)}section.projects .card.active{transform:translate(0) rotate(0)}}