@import"https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css";@import"https://fonts.googleapis.com/css2?family=Jost:wght@300;400;500;600;700&display=swap";*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;color:#6c757d;font-family:Jost,sans-serif}body span.highlight{color:#607d8b}h1,h2,h3,h4,h5,h6{color:#343a40;font-family:Jost,sans-serif}header{width:100%;padding:1rem;background-color:#607d8b;position:sticky;top:0;left:0;z-index:99}header nav .portrait{text-align:center;display:none}header nav .portrait img{width:100%;max-width:160px;border-radius:100%;border:6px solid rgba(255,255,255,.3)}header nav ul{display:flex;justify-content:flex-end;list-style:none}header nav ul li{margin-left:1rem}header nav ul li a{color:#fff;font-size:1rem;font-family:Jost,sans-serif;font-weight:700;text-decoration:none;opacity:.5;letter-spacing:1.5px}header nav ul li a:hover{opacity:.9}main{width:100%}main section{display:flex;flex-direction:column;justify-content:center;width:100%;min-height:100vh;padding:5rem 1rem 0;border-bottom:1px solid #f3f4f5}main section .section-heading{font-size:3rem;color:#343a40;text-transform:uppercase;margin-bottom:3rem}main section#welcome-section h1 div:first-child{font-size:2.5rem;font-weight:500;line-height:.5}main section#welcome-section h1 div:last-child{color:#343a40;font-size:4.5rem}main section#welcome-section .info{font-weight:600;font-size:1.3rem;text-transform:uppercase}main section#welcome-section p{font-size:1.3rem;margin:2rem 0 1rem}main section#welcome-section .contacts a{width:3rem;height:3rem;display:inline-flex;justify-content:center;align-items:center;color:#fff;background-color:#343a40;font-size:1.5rem;text-decoration:none;border-radius:100%;margin-right:.5rem}main section#welcome-section .contacts a:hover{color:#607d8b}main section#experience .experience{margin-bottom:2.5rem}main section#experience .experience h2{font-size:2rem}main section#experience .experience h3{font-size:1.5rem;color:#6c757d}main section#experience .experience div{color:#607d8b;font-size:1.2rem;font-weight:600;margin-bottom:1rem}main section#experience .experience p{font-size:1.3rem}main section#skills h2{font-size:2rem;color:#6c757d}main section#skills .icons{margin:.5rem 0 2rem}main section#skills .icons i{cursor:pointer;margin-right:1rem;font-size:3rem}main section#skills .icons i.fa-html5:hover{color:#e9633c}main section#skills .icons i.fa-css3-alt:hover{color:#2862e9}main section#skills .icons i.fa-js:hover{color:#f1d43b}main section#skills .icons i.fa-react:hover{color:#49b7e8}main section#skills .icons i.fa-angular:hover{color:#c30e2e}main section#skills .icons i.fa-bootstrap:hover{color:#533b78}main section#skills .icons i.fa-sass:hover{color:#c85e93}main section#skills .icons img{margin-right:.5rem}main section#skills ul{list-style:square}main section#skills ul li{font-size:1.3rem;margin-left:2rem}main section#projects .project{margin-bottom:2.5rem}main section#projects .project h2{font-size:2rem;margin-bottom:1.2rem}main section#projects .project h3{font-size:1.5rem;color:#6c757d}main section#projects .project div{color:#607d8b;font-size:1.2rem;font-weight:600;margin-bottom:1rem}main section#projects .project p{font-size:1.3rem;margin-bottom:.8rem}@media screen and (min-width: 480px){main section#projects .project-container{grid-template-columns:repeat(2,1fr)}}@media screen and (min-width: 568px){main section#experience .experience{display:grid;grid-template-columns:auto auto}main section#experience .experience h2{grid-column:1/span 2;grid-row:1/span 1;line-height:1}main section#experience .experience h3{grid-column:1/span 2;margin-bottom:.5rem}main section#experience .experience div{grid-column:2/span 1;grid-row:1/span 1}main section#experience .experience p{grid-column:1/span 2}}@media screen and (min-width: 720px){main section#projects .project-container{grid-template-columns:repeat(3,1fr)}}@media screen and (min-width: 1024px){app-root{display:grid;grid-template-columns:auto auto}header{height:100%;max-height:100vh}header nav{width:15vw;max-width:300px;height:100%;display:flex;flex-direction:column;justify-content:center}header nav .portrait{display:block}header nav ul{flex-direction:column;align-items:center;justify-content:center}header nav ul li{margin:.6rem 0}header nav ul li a{font-size:1.5rem}main section{padding:0 3rem}main section#experience .experience{display:grid;grid-template-columns:auto auto}main section#experience .experience h2{grid-column:1/span 2;grid-row:1/span 1;line-height:1}main section#experience .experience h3{grid-column:1/span 2;margin-bottom:.5rem}main section#experience .experience div{grid-column:2/span 1;grid-row:1/span 1}}@media screen and (min-width: 1240px){main section#projects .project-container{grid-template-columns:repeat(4,1fr)}}