input[type=text]
{
  width: 50%;
  padding: 5px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 30px;
  box-sizing: border-box;
  }
input[type=text]:focus {
  border: 3px solid #555;
  background-color: lightblue;
}

input[type=number]
{
  width: 50%;
  padding: 5px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 30px;
  box-sizing: border-box;
  }
input[type=number]:focus {
  border: 3px solid #555;
  background-color: lightblue;
}

select
{
  padding: 5px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 30px;
  box-sizing: border-box;
  }
select:focus {
  border: 3px solid #555;
  }

textarea {
  width: 50%;
  padding: 5px 20px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  border-radius: 30px;
  box-sizing: border-box;
  }
textarea:focus {
  border: 3px solid #555;
  background-color: lightblue;
}


table.formdata {
  background-color:#FFFF66;
  border-radius: 10px;
  padding: 10px;
; font-size: 9pt; font-family: "Courier New", Courier, mono
}

input[type=submit]:hover 
{ background-color: blue; } 
input[type=submit]
{ width: 30%; background-color: red; color: black; padding: 14px 20px; margin: 10px 0; border: none; border-radius: 
30px; cursor: pointer; }
input[type=reset]:hover 
{ background-color: blue; } 
input[type=reset]
{ width: 30%; background-color: red; color: black; padding: 14px 20px; margin: 10px 0; border: none; border-radius: 
30px; cursor: pointer; }
