:root {
  --about-font-size: clamp(0.2rem, 2vw + 1vh, 5rem);
}
.about-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  /* width: 80%; */
  margin: auto;
  z-index: 1;
}

.about-card {
  border: 2px solid #2afd00;
  border-radius: calc(1vh + 2vw);
  padding: 2vh 2vw 1vh 2vw;
  width: clamp(20%, 50%, 90%);
  height: auto;
  box-shadow: 0 0 calc(var(--about-font-size) * 0.5)
    calc(var(--about-font-size) * 0.2) #2afd0044;
  animation: fadeIn 1s cubic-bezier(0.68, -0.55, 0.27, 1.55);
  text-align: center;
}

.about-card h2 {
  display: inline-block;
  color: #e74c3c;
  font-size: clamp(1.5rem, 3vw + 1vh, 4rem);
  padding: 0 1.5vw 1vh 1.5vw;
  margin: 2dvh 0 2dvh 0;
  width: auto;
  border-radius: calc(0.8vh + 1.6vw);
  border: #2afd00 1px solid;
}

.abttxt1 {
  color: #38cd54;
  font-size: calc(1vw + 0.5vh);
  padding: 0 2vw 0 3vw;
  text-align: justify;
  width: auto;
}
.abttxt2 {
  color: #38cd54;
  font-size: calc(0.8vw + 0.5vh);
  padding: 0 2vw 0 3vw;
  text-align: center;
  width: auto;
}
@keyframes fadeIn {
  from {
    opacity: 0;
    transform: scale(0.1);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}