body{
/* background-color:white; */
background-image: url(https://www.hunarcourses.com/blog/wp-content/uploads/2020/01/title-image-5.jpg);
background-size: cover;
background-repeat: no-repeat;
}

h1{
  text-align: center;
  color: #6b0652;

}
form{
  /* height: 50vh; */
  background-color: white;
  width: 50%;
  margin-left: 25%;
  border:2px solid black;
  margin-top: 1%;
  border-top-right-radius: 40px;
  border-top-left-radius: 40px;
 
}

input[type=text], input[type=password] {
    width: 95%;
    padding: 15px;
    margin: 5px 0 22px 0;
    display: inline-block;
    border: none;
    background: #f1f1f1;
  }
  
  input[type=text]:focus, input[type=password]:focus {
    background-color: #ddd;
    outline: none;
  }
  
  hr {
    border: 1px solid #f1f1f1;
    margin-bottom: 25px;
  }
  
  /* Set a style for all buttons */
  button {
    background-color: #04AA6D;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    cursor: pointer;
    width: 100%;
    opacity: 0.9;
  }
  
  button:hover {
    opacity:1;
  }
  
  /* Extra styles for the cancel button */
  .cancelbtn {
    padding: 14px 20px;
    background-color: #f44336;
  }
  
  /* Float cancel and signup buttons and add an equal width */
  .cancelbtn, .signupbtn {
    float: left;
    width: 50%;
  }
  
  /* Add padding to container elements */
  .container {
    padding: 16px;
  }
  
  /* Clear floats */
  .clearfix::after {
    content: "";
    clear: both;
    display: table;
  }
  


  @media(max-width:1040px){
    button{
      width: 17%;
    }
  }
  @media(max-width:800px){
    button{
      width: 24%;
    }
  }
  
  
  @media(max-width:550px){
    button {
      background-color: #04AA6D;
      color: white;
      padding: 14px 20px;
      margin: 8px 0;
      border: none;
      cursor: pointer;
      width: 100%;
    }
    form{
      width: 100%;
      margin-left: 0%;
      margin-top:0%;
    }
  }