styles.css

:root {
  --color-white: #f3f3f3;
  --color-darkblue: #1b1b32;
  --color-darkblue-alpha: rgba(27, 27, 50, 0.8);
  --color-green: #37af65;
}



body {
  font-family: 'Poppins', sans-serif;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.4;
  color: var(--color-white);
  margin: 0;
  text-align: center;


  background: var(--color-darkblue);
  background-image: linear-gradient(
      115deg,
      rgba(58, 58, 158, 0.8),
      rgba(136, 136, 206, 0.7)
    ),
    url(https://cdn.freecodecamp.org/testable-projects-fcc/images/survey-form-background.jpeg);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-attachment: fixed;
  z-index: -1;
}

h1 {
  font-weight: 400;
  line-height: 1.2;
  padding-top: 1em;

  margin: 0;
}

p {
  font-size: 1.125rem;
  padding-top: 0.5em;
  padding-bottom: 1em
}


p {
  margin-top: 0;
  margin-bottom: 0.5rem;
}

.form{
  background-color: var(--color-darkblue-alpha);
  width: 50%;
  position: relative;
  left: 25%;
  text-align: left;
  border-radius: 5px;
}
.impo{
  position: relative;
  left: 4%;
  width: 80%;
  margin: 0;
  padding: 2%;
}
.question{
  margin: 0;
  padding: 0;
  border: 0;
}

.box{
  border-radius: 4px;
  width:60%;
}

.reset{
  position: relative;
  left: 50%;
  bottom:22px;
}
.boxm{
  border-radius: 4px;
  width:50%;
  background-color: var(--color-green);
cursor: pointer;
display: block;
}