*,:after,:before{box-sizing:border-box}a,b,blockquote,body,canvas,caption,code,div,em,embed,fieldset,figure,footer,form,h1,h2,h3,h4,h5,h6,header,html,i,iframe,img,label,li,main,nav,object,ol,p,pre,section,small,span,strike,strong,sub,sup,table,tbody,td,tfoot,th,thead,tr,tt,u,ul,video{margin:0;padding:0;border:0;font-size:62.5%;font:inherit;vertical-align:baseline;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust:none;-moz-text-size-adjust:none;-ms-text-size-adjust:none;text-size-adjust:none}footer,header,main,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:"";content:none}table{border-collapse:collapse;border-spacing:0}input{-webkit-appearance:none;border-radius:0}body,html{width:100%;margin:0;padding:0;overflow-x:hidden;font-size:62.5%;font-family:"Roboto"}.light-mode{color:#fff}.nav{display:flex;justify-content:flex-start;align-content:center;padding-left:4%;padding-right:4%;width:100%}.nav .logo{font-family:"Kaushan Script",cursive;color:#f48769;display:flex;align-self:center;font-size:2.9rem;font-weight:300;transform:rotate(-15deg);overflow:hidden;background:linear-gradient(90deg,#f48769,#f48769 50%,#fff 0);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-size:500% 100%;background-position:100%;transition:background-position .7s ease;padding-right:.8rem;margin-right:-.8rem;padding-bottom:1rem;margin-bottom:-.7rem}.nav .logo:hover{background-position:0 100%}@media screen and (min-width:400px){.nav .logo{padding-right:2rem;margin-right:-2rem;padding-bottom:1rem;margin-bottom:-.7rem}}.nav a{text-decoration:none}.nav .navigation-bar{display:flex;justify-content:flex-end;width:100%;height:5.2rem;background-color:#3a3943}.nav .navigation-bar ul{display:flex;justify-content:space-between;align-items:center;align-self:flex-end;width:28%;height:100%}@media screen and (max-width:765px){.nav .navigation-bar ul{width:40%}}@media screen and (max-width:576px){.nav .navigation-bar ul{width:50%}}@media screen and (max-width:420px){.nav .navigation-bar ul{width:75%}}.nav .navigation-bar ul li{font-family:"Roboto";font-weight:400;text-align:center;font-size:2.1rem;color:#fff}.nav .navigation-bar ul li:hover{color:#f48769}.image-div{display:flex;align-items:center;width:100%;height:90vh;position:relative;background:#000}.image-div .hero-image{width:100%;height:100%;object-fit:cover;opacity:.55;overflow:hidden}@media screen and (max-width:765px){.image-div .hero-image{width:100%}}.image-div .headshot{display:flex;position:absolute;width:27.5%;left:69%;bottom:38%;border-radius:5%;align-self:center;border:2px solid #f48769}@media screen and (max-width:992px){.image-div .headshot{display:none}}.hero-text{margin:2% 0 5% 4%;display:flex;justify-content:center;flex-direction:column;width:60%;height:25%;position:absolute}@media screen and (max-width:992px){.hero-text{width:85%}}@media screen and (max-width:576px){.hero-text{width:95%}}.hero-text h1{font-family:"Roboto";font-size:6.4rem;line-height:7.5rem;font-weight:500;color:#fff}@media screen and (max-width:992px){.hero-text h1{font-size:6.8rem}}@media screen and (max-width:765px){.hero-text h1{font-size:6.2rem}}@media screen and (max-width:420px){.hero-text h1{font-size:4.5rem;line-height:5.5rem}}.about-div{margin-top:7.2rem}.about-div .about-text{font-family:"Roboto";font-weight:300;font-size:2.8rem;line-height:3.3rem;color:#fff}@media screen and (max-width:992px){.about-div .about-text{font-size:3rem}}@media screen and (max-width:765px){.about-div .about-text{font-size:2.6rem}}@media screen and (max-width:420px){.about-div .about-text{font-size:2.4rem;line-height:3.1rem}}.skills-container{display:flex;flex-direction:column;justify-content:center;align-items:center;height:100%}.skills-container .skills-h2{font-family:"Roboto";margin-top:7.2rem;font-size:3.6rem;line-height:4.2rem}.skills-container ul{margin-top:3.2rem;display:flex;flex-direction:row;width:60%;justify-content:space-between;margin-bottom:7.2rem}.skills-container ul .skills-item{font-family:"Roboto";font-weight:400;font-size:2.8rem;line-height:3.3rem;text-align:center}@media screen and (min-width:1600px){.skills-container ul{width:50%}.skills-container ul .skills-item{font-size:3.5rem}}@media screen and (max-width:1025px){.skills-container ul{width:85%}.skills-container .skills-item{font-size:3rem}}@media screen and (max-width:992px){.skills-container ul{width:90%}.skills-container .skills-item{font-size:2.6rem}}@media screen and (max-width:765px){.skills-container ul{width:95%}.skills-container ul .skills-item{font-size:2.4rem}}@media screen and (max-width:576px){.skills-container ul{flex-wrap:wrap;height:10rem;width:75%;justify-content:space-around}.skills-container ul .skills-item{font-size:2.6rem}}@media screen and (max-width:420px){.skills-container ul{flex-wrap:wrap;height:10rem;width:95%;justify-content:space-around}.skills-container ul .skills-item{font-size:2.6rem}}.test-div{display:flex;justify-content:center}.test-div .project-card-container{font-family:"Roboto";display:flex;flex-direction:column;width:75%;height:62rem;margin-bottom:12.2rem;background:#14131a;box-shadow:0 4px 4px rgba(0,0,0,.25);border-radius:0 0 8px 8px}.test-div .project-card-container:nth-of-type(3n){margin-bottom:0}.test-div .project-card-container .project-card-image{display:flex;justify-content:center;height:22rem;width:100%;margin-bottom:4.8rem}.test-div .project-card-container .project-card-image h2{align-self:center;font-size:6rem;color:#fff;position:absolute;z-index:10;text-shadow:2px 2px #14131a}@media screen and (max-width:992px){.test-div .project-card-container .project-card-image h2{font-size:5rem}}@media screen and (max-width:420px){.test-div .project-card-container .project-card-image h2{font-size:3rem}}.test-div .project-card-container .project-card-image img{width:100%;height:100%;object-fit:cover;position:relative;opacity:.65}.test-div .project-card-container .project-card-text{color:#fff;margin-bottom:4.8rem;margin-left:4%}.test-div .project-card-container .project-card-text h3{font-size:2.4rem;line-height:2.8rem;margin-bottom:.7rem}.test-div .project-card-container .project-card-text p{font-size:2.1rem;line-height:2.5rem}@media screen and (max-width:992px){.test-div .project-card-container .project-card-text p{font-size:2rem}}@media screen and (max-width:765px){.test-div .project-card-container .project-card-text p{font-size:1.8rem;width:95%}}.test-div .project-card-container .project-card-tech-stack{margin-left:4%;margin-bottom:4.8rem;color:#fff}.test-div .project-card-container .project-card-tech-stack h3{font-size:2.4rem;line-height:2.8rem;margin-bottom:.7rem}.test-div .project-card-container .project-card-tech-stack p{font-size:2.1rem;line-height:2.5rem}@media screen and (max-width:992px){.test-div .project-card-container .project-card-tech-stack p{font-size:2rem}}@media screen and (max-width:765px){.test-div .project-card-container .project-card-tech-stack p{font-size:1.8rem;width:95%}}.test-div .project-card-container .project-card-buttons{display:flex;justify-content:space-around}.test-div .project-card-container .project-card-buttons .button-primary{width:47.2rem;height:5.5rem;background:#3d758a;font-size:2.8rem;line-height:3.3rem;border:2px solid #3d758a;border-radius:.7rem;color:#fff}.test-div .project-card-container .project-card-buttons .button-primary:hover{border:2px solid #fff}.test-div .project-card-container .project-card-buttons .button-secondary{width:47.2rem;height:5.5rem;font-size:2.8rem;line-height:3.3rem;background:none;border:2px solid #f48769;border-radius:.7rem;color:#f48769}.test-div .project-card-container .project-card-buttons .button-secondary:hover{border:2px solid #fff}@media screen and (max-width:992px){.test-div .project-card-container .project-card-buttons .button-primary,.test-div .project-card-container .project-card-buttons .button-secondary{width:37rem}}@media screen and (max-width:765px){.test-div .project-card-container .project-card-buttons .button-primary,.test-div .project-card-container .project-card-buttons .button-secondary{width:30rem}}@media screen and (max-width:576px){.test-div .project-card-container .project-card-buttons .button-primary,.test-div .project-card-container .project-card-buttons .button-secondary{width:23rem}}@media screen and (max-width:420px){.test-div .project-card-container .project-card-buttons .button-primary,.test-div .project-card-container .project-card-buttons .button-secondary{width:15rem}}@media screen and (max-width:992px){.test-div .project-card-container{width:85%;min-height:70rem}}@media screen and (max-width:765px){.test-div .project-card-container{width:90%}}.projects-container{display:flex;flex-direction:column;align-items:center}.projects-container .projects-h2{font-size:3.6rem;line-height:4.2rem;margin-bottom:8.2rem}.projects-container .loading{justify-content:center;align-self:center;font-size:3.6rem}.pagination-nav{justify-content:center;width:50%;margin-bottom:13.2rem;margin-top:-7rem;justify-self:center}.pagination-nav .pagination{height:5rem;display:flex;flex-direction:row;width:100%;justify-content:center;position:relative;align-items:center}.pagination-nav .pagination .arrows{display:flex;position:absolute;font-size:4.5rem;width:20%;align-items:center;align-self:center;justify-content:space-between}.pagination-nav .pagination .arrows a{color:#000;text-decoration:none}.pagination-nav .pagination .arrows a:visited{color:#000}.pagination-nav .pagination .arrows a:hover{color:#f48769}.pagination-nav .pagination .arrows .disabled{pointer-events:none;cursor:default;color:#7b7b7b}.pagination-nav .pagination .arrows .disabled:visited{color:#7b7b7b}@media screen and (max-width:420px){.pagination-nav .pagination .arrows{width:100%}}.pagination-nav .pagination li div{width:.8rem;height:.8rem;border:1px solid #7b7b7b;border-radius:50%;background:#7b7b7b;margin:1rem}.pagination-nav .pagination li .active{width:1.2rem;height:1.2rem;border:2px solid #f48769;border-radius:50%;background:#000}.contact-container{display:flex;justify-content:center;align-items:center;flex-direction:column}.contact-container .contact-h2{font-size:3.6rem;line-height:4.2rem;margin-bottom:7.2rem}.contact-container .form-container{display:flex;flex-direction:column}.contact-container .form-container .form{color:#fff;display:flex;flex-direction:column}.contact-container .form-container .form .contact-error{font-size:1.6rem;color:#f48769;margin:-2rem 0 1rem;align-self:center}.contact-container .form-container .form .input-label{display:flex;flex-direction:column;font-size:2.4rem}.contact-container .form-container .form .input-label input{background:none;width:85.6rem;height:4.6rem;border:2px solid #3d758a;border-radius:.7rem;margin:.7rem 0 3.2rem;font-size:1.8rem;color:#fff;padding-left:1rem}.contact-container .form-container .form .input-label input::-webkit-input-placeholder{color:red;opacity:1}.contact-container .form-container .form .input-label input:-ms-input-placeholder{color:red;opacity:1}.contact-container .form-container .form .input-label input::-ms-input-placeholder{color:red;opacity:1}.contact-container .form-container .form .input-label input::placeholder{color:red;opacity:1}.contact-container .form-container .form .input-label input:focus{border:2px solid #f48769;border-radius:.7rem;outline:none}.contact-container .form-container .form .input-label .input-textarea{color:#fff;margin-top:.7rem;background:none;width:85.6rem;height:27.5rem;border:2px solid #3d758a;border-radius:.7rem;resize:none;font-size:1.8rem;padding-left:1rem;padding-top:1rem;font-family:"roboto"}.contact-container .form-container .form .input-label .input-textarea:focus{border:2px solid #f48769;border-radius:.7rem;outline:none}.contact-container .form-container .form .success-message{display:flex;justify-self:center;align-self:center;font-size:1.8rem}.contact-container .form-container .form .contact-disabled{margin-top:4.8rem;margin-bottom:13.2rem;height:5.5rem;background:#213e49;font-size:2.8rem;line-height:3.2rem;border-radius:.7rem;border:2px solid #213e49;color:hsla(0,0%,100%,.6313725490196078)}.contact-container .form-container .form .contact-disabled:hover{pointer-events:none}.contact-container .form-container .form .contact-button{margin-top:4.8rem;margin-bottom:13.2rem;height:5.5rem;background:#3d758a;font-size:2.8rem;line-height:3.2rem;border-radius:.7rem;border:2px solid #3d758a;color:#fff}.contact-container .form-container .form .contact-button:hover{border:2px solid #fff}@media screen and (max-width:765px){.contact-container .form-container{width:85%}.contact-container .form-container .form .input-label .input-textarea,.contact-container .form-container .form .input-label input{width:100%}}@media screen and (max-width:420px){.contact-container .form-container{width:95%}.contact-container .form-container .form .input-label .input-textarea,.contact-container .form-container .form .input-label input{width:100%}}.footer-container{margin-top:3rem;margin-bottom:4rem;display:flex;flex-direction:column;align-items:center}.footer-container p{color:#fff;font-size:1.8rem;line-height:2.5rem;margin-bottom:1rem}.footer-container p a{color:#3d758a}@font-face{font-family:"Roboto",sans-serif;src:url(https://fonts.googleapis.com/css2?display=swap&family=Roboto%3Awght%40100%3B300%3B400)}html{width:100%}body{background-color:#3a3943}.app{font-size:62.5%}
/*# sourceMappingURL=main.bc9e13d7.chunk.css.map */