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}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}body{color:#fff;box-sizing:border-box;transition:all .5s;margin:0;padding:0}.body-container{display:flex;justify-content:center;align-items:center;height:100vh}.slide{opacity:0;transform:translateY(20px);transition:opacity .5s,transform .5s}nav{position:fixed;width:300px;height:100vh;top:0;right:0;z-index:1;background:#2c2c3ccc;box-shadow:0 4px 30px #0000001a;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);border-left:1px solid rgba(255,255,255,.3);transition:all .5s}nav ul{margin:70px 0 16px;list-style-type:none}nav .close{color:#fff;float:right;margin:20px;font-size:30px;cursor:pointer}@media screen and (min-width: 769px){.header .menu-bar{display:none}}nav .link{padding:20px;border-top-left-radius:50px;border-bottom-left-radius:50px;cursor:pointer;color:#fff;text-decoration:none;display:block;font-size:20px}.hover{background-color:orange;color:#000}nav .link:hover{background-color:orange}.header{position:fixed;top:0;width:100%;height:80px;display:flex;justify-content:space-between;align-items:center;padding:20px;box-sizing:border-box;background-color:#2c2c3c;z-index:1}.brand-name{display:flex;align-items:center}.brand-name h1,.brand-name a{margin:0;font-size:20px;color:#fff;text-decoration:none}.header-img{width:50px;height:50px;margin-right:10px;border-radius:60px}.brand-links ul{display:flex;list-style-type:none}.brand-links ul li{padding:0}.brand-links ul li span{padding:10px 20px;text-decoration:none;border-radius:5px;font-weight:700;transition:all .5s;cursor:pointer;color:#fff}.brand-links ul li span:hover{background-color:orange;color:#fff}.active{background-color:orange;color:#fff!important}.active:hover{background-color:#fff;color:#2c2c3c!important}.menu-bar{font-size:50px;cursor:pointer;display:none;margin-bottom:15px}.hero{top:80px;position:relative;height:calc(100vh - 150px);text-align:center}.hero .container{box-sizing:border-box;width:100%;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);-webkit-transform:translate(-50%,-50%)}.hero .intro{font-size:20px;color:#c4c4c4}.hero .name{display:flex;gap:15px;justify-content:center}.hero h1{font-size:60px;margin:0;color:#fff;letter-spacing:1px}.typing{font-size:25px;font-family:monospace;color:orange;margin-top:20px}.cta{display:inline-block;background-color:#fff;padding:12px 30px;margin-top:40px;border-radius:10px;font-weight:700;text-decoration:none;color:#2c2c3c;cursor:pointer;transition:all .5s}.cta:hover{transform:scale(1.1)}.about{margin:100px auto 200px;text-align:center;padding:20px;max-width:800px;border-radius:10px;background:#ffffff1a;box-shadow:0 4px 30px #0000001a;border:1px solid rgba(255,255,255,.3);transition:all .5s;box-sizing:border-box;scroll-margin-top:100px}.about:hover{transform:scale(1.05)}.about p{text-align:left;color:#c4c4c4}.about .inline-link{color:orange}.skills{position:relative;text-align:center;margin:0 auto 200px;max-width:1000px;scroll-margin-top:100px;transition:all .5s}.skills h1{margin-bottom:40px}.skills .container{padding:10px;box-sizing:border-box;justify-content:center;display:flex;gap:20px;align-items:center;flex-wrap:wrap}.skills .skill{height:150px;width:150px;display:flex;flex-direction:column;border-radius:10px;background:#ffffff1a;box-shadow:0 4px 30px #0000001a;border:1px solid rgba(255,255,255,.3);transition:all .2s}.skills .skill:hover{transform:scale(1.1)}.skills .skill img{width:80px;margin:auto}.skills .skill p{font-size:20px;margin-top:5px}.resume{margin:100px auto 200px;text-align:center;padding:20px;max-width:800px;border-radius:10px;background:#ffffff1a;box-shadow:0 4px 30px #0000001a;border:1px solid rgba(255,255,255,.3);transition:all .5s;box-sizing:border-box;scroll-margin-top:100px}.resume:hover{transform:scale(1.05)}.resume p{font-size:20px;color:#c4c4c4}.resume a{display:inline-block;margin:25px 0;padding:15px 20px;text-decoration:none;background-color:orange;color:#fff;font-weight:700;border-radius:7px}.projects{padding:20px;margin-bottom:100px;scroll-margin-top:100px;transition:all .5s;text-align:center}.projects h1{margin-bottom:40px;text-align:center}.projects .project{position:relative;display:flex;gap:25px;align-items:flex-start;margin:0 auto 70px;border-radius:10px;max-width:1000px;background:#ffffff1a;box-shadow:0 4px 30px #0000001a;border:1px solid rgba(255,255,255,.3);transition:all .5s}.projects .project:hover{transform:scale(1.02)}.projects .project img{width:100%;border-top-left-radius:10px;border-bottom-left-radius:10px;max-width:320px}.projects .project-meta{padding:0 20px 20px;width:100%;text-align:left;box-sizing:border-box}.projects h1.project-meta-title{margin:20px 0 15px;text-align:left}.projects .project-meta .stack{display:flex;flex-wrap:wrap;gap:5px}.projects .project-meta .stack span{font-size:12px;font-weight:700;padding:5px;color:#000;border-radius:5px;background-color:#adff2f}.projects .project-meta .stack span:nth-child(1){background-color:#8a2be2;color:#fff}.projects .project-meta .stack span:nth-child(2){background-color:pink}.projects .project-meta .stack span:nth-child(3){background-color:#0ff}.projects .project-meta .stack span:nth-child(4){background-color:#adff2f}.project .project-meta .project-meta-description{height:110px;overflow:hidden;color:#e4e1e1}.project a{color:orange}.project .project-meta .link{display:inline-flex;text-decoration:none;padding:10px 13px 5px;gap:5px;color:#000;background-color:#e4e1e1;margin:5px 5px 0;text-align:center;border-radius:5px}.row-reverse{flex-direction:row-reverse;justify-content:space-between}.row-reverse img{border-top-right-radius:10px;border-bottom-right-radius:10px}.contact{margin:100px auto 200px;text-align:center;padding:20px 20px 50px;max-width:800px;border-radius:10px;background:#ffffff1a;box-shadow:0 4px 30px #0000001a;border:1px solid rgba(255,255,255,.3);transition:all .5s;box-sizing:border-box;scroll-margin-top:100px}.contact:hover{transform:scale(1.05)}.contact p{margin:25px 0 40px;font-size:20px;color:#c4c4c4}.contact .contact-links{display:flex;gap:20px;justify-content:center;flex-wrap:wrap}.contact .contact-links a{background-color:#e4e1e1;padding:5px 10px;border-radius:7px;display:flex;gap:10px;align-items:center;text-decoration:none;color:#000;font-weight:700}.blog{text-align:center;margin-bottom:180px;scroll-margin-top:100px;transition:all .5s}.blog h1.title{margin-bottom:40px}.blog .container{display:flex;gap:30px;margin:auto;flex-wrap:wrap;justify-content:center;padding:10px;max-width:1200px}.blog .container article{position:relative;width:90%;max-width:340px;text-align:left;border-radius:10px;background:#ffffff1a;box-shadow:0 4px 30px #0000001a;border:1px solid rgba(255,255,255,.3);transition:all .5s}.blog .container article:hover{transform:scale(1.05)}.blog .container article .img{position:relative;width:100%;max-width:340px;padding-bottom:50%;overflow:hidden}.blog .container article .img img{position:absolute;left:0;top:0;width:100%;border-top-left-radius:10px;border-top-right-radius:10px}.blog .container article p{padding:0 15px 5px;margin:0;height:60px;font-size:15px;color:#c4c4c4;overflow:hidden}.blog .container article h1{padding:15px;margin:0;color:#fff}.blog .container article a{display:inline-block;text-decoration:none;padding:10px 25px;color:#000;background-color:#fff;margin:10px 15px 20px;text-align:center;border-radius:7px}.article-more,.projects-more{background-color:#2c2c3c;color:#fff;padding:15px 25px;margin:20px auto 0;border:none;outline:1px solid #ddd;cursor:pointer;text-decoration:none;border-radius:5px}.article-more:hover,.projects-more:hover{background-color:#fff;color:#2c2c3c;outline:1px solid #2c2c3c}footer{text-align:center;padding:100px 20px;opacity:.5;background:#ffffff1a;border-radius:16px;box-shadow:0 4px 30px #0000001a;backdrop-filter:blur(6.6px);-webkit-backdrop-filter:blur(6.6px)}@media screen and (max-width: 850px){.about,.resume,.contact{margin:100px 20px 200px}}@media screen and (max-width: 690px){.brand-links ul{display:none}.menu-bar{display:block}.hero .name{justify-content:left;flex-direction:column;gap:0}.hero .container{padding:30px;text-align:left;justify-content:left}.projects .project{flex-direction:column;padding:20px}.projects .project img{margin:auto;border-radius:10px}.projects .project .project-meta{padding:0}.projects .project .project-meta-title,.projects .project .stack{font-size:25px}.project-meta-title{margin-top:0!important}}@media screen and (max-width: 455px){.hero .name h1{font-size:40px}.typing span{font-size:22px}}@media screen and (max-width: 400px){.cta-social{flex-direction:column}.hero .container .social a{padding:7px 7px 1px}.hero .container .social a img{width:20px}}@media screen and (max-width: 360px){.skills .skill{width:130px;height:130px}.typing span{font-size:20px}}@media screen and (max-width: 300px){.typing span{font-size:15px}}