@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@700&family=Rubik:wght@700&display=swap');

body {
  text-align:center;
  height: 100%;
  width: 100%;
  background-image: url(https://images.unsplash.com/photo-1637952112301-6090dca83ccb?ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%253D%253D);
}

h1 {
  padding-top: 3%;
  padding-right: 20%;
  padding-left: 20%;
  font-family: 'Rubik', sans-serif;
  color: white;
}

h2, p {
  padding-right: 20%;
  padding-left: 20%;
  font-family: 'Poppins', sans-serif;
  color: white;
}

.formbackground {
  border-radius: 8px;
  background: hsl(0, 0%, 37%, .5);
  margin: 5%;
}

.description {
  padding-bottom: 3%
}

.credit {
  padding-bottom: 1%
}

.textbox {
  border-radius: 8px;
  margin: 0 auto;
  width: 60%;
  height: 5%;
  background: hsl(0, 0%, 0%, .5);
  border: 1px solid #0a0a23;
  color: #ffffff;
  font-size: 95%
  padding: 5%;
  font-family: 'Poppins', sans-serif;
}

label {
  font-size: 1.5em;
  padding-right: 20%;
  padding-left: 20%;
  font-family: 'Poppins', sans-serif;
  color: white;
}

fieldset {
  border: none;
  padding: 2rem 0;
}

button {
  height: 5%;
  width: 60%;
  background-color: white;
  color: black;
  border-radius: 8px;
  border: black 1px;
  width: 60%;
  height: 5%;
}