/*****************************************************************************
 * LoginRegisterPro
 * 
 * Form and field styles for ProcessWire Inputfield forms 
 * 
 */
.LoginRegisterPro .Inputfield {
  clear: both;
  box-sizing: border-box; }
  .LoginRegisterPro .Inputfield:not(.InputfieldSubmit) {
    margin: 1% 0;
    padding: 20px;
    border: 1px solid #eee;
    background: #eee; }
  .LoginRegisterPro .Inputfield input[type=text],
  .LoginRegisterPro .Inputfield input[type=email] {
    width: 100%; }
  .LoginRegisterPro .Inputfield .detail {
    font-size: smaller; }
  .LoginRegisterPro .Inputfield span.detail {
    opacity: 0.8; }
.LoginRegisterPro .InputfieldHeader {
  /* field labels */
  font-weight: bold; }
.LoginRegisterPro .InputfieldColumnWidth {
  /* columns that are not 100% width */
  float: left;
  clear: none; }
  .LoginRegisterPro .InputfieldColumnWidth:not(.InputfieldColumnWidthFirst) {
    /* any column except first, in a row of Inputfield columns */
    margin-left: 1%; }
.LoginRegisterPro .InputfieldColumnWidthFirst {
  /* first column in a row of Inputfield columns */
  clear: both; }
.LoginRegisterPro .InputfieldPassword input {
  /* password input */
  width: 50%; }
.LoginRegisterPro .InputfieldStateRequired > .InputfieldHeader:first-child:after {
  /* Add asterisk to indicate field is required */
  content: ' *';
  color: red; }

.InputfieldForm .InputfieldHeader.InputfieldHeaderHidden,
.InputfieldForm .InputfieldHeaderHidden > .InputfieldHeader,
.InputfieldForm .InputfieldStateHidden {
  display: none; }

/************************************************************************
 * Notices (aka notifications)
 * 
 */
.LoginRegisterNotice {
  /* class common to header notifications */
  font-weight: bold;
  padding: 10px 20px;
  border: 1px solid #ccc; }

.LoginRegisterMessage {
  /* message or success notification */
  color: green;
  border-color: green; }

.LoginRegisterError {
  /* error notifications (both Notice and inline) */
  color: red;
  border-color: red; }

/************************************************************************
 * Collapse column widths at mobile breakpoint 
 * 
 * This is an example. 
 * Uncomment or copy/paste to another stylesheet to enable
 * 

@media only screen and (max-width: 767px) {
	.LoginRegisterPro .InputfieldForm .Inputfield {
		clear: both;
		margin: 5px 0;
		margin-left: 0 !important;
		width: 100% !important; // override inline width 
	}
	.LoginRegisterPro .InputfieldForm .InputfieldSubmit {
		padding-top: 5px;
	}
}
*/