.forms {
  display: grid;
  grid-template-columns: 1fr;
  row-gap: 2%;
}

.form-convert,
.form-convert-currency {
  padding: 0 16px;
}

h4 {
  font-size: 24px;
  margin-bottom: 6px;
  margin-top: -8px;
}

.form-convert-content {
  padding: 30px;
  box-shadow: 0.5px 0.5px 20px var(--light-gray);
  border-radius: 4px;
  border-color: var(--main-color-one);
  display: grid;
  grid-template-columns: 2fr 2fr;
  row-gap: 2em;
  grid-column-gap: 2em;
}

.form-convert-content-currency {
  padding: 30px;
  box-shadow: 0.5px 0.5px 20px var(--light-gray);
  border-radius: 4px;
  border-color: var(--main-color-one);
}

.form-convert-content-currency-wrapper {
  display: grid;
  grid-template-columns: 2fr 2fr;
  row-gap: 2em;
  grid-column-gap: 2em;
}

.form-convert-currency-text {
  margin: -10px 0 10px 0;
  font-weight: 500;
  color: #690205;
  text-decoration: underline;
  text-shadow: 0.4px 0.4px 1px var(--main-color-one);
}

input,
select {
  border: solid;
  border-radius: 4px;
  border-color: var(--main-color-two);
  font-size: 16px;
  text-align: center;
}

output {
  font-size: 16px;
  text-align: center;
  color: #690205;
  font-weight: 700;
}

button {
  height: 32px;
  width: 200px;
  border-radius: 4px;
  border: none;
  color: var(--main-color-one);
  font-weight: 900;
  font-size: 20px;
  margin-left: 1em;
  transition: 0.1s linear;
}

.btn-check {
  background-color: #b8b8b8;
  box-shadow: 0.5px 0.5px 4px #908f8f;
}

.btn-buy {
  background-color: #fed8a2;
  box-shadow: 0.5px 0.5px 4px #a5804c;
}

.btn-check:hover {
  background-color: var(--main-color-one);
  color: #fff;
}

.btn-buy:hover {
  background-color: #664f2e;
  color: #fff;
}

button:active {
  transform: scale(0.94);
}