@import"https://fonts.googleapis.com/css2?family=Bitter:ital,wght@0,100..900;1,100..900&family=Cute+Font&family=Josefin+Sans:ital,wght@0,100..700;1,100..700&family=Lora:ital,wght@0,400..700;1,400..700&family=Outfit:wght@100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&family=Rubik:ital,wght@0,300..900;1,300..900&family=Source+Code+Pro:ital,wght@0,200..900;1,200..900&display=swap";.about-section{display:flex;justify-content:space-between;margin-left:10%;margin-right:10%;margin-top:15%;gap:20%}.nameContainer{position:relative;display:flex;flex-direction:column;align-items:flex-start;font-family:Source Code Pro,monospace;color:#fff;margin-top:350px;margin-left:10%;margin-right:10%}p{position:relative;font-family:Source Code Pro,monospace;color:#fff;margin-top:10px}.profileContainer{position:relative;display:flex;align-items:center;margin-left:60%;margin-top:-300px}.profileContainer img{width:450px;height:450px;opacity:1;clip-path:circle(0% at 50% 50%);animation:reveal 1.5s forwards,floating 3s ease-in-out infinite}.profileContainer:hover img{filter:blur(3px)}@keyframes reveal{0%{clip-path:circle(0% at 50% 50%)}to{clip-path:circle(50% at 50% 50%)}}.container{position:relative;border-radius:5px;padding:40px;z-index:1;flex:1;margin:20px;min-width:300px;background:#ffffff1a;box-shadow:0 4px 15px #00000080;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);transition:background 2s,opacity 2s;opacity:0}.container.scrolled{background:#fff3;opacity:1}.container h1{font-family:Source Code Pro;color:#fff}.container li{font-family:Rubik;padding:5px;text-align:left;color:#fff}button{--color: #229091;--_g: linear-gradient(var(--color) 0 0) no-repeat;background:var(--_g) calc(var(--_p, 0%) - 100%) 0%,var(--_g) calc(200% - var(--_p, 0%)) 0%,var(--_g) calc(var(--_p, 0%) - 100%) 100%,var(--_g) calc(200% - var(--_p, 0%)) 100%;background-size:50.5% calc(var(--_p, 0%) / 2 + .5%);transition:background-size .4s,background-position 0s .4s;padding:10px;cursor:pointer;font-weight:700;color:#fff;margin-top:20%}button:hover{--_p: 100%;transition:background-position .4s,background-size 0s}.projects{display:flex;flex-direction:row;justify-content:center;align-items:center;gap:40px;margin:20px auto}.project-container{color:#fff;font-family:Source Code Pro,monospace;width:250px;height:250px;border:2px solid white;border-radius:50%;display:flex;align-items:center;justify-content:center;text-align:center;margin-left:10%;margin-right:10%;margin-top:15%;opacity:0;transition:opacity 1s ease-in-out,clip-path 1.5s ease-in-out;clip-path:circle(0% at 50% 50%)}.reveal{opacity:1;clip-path:circle(50% at 50% 50%);transition:1.5s;animation:floating 3s ease-in-out infinite}.project-list{position:relative;border-radius:5px;padding:40px;z-index:1;flex:1;margin-top:200px;margin-right:10%;min-width:300px;background:#ffffff1a;box-shadow:0 4px 15px #00000080;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.2);transition:background 2s,opacity 2s;opacity:0}.project-list.scrolled{background:#fff3;opacity:1}h2{font-family:Source Code Pro,monospace;color:#fff}@keyframes reveal{0%{clip-path:circle(0% at 50% 50%);opacity:0}to{clip-path:circle(50% at 50% 50%);opacity:1}}@keyframes floating{0%{transform:translateY(0)}50%{transform:translateY(10px)}0%{transform:translateY(0)}}.project-picture{position:relative;width:100%;height:100%;overflow:hidden}.project-picture img{max-width:100%;height:auto;object-fit:cover;transition:filter .3s ease}.project-picture:hover img{filter:blur(3px)}.project-link{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background-color:#000000b3;color:#fff;padding:10px;border-radius:5px;opacity:0;transition:opacity .3s ease;text-align:center;text-decoration:none;font-family:Source Code Pro}.project-picture:hover .project-link{opacity:1}.contact{margin-top:15%}.contact h1{color:#fff;font-family:Source Code Pro,monospace;overflow:hidden;white-space:nowrap;margin:4px auto;border-right:2px solid rgba(255,255,255,.75);transform:translateY(-50%);opacity:0;transition:opacity 1s ease-in-out}.contact h1.start-typewriter{animation:typewriter 2s steps(44) 1s 1 normal both,blinkTextCursor .8s steps(44) infinite normal;opacity:1}@keyframes typewriter{0%{width:0}to{width:7em}}@keyframes blinkTextCursor{0%{border-right-color:#ffffffbf}50%{border-right-color:#000}to{border-right-color:#ffffffbf}}.pictures{position:relative;width:auto;height:auto;overflow:hidden;margin-left:40.5%}.pictures img{width:50px;height:50px;object-fit:cover;padding:15px}.button1{background:none;border:none;padding:0;cursor:pointer;margin-top:inherit}.notification{position:fixed;bottom:-50px;font-family:Source Code Pro,monospace;font-size:12px;transform:translate(-50%);left:10%;background-color:#000c;color:#fff;padding:10px 20px;border-radius:5px;transition:bottom .5s ease-in-out}.notification.show{bottom:20px}.navbar{position:fixed;top:0;width:100%;background-color:transparent;color:#fff;font-family:Source Code Pro,monospace;display:flex;justify-content:center;align-items:center;padding:10px;transition:top .3s;z-index:1000}.navbar ul{list-style-type:none;display:flex;gap:100px}.navbar li{cursor:pointer}.navbar.hidden{top:-60px}.navbar.visible{top:0}body{background-color:#000}
