body, html {
  font-family: "Unbounded", sans-serif;
  padding: 0;
  margin: 0;
  color: #1D221C;
  min-height: 100vh;
  min-height: 100svh;
  background-color: #CFD5CD;
  font-size: 16px;
  cursor: crosshair;
}

ul {
  margin: 0;
  padding: 0;
}

li {
  padding: 0;
  margin: 0;
  list-style: none;
}

h1 {
  text-transform: capitalize;
  font-weight: 800;
}

a, a:hover {
  text-decoration: none;
  color: inherit;
}

.main {
  overflow: hidden;
  min-height: 100vh;
  min-height: 100svh;
  display: flex;
  text-shadow: 0 0 1.5px #1D221C;
}
.main--container {
  width: 100%;
  padding: 4rem;
  display: flex;
  flex-direction: column;
  align-content: center;
  justify-content: space-between;
}
@media (max-width: 768px) {
  .main--container {
    padding: 2rem;
  }
}

.bio {
  position: relative;
  padding-bottom: 8rem;
}
.bio--name {
  font-size: 2rem;
  font-weight: 400;
  line-height: 0.75;
  letter-spacing: -0.1rem;
  margin: 0;
  padding-inline-start: 0.5rem;
}
.bio--connect img {
  width: 28px;
  position: absolute;
  top: 0;
  right: 0;
  filter: blur(0.55px);
  animation: aniSPIN 5s linear infinite;
}

.skills {
  align-self: stretch;
  width: 100%;
}
.skills li {
  letter-spacing: -0.451rem;
  font-size: calc(1rem + 8vh);
}
.skills li span {
  display: none;
  font-size: calc(1rem + 8vh);
  transition: all 0.5s ease-in-out;
}
@media (max-width: 768px) {
  .skills li {
    font-size: 3rem;
    letter-spacing: -0.181rem;
  }
}
.skills--item {
  display: flex;
  transition: all ease-in-out;
  background-image: none;
  transition: all 0.5s ease-in-out;
  animation: aniBG 0.5s ease-in-out;
}
@media (min-width: 769px) {
  .skills--item {
    align-items: center;
  }
}
@media (max-width: 768px) {
  .skills--item {
    flex-direction: column-reverse;
  }
}
@media (hover: hover) {
  .skills--item:hover, .skills--item:active {
    background: #62F132;
    background: linear-gradient(113deg, #62F132 53.84%, #95FA73 92.79%);
    margin-block: 1rem;
    padding: 3.33% 3.33% 10%;
    transition: all 0.5s ease-in-out;
    animation: aniBG 0.5s ease-in-out;
    cursor: alias;
    border-radius: 3rem;
    gap: 3rem;
  }
  .skills--item:hover span, .skills--item:active span {
    transition: all 0.5s ease-in-out;
    display: block;
  }
}

.connect {
  min-height: 100vh;
  min-height: 100svh;
  background-color: #1D221C;
  color: #fff;
  text-shadow: 0 0 1.5px #fff;
  overflow: hidden;
  width: 100%;
  top: 0;
  right: 0;
  position: absolute;
  display: none;
  transition: all 0.5s ease-in-out;
}
.connect--inner {
  width: 100%;
  padding: 4rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}
@media (max-width: 768px) {
  .connect--inner {
    padding: 2rem;
  }
}
.connect--inner p {
  font-size: 2rem;
  padding-block-start: 2rem;
}
.connect--inner li {
  font-size: 1.5rem;
  padding-block: 1rem;
}
.connect--links {
  position: relative;
}
.connect--links img {
  width: 28px;
  position: absolute;
  top: 0;
  right: 0;
  filter: blur(0.55px);
  animation: aniSPIN 5s linear infinite;
}
.connect--links #showEmail {
  display: none;
  padding-top: 1rem;
}
.connect--links #showEmail .email-inner {
  padding: 2rem;
  background-color: #62F132;
  color: #1D221C;
  font-size: 1.34rem;
  border-radius: 2rem;
}

.footer {
  padding-top: 8rem;
  font-size: 0.75rem;
}

@keyframes aniBG {
  0% {
    background-position: 0;
  }
  100% {
    background-position: 100%;
  }
}
@keyframes aniSPIN {
  from {
    transform: rotate(0deg);
  }
  to {
    transform: rotate(360deg);
  }
}/*# sourceMappingURL=style.css.map */