/*
includes/form.css

Form styles for all devices

Author: Chris Brown

Modification:

202105101148: Created
202212141416: BTWS-41
*/



.form
{
  background-color: rgba(255, 255, 255, 0.5);
  border: 1px solid rgba(128, 128, 255, 0.5);
  max-width: 712px;
}


.formgroup
{
  display: flex;
}


.formrow
{
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
}


.formstatus
{
  display: flex;
  flex-direction: row;
  align-items: center;
  text-align: left;
  min-height: 24px;
}


.formnote
{
  font-size: 0.9em;
  font-style: italic;
  line-height: 1.2em;
  color: #4040A0;
}
.formnote b,
.formnote strong
{
  font-size: 1.0em;
  font-weight: bold;
}


.formwarning
{
  display: table;
  margin: 0 auto;
  background-color: rgba(255, 128, 128, 0.25);
  border: 1px solid #FF8080;
  color: #C00000;
}



.formbuttons,
.formbutton
{
  display: flex;
  flex-direction: row;
  align-items: center;
}
.formbuttons
{
  justify-content: flex-start;
}
.formbutton
{
  display: inline;
  justify-content: space-evenly;
  background-color: rgba(128, 128, 255, 0.25);
  border: 1px solid rgba(0, 0, 128, 0.25);
  padding: 0.25em;
  font-weight: bold;
  border: 1px solid #6060C0;
  color: #000040;
  text-align: center;
  background-image :    -moz-linear-gradient(rgba(200,200,255,0.5),rgba(100,100,255,0.5));
  background-image :     -ms-linear-gradient(rgba(200,200,255,0.5),rgba(100,100,255,0.5));
  background-image :      -o-linear-gradient(rgba(200,200,255,0.5),rgba(100,100,255,0.5));
  background-image : -webkit-linear-gradient(rgba(200,200,255,0.5),rgba(100,100,255,0.5));
  background-image :         linear-gradient(rgba(200,200,255,0.5),rgba(100,100,255,0.5));  
  -moz-border-radius: 0.3em;
  -webkit-border-radius: 0.3em;
  border-radius: 0.3em;
}
.formbutton:hover
{
  background-color: rgba(128, 128, 255, 0.75);
}
.formbutton_disabled
{
  background-color: rgba(224, 224, 224, 0.75);
  border: 1px solid #808080;
  color: #404040;
  background-image : none;
}
.formbutton,
.formbutton_disabled
{
  margin: 0;
  padding: 0.5em;
  cursor: pointer;
}



input[type="text"],
input[type="password"],
input[type="number"],
input[type="file"],
input[type="checkbox"],
input[type="button"],
input[type="submit"],
input[type="date"],
input[type="month"],
input[type="tel"],
input[type="email"],
select,
textarea,
div.radio_selector
{
  -moz-border-radius: 0.3em;
  -webkit-border-radius: 0.3em;
  border-radius: 0.3em;
}
input[type="text"],
input[type="password"],
input[type="number"],
input[type="file"],
input[type="checkbox"],
input[type="button"],
input[type="submit"],
input[type="date"],
input[type="month"],
input[type="tel"],
input[type="email"],
select,
textarea
{
  background-color: rgba(128, 128, 255, 0.25);
  border: 1px solid rgba(0, 0, 128, 0.25);
}
input[type="text"],
input[type="password"],
input[type="number"],
input[type="file"],
input[type="date"],
input[type="month"],
input[type="email"],
input[type="tel"]
{
  line-height: 1.5em;
  height: 1.5em;
  padding-left: 0.3em;
}
select
{
  padding-left: 0;
  height: 1.5em;
}
input[type="button"],
input[type="submit"]
{
  padding: 0.5em;
  font-weight: bold;
  border: 1px solid #6060C0;
  color: #000040;
  background-image :    -moz-linear-gradient(rgba(200,200,255,0.5),rgba(100,100,255,0.5));
  background-image :     -ms-linear-gradient(rgba(200,200,255,0.5),rgba(100,100,255,0.5));
  background-image :      -o-linear-gradient(rgba(200,200,255,0.5),rgba(100,100,255,0.5));
  background-image : -webkit-linear-gradient(rgba(200,200,255,0.5),rgba(100,100,255,0.5));
  background-image :         linear-gradient(rgba(200,200,255,0.5),rgba(100,100,255,0.5));
}
input[type="button"]:hover,
input[type="submit"]:hover,
input[type="button"]:active,
input[type="submit"]:active
{
  background-color: rgba(128, 128, 255, 0.75);
}
input[type="text"][disabled],
input[type="email"][disabled],
input[type="number"][disabled],
input[type="tel"][disabled],
input[type="button"][disabled],
input[type="submit"][disabled]
{
  background-color: rgba(224, 224, 224, 0.75);
  border: 1px solid #808080;
  color: #404040;
}
input[type="button"][disabled],
input[type="submit"][disabled]
{
  background-image : none;
}