@import url(https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&display=swap);@import url(https://fonts.googleapis.com/css2?family=Oswald&display=swap);@import url(https://fonts.googleapis.com/css2?family=Nunito:wght@600&display=swap);*{margin:0;padding:0}.light-font{color:grey}.heading{color:var(--secondary-color);text-align:center;text-transform:uppercase}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:#f1f1f1}::-webkit-scrollbar-thumb{background:#888}::-webkit-scrollbar-thumb:hover{background:#555}body{--accent-color:#e6ca68;--highlight-color:#d4a806;--primary-color:#fff;--secondary-color:#202020;--button-text-color:var(--background-color);--transition-delay:1s;background:var(--primary-color);display:block;margin:0 auto;min-height:100vh}body.dark{--accent-color:#e6ca68;--highlight-color:#d4a806;--primary-color:#202020;--secondary-color:#fff}h1,h2,h3,h4,h5{font-family:Oswald,sans-serif;letter-spacing:1px}li,p{font-family:Open Sans,sans-serif}li{cursor:pointer}nav{align-items:center;background-color:var(--secondary-color);box-sizing:border-box;display:flex;justify-content:space-between;position:relative}.logo img{margin:1rem;width:50px}.navbar-links{height:100%}.navbar-links ul{align-items:space-between;display:flex;gap:1rem;justify-content:space-between;margin:0 1rem 0 0;padding:0}.navbar-links li{cursor:pointer;list-style:none}.navbar-links li button{background-color:initial;border:0;box-shadow:none;color:var(--primary-color);cursor:pointer;display:block;padding:2px;text-decoration:none}.navbar-links li button:hover{color:var(--highlight-color)}.toggle-button{background-color:initial;border:none;display:none;flex-direction:column;height:21px;justify-content:space-between;position:absolute;right:1rem;top:3rem;width:30px}.toggle-button .bar{background-color:var(--primary-color);border-radius:10px;height:3px;width:100%}.grid{grid-gap:1rem;display:grid;gap:1rem;grid-template-areas:". content content content content .";grid-template-columns:repeat(6,1fr);padding:0 2rem}.dark-header{background-color:var(--secondary-color);position:relative;z-index:1}#header-svg path{fill:var(--secondary-color)}#header{transition:all .1s linear}#header,.header-blur{position:-webkit-sticky;position:sticky;top:0}.header-blur{opacity:.1;z-index:-1}.content{box-sizing:border-box;font-family:Oswald,sans-serif;grid-area:content;letter-spacing:2px;max-width:1000px;padding-bottom:5px;position:relative;width:100%}.contact-btn,.content{color:var(--primary-color)}.contact-btn{background-color:initial;border:1px solid var(--primary-color);cursor:pointer;font-family:Open Sans,sans-serif;left:40%;padding:5px;position:absolute;top:20%}.contact-btn:hover{border:1px solid var(--highlight-color);color:var(--highlight-color)}.header-divider{background-position:0 100%;background-repeat:no-repeat;background-size:cover;height:150px;margin-top:-25px;max-width:1000px;position:relative;width:100%;z-index:-1}.about{align-items:center;background-color:var(--primary-color);border-radius:20px;display:flex;justify-content:center;margin:0 auto;max-width:1000px;padding:2rem 1rem}.about-img{background-repeat:no-repeat;display:block;height:350px;margin:1rem;min-width:385px;transform:rotate(180deg)}.image-here{height:280px;margin:0 auto;position:relative;width:280px}.image-here img{left:-68px;position:absolute;top:-28px;transform:rotate(180deg);width:400px}.about-txt h3{color:var(--accent-color);font-family:Oswald,sans-serif;letter-spacing:1px;text-transform:uppercase}.about-txt p{color:var(--secondary-color);font-family:Open Sans,sans-serif}.accomplishments{grid-gap:1rem;box-sizing:border-box;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));grid-template-rows:repeat(auto-fit,minmax(200px,1fr));justify-items:center;margin:0 auto;max-width:1000px;padding:5px}.accomplishments>div{border:.5px solid var(--accent-color);color:var(--secondary-color);cursor:default;font-family:Oswald,sans-serif;letter-spacing:1px;padding:10px;text-align:center;text-transform:uppercase}.accomplishments>div:hover{background-color:hsla(0,0%,50%,.103);color:var(--accent-color)}.accomplishments>div>p{font-family:Open Sans,sans-serif;font-size:.9rem;letter-spacing:0;padding-top:1rem;text-transform:none}.contact{grid-gap:1rem;align-items:center;background-color:var(--accent-color);box-sizing:border-box;display:grid;gap:1rem;justify-content:center;margin-top:2rem;padding:2rem 0}.contact h2{color:var(--primary-color);font-family:Oswald,sans-serif;justify-self:center;letter-spacing:1px;text-transform:uppercase}.socialIcons{grid-gap:1rem;align-items:center;display:grid;gap:1rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));justify-items:center}.socialIcons a{align-items:start;border:1px solid var(--background-color);display:grid;justify-content:start;justify-items:start;padding:.5rem}.socialIcons a h1{color:var(--primary-color);font-size:3rem}.socialIcons a:hover{background-color:#80808021;color:var(--accent-color)}.skillsWrapper{margin:4rem 0}.skillsWrapper h2{color:var(--secondary-color);margin-bottom:2rem}.skills{grid-gap:1rem;align-items:center;gap:1rem;grid-template-columns:1fr 1fr 1fr;margin:0 auto;width:1000px}.skills,.skills>div{display:grid;justify-items:center}.skills>div{border:1px solid grey;color:var(--secondary-color);height:100px;padding:.5rem;text-align:center;width:100px}.projectsWrapper{margin:2rem 0 6rem}.projects{display:grid;grid-template-columns:1fr 3fr;margin:2rem 0}.projectsList{align-self:center;border-right:1px solid grey;height:250px;justify-self:end;overflow-x:hidden;overflow-y:scroll;padding-right:1rem}.projectsList ul{grid-gap:1rem;display:grid;font-weight:700;gap:1rem;grid-template-columns:1fr;list-style:none}.projectsList li{color:#000;font-family:nunito}.activeLi{color:#fff!important;font-weight:700}.activeLi:hover{background-color:#d4a806!important}.projectsList ul button{background-color:var(--accent-color);border:none;cursor:pointer;outline:none;padding:.5rem}.projectsList ul button:hover{background-color:var(--highlight-color);box-shadow:0 0 5px var(--highlight-color)}.projectsInfo{grid-gap:2rem;display:grid;gap:2rem;grid-template-columns:2fr 2fr}.projectsImg{grid-gap:1rem;display:grid;gap:1rem;grid-auto-rows:auto;grid-template-columns:1fr 2fr}.smallImg{align-items:start;display:grid;grid-template-columns:1fr;justify-items:end}.smallImg img{height:auto;max-width:100%;opacity:.6;width:100px}.smallImg img:hover{cursor:pointer;opacity:1}.bigImg{align-self:start;justify-self:start;position:relative}#monitor-bottom{bottom:-40px;left:30%;position:absolute;width:150px;z-index:-1}.bigImg img{border:2px solid var(--background-color);height:auto;max-width:100%;width:400px}.projectsTxt{margin-right:2rem;position:relative}.projectsTxt h3{color:var(--secondary-color);padding-bottom:1rem;text-transform:capitalize}.projectsTxt p{font-size:14px;text-align:left}.projectsTxt p,.techUsed{color:var(--secondary-color)}.techUsed{display:flex;flex-direction:column;justify-content:flex-end;margin:2px 0;position:absolute}.techUsed h4{color:var(--secondary-color);font-weight:400;padding-bottom:.2rem}.techUsed li{cursor:default;font-size:.8rem;list-style:none}.projectsTxt a{color:#d4a806;margin-top:1rem;position:absolute;right:20%}.footer{align-items:center;display:grid;height:120px;justify-items:center;margin-top:4rem;position:relative}.footer-txt{background-color:var(--primary-color);border:4px solid #fff;border-radius:1rem;margin:0 auto;padding:4px;text-align:center;width:400px}.footer-txt,.footer-txt h4{color:var(--secondary-color)}.footer-txt h4{margin-top:.5rem}.footer-txt span{color:#e6ca68}.footer-txt a{color:var(--secondary-color)}.loader{--path:#2f3545;--dot:#e6ca68;--duration:3s;height:44px;position:relative;width:44px}.loader:before{animation:dotRect var(--duration) cubic-bezier(.785,.135,.15,.86) infinite;background:var(--dot);border-radius:50%;content:"";display:block;height:6px;left:19px;position:absolute;top:37px;transform:translate(-18px,-18px);width:6px}.loader svg{display:block;height:100%;width:100%}.loader svg circle,.loader svg polygon,.loader svg rect{fill:none;stroke:var(--path);stroke-width:10px;stroke-linejoin:round;stroke-linecap:round}.loader svg polygon{stroke-dasharray:145 76 145 76;stroke-dashoffset:0;animation:pathTriangle var(--duration) cubic-bezier(.785,.135,.15,.86) infinite}.loader svg rect{stroke-dasharray:192 64 192 64;stroke-dashoffset:0;animation:pathRect 3s cubic-bezier(.785,.135,.15,.86) infinite}.loader svg circle{stroke-dasharray:150 50 150 50;stroke-dashoffset:75;animation:pathCircle var(--duration) cubic-bezier(.785,.135,.15,.86) infinite}.loader.triangle{width:48px}.loader.triangle:before{animation:dotTriangle var(--duration) cubic-bezier(.785,.135,.15,.86) infinite;left:21px;transform:translate(-10px,-18px)}@keyframes pathTriangle{33%{stroke-dashoffset:74}66%{stroke-dashoffset:147}to{stroke-dashoffset:221}}@keyframes dotTriangle{33%{transform:translate(0)}66%{transform:translate(10px,-18px)}to{transform:translate(-10px,-18px)}}@keyframes pathRect{25%{stroke-dashoffset:64}50%{stroke-dashoffset:128}75%{stroke-dashoffset:192}to{stroke-dashoffset:256}}@keyframes dotRect{25%{transform:translate(0)}50%{transform:translate(18px,-18px)}75%{transform:translateY(-36px)}to{transform:translate(-18px,-18px)}}@keyframes pathCircle{25%{stroke-dashoffset:125}50%{stroke-dashoffset:175}75%{stroke-dashoffset:225}to{stroke-dashoffset:275}}.loader{display:inline-block;margin:0 16px}html{-webkit-font-smoothing:antialiased}*,:after,:before{box-sizing:border-box}#loading{animation:Textloading 3s infinite;animation-timing-function:ease-in-out;border-top:2px solid #000;font-family:nunito;font-size:1rem;font-weight:700;padding:10px;text-transform:uppercase}@keyframes Textloading{0%{opacity:1}50%{opacity:0}to{opacity:1}}#loading-div{align-items:center;display:flex;flex-direction:column;height:100vh;justify-content:center;position:relative}@media (max-width:786px){.about{box-sizing:border-box;display:grid;grid-template-columns:none;justify-items:center;margin:10px}.about-img{background-image:url(/portfolio-website/static/media/about-img-bg-small.f9a4ee40c1f0daac53f0.svg)!important;background-repeat:no-repeat;display:block;height:230px;margin:1rem;min-width:100px;width:230px}.image-here{height:180px;margin:0 auto;width:200px}.image-here img{height:auto;left:-29px;position:absolute;top:-19px;width:260px}.about-txt{margin:0 auto;padding:.5rem}.accomplishments{grid-gap:1rem;display:grid;font-size:20px;gap:1rem;grid-template-columns:1fr 1fr;margin:20px}.accomplishments>div>p{font-size:.6rem}.contact{height:auto;padding:2rem 0}.contact h2{margin:1rem}.socialIcons{grid-template-columns:1fr 1fr}.skillsWrapper{margin:2rem 0}.skillsWrapper h2{margin-bottom:1rem}.skills{grid-gap:1rem;align-items:center;gap:1rem;grid-template-columns:1fr 1fr;width:320px}.skills,.skills>div{display:grid;justify-items:center}.skills>div{border:1px solid grey;height:100px;padding:.5rem;text-align:center;width:100px}.projects{grid-template-columns:1fr}.projectsList{justify-self:auto;padding:1rem}.projectsList ul{grid-gap:.8rem;display:grid;font-weight:700;gap:.8rem;grid-template-columns:1fr;list-style:none}.projectsInfo{grid-gap:1rem;display:grid;gap:1rem;grid-template-columns:1fr}.projectsImg{display:grid;grid-auto-rows:auto;grid-template-columns:1fr 2fr;padding:1rem}#monitor-bottom{bottom:-40px;left:15%;position:absolute;width:150px;z-index:-1}.smallImg{grid-gap:.5rem;display:grid;gap:.5rem;grid-template-columns:1fr;justify-items:center}.smallImg img{height:auto;max-width:100%;opacity:.6;width:80px}.projectsTxt{font-size:.9rem;justify-self:center;text-align:center!important}.projectsTxt p{text-align:left;width:300px}.projectsTxt a{bottom:0;color:#d4a806;margin-top:1rem;position:absolute;right:20%}.techUsed{padding-bottom:2rem;position:static}.techUsed li{cursor:default;list-style:none}nav{align-items:flex-start;flex-direction:column}.toggle-button{display:flex}.navbar-links{display:none;width:100%}.navbar-links ul{flex-direction:column;padding-bottom:1rem;text-align:center;width:100%}.navbar-links li{display:block;text-align:center!important}.navbar-links ul li button{display:block;margin:0 auto;padding:.5rem 1rem;text-align:center}.navbar-links.active{display:flex}.footer-txt{font-size:.8rem;width:220px}.contact-btn{left:25%;position:absolute;top:20%}}
/*# sourceMappingURL=main.ef9c6ee3.css.map*/