/*Roboto*/
@import url("https://fonts.googleapis.com/css2?family=Comfortaa:wght@300..700&family=Edu+AU+VIC+WA+NT+Hand&family=Montserrat:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap");
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  /* color: #fffce1; */
  font-family: "Roboto";
}

body {
  height: 100vh;
  width: 100vw;
  /* background-color: black; */
  background-image: url("https://plus.unsplash.com/premium_photo-1682309667112-971fb0622b55?q=80&w=1824&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D");
  background-size: cover;
  background-repeat: no-repeat;
  display: flex;
  justify-content: center;
  align-items: center;
}
form {
  backdrop-filter: blur(5px);
  background-color: #ffffff39;
  display: flex;
  flex-direction: column;
  padding: 2vw 4vw;
  width: 90%;
  max-width: 600px;
  border-radius: 10px;
  /* box-shadow: rgba(238, 237, 237, 0.948) 0px 5px 15px; */
}
form h1 {
  margin-bottom: 20px;
  /* color: #fff; */
  margin-left: 3.3vw;
}
form input,
form textarea {
  border: 0;
  margin: 10px 0;
  padding: 20px;
  outline: none;
  background-color: #f5f5f5;
  font-size: 16px;
  border-radius: 1.1vw;
}
form button {
  padding: 2vh 0vw;
  color: #fff;
  font-size: 3vh;
  border-radius: 1.1vw;
  width: 150px;
  margin-left: 9.5vw;
  border: none;
  background-color: #ff5361;
  &:hover {
    cursor: pointer;
    background-color: #ff5361c4;
  }
}