html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}html{scroll-behavior:smooth}body{line-height:1;font-family:var(--mainFont)}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}body{margin:0 2rem;background-color:var(--backgroundColor)}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}:root{--blue: #12cbe4;--grey: #a7a7a7;--lightgrey: #cfcfcf;--backgroundColor: #353535;--mainFont: "Roboto";--altFont: "Quantico"}@keyframes animate{0%{opacity:0;transform:translateY(30vh)}to{opacity:1;transform:translateY(0)}}@keyframes headerAnimate{0%{opacity:0;transform:translateY(-30vh)}to{opacity:1;transform:translateY(0)}}.about{padding-top:7rem}.about h1{font-size:clamp(22px,5vw,28px);font-weight:600;margin-bottom:1rem;color:var(--lightgrey)}.about h1:after{width:25%;max-width:490px;height:1px;background:#444;content:"";margin-left:1rem;display:inline-block;vertical-align:middle;background-color:var(--blue)}.about h1 span{font-family:var(--altFont);font-size:clamp(18px,5vw,22px);font-weight:100;color:var(--blue)}.aboutArticle{color:var(--grey);font-size:18px;display:flex;line-height:1.6}.aboutArticle p{margin-right:1rem}.aboutArticle p span{color:var(--blue)}.aboutArticle img{margin-top:10px;width:295px;height:384px}.aboutArticle .imgWrap{width:295px;height:384px}.aboutFlex{display:flex;flex-direction:column}.about ul{display:grid;grid-template-columns:repeat(2,minmax(140px,200px));gap:0px 10px;padding:0;margin:20px 0px 3.5rem;overflow:hidden;list-style:none}.about li{position:relative;z-index:1;margin-bottom:10px px;padding-left:20px;font-size:18px;color:var(--grey)}.about li:before{content:"-";position:absolute;left:0;font-size:15px;color:var(--blue)}.flexAbout{display:flex;flex-direction:column}.aboutArticle{opacity:0;transition:opacity 2s ease,transform .7s ease;transform:translateY(200px)}.aboutArticle.show{opacity:1;transform:translateY(0)}@media (max-width: 914px){.aboutArticle{flex-direction:column}.about .imgWrap{margin:0 auto}}.introduction{margin-top:15rem;margin-bottom:14rem}.introduction h1{font-family:var(--altFont);color:var(--blue);font-size:clamp(16px,3vw,20px);font-weight:100;line-height:1;animation:animate .9s cubic-bezier(.2,.6,.2,1);animation-fill-mode:forwards}.introduction h2{font-size:clamp(36px,8vw,70px);font-weight:600;color:var(--lightgrey);line-height:1.8;animation:animate .9s cubic-bezier(.2,.6,.2,1);animation-fill-mode:forwards;animation-delay:.2s;opacity:0}.introduction h3{font-size:clamp(36px,8vw,70px);font-weight:600;color:#a7a7a7;line-height:1;animation:animate .9s cubic-bezier(.2,.6,.2,1);animation-fill-mode:forwards;animation-delay:.4s;opacity:0}.introduction p{color:#a7a7a7;font-size:18px;font-weight:400;margin-top:1rem;line-height:1.5;animation:animate .9s cubic-bezier(.2,.6,.2,1);animation-fill-mode:forwards;animation-delay:.6s;opacity:0}.introduction p span{color:var(--blue)}.introduction button{background:none;border:1px solid var(--blue);color:var(--blue);border-radius:4px;padding:.9rem 2.2rem;margin-top:3rem;font-family:var(--altFont);font-size:15px;transition:.3s;cursor:pointer;animation:animate .9s cubic-bezier(.2,.6,.2,1);animation-fill-mode:forwards;animation-delay:.8s;opacity:0}.introduction button:nth-child(1){margin-right:1rem}.introduction button:hover{background-color:var(--blue);color:#181818}.competence{margin-top:7rem}.competence h1{font-size:clamp(22px,5vw,28px);font-weight:600;margin-bottom:1rem;color:var(--lightgrey)}.competence h1:after{width:25%;max-width:490px;height:1px;background:#444;content:"";margin-left:1rem;display:inline-block;vertical-align:middle;background-color:var(--blue)}.flexCompetence{display:flex;flex-direction:column}.competence h1 span{font-family:var(--altFont);font-size:clamp(18px,5vw,22px);font-weight:100;color:var(--blue)}.competence-list{display:flex;flex-wrap:wrap;justify-content:center;gap:20px}.competence-item{flex:1 1 300px;display:flex;flex-direction:column;justify-content:space-between;padding:15px;border-radius:6px;box-shadow:0 1px 3px #0000001a}.competence-item:hover{box-shadow:0 4px 8px #0003;transition:box-shadow .3s ease;background-color:#242424}.competence-item h3{margin-bottom:10px;color:#dadada}.competence ul{display:grid;gap:0px 10px;padding:0;margin:20px 0;overflow:hidden;list-style:none}.competence li{position:relative;z-index:1;margin-bottom:10px px;padding-left:20px;font-size:18px;color:var(--grey)}.competence li:before{content:"-";position:absolute;left:0;font-size:15px;color:var(--blue)}@media (max-width: 914px){.competence{margin-top:200px}.competence-list{flex-direction:column}.competence-item{flex:1 1 100%}}.workItem{width:350px;border:transparent 1px solid;flex-wrap:wrap;border-radius:3px;margin:1rem;padding:1.5rem 1.3rem;transition:.3s ease-in-out}.workItem:hover{background-color:#242424}.workItem h2{color:var(--lightgrey);font-size:22px;font-weight:600;margin-bottom:.5rem}.workItem p{font-size:15px;line-height:1.5;color:var(--grey);margin-bottom:1.1rem}.workItem button{color:var(--blue);background:none;padding:.5rem 1.6rem;font-size:14px;font-weight:500;font-family:var(--mainFont);border-radius:4px;cursor:pointer;transition:.3s;border:var(--blue) solid 2px}.workItem button:hover{background-color:var(--blue);color:#242424}.link{text-decoration:none}.workItem ul{color:var(--blue);margin-top:1rem;display:flex;gap:9px;flex-wrap:wrap}.workItem li{font-weight:500;background-color:#1b232d;line-height:1.25rem;padding:.25rem .75rem;border-radius:9999px;font-size:14px;transition:.3s ease-in-out}.workItem li:hover{background-color:var(--blue);color:#1b232d}@media (max-width: 914px){.workItem{margin:0}}.myProjects{padding-top:6rem}.myProjects h1{font-size:clamp(22px,5vw,28px);font-weight:600;margin-bottom:2rem;color:var(--lightgrey)}.myProjects h1:after{width:25%;max-width:490px;height:1px;background:#444;content:"";margin-left:1rem;display:inline-block;vertical-align:middle;background-color:var(--blue)}.myProjects h1 span{font-family:var(--altFont);font-size:clamp(18px,5vw,22px);font-weight:100;color:var(--blue)}.workItems{display:flex;flex-wrap:wrap;justify-content:center}.myProjects{opacity:0;transition:opacity 2s ease,transform .7s ease;transform:translateY(200px)}.myProjects.show{opacity:1;transform:translateY(0)}header{position:fixed;top:0;background-color:var(--backgroundColor);z-index:10;width:100%}.navHeader{box-shadow:0 10px 30px -10px #0004;display:flex;justify-content:space-between;align-items:center;padding:1.25rem 4rem;margin-left:-2rem;animation:headerAnimate .9s cubic-bezier(.2,.6,.2,1);animation-fill-mode:forwards;animation-delay:.8s;opacity:0}.navHeader img{width:42px}.navHeader ul{list-style:none;display:flex;gap:2rem}.navHeader a{font-size:14px;text-decoration:none;color:var(--lightgrey);transition:.3s}.navHeader a:hover{color:var(--blue)}.navHeader ul span{font-family:var(--altFont);color:var(--blue)}.navHeader .burgerMenu{display:none}@media (max-width: 580px){header{margin-left:-2rem}.navHeader{padding-right:2rem}.navHeader ul{display:none}.menuMobile{height:100vh;display:flex;justify-content:center;text-align:center;align-items:center;margin-top:-4rem}.menuMobile ul li a{font-size:1.2rem;font-family:var(--altFont);color:var(--lightgrey);text-decoration:none}.menuMobile ul li{margin-bottom:3rem}.menuMobile span{color:var(--blue)}.navHeader .burgerMenu{display:flex;flex-direction:column}.navHeader .burgerMenu span{margin-bottom:4px;align-self:flex-end;height:2px;margin-top:.2rem;transition:.3s}.navHeader .burgerMenu span:nth-child(1){background-color:var(--blue);width:36px}.navHeader .burgerMenu span:nth-child(2){background-color:var(--lightgrey);width:30px}.navHeader .burgerMenu span:nth-child(3){background-color:var(--blue);width:24px}.burgerMenu.cross span:nth-child(1){transform:rotate(45deg) translate(5px,5px);width:30px}.burgerMenu.cross span:nth-child(2){opacity:0;transform:translate(-30px)}.burgerMenu.cross span:nth-child(3){transform:rotate(-45deg) translate(8px,-8px);width:30px}}.contact{color:var(--lightgrey);margin:4rem -2rem 3rem;display:flex;flex-direction:column;align-items:center;font-size:20px;border-top:2px solid #222222;padding-top:3rem}.contact h1{font-size:clamp(22px,5vw,28px);margin-bottom:1rem;font-weight:600}.contact ul{display:flex;margin-top:2rem}.contact li{list-style-type:none;font-size:16px;margin:1rem}.contact a{color:var(--lightgrey);text-decoration:none;transition:.3s}.contact a:hover{color:var(--blue)}.contact li:before{content:"•";color:var(--blue);margin-right:.3rem}.contact li:nth-child(4):hover{color:var(--blue)}.contact p{font-size:16px;margin-top:1rem;text-align:center}@media (max-width: 704px){.contact ul{flex-wrap:wrap;justify-content:center}.contact p{font-size:14px;margin-top:1.5rem}}main{max-width:950px;margin:0 auto}*::selection{background-color:var(--blue);color:var(--backgroundColor)}.workPage{color:var(--lightgrey);margin-bottom:15vh}.workPage .tags{color:var(--blue);margin-top:1rem;display:flex;gap:9px;flex-wrap:wrap;margin-bottom:4rem;cursor:default}.workPage .tags li{font-weight:500;background-color:#1b232d;line-height:1.25rem;padding:.25rem .75rem;border-radius:9999px;font-size:14px;transition:.3s ease-in-out}.workPage .tags li:hover{background-color:var(--blue);color:#1b232d}.workPage a{text-decoration:none;cursor:pointer;color:var(--blue);font-weight:500;font-size:18px}.workPage h1{padding-top:25vh;font-size:clamp(36px,8vw,70px);font-weight:600;text-align:center;animation:animate .9s cubic-bezier(.2,.6,.2,1);animation-fill-mode:forwards}.workPage img{margin-top:10vh;width:100%;height:auto;border-radius:3px;animation:animate .9s cubic-bezier(.2,.6,.2,1);animation-delay:.3s;animation-fill-mode:forwards;opacity:0}.workPage h2,.workPage h3,.workPage h4{font-size:clamp(25px,4vw,50px);margin-top:10vh;font-weight:600}.workPage p{font-size:16px;margin-top:1rem;line-height:1.7}.backToPortfolio button{margin-top:3rem;cursor:pointer;background:var(--blue);color:var(--backgroundColor);padding:.5rem 1.6rem;font-size:14px;font-weight:500;font-family:var(--mainFont);border-radius:4px;transition:.3s;border:var(--blue) solid 2px}.backToPortfolio button:hover{background:var(--backgroundColor);color:var(--blue)}.linkWork{position:relative;display:inline-block;padding-bottom:3px;border:none;background-color:transparent;color:#000;text-decoration:none;overflow:hidden;margin-right:1.8rem}.linkWork:before{content:"";position:absolute;bottom:0;left:p0;width:0%;height:1px;background-color:var(--blue);transition:width .5s ease;transform-origin:left}.linkWork:hover:before{width:100%}@media (max-width: 914px){.github{margin-top:1rem}}