@font-face{font-family:Montserrat;src:url(/Montserrat-Regular.ttf);font-weight:500}@font-face{font-family:Montserrat;src:url(/Montserrat-Bold.ttf);font-weight:700}@font-face{font-family:Montserrat;src:url(/Montserrat-Black.ttf);font-weight:900}:root{--color-primary: rgb(42, 106, 189);--color-black: black;--color-white: white;--color-dark: #171717;--color-light: #d8d8d8}body,html,#root{width:100%;height:100%;margin:0}*{font-family:Montserrat}h1,h2,h3{color:var(--color-primary);font-weight:700}button:hover{cursor:pointer}#router{display:flex;flex-direction:column;align-items:center;background-color:var(--color-dark);color:var(--color-white);width:100%;min-height:100%}#page{width:clamp(550px,50%,900px);max-width:90%;padding-bottom:30px;flex-grow:2;display:flex;flex-direction:column}#navbar-container{position:sticky;top:0;z-index:2}#links-container{background-color:var(--color-dark);display:flex;justify-content:center;align-items:center;gap:20px}#links-container a{font-weight:700;color:var(--color-light);text-decoration:underline var(--color-primary) 3px}@media only screen and (max-width:600px){#links-container{position:fixed;inset:50px;box-shadow:0 0 100px #000;transform:translate(150%);transition:transform .2s ease-in-out;font-size:30px;flex-direction:column}#collapse-btn{position:fixed;box-shadow:0 0 10px var(--color-dark);background-color:var(--color-primary);color:var(--color-dark);border-radius:10px;border:none;right:15px;bottom:15px;padding:15px;font-weight:800;width:70px;height:70px;transition:transform .3s ease-in-out}.navbar-expanded #collapse-btn{transform:rotate(180deg)}.navbar-expanded #links-container{transform:translate(0)}}@media only screen and (min-width:601px){#links-container{font-size:20px;padding-block:20px;box-shadow:0 0 10px #000;border-bottom-left-radius:10px;border-bottom-right-radius:10px}#collapse-btn{display:none}}#avatar{border-radius:50%;width:200px;height:200px;border:2px solid var(--color-primary)}#header-span{color:var(--color-light);font-weight:700}#header{display:flex;gap:30px;margin-top:30px}@media only screen and (max-width:600px){#header{flex-direction:column;margin-top:50px}}#header p{font-size:17px;line-height:25px}#about-data{display:flex;flex-direction:column;align-items:center;gap:10px}#about-icons{display:flex;gap:10px;align-items:center}#about-icons img{width:30px}#about-content h1{margin-top:0}.story-element{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%/1,max(250px,100%/3)),1fr));gap:20px}.story-element img{width:100%}#story{display:flex;flex-direction:column;gap:20px}#story a{color:var(--color-light)}.project{position:relative;border:2px solid var(--color-primary);padding:20px;border-radius:5px;color:#000;text-decoration:none}.project .char-btn{position:absolute;top:15px;right:15px;border:2px solid var(--color-light);border-radius:100px;background-color:transparent;font-weight:700;width:23px;height:23px;color:var(--color-light)}.project a{text-decoration:none;color:var(--color-light)}.project h2{margin-top:0}.project #project-info-container{position:fixed;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background-color:#000000b3;z-index:1}#project-info-container #project-info{line-height:25px;position:relative;padding:20px;background-color:var(--color-dark);color:var(--color-light);border-radius:10px;width:clamp(550px,50%,900px);max-width:90%;overflow-y:auto}#projects{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px}
