style.css

*{
  
  font-size: large;
  font-family: 'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
  font-style: normal;
  
  padding: 0%;
  margin: 0rem;
}

main{
  min-height: 100vh;
  background: linear-gradient(to right top,blue,red);
  display: flex;                          /*make the content customisable */
  align-items: center;                    /*make the content centre vertically */
  justify-content:center;                 /*make the content center horizontally */
  
}
.body{
  background: white;
  min-height: 60vh;
  width: 60%;
  background: linear-gradient(to right bottom,
  rgba(0,30,40,0.45),
  rgba(2,2,2,0.5)
  );
  border-radius: 1rem;
  backdrop-filter: 3rem;                 /* blur effect */

}
h1{
  color: black;
  background-color: white;
   margin-top: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  
}

input{
  margin-top: 2rem;
  border-radius: 1rem;
  font-size: larger;
  font-style: italic;
}
button{
  margin-top: 2rem;
  border-radius: 1rem;
  font-style: oblique;
  position: relative;
  align-items: left;
}
p{
  padding: 2rem;
  color: azure;
  font-size: 50px;
}