#form {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 2rem;
  padding: 13px 20px;
}
body {
  display: flex;
  justify-content: center;
  align-items: center;
  background: #1b2845;
  font-family: "Courier New", Courier, monospace;
}
#Calculator {
  background: #335c81;
  background: radial-gradient(
    circle,
    rgba(39, 64, 96, 1) 0%,
    rgba(51, 92, 129, 1) 50%,
    rgba(27, 40, 69, 1) 100%
  );
  color: antiquewhite;
  border: 1px solid #65afff;
  border-radius: 20px;
  margin-top: 4%;
}
h2 {
  text-align: center;
  padding: 4px 6px;
  font-size: 30px;
  font-family: "Times New Roman", Times, serif;
}

#cal {
  border-radius: 30px;
  width: 20rem;
  padding: 12px 18px;
  align-self: center;
  margin-top: 2rem;
  background: #1b2845;
  border: #1b2845;
  color: aliceblue;
  font-size: 16px;
}
input {
  border-radius: 15x;
  padding: 6px 8px;

  background: transparent;
  font-size: 15px;
  color: aliceblue;
  border: 1px solid white;
}
input::placeholder {
  color: whitesmoke;
  font-size: 10px;
  text-align: start;
}
label {
  font-size: 18px;
}
#btns {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  gap: 2px;
}
#refresh {
  border-radius: 30px;
  width: 20rem;
  padding: 12px 18px;
  align-self: center;
  background: #1b2845;
  border: #1b2845;
  color: aliceblue;
  font-size: 16px;
}
input::placeholder {
  border: 1px solid #335c81;
}

@media screen and (min-width: 290px) and (max-width: 360px) {
  #Calculator {
    margin-top: 0;
  }

  #refresh,
  #cal {
    width: 54%;
  }
  input::placeholder {
    border: 1px solid #335c81;
  }
}
