*{box-sizing:border-box;margin:0;padding:0}:root{font-family:system-ui,Avenir,Helvetica,Arial,sans-serif;line-height:1.5;font-weight:400;color-scheme:light dark;background-color:#f0f8ff;color:#1a1a1a;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{font-weight:500;color:#646cff;text-decoration:inherit}a:hover{color:#535bf2}html{scroll-behavior:smooth;font-size:18px}body{font-size:1rem;margin-top:0;min-height:100vh;max-width:100vw;overflow-x:hidden}@media (prefers-color-scheme: dark){:root{background-color:#121212;color:#e0e0e0}}h1{font-size:2rem;line-height:1.1}h3{font-size:1.2rem;line-height:1.2}nav{font-size:1rem;display:flex;justify-content:center;background-color:#f0f8ff;padding-block:.6rem;width:75%;margin:0 auto;border-radius:1.25rem;box-shadow:0 4px 8px #0000ff1a;z-index:100;opacity:.8;position:fixed;top:10px;left:0;right:0}nav.open{width:250px;opacity:.9;background-color:#f4f4f4;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:1.5rem;padding:3rem 2rem}nav a{margin:0 15px;text-decoration:none;color:#333}nav a:hover{text-decoration:underline}.active{font-weight:500;color:#535bf2;text-decoration:inherit}nav a.active{font-weight:700;color:#007bff}.hamburger{position:fixed;display:none;flex-direction:column;cursor:pointer;background-color:#f0f8ff;padding:10px;border-radius:10px;top:15px;right:20px;z-index:101}.hamburger.open{background-color:#ccc}.hamburger.open .line:nth-child(2){opacity:0}.hamburger.open .line:nth-child(1){transform:translateY(8px) rotate(45deg)}.hamburger.open .line:nth-child(3){transform:translateY(-8px) rotate(-45deg)}.line{width:25px;height:2px;background-color:#333;margin:3px 0;border-radius:2px}@media (width > 1000px) and (width < 1200px){nav{width:60%}}@media (width > 1200px){nav{width:50%;max-width:750px}}@media (width > 2000px){nav{font-size:2rem;width:70%;max-width:1440px;border-radius:3rem;gap:2rem;padding-block:1.25rem}}@media (width < 768px){.hamburger{display:flex}nav{display:none}}.footer{padding:20px 0;text-align:center}.footer h3{margin:10px 0}.footer h3{display:flex;flex-direction:column;gap:10px;font-size:1.25rem}@media (width > 768px){.footer h3{font-size:1.5rem}}@media (width > 830px){.footer h3{flex-direction:row;justify-content:center}}.footer h3 span#student{color:#1e3a8a}.footer h3 span#craftsman{color:#c50}.footer h3 span#man{color:#1c1c1c}.footer p{margin-block:5px}@media (prefers-color-scheme: dark){.footer{background-color:#555;color:#333}.social-media{padding:10px 0;border-radius:20px}}.social-media{margin:30px auto 0;display:flex;justify-content:space-evenly;width:300px;border-bottom:2px solid #333}.smedia img{width:30px;height:30px}.about-me{padding-top:50px;padding-inline:20px}.about-me>div{display:flex;flex-direction:column;place-items:center;gap:10px}.about-me div#nav{display:flex;flex-direction:column;place-items:center;padding-bottom:20px}.about-me img{width:50%;min-width:400px;border-radius:1.9rem}.about-me h1{text-align:center;padding-block:20px}.list{width:100vw;overflow-x:auto;scrollbar-width:none}.about-me-list{list-style-type:none;width:max-content;display:flex;margin:0 auto}.about-me-list li{padding:10px 20px}.about-me-list li:hover{background-color:gray;cursor:pointer;border-radius:10px}.about-me-list li:hover a{color:#fff}section{width:90%;margin:1.25rem 1.7rem;padding:1.25rem;border-radius:10px;box-shadow:0 4px 8px #0000001a}@media (width > 1050px){.about-me>div{flex-direction:row;justify-content:flex-start;align-items:flex-start;padding-inline:1rem}.about-me div#nav{width:100%;align-items:flex-start;margin-left:clamp(.25rem,5vw,7rem)}.about-me img{width:30vw}.list{width:clamp(500px,40vw,800px);margin-top:50px}.about-me-list{margin-inline:2px}section{width:90%;max-width:900px}}.education-section div{padding-top:1rem;padding-left:1rem}.education-section details{margin-left:2rem;margin-top:.5rem}.education-section h3{color:#555;font-size:1.25rem}@media (prefers-color-scheme: dark){section{box-shadow:0 0 8px 2px #ffffff80}.education-section h3{color:#aaa}}.my-projects{height:55vh;padding-left:20px}.my-projects h2{padding-block:50px}.all-projects{overflow-x:auto;scrollbar-width:auto;scrollbar-color:#007 transparent;width:90%;margin:0 auto}.projects{display:flex;justify-content:flex-start;gap:15px;padding:0 20px 20px;width:max-content}.project{height:350px;width:350px;border-radius:20px;box-shadow:2px 2px 2px 1px #333;line-height:2;position:relative}.project img{width:100%;height:100%;object-fit:cover;border-radius:15px}.project h3{position:absolute;bottom:100px;left:20px;color:#fff;background-color:#333;padding:5px 10px;border-radius:8px}.project .description{position:absolute;bottom:0;left:0;background-color:#333;border-radius:0 0 15px 15px;padding:5px 10px 10px;color:#fff}.project:hover .project-info{position:absolute;top:60px;left:20px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#007 transparent;height:80%}.tech-used div{background-color:#888;padding-inline:10px;border-radius:5px}.project p,.project code,.tech-used{display:none}.project:hover{background-color:#0ff;transition:background .8s;padding:20px}.project:hover h3{top:20px;color:#333;background-color:transparent;padding:0}.project:hover img{display:none}.project:hover p,.project:hover code{display:block}.project:hover .tech-used{margin-block:1rem;display:flex;flex-wrap:wrap;gap:5px;font-size:.9rem;color:#222}.project:hover .description{display:none}@media (prefers-color-scheme: dark){.all-projects{scrollbar-color:rgb(0,209,209) transparent}.project{color:#ddd;box-shadow:2px 2px 2px 1px #eee}.project:hover{color:#333;background-color:#00d1d1}}.my-skills{padding-left:20px;min-height:20vh}.my-skills h2{padding:50px 0}.all-skills{width:90%;overflow-x:auto;scrollbar-color:#007 transparent;margin:0 auto}.skills{display:flex;width:max-content;gap:20px;margin-bottom:30px}div#skill{width:300px;height:300px;border:2px solid #333;border-radius:30px;position:relative;display:flex;justify-content:center;align-items:center}div#skill img{height:70%;width:70%;transition:opacity .5s ease}div#skill div{display:none}div#skill:hover div{display:flex;flex-direction:column;padding:20px;text-align:center;position:absolute;top:50px}div#skill:hover img{opacity:.1}@media (prefers-color-scheme: dark){.all-skills{scrollbar-color:rgb(0,209,209) transparent}div#skill{border:2px solid #ddd;background-color:#555}div#skill:hover div{color:bisque}div#skill:hover img{opacity:.2}}.contact{padding-inline:20px;font-size:1.25rem}.contact h2{padding-block:50px 20px}.contact div#one{display:flex;flex-direction:column;place-items:center;gap:2rem}@media (width > 1050px){.contact div#one{flex-direction:row;justify-content:space-evenly;padding-bottom:30px}}.contact-info{margin-inline:1rem}.contact-info div{width:98%;display:flex;gap:1rem;align-items:center;padding:.5rem 1rem;margin-bottom:.75rem;box-shadow:inset 2px 2px 5px #333;border-radius:1.25rem;background-color:transparent}.contact-info div img{width:50px;background-color:transparent;border-radius:10px}.contact-info div:nth-child(1) img,.contact-info div:nth-child(2) img{rotate:90deg}@media (width > 425px){.contact-info div{gap:2rem;padding-inline:1.5rem}}form{width:100%;max-width:700px;padding-block:1rem;margin-bottom:20px;border-radius:1.25rem}.email,.message{display:flex;flex-direction:column;gap:5px;border-radius:20px;margin-bottom:20px}.email input{background-color:#e3e3e3;color:#333;border-radius:20px;padding:10px 20px;font-size:1.25rem;margin-left:30px;outline:none;border:none}.message textarea{background-color:#e3e3e3;margin-left:30px;color:#333;padding:20px;font-size:1.25rem;border-radius:20px;outline:none;border:none}textarea:focus,input:focus{border-bottom:3px solid navy}form button{padding:10px 20px;border-radius:10px;cursor:pointer;background-color:#333;font-size:1rem;margin-top:10px}form button:hover{background-color:#555;transition:background .5s}.contact-info{display:flex;flex-direction:column;justify-content:end;line-height:2}@media (prefers-color-scheme: light){button[type=submit]{color:#fff}}@media (prefers-color-scheme: dark){.contact-info div{box-shadow:inset 2px 2px 5px #fff;background-color:#222}.contact-info div img{background-color:bisque}textarea:focus,input:focus{border-bottom:3px solid cyan}.email input,.message textarea{background-color:#333;color:#e0e0e0}}@media (width > 856px) and (width < 1150px){.contact div#one{column-gap:2px}form{padding-right:10px}}@media (width < 856px){.contact div#one{display:flex;flex-direction:column;gap:30px}}@media (width < 856px){form{width:100%}}.submitted{width:clamp(400px,40vw,800px);height:500px;display:flex;position:relative}.all-cards{width:80%;margin:0 auto;overflow-x:auto;scrollbar-width:none}.cards{display:flex;align-items:center;gap:5px;height:100%;width:max-content}.card{height:400px;width:300px;opacity:.4;border-radius:1.25rem;background-color:#777;transition:all .6s ease}.card.active{height:100%;width:400px;opacity:.9}.arrow{height:max-content;padding:10px;color:#0ff;position:absolute;top:50%;border:none}.left{left:0}.right{right:0}.hero-section{height:100vh;background-image:url(/wallpaper.jpg);background-position:center;background-repeat:no-repeat;background-size:cover}.welcome-info{padding-left:20px;display:flex;flex-direction:column;gap:30px;justify-content:center;height:70vh;color:#333;text-shadow:0 0 5px cyan}.welcome-info h1 span{text-decoration:2px underline wavy cyan}.links a{padding:8px 12px;color:#333;width:max-content;border-radius:15px;font-size:1rem;margin-right:1rem}.links a:not(.my-cv){background-color:#06b9b9;border:3px solid rgb(6,185,185)}.my-cv{border:3px solid rgb(6,185,185)}article{width:250px;height:250px;text-align:center;box-shadow:inset 0 0 20px #0ff;border-radius:20px;padding:20px;display:flex;flex-direction:column;justify-content:center;font-size:.8rem}article h2{font-size:1.2rem}.my-philosophy{text-shadow:0 0 30px #fff;font-size:1.3rem;line-height:1.4}article div{display:none}article:hover{text-align:left;background-color:#f0f8ff;transition:background .5s;scale:1.05}article:hover div{display:flex;flex-direction:column}.articles{overflow-x:auto;width:78%;margin:0 auto;scrollbar-width:none}.articles-container{display:flex;justify-content:flex-start;width:max-content;margin-block:10px;gap:15px;animation:scroll 70s linear infinite}@keyframes scroll{0%{transform:translate(0)}to{transform:translate(-50%)}}.articles-container:hover{animation-play-state:paused}.all-me{display:flex;gap:10px;position:relative;bottom:50px;width:100%}.left-arrow img{transform:rotate(180deg);left:0}.left-arrow,.right-arrow{position:absolute;top:40%;width:50px;height:50px;background-color:#0ff;border-radius:20px;display:flex;place-items:center;cursor:pointer}.left-arrow{left:20px}.right-arrow{right:20px}.left-arrow img,.right-arrow img{width:100%;height:100%}@media (max-width: 768px){.welcome-info{width:90%}.articles{width:80%}.right-arrow,.left-arrow{display:none}}@media (width > 425px){h1{font-size:2.5rem}article{font-size:.9rem;width:270px;height:270px}article h2{font-size:1.4rem}}@media (width > 1024px){h1{font-size:3.2rem}h3{font-size:1.75rem}article{width:280px;height:280px}.my-philosophy{font-size:1.85rem}.links a{font-size:1.25rem}}@media (width > 2000px){h1{font-size:5.5rem}h3{font-size:3rem}.my-philosophy{font-size:3.5rem}.links a{font-size:2.5rem;padding:1rem 2rem;border-radius:1.8rem;border-width:5px}article{width:500px;height:500px;box-shadow:inset 0 0 50px #0ff;font-size:1.5rem;padding-inline:2rem}article h2{font-size:2.5rem}.articles-container{gap:25px}}@media (prefers-color-scheme: dark){article{color:#333}article:hover{background-color:bisque}}
