*,:after,:before{margin:0;padding:0;box-sizing:inherit}#app,body,html{height:100%;scroll-behavior:smooth}body{box-sizing:border-box;overflow-x:hidden}.light-section{background-color:#f0f0f0;color:#222}.light-section a{color:#747474}.dark-section{background-color:#222;color:#f0f0f0}.dark-section a{color:#747474}.dark-bg{background-color:#1d1f21}#app,body,html{font-family:Kanit,sans-serif;font-weight:400;color:#f0f0f0}h1,h2,h3{font-family:Saira,sans-serif}h2,h3{text-transform:uppercase;color:#747474}h2{font-size:1.5rem}h3{font-size:1.1rem}a{text-transform:uppercase;color:#747474}a:hover{cursor:pointer;text-decoration:none;color:#884da7}.section-header{text-decoration:underline;-webkit-text-decoration-color:#884da7;text-decoration-color:#884da7;text-decoration-thickness:.375rem;padding-bottom:2rem}p{font-family:Kanit,sans-serif;font-weight:300;font-size:x-small}#greeting{font-family:Saira,sans-serif;font-weight:700;letter-spacing:.2rem;color:#884da7;font-size:1.2rem}.nav-item{font-family:Kanit,sans-serif;text-transform:uppercase;font-weight:600;font-size:.8rem}.banner-text,.nav-item{color:#f0f0f0}.banner-text .display-text{font-size:6rem}.banner-text #typewriter{font-size:2.4rem;color:inherit;text-transform:none}.footer{font-size:.8rem}section{min-height:100%;width:100%;background-size:cover;text-align:center;position:relative;padding:1rem}section .container-fluid{padding:1rem;margin:4rem auto}section .container-fluid .flex-col{padding:2rem}section .list-group-item{background-color:inherit}.filters a{padding:2rem}.filters .filter{margin:0 auto}.filters .active{color:#884da7}header{position:relative;height:100%;width:100%;background:no-repeat 50% fixed;background-image:linear-gradient(to right bottom,rgba(34,34,34,.2),rgba(34,34,34,.2)),url(../img/background.1e80f2ac.png);background-size:cover;-webkit-background-size:cover;text-align:center}header a:link{color:#f0f0f0}header .navbar-brand{font-size:1.8rem;letter-spacing:-.2rem}header #FirstName{color:#f0f0f0}header #LastName{color:#884da7}header #Logo{max-height:4rem}header .active-nav a{color:#884da7!important}header .banner{display:inline-block;vertical-align:middle;margin:auto;width:85%;padding-bottom:2rem;text-align:center;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}header .arrow-icon i{color:#f0f0f0}header .arrow-icon i:hover{color:#884da7}.footer{background-color:#1d1f21;padding:1rem}.footer a i:link{color:#f0f0f0}.footer a i:hover{color:#884da7}.footer #username{text-transform:lowercase}.footer #username a:link{color:#f0f0f0}.footer #username a:hover{color:#884da7}.footer .social-item i{font-size:1.5rem;padding:0 2rem}#about .profile-pic{max-width:100%;max-height:300px;border-radius:50%;box-shadow:0 4px 8px 0 rgba(0,0,0,.2),0 6px 20px 0 rgba(0,0,0,.19)}#about .tagline{font-size:1.5rem}#about #about-content{text-align:justify;font-size:1rem}#skills #skill-container{margin:2rem auto;padding:0;max-width:600px}#skills #skill-container .skill-content{margin-top:1rem}#portfolio .container-fluid{margin:4rem auto}#portfolio .portfolio-item{box-shadow:4px 8px 0 rgba(0,0,0,.2),0 6px 20px 0 rgba(0,0,0,.19);position:relative}#portfolio .portfolio-item a{text-decoration:none}#portfolio .portfolio-item h3{font-size:1.2rem}#portfolio .portfolio-item img{width:100%;display:block}#portfolio .portfolio-item .overlay{position:absolute;padding:inherit;top:0;bottom:0;width:100%;opacity:0;transition:.5s ease;background-color:#222;text-align:center}#portfolio .portfolio-item .overlay .portfolio-item-content{position:absolute;width:100%;top:0;bottom:0;overflow:hidden;color:#f0f0f0;padding:2rem;margin:0 auto;vertical-align:middle;text-align:center}#portfolio .portfolio-item:hover .overlay{opacity:.95;cursor:pointer}#contact .social-item{padding:0 .5rem}#contact ul{margin-top:2rem}#contact .contact-content{padding:2rem}.btn,.btn-resume,.btn-submit,.btn-success{background-color:#884da7;border-color:transparent;color:#f0f0f0}.btn-resume:hover,.btn-submit:hover,.btn-success:hover,.btn:hover{background-color:#785e2f;color:#e3e3e3}.contact-form{margin-top:2rem}.contact-form button{width:100%}.skillbars{display:flex;flex-direction:column;align-self:center;justify-content:center;align-items:center}.skill{margin:.8rem 0;position:relative;width:80%}.skill-name{font-size:.8em;letter-spacing:.145em;text-transform:uppercase}.inner-bar,.outer-bar{height:.75em}.outer-bar{margin-top:1em;background:#333}.inner-bar{animation:fillBar 1s forwards;transform:scaleX(0);transform-origin:0 0}[class*=level--]{background:#f12711;background:linear-gradient(90deg,#f5ba19,#f12711)}[class$="100"]{width:100%}[class$="90"]{width:90%}[class$="80"]{width:80%}[class$="70"]{width:70%}[class$="60"]{width:60%}[class$="50"]{width:50%}[class$="40"]{width:40%}[class$="30"]{width:30%}[class$="20"]{width:20%}[class$="10"]{width:10%}@keyframes fillBar{to{transform:scaleX(1)}}.arrow-container{position:absolute;bottom:0;left:0;right:0;width:100%;margin:0;text-align:center}.arrow-container .arrow-icon{margin:auto}.arrow-container .arrow-icon a{color:#f0f0f0}