#root{display:flex;flex-direction:column;align-items:center}html{height:100%;margin:0}body{line-height:1.5;letter-spacing:normal}header{display:flex;width:100%;height:2rem;justify-content:center;align-items:center;top:0;left:0;position:sticky;background-color:#fff;z-index:1}nav{display:flex;justify-content:space-between;align-items:center;width:66%}.logo{width:30px}.logo:hover{filter:drop-shadow(0 0 8px #7ED321);cursor:pointer}.nav-list{display:flex;column-gap:auto;list-style:none;width:40%;overflow:hidden;float:right}.nav-list>li{margin:auto}nav>ul>li>a{display:block;width:30%}nav>ul>li>a:hover{color:#7ed321;cursor:pointer}.nav-link{color:#000;font-weight:500}@media only screen and (max-width: 1350px){nav{width:100%;padding-inline:7%}.nav-list{width:50%}}@media only screen and (max-width: 650px){nav{width:100%;padding-inline:2%}.nav-list{width:70%}}.content{display:flex;width:66%;justify-content:center;gap:25px}.hero{display:flex;justify-content:center;align-items:center;width:66%;gap:100px;margin-top:130px}.hero ul{display:flex;flex-direction:column;gap:10px}.social{width:30px;height:30px}.social:hover{filter:drop-shadow(0 0 8px #7ED321);cursor:pointer}h1{font-size:2rem;font-weight:900}h3{font-size:1.4rem;line-height:10px;font-weight:600}p{font-size:1rem;font-weight:500;width:450px}.skills{box-shadow:0 0 4px gray;border-radius:8px;margin-top:150px;scroll-margin-top:80px}.skills>h2{margin-top:0}.skills__content{display:flex;flex-direction:column;align-items:center;row-gap:25px;margin:16px}.row{display:flex;flex-direction:row;flex:1;column-gap:35px}.skills img{width:50px;height:50px;column-gap:100px}.works{text-align:center;width:66%;margin:50px auto;padding-top:3rem}.works__content{display:flex;flex-wrap:wrap;justify-content:center}.card{width:500px;height:500px;margin:15px;border-radius:16px;display:flex;flex-direction:column;align-items:center;box-shadow:0 0 4px gray;position:relative}.card__content{padding:10px}img{object-fit:contain;width:90%;overflow:hidden}i{color:#fff;font-size:30px;margin:5px;text-align:center}.tags{display:flex;width:100%;align-items:center;justify-content:center;margin:10px 0;height:0}.links{display:flex;justify-content:space-between;width:90%;margin-top:20px;position:absolute;bottom:10px}a{display:flex;line-height:25px;align-items:center;width:25px;text-decoration:none;text-transform:uppercase;color:#fff}p{text-align:left;font-weight:500;font-size:1rem}.link{background-color:#7ed321;width:100px;border-radius:8px;justify-content:center}#background{display:flex;flex-direction:column;align-items:center;width:60%;align-self:center;margin:150px 0;padding-top:3rem}.background__container{width:100%}.background__tabs{display:flex;justify-content:center;margin-bottom:2rem}.background__button{font-size:1.25rem;font-weight:500;color:gray;margin:0 1rem;cursor:pointer}.background__button:hover{color:#000}.background__icon{font-size:1.8rem;margin-right:.25rem}.background__active{color:#7ed321}.background__active:hover{color:#9cff33}.background__sections{display:grid;grid-template-columns:.5fr;justify-content:center;width:100%}.background__content{display:none;align-items:center;width:100%}.background__content-active{display:block;align-items:center;width:100%}.background__data{display:grid;grid-template-columns:1fr max-content 1fr;column-gap:1.5rem;text-align:left;line-height:1.2}.background__title{font-size:1.2rem;font-weight:500}.background__subtitle{display:inline-block;font-size:.813rem;margin-bottom:.5rem}.background__calendar{font-size:.813rem}.background__rounder{display:inline-block;width:13px;height:13px;background-color:#7ed321;border-radius:50%}.background__line{display:block;width:1px;height:100%;background-color:#7ed321;transform:translate(6px,-7px)}@media screen and (max-width: 992px){.background__container{margin-left:auto;margin-right:auto}}@media screen and (max-width: 768px){.background__container{margin-left:1.5rem;margin-right:1.5rem}}@media screen and (max-width: 576px){.background__sections{grid-template-columns:initial}.background__button{margin:0 .75rem}}@media screen and (max-width: 350px){.background__data{gap:.5rem}}footer{display:flex;flex-direction:column;width:100%;height:5%;margin-top:auto;align-items:center;justify-content:center;text-align:center}ul{list-style:none;display:flex;align-items:center;justify-content:center;text-align:center;gap:25px;padding:0}.envelope{width:100%}.envelope:hover{filter:drop-shadow(0 0 8px #7ED321);cursor:pointer}.linkedin{width:100%}.linkedin:hover{filter:drop-shadow(0 0 8px #7ED321);cursor:pointer}.github{width:100%}.github:hover{filter:drop-shadow(0 0 8px #7ED321);cursor:pointer}