h2 {
  display: block;
  position: absolute;
  width: 100%;
  height: 4vh;
  text-align: center;
  top: 6vh;
}
form{
  display: flex;
  flex-direction: column;
  width: 15%;
  align-items: center;
  justify-content: center;
  top: 30vh;
  position: absolute;
}

button {
  background-color: rgba(255, 255, 255, 0.3);
  border-radius: 10px;
  color: white;
  font-size: 1.6em;
  border: none;
  font-family: 'Giarek', sans-serif;
  padding: 10px;
  mix-blend-mode: difference;
}

p{
  width: 100%;
  text-align: center;
  display: flex;
  flex-direction: column;
}

label{
  width: 100%;
  margin-bottom: 20px;
  font-size: 1.2em;
  font-weight: bolder;
}

input {
  width: 100%;
  height: 4vh;
  border-radius: 8px;
}

ul {
  width: 100%;
}

#content{
margin-top:4vh ;
}
@media screen and (max-width: 768px) {


  h2{
    font-size: 1.8em;
  }

  form{
    width: 60%;
    overflow-y: scroll;
  }

  form p {
    width: 95%;
  }

  form p input {
    background-color: rgba(255, 255, 255, 0.8);
    border: none;
  }

  form button {
    margin-top: 10vh;
    width: 40%;
  }

  #content{
    padding: 0;
  }


}