styles.css

/* .container {
    justify-content: center;
    align-items: center;
    margin: auto;
    height: 0px;
    width: 340px;
    box-shadow: 6px 8px 2px grey;
    background: white;
    border-radius: 10px;
}

html, body {
    background-image: linear-gradient(to left, rgb(216, 39, 66), rgb(99, 199, 233));
    height:100%;
    padding:0;
    margin:0px;
    text-align: center;
    font-size: 22px;
    font-family:Verdana;
    letter-spacing:0px;
   } */


/*   
  .soj {
    max-width: 500px;
    margin: auto;
    background: white;
    padding: 10px;
  } */


  	   /* https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_js_dropdown_hover */

 body {
        background: url(img.jpg) no-repeat
        fixed center;
        font-family: Verdana;
        font-size: 2rem; 
      }


   /* set the position of dropdown */
   .dropdown {
       position: relative;
       display: inline-block;
   }
   /* set the size and position of button on web */
   .buttonD {
       padding: 0.09rem;
       font-family: monospace;
       display: block;
       font-size: 3rem; 
   }
   /* provide css to background of list items */
   #list-items {
      display: none;
      position: absolute;
      background-color: white;
      min-width: 185px;
      z-index: 1;
   }
   /* provide css to list items */ 
   #list-items a {
       display: block;
       font-size: 18px;
       background-color: #ddd;
       color: black;
       text-decoration: none;
       padding: 10px;
   }
 
   /* .con1 {
    font-size: 1px;
   } */

   /* body{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 10px;
    min-height: 100vh;
    background: #5372F0;
  } */


  /* Styling the Form (Color, Padding, Shadow) */
  form {
    min-height: 20vh;
    background-color: #fff;
    max-width: 200px;
    margin: 50px auto;
    padding: 8px 50px;
    box-shadow: 2px 5px 10px rgba(0, 0, 0, 0.5);
  }

  /* Styling form-control Class */
  .form-control {
    text-align: left;
    margin-bottom: 25px;
  }

  /* Styling form-control Label */
  .form-control label {
    display: block;
    margin-bottom: 10px;
  }

  /* Styling form-control input,
  select, textarea */
  .form-control input,
  .form-control select,
  .form-control textarea {
    border: 1px solid #777;
    border-radius: 2px;
    font-family: inherit;
    padding: 10px;
    display: block;
    width: 95%;
    font-size: 2rem; 
  }

  /* Styling form-control Radio
  button and Checkbox */
  .form-control input[type="radio"],
  .form-control input[type="checkbox"] {
    display: inline-block;
    width: auto;
  }

  /* Styling Button */
  button {
    background-color: #db3c81;
    border: 1px solid rgb(242, 34, 34);
    border-radius: 8px;
    font-family: inherit;
    font-size: 21px;
    display: block;
    width: 100%;
    margin-top: 50px;
    margin-bottom: 20px;
    font-size: 2.4rem; 
  }



  .form-control-inputB input
 {
    background-color: #05c46b;
    border: 1px solid rgb(252, 242, 242);
    border-radius: 8px;
    font-family: inherit;
    padding: 10px;
    display: block;
    width: 40%;
    margin-left: 30%;
}