#contact {
  display: flex;
  flex-direction: column;
  padding: 2rem;
  width: 100%;
  justify-self: center;
  align-self: center;
}

input,
textarea {
  all: unset;
  padding: 0.5rem;
  background: var(--primary);
  color: var(--bg);
}

#body {
  width: 100%;
  height: 20rem;
}

section#contact {
  display: flex;
  flex-wrap: wrap;
  margin-right: 7.5rem;
}
#contact form {
  max-width: 80rem;
  width: 100%;
  margin-inline: auto;
}
.special-btn {
  box-shadow: none;
  outline: 10px solid var(--bg, white);
  border-radius: 0.5rem;
  /* transform: translate(10%, 25%); */
  transform: translate(0%, 0%);
  width: 100%;
}
.special-btn:hover {
  box-shadow: none;
  outline: 10px solid var(--bg, white);
  border-radius: 0.5rem;
  /* transform: translate(10%, 25%) !important; */
  transform: translate(0%, 0%);
}
.special-btn:active {
  box-shadow: none;
  outline: 10px solid var(--bg, white);
  border-radius: 0.5rem;
  /* transform: translate(10%, 25%) !important; */
  transform: translate(0%, 0%);
}
input,
textarea {
  border-radius: 0.5rem;
}

#contact > .form_div {
  padding: bottom 3rem;

  position: relative;
  /* display: grid; */
  display: flex;
  flex-direction: column;
  gap: 1rem;
  /* grid-template-columns: 1fr 1fr; */
}

#contact input {
  width: 100%;
  height: 2rem;
  position: relative;
}
/* #contact > .form_div > .special-btn {
  position: absolute;
  right: 0;
  bottom: 0;
}

#contact > .form_div > div {
  position: relative;
  padding: 0.5rem;
}

#contact > .form_div > div input,
#contact > .form_div > div textarea {
  width: 100%;
  min-height: 4rem;
}

#contact > .form_div > div:nth-child(3) {
  grid-area: auto / auto / auto / span 2;
} */

#contact > .form_div > div > .label {
  position: absolute;
  left: 0;
  top: -1rem;
}
